@daffodil/design 0.77.0 → 0.79.0

package/button/src/button/stroked/stroked-theme.scss

@@ -0,0 +1,158 @@
+@use 'sass:map';
+@use '../../../../scss/theming';
+@use '../../../../scss/core';
+
+@mixin daff-stroked-button-theme-variant(
+	$base-color,
+	$active-color
+) {
+	border: 1px solid $base-color;
+	color: $base-color;
+	background-color: transparent;
+
+	&:after {
+		background-color: $base-color;
+	}
+
+	&:hover {
+		color: theming.daff-text-contrast($base-color);
+	}
+
+	&:active {
+		border: 1px solid $active-color;
+		color: theming.daff-text-contrast($active-color);
+
+		&:after {
+			background-color: $active-color;
+		}
+	}
+}
+
+@mixin daff-stroked-button-theme($theme) {
+	$primary: map.get($theme, primary);
+	$secondary: map.get($theme, secondary);
+	$tertiary: map.get($theme, tertiary);
+	$info: map.get($theme, info);
+	$warn: map.get($theme, warn);
+	$critical: map.get($theme, critical);
+	$success: map.get($theme, success);
+	$base: core.daff-map-deep-get($theme, 'core.base');
+	$base-contrast: core.daff-map-deep-get($theme, 'core.base-contrast');
+	$white: core.daff-map-deep-get($theme, 'core.white');
+	$black: core.daff-map-deep-get($theme, 'core.black');
+	$neutral: core.daff-map-deep-get($theme, 'core.neutral');
+
+	.daff-stroked-button {
+		background: transparent;
+		border: 1px solid theming.daff-illuminate($base, $neutral, 5);
+		color: currentColor;
+
+		&:after {
+			background: theming.daff-illuminate($base, $neutral, 2);
+		}
+
+		&:hover {
+			border: 1px solid theming.daff-illuminate($base, $neutral, 2);
+			color: theming.daff-text-contrast(
+				theming.daff-illuminate($base, $neutral, 2)
+			);
+		}
+
+		&:active {
+			border: 1px solid theming.daff-illuminate($base, $neutral, 3);
+			color: theming.daff-text-contrast(
+				theming.daff-illuminate($base, $neutral, 3)
+			);
+
+			&:after {
+				background: theming.daff-illuminate($base, $neutral, 3);
+			}
+		}
+
+		&.daff-primary {
+			@include daff-stroked-button-theme-variant(
+				theming.daff-color($primary),
+				theming.daff-color($primary, 70)
+			);
+		}
+
+		&.daff-secondary {
+			@include daff-stroked-button-theme-variant(
+				theming.daff-color($secondary),
+				theming.daff-color($secondary, 70)
+			);
+		}
+
+		&.daff-tertiary {
+			@include daff-stroked-button-theme-variant(
+				theming.daff-color($tertiary),
+				theming.daff-color($tertiary, 70)
+			);
+		}
+
+		&.daff-black {
+			@include daff-stroked-button-theme-variant(
+				$black,
+				theming.daff-color($neutral, 100)
+			);
+		}
+
+		&.daff-white {
+			@include daff-stroked-button-theme-variant(
+				$white,
+				theming.daff-color($neutral, 20)
+			);
+		}
+
+		&.daff-theme {
+			@include daff-stroked-button-theme-variant(
+				$base,
+				theming.daff-illuminate($base, $neutral, 2)
+			);
+		}
+
+		&.daff-theme-contrast {
+			@include daff-stroked-button-theme-variant(
+				$base-contrast,
+				theming.daff-illuminate($base-contrast, $neutral, 2)
+			);
+		}
+
+		&[disabled],
+		&.disabled {
+			background-color: transparent;
+			border-color: theming.daff-illuminate($base, $neutral, 3);
+			color: theming.daff-illuminate($base, $neutral, 5);
+
+			&:hover {
+				color: theming.daff-illuminate($base, $neutral, 5);
+
+				&:after {
+					background-color: transparent;
+					opacity: 0;
+				}
+			}
+		}
+
+		&.daff-warn {
+			@include daff-stroked-button-theme-variant(
+				theming.daff-color($warn),
+				theming.daff-color($warn, 70)
+			);
+		}
+
+		&.daff-critical {
+			@include daff-stroked-button-theme-variant(
+				theming.daff-color($critical),
+				theming.daff-color($critical, 70)
+			);
+		}
+
+		&.daff-success {
+			@include daff-stroked-button-theme-variant(
+				theming.daff-color($success),
+				theming.daff-color($success, 70)
+			);
+		}
+	}
+}

package/button/src/button/underline/underline-theme.scss

@@ -0,0 +1,93 @@
+@use 'sass:map';
+@use '../../../../scss/theming';
+@use '../../../../scss/core';
+
+@mixin daff-underline-button-theme-variant(
+	$base-color: currentColor,
+) {
+	color: $base-color;
+
+	&::after {
+		background-color: $base-color;
+	}
+}
+
+@mixin daff-underline-button-theme($theme) {
+	$primary: map.get($theme, primary);
+	$secondary: map.get($theme, secondary);
+	$tertiary: map.get($theme, tertiary);
+	$info: map.get($theme, info);
+	$warn: map.get($theme, warn);
+	$critical: map.get($theme, critical);
+	$success: map.get($theme, success);
+	$base: core.daff-map-deep-get($theme, 'core.base');
+	$base-contrast: core.daff-map-deep-get($theme, 'core.base-contrast');
+	$white: core.daff-map-deep-get($theme, 'core.white');
+	$black: core.daff-map-deep-get($theme, 'core.black');
+	$neutral: core.daff-map-deep-get($theme, 'core.neutral');
+
+	.daff-underline-button {
+		@include daff-underline-button-theme-variant(
+			theming.daff-illuminate($base, $neutral, 7)
+		);
+
+		&.daff-primary {
+			@include daff-underline-button-theme-variant(
+				theming.daff-color($primary)
+			);
+		}
+
+		&.daff-secondary {
+			@include daff-underline-button-theme-variant(
+				theming.daff-color($secondary)
+			);
+		}
+
+		&.daff-tertiary {
+			@include daff-underline-button-theme-variant(
+				theming.daff-color($tertiary)
+			);
+		}
+
+		&.daff-black {
+			@include daff-underline-button-theme-variant($black);
+		}
+
+		&.daff-white {
+			@include daff-underline-button-theme-variant($white);
+		}
+
+		&.daff-theme {
+			@include daff-underline-button-theme-variant($base);
+		}
+
+		&.daff-theme-contrast {
+			@include daff-underline-button-theme-variant($base-contrast);
+		}
+
+		&[disabled],
+		&.disabled {
+			@include daff-underline-button-theme-variant(
+				theming.daff-illuminate($base, $neutral, 4)
+			);
+		}
+
+		&.daff-warn {
+			@include daff-underline-button-theme-variant(
+				theming.daff-color($warn)
+			);
+		}
+
+		&.daff-critical {
+			@include daff-underline-button-theme-variant(
+				theming.daff-color($critical)
+			);
+		}
+
+		&.daff-success {
+			@include daff-underline-button-theme-variant(
+				theming.daff-color($success)
+			);
+		}
+	}
+}

package/callout/README.md

@@ -4,6 +4,48 @@ Callout is a versatile component that can be used to easily highlight a piece of
 ## Overview
 Callouts can be used multiple times on a page. It's a flexible and extensible component that includes pre-styled content containers. It can be used alongside a product list to highlight a set of products, quickly lay out an accordion, showcase a set of features, etc.
 
+## Usage
+
+### Within a standalone component
+To use callout in a standalone component, import it directly into your custom component:
+
+```ts
+@Component({
+  selector: 'custom-component',
+  templateUrl: './custom-component.component.html',
+  standalone: true,
+  imports: [
+    DAFF_CALLOUT_COMPONENTS,
+  ],
+})
+export class CustomComponent {}
+```
+
+### Within a module (deprecated)
+To use callout in a module, import `DaffCalloutModule` into your custom module:
+
+```ts
+import { NgModule } from '@angular/core';
+
+import { DaffCalloutModule } from '@daffodil/design/callout';
+
+@NgModule({
+	declarations: [
+    CustomComponent,
+  ],
+  exports: [
+    CustomComponent,
+  ],
+  imports: [
+    DaffCalloutModule,
+  ],
+})
+export class CustomComponentModule { }
+```
+
+> This method is deprecated. It's recommended to update all custom components to standalone.
+
+
 ## Supported Content Types
 A `<daff-callout>` supports transclusion of any content and includes stylized `icon`, `tagline`, `title`, `subtitle`, and `body` content containers.
 

package/callout/callout/callout.component.d.ts

@@ -12,5 +12,5 @@ export declare class DaffCalloutComponent {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCalloutComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DaffCalloutComponent, "daff-callout", never, {}, {}, never, ["*"], false, [{ directive: typeof i1.DaffArticleEncapsulatedDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DaffManageContainerLayoutDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DaffTextAlignableDirective; inputs: { "textAlignment": "textAlignment"; }; outputs: {}; }, { directive: typeof i1.DaffCompactableDirective; inputs: { "compact": "compact"; }; outputs: {}; }, { directive: typeof i1.DaffColorableDirective; inputs: { "color": "color"; }; outputs: {}; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DaffCalloutComponent, "daff-callout", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.DaffArticleEncapsulatedDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DaffManageContainerLayoutDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DaffTextAlignableDirective; inputs: { "textAlignment": "textAlignment"; }; outputs: {}; }, { directive: typeof i1.DaffCompactableDirective; inputs: { "compact": "compact"; }; outputs: {}; }, { directive: typeof i1.DaffColorableDirective; inputs: { "color": "color"; }; outputs: {}; }]>;
 }

package/callout/callout-body/callout-body.directive.d.ts

@@ -5,5 +5,5 @@ export declare class DaffCalloutBodyDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCalloutBodyDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutBodyDirective, "[daffCalloutBody]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutBodyDirective, "[daffCalloutBody]", never, {}, {}, never, never, true, never>;
 }

package/callout/callout-icon/callout-icon.directive.d.ts

@@ -5,5 +5,5 @@ export declare class DaffCalloutIconDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCalloutIconDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutIconDirective, "[daffCalloutIcon]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutIconDirective, "[daffCalloutIcon]", never, {}, {}, never, never, true, never>;
 }

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

@@ -5,5 +5,5 @@ export declare class DaffCalloutSubtitleDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCalloutSubtitleDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutSubtitleDirective, "[daffCalloutSubtitle]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutSubtitleDirective, "[daffCalloutSubtitle]", never, {}, {}, never, never, true, never>;
 }

package/callout/callout-tagline/callout-tagline.directive.d.ts

@@ -5,5 +5,5 @@ export declare class DaffCalloutTaglineDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCalloutTaglineDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutTaglineDirective, "[daffCalloutTagline]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutTaglineDirective, "[daffCalloutTagline]", never, {}, {}, never, never, true, never>;
 }

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

@@ -5,5 +5,5 @@ export declare class DaffCalloutTitleDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCalloutTitleDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutTitleDirective, "[daffCalloutTitle]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCalloutTitleDirective, "[daffCalloutTitle]", never, {}, {}, never, never, true, never>;
 }

package/callout/callout.d.ts

@@ -0,0 +1,7 @@
+import { DaffCalloutComponent } from './callout/callout.component';
+import { DaffCalloutBodyDirective } from './callout-body/callout-body.directive';
+import { DaffCalloutIconDirective } from './callout-icon/callout-icon.directive';
+import { DaffCalloutSubtitleDirective } from './callout-subtitle/callout-subtitle.directive';
+import { DaffCalloutTaglineDirective } from './callout-tagline/callout-tagline.directive';
+import { DaffCalloutTitleDirective } from './callout-title/callout-title.directive';
+export declare const DAFF_CALLOUT_COMPONENTS: readonly [typeof DaffCalloutComponent, typeof DaffCalloutIconDirective, typeof DaffCalloutTitleDirective, typeof DaffCalloutSubtitleDirective, typeof DaffCalloutTaglineDirective, typeof DaffCalloutBodyDirective];

package/callout/callout.module.d.ts

@@ -1,13 +1,14 @@
 import * as i0 from "@angular/core";
-import * as i1 from "./callout/callout.component";
-import * as i2 from "./callout-icon/callout-icon.directive";
-import * as i3 from "./callout-title/callout-title.directive";
-import * as i4 from "./callout-subtitle/callout-subtitle.directive";
-import * as i5 from "./callout-tagline/callout-tagline.directive";
-import * as i6 from "./callout-body/callout-body.directive";
-import * as i7 from "@angular/common";
+import * as i1 from "@angular/common";
+import * as i2 from "./callout/callout.component";
+import * as i3 from "./callout-icon/callout-icon.directive";
+import * as i4 from "./callout-title/callout-title.directive";
+import * as i5 from "./callout-subtitle/callout-subtitle.directive";
+import * as i6 from "./callout-tagline/callout-tagline.directive";
+import * as i7 from "./callout-body/callout-body.directive";
+/** @deprecated in favor of {@link DAFF_CALLOUT_COMPONENTS} */
 export declare class DaffCalloutModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCalloutModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DaffCalloutModule, [typeof i1.DaffCalloutComponent, typeof i2.DaffCalloutIconDirective, typeof i3.DaffCalloutTitleDirective, typeof i4.DaffCalloutSubtitleDirective, typeof i5.DaffCalloutTaglineDirective, typeof i6.DaffCalloutBodyDirective], [typeof i7.CommonModule], [typeof i1.DaffCalloutComponent, typeof i2.DaffCalloutIconDirective, typeof i4.DaffCalloutSubtitleDirective, typeof i3.DaffCalloutTitleDirective, typeof i5.DaffCalloutTaglineDirective, typeof i6.DaffCalloutBodyDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DaffCalloutModule, never, [typeof i1.CommonModule, typeof i2.DaffCalloutComponent, typeof i3.DaffCalloutIconDirective, typeof i4.DaffCalloutTitleDirective, typeof i5.DaffCalloutSubtitleDirective, typeof i6.DaffCalloutTaglineDirective, typeof i7.DaffCalloutBodyDirective], [typeof i2.DaffCalloutComponent, typeof i3.DaffCalloutIconDirective, typeof i5.DaffCalloutSubtitleDirective, typeof i4.DaffCalloutTitleDirective, typeof i6.DaffCalloutTaglineDirective, typeof i7.DaffCalloutBodyDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DaffCalloutModule>;
 }

package/callout/public_api.d.ts

@@ -1,4 +1,5 @@
 export { DaffCalloutModule } from './callout.module';
+export { DAFF_CALLOUT_COMPONENTS } from './callout';
 export * from './callout/callout.component';
 export * from './callout-icon/callout-icon.directive';
 export * from './callout-tagline/callout-tagline.directive';

package/card/README.md

@@ -9,6 +9,47 @@ The example below is a default, filled card that includes all of a card's pre-st
 
 <design-land-example-viewer-container example="basic-card"></design-land-example-viewer-container>
 
+## Usage
+
+### Within a standalone component
+To use card in a standalone component, import it directly into your custom component:
+
+```ts
+@Component({
+  selector: 'custom-component',
+  templateUrl: './custom-component.component.html',
+  standalone: true,
+  imports: [
+    DAFF_CARD_COMPONENTS,
+  ],
+})
+export class CustomComponent {}
+```
+
+### Within a module (deprecated)
+To use card in a module, import `DaffCardModule` into your custom module:
+
+```ts
+import { NgModule } from '@angular/core';
+
+import { DaffCardModule } from '@daffodil/design/card';
+
+@NgModule({
+	declarations: [
+    CustomComponent,
+  ],
+  exports: [
+    CustomComponent,
+  ],
+  imports: [
+    DaffCardModule,
+  ],
+})
+export class CustomComponentModule { }
+```
+
+> This method is deprecated. It's recommended to update all custom components to standalone.
+
 ## Supported Content Types
 A card supports a wide variety of content and includes minimally pre-styled `image`, `icon`, `tagline`, `title`, `content`, and `actions` content containers.
 

package/card/card/card.component.d.ts

@@ -44,5 +44,5 @@ export declare class DaffCardComponent implements OnInit {
      * */
     private _hasHostAttributes;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DaffCardComponent, "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", never, { "orientation": { "alias": "orientation"; "required": false; }; }, {}, never, ["[daffCardImage]", "[daffCardIcon]", "[daffCardTagline]", "[daffCardTitle]", "[daffCardContent]", "[daffCardActions]"], false, [{ directive: typeof i1.DaffArticleEncapsulatedDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DaffColorableDirective; inputs: { "color": "color"; }; outputs: {}; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DaffCardComponent, "daff-card,daff-raised-card,daff-stroked-card,a[daff-card],a[daff-raised-card],a[daff-stroked-card]", never, { "orientation": { "alias": "orientation"; "required": false; }; }, {}, never, ["[daffCardImage]", "[daffCardIcon]", "[daffCardTagline]", "[daffCardTitle]", "[daffCardContent]", "[daffCardActions]"], true, [{ directive: typeof i1.DaffArticleEncapsulatedDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DaffColorableDirective; inputs: { "color": "color"; }; outputs: {}; }]>;
 }

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

@@ -5,5 +5,5 @@ export declare class DaffCardActionsDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardActionsDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardActionsDirective, "[daffCardActions]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardActionsDirective, "[daffCardActions]", never, {}, {}, never, never, true, never>;
 }

package/card/card-content/card-content.directive.d.ts

@@ -5,5 +5,5 @@ export declare class DaffCardContentDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardContentDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardContentDirective, "[daffCardContent]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardContentDirective, "[daffCardContent]", never, {}, {}, never, never, true, never>;
 }

package/card/card-icon/card-icon.directive.d.ts

@@ -5,5 +5,5 @@ export declare class DaffCardIconDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardIconDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardIconDirective, "[daffCardIcon]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardIconDirective, "[daffCardIcon]", never, {}, {}, never, never, true, never>;
 }

package/card/card-image/card-image.directive.d.ts

@@ -5,5 +5,5 @@ export declare class DaffCardImageDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardImageDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardImageDirective, "[daffCardImage]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardImageDirective, "[daffCardImage]", never, {}, {}, never, never, true, never>;
 }

package/card/card-tagline/card-tagline.directive.d.ts

@@ -5,5 +5,5 @@ export declare class DaffCardTaglineDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardTaglineDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardTaglineDirective, "[daffCardTagline]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardTaglineDirective, "[daffCardTagline]", never, {}, {}, never, never, true, never>;
 }

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

@@ -5,5 +5,5 @@ export declare class DaffCardTitleDirective {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardTitleDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardTitleDirective, "[daffCardTitle]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DaffCardTitleDirective, "[daffCardTitle]", never, {}, {}, never, never, true, never>;
 }

package/card/card.d.ts

@@ -0,0 +1,8 @@
+import { DaffCardComponent } from './card/card.component';
+import { DaffCardActionsDirective } from './card-actions/card-actions.directive';
+import { DaffCardContentDirective } from './card-content/card-content.directive';
+import { DaffCardIconDirective } from './card-icon/card-icon.directive';
+import { DaffCardImageDirective } from './card-image/card-image.directive';
+import { DaffCardTaglineDirective } from './card-tagline/card-tagline.directive';
+import { DaffCardTitleDirective } from './card-title/card-title.directive';
+export declare const DAFF_CARD_COMPONENTS: readonly [typeof DaffCardComponent, typeof DaffCardIconDirective, typeof DaffCardImageDirective, typeof DaffCardTaglineDirective, typeof DaffCardTitleDirective, typeof DaffCardContentDirective, typeof DaffCardActionsDirective];

package/card/card.module.d.ts

@@ -1,14 +1,17 @@
 import * as i0 from "@angular/core";
-import * as i1 from "./card/card.component";
-import * as i2 from "./card-icon/card-icon.directive";
-import * as i3 from "./card-image/card-image.directive";
-import * as i4 from "./card-tagline/card-tagline.directive";
-import * as i5 from "./card-title/card-title.directive";
-import * as i6 from "./card-content/card-content.directive";
-import * as i7 from "./card-actions/card-actions.directive";
-import * as i8 from "@angular/common";
+import * as i1 from "@angular/common";
+import * as i2 from "./card/card.component";
+import * as i3 from "./card-icon/card-icon.directive";
+import * as i4 from "./card-image/card-image.directive";
+import * as i5 from "./card-tagline/card-tagline.directive";
+import * as i6 from "./card-title/card-title.directive";
+import * as i7 from "./card-content/card-content.directive";
+import * as i8 from "./card-actions/card-actions.directive";
+/**
+ * @deprecated in favor of {@link DAFF_CARD_COMPONENTS} Deprecated in version 0.78.0. Will be removed in version 0.81.0.
+ */
 export declare class DaffCardModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffCardModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DaffCardModule, [typeof i1.DaffCardComponent, typeof i2.DaffCardIconDirective, typeof i3.DaffCardImageDirective, typeof i4.DaffCardTaglineDirective, typeof i5.DaffCardTitleDirective, typeof i6.DaffCardContentDirective, typeof i7.DaffCardActionsDirective], [typeof i8.CommonModule], [typeof i1.DaffCardComponent, typeof i2.DaffCardIconDirective, typeof i3.DaffCardImageDirective, typeof i4.DaffCardTaglineDirective, typeof i5.DaffCardTitleDirective, typeof i6.DaffCardContentDirective, typeof i7.DaffCardActionsDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DaffCardModule, never, [typeof i1.CommonModule, typeof i2.DaffCardComponent, typeof i3.DaffCardIconDirective, typeof i4.DaffCardImageDirective, typeof i5.DaffCardTaglineDirective, typeof i6.DaffCardTitleDirective, typeof i7.DaffCardContentDirective, typeof i8.DaffCardActionsDirective], [typeof i2.DaffCardComponent, typeof i3.DaffCardIconDirective, typeof i4.DaffCardImageDirective, typeof i5.DaffCardTaglineDirective, typeof i6.DaffCardTitleDirective, typeof i7.DaffCardContentDirective, typeof i8.DaffCardActionsDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DaffCardModule>;
 }

package/card/public_api.d.ts

@@ -1,4 +1,5 @@
 export { DaffCardModule } from './card.module';
+export { DAFF_CARD_COMPONENTS } from './card';
 export * from './card/card.component';
 export * from './card-icon/card-icon.directive';
 export * from './card-image/card-image.directive';

package/container/README.md

@@ -17,5 +17,46 @@ Supported sizes: `xs | sm | md | lg | xl`
 | Large       | 1340px    | lg     |
 | Extra Large | 1920px    | xl     |
 
+<design-land-example-viewer-container example="container-sizes"></design-land-example-viewer-container>
+
+
 ## Usage
-<design-land-example-viewer-container example="container-sizes"></design-land-example-viewer-container>
+
+### Within a standalone component
+To use container in a standalone component, import it directly into your custom component:
+
+```ts
+@Component({
+  selector: 'custom-component',
+  templateUrl: './custom-component.component.html',
+  standalone: true,
+  imports: [
+    DAFF_CONTAINER_COMPONENTS,
+  ],
+})
+export class CustomComponent {}
+```
+
+### Within a module (deprecated)
+To use container in a module, import `DaffCalloutModule` into your custom module:
+
+```ts
+import { NgModule } from '@angular/core';
+
+import { DaffCalloutModule } from '@daffodil/design/container';
+
+@NgModule({
+	declarations: [
+    CustomComponent,
+  ],
+  exports: [
+    CustomComponent,
+  ],
+  imports: [
+    DaffCalloutModule,
+  ],
+})
+export class CustomComponentModule { }
+```
+
+> This method is deprecated. It's recommended to update all custom components to standalone.

package/container/container/container.component.d.ts

@@ -9,5 +9,5 @@ export declare class DaffContainerComponent {
      */
     class: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffContainerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DaffContainerComponent, "daff-container", never, {}, {}, never, ["*"], false, [{ directive: typeof i1.DaffSizableDirective; inputs: { "size": "size"; }; outputs: {}; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DaffContainerComponent, "daff-container", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.DaffSizableDirective; inputs: { "size": "size"; }; outputs: {}; }]>;
 }

package/container/container.d.ts

@@ -0,0 +1,2 @@
+import { DaffContainerComponent } from './container/container.component';
+export declare const DAFF_CONTAINER_COMPONENTS: readonly [typeof DaffContainerComponent];

package/container/container.module.d.ts

@@ -1,8 +1,11 @@
 import * as i0 from "@angular/core";
-import * as i1 from "./container/container.component";
-import * as i2 from "@angular/common";
+import * as i1 from "@angular/common";
+import * as i2 from "./container/container.component";
+/**
+ * @deprecated in favor of {@link DAFF_CONTAINER_COMPONENTS} Deprecated in version 0.78.0. Will be removed in version 0.81.0.
+ */
 export declare class DaffContainerModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<DaffContainerModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<DaffContainerModule, [typeof i1.DaffContainerComponent], [typeof i2.CommonModule], [typeof i1.DaffContainerComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DaffContainerModule, never, [typeof i1.CommonModule, typeof i2.DaffContainerComponent], [typeof i2.DaffContainerComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<DaffContainerModule>;
 }

package/container/public_api.d.ts

@@ -1,2 +1,3 @@
 export { DaffContainerComponent } from './container/container.component';
 export { DaffContainerModule } from './container.module';
+export { DAFF_CONTAINER_COMPONENTS } from './container';

package/core/openable/openable.d.ts

@@ -0,0 +1,13 @@
+/**
+ * An interface for giving a component the ability to display an open UI.
+ */
+export interface DaffOpenable {
+    /** Whether a component is open or not */
+    open: boolean;
+    /** Reveal the component */
+    reveal: () => void;
+    /** Hide the component */
+    hide: () => void;
+    /** Toggles the component between open and not open */
+    toggle: () => void;
+}