Utilities

Stop Propagation

Keeps a click (or other events) inside an element — a menu button in a clickable card or row.

Part of @tectra-ng/utils (npm install @tectra-ng/utils, also included in tectra-ng).

Features1

API

Theming

Basic

The card opens on click; the star button inside it does its own thing and the card does not open.

Quarterly report

Updated today

Opened 0 times · not starred

22 lines

<div class="stack">  <tx-card    class="card"    title="Quarterly report"    subtitle="Updated today"    (click)="opened.update((count) => count + 1)"  >    <button      txButton      text      rounded      txStopPropagation      [icon]="starred() ? 'star-fill' : 'star'"      [attr.aria-pressed]="starred()"      aria-label="Star"      (click)="starred.set(!starred())"    ></button>  </tx-card>  <span class="hint"    >Opened {{ opened() }} times · {{ starred() ? 'starred' : 'not starred' }}</span  ></div>