@skyux/code-examples 12.2.0 → 12.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -700,11 +700,11 @@ class ActionBarsSummaryActionBarBasicExampleComponent {
700
700
  alert('Secondary action 2 button clicked.');
701
701
  }
702
702
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionBarsSummaryActionBarBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
703
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ActionBarsSummaryActionBarBasicExampleComponent, isStandalone: true, selector: "app-action-bars-summary-action-bar-basic-example", ngImport: i0, template: "<sky-summary-action-bar>\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action\n (actionClick)=\"onPrimaryActionClick()\"\n >\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n</sky-summary-action-bar>\n", dependencies: [{ kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkySummaryActionBarModule }, { kind: "component", type: i2$4.λ2, selector: "sky-summary-action-bar" }, { kind: "component", type: i2$4.λ3, selector: "sky-summary-action-bar-actions" }, { kind: "component", type: i2$4.λ5, selector: "sky-summary-action-bar-primary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ6, selector: "sky-summary-action-bar-secondary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ7, selector: "sky-summary-action-bar-secondary-actions" }, { kind: "component", type: i2$4.λ1, selector: "sky-summary-action-bar-summary" }] }); }
703
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ActionBarsSummaryActionBarBasicExampleComponent, isStandalone: true, selector: "app-action-bars-summary-action-bar-basic-example", ngImport: i0, template: "<sky-summary-action-bar data-sky-id=\"donation-summary\">\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action\n (actionClick)=\"onPrimaryActionClick()\"\n >\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action\"\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action-2\"\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n</sky-summary-action-bar>\n", dependencies: [{ kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkySummaryActionBarModule }, { kind: "component", type: i2$4.λ2, selector: "sky-summary-action-bar" }, { kind: "component", type: i2$4.λ3, selector: "sky-summary-action-bar-actions" }, { kind: "component", type: i2$4.λ5, selector: "sky-summary-action-bar-primary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ6, selector: "sky-summary-action-bar-secondary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ7, selector: "sky-summary-action-bar-secondary-actions" }, { kind: "component", type: i2$4.λ1, selector: "sky-summary-action-bar-summary" }] }); }
704
704
  }
705
705
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionBarsSummaryActionBarBasicExampleComponent, decorators: [{
706
706
  type: Component,
707
- args: [{ selector: 'app-action-bars-summary-action-bar-basic-example', imports: [SkyKeyInfoModule, SkySummaryActionBarModule], template: "<sky-summary-action-bar>\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action\n (actionClick)=\"onPrimaryActionClick()\"\n >\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n</sky-summary-action-bar>\n" }]
707
+ args: [{ selector: 'app-action-bars-summary-action-bar-basic-example', imports: [SkyKeyInfoModule, SkySummaryActionBarModule], template: "<sky-summary-action-bar data-sky-id=\"donation-summary\">\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action\n (actionClick)=\"onPrimaryActionClick()\"\n >\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action\"\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action-2\"\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n</sky-summary-action-bar>\n" }]
708
708
  }] });
709
709
 
710
710
  let ModalComponent$8 = class ModalComponent {
@@ -722,11 +722,11 @@ let ModalComponent$8 = class ModalComponent {
722
722
  this.#modalInstance.save();
723
723
  }
724
724
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
725
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ModalComponent, isStandalone: true, selector: "app-modal", ngImport: i0, template: "<sky-modal headingText=\"Modal with summary action bar\">\n <sky-modal-content> Hello world! </sky-modal-content>\n <sky-modal-footer>\n <sky-summary-action-bar>\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action (actionClick)=\"save()\">\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-cancel (actionClick)=\"cancel()\">\n Cancel\n </sky-summary-action-bar-cancel>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n </sky-summary-action-bar>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3$2.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3$2.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3$2.λ3, selector: "sky-modal-footer" }, { kind: "ngmodule", type: SkySummaryActionBarModule }, { kind: "component", type: i2$4.λ2, selector: "sky-summary-action-bar" }, { kind: "component", type: i2$4.λ3, selector: "sky-summary-action-bar-actions" }, { kind: "component", type: i2$4.λ4, selector: "sky-summary-action-bar-cancel", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ5, selector: "sky-summary-action-bar-primary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ6, selector: "sky-summary-action-bar-secondary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ7, selector: "sky-summary-action-bar-secondary-actions" }, { kind: "component", type: i2$4.λ1, selector: "sky-summary-action-bar-summary" }] }); }
725
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ModalComponent, isStandalone: true, selector: "app-modal", ngImport: i0, template: "<sky-modal headingText=\"Modal with summary action bar\">\n <sky-modal-content> Hello world! </sky-modal-content>\n <sky-modal-footer>\n <sky-summary-action-bar data-sky-id=\"donation-summary\">\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action (actionClick)=\"save()\">\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action\"\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action-2\"\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-cancel (actionClick)=\"cancel()\">\n Cancel\n </sky-summary-action-bar-cancel>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n </sky-summary-action-bar>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3$2.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3$2.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3$2.λ3, selector: "sky-modal-footer" }, { kind: "ngmodule", type: SkySummaryActionBarModule }, { kind: "component", type: i2$4.λ2, selector: "sky-summary-action-bar" }, { kind: "component", type: i2$4.λ3, selector: "sky-summary-action-bar-actions" }, { kind: "component", type: i2$4.λ4, selector: "sky-summary-action-bar-cancel", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ5, selector: "sky-summary-action-bar-primary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ6, selector: "sky-summary-action-bar-secondary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ7, selector: "sky-summary-action-bar-secondary-actions" }, { kind: "component", type: i2$4.λ1, selector: "sky-summary-action-bar-summary" }] }); }
726
726
  };
727
727
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ModalComponent$8, decorators: [{
728
728
  type: Component,
729
- args: [{ selector: 'app-modal', imports: [SkyKeyInfoModule, SkyModalModule, SkySummaryActionBarModule], template: "<sky-modal headingText=\"Modal with summary action bar\">\n <sky-modal-content> Hello world! </sky-modal-content>\n <sky-modal-footer>\n <sky-summary-action-bar>\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action (actionClick)=\"save()\">\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-cancel (actionClick)=\"cancel()\">\n Cancel\n </sky-summary-action-bar-cancel>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n </sky-summary-action-bar>\n </sky-modal-footer>\n</sky-modal>\n" }]
729
+ args: [{ selector: 'app-modal', imports: [SkyKeyInfoModule, SkyModalModule, SkySummaryActionBarModule], template: "<sky-modal headingText=\"Modal with summary action bar\">\n <sky-modal-content> Hello world! </sky-modal-content>\n <sky-modal-footer>\n <sky-summary-action-bar data-sky-id=\"donation-summary\">\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action (actionClick)=\"save()\">\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action\"\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action-2\"\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-cancel (actionClick)=\"cancel()\">\n Cancel\n </sky-summary-action-bar-cancel>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n </sky-summary-action-bar>\n </sky-modal-footer>\n</sky-modal>\n" }]
730
730
  }] });
731
731
 
732
732
  /**
@@ -762,11 +762,11 @@ class ActionBarsSummaryActionBarTabExampleComponent {
762
762
  alert('Secondary action 2 button clicked.');
763
763
  }
764
764
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionBarsSummaryActionBarTabExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
765
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ActionBarsSummaryActionBarTabExampleComponent, isStandalone: true, selector: "app-action-bars-summary-action-bar-tab-example", ngImport: i0, template: "<sky-tabset [active]=\"0\">\n <sky-tab tabHeading=\"Tab 1\"> Tab without summary action bar. </sky-tab>\n <sky-tab tabHeading=\"Tab 2\">\n Tab with summary action bar.\n <sky-summary-action-bar>\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action\n (actionClick)=\"onPrimaryActionClick()\"\n >\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n </sky-summary-action-bar>\n </sky-tab>\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkySummaryActionBarModule }, { kind: "component", type: i2$4.λ2, selector: "sky-summary-action-bar" }, { kind: "component", type: i2$4.λ3, selector: "sky-summary-action-bar-actions" }, { kind: "component", type: i2$4.λ5, selector: "sky-summary-action-bar-primary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ6, selector: "sky-summary-action-bar-secondary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ7, selector: "sky-summary-action-bar-secondary-actions" }, { kind: "component", type: i2$4.λ1, selector: "sky-summary-action-bar-summary" }, { kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
765
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ActionBarsSummaryActionBarTabExampleComponent, isStandalone: true, selector: "app-action-bars-summary-action-bar-tab-example", ngImport: i0, template: "<sky-tabset [active]=\"0\">\n <sky-tab tabHeading=\"Tab 1\"> Tab without summary action bar. </sky-tab>\n <sky-tab tabHeading=\"Tab 2\">\n Tab with summary action bar.\n <sky-summary-action-bar data-sky-id=\"donation-summary\">\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action\n (actionClick)=\"onPrimaryActionClick()\"\n >\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action\"\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action-2\"\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n </sky-summary-action-bar>\n </sky-tab>\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkySummaryActionBarModule }, { kind: "component", type: i2$4.λ2, selector: "sky-summary-action-bar" }, { kind: "component", type: i2$4.λ3, selector: "sky-summary-action-bar-actions" }, { kind: "component", type: i2$4.λ5, selector: "sky-summary-action-bar-primary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ6, selector: "sky-summary-action-bar-secondary-action", inputs: ["disabled"], outputs: ["actionClick"] }, { kind: "component", type: i2$4.λ7, selector: "sky-summary-action-bar-secondary-actions" }, { kind: "component", type: i2$4.λ1, selector: "sky-summary-action-bar-summary" }, { kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
766
766
  }
767
767
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionBarsSummaryActionBarTabExampleComponent, decorators: [{
768
768
  type: Component,
769
- args: [{ selector: 'app-action-bars-summary-action-bar-tab-example', imports: [SkyKeyInfoModule, SkySummaryActionBarModule, SkyTabsModule], template: "<sky-tabset [active]=\"0\">\n <sky-tab tabHeading=\"Tab 1\"> Tab without summary action bar. </sky-tab>\n <sky-tab tabHeading=\"Tab 2\">\n Tab with summary action bar.\n <sky-summary-action-bar>\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action\n (actionClick)=\"onPrimaryActionClick()\"\n >\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n </sky-summary-action-bar>\n </sky-tab>\n</sky-tabset>\n" }]
769
+ args: [{ selector: 'app-action-bars-summary-action-bar-tab-example', imports: [SkyKeyInfoModule, SkySummaryActionBarModule, SkyTabsModule], template: "<sky-tabset [active]=\"0\">\n <sky-tab tabHeading=\"Tab 1\"> Tab without summary action bar. </sky-tab>\n <sky-tab tabHeading=\"Tab 2\">\n Tab with summary action bar.\n <sky-summary-action-bar data-sky-id=\"donation-summary\">\n <sky-summary-action-bar-actions>\n <sky-summary-action-bar-primary-action\n (actionClick)=\"onPrimaryActionClick()\"\n >\n Primary action\n </sky-summary-action-bar-primary-action>\n <sky-summary-action-bar-secondary-actions>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action\"\n (actionClick)=\"onSecondaryActionClick()\"\n >\n Secondary action\n </sky-summary-action-bar-secondary-action>\n <sky-summary-action-bar-secondary-action\n data-sky-id=\"secondary-action-2\"\n (actionClick)=\"onSecondaryAction2Click()\"\n >\n Secondary action 2\n </sky-summary-action-bar-secondary-action>\n </sky-summary-action-bar-secondary-actions>\n </sky-summary-action-bar-actions>\n <sky-summary-action-bar-summary>\n <sky-key-info>\n <sky-key-info-value>$250</sky-key-info-value>\n <sky-key-info-label>Given this month</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,000</sky-key-info-value>\n <sky-key-info-label>Given this year</sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value>$1,300</sky-key-info-value>\n <sky-key-info-label>Given all time</sky-key-info-label>\n </sky-key-info>\n </sky-summary-action-bar-summary>\n </sky-summary-action-bar>\n </sky-tab>\n</sky-tabset>\n" }]
770
770
  }] });
771
771
 
772
772
  /**
@@ -6509,7 +6509,7 @@ class DatetimeDatepickerCustomDatesExampleComponent {
6509
6509
  }
6510
6510
  /**
6511
6511
  * Generate fake custom dates based on the date range returned from the event.
6512
- * This is for examplenstration purposes only.
6512
+ * This is for demonstration purposes only.
6513
6513
  */
6514
6514
  #getCustomDates(event) {
6515
6515
  const getNextDate = function (startDate, daysToAdd) {
@@ -6682,12 +6682,10 @@ class DatetimeTimepickerBasicExampleComponent {
6682
6682
  nonNullable: true,
6683
6683
  validators: [Validators.required, validateTime],
6684
6684
  });
6685
- this.formGroup = inject(FormBuilder).group({
6686
- time: this.time,
6687
- });
6685
+ this.formGroup = inject(FormBuilder).group({ time: this.time });
6688
6686
  }
6689
6687
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DatetimeTimepickerBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6690
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: DatetimeTimepickerBasicExampleComponent, isStandalone: true, selector: "app-datetime-timepicker-basic-example", ngImport: i0, template: "<div class=\"sky-padding-even-lg\">\n <form [formGroup]=\"formGroup\">\n <sky-input-box\n labelText=\"Start time\"\n [helpPopoverContent]=\"helpPopoverContent\"\n [hintText]=\"hintText\"\n >\n <sky-timepicker #timepicker>\n <input\n formControlName=\"time\"\n timeFormat=\"hh\"\n [skyTimepickerInput]=\"timepicker\"\n />\n </sky-timepicker>\n @if (time.errors?.['invalidMinute']) {\n <sky-form-error\n errorName=\"invalidMinute\"\n errorText=\"Start time must be a 15-minute increment.\"\n />\n }\n </sky-input-box>\n </form>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ20, selector: "input:not([skyId]):not(.sky-form-control),select:not([skyId]):not(.sky-form-control),textarea:not([skyId]):not(.sky-form-control)", inputs: ["autocomplete"] }, { kind: "component", type: i2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }, { kind: "ngmodule", type: SkyTimepickerModule }, { kind: "directive", type: i3$5.λ7, selector: "[skyTimepickerInput]", inputs: ["skyTimepickerInput", "timeFormat", "returnFormat", "disabled"] }, { kind: "component", type: i3$5.λ6, selector: "sky-timepicker", outputs: ["selectedTimeChanged"] }] }); }
6688
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: DatetimeTimepickerBasicExampleComponent, isStandalone: true, selector: "app-datetime-timepicker-basic-example", ngImport: i0, template: "<div class=\"sky-padding-even-lg\">\n <form [formGroup]=\"formGroup\">\n <sky-input-box\n data-sky-id=\"timepicker-example\"\n labelText=\"Start time\"\n [helpPopoverContent]=\"helpPopoverContent\"\n [hintText]=\"hintText\"\n >\n <sky-timepicker #timepicker>\n <input\n formControlName=\"time\"\n timeFormat=\"hh\"\n [skyTimepickerInput]=\"timepicker\"\n />\n </sky-timepicker>\n @if (time.errors?.['invalidMinute']) {\n <sky-form-error\n errorName=\"invalidMinute\"\n errorText=\"Start time must be a 15-minute increment.\"\n />\n }\n </sky-input-box>\n </form>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ20, selector: "input:not([skyId]):not(.sky-form-control),select:not([skyId]):not(.sky-form-control),textarea:not([skyId]):not(.sky-form-control)", inputs: ["autocomplete"] }, { kind: "component", type: i2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }, { kind: "ngmodule", type: SkyTimepickerModule }, { kind: "directive", type: i3$5.λ7, selector: "[skyTimepickerInput]", inputs: ["skyTimepickerInput", "timeFormat", "returnFormat", "disabled"] }, { kind: "component", type: i3$5.λ6, selector: "sky-timepicker", outputs: ["selectedTimeChanged"] }] }); }
6691
6689
  }
6692
6690
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DatetimeTimepickerBasicExampleComponent, decorators: [{
6693
6691
  type: Component,
@@ -6696,7 +6694,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
6696
6694
  ReactiveFormsModule,
6697
6695
  SkyInputBoxModule,
6698
6696
  SkyTimepickerModule,
6699
- ], template: "<div class=\"sky-padding-even-lg\">\n <form [formGroup]=\"formGroup\">\n <sky-input-box\n labelText=\"Start time\"\n [helpPopoverContent]=\"helpPopoverContent\"\n [hintText]=\"hintText\"\n >\n <sky-timepicker #timepicker>\n <input\n formControlName=\"time\"\n timeFormat=\"hh\"\n [skyTimepickerInput]=\"timepicker\"\n />\n </sky-timepicker>\n @if (time.errors?.['invalidMinute']) {\n <sky-form-error\n errorName=\"invalidMinute\"\n errorText=\"Start time must be a 15-minute increment.\"\n />\n }\n </sky-input-box>\n </form>\n</div>\n" }]
6697
+ ], template: "<div class=\"sky-padding-even-lg\">\n <form [formGroup]=\"formGroup\">\n <sky-input-box\n data-sky-id=\"timepicker-example\"\n labelText=\"Start time\"\n [helpPopoverContent]=\"helpPopoverContent\"\n [hintText]=\"hintText\"\n >\n <sky-timepicker #timepicker>\n <input\n formControlName=\"time\"\n timeFormat=\"hh\"\n [skyTimepickerInput]=\"timepicker\"\n />\n </sky-timepicker>\n @if (time.errors?.['invalidMinute']) {\n <sky-form-error\n errorName=\"invalidMinute\"\n errorText=\"Start time must be a 15-minute increment.\"\n />\n }\n </sky-input-box>\n </form>\n</div>\n" }]
6700
6698
  }], ctorParameters: () => [] });
6701
6699
 
6702
6700
  class FlyoutComponent {
@@ -7576,11 +7574,11 @@ class FormsToggleSwitchBasicExampleComponent {
7576
7574
  });
7577
7575
  }
7578
7576
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsToggleSwitchBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
7579
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: FormsToggleSwitchBasicExampleComponent, isStandalone: true, selector: "app-forms-toggle-switch-basic-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-toggle-switch\n formControlName=\"registration\"\n labelText=\"Open for registration\"\n [helpPopoverContent]=\"helpPopoverContent\"\n />\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyToggleSwitchModule }, { kind: "component", type: i2.λ19, selector: "sky-toggle-switch", inputs: ["ariaLabel", "checked", "disabled", "helpPopoverContent", "helpPopoverTitle", "tabIndex", "labelText", "labelHidden", "helpKey"], outputs: ["toggleChange"] }] }); }
7577
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: FormsToggleSwitchBasicExampleComponent, isStandalone: true, selector: "app-forms-toggle-switch-basic-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-toggle-switch\n data-sky-id=\"toggle-switch\"\n formControlName=\"registration\"\n labelText=\"Open for registration\"\n [helpPopoverContent]=\"helpPopoverContent\"\n />\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyToggleSwitchModule }, { kind: "component", type: i2.λ19, selector: "sky-toggle-switch", inputs: ["ariaLabel", "checked", "disabled", "helpPopoverContent", "helpPopoverTitle", "tabIndex", "labelText", "labelHidden", "helpKey"], outputs: ["toggleChange"] }] }); }
7580
7578
  }
7581
7579
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsToggleSwitchBasicExampleComponent, decorators: [{
7582
7580
  type: Component,
7583
- args: [{ selector: 'app-forms-toggle-switch-basic-example', imports: [FormsModule, ReactiveFormsModule, SkyToggleSwitchModule], template: "<form [formGroup]=\"formGroup\">\n <sky-toggle-switch\n formControlName=\"registration\"\n labelText=\"Open for registration\"\n [helpPopoverContent]=\"helpPopoverContent\"\n />\n</form>\n" }]
7581
+ args: [{ selector: 'app-forms-toggle-switch-basic-example', imports: [FormsModule, ReactiveFormsModule, SkyToggleSwitchModule], template: "<form [formGroup]=\"formGroup\">\n <sky-toggle-switch\n data-sky-id=\"toggle-switch\"\n formControlName=\"registration\"\n labelText=\"Open for registration\"\n [helpPopoverContent]=\"helpPopoverContent\"\n />\n</form>\n" }]
7584
7582
  }], ctorParameters: () => [] });
7585
7583
 
7586
7584
  /**
@@ -7593,11 +7591,11 @@ class FormsToggleSwitchHelpKeyExampleComponent {
7593
7591
  });
7594
7592
  }
7595
7593
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsToggleSwitchHelpKeyExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
7596
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: FormsToggleSwitchHelpKeyExampleComponent, isStandalone: true, selector: "app-forms-toggle-switch-help-key-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-toggle-switch\n formControlName=\"registration\"\n helpKey=\"registration-help\"\n labelText=\"Open for registration\"\n />\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyToggleSwitchModule }, { kind: "component", type: i2.λ19, selector: "sky-toggle-switch", inputs: ["ariaLabel", "checked", "disabled", "helpPopoverContent", "helpPopoverTitle", "tabIndex", "labelText", "labelHidden", "helpKey"], outputs: ["toggleChange"] }] }); }
7594
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: FormsToggleSwitchHelpKeyExampleComponent, isStandalone: true, selector: "app-forms-toggle-switch-help-key-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-toggle-switch\n data-sky-id=\"toggle-switch\"\n formControlName=\"registration\"\n helpKey=\"registration-help\"\n labelText=\"Open for registration\"\n />\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyToggleSwitchModule }, { kind: "component", type: i2.λ19, selector: "sky-toggle-switch", inputs: ["ariaLabel", "checked", "disabled", "helpPopoverContent", "helpPopoverTitle", "tabIndex", "labelText", "labelHidden", "helpKey"], outputs: ["toggleChange"] }] }); }
7597
7595
  }
7598
7596
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsToggleSwitchHelpKeyExampleComponent, decorators: [{
7599
7597
  type: Component,
7600
- args: [{ selector: 'app-forms-toggle-switch-help-key-example', imports: [FormsModule, ReactiveFormsModule, SkyToggleSwitchModule], template: "<form [formGroup]=\"formGroup\">\n <sky-toggle-switch\n formControlName=\"registration\"\n helpKey=\"registration-help\"\n labelText=\"Open for registration\"\n />\n</form>\n" }]
7598
+ args: [{ selector: 'app-forms-toggle-switch-help-key-example', imports: [FormsModule, ReactiveFormsModule, SkyToggleSwitchModule], template: "<form [formGroup]=\"formGroup\">\n <sky-toggle-switch\n data-sky-id=\"toggle-switch\"\n formControlName=\"registration\"\n helpKey=\"registration-help\"\n labelText=\"Open for registration\"\n />\n</form>\n" }]
7601
7599
  }], ctorParameters: () => [] });
7602
7600
 
7603
7601
  /**
@@ -11157,7 +11155,7 @@ class ModalsModalBasicWithControllerExampleComponent {
11157
11155
  useValue: { value1: 'Hello!' },
11158
11156
  },
11159
11157
  // NOTE: The help service is normally provided at the application root, but
11160
- // it is added here purely for examplenstration purposes.
11158
+ // it is added here purely for demonstration purposes.
11161
11159
  // See: https://developer.blackbaud.com/skyux/learn/develop/global-help
11162
11160
  {
11163
11161
  provide: SkyHelpService,
@@ -13457,11 +13455,11 @@ class TabsDynamicExampleComponent {
13457
13455
  ];
13458
13456
  }
13459
13457
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsDynamicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
13460
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TabsDynamicExampleComponent, isStandalone: true, selector: "app-tabs-dynamic-example", ngImport: i0, template: "<sky-tabset ariaLabel=\"Tab examplenstration\">\n @for (tab of tabArray; track tab) {\n <sky-tab [tabHeading]=\"tab.tabHeading\">\n {{ tab.tabContent }}\n </sky-tab>\n }\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
13458
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TabsDynamicExampleComponent, isStandalone: true, selector: "app-tabs-dynamic-example", ngImport: i0, template: "<sky-tabset ariaLabel=\"Tab demonstration\" data-sky-id=\"tab-demo\">\n @for (tab of tabArray; track tab) {\n <sky-tab [tabHeading]=\"tab.tabHeading\">\n {{ tab.tabContent }}\n </sky-tab>\n }\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
13461
13459
  }
13462
13460
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsDynamicExampleComponent, decorators: [{
13463
13461
  type: Component,
13464
- args: [{ selector: 'app-tabs-dynamic-example', imports: [SkyTabsModule], template: "<sky-tabset ariaLabel=\"Tab examplenstration\">\n @for (tab of tabArray; track tab) {\n <sky-tab [tabHeading]=\"tab.tabHeading\">\n {{ tab.tabContent }}\n </sky-tab>\n }\n</sky-tabset>\n" }]
13462
+ args: [{ selector: 'app-tabs-dynamic-example', imports: [SkyTabsModule], template: "<sky-tabset ariaLabel=\"Tab demonstration\" data-sky-id=\"tab-demo\">\n @for (tab of tabArray; track tab) {\n <sky-tab [tabHeading]=\"tab.tabHeading\">\n {{ tab.tabContent }}\n </sky-tab>\n }\n</sky-tabset>\n" }]
13465
13463
  }] });
13466
13464
 
13467
13465
  /**
@@ -13469,11 +13467,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
13469
13467
  */
13470
13468
  class TabsStaticExampleComponent {
13471
13469
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsStaticExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
13472
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: TabsStaticExampleComponent, isStandalone: true, selector: "app-tabs-static-example", ngImport: i0, template: "<sky-tabset ariaLabel=\"Tab examplenstration\">\n <sky-tab [tabHeading]=\"'Tab 1'\"> Content for Tab 1 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 2'\"> Content for Tab 2 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 3'\"> Content for Tab 3 </sky-tab>\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
13470
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: TabsStaticExampleComponent, isStandalone: true, selector: "app-tabs-static-example", ngImport: i0, template: "<sky-tabset ariaLabel=\"Tab demonstration\" data-sky-id=\"tab-demo\">\n <sky-tab [tabHeading]=\"'Tab 1'\"> Content for Tab 1 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 2'\"> Content for Tab 2 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 3'\"> Content for Tab 3 </sky-tab>\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
13473
13471
  }
13474
13472
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsStaticExampleComponent, decorators: [{
13475
13473
  type: Component,
13476
- args: [{ selector: 'app-tabs-static-example', imports: [SkyTabsModule], template: "<sky-tabset ariaLabel=\"Tab examplenstration\">\n <sky-tab [tabHeading]=\"'Tab 1'\"> Content for Tab 1 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 2'\"> Content for Tab 2 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 3'\"> Content for Tab 3 </sky-tab>\n</sky-tabset>\n" }]
13474
+ args: [{ selector: 'app-tabs-static-example', imports: [SkyTabsModule], template: "<sky-tabset ariaLabel=\"Tab demonstration\" data-sky-id=\"tab-demo\">\n <sky-tab [tabHeading]=\"'Tab 1'\"> Content for Tab 1 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 2'\"> Content for Tab 2 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 3'\"> Content for Tab 3 </sky-tab>\n</sky-tabset>\n" }]
13477
13475
  }] });
13478
13476
 
13479
13477
  /**
@@ -13487,11 +13485,11 @@ class TabsStaticAddCloseExampleComponent {
13487
13485
  alert('Add tab clicked!');
13488
13486
  }
13489
13487
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsStaticAddCloseExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
13490
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TabsStaticAddCloseExampleComponent, isStandalone: true, selector: "app-tabs-static-add-close-example", ngImport: i0, template: "<sky-tabset ariaLabel=\"Tab examplenstration\" (newTab)=\"onNewTabClick()\">\n <sky-tab [tabHeading]=\"'Tab 1'\"> Content for Tab 1 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 2'\"> Content for Tab 2 </sky-tab>\n @if (showTab3) {\n <sky-tab [tabHeading]=\"'Tab 3'\" (close)=\"showTab3 = false\">\n Content for Tab 3\n </sky-tab>\n }\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
13488
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TabsStaticAddCloseExampleComponent, isStandalone: true, selector: "app-tabs-static-add-close-example", ngImport: i0, template: "<sky-tabset\n data-sky-id=\"tab-demo\"\n ariaLabel=\"Tab demonstration\"\n (newTab)=\"onNewTabClick()\"\n>\n <sky-tab [tabHeading]=\"'Tab 1'\"> Content for Tab 1 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 2'\"> Content for Tab 2 </sky-tab>\n @if (showTab3) {\n <sky-tab [tabHeading]=\"'Tab 3'\" (close)=\"showTab3 = false\">\n Content for Tab 3\n </sky-tab>\n }\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
13491
13489
  }
13492
13490
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsStaticAddCloseExampleComponent, decorators: [{
13493
13491
  type: Component,
13494
- args: [{ selector: 'app-tabs-static-add-close-example', imports: [SkyTabsModule], template: "<sky-tabset ariaLabel=\"Tab examplenstration\" (newTab)=\"onNewTabClick()\">\n <sky-tab [tabHeading]=\"'Tab 1'\"> Content for Tab 1 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 2'\"> Content for Tab 2 </sky-tab>\n @if (showTab3) {\n <sky-tab [tabHeading]=\"'Tab 3'\" (close)=\"showTab3 = false\">\n Content for Tab 3\n </sky-tab>\n }\n</sky-tabset>\n" }]
13492
+ args: [{ selector: 'app-tabs-static-add-close-example', imports: [SkyTabsModule], template: "<sky-tabset\n data-sky-id=\"tab-demo\"\n ariaLabel=\"Tab demonstration\"\n (newTab)=\"onNewTabClick()\"\n>\n <sky-tab [tabHeading]=\"'Tab 1'\"> Content for Tab 1 </sky-tab>\n <sky-tab [tabHeading]=\"'Tab 2'\"> Content for Tab 2 </sky-tab>\n @if (showTab3) {\n <sky-tab [tabHeading]=\"'Tab 3'\" (close)=\"showTab3 = false\">\n Content for Tab 3\n </sky-tab>\n }\n</sky-tabset>\n" }]
13495
13493
  }] });
13496
13494
 
13497
13495
  /**
@@ -13527,11 +13525,11 @@ class TabsDynamicAddCloseExampleComponent {
13527
13525
  this.tabArray.splice(arrayIndex, 1);
13528
13526
  }
13529
13527
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsDynamicAddCloseExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
13530
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TabsDynamicAddCloseExampleComponent, isStandalone: true, selector: "app-tabs-dynamic-add-close-example", ngImport: i0, template: "<sky-tabset ariaLabel=\"Tab examplenstration\" (newTab)=\"onNewTabClick()\">\n @for (tab of tabArray; track tab; let i = $index) {\n <sky-tab [tabHeading]=\"tab.tabHeading\" (close)=\"onCloseClick(i)\">\n {{ tab.tabContent }}\n </sky-tab>\n }\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
13528
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TabsDynamicAddCloseExampleComponent, isStandalone: true, selector: "app-tabs-dynamic-add-close-example", ngImport: i0, template: "<sky-tabset\n ariaLabel=\"Tab demonstration\"\n data-sky-id=\"tab-demo\"\n (newTab)=\"onNewTabClick()\"\n>\n @for (tab of tabArray; track tab; let i = $index) {\n <sky-tab [tabHeading]=\"tab.tabHeading\" (close)=\"onCloseClick(i)\">\n {{ tab.tabContent }}\n </sky-tab>\n }\n</sky-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$9.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$9.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }] }); }
13531
13529
  }
13532
13530
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsDynamicAddCloseExampleComponent, decorators: [{
13533
13531
  type: Component,
13534
- args: [{ selector: 'app-tabs-dynamic-add-close-example', imports: [SkyTabsModule], template: "<sky-tabset ariaLabel=\"Tab examplenstration\" (newTab)=\"onNewTabClick()\">\n @for (tab of tabArray; track tab; let i = $index) {\n <sky-tab [tabHeading]=\"tab.tabHeading\" (close)=\"onCloseClick(i)\">\n {{ tab.tabContent }}\n </sky-tab>\n }\n</sky-tabset>\n" }]
13532
+ args: [{ selector: 'app-tabs-dynamic-add-close-example', imports: [SkyTabsModule], template: "<sky-tabset\n ariaLabel=\"Tab demonstration\"\n data-sky-id=\"tab-demo\"\n (newTab)=\"onNewTabClick()\"\n>\n @for (tab of tabArray; track tab; let i = $index) {\n <sky-tab [tabHeading]=\"tab.tabHeading\" (close)=\"onCloseClick(i)\">\n {{ tab.tabContent }}\n </sky-tab>\n }\n</sky-tabset>\n" }]
13535
13533
  }] });
13536
13534
 
13537
13535
  /**