@actabldesign/bellhop-core 0.0.3

package/types/components/bh-button/bh-button.d.ts

@@ -0,0 +1,57 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type ButtonHierarchy = 'primary' | 'secondary' | 'tertiary' | 'quaternary';
+export type ButtonIconPosition = 'none' | 'leading' | 'trailing' | 'only';
+export type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';
+export type ButtonKind = 'default' | 'destructive' | 'success';
+export type ButtonType = 'button' | 'submit' | 'reset';
+export declare class BhButton {
+    /**
+     * The visual hierarchy of the button
+     */
+    hierarchy: ButtonHierarchy;
+    /**
+     * The kind/semantic meaning of the button
+     */
+    kind: ButtonKind;
+    /**
+     * Icon position relative to the label
+     */
+    icon: ButtonIconPosition;
+    /**
+     * The size of the button
+     */
+    size: ButtonSize;
+    /**
+     * Fallback text label (used only if no slot content is provided)
+     */
+    label?: string;
+    /**
+     * Material Symbols icon name (e.g., 'add', 'edit', 'delete')
+     */
+    iconName?: string;
+    /**
+     * Whether the button is disabled
+     */
+    disabled: boolean;
+    /**
+     * Whether the button is in a loading state
+     */
+    loading: boolean;
+    /**
+     * The type of button for form submission
+     * - 'button': No form submission (default)
+     * - 'submit': Submits the form
+     * - 'reset': Resets the form
+     */
+    type: ButtonType;
+    /**
+     * Emitted when the button is clicked
+     */
+    bhClick: EventEmitter<MouseEvent>;
+    private handleClick;
+    private getIconSizeClass;
+    private getTextSizeClass;
+    private getLoaderSize;
+    private getLoaderVariant;
+    render(): any;
+}

package/types/components/bh-button-icon/bh-button-icon.d.ts

@@ -0,0 +1,44 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type ButtonIconHierarchy = 'primary' | 'secondary' | 'tertiary' | 'quaternary';
+export type ButtonIconSize = 'xs' | 'sm' | 'md' | 'lg';
+export type ButtonIconType = 'button' | 'submit' | 'reset';
+export declare class BhButtonIcon {
+    /**
+     * The visual hierarchy of the button
+     */
+    hierarchy: ButtonIconHierarchy;
+    /**
+     * The size of the button
+     */
+    size: ButtonIconSize;
+    /**
+     * The icon name (Material Symbols)
+     */
+    iconName: string;
+    /**
+     * Whether the button is disabled
+     */
+    disabled: boolean;
+    /**
+     * Whether the button is in loading state
+     */
+    loading: boolean;
+    /**
+     * The type of button for form submission
+     * - 'button': No form submission (default)
+     * - 'submit': Submits the form
+     * - 'reset': Resets the form
+     */
+    type: ButtonIconType;
+    /**
+     * Accessible label for the button
+     */
+    ariaLabel: string | null;
+    /**
+     * Emitted when the button is clicked
+     */
+    bhClick: EventEmitter<MouseEvent>;
+    private handleClick;
+    private handleKeyDown;
+    render(): any;
+}

package/types/components/bh-card/bh-card.d.ts

@@ -0,0 +1,23 @@
+export declare class BhCard {
+    el: HTMLElement;
+    /**
+     * Whether to show the header section
+     */
+    showHeader: boolean;
+    /**
+     * Whether to show the footer section
+     */
+    showFooter: boolean;
+    /**
+     * Minimum height of the content area in pixels
+     */
+    contentMinHeight: number;
+    /**
+     * Placeholder text shown when no content is provided
+     */
+    placeholderText: string;
+    hasContent: boolean;
+    componentWillLoad(): void;
+    private checkForContent;
+    render(): any;
+}

package/types/components/bh-card-footer/bh-card-footer.d.ts

@@ -0,0 +1,12 @@
+export type CardFooterAlignment = 'left' | 'right' | 'space-between';
+export declare class BhCardFooter {
+    /**
+     * Whether to show the divider above the footer
+     */
+    showDivider: boolean;
+    /**
+     * Alignment of the footer content
+     */
+    alignment: CardFooterAlignment;
+    render(): any;
+}

package/types/components/bh-card-header/bh-card-header.d.ts

@@ -0,0 +1,59 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type CardHeaderFeaturedIconStyle = 'outlined' | 'filled';
+export type CardHeaderFeaturedIconColor = 'brand' | 'gray' | 'error' | 'warning' | 'success' | 'highlight';
+export declare class BhCardHeader {
+    /**
+     * Whether to show the featured icon
+     */
+    showFeaturedIcon: boolean;
+    /**
+     * The Material Symbol icon name for the featured icon
+     */
+    featuredIcon: string;
+    /**
+     * The style of the featured icon
+     */
+    featuredIconStyle: CardHeaderFeaturedIconStyle;
+    /**
+     * The color of the featured icon
+     */
+    featuredIconColor: CardHeaderFeaturedIconColor;
+    /**
+     * Whether to show the title
+     */
+    showTitle: boolean;
+    /**
+     * The title text
+     */
+    headerTitle: string;
+    /**
+     * Whether to show the badge
+     */
+    showBadge: boolean;
+    /**
+     * The badge text
+     */
+    badgeText: string;
+    /**
+     * Whether to show the supporting text
+     */
+    showSupportingText: boolean;
+    /**
+     * The supporting text (description)
+     */
+    supportingText: string;
+    /**
+     * Whether to show the dropdown menu button
+     */
+    showDropdown: boolean;
+    /**
+     * Whether to show the divider
+     */
+    showDivider: boolean;
+    /**
+     * Emitted when the dropdown button is clicked
+     */
+    bhDropdownClick: EventEmitter<void>;
+    private handleDropdownClick;
+    render(): any;
+}

package/types/components/bh-chart-tooltip/bh-chart-tooltip.d.ts

@@ -0,0 +1,40 @@
+export interface TooltipItem {
+    color?: string;
+    label?: string;
+    value: string;
+}
+export declare class BhChartTooltip {
+    /**
+     * Whether the tooltip is visible
+     */
+    visible: boolean;
+    /**
+     * X position of the tooltip (in pixels)
+     */
+    x: number;
+    /**
+     * Y position of the tooltip (in pixels)
+     */
+    y: number;
+    /**
+     * Header text for the tooltip
+     */
+    header: string;
+    /**
+     * Items to display in the tooltip
+     */
+    items: TooltipItem[];
+    /**
+     * Total value to display
+     */
+    total: string;
+    /**
+     * Whether to show the total
+     */
+    showTotal: boolean;
+    /**
+     * Whether in storybook mode (for static positioning)
+     */
+    storybookMode: boolean;
+    render(): any;
+}

package/types/components/bh-checkbox/bh-checkbox.d.ts

@@ -0,0 +1,45 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type CheckboxSize = 'sm' | 'md';
+export declare class BhCheckbox {
+    el: HTMLElement;
+    internals: ElementInternals;
+    private inputRef?;
+    private uniqueId;
+    /** Checkbox size */
+    size: CheckboxSize;
+    /** Checked state */
+    checked: boolean;
+    /** Indeterminate state */
+    indeterminate: boolean;
+    /** Disabled state */
+    disabled: boolean;
+    /** Name attribute for form submission */
+    name: string;
+    /** Value attribute for form submission */
+    value: string;
+    /** Optional label text - when provided, renders checkbox with label */
+    label: string;
+    /** Optional supporting text below the label */
+    supportingText: string;
+    /** Whether the checkbox is required */
+    required: boolean;
+    /** Default checked state for form reset */
+    defaultChecked: boolean;
+    /** Internal hover state */
+    isHovered: boolean;
+    /** Internal focus state */
+    isFocused: boolean;
+    /** Emitted when checkbox state changes via user interaction */
+    bhChange: EventEmitter<boolean>;
+    handleCheckedChange(newValue: boolean): void;
+    handleIndeterminateChange(newValue: boolean): void;
+    componentDidLoad(): void;
+    formResetCallback(): void;
+    private handleChange;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    private handleFocus;
+    private handleBlur;
+    private renderCheckboxControl;
+    render(): any;
+}

package/types/components/bh-checkbox-group/bh-checkbox-group.d.ts

@@ -0,0 +1,34 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type CheckboxGroupType = 'checkbox' | 'radio' | 'icon-simple';
+export declare class BhCheckboxGroup {
+    el: HTMLElement;
+    /**
+     * The type of input controls in the group
+     */
+    type: CheckboxGroupType;
+    /**
+     * The name for radio group (required for radio type)
+     */
+    name: string;
+    /**
+     * Current selected value(s)
+     * For checkbox: array of values
+     * For radio: single value string
+     */
+    value: string | string[];
+    /**
+     * Whether all items in the group are disabled
+     */
+    disabled: boolean;
+    /**
+     * Emitted when selection changes
+     */
+    bhChange: EventEmitter<string | string[]>;
+    handleItemChange(event: CustomEvent<{
+        value: string;
+        checked: boolean;
+    }>): void;
+    componentDidLoad(): void;
+    private updateChildItems;
+    render(): any;
+}

package/types/components/bh-checkbox-group-item/bh-checkbox-group-item.d.ts

@@ -0,0 +1,67 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type CheckboxGroupItemType = 'checkbox' | 'radio' | 'icon-simple';
+export type CheckboxGroupItemSize = 'sm' | 'md';
+export declare class BhCheckboxGroupItem {
+    /**
+     * The type of input control
+     */
+    type: CheckboxGroupItemType;
+    /**
+     * The size variant
+     */
+    size: CheckboxGroupItemSize;
+    /**
+     * Unique value identifier for this item
+     */
+    value: string;
+    /**
+     * Whether the item is checked (for checkbox type)
+     */
+    checked: boolean;
+    /**
+     * Whether the item is selected (for radio type)
+     */
+    selected: boolean;
+    /**
+     * Whether the item is disabled
+     */
+    disabled: boolean;
+    /**
+     * Material Symbol icon name (for icon-simple type)
+     */
+    icon: string;
+    /**
+     * Title text
+     */
+    itemTitle: string;
+    /**
+     * Subtitle text (inline with title)
+     */
+    subtitle: string;
+    /**
+     * Description text
+     */
+    description: string;
+    /**
+     * Radio group name (for radio type)
+     */
+    name: string;
+    isHovered: boolean;
+    isFocused: boolean;
+    /**
+     * Emitted when the item state changes
+     */
+    bhItemChange: EventEmitter<{
+        value: string;
+        checked: boolean;
+    }>;
+    private handleClick;
+    private handleKeyDown;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    private handleFocus;
+    private handleBlur;
+    private handleCheckboxChange;
+    private handleRadioChange;
+    render(): any;
+}

package/types/components/bh-container/bh-container.d.ts

@@ -0,0 +1,7 @@
+export declare class BhContainer {
+    /**
+     * Whether the container has a footer attached (removes bottom border radius and border)
+     */
+    withFooter: boolean;
+    render(): any;
+}

package/types/components/bh-container-footer/bh-container-footer.d.ts

@@ -0,0 +1,18 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type ContainerFooterSize = 'minimal' | 'standard';
+export declare class BhContainerFooter {
+    /**
+     * Size variant of the footer
+     */
+    size: ContainerFooterSize;
+    /**
+     * Label for the footer button
+     */
+    buttonLabel: string;
+    /**
+     * Event emitted when the button is clicked
+     */
+    bhButtonClick: EventEmitter<void>;
+    private handleButtonClick;
+    render(): any;
+}

package/types/components/bh-data-grid/bh-data-grid.d.ts

@@ -0,0 +1,235 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type DataGridColumnType = 'text' | 'number' | 'date' | 'boolean' | 'custom';
+export type DataGridSortDirection = 'asc' | 'desc' | null;
+export type DataGridSelectionMode = 'none' | 'single' | 'multiple';
+export type DataGridEditMode = 'none' | 'cell' | 'row' | 'popup';
+export type DataGridFilterOperator = 'contains' | 'equals' | 'startsWith' | 'endsWith' | 'greaterThan' | 'lessThan' | 'greaterThanOrEqual' | 'lessThanOrEqual' | 'between' | 'isEmpty' | 'isNotEmpty';
+export interface DataGridColumn<T = unknown> {
+    /** Unique identifier for the column */
+    id: string;
+    /** Header text to display */
+    header: string;
+    /** Property key to access data (supports dot notation: 'user.name') */
+    accessor: keyof T | string;
+    /** Column data type for filtering and formatting */
+    type?: DataGridColumnType;
+    /** Column width (px, %, or 'auto') */
+    width?: string | number;
+    /** Minimum column width */
+    minWidth?: number;
+    /** Enable sorting for this column */
+    sortable?: boolean;
+    /** Enable filtering for this column */
+    filterable?: boolean;
+    /** Enable editing for this column */
+    editable?: boolean;
+    /** Text alignment */
+    align?: 'left' | 'center' | 'right';
+    /** Custom cell render function (returns HTML string or VNode) */
+    cellRenderer?: (value: unknown, row: T, rowIndex: number) => unknown;
+    /** Custom header render function */
+    headerRenderer?: (column: DataGridColumn<T>) => unknown;
+    /** Custom edit cell render function */
+    editCellRenderer?: (value: unknown, row: T, rowIndex: number, onChange: (newValue: unknown) => void) => unknown;
+    /** Whether column is visible */
+    visible?: boolean;
+    /** Pin column to left or right */
+    pinned?: 'left' | 'right' | null;
+}
+export interface DataGridSortState {
+    columnId: string;
+    direction: DataGridSortDirection;
+}
+export interface DataGridFilterState {
+    columnId: string;
+    operator: DataGridFilterOperator;
+    value: unknown;
+    valueTo?: unknown;
+}
+export interface DataGridGroupState {
+    columnId: string;
+    expanded: Set<string>;
+}
+export interface DataGridRowSelection {
+    selectedRows: Set<string | number>;
+    isAllSelected: boolean;
+    isIndeterminate: boolean;
+}
+export interface DataGridGroup {
+    key: string;
+    value: unknown;
+    displayValue: string;
+    rows: unknown[];
+    depth: number;
+    columnId: string;
+}
+export interface DataGridEditState {
+    rowKey: string | number;
+    columnId: string | null;
+    originalValue: unknown;
+    currentValue: unknown;
+}
+export interface DataGridRowChanges {
+    rowKey: string | number;
+    rowIndex: number;
+    originalRow: unknown;
+    changes: Record<string, unknown>;
+}
+export declare class BhDataGrid {
+    el: HTMLElement;
+    /** Array of data objects to display */
+    data: unknown[];
+    /** Column definitions */
+    columns: DataGridColumn[];
+    /** Unique identifier property for each row (for selection tracking) */
+    rowKey: string;
+    /** Enable row selection */
+    enableSelection: boolean;
+    /** Selection mode */
+    selectionMode: DataGridSelectionMode;
+    /** Currently selected row keys (controlled) */
+    selectedKeys: (string | number)[];
+    /** Enable sorting */
+    enableSorting: boolean;
+    /** Allow multi-column sorting */
+    multiSort: boolean;
+    /** Current sort state (controlled) */
+    sortState: DataGridSortState[];
+    /** Enable filtering */
+    enableFiltering: boolean;
+    /** Show filter row below header */
+    showFilterRow: boolean;
+    /** Current filter state (controlled) */
+    filterState: DataGridFilterState[];
+    /** Enable row grouping */
+    enableGrouping: boolean;
+    /** Columns to group by */
+    groupBy: string[];
+    /** Enable editing */
+    enableEditing: boolean;
+    /** Edit mode: cell (individual cells), row (entire row), popup (modal form) */
+    editMode: DataGridEditMode;
+    /** Whether to show edit/save/cancel buttons in row actions */
+    showEditActions: boolean;
+    /** Show header row */
+    showHeader: boolean;
+    /** Show row borders */
+    showRowBorders: boolean;
+    /** Striped rows */
+    striped: boolean;
+    /** Compact row height */
+    compact: boolean;
+    /** Empty state message */
+    emptyMessage: string;
+    /** Loading state */
+    loading: boolean;
+    internalSelectedKeys: Set<string | number>;
+    internalSortState: DataGridSortState[];
+    internalFilterState: DataGridFilterState[];
+    expandedGroups: string[];
+    hoveredRowIndex: number | null;
+    filterInputValues: Record<string, string>;
+    editingRowKey: string | number | null;
+    editingColumnId: string | null;
+    editingValues: Record<string, unknown>;
+    showEditPopup: boolean;
+    activeFilterColumn: string | null;
+    /** Emitted when row selection changes */
+    bhSelectionChange: EventEmitter<{
+        selectedKeys: (string | number)[];
+        selectedRows: unknown[];
+    }>;
+    /** Emitted when sort state changes */
+    bhSortChange: EventEmitter<DataGridSortState[]>;
+    /** Emitted when filter state changes */
+    bhFilterChange: EventEmitter<DataGridFilterState[]>;
+    /** Emitted when a row is clicked */
+    bhRowClick: EventEmitter<{
+        row: unknown;
+        rowIndex: number;
+        rowKey: string | number;
+    }>;
+    /** Emitted when a cell is clicked */
+    bhCellClick: EventEmitter<{
+        row: unknown;
+        column: DataGridColumn;
+        value: unknown;
+        rowIndex: number;
+        columnIndex: number;
+    }>;
+    /** Emitted when group expand/collapse changes */
+    bhGroupToggle: EventEmitter<{
+        groupKey: string;
+        expanded: boolean;
+    }>;
+    /** Emitted when editing starts */
+    bhEditStart: EventEmitter<{
+        rowKey: string | number;
+        row: unknown;
+        columnId?: string;
+    }>;
+    /** Emitted when editing is cancelled */
+    bhEditCancel: EventEmitter<{
+        rowKey: string | number;
+        row: unknown;
+    }>;
+    /** Emitted when changes are saved */
+    bhEditSave: EventEmitter<DataGridRowChanges>;
+    /** Emitted when a cell value changes during editing (before save) */
+    bhCellChange: EventEmitter<{
+        rowKey: string | number;
+        columnId: string;
+        oldValue: unknown;
+        newValue: unknown;
+    }>;
+    handleSelectedKeysChange(newValue: (string | number)[]): void;
+    handleSortStateChange(newValue: DataGridSortState[]): void;
+    handleFilterStateChange(newValue: DataGridFilterState[]): void;
+    componentWillLoad(): void;
+    private getRowKey;
+    private getCellValue;
+    private getVisibleColumns;
+    private getProcessedData;
+    private applyFilters;
+    private matchesFilter;
+    private applySorting;
+    private getGroupedData;
+    private groupByColumn;
+    private handleGroupToggle;
+    private handleSelectAll;
+    private handleRowSelect;
+    private emitSelectionChange;
+    private getSelectionState;
+    private handleSort;
+    private getSortDirection;
+    private handleFilterInput;
+    private toggleFilterPopover;
+    private handleRowClick;
+    private handleCellClick;
+    private renderHeader;
+    private renderHeaderCell;
+    private renderFilterRow;
+    private renderFilterCell;
+    private renderBody;
+    private renderGroupSectionWithState;
+    private renderGroupRow;
+    private isGroupAllSelected;
+    private isGroupIndeterminate;
+    private handleGroupSelect;
+    private startEditing;
+    private cancelEditing;
+    private saveEditing;
+    private handleEditValueChange;
+    private isEditing;
+    private handleCellDoubleClick;
+    private handleEditKeyDown;
+    private moveToNextEditableCell;
+    private renderRow;
+    private renderRowActions;
+    private renderCell;
+    private renderEditInput;
+    private formatCellValue;
+    private renderEmptyState;
+    private renderLoading;
+    render(): any;
+}