@koobiq/components 19.8.1 → 20.0.0

package/icon/index.d.ts

@@ -1 +1,162 @@
-export * from './public-api';
+import * as i0 from '@angular/core';
+import { AfterContentInit, OnChanges, ElementRef, ChangeDetectorRef, DestroyRef, SimpleChanges, AfterViewInit, OnDestroy, InjectionToken, Provider } from '@angular/core';
+import { FocusMonitor } from '@angular/cdk/a11y';
+import * as _koobiq_components_core from '@koobiq/components/core';
+import { KbqColorDirective } from '@koobiq/components/core';
+import { Observable, ReplaySubject } from 'rxjs';
+import { SafeResourceUrl, SafeHtml } from '@angular/platform-browser';
+
+interface KbqIconOptions {
+    viewBox?: string;
+    withCredentials?: boolean;
+}
+declare class KbqIconRegistry {
+    private readonly sanitizer;
+    private readonly document;
+    private readonly httpClient;
+    private readonly iconsConfig;
+    private readonly resolvers;
+    /** Individual icon configs, keyed by "namespace:name". */
+    private readonly iconConfigs;
+    /** Icon-set configs per namespace. */
+    private readonly iconSetConfigs;
+    /** In-progress URL fetches to dedupe concurrent requests. */
+    private readonly inProgressUrlFetches;
+    /** Cached parsed SVG sets, keyed by URL string. */
+    private readonly cachedIconSets;
+    constructor();
+    /** Registers an SVG icon by URL in the default namespace. */
+    addSvgIcon(name: string, url: SafeResourceUrl, options?: KbqIconOptions): void;
+    /** Registers an SVG icon from an inline HTML string in the default namespace. */
+    addSvgIconLiteral(name: string, literal: SafeHtml, options?: KbqIconOptions): void;
+    /** Registers an SVG icon by URL under the given namespace. */
+    addSvgIconInNamespace(namespace: string, name: string, url: SafeResourceUrl, options?: KbqIconOptions): void;
+    /** Registers an SVG icon from an inline HTML string under the given namespace. */
+    addSvgIconLiteralInNamespace(namespace: string, name: string, literal: SafeHtml, options?: KbqIconOptions): void;
+    /** Registers an SVG sprite file in the default namespace. Icons are looked up by their `symbol id`. */
+    addSvgIconSet(url: SafeResourceUrl, options?: KbqIconOptions): void;
+    /** Registers an SVG sprite file under the given namespace. Duplicate URLs are silently ignored. */
+    addSvgIconSetInNamespace(namespace: string, url: SafeResourceUrl, options?: KbqIconOptions): void;
+    /**
+     * Emits a cloned SVGElement for the given name.
+     * Accepts "namespace:name" syntax.
+     */
+    getNamedSvgIcon(name: string, namespace?: string): Observable<SVGElement>;
+    private cacheIcon;
+    private loadIcon;
+    private registerIconSet;
+    private loadIconFromSets;
+    private loadIconSet;
+    private extractIconFromSet;
+    private svgElementFromText;
+    private fetchUrl;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqIconRegistry, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<KbqIconRegistry>;
+}
+
+declare class KbqIcon extends KbqColorDirective implements AfterContentInit, OnChanges {
+    readonly elementRef: ElementRef<HTMLElement>;
+    protected readonly formField: _koobiq_components_core.KbqFormFieldRef | null;
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    protected readonly registry: KbqIconRegistry | null;
+    protected readonly destroyRef: DestroyRef;
+    readonly small: i0.InputSignal<boolean>;
+    autoColor: boolean;
+    hasError: boolean;
+    /** Name of an icon within a @koobiq/icons. Accepts "namespace:name" syntax. */
+    iconName: string;
+    protected name: string;
+    /**
+     * True when icon is being rendered as inline SVG.
+     * @docs-private
+     */
+    protected svgIcon: boolean;
+    /** @docs-private */
+    protected readonly svgIconName: ReplaySubject<string | undefined>;
+    getHostElement(): HTMLElement;
+    updateMaxHeight(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterContentInit(): void;
+    private updateState;
+    private parseIconSize;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqIcon, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqIcon, "[kbq-icon]", never, { "small": { "alias": "small"; "required": false; "isSignal": true; }; "autoColor": { "alias": "autoColor"; "required": false; }; "iconName": { "alias": "kbq-icon"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+
+declare class KbqIconButton extends KbqIcon implements AfterViewInit, OnDestroy {
+    protected readonly focusMonitor: FocusMonitor;
+    readonly small: i0.InputSignal<boolean>;
+    /** Name of an icon within a @koobiq/icons. */
+    iconName: string;
+    get tabindex(): any;
+    set tabindex(value: any);
+    private _tabindex;
+    /** Whether the button is disabled. */
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    private _disabled;
+    /** @docs-private */
+    readonly disabledSignal: i0.WritableSignal<boolean>;
+    name: string;
+    constructor();
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    private runFocusMonitor;
+    private stopFocusMonitor;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqIconButton, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqIconButton, "[kbq-icon-button]", never, { "small": { "alias": "small"; "required": false; "isSignal": true; }; "iconName": { "alias": "kbq-icon-button"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_disabled: unknown;
+}
+
+declare class KbqIconItem extends KbqIcon {
+    name: string;
+    /** Name of an icon within a @koobiq/icons. */
+    iconName: string;
+    readonly fade: i0.InputSignal<boolean>;
+    readonly big: i0.InputSignal<boolean>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqIconItem, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqIconItem, "[kbq-icon-item]", never, { "iconName": { "alias": "kbq-icon-item"; "required": false; }; "fade": { "alias": "fade"; "required": false; "isSignal": true; }; "big": { "alias": "big"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+interface KbqIconsConfig {
+    /** URL to the SVG sprite file. Must be served as a static asset. */
+    spriteUrl: string;
+    /** Optional namespace to register the sprite under. */
+    namespace?: string;
+}
+declare const KBQ_ICONS_CONFIG: InjectionToken<KbqIconsConfig[]>;
+/**
+ * A function that resolves an icon name to either an inline SVG string or a URL string.
+ * Return `null` to indicate this resolver does not handle the given name.
+ */
+type KbqIconResolver = (name: string) => string | null;
+/**
+ * Multi-valued injection token for icon resolver functions.
+ * Resolvers are tried in registration order; the first non-null result wins.
+ */
+declare const KBQ_ICON_RESOLVER: InjectionToken<KbqIconResolver[]>;
+/** Configures the icon registry to load icons from one or more SVG sprite assets. */
+declare function kbqIconsProvider(...sprites: KbqIconsConfig[]): Provider;
+/**
+ * Registers a resolver function that maps icon names to SVG strings or URLs.
+ * Multiple resolvers can be registered; they are tried in registration order.
+ */
+declare function kbqIconsResolverProvider(resolver: KbqIconResolver): Provider;
+/**
+ * Registers a name→SVG/URL dictionary as an icon resolver.
+ * Values starting with `<` are treated as inline SVG (no HTTP request).
+ * All other values are treated as URLs and fetched at runtime.
+ *
+ * @example
+ * kbqIconsDictProvider({ 'chevron-down-s_16': '<svg>...</svg>' })
+ */
+declare function kbqIconsDictProvider(dict: Record<string, string>): Provider;
+
+declare class KbqIconModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqIconModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqIconModule, never, [typeof KbqIcon, typeof KbqIconButton, typeof KbqIconItem], [typeof KbqIcon, typeof KbqIconButton, typeof KbqIconItem]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<KbqIconModule>;
+}
+
+export { KBQ_ICONS_CONFIG, KBQ_ICON_RESOLVER, KbqIcon, KbqIconButton, KbqIconItem, KbqIconModule, KbqIconRegistry, kbqIconsDictProvider, kbqIconsProvider, kbqIconsResolverProvider };
+export type { KbqIconOptions, KbqIconResolver, KbqIconsConfig };

package/index.d.ts

@@ -1 +1,2 @@
-export * from './public-api';
+
+export { };

package/inline-edit/index.d.ts

@@ -1,2 +1,171 @@
-export * from './inline-edit';
-export * from './module';
+import * as _angular_core from '@angular/core';
+import { ElementRef, TemplateRef } from '@angular/core';
+import { CdkConnectedOverlay, ScrollStrategy } from '@angular/cdk/overlay';
+import { PopUpPlacements, KbqComponentColors } from '@koobiq/components/core';
+import { KbqDropdownTrigger } from '@koobiq/components/dropdown';
+import { KbqLabel, KbqFormField } from '@koobiq/components/form-field';
+import { KbqTooltipTrigger } from '@koobiq/components/tooltip';
+import * as i1 from '@angular/cdk/a11y';
+
+type KbqInlineEditMode = 'view' | 'edit';
+/** @docs-private */
+declare class KbqFocusRegionItem {
+    readonly tabOut: _angular_core.OutputEmitterRef<KeyboardEvent>;
+    protected isFocused: boolean;
+    protected onTabOut(event: KeyboardEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqFocusRegionItem, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqFocusRegionItem, "[kbqFocusRegionItem]", ["kbqFocusRegionItem"], {}, { "tabOut": "tabOut"; }, never, never, true, never>;
+}
+/** Directive for easy using styles of inline edit placeholder publicly. */
+declare class KbqInlineEditPlaceholder {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqInlineEditPlaceholder, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqInlineEditPlaceholder, "[kbqInlineEditPlaceholder]", ["kbqInlineEditPlaceholder"], {}, {}, never, never, true, never>;
+}
+/**
+ * This directive enhances element acting as dropdown trigger,
+ * visually indicating the active state with the `kbq-active` class.
+ * Also, it prevents click/keydown events from being propagated to disable mode toggling of parent component.
+ */
+declare class KbqInlineEditMenu {
+    /** @docs-private */
+    protected readonly dropdownTrigger: KbqDropdownTrigger | null;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqInlineEditMenu, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KbqInlineEditMenu, "[kbqInlineEditMenu]", ["kbqInlineEditMenu"], {}, {}, never, never, true, never>;
+}
+/**
+ * Customizable component that enables edit-in-place logic for specified control and it's view.
+ * This component is projecting edit/view mode templates and adds keyboard/pointer handlers.
+ * Edit mode opens in a positioned overlay that matches the view mode width or can be customized.
+ */
+declare class KbqInlineEdit {
+    private readonly overlay;
+    private readonly document;
+    private readonly resizeObserver;
+    protected readonly elementRef: ElementRef<HTMLElement>;
+    /**
+     * Whether to show save/cancel action buttons in edit mode.
+     * @default false
+     */
+    readonly showActions: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether to automatically show validation error tooltips on save attempts.
+     * @default true
+     */
+    readonly showTooltipOnError: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Custom validation tooltip message. */
+    readonly validationTooltip: _angular_core.InputSignal<string | TemplateRef<any> | undefined>;
+    /**
+     * Disables the component, preventing interaction and mode switching. Only allows menu dropdown.
+     * @default false
+     */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Custom width in pixels for the edit mode overlay. Auto-calculated if not set. */
+    readonly editModeWidth: _angular_core.InputSignalWithTransform<number | undefined, unknown>;
+    /** User-defined tooltip placement */
+    readonly tooltipPlacement: _angular_core.InputSignal<PopUpPlacements | undefined>;
+    /** Classes to be passed to the inline edit panel. */
+    readonly overlayPanelClass: _angular_core.InputSignal<string | string[]>;
+    /** Handler function to retrieve the current value */
+    readonly getValueHandler: _angular_core.InputSignal<(() => unknown) | undefined>;
+    /** Handler function to update the value */
+    readonly setValueHandler: _angular_core.InputSignal<((value: any) => void) | undefined>;
+    /** Customizable function that checks if saving on enter available. */
+    readonly canSaveOnEnter: _angular_core.InputSignal<(event: KeyboardEvent) => boolean>;
+    /**
+     * CSS selectors for elements in view mode that should handle clicks instead of opening edit mode.
+     * Override to replace or extend the default list.
+     *
+     * @example
+     * `<kbq-inline-edit [interactiveSelectors]="['a', 'kbq-tag', 'button']">`
+     */
+    readonly interactiveSelectors: _angular_core.InputSignal<string[]>;
+    /** Emitted when the inline edit is saved successfully. */
+    protected readonly saved: _angular_core.OutputEmitterRef<void>;
+    /** Emitted when the inline edit is canceled and changes are discarded. */
+    protected readonly canceled: _angular_core.OutputEmitterRef<void>;
+    /** Emitted when mode switched to edit/view */
+    protected readonly modeChange: _angular_core.OutputEmitterRef<KbqInlineEditMode>;
+    /** @docs-private */
+    protected readonly menu: _angular_core.Signal<KbqInlineEditMenu | undefined>;
+    /** @docs-private */
+    protected readonly label: _angular_core.Signal<KbqLabel | undefined>;
+    /** @docs-private */
+    protected readonly formFieldRef: _angular_core.Signal<KbqFormField | undefined>;
+    /** @docs-private */
+    protected readonly formFieldRefList: _angular_core.Signal<readonly KbqFormField[]>;
+    /** @docs-private */
+    protected overlayOrigin: HTMLElement;
+    /** @docs-private */
+    protected readonly tooltipTrigger: _angular_core.Signal<KbqTooltipTrigger>;
+    /** @docs-private */
+    protected readonly viewContainer: _angular_core.Signal<ElementRef<HTMLElement>>;
+    /** @docs-private */
+    protected readonly overlayDir: _angular_core.Signal<CdkConnectedOverlay>;
+    /** @docs-private */
+    protected readonly regionItems: _angular_core.Signal<readonly KbqFocusRegionItem[]>;
+    /** @docs-private */
+    protected readonly mode: _angular_core.WritableSignal<KbqInlineEditMode>;
+    /** @docs-private */
+    protected readonly overlayWidth: _angular_core.WritableSignal<string | number>;
+    /** @docs-private */
+    protected readonly scrollStrategy: _angular_core.WritableSignal<ScrollStrategy>;
+    /** @docs-private */
+    readonly modeAsReadonly: _angular_core.Signal<KbqInlineEditMode>;
+    /** @docs-private */
+    protected readonly className: _angular_core.Signal<string>;
+    /** @docs-private */
+    protected readonly isEditMode: _angular_core.Signal<boolean>;
+    /** @docs-private */
+    protected readonly tabIndex: _angular_core.Signal<0 | -1>;
+    /** @docs-private */
+    protected readonly placements: typeof PopUpPlacements;
+    /** @docs-private */
+    protected readonly colors: typeof KbqComponentColors;
+    private initialValue;
+    constructor();
+    /** Manually switch mode */
+    toggleMode(): void;
+    /** @docs-private */
+    protected onClick(event: Event): void;
+    /** @docs-private */
+    protected onAttach(): void;
+    /** @docs-private */
+    protected save($event?: Event): void;
+    /** @docs-private */
+    protected cancel(): void;
+    /** @docs-private */
+    protected onOverlayKeydown(event: KeyboardEvent): void;
+    /**
+     * Block propagation of overlay outside click.
+     * Used to prevent reopening when target is inline edit itself.
+     * @docs-private
+     */
+    protected onOverlayOutsideClick($event: Event): void;
+    private isInteractiveElement;
+    /**
+     * Sets up Tab key listeners on region items.
+     * Single item: Tab moves to next edit.
+     * Multiple items: Shift+Tab on first or Tab on last moves to next edit.
+     */
+    private setOverlayKeydownListener;
+    private saveAndFocusNextInlineEdit;
+    private isInvalid;
+    private getValue;
+    private setValue;
+    private coerceControl;
+    private setOverlayWidth;
+    private openPanel;
+    private getInputNativeElement;
+    private markAllAsTouched;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqInlineEdit, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<KbqInlineEdit, "kbq-inline-edit", ["kbqInlineEdit"], { "showActions": { "alias": "showActions"; "required": false; "isSignal": true; }; "showTooltipOnError": { "alias": "showTooltipOnError"; "required": false; "isSignal": true; }; "validationTooltip": { "alias": "validationTooltip"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "editModeWidth": { "alias": "editModeWidth"; "required": false; "isSignal": true; }; "tooltipPlacement": { "alias": "tooltipPlacement"; "required": false; "isSignal": true; }; "overlayPanelClass": { "alias": "overlayPanelClass"; "required": false; "isSignal": true; }; "getValueHandler": { "alias": "getValueHandler"; "required": false; "isSignal": true; }; "setValueHandler": { "alias": "setValueHandler"; "required": false; "isSignal": true; }; "canSaveOnEnter": { "alias": "canSaveOnEnter"; "required": false; "isSignal": true; }; "interactiveSelectors": { "alias": "interactiveSelectors"; "required": false; "isSignal": true; }; }, { "saved": "saved"; "canceled": "canceled"; "modeChange": "modeChange"; }, ["menu", "label", "formFieldRefList"], ["kbq-label", "[kbqInlineEditViewMode]", "[kbqInlineEditMenu]", "[kbqInlineEditEditMode]"], true, [{ directive: typeof i1.CdkMonitorFocus; inputs: {}; outputs: {}; }]>;
+}
+
+declare class KbqInlineEditModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KbqInlineEditModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<KbqInlineEditModule, never, [typeof KbqInlineEdit, typeof KbqInlineEditPlaceholder, typeof KbqInlineEditMenu], [typeof KbqInlineEdit, typeof KbqInlineEditPlaceholder, typeof KbqInlineEditMenu]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<KbqInlineEditModule>;
+}
+
+export { KbqFocusRegionItem, KbqInlineEdit, KbqInlineEditMenu, KbqInlineEditModule, KbqInlineEditPlaceholder };
+export type { KbqInlineEditMode };