@mk-kit/ui 0.34.1 → 0.36.0

package/fesm2022/mk-kit-ui.mjs

@@ -14,6 +14,7 @@ export * from '@mk-kit/ui/feedback';
 export * from '@mk-kit/ui/rich-text';
 export * from '@mk-kit/ui/block-editor';
 export * from '@mk-kit/ui/context-menu';
+export * from '@mk-kit/ui/layout';
 export * from '@mk-kit/ui/media';
 
 /*

package/fesm2022/mk-kit-ui.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"mk-kit-ui.mjs","sources":["../../../projects/mk-kit/src/public-api.ts","../../../projects/mk-kit/src/mk-kit-ui.ts"],"sourcesContent":["/*\n * Public API Surface of @mk-kit/ui.\n *\n * The library ships Material-style secondary entry points — import from the\n * group entries (`@mk-kit/ui/forms`, `@mk-kit/ui/table`, …) so a code-split\n * app only carries the groups each chunk uses. This root entry re-exports\n * everything for convenience; importing it eagerly pulls all groups into the\n * importing chunk.\n */\nexport * from '@mk-kit/ui/core';\nexport * from '@mk-kit/ui/icon';\nexport * from '@mk-kit/ui/chip';\nexport * from '@mk-kit/ui/checkbox';\nexport * from '@mk-kit/ui/button';\nexport * from '@mk-kit/ui/directives';\nexport * from '@mk-kit/ui/dnd';\nexport * from '@mk-kit/ui/navigation';\nexport * from '@mk-kit/ui/forms';\nexport * from '@mk-kit/ui/datetime';\nexport * from '@mk-kit/ui/table';\nexport * from '@mk-kit/ui/data';\nexport * from '@mk-kit/ui/feedback';\nexport * from '@mk-kit/ui/rich-text';\nexport * from '@mk-kit/ui/block-editor';\nexport * from '@mk-kit/ui/context-menu';\nexport * from '@mk-kit/ui/media';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;AAQG;;ACRH;;AAEG"}
+{"version":3,"file":"mk-kit-ui.mjs","sources":["../../../projects/mk-kit/src/public-api.ts","../../../projects/mk-kit/src/mk-kit-ui.ts"],"sourcesContent":["/*\n * Public API Surface of @mk-kit/ui.\n *\n * The library ships Material-style secondary entry points — import from the\n * group entries (`@mk-kit/ui/forms`, `@mk-kit/ui/table`, …) so a code-split\n * app only carries the groups each chunk uses. This root entry re-exports\n * everything for convenience; importing it eagerly pulls all groups into the\n * importing chunk.\n */\nexport * from '@mk-kit/ui/core';\nexport * from '@mk-kit/ui/icon';\nexport * from '@mk-kit/ui/chip';\nexport * from '@mk-kit/ui/checkbox';\nexport * from '@mk-kit/ui/button';\nexport * from '@mk-kit/ui/directives';\nexport * from '@mk-kit/ui/dnd';\nexport * from '@mk-kit/ui/navigation';\nexport * from '@mk-kit/ui/forms';\nexport * from '@mk-kit/ui/datetime';\nexport * from '@mk-kit/ui/table';\nexport * from '@mk-kit/ui/data';\nexport * from '@mk-kit/ui/feedback';\nexport * from '@mk-kit/ui/rich-text';\nexport * from '@mk-kit/ui/block-editor';\nexport * from '@mk-kit/ui/context-menu';\nexport * from '@mk-kit/ui/layout';\nexport * from '@mk-kit/ui/media';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;AAQG;;ACRH;;AAEG"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mk-kit/ui",
-  "version": "0.34.1",
+  "version": "0.36.0",
   "publishConfig": {
     "access": "public"
   },
@@ -107,6 +107,10 @@
       "types": "./types/mk-kit-ui-icon.d.ts",
       "default": "./fesm2022/mk-kit-ui-icon.mjs"
     },
+    "./layout": {
+      "types": "./types/mk-kit-ui-layout.d.ts",
+      "default": "./fesm2022/mk-kit-ui-layout.mjs"
+    },
     "./media": {
       "types": "./types/mk-kit-ui-media.d.ts",
       "default": "./fesm2022/mk-kit-ui-media.mjs"

package/styles/mk-kit.css

@@ -381,6 +381,22 @@ body.mk-app {
   border: 0;
 }
 
+/* Print helpers: `.mk-print-hidden` drops page chrome (toolbars, filters)
+   from paper; `.mk-print-only` shows something (a title, a date) only there.
+   Components ship their own `@media print` rules — mk-table prints as one
+   unbroken sheet with repeating headers and no controls. */
+.mk-print-only {
+  display: none;
+}
+
+@media print {
+  .mk-print-hidden {
+    display: none !important;
+  }
+  .mk-print-only {
+    display: revert;
+  }
+}
 /* mk-drag-handle — the grip a pointer drag must start on. MkDragHandle is a
  * DIRECTIVE (so it composes onto any element, including other components'
  * hosts like mk-icon), and directives cannot carry styles — hence the global

package/types/mk-kit-ui-core.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { InjectionToken, ComponentRef, Injector, OnDestroy, Type, AfterViewInit, ElementRef, Provider, Signal } from '@angular/core';
+import { InjectionToken, OnDestroy, Signal, ComponentRef, Injector, Type, AfterViewInit, ElementRef, Provider } from '@angular/core';
 import { Observable } from 'rxjs';
 import { ValidationErrors } from '@angular/forms';
 
@@ -15,7 +15,7 @@ type MkThemePreference = 'light' | 'dark' | 'system';
 /** Concrete resolved theme (never `system`). */
 type MkResolvedTheme = 'light' | 'dark';
 /** Common placement values for overlays (menus, tooltips, popovers). */
-type MkPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'right';
+type MkPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
 
 /**
  * Global control-density mode.
@@ -84,6 +84,67 @@ declare class MkThemeService {
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<MkThemeService>;
 }
 
+/** Named viewport ranges, mobile-first: each starts at its min-width. */
+type MkBreakpoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+/** Min-widths (px) at which each named breakpoint begins; `xs` is everything below `sm`. */
+type MkBreakpoints = Record<Exclude<MkBreakpoint, 'xs'>, number>;
+/** The default scale (same numbers as Tailwind, so mental models transfer). */
+declare const MK_DEFAULT_BREAKPOINTS: MkBreakpoints;
+/** Override the breakpoint scale app-wide: `{ provide: MK_BREAKPOINTS, useValue: { …, lg: 1100 } }`. */
+declare const MK_BREAKPOINTS: InjectionToken<MkBreakpoints>;
+/**
+ * A value that may differ per breakpoint: either the plain value or a
+ * mobile-first map, `{ xs: 1, md: 2, xl: 4 }`, where each key applies from
+ * that breakpoint up until the next key given.
+ */
+type MkResponsive<T> = T | Partial<Record<MkBreakpoint, T>>;
+/** True when `value` is a per-breakpoint map rather than a plain value. */
+declare function mkIsResponsive<T>(value: MkResponsive<T>): value is Partial<Record<MkBreakpoint, T>>;
+/**
+ * Reactive viewport breakpoints, one `matchMedia` listener per step.
+ *
+ * ```ts
+ * private readonly bp = inject(MkBreakpointService);
+ * readonly compact = this.bp.down('md');          // Signal<boolean>
+ * readonly columns = computed(() => this.bp.resolve({ xs: 1, md: 2, xl: 4 }));
+ * ```
+ *
+ * On the server (no `window`) everything reports `xs`.
+ */
+declare class MkBreakpointService implements OnDestroy {
+    /** The breakpoint scale in effect (see {@link MK_BREAKPOINTS}). */
+    readonly breakpoints: MkBreakpoints;
+    private readonly document;
+    private readonly isBrowser;
+    /** `matches` per step, in scale order (`sm` first). */
+    private readonly steps;
+    private readonly cleanup;
+    private readonly queries;
+    private readonly ups;
+    private readonly downs;
+    /** The widest breakpoint the viewport currently satisfies. */
+    readonly current: Signal<MkBreakpoint>;
+    constructor();
+    /** True while the viewport is at least `bp` wide (`up('md')` = md, lg, xl, 2xl). */
+    up(bp: MkBreakpoint): Signal<boolean>;
+    /** True while the viewport is narrower than `bp` (`down('md')` = xs, sm). */
+    down(bp: MkBreakpoint): Signal<boolean>;
+    /** True while the viewport is at least `from` and narrower than `to`. */
+    between(from: MkBreakpoint, to: MkBreakpoint): Signal<boolean>;
+    /** Any media query as a signal, e.g. `observe('(orientation: portrait)')`. */
+    observe(query: string): Signal<boolean>;
+    /**
+     * Pick the entry of a responsive value for the current viewport —
+     * mobile-first, so `{ xs: 1, md: 2 }` gives 1 on `sm` and 2 on `xl`.
+     * A plain value is returned as is. Read inside a `computed` to track it.
+     */
+    resolve<T>(value: MkResponsive<T>): T | undefined;
+    ngOnDestroy(): void;
+    private watch;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MkBreakpointService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<MkBreakpointService>;
+}
+
 type MkAriaLivePoliteness = 'polite' | 'assertive';
 /**
  * Announces messages to assistive technology via a visually-hidden
@@ -339,6 +400,12 @@ declare class MkAnchoredPanel implements AfterViewInit, OnDestroy {
     readonly flip: _angular_core.InputSignal<boolean>;
     /** Clamp the panel inside the viewport. */
     readonly clamp: _angular_core.InputSignal<boolean>;
+    /**
+     * Predicate consulted before an outside pointerdown dismisses the panel.
+     * Return `true` for targets that must keep it open — e.g. a nested panel
+     * (a submenu) that lives in the top layer outside this element.
+     */
+    readonly keepOpenWhen: _angular_core.InputSignal<((target: Node) => boolean) | null>;
     /** Emitted on an outside pointerdown or when the window loses focus. */
     readonly dismiss: _angular_core.OutputEmitterRef<void>;
     private popover;
@@ -371,7 +438,7 @@ declare class MkAnchoredPanel implements AfterViewInit, OnDestroy {
     private resolveAnchorRect;
     ngOnDestroy(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<MkAnchoredPanel, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MkAnchoredPanel, "[mkAnchoredPanel]", ["mkAnchoredPanel"], { "anchor": { "alias": "mkAnchoredPanelFor"; "required": false; "isSignal": true; }; "anchorRect": { "alias": "anchorRect"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "matchWidth": { "alias": "matchWidth"; "required": false; "isSignal": true; }; "flip": { "alias": "flip"; "required": false; "isSignal": true; }; "clamp": { "alias": "clamp"; "required": false; "isSignal": true; }; }, { "dismiss": "dismiss"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MkAnchoredPanel, "[mkAnchoredPanel]", ["mkAnchoredPanel"], { "anchor": { "alias": "mkAnchoredPanelFor"; "required": false; "isSignal": true; }; "anchorRect": { "alias": "anchorRect"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "matchWidth": { "alias": "matchWidth"; "required": false; "isSignal": true; }; "flip": { "alias": "flip"; "required": false; "isSignal": true; }; "clamp": { "alias": "clamp"; "required": false; "isSignal": true; }; "keepOpenWhen": { "alias": "keepOpenWhen"; "required": false; "isSignal": true; }; }, { "dismiss": "dismiss"; }, never, never, true, never>;
 }
 
 /** Direction passed to the sort announcer. */
@@ -740,6 +807,16 @@ interface MkI18nStrings {
     chooseWeek: string;
     openCalendar: string;
     openTimeList: string;
+    /** Accessible name of the chevron segment of `mk-split-button`. */
+    moreActions: string;
+    /** Placeholder of `mk-datetime-picker`. */
+    selectDateTime: string;
+    /** Dialog label of the `mk-datetime-picker` panel. */
+    chooseDateTime: string;
+    /** Listbox label of the time list inside `mk-datetime-picker`. */
+    chooseTime: string;
+    /** Toggle-button label of `mk-datetime-picker`. */
+    openDateTimePicker: string;
     /** Mini-date segment names. */
     daySegment: string;
     monthSegment: string;
@@ -764,6 +841,9 @@ interface MkI18nStrings {
     /** Row expander toggle labels. */
     expandRow: string;
     collapseRow: string;
+    /** Tree-row toggle labels (`childrenKey`). */
+    expandTreeRow: string;
+    collapseTreeRow: string;
     /** aria-label of a group header's toggle when the group is collapsed. */
     expandGroup: string;
     /** aria-label of a group header's toggle when the group is expanded. */
@@ -1101,5 +1181,5 @@ type MkErrorMessages = Readonly<Record<string, string | ((err: any) => string)>>
  */
 declare function mkFirstErrorMessage(errors: ValidationErrors | null | undefined, strings: MkValidationStrings, overrides?: MkErrorMessages): string | null;
 
-export { MK_DEFAULT_DATE_NAMES, MK_DEFAULT_I18N, MK_DEFAULT_VALIDATION, MK_I18N, MK_OVERLAY_DATA, MkAnchoredPanel, MkFieldContext, MkFocusTrap, MkLiveAnnouncer, MkOverlayRef, MkOverlayService, MkThemeService, mkComputeAnchoredPosition, mkFirstErrorMessage, mkGetFocusable, mkHighlight, mkHighlightJson, mkUniqueId, mkValidatorChange, provideMkI18n };
-export type { MkAnchoredPosition, MkAnchoredPositionOptions, MkAriaLivePoliteness, MkBlockEditorStrings, MkCodeLanguage, MkDateNames, MkDensity, MkErrorMessages, MkI18nStrings, MkOverlayConfig, MkPlacement, MkResolvedTheme, MkSize$1 as MkSize, MkSortAnnounceDirection, MkThemePreference, MkTone, MkValidationStrings, MkValidatorChangeRef, MkVariant };
+export { MK_BREAKPOINTS, MK_DEFAULT_BREAKPOINTS, MK_DEFAULT_DATE_NAMES, MK_DEFAULT_I18N, MK_DEFAULT_VALIDATION, MK_I18N, MK_OVERLAY_DATA, MkAnchoredPanel, MkBreakpointService, MkFieldContext, MkFocusTrap, MkLiveAnnouncer, MkOverlayRef, MkOverlayService, MkThemeService, mkComputeAnchoredPosition, mkFirstErrorMessage, mkGetFocusable, mkHighlight, mkHighlightJson, mkIsResponsive, mkUniqueId, mkValidatorChange, provideMkI18n };
+export type { MkAnchoredPosition, MkAnchoredPositionOptions, MkAriaLivePoliteness, MkBlockEditorStrings, MkBreakpoint, MkBreakpoints, MkCodeLanguage, MkDateNames, MkDensity, MkErrorMessages, MkI18nStrings, MkOverlayConfig, MkPlacement, MkResolvedTheme, MkResponsive, MkSize$1 as MkSize, MkSortAnnounceDirection, MkThemePreference, MkTone, MkValidationStrings, MkValidatorChangeRef, MkVariant };

package/types/mk-kit-ui-datetime.d.ts

@@ -53,9 +53,11 @@ declare function parseISODate(value: string | null | undefined): Date | null;
 /**
  * Format `date` using a small pattern set. Supported tokens:
  * `yyyy` (4-digit year), `MMMM` (full month), `MMM` (short month),
- * `MM` (2-digit month), `dd` (2-digit day), `d` (day), `ddd` (short weekday).
- * Longer tokens are matched first so `MMMM` wins over `MM`.
- * Month/weekday names come from `names` when given, else English.
+ * `MM` (2-digit month), `dd` (2-digit day), `d` (day), `ddd` (short weekday),
+ * `HH` / `H` (24-hour, padded / bare), `hh` / `h` (12-hour, padded / bare),
+ * `mm` (2-digit minutes) and `a` (`AM` / `PM`). Longer tokens are matched
+ * first so `MMMM` wins over `MM`. Month/weekday names come from `names` when
+ * given, else English.
  */
 declare function formatDate(date: Date, pattern: string, names?: MkDateNames): string;
 /**
@@ -313,7 +315,7 @@ declare class MkDatePicker implements ControlValueAccessor, Validator {
 }
 
 /** A selectable time option. */
-interface MkTimeOption {
+interface MkTimeOption$1 {
     /** Canonical `HH:mm` (24h) value. */
     value: string;
     /** Display label (respects `hour12`). */
@@ -401,7 +403,7 @@ declare class MkTimePicker implements ControlValueAccessor, Validator {
     protected readonly describedBy: _angular_core.Signal<string | null>;
     protected readonly showClear: _angular_core.Signal<boolean>;
     /** Generated, min/max-filtered list of selectable times. */
-    protected readonly options: _angular_core.Signal<MkTimeOption[]>;
+    protected readonly options: _angular_core.Signal<MkTimeOption$1[]>;
     protected readonly selectedIndex: _angular_core.Signal<number>;
     constructor();
     protected optionId(index: number): string;
@@ -454,6 +456,161 @@ declare class MkTimePicker implements ControlValueAccessor, Validator {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<MkTimePicker, "mk-time-picker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "valueFormat": { "alias": "valueFormat"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "hour12": { "alias": "hour12"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
 }
 
+/** A selectable time-of-day option in the panel's list. */
+interface MkTimeOption {
+    /** Minutes since midnight. */
+    minutes: number;
+    /** Display label (respects `hour12`). */
+    label: string;
+    /** Stable id for `aria-activedescendant`. */
+    id: string;
+}
+/**
+ * DateTimePicker — one field for a date **and** a time of day. The panel pairs
+ * an `mk-calendar` with a time list generated from `step`; the value is a
+ * single `Date` carrying both parts in local time (seconds and milliseconds
+ * zeroed). Implements `ControlValueAccessor` and a two-way `value` model, so it
+ * works with `[(ngModel)]`, reactive forms and `[(value)]`.
+ *
+ * Interaction: picking a day keeps the panel open and — when a value already
+ * exists — moves that value to the new day, preserving its time; picking a
+ * time commits and closes. With no value yet, the day is held until a time is
+ * chosen (so a half-picked datetime is never emitted). Typing also works:
+ * `2026-08-26 14:30`, `2026-08-26T09:05`, `Aug 26, 2026 2:30 pm` and a bare
+ * ISO date (→ midnight) are parsed on Enter/blur.
+ *
+ * `min` / `max` bound the whole instant at minute precision: the calendar
+ * greys out days outside the range and the time list hides times outside it
+ * on the boundary days. Validation reports `mkMinDate` / `mkMaxDate`.
+ *
+ * When nested in an `mk-form-field` it adopts the field's id and aria wiring.
+ *
+ * ```html
+ * <mk-datetime-picker [(value)]="startsAt" [step]="15" [min]="now" clearable />
+ * <mk-datetime-picker [(value)]="startsAt" hour12 />
+ * ```
+ */
+declare class MkDateTimePicker implements ControlValueAccessor, Validator {
+    protected readonly i18n: _mk_kit_ui_core.MkI18nStrings;
+    private readonly field;
+    private readonly host;
+    private readonly injector;
+    private readonly inputRef;
+    /** The panel — lives in the top layer once opened. */
+    private readonly panelRef;
+    private readonly timesRef;
+    /** Two-way selected date-time (local; seconds and ms are zero). */
+    readonly value: _angular_core.ModelSignal<Date | null>;
+    /** Earliest selectable instant (inclusive, minute precision). */
+    readonly min: _angular_core.InputSignal<Date | null>;
+    /** Latest selectable instant (inclusive, minute precision). */
+    readonly max: _angular_core.InputSignal<Date | null>;
+    /** Predicate marking individual days as disabled (threaded to the calendar). */
+    readonly disabledDate: _angular_core.InputSignal<((d: Date) => boolean) | null>;
+    /** Placeholder shown when empty. */
+    readonly placeholder: _angular_core.InputSignal<string>;
+    /**
+     * Pattern used to render the value in the field. Defaults to
+     * `'MMM d, yyyy HH:mm'`, or `'MMM d, yyyy h:mm a'` when `hour12` is set.
+     */
+    readonly displayFormat: _angular_core.InputSignal<string | null>;
+    /** Interval between generated time options, in minutes. */
+    readonly step: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** Display 12-hour times with AM/PM (the model is a `Date` either way). */
+    readonly hour12: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Disable the control. */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Show a clear button when a value is selected. */
+    readonly clearable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Force invalid styling + `aria-invalid`. */
+    readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** First column of the calendar week (0 = Sunday). */
+    readonly firstDayOfWeek: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** Control size. Ignored when nested in an `mk-form-field`. */
+    readonly size: _angular_core.InputSignal<MkSize>;
+    protected readonly open: _angular_core.WritableSignal<boolean>;
+    /** Editable text mirror of the field. */
+    protected readonly inputText: _angular_core.WritableSignal<string>;
+    /** Keyboard-active option in the time list (index into `options`). */
+    protected readonly activeIndex: _angular_core.WritableSignal<number>;
+    /** Day picked in the calendar while there is no value yet. */
+    private readonly pendingDay;
+    private readonly cvaDisabled;
+    private onChange;
+    private onTouched;
+    readonly inputId: string;
+    readonly panelId: string;
+    readonly listId: string;
+    protected readonly effectiveSize: _angular_core.Signal<MkSize>;
+    protected readonly isDisabled: _angular_core.Signal<boolean>;
+    protected readonly isInvalid: _angular_core.Signal<boolean>;
+    protected readonly isRequired: _angular_core.Signal<boolean>;
+    protected readonly describedBy: _angular_core.Signal<string | null>;
+    protected readonly showClear: _angular_core.Signal<boolean>;
+    protected readonly effectiveFormat: _angular_core.Signal<string>;
+    /** The day the calendar shows as selected: the value's day, else the pending one. */
+    protected readonly calendarValue: _angular_core.Signal<Date | null>;
+    /** Day-granular bounds for the calendar (inclusive). */
+    protected readonly calendarMin: _angular_core.Signal<Date | null>;
+    protected readonly calendarMax: _angular_core.Signal<Date | null>;
+    /**
+     * Generated time options. On the `min` / `max` boundary day the list only
+     * offers times inside the bound; on other days every step is listed.
+     */
+    protected readonly options: _angular_core.Signal<MkTimeOption[]>;
+    protected readonly selectedIndex: _angular_core.Signal<number>;
+    constructor();
+    private displayTime;
+    /**
+     * Accepts `YYYY-MM-DD[ T]HH:mm[ am|pm]`, a bare ISO date (→ midnight), any
+     * `Date.parse`-able date followed by a time, or a full `Date.parse`-able
+     * string. Seconds are dropped.
+     */
+    private parse;
+    private clamp;
+    protected toggle(): void;
+    protected openPanel(): void;
+    protected close(): void;
+    /** Index of the first option at or after `d`'s time of day (for the initial highlight). */
+    private nearestIndex;
+    protected onCalendarPick(day: Date | null): void;
+    protected selectTime(index: number): void;
+    protected onListKeydown(event: Event): void;
+    private moveActive;
+    private scrollActiveIntoView;
+    protected onInput(event: Event): void;
+    protected onInputKeydown(event: Event): void;
+    protected clear(): void;
+    private commitInput;
+    private setValue;
+    protected onFocusOut(event: Event): void;
+    /**
+     * Escape pressed inside the (teleported) panel — close and return focus to
+     * the input. `preventDefault` + `stopPropagation` keep any outer Escape
+     * handling (e.g. a containing dialog) from also firing.
+     */
+    protected onPanelEscape(event: Event): void;
+    /**
+     * Focus left the teleported panel. The host `(focusout)` never sees this —
+     * the panel lives under `document.body` — so Tab-out is handled here: close
+     * unless focus moved back into the field or stayed inside the panel.
+     */
+    protected onPanelFocusout(event: FocusEvent): void;
+    writeValue(value: Date | null): void;
+    registerOnChange(fn: (value: Date | null) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    private readonly validatorChange;
+    /**
+     * Reports `mkMinDate` / `mkMaxDate` against the `[min]` and `[max]` inputs,
+     * comparing whole instants at minute precision.
+     */
+    validate(control: AbstractControl): ValidationErrors | null;
+    registerOnValidatorChange(fn: () => void): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MkDateTimePicker, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MkDateTimePicker, "mk-datetime-picker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "disabledDate": { "alias": "disabledDate"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "displayFormat": { "alias": "displayFormat"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "hour12": { "alias": "hour12"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+}
+
 /** A selected date range. Either endpoint may be `null` while incomplete. */
 interface MkDateRange {
     start: Date | null;
@@ -1167,5 +1324,5 @@ declare class MkMiniDate implements ControlValueAccessor, Validator {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<MkMiniDate, "mk-mini-date", ["mkMiniDate"], { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "order": { "alias": "order"; "required": false; "isSignal": true; }; "yearMin": { "alias": "yearMin"; "required": false; "isSignal": true; }; "yearMax": { "alias": "yearMax"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
 }
 
-export { MkCalendar, MkDatePicker, MkDateRangePicker, MkEventCalendar, MkMiniDate, MkMonthPicker, MkTimePicker, MkWeekPicker, addDays, addMonths, buildMonthMatrix, clampDate, endOfMonth, endOfWeek, formatDate, formatISODate, getISOWeek, getMonthNames, getWeekdayFullName, getWeekdayNames, isAfter, isBefore, isSameDay, isSameMonth, parseISODate, startOfDay, startOfMonth, startOfWeek };
+export { MkCalendar, MkDatePicker, MkDateRangePicker, MkDateTimePicker, MkEventCalendar, MkMiniDate, MkMonthPicker, MkTimePicker, MkWeekPicker, addDays, addMonths, buildMonthMatrix, clampDate, endOfMonth, endOfWeek, formatDate, formatISODate, getISOWeek, getMonthNames, getWeekdayFullName, getWeekdayNames, isAfter, isBefore, isSameDay, isSameMonth, parseISODate, startOfDay, startOfMonth, startOfWeek };
 export type { MkCalendarEvent, MkCalendarEventEdit, MkCalendarView, MkDateRange, MkMiniDateOrder, MkMonthPickerMode, MkWeek, MkWeekday };

package/types/mk-kit-ui-icon.d.ts

@@ -37,7 +37,8 @@ declare class MkIcon {
 
 /**
  * IconRegistry — the name → SVG store behind `<mk-icon name="…">`. The built-in
- * {@link MK_DEFAULT_ICONS} set is registered on construction; add your own SVGs
+ * sets — the hand-made {@link MK_DEFAULT_ICONS} and the Lucide-derived
+ * {@link MK_EXTENDED_ICONS} — are registered on construction; add your own SVGs
  * (from a sprite, a design export, anything) with {@link register} /
  * {@link registerIcons}.
  *
@@ -105,4 +106,7 @@ declare const MK_MATERIAL_ICON_ALIASES: Readonly<Record<string, string>>;
  */
 declare function provideMkMaterialIcons(): EnvironmentProviders;
 
-export { MK_DEFAULT_ICONS, MK_MATERIAL_ICON_ALIASES, MkIcon, MkIconRegistry, provideMkMaterialIcons };
+/** Name → SVG markup map of the Lucide-derived icons registered by default. */
+declare const MK_EXTENDED_ICONS: Readonly<Record<string, string>>;
+
+export { MK_DEFAULT_ICONS, MK_EXTENDED_ICONS, MK_MATERIAL_ICON_ALIASES, MkIcon, MkIconRegistry, provideMkMaterialIcons };