@daffodil/design 0.81.0 → 0.82.0

package/sidebar/README.md

@@ -10,10 +10,11 @@ Sidebars are often used for navigation, but it's built to be flexible and extens
 To use sidebar in a standalone component, import `DAFF_SIDEBAR_COMPONENTS` directly into your custom component:
 
 ```ts
+import { DAFF_SIDEBAR_COMPONENTS } from '@daffodil/design/sidebar';
+
 @Component({
   selector: 'custom-component',
   templateUrl: './custom-component.component.html',
-  standalone: true,
   imports: [
     DAFF_SIDEBAR_COMPONENTS,
   ],
@@ -26,8 +27,8 @@ To use sidebar in a module, import `DaffSidebarModule` into your custom module:
 
 ```ts
 import { NgModule } from '@angular/core';
-
 import { DaffSidebarModule } from '@daffodil/design/sidebar';
+import { CustomComponent } from './custom.component';
 
 @NgModule({
 	declarations: [
@@ -45,6 +46,9 @@ export class CustomComponentModule { }
 
 > This method is deprecated. It's recommended to update all custom components to standalone.
 
+### Required imports
+The `BrowserAnimationsModule` or `NoopAnimationsModule` must be imported in the particular Angular `@NgModule` the sidebar is used in for the sidebar to render and work properly.
+
 ## Basic sidebar
 The default setting for sidebar is `mode="side"` and `side="left"`.
 
@@ -53,6 +57,8 @@ The default setting for sidebar is `mode="side"` and `side="left"`.
 ## Implementing the main and sidebar content
 The main and sidebar content should be placed inside of the `<daff-sidebar-viewport>`. The sidebar content should be placed inside of the `<daff-sidebar>`.
 
+> The sidebar viewport should only ever be used once in an application, but it's possible for there to be multiple sidebars of many modes at the same time.
+
 A viewport navigation can either be:
 
 - Placed alongside the `<daff-sidebar>` using the `[daff-sidebar-viewport-nav]` selector.
@@ -91,9 +97,6 @@ A viewport navigation can either be:
 </daff-sidebar-viewport>
 ```
 
-### Required Imports
-The `BrowserAnimationsModule` or `NoopAnimationsModule` must be imported in the particular Angular `@NgModule` the sidebar is used in for the sidebar to render and work properly.
-
 ## Header and footer
 The `<daff-sidebar-header>` includes optional title (`[daffSidebarHeaderTitle]`) and action (`[daffSidebarHeaderAction]`) selectors, and a slot to render custom content. The action selector should be used along with the `<daff-icon-button>` (view [Button Documentation](/libs/design/button/README.md)) to make sure that the action is positioned correctly and it passes WCAG guidelines.
 
@@ -101,24 +104,20 @@ The `<daff-sidebar-footer>` is a "holder" component with minimal default styling
 
 Both the header and footer are optional components that will not render in the DOM if they are not used.
 
-## Opening and closing a sidebar
-THe `open` property is used to set the open state for a sidebar.
-
-By default, sidebar supports two methods of closing itself: clicking on the backdrop of the sidebar viewport or pressing `ESC` when the sidebar has focus.
+## Closing a sidebar
+A sidebar can be closed by clicking on the backdrop, using the escape key, or clicking on the close button in the sidebar header.
 
-| Method              | ------------------------------------ |
-| `(backdropClicked)` | Set on the `<daff-sidebar-viewport>` |
-| `(escapePressed)`   | Set on the `<daff-sidebar>`          |
+> Note:  The close button is hidden by default. To make it visible, set the `dismissible` property on the sidebar header to `true`.
 
 ## Modes
-`<daff-sidebar>` can be rendered four different ways by using the `mode` property. If `mode` is not specified, `side` is used by default.
+A sidebar can be rendered four different ways by using the `mode` property. If `mode` is not specified, `side` is used by default.
 
 | Mode       | Description                                                                                          |
 | ---------- | ---------------------------------------------------------------------------------------------------- |
-| side       | Sidebar is placed alongside the content                                                              |
-| side-fixed | Sidebar is placed alongside the content and will scroll separately from the content                  |
-| over       | Sidebar slides over the rest of the content in the viewport and covering it with a backdrop          |
-| under      | Sidebar freezes in place and and the content slides above it, while also being covered by a backdrop |
+| side       | Displays the sidebar alongside the main content.                                                              |
+| side-fixed | Displays the sidebar alongside the content, but the sidebar remains fixed in place and scrolls independently from the content.                  |
+| over       | The sidebar slides over the main content when open, temporarily covering part of the content when active.          |
+| under      | The sidebar remains fixed in place while the main content slides over it when the sidebar is closed. |
 
 ### Over sidebar
 <design-land-example-viewer-container example="over-sidebar"></design-land-example-viewer-container>
@@ -133,7 +132,7 @@ By default, sidebar supports two methods of closing itself: clicking on the back
 <design-land-example-viewer-container example="fixed-and-over-sidebar"></design-land-example-viewer-container>
 
 ## Sides
-`<daff-sidebar>` can be positioned on either side of a screen by using the `side` property. If `side` is not specificed, `left` is used by default.
+A sidebar can be positioned on either side of a screen by using the `side` property. If `side` is not specificed, `left` is used by default.
 
 | Side  | Description                                    |
 | ----- | ---------------------------------------------- |
@@ -168,7 +167,7 @@ daff-sidebar-viewport {
 }
 ```
 
-## Changing a side-fixed sidebar's top offset position
+## Changing a side- fixed sidebar's top offset position
 The default offset position of a sidebar is `0px`. The `--daff-sidebar-side-fixed-top-shift` variable can be used to adjust the top offset position for a primary sidebar and its viewport content.
 
 ```scss
@@ -187,7 +186,7 @@ body {
 ## Accessibility
 A meaningful `role` should be set on all sidebars depending on how they are used.
 
-When the `<daff-sidebar-header>` is not used or there is no title for the sidebar, a meaningful `aria-label` should be set to describe the sidebar.
+When a sidebar header is not used or there is no title for the sidebar, a meaningful `aria-label` should be set to describe the sidebar.
 
 ### Focus
-Focus trapping is enabled for `over` and `under` modes, and disabled for `side` and `side-fixed` modes. When a sidebar is opened, the first tabbable element within the will receive focus. When a sidebar is opened, the first tabbable element within the will receive focus. When a sidebar is closed, the element that was focused before the sidebar was opened will be re-focused.
+Focus trapping is enabled for `over` and `under` modes, and disabled for `side` and `side-fixed` modes. When a sidebar is opened, the first tabbable element within the sidebar will receive focus. When a sidebar is closed, the element that was focused before the sidebar was opened will be re-focused.

package/sidebar/helper/sidebar-mode.d.ts

@@ -1,23 +1,17 @@
 /**
- * The various modes that a DaffSidebar can be in.
+ * The available display modes for the `DaffSidebarComponent`.
  *
- * * `side` is a mode that allows you to place the sidebar alongside
- *    the content.
- *
- * * `side-fixed` is a mode that allows you want to place the sidebar
- *    alongside the content, however the sidebar will scroll separately
- *    from the content.
- *
- * * `over` is a mode which allows the sidebar to slide *over* the rest of
- *    the content in the viewport.
- *
- * * `under` is a mode that freezes the sidebar in place and allows the content
- *   slide above it.
+ * | Mode | Description |
+ * | -- | -- |
+ * | `side` | Displays the sidebar alongside the main content. |
+ * | `side-fixed` | Displays the sidebar alongside the content, but the sidebar remains fixed in place and scrolls independently from the content. |
+ * | `over` | The sidebar slides over the main content when open, temporarily covering part of the content when active. |
+ * | `under` | The sidebar remains fixed in place while the main content slides over it when the sidebar is closed. |
  */
 export type DaffSidebarMode = 'side' | 'over' | 'under' | 'side-fixed';
 /**
- * A enum representing the different sidebar modes.
- * See {@link DaffSidebarMode}
+ * Enum for representing the available sidebar display modes.
+ * See {@link DaffSidebarMode} for descriptions of each mode.
  */
 export declare const enum DaffSidebarModeEnum {
     Side = "side",

package/sidebar/sidebar/sidebar.component.d.ts

@@ -8,9 +8,13 @@ import { DaffSidebarSide } from '../helper/sidebar-side';
 import * as i0 from "@angular/core";
 import * as i1 from "@daffodil/design";
 /**
- * DaffSidebarComponent is heavily based upon the work done by the @angular/components
- * team on `mat-drawer` and `mat-sidenav`. `daff-sidebar` is intended to be
- * a simplified version (with a different design) of `mat-drawer`.
+ * DaffSidebarComponent is heavily based upon the work done by the `@angular/components`
+ * team on `mat-drawer` and `mat-sidenav`. It's intended to be a simplified version
+ * (with a different design) of `mat-drawer`.
+ *
+ * ```html
+ * <daff-sidebar></daff-sidebar>
+ * ```
  */
 export declare class DaffSidebarComponent implements DaffOpenable {
     private _elementRef;
@@ -29,6 +33,8 @@ export declare class DaffSidebarComponent implements DaffOpenable {
         'daff-sidebar': boolean;
     };
     /**
+     * @docs-private
+     *
      * The animation state of the sidebar.
      */
     get transformSidebar(): {
@@ -38,7 +44,7 @@ export declare class DaffSidebarComponent implements DaffOpenable {
         };
     };
     /**
-     * Event fired when `ESC` key is pressed when the sidebar has focus
+     * Event fired when `ESC` key is pressed when the sidebar has focus.
      */
     escapePressed: EventEmitter<void>;
     /**
@@ -50,33 +56,42 @@ export declare class DaffSidebarComponent implements DaffOpenable {
      */
     mode: DaffSidebarMode;
     /**
+     * @docs-private
+     *
      * The width of the sidebar.
      */
     get width(): number;
+    /**
+     * @docs-private
+     */
     get open(): boolean;
     constructor(_elementRef: ElementRef<HTMLElement>, _ngZone: NgZone, _focusTrapFactory: ConfigurableFocusTrapFactory, _focusStack: DaffFocusStackService, openDirective: DaffOpenableDirective, _doc: any);
     private _focusTrap;
     /**
+     * @docs-private
+     *
      * Animation event that can be used to hook into when the transformSidebar
      * animation begins. This is used in sidebar to determine when to show the
      * visibility of the sidebar so that the animation does not jump as the element is shown.
      */
     onAnimationStart(e: AnimationEvent): void;
     /**
+     * @docs-private
+     *
      * Animation event that can be used to hook into when the
      * transformSidebar animation is complete.
      */
     onAnimationComplete(e: AnimationEvent): void;
     /**
-     * Reveal the contents of the sidebar
+     * Reveal the contents of the sidebar.
      */
     reveal(): void;
     /**
-     * Hide the contents of the sidebar
+     * Hide the contents of the sidebar.
      */
     hide(): void;
     /**
-     * Toggle the visibility of the sidebar
+     * Toggle the visibility of the sidebar.
      */
     toggle(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffSidebarComponent, never>;

package/sidebar/sidebar-footer/sidebar-footer.component.d.ts

@@ -1,5 +1,16 @@
 import * as i0 from "@angular/core";
+/**
+ * Sidebar footer is a child component of the sidebar that is used to display a
+ * footer container, positioned at the bottom of a sidebar.
+ *
+ * ```html
+ * <daff-sidebar-footer></daff-sidebar-footer>
+ * ```
+ */
 export declare class DaffSidebarFooterComponent {
+    /**
+     * @docs-private
+     */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffSidebarFooterComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DaffSidebarFooterComponent, "daff-sidebar-footer", never, {}, {}, never, ["*"], true, never>;

package/sidebar/sidebar-header/sidebar-header-title/sidebar-header-title.directive.d.ts

@@ -1,4 +1,12 @@
 import * as i0 from "@angular/core";
+/**
+ * Sidebar header title is a child directive of `DaffSidebarHeaderComponent`
+ * that can be used to provide a title for the sidebar.
+ *
+ * ```html
+ * <div daffSidebarHeaderTitle>Title</div>
+ * ```
+ */
 export declare class DaffSidebarHeaderTitleDirective {
     /**
      * @docs-private

package/sidebar/sidebar-header/sidebar-header.component.d.ts

@@ -1,14 +1,32 @@
 import { EventEmitter } from '@angular/core';
 import * as i0 from "@angular/core";
+/**
+ * Sidebar header is a child component of the sidebar that is used to display a header container,
+ * positioned at the top of a sidebar. It includes an optional title (`[daffSidebarHeaderTitle]`)
+ * slot and a slot to render any custom content.
+ *
+ * ```html
+ * <daff-sidebar-header></daff-sidebar-header>
+ * ```
+ */
 export declare class DaffSidebarHeaderComponent {
+    /**
+     * @docs-private
+     */
     faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    /**
+     * @docs-private
+     */
     class: boolean;
-    /** Whether or not a sidebar header displays the close icon */
+    /** Whether or not a sidebar header should display the close icon. */
     dismissible: boolean;
     /**
      * Output event triggered when the close icon is clicked.
      */
     closeSidebar: EventEmitter<void>;
+    /**
+     * @docs-private
+     */
     onCloseSidebar(event: Event): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffSidebarHeaderComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DaffSidebarHeaderComponent, "daff-sidebar-header", never, { "dismissible": { "alias": "dismissible"; "required": false; }; }, { "closeSidebar": "closeSidebar"; }, never, ["*"], true, never>;

package/sidebar/sidebar-viewport/sidebar-viewport.component.d.ts

@@ -5,23 +5,19 @@ import { DaffSidebarScroll } from './scroll-token/scroll.token';
 import { DaffSidebarViewportAnimationStateWithParams } from '../animation/sidebar-viewport-animation-state';
 import * as i0 from "@angular/core";
 /**
- * The DaffSidebarViewportComponent is the "holder" of sidebars throughout an entire application.
+ * DaffSidebarViewportComponent serves as the container for managing sidebars across an entire application.
+ * Because it's a functional component, it supports multiple simultaneously open sidebar and is designed to
+ * handle these scenarios gracefully.
  *
- * `<daff-sidebar-viewport>` should only ever be used once in an application,
- * but it's possible for there to be multiple sidebars of many modes
- * at the same time. See {@link DaffSidebarMode}.
+ * > However, there is one key contraint: only one sidebar per **mode** is allowed
+ * on each **side** (e.g., left or right) at any given time.
  *
- * Since this is a functional component, it's possible to have multiple "open" sidebars
- * at the same time. As a result, this component attempts to gracefully handle these situations.
- * However, importantly, there can only be one sidebar of each mode, on each side, at any given time.
+ * If this constraint is violated, the component will throw an exception to prevent unintended behavior.
  *
- * If this is violated, this component will throw an exception.
- *
- * @example Using the sidebar viewport
  * ```html
  * <daff-sidebar-viewport>
  *    <daff-sidebar></daff-sidebar>
- *    <p>Site content</p>
+ *    <div>Site content</div>
  * </daff-sidebar-viewport>
  * ```
  */
@@ -31,19 +27,33 @@ export declare class DaffSidebarViewportComponent implements AfterContentChecked
     private bodyScroll;
     private parentViewport;
     private scroll;
+    /**
+     * @docs-private
+     */
     hostClass: boolean;
+    /**
+     * @docs-private
+     */
     get classes(): {
         [x: string]: boolean;
         'daff-sidebar-viewport': boolean;
         'pad-left': boolean;
         'pad-right': boolean;
     };
+    /**
+     * @docs-private
+     */
     get isNavOnSide(): boolean;
+    /**
+     * @docs-private
+     */
     onContentAnimationStart(e: AnimationEvent): void;
+    /**
+     * @docs-private
+     */
     onContentAnimationDone(e: AnimationEvent): void;
     /**
-     * The placement of the nav in relation to the sidebar. The default is set to `top`.
-     * Note that this is really only available when there is a `side-fixed` sidebar.
+     * The placement of the nav in relation to the sidebar. Note that this is really only available when there is a `side-fixed` sidebar.
      */
     navPlacement: DaffNavPlacement;
     constructor(cdRef: ChangeDetectorRef, _elementRef: ElementRef<HTMLElement>, bodyScroll: DaffSidebarScroll, parentViewport: any, scroll: DaffSidebarScroll);
@@ -61,10 +71,14 @@ export declare class DaffSidebarViewportComponent implements AfterContentChecked
     private _isPaddedLeft;
     private _isPaddedRight;
     /**
+     * @docs-private
+     *
      * Whether or not the backdrop is interactable
      */
     _backdropInteractable: boolean;
     /**
+     * @docs-private
+     *
      * The animation state
      */
     _animationState: DaffSidebarViewportAnimationStateWithParams;
@@ -72,7 +86,13 @@ export declare class DaffSidebarViewportComponent implements AfterContentChecked
      * Event fired when the backdrop is clicked. This is often used to close the sidebar.
      */
     backdropClicked: EventEmitter<void>;
+    /**
+     * @docs-private
+     */
     ngAfterContentChecked(): void;
+    /**
+     * @docs-private
+     */
     ngOnDestroy(): void;
     /**
      * @docs-private
@@ -83,9 +103,10 @@ export declare class DaffSidebarViewportComponent implements AfterContentChecked
     private updateAnimationState;
     /**
      * @docs-private
-     * The called when the backdrop of the viewport is clicked upon.
+     *
+     * Called when the backdrop of the viewport is clicked upon.
      */
     _backdropClicked(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffSidebarViewportComponent, [null, null, { skipSelf: true; }, { optional: true; skipSelf: true; }, null]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DaffSidebarViewportComponent, "daff-sidebar-viewport", never, { "navPlacement": { "alias": "navPlacement"; "required": false; }; }, { "backdropClicked": "backdropClicked"; }, ["sidebars"], ["[daff-sidebar-viewport-nav]", "daff-sidebar:not([side=right])", "*", "daff-sidebar[side=right]"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DaffSidebarViewportComponent, "daff-sidebar-viewport", never, { "navPlacement": { "alias": "navPlacement"; "required": false; }; }, { "backdropClicked": "backdropClicked"; }, ["sidebars"], ["[daff-sidebar-viewport-nav]", "daff-sidebar:not([side=right])", "*", "[daff-sidebar-viewport-footer]", "daff-sidebar[side=right]"], true, never>;
 }

package/sidebar/sidebar-viewport-backdrop/sidebar-viewport-backdrop.component.d.ts

@@ -2,6 +2,9 @@ import { AnimationEvent } from '@angular/animations';
 import { EventEmitter, OnInit } from '@angular/core';
 import * as i0 from "@angular/core";
 export declare class DaffSidebarViewportBackdropComponent implements OnInit {
+    /**
+     * @docs-private
+     */
     interactableClass: boolean;
     /**
      * Determines whether or not the backdrop is transparent.
@@ -20,14 +23,28 @@ export declare class DaffSidebarViewportBackdropComponent implements OnInit {
      * Output event triggered when the backdrop is clicked.
      */
     backdropClicked: EventEmitter<void>;
+    /**
+     * @docs-private
+     */
     ngOnInit(): void;
     /**
+     * @docs-private
+     *
      * Animation hook for that controls the backdrops
      * entrance and fade animations.
      */
     get fadeBackdropTrigger(): import("./animation/backdrop-animation-state").DaffSidebarViewportBackdropAnimationState;
+    /**
+     * @docs-private
+     */
     animationDone(e: AnimationEvent): void;
+    /**
+     * @docs-private
+     */
     animationStart(e: AnimationEvent): void;
+    /**
+     * @docs-private
+     */
     onBackdropClicked(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffSidebarViewportBackdropComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DaffSidebarViewportBackdropComponent, "daff-sidebar-viewport-backdrop", never, { "transparent": { "alias": "transparent"; "required": false; }; "interactable": { "alias": "interactable"; "required": false; }; "fullscreen": { "alias": "fullscreen"; "required": false; }; }, { "backdropClicked": "backdropClicked"; }, never, ["*"], true, never>;

package/sidebar/sidebar.d.ts

@@ -5,4 +5,7 @@ import { DaffSidebarHeaderTitleDirective } from './sidebar-header/sidebar-header
 import { DaffSidebarHeaderComponent } from './sidebar-header/sidebar-header.component';
 import { DaffSidebarViewportComponent } from './sidebar-viewport/sidebar-viewport.component';
 import { DaffSidebarViewportBackdropComponent } from './sidebar-viewport-backdrop/sidebar-viewport-backdrop.component';
+/**
+ * @docs-private
+ */
 export declare const DAFF_SIDEBAR_COMPONENTS: readonly [typeof DaffSidebarComponent, typeof DaffSidebarViewportComponent, typeof DaffSidebarHeaderComponent, typeof DaffSidebarFooterComponent, typeof DaffSidebarHeaderTitleDirective, typeof DaffSidebarHeaderActionDirective, typeof DaffSidebarViewportBackdropComponent];

package/switch/README.md

@@ -7,13 +7,14 @@ Switches provide a way to toggle between two states with a visual indicator of t
 ## Usage
 
 ### Within a standalone component
-To use a switch in a standalone component, import it directly into your custom component:
+To use a switch in a standalone component, import `DAFF_SWITCH_COMPONENTS` directly into your custom component:
 
 ```ts
+import { DAFF_SWITCH_COMPONENTS } from '@daffodil/design/switch';
+
 @Component({
   selector: 'custom-component',
   templateUrl: './custom-component.component.html',
-  standalone: true,
   imports: [
     DAFF_SWITCH_COMPONENTS,
   ],

package/switch/switch.d.ts

@@ -1,3 +1,6 @@
 import { DaffErrorMessageModule } from '@daffodil/design';
 import { DaffSwitchComponent } from './switch/switch.component';
+/**
+ * @docs-private
+ */
 export declare const DAFF_SWITCH_COMPONENTS: readonly [typeof DaffSwitchComponent, typeof DaffErrorMessageModule];

package/tabs/README.md

@@ -4,12 +4,45 @@ Tabs provide a way to navigate between panels that display related content.
 ## Overview
 Tabs allow for users to navigate between related content without having to leave the page. They can be used within components like modals or cards.
 
+## Usage
+
+### Within a standalone component
+To use a tabs in a standalone component, import `DAFF_TABS_COMPONENTS` directly into your custom component:
+
+```ts
+import { DAFF_TABS_COMPONENTS } from '@daffodil/design/tabs';
+
+@Component({
+  selector: 'custom-component',
+  templateUrl: './custom-component.component.html',
+  imports: [
+    DAFF_TABS_COMPONENTS,
+  ],
+})
+export class CustomComponent {}
+```
+
+## Properties
+
+### Link Mode
+Tabs in link mode replaces the tab buttons with anchors. This allows the selected tab to be connected to a URL. By default, the current URL and `tab` query param will be used. These can be overriden with the `url` and `queryParam` inputs respectively.
+
+```html
+<daff-tabs [linkMode]="true">
+</daff-tabs>
+```
+
 ## Accessbility
 Tabs follow the [ARIA Tabs design pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/). Tabs compose of `tablist`, `tab`, and `tabpanel` elements,  each with its appropriate role and integrated keyboard interactions.
 
 ### Label
 A meaningful `aria-label` should be set on `<daff-tabs>` by using the `aria-label` property. This will set the `aria-label` on the `tablist` element.
 
+```html
+<daff-tabs aria-label="Custom aria label">
+</daff-tabs>
+```
+
 ### Keyboard Interactions
 | Key | Action |
 | --- | ------ |
@@ -17,6 +50,3 @@ A meaningful `aria-label` should be set on `<daff-tabs>` by using the `aria-labe
 | Right Arrow |  Moves focus and activates next tab. If focus is on the last tab, moves focus to the first tab. |
 | Home |  Moves focus and activates first tab. |
 | End |  Moves focus and activates last tab. |
-
-### Link Mode
-Tabs can operate in "link mode" which replaces the tab buttons with anchors. This allows the selected tab to be connected to the URL. To use this mode, set `linkMode` to `true` on the tabs component. By default, the current URL and `tab` query param will be used. These can be overriden with the `url` and `queryParam` inputs respectively.

package/tabs/tabs/tab/tab.component.d.ts

@@ -3,7 +3,7 @@ import * as i0 from "@angular/core";
 /**
  * `DaffTabComponet` is an element in the tab list that is used as a content container to group the label of a tab panel and the tab panel together.
  *
- * A `<daff-tab>` should include the {@link DaffTabLabelComponent} and {@link DaffTabPanelComponent} components in order to properly structure the UI.
+ * A `<daff-tab>` should include the DaffTabLabelComponent and DaffTabPanelComponent components in order to properly structure the UI.
  *
  * @example Basic structure of tab
  * ```html

package/tabs/tabs/tab-label/tab-label.component.d.ts

@@ -13,7 +13,13 @@ import * as i0 from "@angular/core";
  * ```
  */
 export declare class DaffTabLabelComponent implements DaffPrefixable, DaffSuffixable {
+    /**
+     * @docs-private
+     */
     _prefix: DaffPrefixDirective;
+    /**
+     * @docs-private
+     */
     _suffix: DaffSuffixDirective;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffTabLabelComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DaffTabLabelComponent, "daff-tab-label", never, {}, {}, ["_prefix", "_suffix"], ["[daffPrefix]", "*", "[daffSuffix]"], true, never>;

package/tabs/tabs/tab-panel/tab-panel.component.d.ts

@@ -17,19 +17,27 @@ export declare class DaffTabPanelComponent {
      */
     private class;
     /**
+     * @docs-private
+     *
      * Sets the `role` to tabpanel.
      */
     role: string;
     /**
+     * @docs-private
+     *
      * `aria-labelledby` for the tab.
      */
     ariaLabelledBy: string;
     /**
+     * @docs-private
+     *
      * Sets the `tabindex` to 0.
      */
     tabIndex: string;
     private _id;
     /**
+     * @docs-private
+     *
      * Dynamically binds the tab panel's id to a unique value generated from the associated tab's panelId.
      */
     get tabPanelId(): string;

package/tabs/tabs/tabs.component.d.ts

@@ -40,23 +40,26 @@ export declare class DaffTabsComponent implements AfterContentInit, OnInit {
      */
     private class;
     /**
+     * @docs-private
+     *
      * The currently selected tab. This property is dynamically updated when a user selects a tab.
      */
     selectedTab: string;
     /**
-     * The tab that is initially selected on initial load. If it's not used, the first tab in the tablist will be selected by default.
+     * The tab that is selected on initial load. If it's not used, the first tab in the tablist will be selected by default.
      */
     initiallySelected: string;
     /**
-     * @docs-private
+     * aria-label for the tab.
      */
     private externalAriaLabel;
     /**
-     * aria-label for the tab.
+     * @docs-private
+     *
      */
     ariaLabel: string;
     /**
-     * Replace the tab buttons with links.
+     * Replace the tab buttons as links.
      */
     linkMode: boolean;
     /**
@@ -84,8 +87,12 @@ export declare class DaffTabsComponent implements AfterContentInit, OnInit {
      * @docs-private
      */
     _tabActivators: QueryList<DaffTabActivatorComponent>;
+    /**
+     * @docs-private
+     */
     get currentPath(): string;
     constructor(cdRef: ChangeDetectorRef, location: Location);
+    private reset;
     /**
      * @docs-private
      */
@@ -95,6 +102,8 @@ export declare class DaffTabsComponent implements AfterContentInit, OnInit {
      */
     ngAfterContentInit(): void;
     /**
+     * @docs-private
+     *
      * Selects a tab and sets focus on the selected tab.
      */
     select(tabId: string): void;
@@ -108,18 +117,26 @@ export declare class DaffTabsComponent implements AfterContentInit, OnInit {
      */
     _buildQueryParams(tab: string): Params;
     /**
+     * @docs-private
+     *
      * Selects the previous tab and wraps around to the last tab if the first tab is currently selected.
      */
     previous(): void;
     /**
+     * @docs-private
+     *
      * Selects the next tab and wraps around to the first tab if the last tab is currently selected.
      */
     next(): void;
     /**
+     * @docs-private
+     *
      * Selects the first tab.
      */
     selectFirst(event: KeyboardEvent | null): void;
     /**
+     * @docs-private
+     *
      * Selects the last tab.
      */
     selectLast(event: KeyboardEvent | null): void;