ArtificialSenseDocs
Home
Enterprise
  • Audit TimelineNew
  • Automation EditorNew
Blocks
  • CatalogNew
Form controls
  • Button
  • Input
  • Select
  • Checkbox
Display
  • Icon
  • Badge
  • Alert
  • Spinner
Infrastructure
  • Internationalization
  • Core utilities

Docs / Components

SenseBreadcrumbComponent

Breadcrumb trail from @artificialsenselabs/ui showing the current page location within a site hierarchy.

Live demo: run nx serve showcase and open /components/breadcrumb (port 4202).

Overview

Category: Layout. Selector: sense-breadcrumb. Import: import { SenseBreadcrumbComponent } from '@artificialsenselabs/ui';

<sense-breadcrumb
  [home]="{ icon: 'home', routerLink: '/' }"
  [items]="[
    { label: 'Products', routerLink: '/products' },
    { label: 'Detail' }
  ]"
/>

Inputs

InputTypeDefaultDescription
itemsSenseBreadcrumbItem[][]Ordered trail crumbs after the optional home crumb.
homeSenseBreadcrumbItem | nullnullOptional leading home crumb, often icon-only.
size'sm' | 'md' | 'lg''md'Density preset.
ariaLabelstring | nullnullNavigation landmark label; falls back to i18n.
styleClassstring | nullnullAdditional host classes.

Accessibility

  • Renders an ordered list inside a navigation landmark.
  • The last crumb is marked aria-current="page" and is not interactive.
  • Use routerLink, url, or command on ancestor crumbs.

APG reference: WAI-ARIA breadcrumb pattern.

ArtificialSense

AI-Native Enterprise Engineering Studio

SuiteComponent docsShowcase — nx serve showcaseStudio site — nx serve website

© ArtificialSense · @artificialsenselabs/ui (MIT) & @artificialsenselabs/enterprise (Elastic License 2.0)

Privacy & telemetry

We use optional telemetry to measure performance, understand page usage, and catch errors in production. No third-party scripts load until you choose. Privacy policy