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

package/dist/types/components/actions/bds-toggle/bds-toggle.d.ts

@@ -0,0 +1,91 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+import { IFormControl } from "../../../mixins/index";
+import { IToggle } from './types';
+import { IToggleEventChange } from './types/IEventChange';
+declare const BdsToggle_base: abstract new (...args: any[]) => {
+    formDisabledCallback(disabled: boolean): void;
+};
+/**
+ * Toggle/Switch component for boolean selection.
+ *
+ * @summary A toggle switch form control with label positioning support.
+ *
+ * @slot - Default slot for label content (used when `label` prop is not provided).
+ * @slot help-text - Slot for help text below the toggle (used when `helperText` prop is not provided).
+ *
+ * @property {string}  name        - Name of the form control, submitted as a key in the form data.
+ * @property {boolean} disabled    - Disables the control. Defaults to `false`.
+ * @property {boolean} required    - Marks the control as required for form submission. Defaults to `false`.
+ * @property {boolean} checked     - Whether the toggle is on. Defaults to `false`.
+ * @property {string}  placement   - Position of the label relative to the switch. Accepts `TOGGLE_PLACEMENT` values. Defaults to `"left"`.
+ * @property {string}  label       - Label displayed next to the toggle. Defaults to `""`.
+ * @property {string}  helperText  - Help text displayed below the toggle. Defaults to `""`.
+ * @property {string}  value       - Value submitted with the form data when checked. Defaults to `"on"`.
+ *
+ * @fires valueChange - Emitted when the checked state changes (for 2-way binding / v-model). Payload: `boolean`.
+ * @fires bdsChange   - Emitted when the user toggles the switch. Payload: `IToggleEventChange`.
+ */
+export declare class BdsToggle extends BdsToggle_base implements IToggle, IFormControl<boolean> {
+    private inheritedAttributes;
+    el: HTMLBdsToggleElement;
+    internals: ElementInternals;
+    /** Name of the form control, submitted as a key in the form data. */
+    readonly name: IToggle['name'];
+    /** Disables the control. Defaults to `false`. */
+    readonly disabled: IToggle['disabled'];
+    /** Marks the control as required for form submission. Defaults to `false`. */
+    readonly required: IToggle['required'];
+    /** Tooltip content attached to the label. Rendered via `bds-typography` `tooltipText` prop. */
+    readonly info: IToggle['info'];
+    /** When `true`, applies the error visual state. */
+    readonly error: IToggle['error'];
+    /** Message shown below the input when `error` is `true`. Replaces `helperText`. */
+    readonly errorMessage: IToggle['errorMessage'];
+    /** Whether the toggle is on. Defaults to `false`. */
+    readonly checked: IToggle['checked'];
+    /**
+     * Position of the label relative to the switch.
+     * Accepts `TOGGLE_PLACEMENT` values. Defaults to `TOGGLE_PLACEMENT.LEFT`.
+     */
+    readonly placement: IToggle['placement'];
+    /** Label displayed next to the toggle. Defaults to `""`. */
+    readonly label: IToggle['label'];
+    /** Help text displayed below the toggle. Defaults to `""`. */
+    readonly helperText: IToggle['helperText'];
+    /**
+     * Value submitted with the form data when checked.
+     * Behaves like the `value` attribute of a native `<input type="checkbox">`. Defaults to `"on"`.
+     */
+    readonly value: IToggle['value'];
+    /** Emitted when the checked state changes. Useful for 2-way binding / v-model. Payload: `boolean`. */
+    valueChange: EventEmitter<boolean>;
+    /** Emitted when the user toggles the switch. Payload: `{ checked: boolean, value: string }`. */
+    bdsChange: EventEmitter<IToggleEventChange>;
+    private readonly _id;
+    /** Internal mirror of the `disabled` prop, kept in sync via `@Watch` and `formDisabledCallback`. */
+    private isDisabled;
+    /** `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;
+    /** Local mirror of the `checked` prop, kept in sync via `@Watch` and `formStateRestoreCallback`. */
+    private isChecked;
+    componentWillLoad(): void;
+    onCheckedChange(newValue: boolean): void;
+    onDisabledChange(next: boolean): void;
+    formAssociatedCallback(): void;
+    formDisabledCallback(disabled: boolean): void;
+    formResetCallback(): void;
+    formStateRestoreCallback(state: unknown, _mode: string): void;
+    private syncFormValue;
+    private validate;
+    private toggle;
+    private handleClick;
+    private handleKeyDown;
+    private get containerClasses();
+    private get canShowLabel();
+    private handleInvalid;
+    render(): any;
+}
+export {};
+//# sourceMappingURL=bds-toggle.d.ts.map

package/dist/types/components/actions/bds-toggle/types/IEventChange.d.ts

@@ -0,0 +1,5 @@
+export interface IToggleEventChange {
+    checked: boolean;
+    value: string;
+}
+//# sourceMappingURL=IEventChange.d.ts.map

package/dist/types/components/actions/bds-toggle/types/IToggle.d.ts

@@ -0,0 +1,12 @@
+import { ComponentInterface } from '../../../../stencil-public-runtime';
+import { TogglePlacementType } from './types';
+import { IFormProps } from "../../../../types/IFormProps";
+export interface IToggle extends ComponentInterface, IFormProps {
+    name: string;
+    disabled: boolean;
+    required: boolean;
+    placement: TogglePlacementType;
+    checked: boolean;
+    value: string;
+}
+//# sourceMappingURL=IToggle.d.ts.map

package/dist/types/components/actions/bds-toggle/types/enum.d.ts

@@ -0,0 +1,5 @@
+export declare const TOGGLE_PLACEMENT: {
+    readonly LEFT: "left";
+    readonly RIGHT: "right";
+};
+//# sourceMappingURL=enum.d.ts.map

package/dist/types/components/actions/bds-toggle/types/index.d.ts

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

package/dist/types/components/actions/bds-toggle/types/types.d.ts

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

package/dist/types/components/feedback/bds-badge/bds-badge.d.ts

@@ -0,0 +1,31 @@
+import type { IBadge } from './types/IBadge';
+/**
+ * Badge component for displaying contextual status information with optional icon support.
+ *
+ * @summary A compact label component that communicates status or category using color-coded variants. Supports an optional icon slot and a disabled state.
+ *
+ * @slot - The text content of the badge.
+ * @slot icon - An icon displayed before the badge text content.
+ *
+ * @attr {string} variant - Controls the visual style of the badge. Accepted values: 'default' | 'info' | 'success' | 'warning' | 'danger'. Default is 'default'.
+ * @attr {boolean} disabled - Disables the badge when true, reducing opacity and preventing pointer interaction. Default is false.
+ *
+ * @property {string} variant - Controls the visual style of the badge. Accepted values: 'default' | 'info' | 'success' | 'warning' | 'danger'. Default is 'default'.
+ * @property {boolean} disabled - Disables the badge when true, reducing opacity and preventing pointer interaction. Default is false.
+ */
+export declare class BdsBadge implements IBadge {
+    /** Controls the visual style of the badge. Accepted values: 'default' | 'info' | 'success' | 'warning' | 'danger'. Default is 'default'. */
+    readonly variant: IBadge['variant'];
+    /** Disables the badge when true, reducing opacity and preventing pointer interaction. Default is false. */
+    readonly disabled: IBadge['disabled'];
+    /** Reference to the host element, used for prop validation warnings. */
+    el: HTMLBdsBadgeElement;
+    /** Validates the `variant` prop against allowed values and resets to the default if invalid. */
+    private checkPropValues;
+    /** Runs prop validation before the component is first rendered. */
+    componentWillLoad(): void;
+    /** Builds the BEM class map applied to the host element based on the current prop values. */
+    private get badgeClasses();
+    render(): any;
+}
+//# sourceMappingURL=bds-badge.d.ts.map

package/dist/types/components/feedback/bds-badge/types/IBadge.d.ts

@@ -0,0 +1,6 @@
+import { BadgeVariant } from './enum';
+export interface IBadge {
+    variant: BadgeVariant;
+    disabled: boolean;
+}
+//# sourceMappingURL=IBadge.d.ts.map

package/dist/types/components/feedback/bds-badge/types/enum.d.ts

@@ -0,0 +1,9 @@
+export declare const BADGE_VARIANT: {
+    readonly DEFAULT: "default";
+    readonly INFO: "info";
+    readonly SUCCESS: "success";
+    readonly WARNING: "warning";
+    readonly DANGER: "danger";
+};
+export type BadgeVariant = (typeof BADGE_VARIANT)[keyof typeof BADGE_VARIANT];
+//# sourceMappingURL=enum.d.ts.map

package/dist/types/components/feedback/bds-banner/bds-banner.d.ts

@@ -16,9 +16,9 @@ import type { IBanner } from './types/IBanner';
  * @property {boolean} closable - Shows a close button that allows users to close the banner. Defaults to false.
  * @property {boolean} closeButtonLabel - Aria label for the close button when visible.
  *
- * @fires bdsClose - Emitted when the banner is closed via the close button or `closeBanner` method.
+ * @fires bdsClose - Emitted when the banner is closed via the close button or `close` method.
  *
- * @method closeBanner - Programmatic method to close the banner and emit the `bdsClose` event.
+ * @method close - Programmatic method to close the banner and emit the `bdsClose` event.
  *
  */
 export declare class BdsBanner implements IBanner {
@@ -51,14 +51,18 @@ export declare class BdsBanner implements IBanner {
      */
     readonly closeButtonLabel: IBanner['closeButtonLabel'];
     /**
-     * Emitted when the banner is closed via the close button or closeBanner method.
+     * Emitted when the banner is closed via the close button or close method.
      */
     bdsClose: EventEmitter<void>;
     componentWillLoad(): void;
     /**
      * Programmatic method to close the banner and emit the `bdsClose` event
      */
-    closeBanner(): Promise<void>;
+    open(): Promise<void>;
+    /**
+     * Programmatic method to close the banner and emit the `bdsClose` event
+     */
+    close(): Promise<void>;
     private handleCloseBanner;
     private handleEscapeKeyClose;
     private handleAnimationEnd;

package/dist/types/components/feedback/bds-status/bds-status.d.ts

@@ -0,0 +1,26 @@
+import { IStatus } from './types/IStatus';
+/**
+ * Status badge component for communicating the current state of an item or process.
+ *
+ * @slot - The label content of the badge, typically plain text.
+ * @slot icon - Icon content rendered before the label.
+ *
+ */
+export declare class BdsStatus implements IStatus {
+    /** state is a string attribute. Controls the visual state variant of the status badge.
+     * Determines the background, accent, and text colors applied to the element.
+     * An invalid value falls back to `"neutral"` and a warning is set on the host element. */
+    readonly state: IStatus['state'];
+    /** indicator is a string attribute. Controls the type of indicator rendered before the slotted label.
+     * An invalid value falls back to `"none"` and a warning is set on the host element. */
+    readonly indicator: IStatus['indicator'];
+    el: HTMLBdsStatusElement;
+    /** Validates the `state` prop against the set of allowed values.
+     * Falls back to `"neutral"` when an invalid value is detected. */
+    checkPropValues(): void;
+    /** Before component rendered */
+    componentWillLoad(): void;
+    private get classMap();
+    render(): any;
+}
+//# sourceMappingURL=bds-status.d.ts.map

package/dist/types/components/feedback/bds-status/types/IStatus.d.ts

@@ -0,0 +1,7 @@
+import { Status } from "../../../../types/states";
+import { IndicatorTypes } from './types';
+export interface IStatus {
+    state: Status;
+    indicator: IndicatorTypes;
+}
+//# sourceMappingURL=IStatus.d.ts.map

package/dist/types/components/feedback/bds-status/types/enum.d.ts

@@ -0,0 +1,6 @@
+export declare const INDICATOR_TYPES: {
+    readonly NONE: "none";
+    readonly DOT: "dot";
+    readonly ICON: "icon";
+};
+//# sourceMappingURL=enum.d.ts.map

package/dist/types/components/feedback/bds-status/types/types.d.ts

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

package/dist/types/components/feedback/bds-tag/bds-tag.d.ts

@@ -0,0 +1,71 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+import { TagEventPayload, type ITag } from './types';
+/**
+ * Tag component used to represent categories, metadata, or removable filters.
+ *
+ * @summary Displays a label with optional leading/trailing icons and dismissal capability.
+ *
+ * @slot - Default slot for custom text content after the icon.
+ * @slot icon - Icon slot for icon content before the text.
+ *
+ * @fires bdsClose - Emitted when the tag is closed via the close button or Delete key.
+ * @fires bdsSelect - Emitted when the tag is selected via a click or Space/Enter key.
+ *
+ */
+export declare class BdsTag implements ITag {
+    private readonly _id;
+    private internalSelected;
+    /**
+     * Reference to the host element.
+     */
+    el: HTMLBdsTagElement;
+    /**
+     * Whether the tag is selectable or not.
+     * @default false
+     */
+    readonly multiselect: ITag['multiselect'];
+    /**
+     * Whether the tag is selected or not.
+     * @default false
+     */
+    readonly selected: ITag['selected'];
+    /**
+     * Aria label for the close button when visible.
+     */
+    readonly closeButtonLabel: ITag['closeButtonLabel'];
+    /**
+     * Visual color variant: 'gray', 'cyan', 'cobalt', 'teal', 'lime', 'orange', 'rose', or 'purple'.
+     * @default "gray"
+     */
+    readonly color: ITag['color'];
+    /**
+     * Hides the close button that allows users to dismiss the tag.
+     * @default false
+     */
+    readonly readonly: ITag['readonly'];
+    /**
+     * Disables interaction with the tag. Reduces opacity and prevents interactions.
+     * @default false
+     */
+    readonly disabled: ITag['disabled'];
+    /**
+     * Emitted when the tag is closed via the close button or Delete key.
+     */
+    bdsClose: EventEmitter<TagEventPayload>;
+    /**
+     * Emitted when the tag is selected via a click or Space/Enter key.
+     */
+    bdsSelect: EventEmitter<TagEventPayload>;
+    private handleClose;
+    private handleKeyDown;
+    private handleSelection;
+    componentWillLoad(): void;
+    private checkPropValues;
+    syncSelectedFromProp(newValue: boolean): void;
+    private validateMultiselectRole;
+    private getClasses;
+    private renderTag;
+    private renderCloseIcon;
+    render(): any;
+}
+//# sourceMappingURL=bds-tag.d.ts.map

package/dist/types/components/feedback/bds-tag/types/ITag.d.ts

@@ -0,0 +1,13 @@
+import type { EventEmitter } from '../../../../stencil-public-runtime';
+import { TagEventPayload, TagColor } from './types';
+export interface ITag {
+    color: TagColor;
+    readonly: boolean;
+    selected: boolean;
+    multiselect: boolean;
+    disabled: boolean;
+    closeButtonLabel: string;
+    bdsClose: EventEmitter<TagEventPayload>;
+    bdsSelect: EventEmitter<TagEventPayload>;
+}
+//# sourceMappingURL=ITag.d.ts.map

package/dist/types/components/feedback/bds-tag/types/enum.d.ts

@@ -0,0 +1,11 @@
+export declare const TAG_COLORS: {
+    readonly GRAY: "gray";
+    readonly CYAN: "cyan";
+    readonly TEAL: "teal";
+    readonly LIME: "lime";
+    readonly ORANGE: "orange";
+    readonly COBALT: "cobalt";
+    readonly ROSE: "rose";
+    readonly PURPLE: "purple";
+};
+//# sourceMappingURL=enum.d.ts.map

package/dist/types/components/feedback/bds-tag/types/index.d.ts

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

package/dist/types/components/feedback/bds-tag/types/types.d.ts

@@ -0,0 +1,8 @@
+import { TAG_COLORS } from './enum';
+export type TagColor = (typeof TAG_COLORS)[keyof typeof TAG_COLORS];
+export type TagEventPayload = {
+    id: string;
+    selected: boolean;
+    el: HTMLElement;
+};
+//# sourceMappingURL=types.d.ts.map

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

@@ -1,4 +1,3 @@
-import { StyleModifiers } from "../../../types/index";
 import { IFlag } from './interfaces/IFlag';
 /**
  * Flag component used to display a country flag together with its corresponding label.
@@ -119,17 +118,17 @@ export declare class BdsFlag implements IFlag {
      * 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.
      */
-    get isGlobal(): boolean;
+    private get isGlobal();
     /**
      * Returns the CSS class map for the Host element, reflecting the current alignment.
      * @returns Class map applied to the Host element.
      */
-    get flagClass(): StyleModifiers;
+    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.
      */
-    get flagContentClass(): StyleModifiers;
+    private get flagContentClass();
     render(): any;
 }
 //# sourceMappingURL=bds-flag.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

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

@@ -0,0 +1,6 @@
+import { GridLayout } from './types';
+export interface IGrid {
+    layout: GridLayout;
+    rowGap?: string;
+}
+//# sourceMappingURL=IGrid.d.ts.map

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

@@ -0,0 +1,5 @@
+export declare const GRID_LAYOUT: {
+    readonly FIXED: "fixed";
+    readonly FLUID: "fluid";
+};
+//# sourceMappingURL=enum.d.ts.map

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

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

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

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

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

@@ -0,0 +1,31 @@
+import { type IGridItem } from './types';
+/**
+ * Grid item child of `bds-grid`. Must be a direct child of `bds-grid`.
+ *
+ * @slot - Item content. The grid item manages position only — content styling is
+ *   the responsibility of the slotted element.
+ */
+export declare class BdsGridItem implements IGridItem {
+    el: HTMLBdsGridItemElement;
+    /** Column span at all breakpoints (fallback). `'full'` spans all columns (`grid-column: 1 / -1`). */
+    readonly colSpan: IGridItem['colSpan'];
+    /** Override col-span at the `sm` breakpoint (≥320px). */
+    readonly colSpanSm: IGridItem['colSpanSm'];
+    /** Override col-span at the `md` breakpoint (≥769px). */
+    readonly colSpanMd: IGridItem['colSpanMd'];
+    /** Override col-span at the `lg` breakpoint (≥960px). */
+    readonly colSpanLg: IGridItem['colSpanLg'];
+    /** Override col-span at the `xl` breakpoint (≥1152px). */
+    readonly colSpanXl: IGridItem['colSpanXl'];
+    /** Override col-span at the `2xl` breakpoint (≥1344px). */
+    readonly colSpan2xl: IGridItem['colSpan2xl'];
+    /** Row span. `'full'` maps to `grid-row: 1 / -1`. */
+    readonly rowSpan: IGridItem['rowSpan'];
+    /** Column offset: shifts the item right by N columns (0–11). */
+    readonly offset: IGridItem['offset'];
+    checkPropValues(): void;
+    componentWillLoad(): void;
+    private getHostStyles;
+    render(): any;
+}
+//# sourceMappingURL=bds-grid-item.d.ts.map

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

@@ -0,0 +1,12 @@
+import { ColSpanValue, RowSpanValue } from './types';
+export interface IGridItem {
+    colSpan: ColSpanValue;
+    colSpanSm?: ColSpanValue;
+    colSpanMd?: ColSpanValue;
+    colSpanLg?: ColSpanValue;
+    colSpanXl?: ColSpanValue;
+    colSpan2xl?: ColSpanValue;
+    rowSpan?: RowSpanValue;
+    offset: number;
+}
+//# sourceMappingURL=IGridItem.d.ts.map

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

@@ -0,0 +1,11 @@
+export declare const GRID_ITEM_COL_SPAN: {
+    readonly SM_MAX: 4;
+    readonly MD_MAX: 8;
+    readonly LG_MAX: 12;
+    readonly XL_MAX: 12;
+    readonly XXL_MAX: 12;
+    readonly DEFAULT: 12;
+    readonly OFFSET_MIN: 0;
+    readonly OFFSET_MAX: 11;
+};
+//# sourceMappingURL=enum.d.ts.map

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

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