@telesign/boreal-web-components 0.1.0-alpha.2 → 0.1.0-alpha.4

package/dist/types/components/forms/bds-flag/bds-flag.d.ts

@@ -0,0 +1,134 @@
+import { IFlag } from './interfaces/IFlag';
+/**
+ * Flag component used to display a country flag together with its corresponding label.
+ *
+ * @summary Renders a flag icon based on a country identifier and optionally displays
+ * the country name, short name, or call sign. Supports custom flag sources, different
+ * shapes, and flag alignment on either side of the label.
+ *
+ * @attr {boolean} label - When true, displays a textual label next to the flag.
+ * @attr {boolean} short-name - When true, displays the abbreviated country name (ISO2/ISO3) instead of the full name.
+ * @attr {boolean} call-sign - When true, displays the country calling code next to the label.
+ * @attr {string} country - Country value used to resolve the flag and label.
+ * @attr {AlignFlag} align-flag - Controls whether the flag is rendered on the left or right side.
+ * @attr {FlagIdentifier} identifier - Defines which country field is used to resolve the value.
+ * @attr {Shape} shape - Visual shape of the rendered flag.
+ * @attr {ICountry[]} custom-flags - Additional custom flag definitions that can override defaults.
+ *
+ * @property {boolean} label - Whether the country label should be displayed. Defaults to false.
+ * @property {boolean} shortName - Whether to display the abbreviated country name. Defaults to false.
+ * @property {boolean} callSign - Whether to display the country calling code. Defaults to false.
+ * @property {string} country - Country value used to find the matching flag entry. Defaults to ''.
+ * @property {AlignFlag} alignFlag - Position of the flag relative to the label. Defaults to `AlignFlag.LEFT`.
+ * @property {FlagIdentifier} identifier - Identifier used to resolve the country value. Defaults to `FlagIdentifier.CODE`.
+ * @property {Shape} shape - Shape variant used for the flag. Defaults to `Shape.RECTANGLE`.
+ * @property {ICountry[]} customFlags - List of custom flag definitions merged with the default catalog. Defaults to `[]`.
+ */
+export declare class BdsFlag implements IFlag {
+    el: HTMLBdsFlagElement;
+    /**
+     * Determines whether the flag is displayed on the left or right side of the label.
+     * @default AlignFlag.LEFT
+     */
+    readonly alignFlag: IFlag['alignFlag'];
+    /**
+     * Whether the country calling code should be displayed next to the label.
+     * @default false
+     */
+    readonly callSign: IFlag['callSign'];
+    /**
+     * Country value used to resolve the matching flag entry.
+     *
+     * The expected value depends on the configured `identifier`.
+     * @default ''
+     */
+    readonly country: IFlag['country'];
+    /**
+     * Custom flag definitions merged with the default country catalog.
+     *
+     * Custom entries can override default asset sources when the same `iso2` is used.
+     * @default []
+     */
+    readonly customFlags: IFlag['customFlags'];
+    /**
+     * Defines which field should be used to identify the country.
+     * For example, code, iso2, or iso3.
+     * @default FlagIdentifier.CODE
+     */
+    readonly identifier: IFlag['identifier'];
+    /**
+     * Whether the country name label should be displayed next to the flag.
+     * @default false
+     */
+    readonly label: IFlag['label'];
+    /**
+     * Visual shape used to render the flag.
+     * @default Shape.RECTANGLE
+     */
+    readonly shape: IFlag['shape'];
+    /**
+     * Whether the abbreviated country name (ISO2/ISO3) should be displayed instead of the full name.
+     * @default false
+     */
+    readonly shortName: IFlag['shortName'];
+    checkPropValues(): void;
+    componentWillLoad(): void;
+    /**
+     * Resolves the URL for a flag asset.
+     *
+     * If a matching custom flag entry exists and provides `flag_4x3`, that source is used.
+     * Otherwise, the asset URL is resolved from `FLAG_BASE_URL`. When `FLAG_BASE_URL` is an
+     * absolute URL (e.g. a CDN base), it is used directly. When it is a relative path, the
+     * asset is resolved through Stencil's `getAssetPath` and prefixed with the current origin.
+     *
+     * @param flag - Lowercase ISO2 flag code.
+     * @returns The absolute URL for the flag image.
+     */
+    private flagUrl;
+    /**
+     * Resolves the current country configuration from the default and custom catalogs.
+     *
+     * The lookup field is determined by `identifier`. When `identifier` is `CODE`,
+     * the search is performed against the `country` field. For `ISO3`, the input
+     * is normalized to uppercase; otherwise it is normalized to lowercase.
+     *
+     * @returns The matching country object, or an empty fallback object when no match is found.
+     */
+    private getCountry;
+    /**
+     * Returns the formatted label text for the current country based on display configuration.
+     * @returns The label string to render and use as the aria-label value.
+     */
+    private getCountryName;
+    /**
+     * Returns the normalized ISO2 code used to resolve the flag asset.
+     * @returns The lowercase ISO2 code for the current country.
+     */
+    private getFlag;
+    /**
+     * Delegates label generation to the shared flag naming utility.
+     * @param iso3 - ISO3 country code.
+     * @param iso2 - ISO2 country code.
+     * @param name - Full country name.
+     * @param country - Internal country code value.
+     * @returns The formatted label according to the current component configuration.
+     */
+    private getNameInternal;
+    /**
+     * Determines if the current flag is the global flag based on the resolved country entry.
+     * @returns `true` if the current flag is the global flag, `false` otherwise.
+     */
+    private get isGlobal();
+    /**
+     * Returns the CSS class map for the Host element, reflecting the current alignment.
+     * @returns Class map applied to the Host element.
+     */
+    private get flagClass();
+    /**
+     * Returns the CSS class map for the inner flag span, reflecting shape and global state.
+     * @returns Class map applied to the flag image span.
+     */
+    private get flagContentClass();
+    render(): any;
+}
+//# sourceMappingURL=bds-flag.d.ts.map

package/dist/types/components/forms/bds-flag/constants/countries.d.ts

@@ -0,0 +1,3 @@
+import { ICountry } from '../interfaces/ICountry';
+export declare const allCountries: ICountry[];
+//# sourceMappingURL=countries.d.ts.map

package/dist/types/components/forms/bds-flag/constants/flagUrl.d.ts

@@ -0,0 +1,2 @@
+export declare const FLAG_BASE_URL: string;
+//# sourceMappingURL=flagUrl.d.ts.map

package/dist/types/components/forms/bds-flag/constants/global.d.ts

@@ -0,0 +1,3 @@
+import { ICountry } from '../interfaces/ICountry';
+export declare const GLOBAL: ICountry;
+//# sourceMappingURL=global.d.ts.map

package/dist/types/components/forms/bds-flag/constants/index.d.ts

@@ -0,0 +1,4 @@
+export * from './countries';
+export * from './global';
+export * from './flagUrl';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/forms/bds-flag/helpers/getNameFlag.d.ts

@@ -0,0 +1,17 @@
+import { AlignFlag } from '../types';
+/**
+ * Get the name of the flag based on the provided parameters.
+ * The function constructs the name of the flag based on the ISO codes, country name, and various display options.
+ * @param iso3 - The ISO 3166-1 alpha-3 code of the country.
+ * @param iso2 - The ISO 3166-1 alpha-2 code of the country.
+ * @param countryName - The full name of the country.
+ * @param country - The country code to be displayed in the call sign.
+ * @param identifier - The identifier to be used to resolve the country code.
+ * @param label - Whether the name of the country should be displayed.
+ * @param shortName - Whether the short name of the country should be displayed.
+ * @param callSign - Whether the country call sign should be displayed.
+ * @param alignFlag - The alignment of the flag.
+ * @returns The name of the flag based on the provided parameters.
+ */
+export declare function getNameFlag(iso3: string, iso2: string, countryName: string, country: string, identifier: 'iso3' | 'iso2' | 'code', label: boolean, shortName: boolean, callSign: boolean, alignFlag: AlignFlag): string;
+//# sourceMappingURL=getNameFlag.d.ts.map

package/dist/types/components/forms/bds-flag/interfaces/ICountry.d.ts

@@ -0,0 +1,16 @@
+/**
+ * The interface for a country object.
+ * The Country interface defines the properties of a country object, which can be used to represent a country in a flag.
+ */
+export interface ICountry {
+    capital?: string;
+    continent?: string;
+    flag_1x1: string;
+    flag_4x3: string;
+    iso2: string;
+    iso3: string;
+    iso: boolean;
+    name: string;
+    country: string;
+}
+//# sourceMappingURL=ICountry.d.ts.map

package/dist/types/components/forms/bds-flag/interfaces/IFlag.d.ts

@@ -0,0 +1,14 @@
+import { ComponentInterface } from '../../../../stencil-public-runtime';
+import { AlignFlag, FlagIdentifier, Shape } from '../types';
+import { ICountry } from './ICountry';
+export interface IFlag extends ComponentInterface {
+    label: boolean;
+    shortName: boolean;
+    callSign: boolean;
+    alignFlag: AlignFlag;
+    identifier: FlagIdentifier;
+    shape: Shape;
+    country: string;
+    customFlags: ICountry[];
+}
+//# sourceMappingURL=IFlag.d.ts.map

package/dist/types/components/forms/bds-flag/types/Flag.d.ts

@@ -0,0 +1,22 @@
+/**
+ * The identifier to be used to resolve the country code.
+ * The FlagIdentifier object defines the possible values for the identifier, which can be 'iso2', 'iso3', or 'code'.
+ * The default value is 'iso3'.
+ */
+export declare const FlagIdentifier: {
+    readonly ISO2: "iso2";
+    readonly ISO3: "iso3";
+    readonly CODE: "code";
+};
+export type FlagIdentifier = (typeof FlagIdentifier)[keyof typeof FlagIdentifier];
+/**
+ * The alignment of the flag.
+ * The AlignFlag object defines the possible values for the alignment, which can be 'left' or 'right'.
+ * The default value is 'left'.
+ */
+export declare const AlignFlag: {
+    readonly LEFT: "left";
+    readonly RIGHT: "right";
+};
+export type AlignFlag = (typeof AlignFlag)[keyof typeof AlignFlag];
+//# sourceMappingURL=Flag.d.ts.map

package/dist/types/components/forms/bds-flag/types/Shape.d.ts

@@ -0,0 +1,12 @@
+/**
+ * The shape of the flag.
+ * The Shape object defines the possible values for the shape, which can be 'circle', 'square', or 'rectangle'.
+ * The default value is 'rectangle'.
+ */
+export declare const Shape: {
+    readonly CIRCLE: "circle";
+    readonly SQUARE: "square";
+    readonly RECTANGLE: "rectangle";
+};
+export type Shape = (typeof Shape)[keyof typeof Shape];
+//# sourceMappingURL=Shape.d.ts.map

package/dist/types/components/forms/bds-flag/types/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Flag';
+export * from './Shape';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/forms/bds-text-field/bds-text-field.d.ts

@@ -0,0 +1,196 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+import { type IFormControl } from "../../../mixins/index";
+import type { IFormValidator } from "../../../types/index";
+import { ITextField, TextFieldType, TextFieldVariant, TextFieldValidationTiming } from './types';
+declare const BdsTextField_base: abstract new (...args: any[]) => {
+    formDisabledCallback(disabled: boolean): void;
+};
+/**
+ * Text field component for user input with validation and form integration.
+ *
+ * @summary Single-line text input with label, validation, password toggle, and clear action.
+ *
+ * @slot prefix - Inline content rendered before the input (e.g. icon or status indicator). Intended for single-line elements only; multi-line content will be clipped.
+ *
+ * @attr {string} name - The name submitted with the form.
+ * @attr {string} value - The current value of the input.
+ * @attr {boolean} disabled - Disables the input.
+ * @attr {boolean} required - Marks the input as required.
+ * @attr {boolean} error - Applies the error visual state.
+ * @attr {"text"|"password"} type - Input type.
+ * @attr {"outline"|"plain"} variant - Visual style of the container.
+ * @attr {boolean} readonly - Makes the input read-only. The value is still submitted with the form.
+ *
+ * @property {string} label - Label text rendered above the input.
+ * @property {string} sublabel - Sublabel rendered inside the input container, before the text area.
+ * @property {string} placeholder - Native placeholder forwarded to the inner `<input>`.
+ * @property {string} helperText - Assistive text shown below the input when there is no error.
+ * @property {string} errorMessage - Error message shown below the input when `error` is `true`. Replaces `helperText`.
+ * @property {string} info - Tooltip content attached to the label.
+ * @property {string} icon - Icon font class rendered beside the sublabel inside the container (e.g. `bds-icon-settings`).
+ * @property {boolean} clearable - Shows a clear button when the input has a value.
+ * @property {boolean} clearOnHover - Shows a clear button that is hidden at rest and revealed on hover.
+ * @property {boolean} readOnly - Makes the input readonly. The value is still submitted with the form.
+ * @property {string} autocomplete - Native `autocomplete` attribute forwarded to the inner `<input>`.
+ * @property {string} pattern - Native `pattern` attribute forwarded to the inner `<input>`.
+ * @property {number} minLength - Minimum character count. `0` means no minimum.
+ * @property {number} maxLength - Maximum character count. `0` means no maximum.
+ * @property {boolean} counter - Enables the character counter in the footer. Requires `charCount`.
+ * @property {number} charCount - Maximum character count shown in the footer counter (e.g. `120` → `"45/120"`). Requires `counter`.
+ * @property {IFormValidator[]} customValidators - Additional validators merged with the built-in ones.
+ * @property {"blur"|"input"|"submit"|"change"} validationTiming - When built-in validation runs.
+ * @property {string} pattern - Regex the value must match to pass `patternMismatch` validation. Also forwarded as the native `pattern` attribute to the inner `<input>`. Empty string disables pattern validation.
+ * @property {string} customWidth - Sets a custom width via the `--bds-text-field-width` CSS custom property.
+ *
+ * @fires valueChange - Emitted on every value change; used for framework 2-way binding.
+ * @fires bdsInput - Emitted on every keystroke with `{ value, event }`.
+ * @fires bdsChange - Emitted when focus leaves after the value changed, with `{ value, event }`.
+ * @fires bdsFocus - Emitted when the input gains focus, with `{ event }`.
+ * @fires bdsBlur - Emitted when the input loses focus, with `{ event }`.
+ * @fires bdsClear - Emitted when the user activates the clear button.
+ * @fires bdsValidationChange - Emitted after each validation run with `{ valid, validity, value, touched, dirty }`.
+ *
+ * @cssprop --bds-text-field-width - Sets a custom width for the component.
+ */
+export declare class BdsTextField extends BdsTextField_base implements ITextField, IFormControl<string> {
+    el: HTMLBdsTextFieldElement;
+    internals: ElementInternals;
+    /** The name submitted with the form. */
+    readonly name: string;
+    /** Disables the input. Also toggled by `formDisabledCallback` via the mixin. */
+    readonly disabled: boolean;
+    /** Marks the input as required for form validation. */
+    readonly required: boolean;
+    /** Mirrors `disabled` and the FACE `formDisabledCallback` result. Drives all disabled UI. */
+    private isDisabled;
+    /** The current value of the input. */
+    value: string;
+    /** When `true`, applies the error visual state. */
+    readonly error: boolean;
+    /** Message shown below the input when `error` is `true`. Replaces `helperText`. */
+    readonly errorMessage: string;
+    /** Additional validators merged with the built-in ones. */
+    readonly customValidators: IFormValidator[];
+    /** Controls when built-in validation runs: `'blur'` | `'input'` | `'submit'` | `'change'`. */
+    readonly validationTiming: TextFieldValidationTiming;
+    /** The input type. Use `'password'` to enable the visibility toggle. */
+    readonly type: TextFieldType;
+    /** Visual style of the input container. `'outline'` shows a border; `'plain'` hides it at rest. */
+    readonly variant: TextFieldVariant;
+    /** Native `placeholder` attribute forwarded to the inner `<input>`. */
+    readonly placeholder: string;
+    /** Makes the input read-only. The value is still submitted with the form. */
+    readonly readOnly: boolean;
+    /** Native `autocomplete` attribute forwarded to the inner `<input>`. */
+    readonly autocomplete: string;
+    /** Regex the value must match to pass `patternMismatch` validation. Also forwarded as the native `pattern` attribute to the inner `<input>`. Empty string disables pattern validation. */
+    readonly pattern: string;
+    /** Minimum character count. `0` means no minimum. */
+    readonly minLength: number;
+    /** Maximum character count. `0` means no maximum. */
+    readonly maxLength: number;
+    /** Label text rendered above the input. */
+    readonly label: string;
+    /** Sublabel rendered inside the input container, before the text area. */
+    readonly sublabel: string;
+    /** Icon font class rendered beside the sublabel inside the container (e.g. `bds-icon-settings`). */
+    readonly icon: string;
+    /** Helper text shown below the input when there is no error. */
+    readonly helperText: string;
+    /** Tooltip content attached to the label. Rendered via `bds-typography` `tooltipText` prop. */
+    readonly info: string;
+    /** Shows a clear button when the input has a value. */
+    readonly clearable: boolean;
+    /** Shows a clear button that is hidden at rest and revealed when the user hovers over the field. */
+    readonly clearOnHover: boolean;
+    /** Maximum character count shown in the footer counter (e.g. `120` → `"45/120"`). Requires `counter`. */
+    readonly charCount: number;
+    /** Enables the character counter in the footer. Requires `charCount` to be set. */
+    readonly counter: boolean;
+    /** Sets a custom width via the `--bds-text-field-width` CSS custom property. */
+    readonly customWidth: string;
+    /** Tracks focus state to drive the `bds-text-field--focused` CSS modifier. */
+    private focused;
+    /** Controls whether the password input renders as plain text. */
+    private showPassword;
+    /** `true` after the user has blurred the input at least once. */
+    private touched;
+    /** `true` once the value has been modified by the user. */
+    private dirty;
+    /** Live character count of the current value. */
+    private currentCharCount;
+    /** `true` when the last triggered validation run returned invalid. Drives the error visual state. */
+    private validationError;
+    /** Error message from the last failed validator. Shown in the footer when `validationError` is `true`. */
+    private validationMessage;
+    /** Emitted whenever the value changes. Used by framework wrappers for 2-way binding. */
+    valueChange: EventEmitter<string>;
+    /** Emitted on every keystroke with the current value and the originating event. */
+    bdsInput: EventEmitter<{
+        value: string;
+        event: InputEvent;
+    }>;
+    /** Emitted when the input loses focus after the value has changed. */
+    bdsChange: EventEmitter<{
+        value: string;
+        event: Event;
+    }>;
+    /** Emitted when the input gains focus. */
+    bdsFocus: EventEmitter<{
+        event: FocusEvent;
+    }>;
+    /** Emitted when the input loses focus. */
+    bdsBlur: EventEmitter<{
+        event: FocusEvent;
+    }>;
+    /** Emitted when the user activates the clear button. */
+    bdsClear: EventEmitter<void>;
+    /** Emitted after each validation run with the full validity snapshot. */
+    bdsValidationChange: EventEmitter<{
+        valid: boolean;
+        validity: ValidityState;
+        value: string;
+        touched: boolean;
+        dirty: boolean;
+    }>;
+    /**
+     * Returns `true` if the element's value passes all constraints; `false` otherwise.
+     * Also fires an `invalid` event if constraints are violated.
+     */
+    checkValidity(): Promise<boolean>;
+    /**
+     * Returns `true` if the element's value passes all constraints; `false` otherwise.
+     * Shows the browser's native validation UI when constraints are violated.
+     */
+    reportValidity(): Promise<boolean>;
+    private _valueAtFocus;
+    private readonly _id;
+    onDisabledChange(next: boolean): void;
+    checkPropValues(): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    onCustomValidatorsChange(): void;
+    onValueChange(next: string): void;
+    formAssociatedCallback(): void;
+    formResetCallback(): void;
+    formStateRestoreCallback(state: unknown, _mode: string): void;
+    private updateValidity;
+    private invalidHandler;
+    private handleInput;
+    private handleChange;
+    private handleFocus;
+    private handleBlur;
+    private handleShowPassword;
+    private handleClear;
+    private handleMouseDown;
+    private get validators();
+    private get effectiveMaxLength();
+    private get classMap();
+    private get hostStyle();
+    private get iconClear();
+    private get showPasswordIcon();
+    render(): any;
+}
+export {};
+//# sourceMappingURL=bds-text-field.d.ts.map

package/dist/types/components/forms/bds-text-field/types/ITextField.d.ts

@@ -0,0 +1,31 @@
+import type { IFormValidator } from "../../../../types/form";
+import type { TextFieldType, TextFieldVariant, TextFieldValidationTiming } from './types';
+export interface ITextField {
+    name: string;
+    value: string;
+    disabled: boolean;
+    required: boolean;
+    readOnly: boolean;
+    error: boolean;
+    errorMessage: string;
+    customValidators: IFormValidator[];
+    type: TextFieldType;
+    variant: TextFieldVariant;
+    placeholder: string;
+    autocomplete: string;
+    pattern: string;
+    minLength: number;
+    maxLength: number;
+    label: string;
+    sublabel: string;
+    helperText: string;
+    info: string;
+    icon: string;
+    clearable: boolean;
+    clearOnHover: boolean;
+    validationTiming: TextFieldValidationTiming;
+    charCount: number;
+    counter: boolean;
+    customWidth: string;
+}
+//# sourceMappingURL=ITextField.d.ts.map

package/dist/types/components/forms/bds-text-field/types/enum.d.ts

@@ -0,0 +1,15 @@
+export declare const TEXT_FIELD_TYPES: {
+    readonly TEXT: "text";
+    readonly PASSWORD: "password";
+};
+export declare const TEXT_FIELD_VARIANTS: {
+    readonly OUTLINE: "outline";
+    readonly PLAIN: "plain";
+};
+export declare const TEXT_FIELD_VALIDATION_TIMING: {
+    readonly BLUR: "blur";
+    readonly CHANGE: "change";
+    readonly INPUT: "input";
+    readonly SUBMIT: "submit";
+};
+//# sourceMappingURL=enum.d.ts.map

package/dist/types/components/forms/bds-text-field/types/index.d.ts

@@ -0,0 +1,4 @@
+export * from './enum';
+export * from './ITextField';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/forms/bds-text-field/types/types.d.ts

@@ -0,0 +1,5 @@
+import { TEXT_FIELD_TYPES, TEXT_FIELD_VARIANTS, TEXT_FIELD_VALIDATION_TIMING } from './enum';
+export type TextFieldType = (typeof TEXT_FIELD_TYPES)[keyof typeof TEXT_FIELD_TYPES];
+export type TextFieldVariant = (typeof TEXT_FIELD_VARIANTS)[keyof typeof TEXT_FIELD_VARIANTS];
+export type TextFieldValidationTiming = (typeof TEXT_FIELD_VALIDATION_TIMING)[keyof typeof TEXT_FIELD_VALIDATION_TIMING];
+//# sourceMappingURL=types.d.ts.map

package/dist/types/components/helpers/bds-divider.d.ts

@@ -0,0 +1,26 @@
+import { IDivider } from './types/IDivider';
+/**
+ * Divider component for creating visual separators between content sections.
+ *
+ * @summary A simple visual separator that can be oriented horizontally or vertically.
+ *
+ * @csspart divider - A divider element that visually separates content.
+ *
+ * @attr {DividerOrientation} orientation - The orientation of the divider (horizontal or vertical)
+ *
+ * @property {DividerOrientation} orientation - The orientation of the divider (horizontal or vertical)
+ *
+ */
+export declare class BdsDivider implements IDivider {
+    /**
+     * The orientation of the divider.
+     * Allowed values: horizontal | vertical
+     */
+    readonly orientation: IDivider['orientation'];
+    checkPropValues(): void;
+    el: HTMLBdsDividerElement;
+    private get orientationClass();
+    componentWillLoad(): void;
+    render(): any;
+}
+//# sourceMappingURL=bds-divider.d.ts.map

package/dist/types/components/helpers/types/IDivider.d.ts

@@ -0,0 +1,5 @@
+import { DividerOrientation } from './types';
+export interface IDivider {
+    orientation: DividerOrientation;
+}
+//# sourceMappingURL=IDivider.d.ts.map

package/dist/types/components/helpers/types/enum.d.ts

@@ -0,0 +1,5 @@
+export declare const DIVIDER_ORIENTATIONS: {
+    readonly HORIZONTAL: "horizontal";
+    readonly VERTICAL: "vertical";
+};
+//# sourceMappingURL=enum.d.ts.map

package/dist/types/components/helpers/types/types.d.ts

@@ -0,0 +1,3 @@
+import { DIVIDER_ORIENTATIONS } from './enum';
+export type DividerOrientation = (typeof DIVIDER_ORIENTATIONS)[keyof typeof DIVIDER_ORIENTATIONS];
+//# sourceMappingURL=types.d.ts.map

package/dist/types/components/images-icons/bds-avatar/bds-avatar.d.ts

@@ -0,0 +1,51 @@
+import { IAvatar } from './types';
+/**
+ * Avatar component used to display user initials or names for visual identification.
+ *
+ * @summary Displays a circular avatar with user initials and optional name label.
+ * Uses Boreal Design System tokens for consistent styling across platforms.
+ *
+ * @attr {string} username - The full name used to generate initials or display as label.
+ * @attr {"icon"|"name"|"full"} variant - Controls which avatar elements are displayed: icon (initials), name, or both.
+ * @attr {string} background - Custom background color (hex code), defaults to $boreal-ui-success-base.
+ * @attr {string} initialsColor - Custom initials text color (hex code), defaults to $boreal-text-inverse.
+ *
+ * @property {string} username - The full name used to generate initials or display as label.
+ * @property {"icon"|"name"|"full"} variant - Controls which avatar elements are displayed: icon (initials), name, or both.
+ * @property {string} background - Custom background color (hex code), defaults to $boreal-ui-success-base.
+ * @property {string} initialsColor - Custom initials text color (hex code), defaults to $boreal-text-inverse.
+ *
+ * @cssprop --bds-avatar-background - Custom background color HEX code.
+ * @cssprop --bds-avatar-initials-color - Custom text color HEX code.
+ */
+export declare class BdsAvatar implements IAvatar {
+    private inheritedAttributes;
+    /** The full name used to generate initials or display as label **/
+    readonly username: IAvatar['username'];
+    /**
+     * Controls which avatar elements are displayed: icon (initials), name, or both.
+     * @default 'full'
+     */
+    readonly variant: IAvatar['variant'];
+    /** Custom background color as hex code. If not provided, defaults to Boreal success color **/
+    readonly background: IAvatar['background'];
+    /** Custom text color as hex code. If not provided, defaults to white **/
+    readonly initialsColor: IAvatar['initialsColor'];
+    el: HTMLBdsAvatarElement;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    private checkPropValues;
+    private get normalizedUsername();
+    /**
+     * Utility function to extract initials from the username.
+     * Takes the first letter of the first and last name.
+     * Examples: "John Doe" -> "JD", "John" -> "J", "" -> ""
+     *
+     * @param name - The full name to extract initials from
+     * @returns The initials (up to 2 characters)
+     */
+    private extractInitials;
+    private getAvatarStyles;
+    render(): any;
+}
+//# sourceMappingURL=bds-avatar.d.ts.map

package/dist/types/components/images-icons/bds-avatar/types/IAvatar.d.ts

@@ -0,0 +1,9 @@
+import { AvatarVariant } from './types';
+/** * Interface for the BdsAvatar component props and methods. */
+export interface IAvatar {
+    username: string;
+    variant: AvatarVariant;
+    background?: string;
+    initialsColor?: string;
+}
+//# sourceMappingURL=IAvatar.d.ts.map

package/dist/types/components/images-icons/bds-avatar/types/enum.d.ts

@@ -0,0 +1,6 @@
+export declare const AVATAR_VARIANT: {
+    readonly ICON: "icon";
+    readonly NAME: "name";
+    readonly FULL: "full";
+};
+//# sourceMappingURL=enum.d.ts.map

package/dist/types/components/images-icons/bds-avatar/types/index.d.ts

@@ -0,0 +1,4 @@
+export * from './enum';
+export * from './types';
+export * from './IAvatar';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/images-icons/bds-avatar/types/types.d.ts

@@ -0,0 +1,3 @@
+import { AVATAR_VARIANT } from './enum';
+export type AvatarVariant = (typeof AVATAR_VARIANT)[keyof typeof AVATAR_VARIANT];
+//# sourceMappingURL=types.d.ts.map

package/dist/types/components/layouts/bds-grid/grid/bds-grid.d.ts

@@ -0,0 +1,19 @@
+import { type IGrid } from './types';
+/**
+ * 12-column CSS Grid layout container with 5 responsive breakpoints.
+ *
+ * Minimum browser support: Chrome/Edge (last 2), Firefox (last 2), Safari (last 2).
+ *
+ * @slot - Direct `bds-grid-item` children.
+ */
+export declare class BdsGrid implements IGrid {
+    el: HTMLBdsGridElement;
+    /** `'fluid'` fills full width; `'fixed'` caps the column area at 960px and centres the container. */
+    readonly layout: IGrid['layout'];
+    /** Overrides the row gap independently of the column gutter. */
+    readonly rowGap: IGrid['rowGap'];
+    checkPropValues(): void;
+    componentWillLoad(): void;
+    render(): any;
+}
+//# sourceMappingURL=bds-grid.d.ts.map