@testgorilla/tgo-ui 6.4.5-beta.1 → 7.0.0-beta.0

package/components/breadcrumb/index.d.ts

@@ -1,5 +1,62 @@
-/**
- * Generated bundle index. Do not edit.
- */
-/// <amd-module name="@testgorilla/tgo-ui/components/breadcrumb" />
-export * from './public-api';
+import * as _angular_core from '@angular/core';
+import { AfterViewInit, OnDestroy, EventEmitter, ElementRef, Injector } from '@angular/core';
+import * as i8 from '@testgorilla/tgo-ui/components/core';
+import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+export { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+import * as i5 from '@testgorilla/tgo-ui/components/overflow-menu';
+import { OverflowMenuButtonsType } from '@testgorilla/tgo-ui/components/overflow-menu';
+import * as i2 from '@angular/common';
+import * as i3 from '@testgorilla/tgo-ui/components/icon';
+import * as i4 from '@angular/material/tooltip';
+import * as i6 from '@testgorilla/tgo-ui/components/button';
+import * as i7 from '@testgorilla/tgo-ui/components/skeleton';
+
+type BreadcrumbSize = 'small' | 'medium' | 'large';
+interface BreadcrumbItem {
+    label: string;
+    value: string;
+}
+
+declare class BreadcrumbComponent implements AfterViewInit, OnDestroy {
+    private readonly parentInjector;
+    size: _angular_core.InputSignal<BreadcrumbSize>;
+    items: _angular_core.InputSignal<BreadcrumbItem[]>;
+    applicationTheme: _angular_core.InputSignal<ApplicationTheme>;
+    includeBackButton: _angular_core.InputSignal<boolean>;
+    isLoading: _angular_core.InputSignal<boolean>;
+    numberOfLoadingItems: _angular_core.InputSignal<number>;
+    maxItemLength: _angular_core.InputSignal<number>;
+    selectItem: EventEmitter<string>;
+    backButtonClickEvent: EventEmitter<Event>;
+    loadingItems: _angular_core.Signal<any[]>;
+    isOverflowing: _angular_core.WritableSignal<boolean>;
+    visibleItems: _angular_core.WritableSignal<BreadcrumbItem[]>;
+    overflowItems: _angular_core.WritableSignal<BreadcrumbItem[]>;
+    overflowButtonItems: _angular_core.Signal<OverflowMenuButtonsType[]>;
+    shouldTruncateLastItem: _angular_core.WritableSignal<boolean>;
+    breadcrumbContainer: ElementRef<HTMLElement>;
+    private resizeObserver?;
+    private itemsInOverflow;
+    private previousLoadingState?;
+    private injector;
+    constructor(parentInjector: Injector);
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    private calculateItemDistribution;
+    private handleOverflow;
+    private tryReduceOverflow;
+    private updateItemArrays;
+    private resetToAllVisible;
+    private setupResizeObserver;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BreadcrumbComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BreadcrumbComponent, "ui-breadcrumb", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; "isSignal": true; }; "includeBackButton": { "alias": "includeBackButton"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "numberOfLoadingItems": { "alias": "numberOfLoadingItems"; "required": false; "isSignal": true; }; "maxItemLength": { "alias": "maxItemLength"; "required": false; "isSignal": true; }; }, { "selectItem": "selectItem"; "backButtonClickEvent": "backButtonClickEvent"; }, never, never, false, never>;
+}
+
+declare class BreadcrumbComponentModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BreadcrumbComponentModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<BreadcrumbComponentModule, [typeof BreadcrumbComponent], [typeof i2.CommonModule, typeof i3.IconComponentModule, typeof i4.MatTooltipModule, typeof i5.OverflowMenuComponentModule, typeof i6.ButtonComponentModule, typeof i7.SkeletonComponent, typeof i8.UiTranslatePipe, typeof i8.TruncatePipe], [typeof BreadcrumbComponent]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<BreadcrumbComponentModule>;
+}
+
+export { BreadcrumbComponent, BreadcrumbComponentModule };
+export type { BreadcrumbItem, BreadcrumbSize };

package/components/button/index.d.ts

@@ -1,5 +1,300 @@
+import { FocusOrigin } from '@angular/cdk/a11y';
+import * as i0 from '@angular/core';
+import { OnInit, AfterViewInit, ElementRef, EventEmitter, SimpleChanges } from '@angular/core';
+import * as i3 from '@angular/material/button';
+import { MatButton } from '@angular/material/button';
+import * as i6 from '@angular/material/tooltip';
+import { TooltipPosition } from '@angular/material/tooltip';
+import * as i8 from '@testgorilla/tgo-ui/components/core';
+import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+export { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+import * as i4 from '@testgorilla/tgo-ui/components/icon';
+import { IconName } from '@testgorilla/tgo-ui/components/icon';
+import * as i7 from '@testgorilla/tgo-ui/components/badge';
+import { BadgeVariant, RebrandBadgeColor } from '@testgorilla/tgo-ui/components/badge';
+import * as i2 from '@angular/common';
+import * as i5 from '@angular/material/progress-spinner';
+import * as i9 from '@angular/material/radio';
+
+type ButtonIconPosition = 'left' | 'right';
+type ButtonColor = 'primary' | 'secondary' | 'secondary-inverted' | 'ghost' | 'ghost-ai' | 'outlined' | 'destructive' | 'tertiary' | 'link' | 'tab' | 'text' | 'text-inline' | 'menuTrigger' | 'menuCell' | 'icon-button';
+type ButtonSize = 'big' | 'medium' | 'small';
+type LinkUrlTarget = '' | '_self' | '_blank' | '_parent' | '_top';
+type IconButtonSize = '24' | '32' | '40';
+type ButtonType = 'button' | 'submit' | 'reset';
+type ButtonState = 'hover' | 'pressed' | 'disabled' | 'default';
+interface ButtonBadgeConfig {
+    badgeType: BadgeVariant | null;
+    badgeLabel?: string;
+    badgeNotificationAmount: number;
+    rebrandColor?: RebrandBadgeColor;
+}
+
+declare class ButtonComponent implements OnInit, AfterViewInit {
+    private readonly defaultAppTheme;
+    get enabled(): string;
+    tooltipElement: ElementRef<HTMLElement>;
+    /**
+     * Define button height
+     *
+     * @type {ButtonSize}
+     * @memberof ButtonComponent
+     */
+    size: ButtonSize;
+    /**
+     * Background color of the button while in active state
+     *
+     * @type {ButtonColor}
+     * @memberof ButtonComponent
+     */
+    variant: ButtonColor;
+    /**
+     * Text content to appear on the button
+     *
+     * @memberof ButtonComponent
+     */
+    label: string;
+    /**
+     * Positioning of the icon (when existant)
+     *
+     * @type {ButtonIconPosition}
+     * @memberof ButtonComponent
+     */
+    iconPosition?: ButtonIconPosition;
+    /**
+     * Define if button has only icon without text
+     *
+     * @memberof ButtonComponent
+     */
+    justIcon: boolean;
+    /**
+     * Name of ui-icon
+     *
+     * @type {IconName}
+     * @memberof ButtonComponent
+     */
+    iconName: IconName | undefined;
+    /**
+     * Indicator if the button should be disabled
+     *
+     * @memberof ButtonComponent
+     */
+    disabled: boolean;
+    /**
+     * Indicator if the loading icon should be shown
+     *
+     * @memberof ButtonComponent
+     */
+    loading: boolean;
+    /**
+     * Indicator of the button width
+     *
+     * @memberof ButtonComponent
+     */
+    fullWidth: boolean;
+    /**
+     * Url of button if it is a link
+     *
+     * @memberof ButtonComponent
+     */
+    url?: string;
+    /**
+     * Url's target of button if it is a link
+     *
+     * @type {@type {LinkUrlTarget}}
+     * @memberof ButtonComponent
+     */
+    urlTarget?: LinkUrlTarget;
+    /**
+     * Button value
+     *
+     * @memberof ButtonComponent
+     */
+    value?: string;
+    /**
+     * @property tooltip
+     * @description The tooltip that is displayed on hover. Required for icon-button type
+     * @type {string}
+     * @memberof ButtonComponent
+     */
+    tooltip: string;
+    /**
+     * @property isPremium
+     * @description The icon that is displayed for Premium button
+     * @type {boolean}
+     * @memberof ButtonComponent
+     */
+    isPremium: boolean;
+    /**
+     * The type of the button.
+     *
+     * @type {ButtonType}
+     * @memberof ButtonComponent
+     * @default 'button'
+     */
+    type: ButtonType;
+    /**
+     * Color of the button.
+     * Defaults to Test Gorilla primary color.
+     *
+     * @type {string}
+     * @memberof ButtonComponent
+     */
+    companyColor: string | null;
+    /**
+     * Config for the button badge variation
+     * @type {ButtonBadgeConfig}
+     * @property badgeType Type of badge on the button
+     * @property badgeLabel Label text for the badge
+     * @property badgeNotificationAmount The amount for notification in the badge
+     */
+    buttonBadgeConfig: ButtonBadgeConfig | undefined;
+    /**
+     *
+     * Defines the application theme where buttons is used
+     *
+     * @type {ApplicationTheme}
+     * @memberof ButtonComponent
+     */
+    applicationTheme: ApplicationTheme;
+    /**
+     *
+     * Disabled button scale on click
+     *
+     * @type {boolean}
+     * @memberof ButtonComponent
+     */
+    disabledScaleOnClick: boolean;
+    /**
+     * A string representing the ARIA label for accessibility.
+     * This label is used to provide an accessible name for the input element.
+     * @type {string}
+     * @memberof ButtonComponent
+     */
+    ariaLabel: string;
+    /**
+     * A string representing the ARIA requirement for accessibility.
+     * This attribute is used to indicate whether an input field is required for form submission.
+     * @type {boolean}
+     * @memberof ButtonComponent
+     */
+    ariaRequired: boolean;
+    /**
+     * A string representing the ARIA requirement for accessibility.
+     * This attribute is used to indicate whether an input field is required for form submission.
+     * @type {string}
+     * @memberof ButtonComponent
+     */
+    ariaLabelledby: string;
+    /**
+     * A string representing the ARIA requirement for accessibility.
+     * This attribute is used to indicate whether an input field is required for form submission.
+     * @type {string}
+     * @memberof ButtonComponent
+     */
+    ariaDescribedby: string;
+    /**
+     * Prevents default button click behavior
+     * @type {boolean}
+     * @memberof ButtonComponent
+     */
+    preventDefault: boolean;
+    /**
+     * Ghost variant with white background
+     * @type {boolean}
+     * @memberof ButtonComponent
+     */
+    hasBackground: boolean;
+    /**
+     * Sets tooltip position
+     *
+     * @type {TooltipPosition}
+     * @memberof ButtonComponent
+     */
+    tooltipPosition: TooltipPosition;
+    role: string;
+    iconFilled: boolean;
+    buttonClickEvent: EventEmitter<Event>;
+    buttonHoverEvent: EventEmitter<Event>;
+    buttonElement: MatButton;
+    get isDisabled(): boolean;
+    get compColor(): string;
+    classCss: string;
+    styleCss: any;
+    isButtonLink: boolean;
+    isLabel: boolean;
+    buttonState: ButtonState;
+    hover: boolean;
+    iconButtonSize: IconButtonSize;
+    allowButtonTypeForPremium: ButtonColor[];
+    isFilledIcon: boolean;
+    coloredIcons: string[];
+    labelEllipsis: boolean;
+    icon: IconName;
+    private static nextAriaLabelledId;
+    ariaLabelledbyId: string;
+    get typeIncluded(): boolean;
+    constructor(defaultAppTheme: ApplicationTheme);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    buttonClick(event: Event): void;
+    buttonHover(event: Event): void;
+    showLabel(): boolean;
+    setCssClass(): string;
+    setCssStyle(): any;
+    get showSpinner(): boolean;
+    showButtonLink(): boolean;
+    setIconButtonSize(): IconButtonSize;
+    onPressed(ev: Event): void;
+    focus(origin?: FocusOrigin): void;
+    get getCompanyColor(): string;
+    get shouldChangeFilledStatus(): boolean;
+    onKeydown(event: KeyboardEvent): void;
+    onKeyup(event: KeyboardEvent): void;
+    onLabelEllipsisChange(state: boolean): void;
+    getIconName(iconName: string, defaultValue: string): IconName;
+    private createAriaLabelledById;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, [{ optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "ui-button", never, { "size": { "alias": "size"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "label": { "alias": "label"; "required": false; }; "iconPosition": { "alias": "iconPosition"; "required": false; }; "justIcon": { "alias": "justIcon"; "required": false; }; "iconName": { "alias": "iconName"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "url": { "alias": "url"; "required": false; }; "urlTarget": { "alias": "urlTarget"; "required": false; }; "value": { "alias": "value"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "isPremium": { "alias": "isPremium"; "required": false; }; "type": { "alias": "type"; "required": false; }; "companyColor": { "alias": "companyColor"; "required": false; }; "buttonBadgeConfig": { "alias": "buttonBadgeConfig"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "disabledScaleOnClick": { "alias": "disabledScaleOnClick"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaRequired": { "alias": "ariaRequired"; "required": false; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; "preventDefault": { "alias": "preventDefault"; "required": false; }; "hasBackground": { "alias": "hasBackground"; "required": false; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; }; "role": { "alias": "role"; "required": false; }; "iconFilled": { "alias": "iconFilled"; "required": false; }; }, { "buttonClickEvent": "buttonClickEvent"; "buttonHoverEvent": "buttonHoverEvent"; }, never, never, false, never>;
+    static ngAcceptInputType_preventDefault: unknown;
+    static ngAcceptInputType_hasBackground: unknown;
+}
+
+declare class ButtonComponentModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponentModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ButtonComponentModule, [typeof ButtonComponent], [typeof i2.CommonModule, typeof i3.MatButtonModule, typeof i4.IconComponentModule, typeof i5.MatProgressSpinnerModule, typeof i6.MatTooltipModule, typeof i7.BadgeComponentModule, typeof i8.EllipseTextDirective, typeof i9.MatRadioModule, typeof i8.UiTranslatePipe], [typeof ButtonComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ButtonComponentModule>;
+}
+
 /**
- * Generated bundle index. Do not edit.
+ * Function for adjusting the lightness of a color based on different events (hover, pressed, disabled).
+ * Accepts a hex color, transforms it to HSL, and based on color's L and event darkens or lightens it.
+ * Used to manage different colors based on application configuration
+ *
+ * @param hexColor color in hex format
+ * @param typeEvent interaction event
+ * @param theme
  */
-/// <amd-module name="@testgorilla/tgo-ui/components/button" />
-export * from './public-api';
+declare const adjustLightness: (hexColor: string, typeEvent: "hover" | "pressed" | "disabled", theme?: "new" | "classic") => string;
+/**
+ * Transforms hex color to HSL in object variation.
+ * @param hexColor string value with hex color
+ */
+declare const hexToHsl: (hexColor: string) => {
+    h: number;
+    s: number;
+    l: number;
+};
+/**
+ * Transforms HSL color, represented as an object and transforms it to hex string.
+ * @param hslColor accepts the HSL color like an object.
+ */
+declare const hslToHex: (hslColor: {
+    h: number;
+    s: number;
+    l: number;
+}) => string;
+
+export { ButtonComponent, ButtonComponentModule, adjustLightness, hexToHsl, hslToHex };
+export type { ButtonBadgeConfig, ButtonColor, ButtonIconPosition, ButtonSize, ButtonState, ButtonType, IconButtonSize, LinkUrlTarget };

package/components/card/index.d.ts

@@ -1,5 +1,103 @@
-/**
- * Generated bundle index. Do not edit.
- */
-/// <amd-module name="@testgorilla/tgo-ui/components/card" />
-export * from './public-api';
+import * as i0 from '@angular/core';
+import { OnChanges, OnInit, EventEmitter } from '@angular/core';
+import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+export { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+import * as i3 from '@testgorilla/tgo-ui/components/icon';
+import { IconSize } from '@testgorilla/tgo-ui/components/icon';
+import * as i2 from '@angular/common';
+
+type CardSize = 'small' | 'medium' | 'large';
+type CardSizeVariant = 'regular' | 'condensed';
+type CardVariant = 'default' | 'shadow' | 'state' | 'error' | 'educative' | 'premium' | 'ai' | 'actionDriver' | 'neutral' | 'neutral-state';
+
+declare class CardComponent implements OnChanges, OnInit {
+    private readonly defaultAppTheme;
+    /**
+     * Card size. Defaults "medium".
+     *
+     * @type {CardSize}
+     * @memberof CardComponent
+     */
+    size: CardSize;
+    /**
+     * Card size variant. Defaults "default".
+     *
+     * @type {CardSizeVariant}
+     * @memberof CardComponent
+     */
+    sizeVariant: CardSizeVariant;
+    /**
+     * Card variants. Defaults "default".
+     *
+     * @type {CardVariant}
+     * @memberof CardComponent
+     */
+    variant: CardVariant;
+    /**
+     *
+     * Defines the application theme
+     *
+     * @type {ApplicationTheme}
+     * @memberof CardComponent
+     */
+    applicationTheme: ApplicationTheme;
+    /**
+     * Show errors below card.
+     *
+     * @type {string[]}
+     * @memberof CardComponent
+     */
+    set errors(errors: string[]);
+    /**
+     * Errors size
+     *
+     * @type {string}
+     * @memberof CardComponent
+     */
+    errorsSize?: string | undefined;
+    /**
+     * Marks card as selected
+     *
+     * @type {boolean}
+     * @memberof CardComponent
+     */
+    selected: boolean;
+    /**
+     * Marks card as readonly. Defaults "false".
+     *
+     * @type {boolean}
+     * @memberof CardComponent
+     */
+    allowSelect: boolean;
+    /**
+     * Marks card as focusable. Defaults "true".
+     *
+     * @type {boolean}
+     * @memberof CardComponent
+     */
+    allowFocus: boolean;
+    /**
+     * Emits when card is being selected
+     */
+    cardSelected: EventEmitter<boolean>;
+    safeErrors: string[];
+    classes: string;
+    constructor(defaultAppTheme: ApplicationTheme);
+    ngOnChanges(): void;
+    ngOnInit(): void;
+    get cardVariant(): CardVariant;
+    get errorIconSize(): IconSize;
+    get isSelected(): boolean;
+    selectCard(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CardComponent, [{ optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CardComponent, "ui-card", never, { "size": { "alias": "size"; "required": false; }; "sizeVariant": { "alias": "sizeVariant"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "errorsSize": { "alias": "errorsSize"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "allowSelect": { "alias": "allowSelect"; "required": false; }; "allowFocus": { "alias": "allowFocus"; "required": false; }; }, { "cardSelected": "cardSelected"; }, never, ["*"], false, never>;
+}
+
+declare class CardComponentModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CardComponentModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CardComponentModule, [typeof CardComponent], [typeof i2.CommonModule, typeof i3.IconComponentModule], [typeof CardComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CardComponentModule>;
+}
+
+export { CardComponent, CardComponentModule };
+export type { CardSize, CardSizeVariant, CardVariant };