@daffodil/design 0.83.0 → 0.84.0

package/hero/src/hero-theme.scss

@@ -16,22 +16,39 @@
 	$base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
 	$white: core.daff-map-get($theme, 'core', 'white');
 	$black: core.daff-map-get($theme, 'core', 'black');
+	$type: core.daff-map-get($theme, 'core', 'type');
 
 	.daff-hero {
-		@include daff-hero-theme-variant(
-			theming.daff-illuminate($base, $neutral, 1)
-		);
+		@include theming.light($type) {
+			@include daff-hero-theme-variant(theming.daff-color($neutral, 10));
 
-		&.daff-primary {
-			@include daff-hero-theme-variant(theming.daff-color($primary));
-		}
+			&.daff-primary {
+				@include daff-hero-theme-variant(theming.daff-color($primary));
+			}
+
+			&.daff-secondary {
+				@include daff-hero-theme-variant(theming.daff-color($secondary));
+			}
 
-		&.daff-secondary {
-			@include daff-hero-theme-variant(theming.daff-color($secondary));
+			&.daff-tertiary {
+				@include daff-hero-theme-variant(theming.daff-color($tertiary));
+			}
 		}
 
-		&.daff-tertiary {
-			@include daff-hero-theme-variant(theming.daff-color($tertiary));
+		@include theming.dark($type) {
+			@include daff-hero-theme-variant(theming.daff-color($neutral, 90));
+
+			&.daff-primary {
+				@include daff-hero-theme-variant(theming.daff-color($primary, 60));
+			}
+
+			&.daff-secondary {
+				@include daff-hero-theme-variant(theming.daff-color($secondary, 60));
+			}
+
+			&.daff-tertiary {
+				@include daff-hero-theme-variant(theming.daff-color($tertiary, 60));
+			}
 		}
 
 		&.daff-theme {

package/input/examples/examples.d.ts

@@ -1,2 +1,2 @@
-import { BasicInputComponent } from './basic-input/basic-input.component';
-export declare const INPUT_EXAMPLES: (typeof BasicInputComponent)[];
+import { InputHintComponent } from './input-hint/input-hint.component';
+export declare const INPUT_EXAMPLES: (typeof InputHintComponent)[];

package/input/examples/input-disabled/input-disabled.component.d.ts

@@ -1,5 +1,7 @@
+import { UntypedFormControl } from '@angular/forms';
 import * as i0 from "@angular/core";
 export declare class InputDisabledComponent {
+    disabled: UntypedFormControl;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputDisabledComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<InputDisabledComponent, "input-disabled", never, {}, {}, never, never, true, never>;
 }

package/input/examples/input-hint/input-hint.component.d.ts

@@ -0,0 +1,5 @@
+import * as i0 from "@angular/core";
+export declare class InputHintComponent {
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputHintComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputHintComponent, "input-hint", never, {}, {}, never, never, true, never>;
+}

package/input/examples/input-with-form-field/input-with-form-field.component.d.ts

@@ -1,5 +1,7 @@
 import * as i0 from "@angular/core";
 export declare class InputWithFormFieldComponent {
+    faUser: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faCircleXmark: import("@fortawesome/fontawesome-common-types").IconDefinition;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputWithFormFieldComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<InputWithFormFieldComponent, "input-with-form-field", never, {}, {}, never, never, true, never>;
 }

package/list/list/list.component.d.ts

@@ -22,7 +22,7 @@ export declare class DaffListComponent {
      *
      * @docs-private
      */
-    get role(): "list" | "navigation";
+    get role(): "navigation" | "list";
     private _getHostElement;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffListComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DaffListComponent, "daff-list,daff-nav-list", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.DaffArticleEncapsulatedDirective; inputs: {}; outputs: {}; }]>;

package/list/src/list-theme.scss

@@ -7,22 +7,7 @@
 	$neutral: core.daff-map-get($theme, 'core', 'neutral');
 	$base: core.daff-map-get($theme, 'core', 'base');
 	$base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
-
-	.daff-list {
-		.daff-list-item {
-			&__content {
-				// stylelint-disable-next-line scss/selector-nest-combinators
-				*:nth-child(1) {
-					color: $base-contrast;
-				}
-
-				// stylelint-disable-next-line scss/selector-nest-combinators
-				*:nth-child(n + 2) {
-					color: theming.daff-illuminate($base-contrast, $neutral, 3);
-				}
-			}
-		}
-	}
+	$type: core.daff-map-get($theme, 'core', 'type');
 
 	.daff-nav-list {
 		.daff-list-item {
@@ -30,10 +15,21 @@
 				background-color: $base;
 			}
 
-			&:hover,
-			&.active {
-				&::after {
-					background-color: theming.daff-illuminate($base, $neutral, 2);
+			@include theming.light($type) {
+				&:hover,
+				&.active {
+					&::after {
+						background-color: rgba(theming.daff-color($neutral, 20), 0.5);
+					}
+				}
+			}
+
+			@include theming.dark($type) {
+				&:hover,
+				&.active {
+					&::after {
+						background-color: rgba(theming.daff-color($neutral, 20), 0.08);
+					}
 				}
 			}
 		}

package/menu/menu/menu.component.d.ts

@@ -7,12 +7,27 @@ export declare class DaffMenuComponent implements AfterContentInit, AfterViewIni
     private _ngZone;
     private _elementRef;
     private menuService;
+    /**
+     * @docs-private
+     */
     class: boolean;
+    /**
+     * @docs-private
+     */
     tabindex: number;
+    /**
+     * @docs-private
+     */
     role: string;
     private _focusTrap;
     constructor(_focusTrapFactory: ConfigurableFocusTrapFactory, _ngZone: NgZone, _elementRef: ElementRef<HTMLElement>, menuService: DaffMenuService);
+    /**
+     * @docs-private
+     */
     ngAfterContentInit(): void;
+    /**
+     * @docs-private
+     */
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffMenuComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DaffMenuComponent, "daff-menu", never, {}, {}, never, ["[daff-menu-item]"], true, never>;

package/menu/menu-activator/menu-activator.component.d.ts

@@ -7,6 +7,9 @@ export declare class DaffMenuActivatorDirective implements OnDestroy {
     private cdRef;
     private _destroyed$;
     private _open;
+    /**
+     * @docs-private
+     */
     get openClass(): boolean;
     daffMenuActivator: Type<unknown> | TemplateRef<unknown>;
     constructor(service: DaffMenuService, viewContainerRef: ViewContainerRef, cdRef: ChangeDetectorRef);

package/menu/src/menu-theme.scss

@@ -2,24 +2,43 @@
 @use '../../scss/theming';
 
 @mixin daff-menu-theme($theme) {
-	$white: core.daff-map-get($theme, 'core', 'white');
 	$black: core.daff-map-get($theme, 'core', 'black');
 	$neutral: core.daff-map-get($theme, 'core', 'neutral');
 	$base: core.daff-map-get($theme, 'core', 'base');
 	$base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
+	$type: core.daff-map-get($theme, 'core', 'type');
 
-	.daff-menu {
-		background: $base;
-		box-shadow: 0 0 24px rgb($black, 0.12);
+	@include theming.light($type) {
+		.daff-menu {
+			background: $base;
+			box-shadow: 0 0 24px rgb($black, 0.12);
+		}
+
+		.daff-menu-item {
+			background: $base;
+			color: $base-contrast;
+
+			&:hover,
+			&:focus {
+				background: rgba(theming.daff-color($neutral, 20), 0.5);
+			}
+		}
 	}
 
-	.daff-menu-item {
-		background: $base;
-		color: $base-contrast;
+	@include theming.dark($type) {
+		.daff-menu {
+			background: $base;
+			box-shadow: 0 0 24px rgb($black, 0.12);
+		}
+
+		.daff-menu-item {
+			background: $base;
+			color: $base-contrast;
 
-		&:hover,
-		&:focus {
-			background: theming.daff-illuminate($base, $neutral, 1);
+			&:hover,
+			&:focus {
+				background: rgba(theming.daff-color($neutral, 20), 0.08);
+			}
 		}
 	}
 }

package/modal/modal/modal.component.d.ts

@@ -14,14 +14,23 @@ export declare class DaffModalComponent implements AfterContentInit, AfterViewIn
     /**
      * Sets a class of .daff-modal to the host element.
      */
+    /**
+     * @docs-private
+     */
     modalClass: boolean;
     /**
      * Sets the role to dialog.
      */
+    /**
+     * @docs-private
+     */
     role: string;
     /**
      * Sets aria-modal to true.
      */
+    /**
+     * @docs-private
+     */
     ariaModal: boolean;
     private _ariaLabelledBy;
     /**
@@ -29,6 +38,9 @@ export declare class DaffModalComponent implements AfterContentInit, AfterViewIn
      * {@link DaffModalTitleDirective} when it is used.
      *
      */
+    /**
+     * @docs-private
+     */
     get ariaLabelledBy(): string;
     set ariaLabelledBy(value: string);
     /**
@@ -49,13 +61,22 @@ export declare class DaffModalComponent implements AfterContentInit, AfterViewIn
     onEscape(): void;
     private _focusTrap;
     constructor(modalService: DaffModalService, _focusTrapFactory: ConfigurableFocusTrapFactory, elementRef: ElementRef<HTMLElement>, openDirective: DaffOpenableDirective);
+    /**
+     * @docs-private
+     */
     ngAfterContentInit(): void;
+    /**
+     * @docs-private
+     */
     ngAfterViewInit(): void;
     /**
      * Helper method to attach portable content to modal.
      */
     attachContent(portal: ComponentPortal<any>): any;
     /** Animation hook that controls the entrance and exit animations of the modal. */
+    /**
+     * @docs-private
+     */
     get fadeState(): string;
     /**
      * Animation event that can used to hook into when

package/modal/modal-actions/modal-actions.component.d.ts

@@ -1,5 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class DaffModalActionsComponent {
+    /**
+     * @docs-private
+     */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffModalActionsComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DaffModalActionsComponent, "daff-modal-actions", never, {}, {}, never, ["*"], true, never>;

package/modal/modal-close/modal-close.directive.d.ts

@@ -18,6 +18,9 @@ export declare class DaffModalCloseDirective {
     /**
      * Sets the button type attribute to button.
      */
+    /**
+     * @docs-private
+     */
     typeAttribute: string;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffModalCloseDirective, [null, { optional: true; }]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DaffModalCloseDirective, "button[daffModalClose]", never, {}, {}, never, never, true, never>;

package/modal/modal-content/modal-content.component.d.ts

@@ -1,5 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class DaffModalContentComponent {
+    /**
+     * @docs-private
+     */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffModalContentComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DaffModalContentComponent, "daff-modal-content", never, {}, {}, never, ["*"], true, never>;

package/modal/modal-title/modal-title.directive.d.ts

@@ -13,6 +13,9 @@ export declare class DaffModalTitleDirective {
     /**
      * The html `id` of the modal title.
      */
+    /**
+     * @docs-private
+     */
     get uniqueId(): string;
     constructor(modal: DaffModalComponent);
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffModalTitleDirective, [{ optional: true; }]>;

package/navbar/src/navbar-theme.scss

@@ -16,11 +16,16 @@
 	$base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
 	$white: core.daff-map-get($theme, 'core', 'white');
 	$black: core.daff-map-get($theme, 'core', 'black');
+	$type: core.daff-map-get($theme, 'core', 'type');
 
 	.daff-navbar {
-		@include daff-navbar-theme-variant(
-			theming.daff-illuminate($base, $neutral, 1)
-		);
+		@include theming.light($type) {
+			@include daff-navbar-theme-variant(theming.daff-color($neutral, 10));
+		}
+
+		@include theming.dark($type) {
+			@include daff-navbar-theme-variant(theming.daff-color($neutral, 90));
+		}
 
 		&--raised {
 			box-shadow: 0 4px 10px rgba($black, 0.08);

package/notification/README.md

@@ -52,27 +52,24 @@ export class CustomComponentModule { }
 ## Supported Content Types
 
 ### Icon
-An icon can be used to give a user a brief overview of what the nofication is about. It can be added before the title and subtitle by using the <code>daffPrefix</code> selector.
+An icon can be used to provide users with a quick visual cue about the purpose of a notification. Place the icon before the title and subtitle using the `[daffPrefix]` selector.
 
 ### Title
-Title gives a quick overview of what the notification is about. It can be added by using the `daffNotificationTitle` selector.
+The title provides a quick overview of what the notification's content. Add it using the `[daffNotificationTitle]` selector.
 
 ### Subtitle
-Subtitle provides additional details about the notification that should be limited to one or two sentences. It can be added by using the `daffNotificationSubtitle` selector.
+The subtitle provides additional details about the notification. It should be limited to one or two sentences. Add it using the `[daffNotificationSubtitle]` selector.
 
 ### Actions
-Buttons can be included in notifications to resolve the notification or navigate them to a page with more information. It can be added by using the `daffNotificationActions` selector.
+Buttons can be included in notifications to dismiss them or navigate them to a page with more information. Use the `[daffNotificationActions]` selector to include these actions.
 
 <design-land-example-viewer-container example="notification-with-actions"></design-land-example-viewer-container>
 
 ## Properties
 
-### Statuses
-The status color of a notification can be updated by using the `status` property.
+### Status
+The status property is used to visually distinguish between different notification types. Use the `status` property to set the status.
 
-Supported statuses: `warn | critical | success`
-
-#### Notification with statuses
 <design-land-example-viewer-container example="notification-status"></design-land-example-viewer-container>
 
 ### Orientation
@@ -81,11 +78,13 @@ Orientation dictates how a notification's content is stacked — `vertical` or `
 <design-land-example-viewer-container example="notification-orientations"></design-land-example-viewer-container>
 
 ### Dismissing a notification
-Notifications are not dismissible by default. They typically persist on the page until a user takes action that resolves the notification.
+By default, notifications are not dismissible and remain visible until the user takes an action to resolve them.
 
-The close button is hidden by default but can be visible by setting the `dismissible` property to `true`. It should remain hidden if a notification has critical information for a user to read or interact with.
+To show a close button, set the `dismissible` property to `true`. Avoid making critical notifications dismissible to ensure users can read or interact with the necessary information.
 
 <design-land-example-viewer-container example="dismissible-notification"></design-land-example-viewer-container>
 
 ## Accessibility
-Notifications with a `critical` or `warn` status have a `role="alert"` so that it can be announced by assistive technologies. See [live region roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles#4._live_region_roles) for more information. All other notifications have a `role="status"`. Notifications have a `tabindex="0"` so users can discover them while tabbing through a page.
+Notifications with a `critical` or `warn` status have a `role="alert"` so that it can be announced by assistive technologies. See [live region roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles#4._live_region_roles) for more information. All other notifications have a `role="status"`.
+
+Notifications have a `tabindex="0"` so users can discover them while tabbing through a page.

package/notification/notification/notification.component.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from '@angular/core';
-import { DaffPrefixable, DaffPrefixDirective, DaffStatusableDirective } from '@daffodil/design';
+import { DaffPrefixDirective, DaffStatusableDirective } from '@daffodil/design';
 import { DaffNotificationActionsDirective } from '../notification-actions/notification-actions.directive';
 import * as i0 from "@angular/core";
 import * as i1 from "@daffodil/design";
@@ -8,19 +8,34 @@ export type DaffNotificationOrientation = 'horizontal' | 'vertical';
  * DaffNotificationComponent provides a way to display and communicate
  * information related to user actions within a page's content.
  */
-export declare class DaffNotificationComponent implements DaffPrefixable {
+export declare class DaffNotificationComponent {
     private statusDirective;
     faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
     _prefix: DaffPrefixDirective;
     _actions: DaffNotificationActionsDirective;
+    /**
+     * @docs-private
+     */
     class: boolean;
+    /**
+     * @docs-private
+     */
     tabindex: string;
     /**
      * Sets role to alert when `status="warn"` or `status="critical"`.
      * Sets role to status on all other instances.
      */
+    /**
+     * @docs-private
+     */
     get role(): "status" | "alert";
+    /**
+     * @docs-private
+     */
     get verticalOrientation(): boolean;
+    /**
+     * @docs-private
+     */
     get horizontalOrientation(): boolean;
     /** Whether or not a notification is closable */
     dismissible: boolean;

package/notification/notification-actions/notification-actions.directive.d.ts

@@ -1,5 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class DaffNotificationActionsDirective {
+    /**
+     * @docs-private
+     */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffNotificationActionsDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DaffNotificationActionsDirective, "[daffNotificationActions]", never, {}, {}, never, never, true, never>;

package/notification/notification-message/notification-message.directive.d.ts

@@ -1,5 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class DaffNotificationMessageDirective {
+    /**
+     * @docs-private
+     */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffNotificationMessageDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DaffNotificationMessageDirective, "[daffNotificationMessage]", never, {}, {}, never, never, true, never>;

package/notification/notification-subtitle/notification-subtitle.directive.d.ts

@@ -1,5 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class DaffNotificationSubtitleDirective {
+    /**
+     * @docs-private
+     */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffNotificationSubtitleDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DaffNotificationSubtitleDirective, "[daffNotificationSubtitle]", never, {}, {}, never, never, true, never>;

package/notification/notification-title/notification-title.directive.d.ts

@@ -1,5 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class DaffNotificationTitleDirective {
+    /**
+     * @docs-private
+     */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffNotificationTitleDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DaffNotificationTitleDirective, "[daffNotificationTitle]", never, {}, {}, never, never, true, never>;

package/notification/notification.d.ts

@@ -1,4 +1,4 @@
-import { DaffPrefixSuffixModule } from '@daffodil/design';
+import { DaffPrefixDirective } from '@daffodil/design';
 import { DaffNotificationComponent } from './notification/notification.component';
 import { DaffNotificationActionsDirective } from './notification-actions/notification-actions.directive';
 import { DaffNotificationMessageDirective } from './notification-message/notification-message.directive';
@@ -7,4 +7,4 @@ import { DaffNotificationTitleDirective } from './notification-title/notificatio
 /**
  * @docs-private
  */
-export declare const DAFF_NOTIFICATION_COMPONENTS: readonly [typeof DaffNotificationComponent, typeof DaffNotificationActionsDirective, typeof DaffNotificationMessageDirective, typeof DaffNotificationTitleDirective, typeof DaffNotificationSubtitleDirective, typeof DaffPrefixSuffixModule];
+export declare const DAFF_NOTIFICATION_COMPONENTS: readonly [typeof DaffNotificationComponent, typeof DaffNotificationActionsDirective, typeof DaffNotificationMessageDirective, typeof DaffNotificationTitleDirective, typeof DaffNotificationSubtitleDirective, typeof DaffPrefixDirective];

package/package.json

@@ -1 +1 @@
-{"name":"@daffodil/design","nx":{"targets":{"build":{"outputs":["{workspaceRoot}/dist/design"]}}},"version":"0.83.0","author":"Graycore LLC","license":"MIT","bugs":{"url":"https://github.com/graycoreio/daffodil/issues"},"homepage":"https://github.com/graycoreio/daffodil","description":"A consistent, sane api driver that works with different ecommerce systems.","repository":{"type":"git","url":"https://github.com/graycoreio/daffodil"},"peerDependencies":{"@angular/animations":"^19.0.0","@angular/common":"^19.0.0","@angular/core":"^19.0.0","@angular/forms":"^19.0.0","@angular/cdk":"^19.0.0","@daffodil/core":"0.83.0","@fortawesome/angular-fontawesome":"^1.0.0","@fortawesome/fontawesome-svg-core":"^6.4.2","@fortawesome/free-solid-svg-icons":"^6.4.2","@fortawesome/free-brands-svg-icons":"^6.4.2","@fortawesome/free-regular-svg-icons":"^6.4.2","modern-normalize":"^0.5.0","rxjs":"7.8.1"},"optionalDependencies":{"@faker-js/faker":"^7.6.0"},"exports":{"./scss/global":{"sass":"./scss/global.scss"},"./scss/theme":{"sass":"./scss/theme.scss"},"./scss/utilities":{"sass":"./scss/utilities.scss"},"./scss/typography":{"sass":"./scss/typography/_index.scss"},"./package.json":{"default":"./package.json"},".":{"types":"./index.d.ts","default":"./fesm2022/daffodil-design.mjs"},"./accordion":{"types":"./accordion/index.d.ts","default":"./fesm2022/daffodil-design-accordion.mjs"},"./article":{"types":"./article/index.d.ts","default":"./fesm2022/daffodil-design-article.mjs"},"./breadcrumb":{"types":"./breadcrumb/index.d.ts","default":"./fesm2022/daffodil-design-breadcrumb.mjs"},"./button":{"types":"./button/index.d.ts","default":"./fesm2022/daffodil-design-button.mjs"},"./callout":{"types":"./callout/index.d.ts","default":"./fesm2022/daffodil-design-callout.mjs"},"./card":{"types":"./card/index.d.ts","default":"./fesm2022/daffodil-design-card.mjs"},"./container":{"types":"./container/index.d.ts","default":"./fesm2022/daffodil-design-container.mjs"},"./hero":{"types":"./hero/index.d.ts","default":"./fesm2022/daffodil-design-hero.mjs"},"./image":{"types":"./image/index.d.ts","default":"./fesm2022/daffodil-design-image.mjs"},"./link-set":{"types":"./link-set/index.d.ts","default":"./fesm2022/daffodil-design-link-set.mjs"},"./list":{"types":"./list/index.d.ts","default":"./fesm2022/daffodil-design-list.mjs"},"./loading-icon":{"types":"./loading-icon/index.d.ts","default":"./fesm2022/daffodil-design-loading-icon.mjs"},"./media-gallery":{"types":"./media-gallery/index.d.ts","default":"./fesm2022/daffodil-design-media-gallery.mjs"},"./menu":{"types":"./menu/index.d.ts","default":"./fesm2022/daffodil-design-menu.mjs"},"./modal":{"types":"./modal/index.d.ts","default":"./fesm2022/daffodil-design-modal.mjs"},"./navbar":{"types":"./navbar/index.d.ts","default":"./fesm2022/daffodil-design-navbar.mjs"},"./notification":{"types":"./notification/index.d.ts","default":"./fesm2022/daffodil-design-notification.mjs"},"./paginator":{"types":"./paginator/index.d.ts","default":"./fesm2022/daffodil-design-paginator.mjs"},"./progress-bar":{"types":"./progress-bar/index.d.ts","default":"./fesm2022/daffodil-design-progress-bar.mjs"},"./sidebar":{"types":"./sidebar/index.d.ts","default":"./fesm2022/daffodil-design-sidebar.mjs"},"./switch":{"types":"./switch/index.d.ts","default":"./fesm2022/daffodil-design-switch.mjs"},"./tabs":{"types":"./tabs/index.d.ts","default":"./fesm2022/daffodil-design-tabs.mjs"},"./text-snippet":{"types":"./text-snippet/index.d.ts","default":"./fesm2022/daffodil-design-text-snippet.mjs"},"./toast":{"types":"./toast/index.d.ts","default":"./fesm2022/daffodil-design-toast.mjs"},"./tree":{"types":"./tree/index.d.ts","default":"./fesm2022/daffodil-design-tree.mjs"},"./youtube-player":{"types":"./youtube-player/index.d.ts","default":"./fesm2022/daffodil-design-youtube-player.mjs"},"./accordion/examples":{"types":"./accordion/examples/index.d.ts","default":"./fesm2022/daffodil-design-accordion-examples.mjs"},"./article/examples":{"types":"./article/examples/index.d.ts","default":"./fesm2022/daffodil-design-article-examples.mjs"},"./breadcrumb/examples":{"types":"./breadcrumb/examples/index.d.ts","default":"./fesm2022/daffodil-design-breadcrumb-examples.mjs"},"./button/examples":{"types":"./button/examples/index.d.ts","default":"./fesm2022/daffodil-design-button-examples.mjs"},"./callout/examples":{"types":"./callout/examples/index.d.ts","default":"./fesm2022/daffodil-design-callout-examples.mjs"},"./card/examples":{"types":"./card/examples/index.d.ts","default":"./fesm2022/daffodil-design-card-examples.mjs"},"./checkbox/examples":{"types":"./checkbox/examples/index.d.ts","default":"./fesm2022/daffodil-design-checkbox-examples.mjs"},"./container/examples":{"types":"./container/examples/index.d.ts","default":"./fesm2022/daffodil-design-container-examples.mjs"},"./hero/examples":{"types":"./hero/examples/index.d.ts","default":"./fesm2022/daffodil-design-hero-examples.mjs"},"./image/examples":{"types":"./image/examples/index.d.ts","default":"./fesm2022/daffodil-design-image-examples.mjs"},"./input/examples":{"types":"./input/examples/index.d.ts","default":"./fesm2022/daffodil-design-input-examples.mjs"},"./list/examples":{"types":"./list/examples/index.d.ts","default":"./fesm2022/daffodil-design-list-examples.mjs"},"./loading-icon/examples":{"types":"./loading-icon/examples/index.d.ts","default":"./fesm2022/daffodil-design-loading-icon-examples.mjs"},"./media-gallery/examples":{"types":"./media-gallery/examples/index.d.ts","default":"./fesm2022/daffodil-design-media-gallery-examples.mjs"},"./menu/examples":{"types":"./menu/examples/index.d.ts","default":"./fesm2022/daffodil-design-menu-examples.mjs"},"./modal/examples":{"types":"./modal/examples/index.d.ts","default":"./fesm2022/daffodil-design-modal-examples.mjs"},"./navbar/examples":{"types":"./navbar/examples/index.d.ts","default":"./fesm2022/daffodil-design-navbar-examples.mjs"},"./notification/examples":{"types":"./notification/examples/index.d.ts","default":"./fesm2022/daffodil-design-notification-examples.mjs"},"./paginator/examples":{"types":"./paginator/examples/index.d.ts","default":"./fesm2022/daffodil-design-paginator-examples.mjs"},"./progress-bar/examples":{"types":"./progress-bar/examples/index.d.ts","default":"./fesm2022/daffodil-design-progress-bar-examples.mjs"},"./quantity-field/examples":{"types":"./quantity-field/examples/index.d.ts","default":"./fesm2022/daffodil-design-quantity-field-examples.mjs"},"./radio/examples":{"types":"./radio/examples/index.d.ts","default":"./fesm2022/daffodil-design-radio-examples.mjs"},"./sidebar/examples":{"types":"./sidebar/examples/index.d.ts","default":"./fesm2022/daffodil-design-sidebar-examples.mjs"},"./switch/examples":{"types":"./switch/examples/index.d.ts","default":"./fesm2022/daffodil-design-switch-examples.mjs"},"./tabs/examples":{"types":"./tabs/examples/index.d.ts","default":"./fesm2022/daffodil-design-tabs-examples.mjs"},"./text-snippet/examples":{"types":"./text-snippet/examples/index.d.ts","default":"./fesm2022/daffodil-design-text-snippet-examples.mjs"},"./toast/examples":{"types":"./toast/examples/index.d.ts","default":"./fesm2022/daffodil-design-toast-examples.mjs"},"./tree/examples":{"types":"./tree/examples/index.d.ts","default":"./fesm2022/daffodil-design-tree-examples.mjs"}},"module":"fesm2022/daffodil-design.mjs","typings":"index.d.ts","sideEffects":false,"dependencies":{"tslib":"^2.3.0"}}
+{"name":"@daffodil/design","nx":{"targets":{"build":{"outputs":["{workspaceRoot}/dist/design"]}}},"version":"0.84.0","author":"Graycore LLC","license":"MIT","bugs":{"url":"https://github.com/graycoreio/daffodil/issues"},"homepage":"https://github.com/graycoreio/daffodil","description":"A consistent, sane api driver that works with different ecommerce systems.","repository":{"type":"git","url":"https://github.com/graycoreio/daffodil"},"peerDependencies":{"@angular/animations":"^19.0.0","@angular/common":"^19.0.0","@angular/core":"^19.0.0","@angular/forms":"^19.0.0","@angular/cdk":"^19.0.0","@daffodil/core":"0.84.0","@fortawesome/angular-fontawesome":"^1.0.0","@fortawesome/fontawesome-svg-core":"^6.4.2","@fortawesome/free-solid-svg-icons":"^6.4.2","@fortawesome/free-brands-svg-icons":"^6.4.2","@fortawesome/free-regular-svg-icons":"^6.4.2","modern-normalize":"^3.0.1","rxjs":"7.8.1"},"optionalDependencies":{"@faker-js/faker":"^7.6.0"},"exports":{"./scss/global":{"sass":"./scss/global.scss"},"./scss/theme":{"sass":"./scss/theme.scss"},"./scss/utilities":{"sass":"./scss/utilities.scss"},"./scss/typography":{"sass":"./scss/typography/_index.scss"},"./package.json":{"default":"./package.json"},".":{"types":"./index.d.ts","default":"./fesm2022/daffodil-design.mjs"},"./accordion":{"types":"./accordion/index.d.ts","default":"./fesm2022/daffodil-design-accordion.mjs"},"./article":{"types":"./article/index.d.ts","default":"./fesm2022/daffodil-design-article.mjs"},"./breadcrumb":{"types":"./breadcrumb/index.d.ts","default":"./fesm2022/daffodil-design-breadcrumb.mjs"},"./button":{"types":"./button/index.d.ts","default":"./fesm2022/daffodil-design-button.mjs"},"./card":{"types":"./card/index.d.ts","default":"./fesm2022/daffodil-design-card.mjs"},"./callout":{"types":"./callout/index.d.ts","default":"./fesm2022/daffodil-design-callout.mjs"},"./container":{"types":"./container/index.d.ts","default":"./fesm2022/daffodil-design-container.mjs"},"./hero":{"types":"./hero/index.d.ts","default":"./fesm2022/daffodil-design-hero.mjs"},"./image":{"types":"./image/index.d.ts","default":"./fesm2022/daffodil-design-image.mjs"},"./link-set":{"types":"./link-set/index.d.ts","default":"./fesm2022/daffodil-design-link-set.mjs"},"./list":{"types":"./list/index.d.ts","default":"./fesm2022/daffodil-design-list.mjs"},"./loading-icon":{"types":"./loading-icon/index.d.ts","default":"./fesm2022/daffodil-design-loading-icon.mjs"},"./media-gallery":{"types":"./media-gallery/index.d.ts","default":"./fesm2022/daffodil-design-media-gallery.mjs"},"./menu":{"types":"./menu/index.d.ts","default":"./fesm2022/daffodil-design-menu.mjs"},"./modal":{"types":"./modal/index.d.ts","default":"./fesm2022/daffodil-design-modal.mjs"},"./navbar":{"types":"./navbar/index.d.ts","default":"./fesm2022/daffodil-design-navbar.mjs"},"./notification":{"types":"./notification/index.d.ts","default":"./fesm2022/daffodil-design-notification.mjs"},"./paginator":{"types":"./paginator/index.d.ts","default":"./fesm2022/daffodil-design-paginator.mjs"},"./progress-bar":{"types":"./progress-bar/index.d.ts","default":"./fesm2022/daffodil-design-progress-bar.mjs"},"./sidebar":{"types":"./sidebar/index.d.ts","default":"./fesm2022/daffodil-design-sidebar.mjs"},"./switch":{"types":"./switch/index.d.ts","default":"./fesm2022/daffodil-design-switch.mjs"},"./tabs":{"types":"./tabs/index.d.ts","default":"./fesm2022/daffodil-design-tabs.mjs"},"./text-snippet":{"types":"./text-snippet/index.d.ts","default":"./fesm2022/daffodil-design-text-snippet.mjs"},"./toast":{"types":"./toast/index.d.ts","default":"./fesm2022/daffodil-design-toast.mjs"},"./tree":{"types":"./tree/index.d.ts","default":"./fesm2022/daffodil-design-tree.mjs"},"./youtube-player":{"types":"./youtube-player/index.d.ts","default":"./fesm2022/daffodil-design-youtube-player.mjs"},"./accordion/examples":{"types":"./accordion/examples/index.d.ts","default":"./fesm2022/daffodil-design-accordion-examples.mjs"},"./article/examples":{"types":"./article/examples/index.d.ts","default":"./fesm2022/daffodil-design-article-examples.mjs"},"./breadcrumb/examples":{"types":"./breadcrumb/examples/index.d.ts","default":"./fesm2022/daffodil-design-breadcrumb-examples.mjs"},"./button/examples":{"types":"./button/examples/index.d.ts","default":"./fesm2022/daffodil-design-button-examples.mjs"},"./card/examples":{"types":"./card/examples/index.d.ts","default":"./fesm2022/daffodil-design-card-examples.mjs"},"./callout/examples":{"types":"./callout/examples/index.d.ts","default":"./fesm2022/daffodil-design-callout-examples.mjs"},"./checkbox/examples":{"types":"./checkbox/examples/index.d.ts","default":"./fesm2022/daffodil-design-checkbox-examples.mjs"},"./container/examples":{"types":"./container/examples/index.d.ts","default":"./fesm2022/daffodil-design-container-examples.mjs"},"./hero/examples":{"types":"./hero/examples/index.d.ts","default":"./fesm2022/daffodil-design-hero-examples.mjs"},"./image/examples":{"types":"./image/examples/index.d.ts","default":"./fesm2022/daffodil-design-image-examples.mjs"},"./input/examples":{"types":"./input/examples/index.d.ts","default":"./fesm2022/daffodil-design-input-examples.mjs"},"./list/examples":{"types":"./list/examples/index.d.ts","default":"./fesm2022/daffodil-design-list-examples.mjs"},"./loading-icon/examples":{"types":"./loading-icon/examples/index.d.ts","default":"./fesm2022/daffodil-design-loading-icon-examples.mjs"},"./media-gallery/examples":{"types":"./media-gallery/examples/index.d.ts","default":"./fesm2022/daffodil-design-media-gallery-examples.mjs"},"./menu/examples":{"types":"./menu/examples/index.d.ts","default":"./fesm2022/daffodil-design-menu-examples.mjs"},"./modal/examples":{"types":"./modal/examples/index.d.ts","default":"./fesm2022/daffodil-design-modal-examples.mjs"},"./navbar/examples":{"types":"./navbar/examples/index.d.ts","default":"./fesm2022/daffodil-design-navbar-examples.mjs"},"./notification/examples":{"types":"./notification/examples/index.d.ts","default":"./fesm2022/daffodil-design-notification-examples.mjs"},"./paginator/examples":{"types":"./paginator/examples/index.d.ts","default":"./fesm2022/daffodil-design-paginator-examples.mjs"},"./progress-bar/examples":{"types":"./progress-bar/examples/index.d.ts","default":"./fesm2022/daffodil-design-progress-bar-examples.mjs"},"./quantity-field/examples":{"types":"./quantity-field/examples/index.d.ts","default":"./fesm2022/daffodil-design-quantity-field-examples.mjs"},"./radio/examples":{"types":"./radio/examples/index.d.ts","default":"./fesm2022/daffodil-design-radio-examples.mjs"},"./sidebar/examples":{"types":"./sidebar/examples/index.d.ts","default":"./fesm2022/daffodil-design-sidebar-examples.mjs"},"./switch/examples":{"types":"./switch/examples/index.d.ts","default":"./fesm2022/daffodil-design-switch-examples.mjs"},"./tabs/examples":{"types":"./tabs/examples/index.d.ts","default":"./fesm2022/daffodil-design-tabs-examples.mjs"},"./text-snippet/examples":{"types":"./text-snippet/examples/index.d.ts","default":"./fesm2022/daffodil-design-text-snippet-examples.mjs"},"./toast/examples":{"types":"./toast/examples/index.d.ts","default":"./fesm2022/daffodil-design-toast-examples.mjs"},"./tree/examples":{"types":"./tree/examples/index.d.ts","default":"./fesm2022/daffodil-design-tree-examples.mjs"}},"module":"fesm2022/daffodil-design.mjs","typings":"index.d.ts","sideEffects":false,"dependencies":{"tslib":"^2.3.0"}}

package/paginator/src/paginator-theme.scss

@@ -2,33 +2,38 @@
 @use '../../scss/core';
 @use '../../scss/theming';
 
+// stylelint-disable selector-class-pattern
 @mixin daff-paginator-theme($theme) {
-	$primary: core.daff-map-get($theme, primary);
-	$secondary: core.daff-map-get($theme, secondary);
-	$tertiary: core.daff-map-get($theme, tertiary);
-	$base: core.daff-map-get($theme, 'core', 'base');
 	$base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
 	$white: core.daff-map-get($theme, 'core', 'white');
-	$black: core.daff-map-get($theme, 'core', 'black');
 	$neutral: core.daff-map-get($theme, 'core', 'neutral');
-	$font-color: core.daff-map-get($theme, 'core', 'font-color');
+	$type: core.daff-map-get($theme, 'core', 'type');
 
 	.daff-paginator {
 		&__previous,
-		&__next {
-			color: $font-color;
-		}
-
+		&__next,
 		&__page-link {
-			color: $font-color;
+			color: $base-contrast;
+		}
 
-			// stylelint-disable selector-class-pattern
-			&:hover,
-			&.selected {
-				color: daff-text-contrast(theming.daff-illuminate($base, $neutral, 2));
+		@include theming.light($type) {
+			&__page-link {
+				&:hover,
+				&.selected {
+					&::after {
+						background: theming.daff-color($neutral, 20);
+					}
+				}
+			}
+		}
 
-				&::after {
-					background: theming.daff-illuminate($base, $neutral, 2);
+		@include theming.dark($type) {
+			&__page-link {
+				&:hover,
+				&.selected {
+					&::after {
+						background: theming.daff-color($neutral, 90);
+					}
 				}
 			}
 		}

package/progress-bar/progress-bar-label/progress-bar-label.directive.d.ts

@@ -1,5 +1,8 @@
 import * as i0 from "@angular/core";
 export declare class DaffProgressBarLabelDirective {
+    /**
+     * @docs-private
+     */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffProgressBarLabelDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<DaffProgressBarLabelDirective, "[daffProgressBarLabel]", never, {}, {}, never, never, true, never>;