@tekus/design-system 4.0.3 → 5.0.0

package/components/{tk-dropdown-list/tk-dropdown-list.component.d.ts → dropdown-list/src/dropdown-list.component.d.ts}

@@ -1,7 +1,7 @@
-import { DropdownListItem } from './models/dropdown-list-item.model';
+import { DropdownListItem } from '@tekus/design-system/core/types';
 import { OnInit, EventEmitter } from '@angular/core';
 import * as i0 from "@angular/core";
-export declare class TkDropdownListComponent implements OnInit {
+export declare class DropdownListComponent implements OnInit {
     /**
      * Search field input value
      * @ignore
@@ -19,7 +19,7 @@ export declare class TkDropdownListComponent implements OnInit {
      * Filtered data
      * @ignore
      */
-    filteredData: DropdownListItem[];
+    filteredData: DropdownListItem<string>[];
     /**
      * Is dropdown list visible
      * @ignore
@@ -48,7 +48,7 @@ export declare class TkDropdownListComponent implements OnInit {
     /**
      * Data for dropdown list
      */
-    data: DropdownListItem[];
+    data: DropdownListItem<string>[];
     /**
      * Dropdown list hint label
      * @default ''
@@ -102,12 +102,12 @@ export declare class TkDropdownListComponent implements OnInit {
      * @ignore
      * Component method to handle click on dropdown list item
      */
-    onClickListItem(item: DropdownListItem): void;
+    onClickListItem(item: DropdownListItem<string | number>): void;
     /**
      * @ignore
      * Component method to filter data
      */
     filter(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TkDropdownListComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TkDropdownListComponent, "lib-tk-dropdown-list", never, { "data": { "alias": "data"; "required": false; }; "hintLabel": { "alias": "hintLabel"; "required": false; }; "searchFieldPlaceHolder": { "alias": "searchFieldPlaceHolder"; "required": false; }; "width": { "alias": "width"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; }, { "selectedValueChange": "selectedValueChange"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DropdownListComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DropdownListComponent, "tk-dropdown-list", never, { "data": { "alias": "data"; "required": false; }; "hintLabel": { "alias": "hintLabel"; "required": false; }; "searchFieldPlaceHolder": { "alias": "searchFieldPlaceHolder"; "required": false; }; "width": { "alias": "width"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; }, { "selectedValueChange": "selectedValueChange"; }, never, never, true, never>;
 }

package/components/fallback-view/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@tekus/design-system/components/fallback-view" />
+export * from './public-api';

package/components/fallback-view/public-api.d.ts

@@ -0,0 +1 @@
+export * from './src/fallback-view.component';

package/components/fallback-view/src/fallback-view.component.d.ts

@@ -0,0 +1,149 @@
+import { EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+export type FallbackViewType = 'content' | 'section';
+/**
+ * @component FallbackViewComponent
+ * @description
+ * A reusable component for displaying fallback or empty states such as
+ * “no results found”, “error loading data”, or “content not available”.
+ * It provides a consistent structure with support for an image, title,
+ * message, and optional action buttons.
+ *
+ * The component can be used in two ways:
+ * 1. **Via Inputs:** Pass data directly through component inputs (`imageSrc`, `title`, `message`, etc.).
+ * 2. **Via Content Projection (`ng-content`):** Use your own HTML structure for full customization.
+ *
+ * @usage
+ * ### Basic Usage (via Inputs)
+ * ```html
+ * <tk-fallback-view
+ *   imageSrc="assets/img/empty-state.svg"
+ *   title="No Items Found"
+ *   message="There are currently no items to display. Try adding one."
+ *   buttonLabel="Add New Item"
+ *   linkLabel="Learn More"
+ *   (buttonAction)="handleAddNewItem()"
+ *   (linkAction)="handleLearnMore()">
+ * </tk-fallback-view>
+ * ```
+ *
+ * ### Compact Variant (Section type)
+ * ```html
+ * <tk-fallback-view
+ *   [type]="'small'"
+ *   imageSrc="assets/img/check.svg"
+ *   message="Saved successfully">
+ * </tk-fallback-view>
+ * ```
+ *
+ * ### Advanced Usage (via ng-content)
+ * ```html
+ * <tk-fallback-view [type]="'content'">
+ *   <img image src="assets/img/empty-state.svg" alt="Tekus logo">
+ *   <h2 title>Custom Title</h2>
+ *   <p message>
+ *     This is a <b>custom message</b> with <strong>HTML content</strong>.
+ *   </p>
+ *   <div actions>
+ *     <tk-button
+ *       label="Primary Action"
+ *       severity="primary"
+ *       (click)="onPrimaryAction()">
+ *     </tk-button>
+ *     <tk-button
+ *       label="Secondary Action"
+ *       [link]="true"
+ *       (click)="onSecondaryAction()">
+ *     </tk-button>
+ *   </div>
+ * </tk-fallback-view>
+ * ```
+ */
+export declare class FallbackViewComponent {
+    /**
+     * @property {FallbackViewType} type
+     * @description
+     * Controls the overall type and spacing of the component.
+     * - `'content'`: Standard size.
+     * - `'section'`: A more compact version.
+     *
+     * @default `'default'`
+     */
+    type: FallbackViewType;
+    /**
+     * @property {string} imageSrc
+     * @description
+     * The URL for the illustrative image to be displayed at the top.
+     *
+     * @default `''`
+     */
+    imageSrc: string;
+    /**
+     * @property {string} illustrationAlt
+     * Descriptive alternative text for the image. Improves accessibility.
+     */
+    illustrationAlt: string;
+    /**
+     * @property {string} title
+     * @description
+     * The main title or heading of the fallback view.
+     *
+     * @default `''`
+     */
+    title: string;
+    /**
+     * @property {string} message
+     * @description
+     * The descriptive text or message displayed below the title.
+     *
+     * @default `''`
+     */
+    message: string;
+    /**
+     * @property {string} buttonLabel
+     * @description
+     * Text for the primary action button. If left empty, the button is not rendered.
+     *
+     * @default `''`
+     */
+    buttonLabel: string;
+    /**
+     * @property {string} linkLabel
+     * @description
+     * Text for the secondary action, which is styled as a link.
+     * If left empty, the link is not rendered.
+     *
+     * @default `''`
+     */
+    linkLabel: string;
+    /**
+     * @event buttonAction
+     * @description
+     * Emits when the main action button is clicked. Listen to this event
+     * to handle the primary call-to-action.
+     */
+    buttonAction: EventEmitter<void>;
+    /**
+     * @event linkAction
+     * @description
+     * Emits when the link-styled button is clicked. Use for secondary
+     * or alternative actions.
+     */
+    linkAction: EventEmitter<void>;
+    /**
+     * @method  onButtonActionClick
+     * @description
+     * Internal handler that emits the `primaryAction` event when the
+     * main button is clicked.
+     */
+    onButtonActionClick(): void;
+    /**
+     * @method onLinkActionClick
+     * @description
+     * Internal handler that emits the `linkAction` event when the
+     * link button is clicked.
+     */
+    onLinkActionClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FallbackViewComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FallbackViewComponent, "tk-fallback-view", never, { "type": { "alias": "type"; "required": false; }; "imageSrc": { "alias": "imageSrc"; "required": false; }; "illustrationAlt": { "alias": "illustrationAlt"; "required": false; }; "title": { "alias": "title"; "required": false; }; "message": { "alias": "message"; "required": false; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; }; "linkLabel": { "alias": "linkLabel"; "required": false; }; }, { "buttonAction": "buttonAction"; "linkAction": "linkAction"; }, never, ["[image]", "[title]", "[message]", "[actions]"], true, never>;
+}

package/components/forms/form-autocomplete-field/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@tekus/design-system/components/forms/form-autocomplete-field" />
+export * from './public-api';

package/components/forms/form-autocomplete-field/public-api.d.ts

@@ -0,0 +1 @@
+export * from './src/form-autocomplete-field.component';

package/components/forms/{tk-form-autocomplete-field/tk-form-autocomplete-field.component.d.ts → form-autocomplete-field/src/form-autocomplete-field.component.d.ts}

@@ -1,12 +1,12 @@
 import { OnInit, OnDestroy, OnChanges, EventEmitter, AfterViewInit, SimpleChanges } from '@angular/core';
 import { SubscriptSizing, MatFormFieldAppearance } from '@angular/material/form-field';
 import { MatAutocomplete } from '@angular/material/autocomplete';
-import { Option } from './models/option.model';
+import { Option } from '@tekus/design-system/core/types';
 import { ThemePalette } from '@angular/material/core';
 import { Observable } from 'rxjs';
 import { FormControl } from '@angular/forms';
 import * as i0 from "@angular/core";
-export declare class TkFormAutocompleteFieldComponent implements OnInit, OnDestroy, AfterViewInit, OnChanges {
+export declare class FormAutocompleteFieldComponent implements OnInit, OnDestroy, AfterViewInit, OnChanges {
     /**
      * Input field control
      * @ignore
@@ -168,6 +168,6 @@ export declare class TkFormAutocompleteFieldComponent implements OnInit, OnDestr
      * @ignore
      */
     ngOnDestroy(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TkFormAutocompleteFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TkFormAutocompleteFieldComponent, "lib-tk-form-autocomplete-field", never, { "fieldWidth": { "alias": "fieldWidth"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "autoActiveFirstOption": { "alias": "autoActiveFirstOption"; "required": false; }; "autoSelectActiveOption": { "alias": "autoSelectActiveOption"; "required": false; }; "type": { "alias": "type"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fieldTitle": { "alias": "fieldTitle"; "required": false; }; "fieldLabel": { "alias": "fieldLabel"; "required": false; }; "placeHolder": { "alias": "placeHolder"; "required": false; }; "options": { "alias": "options"; "required": false; }; }, { "optionSelected": "optionSelected"; "inputStatus": "inputStatus"; "bottomReached": "bottomReached"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormAutocompleteFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormAutocompleteFieldComponent, "tk-form-autocomplete-field", never, { "fieldWidth": { "alias": "fieldWidth"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "autoActiveFirstOption": { "alias": "autoActiveFirstOption"; "required": false; }; "autoSelectActiveOption": { "alias": "autoSelectActiveOption"; "required": false; }; "type": { "alias": "type"; "required": false; }; "required": { "alias": "required"; "required": false; }; "fieldTitle": { "alias": "fieldTitle"; "required": false; }; "fieldLabel": { "alias": "fieldLabel"; "required": false; }; "placeHolder": { "alias": "placeHolder"; "required": false; }; "options": { "alias": "options"; "required": false; }; }, { "optionSelected": "optionSelected"; "inputStatus": "inputStatus"; "bottomReached": "bottomReached"; }, never, never, true, never>;
 }

package/components/forms/form-chips-autocomplete-field/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@tekus/design-system/components/forms/form-chips-autocomplete-field" />
+export * from './public-api';

package/components/forms/form-chips-autocomplete-field/public-api.d.ts

@@ -0,0 +1 @@
+export * from './src/form-chips-autocomplete-field.component';

package/components/forms/{tk-form-chips-autocomplete-field/tk-form-chips-autocomplete-field.component.d.ts → form-chips-autocomplete-field/src/form-chips-autocomplete-field.component.d.ts}

@@ -1,12 +1,12 @@
 import { OnInit, OnChanges, ElementRef, EventEmitter, SimpleChanges } from '@angular/core';
 import { SubscriptSizing, MatFormFieldAppearance } from '@angular/material/form-field';
 import { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
-import { Option } from './models/option.model';
+import { Option } from '@tekus/design-system/core/types';
 import { Observable } from 'rxjs';
 import { ThemePalette } from '@angular/material/core';
 import { FormControl } from '@angular/forms';
 import * as i0 from "@angular/core";
-export declare class TkFormChipsAutocompleteFieldComponent implements OnInit, OnChanges {
+export declare class FormChipsAutocompleteFieldComponent implements OnInit, OnChanges {
     /**
      * Input field label
      */
@@ -119,6 +119,6 @@ export declare class TkFormChipsAutocompleteFieldComponent implements OnInit, On
      * @ignore
      */
     private _filter;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TkFormChipsAutocompleteFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TkFormChipsAutocompleteFieldComponent, "lib-tk-form-chips-autocomplete-field", never, { "fieldLabel": { "alias": "fieldLabel"; "required": false; }; "placeHolder": { "alias": "placeHolder"; "required": false; }; "fieldTitle": { "alias": "fieldTitle"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "fieldWidth": { "alias": "fieldWidth"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "allKeywords": { "alias": "allKeywords"; "required": false; }; }, { "inputStatus": "inputStatus"; "selectedKeywords": "selectedKeywords"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormChipsAutocompleteFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormChipsAutocompleteFieldComponent, "tk-form-chips-autocomplete-field", never, { "fieldLabel": { "alias": "fieldLabel"; "required": false; }; "placeHolder": { "alias": "placeHolder"; "required": false; }; "fieldTitle": { "alias": "fieldTitle"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "fieldWidth": { "alias": "fieldWidth"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "allKeywords": { "alias": "allKeywords"; "required": false; }; }, { "inputStatus": "inputStatus"; "selectedKeywords": "selectedKeywords"; }, never, never, true, never>;
 }

package/components/forms/form-input-field/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@tekus/design-system/components/forms/form-input-field" />
+export * from './public-api';

package/components/forms/form-input-field/public-api.d.ts

@@ -0,0 +1 @@
+export * from './src/form-input-field.component';

package/components/forms/{tk-form-input-field/tk-form-input-field.component.d.ts → form-input-field/src/form-input-field.component.d.ts}

@@ -2,9 +2,9 @@ import { OnInit, OnChanges, EventEmitter, SimpleChanges } from '@angular/core';
 import { FormControl } from '@angular/forms';
 import { FloatLabelType, SubscriptSizing, MatFormFieldAppearance } from '@angular/material/form-field';
 import { ThemePalette } from '@angular/material/core';
-import { ValidatorWithMessage } from './models/validator-with-message.model';
+import { ValidatorWithMessage } from '@tekus/design-system/core/types';
 import * as i0 from "@angular/core";
-export declare class TkFormInputFieldComponent implements OnInit, OnChanges {
+export declare class FormInputFieldComponent implements OnInit, OnChanges {
     /**
      * Optional input field width
      * @default 100%
@@ -132,6 +132,6 @@ export declare class TkFormInputFieldComponent implements OnInit, OnChanges {
      * @ignore
      */
     updateErrorMessage(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TkFormInputFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TkFormInputFieldComponent, "lib-tk-form-input-field", never, { "fieldWidth": { "alias": "fieldWidth"; "required": false; }; "fieldTitle": { "alias": "fieldTitle"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; "type": { "alias": "type"; "required": false; }; "required": { "alias": "required"; "required": false; }; "floatLabel": { "alias": "floatLabel"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "fieldLabel": { "alias": "fieldLabel"; "required": false; }; "placeHolder": { "alias": "placeHolder"; "required": false; }; "inputPrefix": { "alias": "inputPrefix"; "required": false; }; "inputSuffix": { "alias": "inputSuffix"; "required": false; }; "validatorsWithMessages": { "alias": "validatorsWithMessages"; "required": false; }; "asyncValidatorsWithMessages": { "alias": "asyncValidatorsWithMessages"; "required": false; }; }, { "inputStatus": "inputStatus"; }, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormInputFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormInputFieldComponent, "tk-form-input-field", never, { "fieldWidth": { "alias": "fieldWidth"; "required": false; }; "fieldTitle": { "alias": "fieldTitle"; "required": false; }; "theme": { "alias": "theme"; "required": false; }; "type": { "alias": "type"; "required": false; }; "required": { "alias": "required"; "required": false; }; "floatLabel": { "alias": "floatLabel"; "required": false; }; "appearance": { "alias": "appearance"; "required": false; }; "subscriptSizing": { "alias": "subscriptSizing"; "required": false; }; "fieldLabel": { "alias": "fieldLabel"; "required": false; }; "placeHolder": { "alias": "placeHolder"; "required": false; }; "inputPrefix": { "alias": "inputPrefix"; "required": false; }; "inputSuffix": { "alias": "inputSuffix"; "required": false; }; "validatorsWithMessages": { "alias": "validatorsWithMessages"; "required": false; }; "asyncValidatorsWithMessages": { "alias": "asyncValidatorsWithMessages"; "required": false; }; }, { "inputStatus": "inputStatus"; }, never, never, true, never>;
 }

package/components/forms/public-api.d.ts

@@ -1,3 +1,3 @@
-export * from './tk-form-input-field/tk-form-input-field.component';
-export * from './tk-form-autocomplete-field/tk-form-autocomplete-field.component';
-export * from './tk-form-chips-autocomplete-field/tk-form-chips-autocomplete-field.component';
+export * from './form-autocomplete-field';
+export * from './form-input-field';
+export * from './form-chips-autocomplete-field';

package/components/grid-container/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@tekus/design-system/components/grid-container" />
+export * from './public-api';

package/components/grid-container/public-api.d.ts

@@ -0,0 +1 @@
+export * from './src/grid-container.component';

package/components/grid-container/src/grid-container.component.d.ts

@@ -0,0 +1,121 @@
+import { AutoFillGridProps, ComposeSize, ContainerType, FixedGridProps, GapGutter, GridColumns, GutterType } from '@tekus/design-system/core/types';
+import * as i0 from "@angular/core";
+/**
+ * A responsive CSS Grid container that exposes typed, two-way models to control
+ * column count, track size, inter-item gutter, and container padding.
+ *
+ * Behavior:
+ * - columns: GridColumns (default 12). Numeric values are capped per Breakpoints
+ * (2/3/4/8 for mobileSmall/mobileLarge/tabletVertical/tabletHorizontal). No cap when size is minmax().
+ * - size: ComposeSize (default '1fr'). Required to be minmax() when columns is 'auto-fill', otherwise an error is thrown.
+ * - gutter: Gutter (default 'normal'), mapped to GapGutter for host gap.
+ * - containerType: ContainerType (default 'medium'), mapped to PaddingGridContainer for host padding.
+ *
+ * Host bindings:
+ * - style.grid-template-columns via repeat(...) from computed columns/size.
+ * - style.gap via GapGutter.
+ * - style.padding via PaddingGridContainer.
+ *
+ * Intended to wrap GridItemDirective children. Public type is compatible with FixedGridProps | AutoFillGridProps.
+ * @selector tk-grid-container
+ */
+export declare class GridContainerComponent {
+    /**
+     * Two-way bound model defining the number of columns in the grid.
+     *
+     * The value is capped based on the current screen breakpoint. If the `size` model
+     * is a `minmax()` function, the column cap is disabled.
+     *
+     * @default 12
+     * @see GridColumns
+     */
+    columns: import("@angular/core").ModelSignal<GridColumns>;
+    /**
+     * Two-way bound model defining the spacing between grid items.
+     *
+     * The value is mapped to a CSS `gap` property based on the `Gutter` type.
+     *
+     * @default Gutter.normal
+     * @see Gutter
+     * @see GutterType
+     */
+    gutter: import("@angular/core").ModelSignal<GutterType>;
+    /**
+     * Two-way bound model defining the grid track size.
+     *
+     * Accepts any ComposeSize value (e.g., '1fr', fixed lengths, or minmax()) and
+     * drives the computed grid template for the container.
+     *
+     * @default '1fr'
+     * @see ComposeSize
+     */
+    size: import("@angular/core").ModelSignal<ComposeSize>;
+    /**
+     * Two-way bound model defining the internal spacing of the grid container.
+     *
+     * The value is mapped to a CSS `padding` property based on the `PaddingGridContainer` type.
+     *
+     * @default 'medium'
+     * @see ContainerType
+     */
+    containerType: import("@angular/core").ModelSignal<ContainerType>;
+    /**
+     * A private static RegExp to validate strings that match the `minmax()` function.
+     */
+    readonly MINMAX_RE: RegExp;
+    /**
+     * A private service injection to observe screen breakpoint changes.
+     */
+    private readonly breakpointObserver;
+    /**
+     * A signal derived from `breakpointObserver` to reactively track changes
+     * across all defined breakpoints.
+     */
+    screenChanges: import("@angular/core").Signal<import("@angular/cdk/layout").BreakpointState | undefined>;
+    /**
+     * A computed signal that determines the final number of columns for the grid.
+     *
+     * It caps the `columns` model value based on the current screen breakpoint,
+     * unless the `size` model is a `minmax()` function.
+     */
+    readonly finalColumns: import("@angular/core").Signal<GridColumns>;
+    /**
+       * Host binding that maps the `gutter` model to the host element's `style.gap` property.
+       * @returns The CSS gap value from the `GapGutter` type.
+       */
+    get hostGap(): GapGutter;
+    /**
+     * Host binding that sets the `style.grid-template-columns` property based on
+     * the computed column count and track size.
+     * @returns The computed CSS value for `grid-template-columns`.
+     */
+    get gridColumns(): string;
+    /**
+     * Host binding that sets the `style.padding` property based on the `containerType` model.
+     * @returns The CSS padding value from the `PaddingGridContainer` type.
+     */
+    get containerPadding(): string;
+    /**
+     * Computes the final `grid-template-columns` string for the host element.
+     *
+     * It handles both fixed and `auto-fill` column types and validates that the `size`
+     * model is a `minmax()` function when `columns` is set to `'auto-fill'`.
+     * @returns The CSS value for the `grid-template-columns` property.
+     */
+    computeGridTemplateColumns(): string;
+    /**
+     * A private helper method to check if a given value is a valid `minmax()` function string.
+     * @param value The value to check.
+     * @returns `true` if the value is a valid `minmax()` string, `false` otherwise.
+     */
+    private isMinMax;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GridContainerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GridContainerComponent, "tk-grid-container", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "gutter": { "alias": "gutter"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "containerType": { "alias": "containerType"; "required": false; "isSignal": true; }; }, { "columns": "columnsChange"; "gutter": "gutterChange"; "size": "sizeChange"; "containerType": "containerTypeChange"; }, never, ["*"], true, never>;
+}
+/**
+ * A public type to represent an instance of the `GridContainerComponent` class,
+ * combined with its public input properties.
+ *
+ * This allows for better type-checking when the component is used in a template.
+ */
+export type GridComponent = new () => GridContainerComponent & (FixedGridProps | AutoFillGridProps);

package/components/icon/core/icon-catalog.d.ts

@@ -0,0 +1,76 @@
+import { IconDefinition } from "@fortawesome/angular-fontawesome";
+/**
+ * IconSource is used to indicate the origin of an icon in the IconCatalog.
+ * It can either be 'Font awesome' for icons sourced from the Font Awesome library,
+ * or 'Custom' for user-defined icons.
+ */
+export type IconSource = 'Font awesome' | 'Custom';
+/**
+ * IconRegister is used to define the structure of the icon registration object.
+ * It maps icon names to their registration details.
+ */
+export interface IconRegister {
+    [iconName: string]: IconRegisterDetail;
+}
+/**
+ * IconRegisterDetail is used to define the details of each icon in the IconCatalog.
+ * It includes the icon's name, tags, source, and styles.
+ */
+export interface IconRegisterDetail {
+    name: string;
+    tags: string[];
+    source: IconSource;
+    styles?: IconStyles;
+}
+/**
+ * IconStyles is used to define the available styles for each icon in the IconCatalog.
+ * It allows for lazy loading of icon styles.
+ */
+type IconType = IconDefinition | string;
+export interface IconStyles {
+    light?: Promise<IconType>;
+    regular?: Promise<IconType> | IconType;
+    solid?: Promise<IconType>;
+}
+/**
+ * IconStylesLight is used to define the available light styles for each icon in the IconCatalog.
+ * It includes styles such as 'light', 'fal', 'fa-light', and 'tkl'.
+ */
+export type IconStylesLight = 'light' | 'fal' | 'fa-light' | 'tkl';
+/**
+ * IconStylesSolid is used to define the available solid styles for each icon in the IconCatalog.
+ * It includes styles such as 'solid', 'fas', 'fa-solid', and 'tks'.
+ */
+export type IconStylesSolid = 'solid' | 'fas' | 'fa-solid' | 'tks';
+/**
+ * IconStylesRegular is used to define the available regular styles for each icon in the IconCatalog.
+ * It includes styles such as 'regular', 'far', 'fa-regular', 'fa', 'fa-classic', and 'tkr'.
+ */
+export type IconStylesRegular = 'regular' | 'far' | 'fa-regular' | 'fa' | 'fa-classic' | 'tkr';
+/**
+ * IconStylesGeneral is used to define the available general styles for each icon in the IconCatalog.
+ * It includes all styles from light, solid, and regular categories.
+ */
+export type IconStylesGeneral = IconStylesLight | IconStylesSolid | IconStylesRegular | null;
+/**
+ * IconColors is used to define the available colors for each icon in the IconCatalog.
+ * It includes colors such as 'primary', 'secondary', 'success', 'danger', 'warning', 'info', and 'light'.
+ */
+export type IconColors = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'light' | null;
+/**
+ * iconsStylesLight is an array of available light styles for each icon in the IconCatalog.
+ * It allows for easy access and iteration over the light styles.
+ */
+export declare const iconsStylesLight: IconStylesLight[];
+/**
+ * iconsStylesSolid is an array of available solid styles for each icon in the IconCatalog.
+ * It allows for easy access and iteration over the solid styles.
+ */
+export declare const iconsStylesSolid: IconStylesSolid[];
+/**
+ * iconsStylesRegular is an array of available regular styles for each icon in the IconCatalog.
+ * It allows for easy access and iteration over the regular styles.
+ */
+export declare const iconsStylesRegular: IconStylesRegular[];
+export declare const IconCatalog: IconRegister;
+export {};

package/components/icon/core/icons/ads.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from "../icon-catalog";
+export declare const adsIcons: IconRegister;

package/components/icon/core/icons/angle.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const angleIcons: IconRegister;

package/components/icon/core/icons/arrow.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const arrowIcons: IconRegister;

package/components/icon/core/icons/bars.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const barsIcon: IconRegister;

package/components/icon/core/icons/bolt.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const boltIcon: IconRegister;

package/components/icon/core/icons/book.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const bookIcon: IconRegister;

package/components/icon/core/icons/calendar.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const calendarIcon: IconRegister;

package/components/icon/core/icons/camera.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const cameraIcon: IconRegister;

package/components/icon/core/icons/chart.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const chartIcon: IconRegister;

package/components/icon/core/icons/check.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const checkIcon: IconRegister;

package/components/icon/core/icons/chevron.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const chevronIcons: IconRegister;

package/components/icon/core/icons/circle.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const circleIcon: IconRegister;

package/components/icon/core/icons/clock.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const clockIcon: IconRegister;

package/components/icon/core/icons/clone.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const cloneIcon: IconRegister;

package/components/icon/core/icons/download.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const downloadIcon: IconRegister;

package/components/icon/core/icons/ellipsis.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const ellipsisIcon: IconRegister;

package/components/icon/core/icons/eye.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const eyeIcon: IconRegister;

package/components/icon/core/icons/filter.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const filterIcon: IconRegister;

package/components/icon/core/icons/folders.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const foldersIcon: IconRegister;

package/components/icon/core/icons/gears.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const gearsIcon: IconRegister;

package/components/icon/core/icons/hand.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const handIcon: IconRegister;

package/components/icon/core/icons/language.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const languageIcon: IconRegister;

package/components/icon/core/icons/layer.icons.d.ts

@@ -0,0 +1,2 @@
+import { IconRegister } from '../icon-catalog';
+export declare const layerIcon: IconRegister;