@daffodil/design 0.92.3 → 0.93.1

package/fesm2022/daffodil-design-spinner.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-spinner.mjs","sources":["../../../libs/design/spinner/src/spinner-label/spinner-label.directive.ts","../../../libs/design/spinner/src/spinner.component.ts","../../../libs/design/spinner/src/spinner.component.html","../../../libs/design/spinner/src/spinner.ts","../../../libs/design/spinner/src/daffodil-design-spinner.ts"],"sourcesContent":["import { Directive } from '@angular/core';\n\n/**\n * Labels are used to describe the loading state and provide context for users.\n * They are optional.\n *\n * @usage\n * ```html\n * <daff-spinner-label>Loading</daff-spinner-label>\n * ```\n */\n@Directive({\n  /* eslint-disable-next-line @angular-eslint/directive-selector */\n  selector: 'daff-spinner-label',\n})\nexport class DaffSpinnerLabelDirective {}\n","import {\n  Component,\n  ChangeDetectionStrategy,\n  input,\n  ContentChild,\n} from '@angular/core';\n\nimport {\n  DaffColorableDirective,\n  DaffSizableDirective,\n  DaffSizeAllType,\n} from '@daffodil/design';\n\nimport { DaffSpinnerLabelDirective } from './spinner-label/spinner-label.directive';\n\n/**\n * DaffSpinnerComponent is an animated indicator that lets users know content or action is being loaded.\n */\n@Component({\n  selector: 'daff-spinner',\n  templateUrl: './spinner.component.html',\n  styleUrl: './spinner.component.scss',\n  host: {\n    class: 'daff-spinner',\n    role: 'status',\n    '[attr.aria-label]': '_ariaLabel',\n  },\n  hostDirectives: [\n    {\n      directive: DaffColorableDirective,\n      inputs: ['color'],\n    },\n    {\n      directive: DaffSizableDirective,\n      inputs: ['size'],\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DaffSpinnerComponent {\n  /**\n   * @docs-private\n   */\n  @ContentChild(DaffSpinnerLabelDirective) _label: DaffSpinnerLabelDirective;\n\n  private static readonly SIZE_MAP: Record<DaffSizeAllType, number> = {\n    xs: 12,\n    sm: 16,\n    md: 32,\n    lg: 40,\n    xl: 48,\n  };\n\n  /**\n   * The `aria-label` for the spinner. Defaults to \"loading\".\n   */\n  ariaLabel = input('loading', { alias: 'aria-label' });\n\n  /**\n   * @docs-private\n   */\n  get _ariaLabel() {\n    if (!this._label) {\n      return this.ariaLabel();\n    }\n  }\n\n  /**\n   * @docs-private\n   *\n   * The dimension (width/height) based on the size.\n   */\n  get dimension() {\n    return DaffSpinnerComponent.SIZE_MAP[this.sizable.size];\n  }\n\n  constructor(\n    private sizable: DaffSizableDirective<DaffSizeAllType>,\n  ) {\n    this.sizable.defaultSize = 'md';\n  }\n}\n","<svg\n  [attr.height]=\"dimension\"\n  [attr.width]=\"dimension\"\n  viewBox=\"0 0 16 16\"\n  fill=\"none\"\n  aria-hidden=\"true\"\n  class=\"daff-spinner__svg\">\n  <circle class=\"daff-spinner__track\" cx=\"8\" cy=\"8\" r=\"7\" vector-effect=\"non-scaling-stroke\"></circle>\n  <path class=\"daff-spinner__path\" d=\"M15 8a7.002 7.002 0 00-7-7\" vector-effect=\"non-scaling-stroke\"></path>\n</svg>\n@if (_label) {\n  <div class=\"daff-spinner__label\">\n    <ng-content select=\"daff-spinner-label\"></ng-content>\n  </div>\n}","import { DaffSpinnerLabelDirective } from './spinner-label/spinner-label.directive';\nimport { DaffSpinnerComponent } from './spinner.component';\n\n/**\n * @docs-private\n */\nexport const DAFF_SPINNER_COMPONENTS = <const> [\n  DaffSpinnerComponent,\n  DaffSpinnerLabelDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"daffodil-design-spinner.mjs","sources":["../../../libs/design/spinner/src/spinner-label/spinner-label.directive.ts","../../../libs/design/spinner/src/spinner.component.ts","../../../libs/design/spinner/src/spinner.component.html","../../../libs/design/spinner/src/spinner.ts","../../../libs/design/spinner/src/daffodil-design-spinner.ts"],"sourcesContent":["import { Directive } from '@angular/core';\n\n/**\n * Labels are used to describe the loading state and provide context for users.\n * They are optional.\n *\n * @usage\n * ```html\n * <daff-spinner-label>Loading</daff-spinner-label>\n * ```\n */\n@Directive({\n  /* eslint-disable-next-line @angular-eslint/directive-selector */\n  selector: 'daff-spinner-label',\n})\nexport class DaffSpinnerLabelDirective {}\n","import {\n  Component,\n  ChangeDetectionStrategy,\n  input,\n  ContentChild,\n} from '@angular/core';\n\nimport {\n  DaffColorableDirective,\n  DaffSizableDirective,\n  DaffSizeAllType,\n} from '@daffodil/design';\n\nimport { DaffSpinnerLabelDirective } from './spinner-label/spinner-label.directive';\n\n/**\n * DaffSpinnerComponent is an animated indicator that lets users know content or action is being loaded.\n */\n@Component({\n  selector: 'daff-spinner',\n  templateUrl: './spinner.component.html',\n  styleUrl: './spinner.component.scss',\n  host: {\n    class: 'daff-spinner',\n    role: 'status',\n    '[attr.aria-label]': '_ariaLabel',\n  },\n  hostDirectives: [\n    {\n      directive: DaffColorableDirective,\n      inputs: ['color'],\n    },\n    {\n      directive: DaffSizableDirective,\n      inputs: ['size'],\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DaffSpinnerComponent {\n  /**\n   * @docs-private\n   */\n  @ContentChild(DaffSpinnerLabelDirective) _label: DaffSpinnerLabelDirective;\n\n  private static readonly SIZE_MAP: Record<DaffSizeAllType, number> = {\n    xs: 12,\n    sm: 16,\n    md: 32,\n    lg: 40,\n    xl: 48,\n  };\n\n  /**\n   * The `aria-label` for the spinner. Defaults to \"loading\".\n   */\n  ariaLabel = input('loading', { alias: 'aria-label' });\n\n  /**\n   * @docs-private\n   */\n  get _ariaLabel() {\n    if (!this._label) {\n      return this.ariaLabel();\n    }\n  }\n\n  /**\n   * @docs-private\n   *\n   * The dimension (width/height) based on the size.\n   */\n  get dimension() {\n    return DaffSpinnerComponent.SIZE_MAP[this.sizable.size];\n  }\n\n  constructor(\n    private sizable: DaffSizableDirective<DaffSizeAllType>,\n  ) {\n    this.sizable.defaultSize = 'md';\n  }\n}\n","<svg\n  [attr.height]=\"dimension\"\n  [attr.width]=\"dimension\"\n  viewBox=\"0 0 16 16\"\n  fill=\"none\"\n  aria-hidden=\"true\"\n  class=\"daff-spinner__svg\">\n  <circle class=\"daff-spinner__track\" cx=\"8\" cy=\"8\" r=\"7\" vector-effect=\"non-scaling-stroke\"></circle>\n  <path class=\"daff-spinner__path\" d=\"M15 8a7.002 7.002 0 00-7-7\" vector-effect=\"non-scaling-stroke\"></path>\n</svg>\n@if (_label) {\n  <div class=\"daff-spinner__label\">\n    <ng-content select=\"daff-spinner-label\"></ng-content>\n  </div>\n}","import { DaffSpinnerLabelDirective } from './spinner-label/spinner-label.directive';\nimport { DaffSpinnerComponent } from './spinner.component';\n\n/**\n * @docs-private\n */\nexport const DAFF_SPINNER_COMPONENTS = <const> [\n  DaffSpinnerComponent,\n  DaffSpinnerLabelDirective,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/daffodil-design-switch.mjs

@@ -70,10 +70,10 @@ class DaffSwitchComponent extends DaffSizableDirective {
             this.toggled.emit(this.checked);
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffSwitchComponent, deps: [{ token: i1.DaffDisableableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: DaffSwitchComponent, isStandalone: true, selector: "daff-switch", inputs: { labelPosition: "labelPosition", disabled: "disabled", checked: "checked", id: "id" }, outputs: { toggled: "toggled" }, host: { properties: { "class.checked": "checked", "class.left": "labelPosition === \"left\"", "class.right": "labelPosition === \"right\"", "class.top": "labelPosition === \"top\"", "class.bottom": "labelPosition === \"bottom\"" }, classAttribute: "daff-switch" }, usesInheritance: true, hostDirectives: [{ directive: i1.DaffSizableDirective, inputs: ["size", "size"] }, { directive: i1.DaffDisableableDirective, inputs: ["disabled", "disabled"] }], ngImport: i0, template: "<label class=\"daff-switch__label\" [id]=\"labelId\" [for]=\"id\">\n  <ng-content></ng-content>\n</label>\n\n<button class=\"daff-switch__toggle\"\n  type=\"button\"\n  role=\"switch\"\n  (click)=\"onToggle()\"\n  [attr.disabled]=\"disabled ? '' : null\"\n  [attr.aria-checked]=\"checked ? true : false\"\n  [attr.aria-labelledby]=\"labelId\"\n  [attr.id]=\"id\">\n</button>", styles: [":host{display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host.left{flex-direction:row}:host.right{flex-direction:row-reverse}:host.top{flex-direction:column}:host.bottom{flex-direction:column-reverse}:host.left,:host.right{justify-content:space-between;width:fit-content}:host.top,:host.bottom{align-items:flex-start}:host.daff-disabled{opacity:.5;cursor:not-allowed}:host.daff-disabled .daff-switch__label{cursor:not-allowed}:host.daff-disabled .daff-switch__toggle{cursor:not-allowed}:host.checked .daff-switch__toggle:before{transform:translate(1.5rem)}:host.daff-sm .daff-switch__toggle{height:1.5rem;width:2.75rem}:host.daff-sm .daff-switch__toggle:before{height:1.125rem;width:1.125rem;inset-inline-start:.15rem}:host.daff-sm.checked .daff-switch__toggle:before{transform:translate(1.25rem)}.daff-switch__label{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:1rem;line-height:1rem}.daff-switch__toggle{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;appearance:none;display:flex;align-items:center;border:none;border-radius:1rem;height:2rem;width:3.5rem;margin:0;outline:none;padding:0;position:relative}.daff-switch__toggle:before{content:\"\";position:absolute;border-radius:1.5rem;height:1.625rem;width:1.625rem;inset-inline-start:.175rem;transition:transform .3s}.daff-switch__toggle:after{content:\"\";display:flex;border-radius:1rem;width:100%;outline-offset:1px;height:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffSwitchComponent, deps: [{ token: i1.DaffDisableableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: DaffSwitchComponent, isStandalone: true, selector: "daff-switch", inputs: { labelPosition: "labelPosition", disabled: "disabled", checked: "checked", id: "id" }, outputs: { toggled: "toggled" }, host: { properties: { "class.checked": "checked", "class.left": "labelPosition === \"left\"", "class.right": "labelPosition === \"right\"", "class.top": "labelPosition === \"top\"", "class.bottom": "labelPosition === \"bottom\"" }, classAttribute: "daff-switch" }, usesInheritance: true, hostDirectives: [{ directive: i1.DaffSizableDirective, inputs: ["size", "size"] }, { directive: i1.DaffDisableableDirective, inputs: ["disabled", "disabled"] }], ngImport: i0, template: "<label class=\"daff-switch__label\" [id]=\"labelId\" [for]=\"id\">\n  <ng-content></ng-content>\n</label>\n\n<button class=\"daff-switch__toggle\"\n  type=\"button\"\n  role=\"switch\"\n  (click)=\"onToggle()\"\n  [attr.disabled]=\"disabled ? '' : null\"\n  [attr.aria-checked]=\"checked ? true : false\"\n  [attr.aria-labelledby]=\"labelId\"\n  [attr.id]=\"id\">\n</button>", styles: [":host{display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host.left{flex-direction:row}:host.right{flex-direction:row-reverse}:host.top{flex-direction:column}:host.bottom{flex-direction:column-reverse}:host.left,:host.right{justify-content:space-between;width:fit-content}:host.top,:host.bottom{align-items:flex-start}:host.daff-disabled{opacity:.5;cursor:not-allowed}:host.daff-disabled .daff-switch__label{cursor:not-allowed}:host.daff-disabled .daff-switch__toggle{cursor:not-allowed}:host.checked .daff-switch__toggle:before{transform:translate(1.5rem)}:host.daff-sm .daff-switch__toggle{height:1.5rem;width:2.75rem}:host.daff-sm .daff-switch__toggle:before{height:1.125rem;width:1.125rem;inset-inline-start:.15rem}:host.daff-sm.checked .daff-switch__toggle:before{transform:translate(1.25rem)}.daff-switch__label{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:1rem;line-height:1rem}.daff-switch__toggle{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;appearance:none;display:flex;align-items:center;border:none;border-radius:1rem;height:2rem;width:3.5rem;margin:0;outline:none;padding:0;position:relative}.daff-switch__toggle:before{content:\"\";position:absolute;border-radius:1.5rem;height:1.625rem;width:1.625rem;inset-inline-start:.175rem;transition:transform .3s}.daff-switch__toggle:after{content:\"\";display:flex;border-radius:1rem;width:100%;outline-offset:1px;height:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffSwitchComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffSwitchComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-switch', changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
                         {

package/fesm2022/daffodil-design-switch.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-switch.mjs","sources":["../../../libs/design/switch/src/switch/label-position.ts","../../../libs/design/switch/src/switch/switch.component.ts","../../../libs/design/switch/src/switch/switch.component.html","../../../libs/design/switch/src/switch.ts","../../../libs/design/switch/src/daffodil-design-switch.ts"],"sourcesContent":["export type DaffSwitchLabelPosition = 'left' | 'right' | 'top' | 'bottom';\n\n/**\n * The position of the label relative to the switch.\n */\nexport enum DaffSwitchLabelPositionEnum {\n  LEFT = 'left',\n  RIGHT = 'right',\n  TOP = 'top',\n  BOTTOM = 'bottom',\n}\n","/* eslint-disable quote-props */\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  EventEmitter,\n  Input,\n  Output,\n} from '@angular/core';\n\nimport {\n  DaffDisableable,\n  DaffDisableableDirective,\n  DaffSizableDirective,\n  DaffSizeSmallType,\n} from '@daffodil/design';\n\nimport {\n  DaffSwitchLabelPosition,\n  DaffSwitchLabelPositionEnum,\n} from './label-position';\n\nlet switchIncrementalId = 0;\n\nexport type DaffSwitchSize = DaffSizeSmallType;\n\n/**\n * The switch component provides a way to toggle between two settings.\n *\n * ```html\n * <daff-switch>Label</daff-switch>\n * ```\n */\n@Component({\n  selector: 'daff-switch',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  templateUrl: './switch.component.html',\n  styleUrls: ['./switch.component.scss'],\n  hostDirectives: [\n    {\n      directive: DaffSizableDirective,\n      inputs: ['size'],\n    },\n    {\n      directive: DaffDisableableDirective,\n      inputs: ['disabled'],\n    },\n  ],\n  host: {\n    'class': 'daff-switch',\n    '[class.checked]': 'checked',\n    '[class.left]': 'labelPosition === \"left\"',\n    '[class.right]': 'labelPosition === \"right\"',\n    '[class.top]': 'labelPosition === \"top\"',\n    '[class.bottom]': 'labelPosition === \"bottom\"',\n  },\n})\nexport class DaffSwitchComponent extends DaffSizableDirective<DaffSwitchSize> implements DaffDisableable {\n  /**\n   * The position of the label relative to the switch.\n   */\n  @Input() labelPosition: DaffSwitchLabelPosition = DaffSwitchLabelPositionEnum.LEFT;\n\n  constructor(private disabledDirective: DaffDisableableDirective) {\n    super();\n  }\n\n  /**\n   * Whether the switch is disabled.\n   */\n  @Input() get disabled() {\n    return this.disabledDirective.disabled;\n  }\n  set disabled(value: any) {\n    this.disabledDirective.disabled = coerceBooleanProperty(value);\n  }\n\n  /**\n   * Current state of switch (on/off).\n   */\n  @Input() checked = false;\n\n  /**\n   * @docs-private\n   */\n  labelId: string = 'daff-switch-' + switchIncrementalId++ + '-label';\n\n  /**\n   * The unique id of the switch. Defaults to an autogenerated value. When using this,\n   * it's your responsibility to ensure that the id for each switch is unique.\n   *\n   * It gets assigned to the `for` attribute on the `<label>` inside of the switch.\n   */\n  @Input() id = 'daff-switch-' + switchIncrementalId++;\n\n  /**\n   * Output event triggered when the switch has been toggled.\n   */\n  @Output() toggled = new EventEmitter<boolean>();\n\n  /**\n   * @docs-private\n   */\n  onToggle() {\n    if (!this.disabled) {\n      this.checked = !this.checked;\n      this.toggled.emit(this.checked);\n    }\n  }\n}\n","<label class=\"daff-switch__label\" [id]=\"labelId\" [for]=\"id\">\n  <ng-content></ng-content>\n</label>\n\n<button class=\"daff-switch__toggle\"\n  type=\"button\"\n  role=\"switch\"\n  (click)=\"onToggle()\"\n  [attr.disabled]=\"disabled ? '' : null\"\n  [attr.aria-checked]=\"checked ? true : false\"\n  [attr.aria-labelledby]=\"labelId\"\n  [attr.id]=\"id\">\n</button>","import { DaffSwitchComponent } from './switch/switch.component';\n\n/**\n * @docs-private\n */\nexport const DAFF_SWITCH_COMPONENTS = <const> [\n  DaffSwitchComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAEA;;AAEG;AACH,IAAY,2BAKX;AALD,CAAA,UAAY,2BAA2B,EAAA;AACrC,IAAA,2BAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACb,IAAA,2BAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,2BAAA,CAAA,KAAA,CAAA,GAAA,KAAW;AACX,IAAA,2BAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACnB,CAAC,EALW,2BAA2B,KAA3B,2BAA2B,GAAA,EAAA,CAAA,CAAA;;ACLvC;AAsBA,IAAI,mBAAmB,GAAG,CAAC;AAI3B;;;;;;AAMG;AAyBG,MAAO,mBAAoB,SAAQ,oBAAoC,CAAA;AAM3E,IAAA,WAAA,CAAoB,iBAA2C,EAAA;AAC7D,QAAA,KAAK,EAAE;QADW,IAAA,CAAA,iBAAiB,GAAjB,iBAAiB;AALrC;;AAEG;AACM,QAAA,IAAA,CAAA,aAAa,GAA4B,2BAA2B,CAAC,IAAI;AAgBlF;;AAEG;QACM,IAAA,CAAA,OAAO,GAAG,KAAK;AAExB;;AAEG;AACH,QAAA,IAAA,CAAA,OAAO,GAAW,cAAc,GAAG,mBAAmB,EAAE,GAAG,QAAQ;AAEnE;;;;;AAKG;AACM,QAAA,IAAA,CAAA,EAAE,GAAG,cAAc,GAAG,mBAAmB,EAAE;AAEpD;;AAEG;AACO,QAAA,IAAA,CAAA,OAAO,GAAG,IAAI,YAAY,EAAW;IAjC/C;AAEA;;AAEG;AACH,IAAA,IAAa,QAAQ,GAAA;AACnB,QAAA,OAAO,IAAI,CAAC,iBAAiB,CAAC,QAAQ;IACxC;IACA,IAAI,QAAQ,CAAC,KAAU,EAAA;QACrB,IAAI,CAAC,iBAAiB,CAAC,QAAQ,GAAG,qBAAqB,CAAC,KAAK,CAAC;IAChE;AAyBA;;AAEG;IACH,QAAQ,GAAA;AACN,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO;YAC5B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;QACjC;IACF;kIAnDW,mBAAmB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,wBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,mBAAmB,0oBCzDhC,wXAYS,EAAA,MAAA,EAAA,CAAA,6jDAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FD6CI,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAxB/B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EAAA,eAAA,EACN,uBAAuB,CAAC,MAAM,EAAA,cAAA,EAG/B;AACd,wBAAA;AACE,4BAAA,SAAS,EAAE,oBAAoB;4BAC/B,MAAM,EAAE,CAAC,MAAM,CAAC;AACjB,yBAAA;AACD,wBAAA;AACE,4BAAA,SAAS,EAAE,wBAAwB;4BACnC,MAAM,EAAE,CAAC,UAAU,CAAC;AACrB,yBAAA;qBACF,EAAA,IAAA,EACK;AACJ,wBAAA,OAAO,EAAE,aAAa;AACtB,wBAAA,iBAAiB,EAAE,SAAS;AAC5B,wBAAA,cAAc,EAAE,0BAA0B;AAC1C,wBAAA,eAAe,EAAE,2BAA2B;AAC5C,wBAAA,aAAa,EAAE,yBAAyB;AACxC,wBAAA,gBAAgB,EAAE,4BAA4B;AAC/C,qBAAA,EAAA,QAAA,EAAA,wXAAA,EAAA,MAAA,EAAA,CAAA,6jDAAA,CAAA,EAAA;;sBAMA;;sBASA;;sBAUA;;sBAaA;;sBAKA;;;AEhGH;;AAEG;AACI,MAAM,sBAAsB,GAAW;IAC5C,mBAAmB;;;ACNrB;;AAEG;;;;"}
+{"version":3,"file":"daffodil-design-switch.mjs","sources":["../../../libs/design/switch/src/switch/label-position.ts","../../../libs/design/switch/src/switch/switch.component.ts","../../../libs/design/switch/src/switch/switch.component.html","../../../libs/design/switch/src/switch.ts","../../../libs/design/switch/src/daffodil-design-switch.ts"],"sourcesContent":["export type DaffSwitchLabelPosition = 'left' | 'right' | 'top' | 'bottom';\n\n/**\n * The position of the label relative to the switch.\n */\nexport enum DaffSwitchLabelPositionEnum {\n  LEFT = 'left',\n  RIGHT = 'right',\n  TOP = 'top',\n  BOTTOM = 'bottom',\n}\n","/* eslint-disable quote-props */\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  EventEmitter,\n  Input,\n  Output,\n} from '@angular/core';\n\nimport {\n  DaffDisableable,\n  DaffDisableableDirective,\n  DaffSizableDirective,\n  DaffSizeSmallType,\n} from '@daffodil/design';\n\nimport {\n  DaffSwitchLabelPosition,\n  DaffSwitchLabelPositionEnum,\n} from './label-position';\n\nlet switchIncrementalId = 0;\n\nexport type DaffSwitchSize = DaffSizeSmallType;\n\n/**\n * The switch component provides a way to toggle between two settings.\n *\n * ```html\n * <daff-switch>Label</daff-switch>\n * ```\n */\n@Component({\n  selector: 'daff-switch',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  templateUrl: './switch.component.html',\n  styleUrls: ['./switch.component.scss'],\n  hostDirectives: [\n    {\n      directive: DaffSizableDirective,\n      inputs: ['size'],\n    },\n    {\n      directive: DaffDisableableDirective,\n      inputs: ['disabled'],\n    },\n  ],\n  host: {\n    'class': 'daff-switch',\n    '[class.checked]': 'checked',\n    '[class.left]': 'labelPosition === \"left\"',\n    '[class.right]': 'labelPosition === \"right\"',\n    '[class.top]': 'labelPosition === \"top\"',\n    '[class.bottom]': 'labelPosition === \"bottom\"',\n  },\n})\nexport class DaffSwitchComponent extends DaffSizableDirective<DaffSwitchSize> implements DaffDisableable {\n  /**\n   * The position of the label relative to the switch.\n   */\n  @Input() labelPosition: DaffSwitchLabelPosition = DaffSwitchLabelPositionEnum.LEFT;\n\n  constructor(private disabledDirective: DaffDisableableDirective) {\n    super();\n  }\n\n  /**\n   * Whether the switch is disabled.\n   */\n  @Input() get disabled() {\n    return this.disabledDirective.disabled;\n  }\n  set disabled(value: any) {\n    this.disabledDirective.disabled = coerceBooleanProperty(value);\n  }\n\n  /**\n   * Current state of switch (on/off).\n   */\n  @Input() checked = false;\n\n  /**\n   * @docs-private\n   */\n  labelId: string = 'daff-switch-' + switchIncrementalId++ + '-label';\n\n  /**\n   * The unique id of the switch. Defaults to an autogenerated value. When using this,\n   * it's your responsibility to ensure that the id for each switch is unique.\n   *\n   * It gets assigned to the `for` attribute on the `<label>` inside of the switch.\n   */\n  @Input() id = 'daff-switch-' + switchIncrementalId++;\n\n  /**\n   * Output event triggered when the switch has been toggled.\n   */\n  @Output() toggled = new EventEmitter<boolean>();\n\n  /**\n   * @docs-private\n   */\n  onToggle() {\n    if (!this.disabled) {\n      this.checked = !this.checked;\n      this.toggled.emit(this.checked);\n    }\n  }\n}\n","<label class=\"daff-switch__label\" [id]=\"labelId\" [for]=\"id\">\n  <ng-content></ng-content>\n</label>\n\n<button class=\"daff-switch__toggle\"\n  type=\"button\"\n  role=\"switch\"\n  (click)=\"onToggle()\"\n  [attr.disabled]=\"disabled ? '' : null\"\n  [attr.aria-checked]=\"checked ? true : false\"\n  [attr.aria-labelledby]=\"labelId\"\n  [attr.id]=\"id\">\n</button>","import { DaffSwitchComponent } from './switch/switch.component';\n\n/**\n * @docs-private\n */\nexport const DAFF_SWITCH_COMPONENTS = <const> [\n  DaffSwitchComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/daffodil-design-tabs.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { TemplateRef, Input, ViewChild, ChangeDetectionStrategy, Component, ContentChild, ViewEncapsulation, EventEmitter, ViewChildren, ContentChildren, Output, HostBinding } from '@angular/core';
+import { TemplateRef, Input, ViewChild, ChangeDetectionStrategy, Component, ContentChild, ViewEncapsulation, EventEmitter, ViewChildren, ContentChildren, Output } from '@angular/core';
 import * as i1 from '@daffodil/design';
 import { DaffDisableableDirective, DaffPrefixDirective, DaffSuffixDirective, DaffSelectableDirective } from '@daffodil/design';
 import * as i1$1 from '@angular/common';
@@ -47,8 +47,8 @@ class DaffTabComponent {
         this.panelId = 'daff-tab-panel-' + tabId;
         tabId++;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabComponent, deps: [{ token: i1.DaffDisableableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: DaffTabComponent, isStandalone: true, selector: "daff-tab", inputs: { id: "id" }, viewQueries: [{ propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: TemplateRef, static: true }, { propertyName: "labelRef", first: true, predicate: ["label"], descendants: true, read: TemplateRef, static: true }], hostDirectives: [{ directive: i1.DaffDisableableDirective, inputs: ["disabled", "disabled"] }], ngImport: i0, template: `
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabComponent, deps: [{ token: i1.DaffDisableableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: DaffTabComponent, isStandalone: true, selector: "daff-tab", inputs: { id: "id" }, viewQueries: [{ propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: TemplateRef, static: true }, { propertyName: "labelRef", first: true, predicate: ["label"], descendants: true, read: TemplateRef, static: true }], hostDirectives: [{ directive: i1.DaffDisableableDirective, inputs: ["disabled", "disabled"] }], ngImport: i0, template: `
       <ng-template #label>
         <ng-content select="daff-tab-label"></ng-content>
       </ng-template>
@@ -57,7 +57,7 @@ class DaffTabComponent {
       </ng-template>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'daff-tab',
@@ -100,10 +100,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
  * ```
  */
 class DaffTabLabelComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: DaffTabLabelComponent, isStandalone: true, selector: "daff-tab-label", queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true }, { propertyName: "_suffix", first: true, predicate: DaffSuffixDirective, descendants: true }], ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-tab-label__content\">\n  <ng-content></ng-content>\n</div>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [":host{display:flex;justify-content:center;align-items:center;gap:.5rem}.daff-tab-label__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:15rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DaffTabLabelComponent, isStandalone: true, selector: "daff-tab-label", queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true }, { propertyName: "_suffix", first: true, predicate: DaffSuffixDirective, descendants: true }], ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-tab-label__content\">\n  <ng-content></ng-content>\n</div>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}", styles: [":host{display:flex;justify-content:center;align-items:center;gap:.5rem}.daff-tab-label__content{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:15rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabLabelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabLabelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-tab-label', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         DaffPrefixDirective,
@@ -153,10 +153,10 @@ class DaffTabPanelComponent {
         this._ariaLabelledBy = this.tab.id;
         this._id = this.tab.panelId;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabPanelComponent, deps: [{ token: DaffTabComponent }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: DaffTabPanelComponent, isStandalone: true, selector: "daff-tab-panel", host: { attributes: { "role": "tabpanel", "tabindex": "0" }, properties: { "attr.id": "tabPanelId", "attr.aria-labelledby": "ariaLabelledBy" }, classAttribute: "daff-tab-panel" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [":host(.daff-tab-panel){display:block;padding:1rem 0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabPanelComponent, deps: [{ token: DaffTabComponent }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: DaffTabPanelComponent, isStandalone: true, selector: "daff-tab-panel", host: { attributes: { "role": "tabpanel", "tabindex": "0" }, properties: { "attr.id": "tabPanelId", "attr.aria-labelledby": "ariaLabelledBy" }, classAttribute: "daff-tab-panel" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [":host(.daff-tab-panel){display:block;padding:1rem 0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-tab-panel', template: `<ng-content></ng-content>`, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         'class': 'daff-tab-panel',
@@ -200,10 +200,10 @@ class DaffTabActivatorComponent {
     focus() {
         this.el.nativeElement.focus();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabActivatorComponent, deps: [{ token: i0.ElementRef }, { token: i1.DaffSelectableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: DaffTabActivatorComponent, isStandalone: true, selector: "button[daff-tab-activator],a[daff-tab-activator]", inputs: { tabActivatorId: "tabActivatorId", panelId: "panelId" }, host: { attributes: { "role": "tab" }, properties: { "attr.aria-selected": "ariaSelected", "attr.tabindex": "tabIndex", "attr.id": "tabActivatorId", "attr.aria-controls": "panelId" }, classAttribute: "daff-tab-activator" }, hostDirectives: [{ directive: i1.DaffSelectableDirective, inputs: ["selected", "selected"] }], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".daff-tab-activator{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-block;appearance:none;background:none;border:none;font-size:1rem;line-height:1.5rem;font-weight:500;height:3rem;margin:0;min-width:8rem;padding:.5rem 1.5rem;text-decoration:none;z-index:2}.daff-tab-activator[disabled]{cursor:not-allowed;opacity:.6}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabActivatorComponent, deps: [{ token: i0.ElementRef }, { token: i1.DaffSelectableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: DaffTabActivatorComponent, isStandalone: true, selector: "button[daff-tab-activator],a[daff-tab-activator]", inputs: { tabActivatorId: "tabActivatorId", panelId: "panelId" }, host: { attributes: { "role": "tab" }, properties: { "attr.aria-selected": "ariaSelected", "attr.tabindex": "tabIndex", "attr.id": "tabActivatorId", "attr.aria-controls": "panelId" }, classAttribute: "daff-tab-activator" }, hostDirectives: [{ directive: i1.DaffSelectableDirective, inputs: ["selected", "selected"] }], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".daff-tab-activator{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-block;appearance:none;background:none;border:none;font-size:1rem;line-height:1.5rem;font-weight:500;height:3rem;margin:0;min-width:8rem;padding:.5rem 1.5rem;text-decoration:none;z-index:2}.daff-tab-activator[disabled]{cursor:not-allowed;opacity:.6}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabActivatorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabActivatorComponent, decorators: [{
             type: Component,
             args: [{ selector: '' +
                         'button[daff-tab-activator]' + ',' +
@@ -268,12 +268,6 @@ class DaffTabsComponent {
          * The tab that is selected on initial load. If it's not used, the first tab in the tablist will be selected by default.
          */
         this.initiallySelected = null;
-        /**
-         * @docs-private
-         *
-         * aria-label for the tab.
-         */
-        this.externalAriaLabel = null;
         /**
          * `aria-label` to label the tablist.
          */
@@ -392,13 +386,14 @@ class DaffTabsComponent {
         const array = this._tabs.toArray();
         this.select(array[array.length - 1].id);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.Location }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: DaffTabsComponent, isStandalone: true, selector: "daff-tabs", inputs: { initiallySelected: "initiallySelected", ariaLabel: ["aria-label", "ariaLabel"], linkMode: "linkMode", url: "url", queryParam: "queryParam" }, outputs: { tabChange: "tabChange" }, host: { properties: { "attr.aria-label": "this.externalAriaLabel" }, classAttribute: "daff-tabs" }, queries: [{ propertyName: "_labels", predicate: DaffTabLabelComponent, descendants: true }, { propertyName: "_tabs", predicate: DaffTabComponent }], viewQueries: [{ propertyName: "_tabActivators", predicate: DaffTabActivatorComponent, descendants: true }], ngImport: i0, template: "<div class=\"daff-tabs__tab-list\"\n\trole=\"tablist\"\n\t[attr.aria-label]=\"ariaLabel\"\n\t(keydown.home)=\"selectFirst($event)\"\n\t(keydown.end)=\"selectLast($event)\">\n\t@for (tab of _tabs; track tab) {\n\t\t@if (linkMode && tab.disabled) {\n\t\t\t<button daff-tab-activator routerLinkActive\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t} @else if (linkMode) {\n\t\t\t<a daff-tab-activator routerLinkActive\n\t\t\t\tclass=\"daff-ae daff_tabs__link\"\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[routerLink]=\"url || currentPath\"\n\t\t\t\tqueryParamsHandling=\"merge\"\n\t\t\t\t[queryParams]=\"_buildQueryParams(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\"\n\t\t\t\t(isActiveChange)=\"$event && select(tab.id)\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</a>\n\t\t} @else {\n\t\t\t<button daff-tab-activator\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t(click)=\"select(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t}\n\t}\n</div>\n\n@for (tab of _tabs; track tab) {\n\t@if(tab.id === selectedTab ) {\n\t\t<ng-container *ngTemplateOutlet=\"tab.contentRef\"></ng-container>\n\t}\n}", styles: [":host(.daff-tabs){max-width:100%}.daff-tabs{display:block}.daff-tabs .daff-tabs__tab-list{display:flex;overflow-x:auto;scrollbar-width:thin;position:relative}.daff-tabs .daff-tabs__tab-list:after{content:\"\";position:absolute;height:.125rem;width:100%;bottom:0}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: DaffTabActivatorComponent, selector: "button[daff-tab-activator],a[daff-tab-activator]", inputs: ["tabActivatorId", "panelId"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.Location }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DaffTabsComponent, isStandalone: true, selector: "daff-tabs", inputs: { initiallySelected: "initiallySelected", ariaLabel: ["aria-label", "ariaLabel"], linkMode: "linkMode", url: "url", queryParam: "queryParam" }, outputs: { tabChange: "tabChange" }, host: { properties: { "attr.aria-label": "null" }, classAttribute: "daff-tabs" }, queries: [{ propertyName: "_labels", predicate: DaffTabLabelComponent, descendants: true }, { propertyName: "_tabs", predicate: DaffTabComponent }], viewQueries: [{ propertyName: "_tabActivators", predicate: DaffTabActivatorComponent, descendants: true }], ngImport: i0, template: "<div class=\"daff-tabs__tab-list\"\n\trole=\"tablist\"\n\t[attr.aria-label]=\"ariaLabel\"\n\t(keydown.home)=\"selectFirst($event)\"\n\t(keydown.end)=\"selectLast($event)\">\n\t@for (tab of _tabs; track tab) {\n\t\t@if (linkMode && tab.disabled) {\n\t\t\t<button daff-tab-activator routerLinkActive\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t} @else if (linkMode) {\n\t\t\t<a daff-tab-activator routerLinkActive\n\t\t\t\tclass=\"daff-ae daff_tabs__link\"\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[routerLink]=\"url || currentPath\"\n\t\t\t\tqueryParamsHandling=\"merge\"\n\t\t\t\t[queryParams]=\"_buildQueryParams(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\"\n\t\t\t\t(isActiveChange)=\"$event && select(tab.id)\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</a>\n\t\t} @else {\n\t\t\t<button daff-tab-activator\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t(click)=\"select(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t}\n\t}\n</div>\n\n@for (tab of _tabs; track tab) {\n\t@if(tab.id === selectedTab ) {\n\t\t<ng-container *ngTemplateOutlet=\"tab.contentRef\"></ng-container>\n\t}\n}", styles: [":host(.daff-tabs){max-width:100%}.daff-tabs{display:block}.daff-tabs .daff-tabs__tab-list{display:flex;overflow-x:auto;scrollbar-width:thin;position:relative}.daff-tabs .daff-tabs__tab-list:after{content:\"\";position:absolute;height:.125rem;width:100%;bottom:0}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: DaffTabActivatorComponent, selector: "button[daff-tab-activator],a[daff-tab-activator]", inputs: ["tabActivatorId", "panelId"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTabsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTabsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-tabs', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         'class': 'daff-tabs',
+                        '[attr.aria-label]': 'null',
                     }, imports: [
                         NgTemplateOutlet,
                         RouterLink,
@@ -407,9 +402,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                     ], template: "<div class=\"daff-tabs__tab-list\"\n\trole=\"tablist\"\n\t[attr.aria-label]=\"ariaLabel\"\n\t(keydown.home)=\"selectFirst($event)\"\n\t(keydown.end)=\"selectLast($event)\">\n\t@for (tab of _tabs; track tab) {\n\t\t@if (linkMode && tab.disabled) {\n\t\t\t<button daff-tab-activator routerLinkActive\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t} @else if (linkMode) {\n\t\t\t<a daff-tab-activator routerLinkActive\n\t\t\t\tclass=\"daff-ae daff_tabs__link\"\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[routerLink]=\"url || currentPath\"\n\t\t\t\tqueryParamsHandling=\"merge\"\n\t\t\t\t[queryParams]=\"_buildQueryParams(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\"\n\t\t\t\t(isActiveChange)=\"$event && select(tab.id)\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</a>\n\t\t} @else {\n\t\t\t<button daff-tab-activator\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t(click)=\"select(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t}\n\t}\n</div>\n\n@for (tab of _tabs; track tab) {\n\t@if(tab.id === selectedTab ) {\n\t\t<ng-container *ngTemplateOutlet=\"tab.contentRef\"></ng-container>\n\t}\n}", styles: [":host(.daff-tabs){max-width:100%}.daff-tabs{display:block}.daff-tabs .daff-tabs__tab-list{display:flex;overflow-x:auto;scrollbar-width:thin;position:relative}.daff-tabs .daff-tabs__tab-list:after{content:\"\";position:absolute;height:.125rem;width:100%;bottom:0}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.Location }], propDecorators: { initiallySelected: [{
                 type: Input
-            }], externalAriaLabel: [{
-                type: HostBinding,
-                args: ['attr.aria-label']
             }], ariaLabel: [{
                 type: Input,
                 args: ['aria-label']

package/fesm2022/daffodil-design-tabs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"daffodil-design-tabs.mjs","sources":["../../../libs/design/tabs/src/tabs/tab/tab.component.ts","../../../libs/design/tabs/src/tabs/tab-label/tab-label.component.ts","../../../libs/design/tabs/src/tabs/tab-label/tab-label.component.html","../../../libs/design/tabs/src/tabs/tab-panel/tab-panel.component.ts","../../../libs/design/tabs/src/tabs/tab-activator/tab-activator.component.ts","../../../libs/design/tabs/src/tabs/tabs.component.ts","../../../libs/design/tabs/src/tabs/tabs.component.html","../../../libs/design/tabs/src/tabs.ts","../../../libs/design/tabs/src/daffodil-design-tabs.ts"],"sourcesContent":["import {\n  Component,\n  ChangeDetectionStrategy,\n  TemplateRef,\n  ViewChild,\n  Input,\n} from '@angular/core';\n\nimport {\n  DaffDisableable,\n  DaffDisableableDirective,\n} from '@daffodil/design';\n\nlet tabId = 1;\n\n/**\n * Tab is a single tab in the tablist that is used to group the label of a tab panel and the tab panel together.\n *\n * A `<daff-tab>` should include the DaffTabLabelComponent and DaffTabPanelComponent components in order to properly structure the UI.\n *\n * @example\n * ```html\n * <daff-tab>\n * \t<daff-tab-label>\n * \t\t<fa-icon [icon]=\"faInfoCircle\" daffPrefix></fa-icon>\n * \t\tTab 1\n * \t</daff-tab-label>\n * \t<daff-tab-panel>\n * \t\tTab 1 Panel\n * \t</daff-tab-panel>\n * </daff-tab>\n * ```\n */\n@Component({\n  selector: 'daff-tab',\n  template: `\n      <ng-template #label>\n        <ng-content select=\"daff-tab-label\"></ng-content>\n      </ng-template>\n      <ng-template #content>\n        <ng-content select=\"daff-tab-panel\"></ng-content>\n      </ng-template>\n  `,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: DaffDisableableDirective,\n      inputs: ['disabled'],\n    },\n  ],\n})\nexport class DaffTabComponent implements DaffDisableable {\n\n  /**\n   * @docs-private\n   *\n   * Whether the tab is disabled.\n   */\n  get disabled() {\n    return this.disabledDirective.disabled;\n  }\n\n  /**\n   * @docs-private\n   */\n  @ViewChild('content', { read: TemplateRef, static: true }) contentRef: TemplateRef<any>;\n\n  /**\n   * @docs-private\n   */\n  @ViewChild('label', { read: TemplateRef, static: true }) labelRef: TemplateRef<any>;\n\n  /**\n   * A unique id for the tab component. Defaults to an autogenerated value. When using this,\n   * it's your responsibility to ensure that the id for each tab is unique.\n   */\n  @Input() id = 'daff-tab-' + tabId;\n\n  /**\n   * @docs-private\n   */\n  panelId = 'daff-tab-panel-' + tabId;\n\n  constructor(private disabledDirective: DaffDisableableDirective) {\n    tabId++;\n  }\n}\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  ContentChild,\n} from '@angular/core';\n\nimport {\n  DaffPrefixDirective,\n  DaffSuffixDirective,\n} from '@daffodil/design';\n\n/**\n * Tab label is the clicakble label that activates its corresponding tab panel. Labels can contain text, icons, or both.\n *\n * @example\n * ```html\n * <daff-tab-label>\n *  <div daffPrefix></div>\n *  Label\n *  <div daffSuffix></div\n * </daff-tab-Label>\n * ```\n */\n@Component({\n  selector: 'daff-tab-label',\n  templateUrl: './tab-label.component.html',\n  styleUrl: './tab-label.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    DaffPrefixDirective,\n    DaffSuffixDirective,\n  ],\n})\nexport class DaffTabLabelComponent {\n  /**\n   * @docs-private\n   */\n  @ContentChild(DaffPrefixDirective) _prefix: DaffPrefixDirective;\n\n  /**\n   * @docs-private\n   */\n  @ContentChild(DaffSuffixDirective) _suffix: DaffSuffixDirective;\n}\n","@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-tab-label__content\">\n  <ng-content></ng-content>\n</div>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}","/* eslint-disable quote-props */\nimport {\n  Component,\n  ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport { DaffTabComponent } from '../tab/tab.component';\n\n/**\n * Tab panel is the content area displayed when a tab is active.\n *\n * @example\n * ```html\n * <daff-tab-panel>\n *  <!-- Tab panel content goes here -->\n * </daff-tab-panel>\n * ```\n */\n@Component({\n  selector: 'daff-tab-panel',\n  template: `<ng-content></ng-content>`,\n  styleUrl: './tab-panel.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    'class': 'daff-tab-panel',\n    'role': 'tabpanel',\n    'tabindex': '0',\n    '[attr.id]': 'tabPanelId',\n    '[attr.aria-labelledby]': 'ariaLabelledBy',\n  },\n})\nexport class DaffTabPanelComponent {\n  private _id = '';\n\n  /**\n   * @docs-private\n   *\n   * Dynamically binds the tab panel's id to a unique value generated from the associated tab's panelId.\n   */\n  get tabPanelId() {\n    return this._id;\n  }\n\n  private _ariaLabelledBy = '';\n\n  /**\n   * @docs-private\n   */\n  get ariaLabelledBy() {\n    return this._ariaLabelledBy;\n  }\n\n  constructor(private tab: DaffTabComponent) {\n    /**\n     * Sets the value of `ariaLabelledBy` to the id of the tab component.\n     */\n    this._ariaLabelledBy = this.tab.id;\n\n    this._id = this.tab.panelId;\n  }\n}\n","/* eslint-disable quote-props */\nimport {\n  Input,\n  Component,\n  ChangeDetectionStrategy,\n  ViewEncapsulation,\n  ElementRef,\n} from '@angular/core';\n\nimport { DaffSelectableDirective } from '@daffodil/design';\n\n@Component({\n  selector: '' +\n    'button[daff-tab-activator]' + ',' +\n    'a[daff-tab-activator]',\n  template: `<ng-content></ng-content>`,\n  styleUrl: './tab-activator.component.scss',\n  hostDirectives: [\n    {\n      directive: DaffSelectableDirective,\n      inputs: ['selected'],\n    },\n  ],\n  host: {\n    'class': 'daff-tab-activator',\n    'role': 'tab',\n    '[attr.aria-selected]': 'ariaSelected',\n    '[attr.tabindex]': 'tabIndex',\n    '[attr.id]': 'tabActivatorId',\n    '[attr.aria-controls]': 'panelId',\n  },\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class DaffTabActivatorComponent {\n  /**\n   * @docs-private\n   *\n   * Sets `aria-selected` to true if the component is selected and false if it's not selected.\n   */\n  get ariaSelected() {\n    return this.selectableDirective.selected ? true :  false;\n  }\n\n  /**\n   * @docs-private\n   *\n   * Sets `tabindex` to `0` if the component is selected and `-1` if it's not selected.\n   */\n  get tabIndex() {\n    return this.selectableDirective.selected ? '0' :  '-1';\n  }\n\n  constructor(\n    private el: ElementRef,\n    private selectableDirective: DaffSelectableDirective,\n  ) {\n  }\n\n  /**\n   * The html id of the tab activator component\n   */\n  @Input() tabActivatorId = '';\n\n  @Input() panelId = '';\n\n  /**\n   * Sets focus to the native element of the component.\n   */\n  focus() {\n    this.el.nativeElement.focus();\n  }\n}\n","/* eslint-disable quote-props */\nimport {\n  Location,\n  NgTemplateOutlet,\n} from '@angular/common';\nimport {\n  Component,\n  HostBinding,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  ContentChildren,\n  QueryList,\n  AfterContentInit,\n  Input,\n  Output,\n  EventEmitter,\n  ViewChildren,\n  ChangeDetectorRef,\n  OnInit,\n} from '@angular/core';\nimport {\n  Params,\n  RouterLink,\n  RouterLinkActive,\n} from '@angular/router';\n\nimport { DaffTabComponent } from './tab/tab.component';\nimport { DaffTabActivatorComponent } from './tab-activator/tab-activator.component';\nimport { DaffTabLabelComponent } from './tab-label/tab-label.component';\n\n/**\n * Tabs provide a way to navigate between panels that display related content without leaving the page.\n *\n * @example\n * ```html\n * <daff-tabs aria-label=\"List of tabs\">\n * \t<daff-tab>\n * \t\t<daff-tab-label>\n * \t\t\t<fa-icon [icon]=\"faInfoCircle\" daffPrefix></fa-icon>\n * \t\t\tTab 1\n * \t\t</daff-tab-label>\n * \t\t<daff-tab-panel>\n * \t\t\tTab 1 Panel\n * \t\t</daff-tab-panel>\n * \t</daff-tab>\n * \t<daff-tab>\n * \t\t<daff-tab-label>\n * \t\t\tTab 2\n * \t\t\t<fa-icon [icon]=\"faInfoCircle\" daffSuffix></fa-icon>\n * \t\t</daff-tab-label>\n * \t\t<daff-tab-panel>\n * \t\t\tTab 2 Panel\n * \t\t</daff-tab-panel>\n * \t</daff-tab>\n * </daff-tabs>\n * ```\n */\n@Component({\n  selector: 'daff-tabs',\n  templateUrl: './tabs.component.html',\n  styleUrl: './tabs.component.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    'class': 'daff-tabs',\n  },\n  imports: [\n    NgTemplateOutlet,\n    RouterLink,\n    RouterLinkActive,\n    DaffTabActivatorComponent,\n  ],\n})\n\nexport class DaffTabsComponent implements AfterContentInit, OnInit {\n  /**\n   * @docs-private\n   *\n   * The currently selected tab. This property is dynamically updated when a user selects a tab.\n   */\n  selectedTab: string;\n\n  /**\n   * The tab that is selected on initial load. If it's not used, the first tab in the tablist will be selected by default.\n   */\n  @Input() initiallySelected: string = null;\n\n  /**\n   * @docs-private\n   *\n   * aria-label for the tab.\n   */\n  @HostBinding('attr.aria-label') private externalAriaLabel = null;\n\n  /**\n   * `aria-label` to label the tablist.\n   */\n  @Input('aria-label') ariaLabel = '';\n\n  /**\n   * Replace the tab buttons as links.\n   */\n  @Input() linkMode = false;\n\n  /**\n   * The URL to navigate to when the component is in link mode.\n   * This component will set the specified query param.\n   */\n  @Input() url?: string;\n\n  /**\n   * The query parameter that the tabs component will use to set the tab value in link mode.\n   */\n  @Input() queryParam = 'tab';\n\n  /**\n   * Event emitted when tab selection changes.\n   */\n  @Output() tabChange = new EventEmitter<string>();\n\n  /**\n   * @docs-private\n   */\n  @ContentChildren(DaffTabLabelComponent, { descendants: true }) _labels: QueryList<DaffTabLabelComponent>;\n\n  /**\n   * @docs-private\n   */\n  @ContentChildren(DaffTabComponent) _tabs: QueryList<DaffTabComponent>;\n\n  /**\n   * @docs-private\n   */\n  @ViewChildren(DaffTabActivatorComponent) _tabActivators: QueryList<DaffTabActivatorComponent>;\n\n  /**\n   * @docs-private\n   */\n  get currentPath(): string {\n    return this.location.path();\n  }\n\n  constructor(\n    private cdRef: ChangeDetectorRef,\n    private location: Location,\n  ) {}\n\n  private reset() {\n    if(this.initiallySelected) {\n      this.selectedTab = this.initiallySelected;\n    }\n\n    if (!this.selectedTab) {\n      this.selectedTab = this._tabs.first.id;\n    }\n  }\n\n  /**\n   * @docs-private\n   */\n  ngOnInit(): void {\n    this.location.onUrlChange(() => {\n      // if the app is navigated away from the current page, reset the state\n      if (this.linkMode && !this.location.isCurrentPathEqualTo(this.url, `${this.queryParam}=${this.selectedTab}`)) {\n        this.selectedTab = null;\n        this.reset();\n        this.tabChange.emit(this.selectedTab);\n      }\n    });\n  }\n\n  /**\n   * @docs-private\n   */\n  ngAfterContentInit() {\n    this.reset();\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects a tab and sets focus on the selected tab.\n   */\n  select(tabId: string) {\n    const tabActivator = this._tabActivators.find(el => el.tabActivatorId === tabId);\n\n    if (!tabActivator) {\n      console.warn(`The tab '${tabId}' was not able to be selected because it does not exist. Check the id on your <daff-tab>s.`);\n      return;\n    }\n\n    this.tabChange.emit(tabId);\n    this.selectedTab = tabId;\n    this.cdRef.markForCheck();\n\n    tabActivator.focus();\n  }\n\n  /**\n   * Navigates through the tabs based on the given offset.\n   * Moves forward or backward in the tab array, wrapping around when necessary.\n   */\n  private navigateTabs(offset: number) {\n    const array = this._tabs.toArray();\n    let selectedIndex = array.findIndex(el => el.id === this.selectedTab);\n    const startingIndex = selectedIndex;\n    let newIndex;\n\n    do {\n      newIndex = (selectedIndex + offset + array.length) % array.length;\n      selectedIndex = newIndex;\n    } while (array[newIndex].disabled && selectedIndex !== startingIndex); // Skip disabled tabs\n\n    this.select(array[newIndex].id);\n  }\n\n  /**\n   * @docs-private\n   */\n  _buildQueryParams(tab: string): Params {\n    return {\n      [this.queryParam]: tab,\n    };\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects the previous tab and wraps around to the last tab if the first tab is currently selected.\n   */\n  previous() {\n    this.navigateTabs(-1);\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects the next tab and wraps around to the first tab if the last tab is currently selected.\n   */\n  next() {\n    this.navigateTabs(1);\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects the first tab.\n   */\n  selectFirst(event: KeyboardEvent | null) {\n    event.preventDefault();\n    this.select(this._tabs.toArray()[0].id);\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects the last tab.\n   */\n  selectLast(event: KeyboardEvent | null) {\n    event.preventDefault();\n    const array = this._tabs.toArray();\n    this.select(array[array.length - 1].id);\n  }\n}\n","<div class=\"daff-tabs__tab-list\"\n\trole=\"tablist\"\n\t[attr.aria-label]=\"ariaLabel\"\n\t(keydown.home)=\"selectFirst($event)\"\n\t(keydown.end)=\"selectLast($event)\">\n\t@for (tab of _tabs; track tab) {\n\t\t@if (linkMode && tab.disabled) {\n\t\t\t<button daff-tab-activator routerLinkActive\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t} @else if (linkMode) {\n\t\t\t<a daff-tab-activator routerLinkActive\n\t\t\t\tclass=\"daff-ae daff_tabs__link\"\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[routerLink]=\"url || currentPath\"\n\t\t\t\tqueryParamsHandling=\"merge\"\n\t\t\t\t[queryParams]=\"_buildQueryParams(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\"\n\t\t\t\t(isActiveChange)=\"$event && select(tab.id)\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</a>\n\t\t} @else {\n\t\t\t<button daff-tab-activator\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t(click)=\"select(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t}\n\t}\n</div>\n\n@for (tab of _tabs; track tab) {\n\t@if(tab.id === selectedTab ) {\n\t\t<ng-container *ngTemplateOutlet=\"tab.contentRef\"></ng-container>\n\t}\n}","import { DaffTabComponent } from './tabs/tab/tab.component';\nimport { DaffTabLabelComponent } from './tabs/tab-label/tab-label.component';\nimport { DaffTabPanelComponent } from './tabs/tab-panel/tab-panel.component';\nimport { DaffTabsComponent } from './tabs/tabs.component';\n\n/**\n * @docs-private\n *\n * ```ts\n * import { DAFF_TABS_COMPONENTS } from '@daffodil/design/tabs';\n * ```\n */\nexport const DAFF_TABS_COMPONENTS = <const> [\n  DaffTabsComponent,\n  DaffTabLabelComponent,\n  DaffTabPanelComponent,\n  DaffTabComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.DaffTabComponent","i1"],"mappings":"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"}
+{"version":3,"file":"daffodil-design-tabs.mjs","sources":["../../../libs/design/tabs/src/tabs/tab/tab.component.ts","../../../libs/design/tabs/src/tabs/tab-label/tab-label.component.ts","../../../libs/design/tabs/src/tabs/tab-label/tab-label.component.html","../../../libs/design/tabs/src/tabs/tab-panel/tab-panel.component.ts","../../../libs/design/tabs/src/tabs/tab-activator/tab-activator.component.ts","../../../libs/design/tabs/src/tabs/tabs.component.ts","../../../libs/design/tabs/src/tabs/tabs.component.html","../../../libs/design/tabs/src/tabs.ts","../../../libs/design/tabs/src/daffodil-design-tabs.ts"],"sourcesContent":["import {\n  Component,\n  ChangeDetectionStrategy,\n  TemplateRef,\n  ViewChild,\n  Input,\n} from '@angular/core';\n\nimport {\n  DaffDisableable,\n  DaffDisableableDirective,\n} from '@daffodil/design';\n\nlet tabId = 1;\n\n/**\n * Tab is a single tab in the tablist that is used to group the label of a tab panel and the tab panel together.\n *\n * A `<daff-tab>` should include the DaffTabLabelComponent and DaffTabPanelComponent components in order to properly structure the UI.\n *\n * @example\n * ```html\n * <daff-tab>\n * \t<daff-tab-label>\n * \t\t<fa-icon [icon]=\"faInfoCircle\" daffPrefix></fa-icon>\n * \t\tTab 1\n * \t</daff-tab-label>\n * \t<daff-tab-panel>\n * \t\tTab 1 Panel\n * \t</daff-tab-panel>\n * </daff-tab>\n * ```\n */\n@Component({\n  selector: 'daff-tab',\n  template: `\n      <ng-template #label>\n        <ng-content select=\"daff-tab-label\"></ng-content>\n      </ng-template>\n      <ng-template #content>\n        <ng-content select=\"daff-tab-panel\"></ng-content>\n      </ng-template>\n  `,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: DaffDisableableDirective,\n      inputs: ['disabled'],\n    },\n  ],\n})\nexport class DaffTabComponent implements DaffDisableable {\n\n  /**\n   * @docs-private\n   *\n   * Whether the tab is disabled.\n   */\n  get disabled() {\n    return this.disabledDirective.disabled;\n  }\n\n  /**\n   * @docs-private\n   */\n  @ViewChild('content', { read: TemplateRef, static: true }) contentRef: TemplateRef<any>;\n\n  /**\n   * @docs-private\n   */\n  @ViewChild('label', { read: TemplateRef, static: true }) labelRef: TemplateRef<any>;\n\n  /**\n   * A unique id for the tab component. Defaults to an autogenerated value. When using this,\n   * it's your responsibility to ensure that the id for each tab is unique.\n   */\n  @Input() id = 'daff-tab-' + tabId;\n\n  /**\n   * @docs-private\n   */\n  panelId = 'daff-tab-panel-' + tabId;\n\n  constructor(private disabledDirective: DaffDisableableDirective) {\n    tabId++;\n  }\n}\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  ContentChild,\n} from '@angular/core';\n\nimport {\n  DaffPrefixDirective,\n  DaffSuffixDirective,\n} from '@daffodil/design';\n\n/**\n * Tab label is the clicakble label that activates its corresponding tab panel. Labels can contain text, icons, or both.\n *\n * @example\n * ```html\n * <daff-tab-label>\n *  <div daffPrefix></div>\n *  Label\n *  <div daffSuffix></div\n * </daff-tab-Label>\n * ```\n */\n@Component({\n  selector: 'daff-tab-label',\n  templateUrl: './tab-label.component.html',\n  styleUrl: './tab-label.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    DaffPrefixDirective,\n    DaffSuffixDirective,\n  ],\n})\nexport class DaffTabLabelComponent {\n  /**\n   * @docs-private\n   */\n  @ContentChild(DaffPrefixDirective) _prefix: DaffPrefixDirective;\n\n  /**\n   * @docs-private\n   */\n  @ContentChild(DaffSuffixDirective) _suffix: DaffSuffixDirective;\n}\n","@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-tab-label__content\">\n  <ng-content></ng-content>\n</div>\n@if (_suffix) {\n  <ng-content select=\"[daffSuffix]\"></ng-content>\n}","/* eslint-disable quote-props */\nimport {\n  Component,\n  ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport { DaffTabComponent } from '../tab/tab.component';\n\n/**\n * Tab panel is the content area displayed when a tab is active.\n *\n * @example\n * ```html\n * <daff-tab-panel>\n *  <!-- Tab panel content goes here -->\n * </daff-tab-panel>\n * ```\n */\n@Component({\n  selector: 'daff-tab-panel',\n  template: `<ng-content></ng-content>`,\n  styleUrl: './tab-panel.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    'class': 'daff-tab-panel',\n    'role': 'tabpanel',\n    'tabindex': '0',\n    '[attr.id]': 'tabPanelId',\n    '[attr.aria-labelledby]': 'ariaLabelledBy',\n  },\n})\nexport class DaffTabPanelComponent {\n  private _id = '';\n\n  /**\n   * @docs-private\n   *\n   * Dynamically binds the tab panel's id to a unique value generated from the associated tab's panelId.\n   */\n  get tabPanelId() {\n    return this._id;\n  }\n\n  private _ariaLabelledBy = '';\n\n  /**\n   * @docs-private\n   */\n  get ariaLabelledBy() {\n    return this._ariaLabelledBy;\n  }\n\n  constructor(private tab: DaffTabComponent) {\n    /**\n     * Sets the value of `ariaLabelledBy` to the id of the tab component.\n     */\n    this._ariaLabelledBy = this.tab.id;\n\n    this._id = this.tab.panelId;\n  }\n}\n","/* eslint-disable quote-props */\nimport {\n  Input,\n  Component,\n  ChangeDetectionStrategy,\n  ViewEncapsulation,\n  ElementRef,\n} from '@angular/core';\n\nimport { DaffSelectableDirective } from '@daffodil/design';\n\n@Component({\n  selector: '' +\n    'button[daff-tab-activator]' + ',' +\n    'a[daff-tab-activator]',\n  template: `<ng-content></ng-content>`,\n  styleUrl: './tab-activator.component.scss',\n  hostDirectives: [\n    {\n      directive: DaffSelectableDirective,\n      inputs: ['selected'],\n    },\n  ],\n  host: {\n    'class': 'daff-tab-activator',\n    'role': 'tab',\n    '[attr.aria-selected]': 'ariaSelected',\n    '[attr.tabindex]': 'tabIndex',\n    '[attr.id]': 'tabActivatorId',\n    '[attr.aria-controls]': 'panelId',\n  },\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class DaffTabActivatorComponent {\n  /**\n   * @docs-private\n   *\n   * Sets `aria-selected` to true if the component is selected and false if it's not selected.\n   */\n  get ariaSelected() {\n    return this.selectableDirective.selected ? true :  false;\n  }\n\n  /**\n   * @docs-private\n   *\n   * Sets `tabindex` to `0` if the component is selected and `-1` if it's not selected.\n   */\n  get tabIndex() {\n    return this.selectableDirective.selected ? '0' :  '-1';\n  }\n\n  constructor(\n    private el: ElementRef,\n    private selectableDirective: DaffSelectableDirective,\n  ) {\n  }\n\n  /**\n   * The html id of the tab activator component\n   */\n  @Input() tabActivatorId = '';\n\n  @Input() panelId = '';\n\n  /**\n   * Sets focus to the native element of the component.\n   */\n  focus() {\n    this.el.nativeElement.focus();\n  }\n}\n","/* eslint-disable quote-props */\nimport {\n  Location,\n  NgTemplateOutlet,\n} from '@angular/common';\nimport {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  ContentChildren,\n  QueryList,\n  AfterContentInit,\n  Input,\n  Output,\n  EventEmitter,\n  ViewChildren,\n  ChangeDetectorRef,\n  OnInit,\n} from '@angular/core';\nimport {\n  Params,\n  RouterLink,\n  RouterLinkActive,\n} from '@angular/router';\n\nimport { DaffTabComponent } from './tab/tab.component';\nimport { DaffTabActivatorComponent } from './tab-activator/tab-activator.component';\nimport { DaffTabLabelComponent } from './tab-label/tab-label.component';\n\n/**\n * Tabs provide a way to navigate between panels that display related content without leaving the page.\n *\n * @example\n * ```html\n * <daff-tabs aria-label=\"List of tabs\">\n * \t<daff-tab>\n * \t\t<daff-tab-label>\n * \t\t\t<fa-icon [icon]=\"faInfoCircle\" daffPrefix></fa-icon>\n * \t\t\tTab 1\n * \t\t</daff-tab-label>\n * \t\t<daff-tab-panel>\n * \t\t\tTab 1 Panel\n * \t\t</daff-tab-panel>\n * \t</daff-tab>\n * \t<daff-tab>\n * \t\t<daff-tab-label>\n * \t\t\tTab 2\n * \t\t\t<fa-icon [icon]=\"faInfoCircle\" daffSuffix></fa-icon>\n * \t\t</daff-tab-label>\n * \t\t<daff-tab-panel>\n * \t\t\tTab 2 Panel\n * \t\t</daff-tab-panel>\n * \t</daff-tab>\n * </daff-tabs>\n * ```\n */\n@Component({\n  selector: 'daff-tabs',\n  templateUrl: './tabs.component.html',\n  styleUrl: './tabs.component.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    'class': 'daff-tabs',\n    '[attr.aria-label]': 'null',\n  },\n  imports: [\n    NgTemplateOutlet,\n    RouterLink,\n    RouterLinkActive,\n    DaffTabActivatorComponent,\n  ],\n})\n\nexport class DaffTabsComponent implements AfterContentInit, OnInit {\n  /**\n   * @docs-private\n   *\n   * The currently selected tab. This property is dynamically updated when a user selects a tab.\n   */\n  selectedTab: string;\n\n  /**\n   * The tab that is selected on initial load. If it's not used, the first tab in the tablist will be selected by default.\n   */\n  @Input() initiallySelected: string = null;\n\n  /**\n   * `aria-label` to label the tablist.\n   */\n  @Input('aria-label') ariaLabel = '';\n\n  /**\n   * Replace the tab buttons as links.\n   */\n  @Input() linkMode = false;\n\n  /**\n   * The URL to navigate to when the component is in link mode.\n   * This component will set the specified query param.\n   */\n  @Input() url?: string;\n\n  /**\n   * The query parameter that the tabs component will use to set the tab value in link mode.\n   */\n  @Input() queryParam = 'tab';\n\n  /**\n   * Event emitted when tab selection changes.\n   */\n  @Output() tabChange = new EventEmitter<string>();\n\n  /**\n   * @docs-private\n   */\n  @ContentChildren(DaffTabLabelComponent, { descendants: true }) _labels: QueryList<DaffTabLabelComponent>;\n\n  /**\n   * @docs-private\n   */\n  @ContentChildren(DaffTabComponent) _tabs: QueryList<DaffTabComponent>;\n\n  /**\n   * @docs-private\n   */\n  @ViewChildren(DaffTabActivatorComponent) _tabActivators: QueryList<DaffTabActivatorComponent>;\n\n  /**\n   * @docs-private\n   */\n  get currentPath(): string {\n    return this.location.path();\n  }\n\n  constructor(\n    private cdRef: ChangeDetectorRef,\n    private location: Location,\n  ) {}\n\n  private reset() {\n    if(this.initiallySelected) {\n      this.selectedTab = this.initiallySelected;\n    }\n\n    if (!this.selectedTab) {\n      this.selectedTab = this._tabs.first.id;\n    }\n  }\n\n  /**\n   * @docs-private\n   */\n  ngOnInit(): void {\n    this.location.onUrlChange(() => {\n      // if the app is navigated away from the current page, reset the state\n      if (this.linkMode && !this.location.isCurrentPathEqualTo(this.url, `${this.queryParam}=${this.selectedTab}`)) {\n        this.selectedTab = null;\n        this.reset();\n        this.tabChange.emit(this.selectedTab);\n      }\n    });\n  }\n\n  /**\n   * @docs-private\n   */\n  ngAfterContentInit() {\n    this.reset();\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects a tab and sets focus on the selected tab.\n   */\n  select(tabId: string) {\n    const tabActivator = this._tabActivators.find(el => el.tabActivatorId === tabId);\n\n    if (!tabActivator) {\n      console.warn(`The tab '${tabId}' was not able to be selected because it does not exist. Check the id on your <daff-tab>s.`);\n      return;\n    }\n\n    this.tabChange.emit(tabId);\n    this.selectedTab = tabId;\n    this.cdRef.markForCheck();\n\n    tabActivator.focus();\n  }\n\n  /**\n   * Navigates through the tabs based on the given offset.\n   * Moves forward or backward in the tab array, wrapping around when necessary.\n   */\n  private navigateTabs(offset: number) {\n    const array = this._tabs.toArray();\n    let selectedIndex = array.findIndex(el => el.id === this.selectedTab);\n    const startingIndex = selectedIndex;\n    let newIndex;\n\n    do {\n      newIndex = (selectedIndex + offset + array.length) % array.length;\n      selectedIndex = newIndex;\n    } while (array[newIndex].disabled && selectedIndex !== startingIndex); // Skip disabled tabs\n\n    this.select(array[newIndex].id);\n  }\n\n  /**\n   * @docs-private\n   */\n  _buildQueryParams(tab: string): Params {\n    return {\n      [this.queryParam]: tab,\n    };\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects the previous tab and wraps around to the last tab if the first tab is currently selected.\n   */\n  previous() {\n    this.navigateTabs(-1);\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects the next tab and wraps around to the first tab if the last tab is currently selected.\n   */\n  next() {\n    this.navigateTabs(1);\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects the first tab.\n   */\n  selectFirst(event: KeyboardEvent | null) {\n    event.preventDefault();\n    this.select(this._tabs.toArray()[0].id);\n  }\n\n  /**\n   * @docs-private\n   *\n   * Selects the last tab.\n   */\n  selectLast(event: KeyboardEvent | null) {\n    event.preventDefault();\n    const array = this._tabs.toArray();\n    this.select(array[array.length - 1].id);\n  }\n}\n","<div class=\"daff-tabs__tab-list\"\n\trole=\"tablist\"\n\t[attr.aria-label]=\"ariaLabel\"\n\t(keydown.home)=\"selectFirst($event)\"\n\t(keydown.end)=\"selectLast($event)\">\n\t@for (tab of _tabs; track tab) {\n\t\t@if (linkMode && tab.disabled) {\n\t\t\t<button daff-tab-activator routerLinkActive\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t} @else if (linkMode) {\n\t\t\t<a daff-tab-activator routerLinkActive\n\t\t\t\tclass=\"daff-ae daff_tabs__link\"\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t[routerLink]=\"url || currentPath\"\n\t\t\t\tqueryParamsHandling=\"merge\"\n\t\t\t\t[queryParams]=\"_buildQueryParams(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\"\n\t\t\t\t(isActiveChange)=\"$event && select(tab.id)\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</a>\n\t\t} @else {\n\t\t\t<button daff-tab-activator\n\t\t\t\t[selected]=\"tab.id === selectedTab\"\n\t\t\t\t(click)=\"select(tab.id)\"\n\t\t\t\t[panelId]=\"tab.panelId\"\n\t\t\t\t[disabled]=\"tab.disabled\"\n\t\t\t\t[tabActivatorId]=\"tab.id\"\n\t\t\t\t(keydown.arrowright)=\"next()\"\n\t\t\t\t(keydown.arrowleft)=\"previous()\">\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"tab.labelRef\"></ng-container>\n\t\t\t</button>\n\t\t}\n\t}\n</div>\n\n@for (tab of _tabs; track tab) {\n\t@if(tab.id === selectedTab ) {\n\t\t<ng-container *ngTemplateOutlet=\"tab.contentRef\"></ng-container>\n\t}\n}","import { DaffTabComponent } from './tabs/tab/tab.component';\nimport { DaffTabLabelComponent } from './tabs/tab-label/tab-label.component';\nimport { DaffTabPanelComponent } from './tabs/tab-panel/tab-panel.component';\nimport { DaffTabsComponent } from './tabs/tabs.component';\n\n/**\n * @docs-private\n *\n * ```ts\n * import { DAFF_TABS_COMPONENTS } from '@daffodil/design/tabs';\n * ```\n */\nexport const DAFF_TABS_COMPONENTS = <const> [\n  DaffTabsComponent,\n  DaffTabLabelComponent,\n  DaffTabPanelComponent,\n  DaffTabComponent,\n];\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.DaffTabComponent","i1"],"mappings":"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"}

package/fesm2022/daffodil-design-tag.mjs

@@ -1,49 +1,49 @@
-import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
-import { Directive, EventEmitter, Output, Input, ContentChild, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+import { Directive, EventEmitter, booleanAttribute, Output, Input, ContentChild, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
 import { faTimes } from '@fortawesome/free-solid-svg-icons';
 import * as i2 from '@daffodil/design';
-import { DaffSizableDirective, DaffPrefixDirective, DaffArticleEncapsulatedDirective, DaffColorableDirective, DaffStatusableDirective } from '@daffodil/design';
+import { DaffSizableDirective, DaffPrefixDirective, DaffArticleEncapsulatedDirective, DaffColorableDirective, DaffStatusableDirective, DaffDisableableDirective } from '@daffodil/design';
 
 class DaffTagSizableDirective extends DaffSizableDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTagSizableDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.18", type: DaffTagSizableDirective, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTagSizableDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: DaffTagSizableDirective, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTagSizableDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTagSizableDirective, decorators: [{
             type: Directive,
             args: [{}]
         }] });
 
 /**
- * Contains the tag content: checkmark icon, label, and delete button.
+ * DaffTagComponent is an interactive indicator and filter that can be edited or removed, used to represent selections, categories, or applied filters.
  *
  * @example
  * ```html
- *  <daff-tag [dismissible]="true" (closeTag)="onCloseTag()">
- *    <fa-icon daffPrefix [icon]="faCircleCheck"></fa-icon>
- *    <div>Label</div>
- *  </daff-tag>
+ * <daff-tag [dismissible]="true" (closeTag)="onCloseTag()">
+ *   <fa-icon daffPrefix [icon]="faCircleCheck"></fa-icon>
+ *   Label
+ * </daff-tag>
  * ```
  */
 class DaffTagComponent {
     /**
-     * The disabled state of the tag.
+     * @docs-private
+     *
+     * Internal function to access the disabled property of the DaffDisableableDirective.
      */
     get disabled() {
-        return this._disabled;
-    }
-    set disabled(value) {
-        this._disabled = coerceBooleanProperty(value);
+        return this.disabledDirective.disabled;
     }
-    /** Whether the tag can be dismissed by the user.
-     * Displays a close icon if `true`.
+    /**
+     * @deprecated Deprecated in version 0.93.0. Deprecated in version 0.93.1. Will be removed in version 0.96.0.
+     *
+     * Sets the status on the tag.
      */
-    get dismissible() {
-        return this._dismissible;
+    get status() {
+        return this.statusable.status;
     }
-    set dismissible(value) {
-        this._dismissible = coerceBooleanProperty(value);
+    set status(value) {
+        this.statusable.status = value;
     }
     /**
      * @docs-private
@@ -51,19 +51,24 @@ class DaffTagComponent {
      * Internal handler for the close icon click.
      */
     onCloseTag(event) {
-        if (this._disabled) {
+        if (this.disabled) {
             return;
         }
         this.closeTag.emit();
     }
-    constructor(size) {
+    constructor(size, disabledDirective, statusable) {
         this.size = size;
+        this.disabledDirective = disabledDirective;
+        this.statusable = statusable;
         /**
          * @docs-private
          */
         this.faTimes = faTimes;
-        this._disabled = false;
-        this._dismissible = false;
+        /**
+         * Whether the tag can be dismissed by the user.
+         * Displays a close icon if `true`.
+         */
+        this.dismissible = false;
         /**
          * Emits when the tag is closed.
          */
@@ -73,10 +78,10 @@ class DaffTagComponent {
          */
         this.size.defaultSize = 'md';
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTagComponent, deps: [{ token: DaffTagSizableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: DaffTagComponent, isStandalone: true, selector: "daff-tag", inputs: { disabled: "disabled", dismissible: "dismissible" }, outputs: { closeTag: "closeTag" }, host: { properties: { "attr.aria-disabled": "disabled ? true : null", "disabled": "disabled", "class.dismissible": "dismissible" }, classAttribute: "daff-tag" }, queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true, static: true }], hostDirectives: [{ directive: i2.DaffArticleEncapsulatedDirective }, { directive: DaffTagSizableDirective, inputs: ["size", "size"] }, { directive: i2.DaffColorableDirective, inputs: ["color", "color"] }, { directive: i2.DaffStatusableDirective, inputs: ["status", "status"] }], ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-tag__label\">\n  <ng-content></ng-content>\n</div>\n@if (dismissible) {\n  <button class=\"daff-tag__close-icon\" (click)=\"onCloseTag($event)\" aria-label=\"Dismiss\" [attr.tabindex]=\"disabled ? -1 : null\">\n    <fa-icon [icon]=\"faTimes\"></fa-icon>\n  </button>\n}\n", styles: [".daff-tag{display:inline-flex;align-items:center;justify-content:center;flex-wrap:nowrap;border-radius:.25rem;position:relative}.daff-tag.daff-sm{font-size:.875rem;line-height:1rem;gap:.375rem;padding:.5rem}.daff-tag.daff-sm .daff-tag__close-icon{font-size:.875rem;line-height:1rem}.daff-tag.daff-md{font-size:1rem;line-height:1.25rem;gap:.5rem;padding:.5rem}.daff-tag.daff-md .daff-tag__close-icon{font-size:1rem;line-height:1.25rem}.daff-tag.daff-lg{font-size:1.25rem;line-height:1.5rem;gap:.75rem;padding:.75rem}.daff-tag.daff-lg .daff-tag__close-icon{font-size:1.25rem;line-height:1.5rem}.daff-tag[disabled],.daff-tag.disabled{cursor:not-allowed;opacity:.5}.daff-tag[disabled] .daff-tag__close-icon,.daff-tag.disabled .daff-tag__close-icon{cursor:not-allowed}.daff-tag__close-icon{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:none;background:none;appearance:none;padding:0;position:relative;color:currentColor;margin:0}\n"], dependencies: [{ kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTagComponent, deps: [{ token: DaffTagSizableDirective }, { token: i2.DaffDisableableDirective }, { token: i2.DaffStatusableDirective }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: DaffTagComponent, isStandalone: true, selector: "daff-tag", inputs: { status: "status", dismissible: ["dismissible", "dismissible", booleanAttribute] }, outputs: { closeTag: "closeTag" }, host: { properties: { "attr.aria-disabled": "disabled ? true : null", "class.dismissible": "dismissible" }, classAttribute: "daff-tag" }, queries: [{ propertyName: "_prefix", first: true, predicate: DaffPrefixDirective, descendants: true, static: true }], hostDirectives: [{ directive: i2.DaffArticleEncapsulatedDirective }, { directive: DaffTagSizableDirective, inputs: ["size", "size"] }, { directive: i2.DaffColorableDirective, inputs: ["color", "color"] }, { directive: i2.DaffStatusableDirective }, { directive: i2.DaffDisableableDirective, inputs: ["disabled", "disabled"] }], ngImport: i0, template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-tag__label\">\n  <ng-content></ng-content>\n</div>\n@if (dismissible) {\n  <button class=\"daff-tag__close-icon\" (click)=\"onCloseTag($event)\" aria-label=\"Dismiss\" [attr.tabindex]=\"disabled ? -1 : null\">\n    <fa-icon [icon]=\"faTimes\" [fixedWidth]=\"true\"></fa-icon>\n  </button>\n}\n", styles: [".daff-tag{display:inline-flex;align-items:center;cursor:default;justify-content:center;flex-wrap:nowrap;border-radius:.25rem;position:relative}.daff-tag.daff-sm{font-size:.875rem;line-height:1rem;gap:.375rem;padding:.5rem}.daff-tag.daff-sm .daff-tag__close-icon{font-size:.875rem;line-height:1rem}.daff-tag.daff-md{font-size:1rem;line-height:1rem;gap:.5rem;padding:.5rem}.daff-tag.daff-md .daff-tag__close-icon{font-size:1rem;line-height:1.25rem}.daff-tag.daff-lg{font-size:1.25rem;line-height:1.25rem;gap:.5rem;padding:.75rem}.daff-tag.daff-lg .daff-tag__close-icon{font-size:1.25rem;line-height:1.25rem}.daff-tag:after{content:\"\";border-radius:.25rem;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}@media(hover:hover){.daff-tag:hover:after{opacity:1}}.daff-tag.daff-disabled{cursor:not-allowed;opacity:.5}@media(hover:hover){.daff-tag.daff-disabled:hover:after{opacity:0}}.daff-tag.daff-disabled .daff-tag__close-icon{cursor:not-allowed}.daff-tag.dismissible{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.daff-tag .daff-tag__label,.daff-tag .daff-prefix,.daff-tag .daff-tag__close-icon{z-index:1}.daff-tag__close-icon{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:none;background:none;appearance:none;padding:0;position:relative;color:currentColor;margin:0}\n"], dependencies: [{ kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: DaffTagComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DaffTagComponent, decorators: [{
             type: Component,
             args: [{ selector: 'daff-tag', hostDirectives: [
                         { directive: DaffArticleEncapsulatedDirective },
@@ -90,24 +95,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                         },
                         {
                             directive: DaffStatusableDirective,
-                            inputs: ['status'],
+                        },
+                        {
+                            directive: DaffDisableableDirective,
+                            inputs: ['disabled'],
                         },
                     ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'daff-tag',
                         '[attr.aria-disabled]': 'disabled ? true : null',
-                        '[disabled]': 'disabled',
                         '[class.dismissible]': 'dismissible',
                     }, imports: [
                         FaIconComponent,
                         DaffPrefixDirective,
-                    ], template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-tag__label\">\n  <ng-content></ng-content>\n</div>\n@if (dismissible) {\n  <button class=\"daff-tag__close-icon\" (click)=\"onCloseTag($event)\" aria-label=\"Dismiss\" [attr.tabindex]=\"disabled ? -1 : null\">\n    <fa-icon [icon]=\"faTimes\"></fa-icon>\n  </button>\n}\n", styles: [".daff-tag{display:inline-flex;align-items:center;justify-content:center;flex-wrap:nowrap;border-radius:.25rem;position:relative}.daff-tag.daff-sm{font-size:.875rem;line-height:1rem;gap:.375rem;padding:.5rem}.daff-tag.daff-sm .daff-tag__close-icon{font-size:.875rem;line-height:1rem}.daff-tag.daff-md{font-size:1rem;line-height:1.25rem;gap:.5rem;padding:.5rem}.daff-tag.daff-md .daff-tag__close-icon{font-size:1rem;line-height:1.25rem}.daff-tag.daff-lg{font-size:1.25rem;line-height:1.5rem;gap:.75rem;padding:.75rem}.daff-tag.daff-lg .daff-tag__close-icon{font-size:1.25rem;line-height:1.5rem}.daff-tag[disabled],.daff-tag.disabled{cursor:not-allowed;opacity:.5}.daff-tag[disabled] .daff-tag__close-icon,.daff-tag.disabled .daff-tag__close-icon{cursor:not-allowed}.daff-tag__close-icon{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:none;background:none;appearance:none;padding:0;position:relative;color:currentColor;margin:0}\n"] }]
-        }], ctorParameters: () => [{ type: DaffTagSizableDirective }], propDecorators: { _prefix: [{
+                    ], template: "@if (_prefix) {\n  <ng-content select=\"[daffPrefix]\"></ng-content>\n}\n<div class=\"daff-tag__label\">\n  <ng-content></ng-content>\n</div>\n@if (dismissible) {\n  <button class=\"daff-tag__close-icon\" (click)=\"onCloseTag($event)\" aria-label=\"Dismiss\" [attr.tabindex]=\"disabled ? -1 : null\">\n    <fa-icon [icon]=\"faTimes\" [fixedWidth]=\"true\"></fa-icon>\n  </button>\n}\n", styles: [".daff-tag{display:inline-flex;align-items:center;cursor:default;justify-content:center;flex-wrap:nowrap;border-radius:.25rem;position:relative}.daff-tag.daff-sm{font-size:.875rem;line-height:1rem;gap:.375rem;padding:.5rem}.daff-tag.daff-sm .daff-tag__close-icon{font-size:.875rem;line-height:1rem}.daff-tag.daff-md{font-size:1rem;line-height:1rem;gap:.5rem;padding:.5rem}.daff-tag.daff-md .daff-tag__close-icon{font-size:1rem;line-height:1.25rem}.daff-tag.daff-lg{font-size:1.25rem;line-height:1.25rem;gap:.5rem;padding:.75rem}.daff-tag.daff-lg .daff-tag__close-icon{font-size:1.25rem;line-height:1.25rem}.daff-tag:after{content:\"\";border-radius:.25rem;position:absolute;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .3s;z-index:0}@media(hover:hover){.daff-tag:hover:after{opacity:1}}.daff-tag.daff-disabled{cursor:not-allowed;opacity:.5}@media(hover:hover){.daff-tag.daff-disabled:hover:after{opacity:0}}.daff-tag.daff-disabled .daff-tag__close-icon{cursor:not-allowed}.daff-tag.dismissible{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.daff-tag .daff-tag__label,.daff-tag .daff-prefix,.daff-tag .daff-tag__close-icon{z-index:1}.daff-tag__close-icon{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:none;background:none;appearance:none;padding:0;position:relative;color:currentColor;margin:0}\n"] }]
+        }], ctorParameters: () => [{ type: DaffTagSizableDirective }, { type: i2.DaffDisableableDirective }, { type: i2.DaffStatusableDirective }], propDecorators: { _prefix: [{
                 type: ContentChild,
                 args: [DaffPrefixDirective, { static: true }]
-            }], disabled: [{
+            }], status: [{
                 type: Input
             }], dismissible: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], closeTag: [{
                 type: Output
             }] } });