@lilydesignsystem/angular-headless 0.4.0 → 0.6.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lilydesignsystem/angular-headless",
-  "version": "0.4.0",
+  "version": "0.6.0",
   "engines": {
     "node": "=26"
   },
@@ -23,7 +23,8 @@
   "author": "Joel Parker Henderson <joel@joelparkerhenderson.com>",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/LilyDesignSystem/lily-design-system-angular-headless.git"
+    "url": "git+https://github.com/LilyDesignSystem/lily-design-system.git",
+    "directory": "lily-design-system-angular-headless"
   },
   "homepage": "https://lilydesignsystem.com/",
   "bugs": {

package/types/lilydesignsystem-angular-headless.d.ts

@@ -3670,6 +3670,10 @@ export declare class ContentsLink {
   readonly href: import("@angular/core").InputSignal<string>;
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Sets data-count on the link (and data-complete when 0). */
+  readonly count: import("@angular/core").InputSignal<number | undefined>;
+  /** Visible, localised count text (e.g. "3 to do"), rendered inside the link after the text. */
+  readonly countLabel: import("@angular/core").InputSignal<string | undefined>;
   static ɵfac: i0.ɵɵFactoryDeclaration<ContentsLink, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ContentsLink, "lily-contents-link", never, {
     "href": {
@@ -3687,6 +3691,16 @@ export declare class ContentsLink {
       "required": false;
       "isSignal": true;
     };
+    "count": {
+      "alias": "count";
+      "required": false;
+      "isSignal": true;
+    };
+    "countLabel": {
+      "alias": "countLabel";
+      "required": false;
+      "isSignal": true;
+    };
   }, {}, never, ["*"], true, never>;
 }
 /**
@@ -3737,15 +3751,55 @@ export declare class ContentsListItem {
   }, {}, never, ["*"], true, never>;
 }
 /**
- * ContentsNav — a contents navigation area
+ * Which section is current: the last whose top has passed the activation line
+ * (`tops` are each section's top relative to the scroller; `offset` is the line).
+ * At the bottom of the scroll range the last section wins (a short last section
+ * never reaches the line); before the first section, the first.
+ */
+declare function activeSectionIndex(tops: number[], offset: number, atBottom: boolean): number;
+/** The in-page `<a href="#id">` links inside `nav`. */
+declare function contentsLinks(nav: Element): HTMLAnchorElement[];
+declare function contentsLinkId(link: Element): string;
+declare function contentsTarget(link: Element, doc: Document): HTMLElement | null;
+export type ScrollspyOptions = {
+  /** Activation line, px below the top of `root`. */
+  offset?: number;
+  /** A scrolling element other than the viewport. */
+  root?: HTMLElement | null;
+  /** The `aria-current` token set on the active link. */
+  current?: string;
+  /** Called once per change, with the section id. */
+  onChange?: (id: string) => void;
+};
+/**
+ * Mark the link of the section in view with `aria-current` and `data-active`
+ * (and its enclosing `<li>`s with `data-descendant-active`). Returns a function
+ * that stops listening.
+ */
+declare function startScrollspy(nav: HTMLElement, options?: ScrollspyOptions): () => void;
+/**
+ * ContentsNav — a navigation landmark for a table of contents.
  *
- * Headless Angular component. Renders the semantic HTML root with the
- * kebab-case class hook `contents-nav` and the consumer-provided `className`.
- * Ships zero CSS; the consumer styles via the class hook.
+ * With `spy` it also marks the link of the section currently in view
+ * (`aria-current` and `data-active`): the links are the consumer's own
+ * `<a href="#id">` elements projected into the nav. See the component's
+ * `index.md` for the rules (activation line, bottom of page, click lock).
  */
 export declare class ContentsNav {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Scrollspy: mark the link of the section currently in view. */
+  readonly spy: import("@angular/core").InputSignal<boolean>;
+  /** Activation line, px below the top of `root`; set to a fixed header's height. */
+  readonly offset: import("@angular/core").InputSignal<number>;
+  /** A scrolling element other than the viewport. */
+  readonly root: import("@angular/core").InputSignal<HTMLElement | null>;
+  /** The aria-current token set on the active link. */
+  readonly current: import("@angular/core").InputSignal<string>;
+  /** The id of the section currently in view (spy only). Two-way bindable: `[(active)]`. */
+  readonly active: import("@angular/core").ModelSignal<string>;
+  private readonly navEl;
+  constructor();
   static ɵfac: i0.ɵɵFactoryDeclaration<ContentsNav, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ContentsNav, "lily-contents-nav", never, {
     "label": {
@@ -3758,7 +3812,34 @@ export declare class ContentsNav {
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+    "spy": {
+      "alias": "spy";
+      "required": false;
+      "isSignal": true;
+    };
+    "offset": {
+      "alias": "offset";
+      "required": false;
+      "isSignal": true;
+    };
+    "root": {
+      "alias": "root";
+      "required": false;
+      "isSignal": true;
+    };
+    "current": {
+      "alias": "current";
+      "required": false;
+      "isSignal": true;
+    };
+    "active": {
+      "alias": "active";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "active": "activeChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * ContextMenu — a menu that appears on right-click or long-press
@@ -4311,15 +4392,26 @@ export declare class DateInput {
   }, never, never, true, never>;
 }
 /**
- * DateRange — a display of a start and end date range
+ * DateRange — paired start and end date inputs <fieldset><input type="date">
  *
- * Headless Angular component. Renders the semantic HTML root with the
- * kebab-case class hook `date-range` and the consumer-provided `className`.
- * Ships zero CSS; the consumer styles via the class hook.
+ * Headless Angular component. Renders a semantic `<fieldset>` with the
+ * kebab-case class hook `date-range` and the consumer-provided `className`,
+ * holding two native `<input type="date">` elements (class `date-input`),
+ * each with its own accessible name. Ships zero CSS.
  */
 export declare class DateRange {
+  /** Accessible group label, applied to the fieldset via aria-label. */
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Accessible label for the start date input. */
+  readonly startLabel: import("@angular/core").InputSignal<string>;
+  /** Accessible label for the end date input. */
+  readonly endLabel: import("@angular/core").InputSignal<string>;
+  /** Extra CSS classes appended to the base class. */
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Start date, YYYY-MM-DD. Bindable. */
+  readonly start: import("@angular/core").ModelSignal<string>;
+  /** End date, YYYY-MM-DD. Bindable. */
+  readonly end: import("@angular/core").ModelSignal<string>;
   static ɵfac: i0.ɵɵFactoryDeclaration<DateRange, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<DateRange, "lily-date-range", never, {
     "label": {
@@ -4327,12 +4419,35 @@ export declare class DateRange {
       "required": false;
       "isSignal": true;
     };
+    "startLabel": {
+      "alias": "startLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "endLabel": {
+      "alias": "endLabel";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+    "start": {
+      "alias": "start";
+      "required": false;
+      "isSignal": true;
+    };
+    "end": {
+      "alias": "end";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "start": "startChange";
+    "end": "endChange";
+  }, never, never, true, never>;
 }
 /**
  * DateTimeLocalInput — an input for entering a date and time without time zone <input type="datetime-local">
@@ -13238,14 +13353,19 @@ export declare class Resizable {
   }, {}, never, ["*"], true, never>;
 }
 /**
- * ReviewDate — a display of a content review date
+ * ReviewDate — a display of a content review date <time>
  *
- * Headless Angular component. Renders the semantic HTML root with the
- * kebab-case class hook `review-date` and the consumer-provided `className`.
- * Ships zero CSS; the consumer styles via the class hook.
+ * Headless Angular component. Renders a semantic `<time>` with the
+ * kebab-case class hook `review-date`, the consumer-provided `className`,
+ * and a machine-readable `datetime` (ISO 8601); the projected content is the
+ * human-readable, localised date text. Ships zero CSS.
  */
 export declare class ReviewDate {
+  /** Accessible label giving screen readers context for the date. */
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Machine-readable date/time in ISO 8601 format. */
+  readonly datetime: import("@angular/core").InputSignal<string>;
+  /** Extra CSS classes appended to the base class. */
   readonly className: import("@angular/core").InputSignal<string>;
   static ɵfac: i0.ɵɵFactoryDeclaration<ReviewDate, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ReviewDate, "lily-review-date", never, {
@@ -13254,6 +13374,11 @@ export declare class ReviewDate {
       "required": false;
       "isSignal": true;
     };
+    "datetime": {
+      "alias": "datetime";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
@@ -14061,6 +14186,12 @@ export declare class SegmentGroup {
 export declare class SegmentGroupItem {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Whether this segment is selected (`aria-checked`, and the roving tab stop). */
+  readonly checked: import("@angular/core").InputSignal<boolean>;
+  /** Value associated with this segment, exposed as `data-value`. */
+  readonly value: import("@angular/core").InputSignal<string>;
+  /** Whether this segment is disabled. */
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
   static ɵfac: i0.ɵɵFactoryDeclaration<SegmentGroupItem, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<SegmentGroupItem, "lily-segment-group-item", never, {
     "label": {
@@ -14073,6 +14204,21 @@ export declare class SegmentGroupItem {
       "required": false;
       "isSignal": true;
     };
+    "checked": {
+      "alias": "checked";
+      "required": false;
+      "isSignal": true;
+    };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
   }, {}, never, ["*"], true, never>;
 }
 /**
@@ -15790,6 +15936,8 @@ export declare class TableTH {
 export declare class Tag {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Announce changes: a role="status" live region. Off by default. */
+  readonly live: import("@angular/core").InputSignal<boolean>;
   static ɵfac: i0.ɵɵFactoryDeclaration<Tag, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<Tag, "lily-tag", never, {
     "label": {
@@ -15802,7 +15950,12 @@ export declare class Tag {
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+    "live": {
+      "alias": "live";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*", "*"], true, never>;
 }
 /**
  * TagGroup — a group of tag elements