@skyux/tabs 5.7.0 → 6.0.0-beta.1

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.
Files changed (107) hide show
  1. package/documentation.json +6 -6
  2. package/esm2020/index.mjs +23 -0
  3. package/esm2020/lib/modules/sectioned-form/sectioned-form-section.component.mjs +62 -0
  4. package/esm2020/lib/modules/sectioned-form/sectioned-form.component.mjs +109 -0
  5. package/esm2020/lib/modules/sectioned-form/sectioned-form.module.mjs +35 -0
  6. package/esm2020/lib/modules/sectioned-form/sectioned-form.service.mjs +35 -0
  7. package/esm2020/lib/modules/shared/sky-tabs-resources.module.mjs +52 -0
  8. package/esm2020/lib/modules/tabs/tab-button.component.mjs +70 -0
  9. package/esm2020/lib/modules/tabs/tab-index.mjs +2 -0
  10. package/esm2020/lib/modules/tabs/tab.component.mjs +131 -0
  11. package/esm2020/lib/modules/tabs/tabs.module.mjs +57 -0
  12. package/esm2020/lib/modules/tabs/tabset-active-tab-unregistered-args.mjs +2 -0
  13. package/esm2020/lib/modules/tabs/tabset-adapter.service.mjs +56 -0
  14. package/esm2020/lib/modules/tabs/tabset-buttons-display-mode.mjs +2 -0
  15. package/esm2020/lib/modules/tabs/tabset-nav-button.component.mjs +116 -0
  16. package/esm2020/lib/modules/tabs/tabset-permalink.service.mjs +126 -0
  17. package/esm2020/lib/modules/tabs/tabset-style.mjs +2 -0
  18. package/esm2020/lib/modules/tabs/tabset-tab-indexes-change.mjs +2 -0
  19. package/esm2020/lib/modules/tabs/tabset.component.mjs +396 -0
  20. package/esm2020/lib/modules/tabs/tabset.service.mjs +110 -0
  21. package/esm2020/lib/modules/vertical-tabset/vertical-tab-media-query.service.mjs +72 -0
  22. package/esm2020/lib/modules/vertical-tabset/vertical-tab.component.mjs +197 -0
  23. package/esm2020/lib/modules/vertical-tabset/vertical-tabset-adapter.service.mjs +48 -0
  24. package/esm2020/lib/modules/vertical-tabset/vertical-tabset-group.component.mjs +83 -0
  25. package/esm2020/lib/modules/vertical-tabset/vertical-tabset.component.mjs +150 -0
  26. package/esm2020/lib/modules/vertical-tabset/vertical-tabset.module.mjs +60 -0
  27. package/esm2020/lib/modules/vertical-tabset/vertical-tabset.service.mjs +168 -0
  28. package/esm2020/skyux-tabs.mjs +5 -0
  29. package/esm2020/testing/public-api.mjs +3 -0
  30. package/esm2020/testing/skyux-tabs-testing.mjs +5 -0
  31. package/esm2020/testing/tabs/tab-fixture-tab.mjs +2 -0
  32. package/esm2020/testing/tabs/tabset-fixture.mjs +130 -0
  33. package/fesm2015/{skyux-tabs-testing.js → skyux-tabs-testing.mjs} +1 -1
  34. package/fesm2015/skyux-tabs-testing.mjs.map +1 -0
  35. package/fesm2015/{skyux-tabs.js → skyux-tabs.mjs} +187 -236
  36. package/fesm2015/skyux-tabs.mjs.map +1 -0
  37. package/{esm2015/testing/tabs/tabset-fixture.js → fesm2020/skyux-tabs-testing.mjs} +39 -43
  38. package/fesm2020/skyux-tabs-testing.mjs.map +1 -0
  39. package/fesm2020/skyux-tabs.mjs +2005 -0
  40. package/fesm2020/skyux-tabs.mjs.map +1 -0
  41. package/package.json +40 -19
  42. package/testing/package.json +5 -5
  43. package/bundles/skyux-tabs-testing.umd.js +0 -498
  44. package/bundles/skyux-tabs.umd.js +0 -2258
  45. package/esm2015/index.js +0 -23
  46. package/esm2015/index.js.map +0 -1
  47. package/esm2015/lib/modules/sectioned-form/sectioned-form-section.component.js +0 -67
  48. package/esm2015/lib/modules/sectioned-form/sectioned-form-section.component.js.map +0 -1
  49. package/esm2015/lib/modules/sectioned-form/sectioned-form.component.js +0 -116
  50. package/esm2015/lib/modules/sectioned-form/sectioned-form.component.js.map +0 -1
  51. package/esm2015/lib/modules/sectioned-form/sectioned-form.module.js +0 -35
  52. package/esm2015/lib/modules/sectioned-form/sectioned-form.module.js.map +0 -1
  53. package/esm2015/lib/modules/sectioned-form/sectioned-form.service.js +0 -35
  54. package/esm2015/lib/modules/sectioned-form/sectioned-form.service.js.map +0 -1
  55. package/esm2015/lib/modules/shared/sky-tabs-resources.module.js +0 -52
  56. package/esm2015/lib/modules/shared/sky-tabs-resources.module.js.map +0 -1
  57. package/esm2015/lib/modules/tabs/tab-button.component.js +0 -76
  58. package/esm2015/lib/modules/tabs/tab-button.component.js.map +0 -1
  59. package/esm2015/lib/modules/tabs/tab-index.js +0 -2
  60. package/esm2015/lib/modules/tabs/tab-index.js.map +0 -1
  61. package/esm2015/lib/modules/tabs/tab.component.js +0 -135
  62. package/esm2015/lib/modules/tabs/tab.component.js.map +0 -1
  63. package/esm2015/lib/modules/tabs/tabs.module.js +0 -57
  64. package/esm2015/lib/modules/tabs/tabs.module.js.map +0 -1
  65. package/esm2015/lib/modules/tabs/tabset-active-tab-unregistered-args.js +0 -2
  66. package/esm2015/lib/modules/tabs/tabset-active-tab-unregistered-args.js.map +0 -1
  67. package/esm2015/lib/modules/tabs/tabset-adapter.service.js +0 -56
  68. package/esm2015/lib/modules/tabs/tabset-adapter.service.js.map +0 -1
  69. package/esm2015/lib/modules/tabs/tabset-buttons-display-mode.js +0 -2
  70. package/esm2015/lib/modules/tabs/tabset-buttons-display-mode.js.map +0 -1
  71. package/esm2015/lib/modules/tabs/tabset-nav-button.component.js +0 -119
  72. package/esm2015/lib/modules/tabs/tabset-nav-button.component.js.map +0 -1
  73. package/esm2015/lib/modules/tabs/tabset-permalink.service.js +0 -126
  74. package/esm2015/lib/modules/tabs/tabset-permalink.service.js.map +0 -1
  75. package/esm2015/lib/modules/tabs/tabset-style.js +0 -2
  76. package/esm2015/lib/modules/tabs/tabset-style.js.map +0 -1
  77. package/esm2015/lib/modules/tabs/tabset-tab-indexes-change.js +0 -2
  78. package/esm2015/lib/modules/tabs/tabset-tab-indexes-change.js.map +0 -1
  79. package/esm2015/lib/modules/tabs/tabset.component.js +0 -405
  80. package/esm2015/lib/modules/tabs/tabset.component.js.map +0 -1
  81. package/esm2015/lib/modules/tabs/tabset.service.js +0 -110
  82. package/esm2015/lib/modules/tabs/tabset.service.js.map +0 -1
  83. package/esm2015/lib/modules/vertical-tabset/vertical-tab-media-query.service.js +0 -72
  84. package/esm2015/lib/modules/vertical-tabset/vertical-tab-media-query.service.js.map +0 -1
  85. package/esm2015/lib/modules/vertical-tabset/vertical-tab.component.js +0 -203
  86. package/esm2015/lib/modules/vertical-tabset/vertical-tab.component.js.map +0 -1
  87. package/esm2015/lib/modules/vertical-tabset/vertical-tabset-adapter.service.js +0 -48
  88. package/esm2015/lib/modules/vertical-tabset/vertical-tabset-adapter.service.js.map +0 -1
  89. package/esm2015/lib/modules/vertical-tabset/vertical-tabset-group.component.js +0 -89
  90. package/esm2015/lib/modules/vertical-tabset/vertical-tabset-group.component.js.map +0 -1
  91. package/esm2015/lib/modules/vertical-tabset/vertical-tabset.component.js +0 -157
  92. package/esm2015/lib/modules/vertical-tabset/vertical-tabset.component.js.map +0 -1
  93. package/esm2015/lib/modules/vertical-tabset/vertical-tabset.module.js +0 -60
  94. package/esm2015/lib/modules/vertical-tabset/vertical-tabset.module.js.map +0 -1
  95. package/esm2015/lib/modules/vertical-tabset/vertical-tabset.service.js +0 -170
  96. package/esm2015/lib/modules/vertical-tabset/vertical-tabset.service.js.map +0 -1
  97. package/esm2015/skyux-tabs.js +0 -5
  98. package/esm2015/skyux-tabs.js.map +0 -1
  99. package/esm2015/testing/public-api.js +0 -3
  100. package/esm2015/testing/public-api.js.map +0 -1
  101. package/esm2015/testing/skyux-tabs-testing.js +0 -5
  102. package/esm2015/testing/skyux-tabs-testing.js.map +0 -1
  103. package/esm2015/testing/tabs/tab-fixture-tab.js +0 -2
  104. package/esm2015/testing/tabs/tab-fixture-tab.js.map +0 -1
  105. package/esm2015/testing/tabs/tabset-fixture.js.map +0 -1
  106. package/fesm2015/skyux-tabs-testing.js.map +0 -1
  107. package/fesm2015/skyux-tabs.js.map +0 -1
package/esm2015/index.js DELETED
@@ -1,23 +0,0 @@
1
- export * from './lib/modules/sectioned-form/sectioned-form.module';
2
- export * from './lib/modules/sectioned-form/sectioned-form.service';
3
- export * from './lib/modules/tabs/tab-index';
4
- export * from './lib/modules/tabs/tabset-buttons-display-mode';
5
- export * from './lib/modules/tabs/tabset-style';
6
- export * from './lib/modules/tabs/tabset-tab-indexes-change';
7
- export * from './lib/modules/tabs/tabs.module';
8
- export * from './lib/modules/vertical-tabset/vertical-tabset.module';
9
- // The following export is needed because our docs use it as a prescribed pattern.
10
- // Ideally, this functionality would live in a standard `Input` or `Output`.
11
- // https://developer.blackbaud.com/skyux/components/sectioned-form#code
12
- // TODO: Try to remove in a major release.
13
- export * from './lib/modules/sectioned-form/sectioned-form.component';
14
- // Components and directives must be exported to support Angular's "partial" Ivy compiler.
15
- // Obscure names are used to indicate types are not part of public API.
16
- export { SkyTabComponent as λ1 } from './lib/modules/tabs/tab.component';
17
- export { SkyTabsetComponent as λ2 } from './lib/modules/tabs/tabset.component';
18
- export { SkyTabsetNavButtonComponent as λ3 } from './lib/modules/tabs/tabset-nav-button.component';
19
- export { SkyVerticalTabComponent as λ4 } from './lib/modules/vertical-tabset/vertical-tab.component';
20
- export { SkySectionedFormSectionComponent as λ5 } from './lib/modules/sectioned-form/sectioned-form-section.component';
21
- export { SkyVerticalTabsetComponent as λ6 } from './lib/modules/vertical-tabset/vertical-tabset.component';
22
- export { SkyVerticalTabsetGroupComponent as λ7 } from './lib/modules/vertical-tabset/vertical-tabset-group.component';
23
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/components/tabs/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,oDAAoD,CAAC;AACnE,cAAc,qDAAqD,CAAC;AAEpE,cAAc,8BAA8B,CAAC;AAC7C,cAAc,gDAAgD,CAAC;AAC/D,cAAc,iCAAiC,CAAC;AAChD,cAAc,8CAA8C,CAAC;AAC7D,cAAc,gCAAgC,CAAC;AAE/C,cAAc,sDAAsD,CAAC;AAErE,kFAAkF;AAClF,4EAA4E;AAC5E,uEAAuE;AACvE,0CAA0C;AAC1C,cAAc,uDAAuD,CAAC;AAEtE,0FAA0F;AAC1F,uEAAuE;AACvE,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,MAAM,kCAAkC,CAAC;AACzE,OAAO,EAAE,kBAAkB,IAAI,EAAE,EAAE,MAAM,qCAAqC,CAAC;AAC/E,OAAO,EAAE,2BAA2B,IAAI,EAAE,EAAE,MAAM,gDAAgD,CAAC;AACnG,OAAO,EAAE,uBAAuB,IAAI,EAAE,EAAE,MAAM,sDAAsD,CAAC;AACrG,OAAO,EAAE,gCAAgC,IAAI,EAAE,EAAE,MAAM,+DAA+D,CAAC;AACvH,OAAO,EAAE,0BAA0B,IAAI,EAAE,EAAE,MAAM,yDAAyD,CAAC;AAC3G,OAAO,EAAE,+BAA+B,IAAI,EAAE,EAAE,MAAM,+DAA+D,CAAC","sourcesContent":["export * from './lib/modules/sectioned-form/sectioned-form.module';\nexport * from './lib/modules/sectioned-form/sectioned-form.service';\n\nexport * from './lib/modules/tabs/tab-index';\nexport * from './lib/modules/tabs/tabset-buttons-display-mode';\nexport * from './lib/modules/tabs/tabset-style';\nexport * from './lib/modules/tabs/tabset-tab-indexes-change';\nexport * from './lib/modules/tabs/tabs.module';\n\nexport * from './lib/modules/vertical-tabset/vertical-tabset.module';\n\n// The following export is needed because our docs use it as a prescribed pattern.\n// Ideally, this functionality would live in a standard `Input` or `Output`.\n// https://developer.blackbaud.com/skyux/components/sectioned-form#code\n// TODO: Try to remove in a major release.\nexport * from './lib/modules/sectioned-form/sectioned-form.component';\n\n// Components and directives must be exported to support Angular's \"partial\" Ivy compiler.\n// Obscure names are used to indicate types are not part of public API.\nexport { SkyTabComponent as λ1 } from './lib/modules/tabs/tab.component';\nexport { SkyTabsetComponent as λ2 } from './lib/modules/tabs/tabset.component';\nexport { SkyTabsetNavButtonComponent as λ3 } from './lib/modules/tabs/tabset-nav-button.component';\nexport { SkyVerticalTabComponent as λ4 } from './lib/modules/vertical-tabset/vertical-tab.component';\nexport { SkySectionedFormSectionComponent as λ5 } from './lib/modules/sectioned-form/sectioned-form-section.component';\nexport { SkyVerticalTabsetComponent as λ6 } from './lib/modules/vertical-tabset/vertical-tabset.component';\nexport { SkyVerticalTabsetGroupComponent as λ7 } from './lib/modules/vertical-tabset/vertical-tabset-group.component';\n"]}
@@ -1,67 +0,0 @@
1
- import { ChangeDetectorRef, Component, Input, ViewChild, } from '@angular/core';
2
- import { Subject } from 'rxjs';
3
- import { takeUntil } from 'rxjs/operators';
4
- import { SkyVerticalTabsetService } from '../vertical-tabset/vertical-tabset.service';
5
- import { SkyVerticalTabComponent } from './../vertical-tabset/vertical-tab.component';
6
- import { SkySectionedFormService } from './sectioned-form.service';
7
- import * as i0 from "@angular/core";
8
- import * as i1 from "./sectioned-form.service";
9
- import * as i2 from "../vertical-tabset/vertical-tabset.service";
10
- import * as i3 from "../vertical-tabset/vertical-tab.component";
11
- import * as i4 from "@angular/common";
12
- let nextId = 0;
13
- /**
14
- * Creates an individual form to display as a section within the sectioned form.
15
- */
16
- export class SkySectionedFormSectionComponent {
17
- constructor(sectionedFormService, tabsetService, changeRef) {
18
- this.sectionedFormService = sectionedFormService;
19
- this.tabsetService = tabsetService;
20
- this.changeRef = changeRef;
21
- this.sectionTabId = `sky-sectioned-form-tab-${++nextId}`;
22
- this.sectionContentId = `sky-sectioned-form-section-${++nextId}`;
23
- /**
24
- * Indicates whether the section is active when the form loads.
25
- * @default false
26
- */
27
- this.active = false;
28
- this._ngUnsubscribe = new Subject();
29
- }
30
- ngOnInit() {
31
- this.changeRef.detectChanges();
32
- this.tabsetService.switchingMobile.subscribe((mobile) => {
33
- this.changeRef.detectChanges();
34
- });
35
- this.sectionedFormService.requiredChange
36
- .pipe(takeUntil(this._ngUnsubscribe))
37
- .subscribe((required) => (this.fieldRequired = required));
38
- this.sectionedFormService.invalidChange
39
- .pipe(takeUntil(this._ngUnsubscribe))
40
- .subscribe((invalid) => (this.fieldInvalid = invalid));
41
- }
42
- ngOnDestroy() {
43
- this._ngUnsubscribe.next();
44
- this._ngUnsubscribe.complete();
45
- }
46
- }
47
- SkySectionedFormSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormSectionComponent, deps: [{ token: i1.SkySectionedFormService }, { token: i2.SkyVerticalTabsetService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
48
- SkySectionedFormSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkySectionedFormSectionComponent, selector: "sky-sectioned-form-section", inputs: { heading: "heading", itemCount: "itemCount", active: "active" }, providers: [SkySectionedFormService], viewQueries: [{ propertyName: "tab", first: true, predicate: SkyVerticalTabComponent, descendants: true }], ngImport: i0, template: "<sky-vertical-tab\n [active]=\"active\"\n [errorIndicator]=\"fieldInvalid\"\n [ngClass]=\"{\n 'sky-tab-field-required': fieldRequired\n }\"\n [showTabRightArrow]=\"true\"\n [tabHeaderCount]=\"itemCount\"\n [tabHeading]=\"heading\"\n [tabId]=\"sectionTabId\"\n>\n <ng-content></ng-content>\n</sky-vertical-tab>\n", styles: [":host .sky-tab-field-required ::ng-deep .sky-vertical-tab-heading:after{content:\"*\";color:#ef4044;padding-left:5px}\n"], components: [{ type: i3.SkyVerticalTabComponent, selector: "sky-vertical-tab", inputs: ["active", "ariaControls", "ariaRole", "disabled", "errorIndicator", "tabHeaderCount", "tabHeading", "showTabRightArrow", "tabId"] }], directives: [{ type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
49
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormSectionComponent, decorators: [{
50
- type: Component,
51
- args: [{
52
- selector: 'sky-sectioned-form-section',
53
- templateUrl: './sectioned-form-section.component.html',
54
- providers: [SkySectionedFormService],
55
- styleUrls: ['./sectioned-form-section.component.scss'],
56
- }]
57
- }], ctorParameters: function () { return [{ type: i1.SkySectionedFormService }, { type: i2.SkyVerticalTabsetService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { heading: [{
58
- type: Input
59
- }], itemCount: [{
60
- type: Input
61
- }], active: [{
62
- type: Input
63
- }], tab: [{
64
- type: ViewChild,
65
- args: [SkyVerticalTabComponent]
66
- }] } });
67
- //# sourceMappingURL=sectioned-form-section.component.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sectioned-form-section.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/tabs/src/lib/modules/sectioned-form/sectioned-form-section.component.ts","../../../../../../../../libs/components/tabs/src/lib/modules/sectioned-form/sectioned-form-section.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,SAAS,EACT,KAAK,EAGL,SAAS,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,OAAO,EAAE,wBAAwB,EAAE,MAAM,4CAA4C,CAAC;AAEtF,OAAO,EAAE,uBAAuB,EAAE,MAAM,6CAA6C,CAAC;AACtF,OAAO,EAAE,uBAAuB,EAAE,MAAM,0BAA0B,CAAC;;;;;;AAEnE,IAAI,MAAM,GAAG,CAAC,CAAC;AAEf;;GAEG;AAOH,MAAM,OAAO,gCAAgC;IAiC3C,YACU,oBAA6C,EAC7C,aAAuC,EACvC,SAA4B;QAF5B,yBAAoB,GAApB,oBAAoB,CAAyB;QAC7C,kBAAa,GAAb,aAAa,CAA0B;QACvC,cAAS,GAAT,SAAS,CAAmB;QAnC/B,iBAAY,GAAG,0BAA0B,EAAE,MAAM,EAAE,CAAC;QACpD,qBAAgB,GAAG,8BAA8B,EAAE,MAAM,EAAE,CAAC;QAgBnE;;;WAGG;QAEI,WAAM,GAAG,KAAK,CAAC;QAQd,mBAAc,GAAG,IAAI,OAAO,EAAE,CAAC;IAMpC,CAAC;IAEG,QAAQ;QACb,IAAI,CAAC,SAAS,CAAC,aAAa,EAAE,CAAC;QAE/B,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,MAAe,EAAE,EAAE;YAC/D,IAAI,CAAC,SAAS,CAAC,aAAa,EAAE,CAAC;QACjC,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,oBAAoB,CAAC,cAAc;aACrC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;aACpC,SAAS,CAAC,CAAC,QAAiB,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC;QAErE,IAAI,CAAC,oBAAoB,CAAC,aAAa;aACpC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;aACpC,SAAS,CAAC,CAAC,OAAgB,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,CAAC,CAAC;IACpE,CAAC;IAEM,WAAW;QAChB,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;QAC3B,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC;;8HA1DU,gCAAgC;kHAAhC,gCAAgC,+HAHhC,CAAC,uBAAuB,CAAC,+DA+BzB,uBAAuB,gDCxDpC,qUAaA;4FDea,gCAAgC;kBAN5C,SAAS;mBAAC;oBACT,QAAQ,EAAE,4BAA4B;oBACtC,WAAW,EAAE,yCAAyC;oBACtD,SAAS,EAAE,CAAC,uBAAuB,CAAC;oBACpC,SAAS,EAAE,CAAC,yCAAyC,CAAC;iBACvD;qLAUQ,OAAO;sBADb,KAAK;gBAQC,SAAS;sBADf,KAAK;gBAQC,MAAM;sBADZ,KAAK;gBAOC,GAAG;sBADT,SAAS;uBAAC,uBAAuB","sourcesContent":["import {\n ChangeDetectorRef,\n Component,\n Input,\n OnDestroy,\n OnInit,\n ViewChild,\n} from '@angular/core';\n\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { SkyVerticalTabsetService } from '../vertical-tabset/vertical-tabset.service';\n\nimport { SkyVerticalTabComponent } from './../vertical-tabset/vertical-tab.component';\nimport { SkySectionedFormService } from './sectioned-form.service';\n\nlet nextId = 0;\n\n/**\n * Creates an individual form to display as a section within the sectioned form.\n */\n@Component({\n selector: 'sky-sectioned-form-section',\n templateUrl: './sectioned-form-section.component.html',\n providers: [SkySectionedFormService],\n styleUrls: ['./sectioned-form-section.component.scss'],\n})\nexport class SkySectionedFormSectionComponent implements OnInit, OnDestroy {\n public sectionTabId = `sky-sectioned-form-tab-${++nextId}`;\n public sectionContentId = `sky-sectioned-form-section-${++nextId}`;\n\n /**\n * Specifies the section header.\n * @required\n */\n @Input()\n public heading: string;\n\n /**\n * Indicates the number of items within the section and displays a\n * counter alongside the section header.\n */\n @Input()\n public itemCount: number;\n\n /**\n * Indicates whether the section is active when the form loads.\n * @default false\n */\n @Input()\n public active = false;\n\n public fieldRequired: boolean;\n public fieldInvalid: boolean;\n\n @ViewChild(SkyVerticalTabComponent)\n public tab: SkyVerticalTabComponent;\n\n private _ngUnsubscribe = new Subject();\n\n constructor(\n private sectionedFormService: SkySectionedFormService,\n private tabsetService: SkyVerticalTabsetService,\n private changeRef: ChangeDetectorRef\n ) {}\n\n public ngOnInit() {\n this.changeRef.detectChanges();\n\n this.tabsetService.switchingMobile.subscribe((mobile: boolean) => {\n this.changeRef.detectChanges();\n });\n\n this.sectionedFormService.requiredChange\n .pipe(takeUntil(this._ngUnsubscribe))\n .subscribe((required: boolean) => (this.fieldRequired = required));\n\n this.sectionedFormService.invalidChange\n .pipe(takeUntil(this._ngUnsubscribe))\n .subscribe((invalid: boolean) => (this.fieldInvalid = invalid));\n }\n\n public ngOnDestroy() {\n this._ngUnsubscribe.next();\n this._ngUnsubscribe.complete();\n }\n}\n","<sky-vertical-tab\n [active]=\"active\"\n [errorIndicator]=\"fieldInvalid\"\n [ngClass]=\"{\n 'sky-tab-field-required': fieldRequired\n }\"\n [showTabRightArrow]=\"true\"\n [tabHeaderCount]=\"itemCount\"\n [tabHeading]=\"heading\"\n [tabId]=\"sectionTabId\"\n>\n <ng-content></ng-content>\n</sky-vertical-tab>\n"]}
@@ -1,116 +0,0 @@
1
- import { animate, style, transition, trigger } from '@angular/animations';
2
- import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, Output, ViewChild, } from '@angular/core';
3
- import { Subject } from 'rxjs';
4
- import { takeUntil } from 'rxjs/operators';
5
- import { HIDDEN_STATE, SkyVerticalTabsetService, VISIBLE_STATE, } from './../vertical-tabset/vertical-tabset.service';
6
- import * as i0 from "@angular/core";
7
- import * as i1 from "./../vertical-tabset/vertical-tabset.service";
8
- import * as i2 from "@angular/common";
9
- /**
10
- * Creates a container for the sectioned forms.
11
- */
12
- export class SkySectionedFormComponent {
13
- constructor(tabService, changeRef) {
14
- this.tabService = tabService;
15
- this.changeRef = changeRef;
16
- /**
17
- * Indicates whether the sectioned form loads section content during initialization so that it
18
- * displays content without moving around elements in the content container.
19
- * @default false
20
- */
21
- this.maintainSectionContent = false;
22
- /**
23
- * Fires when the active tab changes and emits the index of the active
24
- * section. The index is based on the section's position when the form loads.
25
- */
26
- this.indexChanged = new EventEmitter();
27
- this.isMobile = false;
28
- this._ngUnsubscribe = new Subject();
29
- }
30
- get ariaRole() {
31
- return this.isMobile ? undefined : 'tablist';
32
- }
33
- ngOnInit() {
34
- this.tabService.maintainTabContent = this.maintainSectionContent;
35
- this.tabService.indexChanged
36
- .pipe(takeUntil(this._ngUnsubscribe))
37
- .subscribe((index) => {
38
- this.indexChanged.emit(index);
39
- this.changeRef.markForCheck();
40
- });
41
- this.tabService.switchingMobile
42
- .pipe(takeUntil(this._ngUnsubscribe))
43
- .subscribe((mobile) => {
44
- this.isMobile = mobile;
45
- this.changeRef.markForCheck();
46
- });
47
- if (this.tabService.isMobile()) {
48
- this.isMobile = true;
49
- this.tabService.animationContentVisibleState = VISIBLE_STATE;
50
- this.changeRef.markForCheck();
51
- }
52
- }
53
- ngAfterViewChecked() {
54
- this.tabService.content = this.content;
55
- this.tabService.updateContent();
56
- }
57
- ngOnDestroy() {
58
- this._ngUnsubscribe.next();
59
- this._ngUnsubscribe.complete();
60
- }
61
- tabsVisible() {
62
- this.changeRef.markForCheck();
63
- return this.tabService.tabsVisible();
64
- }
65
- showTabs() {
66
- this.tabService.showTabs();
67
- this.changeRef.markForCheck();
68
- }
69
- }
70
- SkySectionedFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormComponent, deps: [{ token: i1.SkyVerticalTabsetService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
71
- SkySectionedFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkySectionedFormComponent, selector: "sky-sectioned-form", inputs: { maintainSectionContent: "maintainSectionContent" }, outputs: { indexChanged: "indexChanged" }, providers: [SkyVerticalTabsetService], viewQueries: [{ propertyName: "content", first: true, predicate: ["skySectionSideContent"], descendants: true }], ngImport: i0, template: "<div\n aria-orientation=\"vertical\"\n class=\"sky-sectioned-form\"\n [attr.role]=\"ariaRole\"\n (window:resize)=\"tabService.updateContent()\"\n>\n <div\n *ngIf=\"maintainSectionContent || tabsVisible()\"\n class=\"sky-sectioned-form-tabs\"\n [ngClass]=\"{ 'sky-sectioned-form-tabs-hidden': !tabsVisible() }\"\n [@tabEnter]=\"tabService.animationTabsVisibleState\"\n >\n <ng-content></ng-content>\n </div>\n <div\n *ngIf=\"maintainSectionContent || tabService.contentVisible()\"\n class=\"sky-sectioned-form-content\"\n [ngClass]=\"{\n 'sky-sectioned-form-content-hidden': !tabService.contentVisible()\n }\"\n [@contentEnter]=\"tabService.animationContentVisibleState\"\n #skySectionSideContent\n ></div>\n</div>\n", styles: [":host .sky-sectioned-form{display:block;max-height:none}:host .sky-sectioned-form-content{flex-basis:auto;overflow-y:visible}:host .sky-sectioned-form-tabs{flex-basis:auto;overflow-y:visible;border-right:1px solid #e2e3e4}:host-context(.sky-responsive-container-xs) .sky-sectioned-form,:host-context(.sky-responsive-container-sm) .sky-sectioned-form,:host-context(.sky-responsive-container-md) .sky-sectioned-form,:host-context(.sky-responsive-container-lg) .sky-sectioned-form{display:block;max-height:none}:host-context(.sky-responsive-container-xs) .sky-sectioned-form-content,:host-context(.sky-responsive-container-sm) .sky-sectioned-form-content,:host-context(.sky-responsive-container-md) .sky-sectioned-form-content,:host-context(.sky-responsive-container-lg) .sky-sectioned-form-content{flex-basis:auto;overflow-y:visible}:host-context(.sky-responsive-container-xs) .sky-sectioned-form-tabs,:host-context(.sky-responsive-container-sm) .sky-sectioned-form-tabs,:host-context(.sky-responsive-container-md) .sky-sectioned-form-tabs,:host-context(.sky-responsive-container-lg) .sky-sectioned-form-tabs{flex-basis:auto;overflow-y:visible;border-right:1px solid #e2e3e4}@media (min-width: 768px){:host .sky-sectioned-form{display:flex;max-height:100%}:host .sky-sectioned-form-content{flex-basis:70%;margin:15px;overflow-y:auto}:host .sky-sectioned-form-tabs{flex-basis:30%;overflow-y:auto}}:host-context(.sky-responsive-container-sm) .sky-sectioned-form,:host-context(.sky-responsive-container-md) .sky-sectioned-form,:host-context(.sky-responsive-container-lg) .sky-sectioned-form{display:flex;max-height:100%}:host-context(.sky-responsive-container-sm) .sky-sectioned-form-content,:host-context(.sky-responsive-container-md) .sky-sectioned-form-content,:host-context(.sky-responsive-container-lg) .sky-sectioned-form-content{flex-basis:70%;margin:15px;overflow-y:auto}:host-context(.sky-responsive-container-sm) .sky-sectioned-form-tabs,:host-context(.sky-responsive-container-md) .sky-sectioned-form-tabs,:host-context(.sky-responsive-container-lg) .sky-sectioned-form-tabs{flex-basis:30%;overflow-y:auto}.sky-sectioned-form-tabs-hidden{display:none}.sky-sectioned-form-content-hidden{display:none}:host-context(.sky-theme-modern) .sky-sectioned-form-content{margin:15px}:host-context(.sky-theme-modern) .sky-sectioned-form-tabs{border-right:1px solid #d2d2d2}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-sectioned-form-content{margin:20px 30px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-sectioned-form-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-sectioned-form-content,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-sectioned-form-content{margin:20px 30px}.sky-theme-modern .sky-sectioned-form-content{margin:15px}.sky-theme-modern .sky-sectioned-form-tabs{border-right:1px solid #d2d2d2}@media (min-width: 768px){.sky-theme-modern :host .sky-sectioned-form-content{margin:20px 30px}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-sectioned-form-content,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-sectioned-form-content,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-sectioned-form-content{margin:20px 30px}\n"], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
72
- trigger('tabEnter', [
73
- transition(`${HIDDEN_STATE} => ${VISIBLE_STATE}`, [
74
- style({ transform: 'translate(-100%)' }),
75
- animate('150ms ease-in'),
76
- ]),
77
- ]),
78
- trigger('contentEnter', [
79
- transition(`${HIDDEN_STATE} => ${VISIBLE_STATE}`, [
80
- style({ transform: 'translate(100%)' }),
81
- animate('150ms ease-in'),
82
- ]),
83
- ]),
84
- ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
85
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormComponent, decorators: [{
86
- type: Component,
87
- args: [{
88
- selector: 'sky-sectioned-form',
89
- templateUrl: './sectioned-form.component.html',
90
- styleUrls: ['./sectioned-form.component.scss'],
91
- providers: [SkyVerticalTabsetService],
92
- changeDetection: ChangeDetectionStrategy.OnPush,
93
- animations: [
94
- trigger('tabEnter', [
95
- transition(`${HIDDEN_STATE} => ${VISIBLE_STATE}`, [
96
- style({ transform: 'translate(-100%)' }),
97
- animate('150ms ease-in'),
98
- ]),
99
- ]),
100
- trigger('contentEnter', [
101
- transition(`${HIDDEN_STATE} => ${VISIBLE_STATE}`, [
102
- style({ transform: 'translate(100%)' }),
103
- animate('150ms ease-in'),
104
- ]),
105
- ]),
106
- ],
107
- }]
108
- }], ctorParameters: function () { return [{ type: i1.SkyVerticalTabsetService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { maintainSectionContent: [{
109
- type: Input
110
- }], indexChanged: [{
111
- type: Output
112
- }], content: [{
113
- type: ViewChild,
114
- args: ['skySectionSideContent']
115
- }] } });
116
- //# sourceMappingURL=sectioned-form.component.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sectioned-form.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/tabs/src/lib/modules/sectioned-form/sectioned-form.component.ts","../../../../../../../../libs/components/tabs/src/lib/modules/sectioned-form/sectioned-form.component.html"],"names":[],"mappings":"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","sourcesContent":["import { animate, style, transition, trigger } from '@angular/animations';\nimport {\n AfterViewChecked,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ElementRef,\n EventEmitter,\n Input,\n OnDestroy,\n OnInit,\n Output,\n ViewChild,\n} from '@angular/core';\n\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport {\n HIDDEN_STATE,\n SkyVerticalTabsetService,\n VISIBLE_STATE,\n} from './../vertical-tabset/vertical-tabset.service';\n\n/**\n * Creates a container for the sectioned forms.\n */\n@Component({\n selector: 'sky-sectioned-form',\n templateUrl: './sectioned-form.component.html',\n styleUrls: ['./sectioned-form.component.scss'],\n providers: [SkyVerticalTabsetService],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('tabEnter', [\n transition(`${HIDDEN_STATE} => ${VISIBLE_STATE}`, [\n style({ transform: 'translate(-100%)' }),\n animate('150ms ease-in'),\n ]),\n ]),\n trigger('contentEnter', [\n transition(`${HIDDEN_STATE} => ${VISIBLE_STATE}`, [\n style({ transform: 'translate(100%)' }),\n animate('150ms ease-in'),\n ]),\n ]),\n ],\n})\nexport class SkySectionedFormComponent\n implements OnInit, OnDestroy, AfterViewChecked\n{\n /**\n * Indicates whether the sectioned form loads section content during initialization so that it\n * displays content without moving around elements in the content container.\n * @default false\n */\n @Input()\n public maintainSectionContent = false;\n\n /**\n * Fires when the active tab changes and emits the index of the active\n * section. The index is based on the section's position when the form loads.\n */\n @Output()\n public indexChanged: EventEmitter<number> = new EventEmitter();\n\n public get ariaRole(): string {\n return this.isMobile ? undefined : 'tablist';\n }\n\n @ViewChild('skySectionSideContent')\n public content: ElementRef;\n\n private isMobile = false;\n private _ngUnsubscribe = new Subject();\n\n constructor(\n public tabService: SkyVerticalTabsetService,\n private changeRef: ChangeDetectorRef\n ) {}\n\n public ngOnInit() {\n this.tabService.maintainTabContent = this.maintainSectionContent;\n\n this.tabService.indexChanged\n .pipe(takeUntil(this._ngUnsubscribe))\n .subscribe((index) => {\n this.indexChanged.emit(index);\n this.changeRef.markForCheck();\n });\n\n this.tabService.switchingMobile\n .pipe(takeUntil(this._ngUnsubscribe))\n .subscribe((mobile: boolean) => {\n this.isMobile = mobile;\n this.changeRef.markForCheck();\n });\n\n if (this.tabService.isMobile()) {\n this.isMobile = true;\n this.tabService.animationContentVisibleState = VISIBLE_STATE;\n this.changeRef.markForCheck();\n }\n }\n\n public ngAfterViewChecked() {\n this.tabService.content = this.content;\n this.tabService.updateContent();\n }\n\n public ngOnDestroy() {\n this._ngUnsubscribe.next();\n this._ngUnsubscribe.complete();\n }\n\n public tabsVisible() {\n this.changeRef.markForCheck();\n return this.tabService.tabsVisible();\n }\n\n public showTabs() {\n this.tabService.showTabs();\n this.changeRef.markForCheck();\n }\n}\n","<div\n aria-orientation=\"vertical\"\n class=\"sky-sectioned-form\"\n [attr.role]=\"ariaRole\"\n (window:resize)=\"tabService.updateContent()\"\n>\n <div\n *ngIf=\"maintainSectionContent || tabsVisible()\"\n class=\"sky-sectioned-form-tabs\"\n [ngClass]=\"{ 'sky-sectioned-form-tabs-hidden': !tabsVisible() }\"\n [@tabEnter]=\"tabService.animationTabsVisibleState\"\n >\n <ng-content></ng-content>\n </div>\n <div\n *ngIf=\"maintainSectionContent || tabService.contentVisible()\"\n class=\"sky-sectioned-form-content\"\n [ngClass]=\"{\n 'sky-sectioned-form-content-hidden': !tabService.contentVisible()\n }\"\n [@contentEnter]=\"tabService.animationContentVisibleState\"\n #skySectionSideContent\n ></div>\n</div>\n"]}
@@ -1,35 +0,0 @@
1
- import { CommonModule } from '@angular/common';
2
- import { NgModule } from '@angular/core';
3
- import { SkyCheckboxModule } from '@skyux/forms';
4
- import { SkyThemeModule } from '@skyux/theme';
5
- import { SkyVerticalTabsetModule } from '../vertical-tabset/vertical-tabset.module';
6
- import { SkySectionedFormSectionComponent } from './sectioned-form-section.component';
7
- import { SkySectionedFormComponent } from './sectioned-form.component';
8
- import * as i0 from "@angular/core";
9
- export class SkySectionedFormModule {
10
- }
11
- SkySectionedFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
12
- SkySectionedFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormModule, declarations: [SkySectionedFormComponent, SkySectionedFormSectionComponent], imports: [CommonModule,
13
- SkyCheckboxModule,
14
- SkyThemeModule,
15
- SkyVerticalTabsetModule], exports: [SkySectionedFormComponent, SkySectionedFormSectionComponent] });
16
- SkySectionedFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormModule, imports: [[
17
- CommonModule,
18
- SkyCheckboxModule,
19
- SkyThemeModule,
20
- SkyVerticalTabsetModule,
21
- ]] });
22
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormModule, decorators: [{
23
- type: NgModule,
24
- args: [{
25
- declarations: [SkySectionedFormComponent, SkySectionedFormSectionComponent],
26
- imports: [
27
- CommonModule,
28
- SkyCheckboxModule,
29
- SkyThemeModule,
30
- SkyVerticalTabsetModule,
31
- ],
32
- exports: [SkySectionedFormComponent, SkySectionedFormSectionComponent],
33
- }]
34
- }] });
35
- //# sourceMappingURL=sectioned-form.module.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sectioned-form.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/tabs/src/lib/modules/sectioned-form/sectioned-form.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,EAAE,uBAAuB,EAAE,MAAM,2CAA2C,CAAC;AAEpF,OAAO,EAAE,gCAAgC,EAAE,MAAM,oCAAoC,CAAC;AACtF,OAAO,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;;AAYvE,MAAM,OAAO,sBAAsB;;oHAAtB,sBAAsB;qHAAtB,sBAAsB,iBATlB,yBAAyB,EAAE,gCAAgC,aAExE,YAAY;QACZ,iBAAiB;QACjB,cAAc;QACd,uBAAuB,aAEf,yBAAyB,EAAE,gCAAgC;qHAE1D,sBAAsB,YARxB;YACP,YAAY;YACZ,iBAAiB;YACjB,cAAc;YACd,uBAAuB;SACxB;4FAGU,sBAAsB;kBAVlC,QAAQ;mBAAC;oBACR,YAAY,EAAE,CAAC,yBAAyB,EAAE,gCAAgC,CAAC;oBAC3E,OAAO,EAAE;wBACP,YAAY;wBACZ,iBAAiB;wBACjB,cAAc;wBACd,uBAAuB;qBACxB;oBACD,OAAO,EAAE,CAAC,yBAAyB,EAAE,gCAAgC,CAAC;iBACvE","sourcesContent":["import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyCheckboxModule } from '@skyux/forms';\nimport { SkyThemeModule } from '@skyux/theme';\n\nimport { SkyVerticalTabsetModule } from '../vertical-tabset/vertical-tabset.module';\n\nimport { SkySectionedFormSectionComponent } from './sectioned-form-section.component';\nimport { SkySectionedFormComponent } from './sectioned-form.component';\n\n@NgModule({\n declarations: [SkySectionedFormComponent, SkySectionedFormSectionComponent],\n imports: [\n CommonModule,\n SkyCheckboxModule,\n SkyThemeModule,\n SkyVerticalTabsetModule,\n ],\n exports: [SkySectionedFormComponent, SkySectionedFormSectionComponent],\n})\nexport class SkySectionedFormModule {}\n"]}
@@ -1,35 +0,0 @@
1
- import { Injectable } from '@angular/core';
2
- import { BehaviorSubject } from 'rxjs';
3
- import * as i0 from "@angular/core";
4
- export class SkySectionedFormService {
5
- constructor() {
6
- /**
7
- * @internal
8
- */
9
- this.invalidChange = new BehaviorSubject(undefined);
10
- /**
11
- * @internal
12
- */
13
- this.requiredChange = new BehaviorSubject(undefined);
14
- }
15
- /**
16
- * Sets the current section's invalid state based on the `isInvalid` parameter.
17
- * This method is used within a `sky-sectioned-form-section` element.
18
- */
19
- invalidFieldChanged(isInvalid) {
20
- this.invalidChange.next(isInvalid);
21
- }
22
- /**
23
- * Sets the current section's required state based on the `isRequired` parameter.
24
- * This method is used within a `sky-sectioned-form-section` element.
25
- */
26
- requiredFieldChanged(isRequired) {
27
- this.requiredChange.next(isRequired);
28
- }
29
- }
30
- SkySectionedFormService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
31
- SkySectionedFormService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormService });
32
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkySectionedFormService, decorators: [{
33
- type: Injectable
34
- }] });
35
- //# sourceMappingURL=sectioned-form.service.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sectioned-form.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/tabs/src/lib/modules/sectioned-form/sectioned-form.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,OAAO,EAAE,eAAe,EAAE,MAAM,MAAM,CAAC;;AAGvC,MAAM,OAAO,uBAAuB;IADpC;QAEE;;WAEG;QACI,kBAAa,GAA6B,IAAI,eAAe,CAClE,SAAS,CACV,CAAC;QACF;;WAEG;QACI,mBAAc,GAA6B,IAAI,eAAe,CACnE,SAAS,CACV,CAAC;KAiBH;IAfC;;;OAGG;IACI,mBAAmB,CAAC,SAAkB;QAC3C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACrC,CAAC;IAED;;;OAGG;IACI,oBAAoB,CAAC,UAAmB;QAC7C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACvC,CAAC;;qHA5BU,uBAAuB;yHAAvB,uBAAuB;4FAAvB,uBAAuB;kBADnC,UAAU","sourcesContent":["import { Injectable } from '@angular/core';\n\nimport { BehaviorSubject } from 'rxjs';\n\n@Injectable()\nexport class SkySectionedFormService {\n /**\n * @internal\n */\n public invalidChange: BehaviorSubject<boolean> = new BehaviorSubject(\n undefined\n );\n /**\n * @internal\n */\n public requiredChange: BehaviorSubject<boolean> = new BehaviorSubject(\n undefined\n );\n\n /**\n * Sets the current section's invalid state based on the `isInvalid` parameter.\n * This method is used within a `sky-sectioned-form-section` element.\n */\n public invalidFieldChanged(isInvalid: boolean): void {\n this.invalidChange.next(isInvalid);\n }\n\n /**\n * Sets the current section's required state based on the `isRequired` parameter.\n * This method is used within a `sky-sectioned-form-section` element.\n */\n public requiredFieldChanged(isRequired: boolean): void {\n this.requiredChange.next(isRequired);\n }\n}\n"]}
@@ -1,52 +0,0 @@
1
- /**
2
- * NOTICE: DO NOT MODIFY THIS FILE!
3
- * The contents of this file were automatically generated by
4
- * the 'ng generate @skyux/i18n:lib-resources-module lib/modules/shared/sky-tabs' schematic.
5
- * To update this file, simply rerun the command.
6
- */
7
- import { NgModule } from '@angular/core';
8
- import { SKY_LIB_RESOURCES_PROVIDERS, SkyI18nModule, getLibStringForLocale, } from '@skyux/i18n';
9
- import * as i0 from "@angular/core";
10
- const RESOURCES = {
11
- 'EN-US': {
12
- skyux_tab_add: { message: 'Add tab' },
13
- skyux_tab_close: { message: 'Close {0} tab' },
14
- skyux_tabs_navigator_next: { message: 'Next' },
15
- skyux_tabs_navigator_previous: { message: 'Previous' },
16
- skyux_tab_open: { message: 'Open tab' },
17
- skyux_vertical_tabs_show_tabs_text: { message: 'Tab list' },
18
- },
19
- };
20
- export class SkyTabsResourcesProvider {
21
- getString(localeInfo, name) {
22
- return getLibStringForLocale(RESOURCES, localeInfo.locale, name);
23
- }
24
- }
25
- /**
26
- * Import into any component library module that needs to use resource strings.
27
- */
28
- export class SkyTabsResourcesModule {
29
- }
30
- SkyTabsResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTabsResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
31
- SkyTabsResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTabsResourcesModule, exports: [SkyI18nModule] });
32
- SkyTabsResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTabsResourcesModule, providers: [
33
- {
34
- provide: SKY_LIB_RESOURCES_PROVIDERS,
35
- useClass: SkyTabsResourcesProvider,
36
- multi: true,
37
- },
38
- ], imports: [SkyI18nModule] });
39
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTabsResourcesModule, decorators: [{
40
- type: NgModule,
41
- args: [{
42
- exports: [SkyI18nModule],
43
- providers: [
44
- {
45
- provide: SKY_LIB_RESOURCES_PROVIDERS,
46
- useClass: SkyTabsResourcesProvider,
47
- multi: true,
48
- },
49
- ],
50
- }]
51
- }] });
52
- //# sourceMappingURL=sky-tabs-resources.module.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sky-tabs-resources.module.js","sourceRoot":"","sources":["../../../../../../../../libs/components/tabs/src/lib/modules/shared/sky-tabs-resources.module.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EACL,2BAA2B,EAE3B,aAAa,EAGb,qBAAqB,GACtB,MAAM,aAAa,CAAC;;AAErB,MAAM,SAAS,GAA0C;IACvD,OAAO,EAAE;QACP,aAAa,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACrC,eAAe,EAAE,EAAE,OAAO,EAAE,eAAe,EAAE;QAC7C,yBAAyB,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAC9C,6BAA6B,EAAE,EAAE,OAAO,EAAE,UAAU,EAAE;QACtD,cAAc,EAAE,EAAE,OAAO,EAAE,UAAU,EAAE;QACvC,kCAAkC,EAAE,EAAE,OAAO,EAAE,UAAU,EAAE;KAC5D;CACF,CAAC;AAEF,MAAM,OAAO,wBAAwB;IAC5B,SAAS,CACd,UAA4B,EAC5B,IAAY;QAEZ,OAAO,qBAAqB,CAAC,SAAS,EAAE,UAAU,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACnE,CAAC;CACF;AAED;;GAEG;AAWH,MAAM,OAAO,sBAAsB;;oHAAtB,sBAAsB;qHAAtB,sBAAsB,YATvB,aAAa;qHASZ,sBAAsB,aARtB;QACT;YACE,OAAO,EAAE,2BAA2B;YACpC,QAAQ,EAAE,wBAAwB;YAClC,KAAK,EAAE,IAAI;SACZ;KACF,YAPS,aAAa;4FASZ,sBAAsB;kBAVlC,QAAQ;mBAAC;oBACR,OAAO,EAAE,CAAC,aAAa,CAAC;oBACxB,SAAS,EAAE;wBACT;4BACE,OAAO,EAAE,2BAA2B;4BACpC,QAAQ,EAAE,wBAAwB;4BAClC,KAAK,EAAE,IAAI;yBACZ;qBACF;iBACF","sourcesContent":["/**\n * NOTICE: DO NOT MODIFY THIS FILE!\n * The contents of this file were automatically generated by\n * the 'ng generate @skyux/i18n:lib-resources-module lib/modules/shared/sky-tabs' schematic.\n * To update this file, simply rerun the command.\n */\nimport { NgModule } from '@angular/core';\nimport {\n SKY_LIB_RESOURCES_PROVIDERS,\n SkyAppLocaleInfo,\n SkyI18nModule,\n SkyLibResources,\n SkyLibResourcesProvider,\n getLibStringForLocale,\n} from '@skyux/i18n';\n\nconst RESOURCES: { [locale: string]: SkyLibResources } = {\n 'EN-US': {\n skyux_tab_add: { message: 'Add tab' },\n skyux_tab_close: { message: 'Close {0} tab' },\n skyux_tabs_navigator_next: { message: 'Next' },\n skyux_tabs_navigator_previous: { message: 'Previous' },\n skyux_tab_open: { message: 'Open tab' },\n skyux_vertical_tabs_show_tabs_text: { message: 'Tab list' },\n },\n};\n\nexport class SkyTabsResourcesProvider implements SkyLibResourcesProvider {\n public getString(\n localeInfo: SkyAppLocaleInfo,\n name: string\n ): string | undefined {\n return getLibStringForLocale(RESOURCES, localeInfo.locale, name);\n }\n}\n\n/**\n * Import into any component library module that needs to use resource strings.\n */\n@NgModule({\n exports: [SkyI18nModule],\n providers: [\n {\n provide: SKY_LIB_RESOURCES_PROVIDERS,\n useClass: SkyTabsResourcesProvider,\n multi: true,\n },\n ],\n})\nexport class SkyTabsResourcesModule {}\n"]}
@@ -1,76 +0,0 @@
1
- import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation, } from '@angular/core';
2
- import * as i0 from "@angular/core";
3
- import * as i1 from "@skyux/indicators";
4
- import * as i2 from "@angular/common";
5
- import * as i3 from "@skyux/i18n";
6
- /**
7
- * @internal
8
- */
9
- export class SkyTabButtonComponent {
10
- constructor() {
11
- this.buttonClick = new EventEmitter();
12
- this.closeClick = new EventEmitter();
13
- }
14
- onButtonClick(event) {
15
- if (!this.disabled) {
16
- this.buttonClick.emit();
17
- event.preventDefault();
18
- }
19
- }
20
- onTabButtonKeyDown(event) {
21
- /*istanbul ignore else */
22
- if (event.key) {
23
- switch (event.key.toUpperCase()) {
24
- case ' ':
25
- case 'ENTER':
26
- this.onButtonClick(event);
27
- break;
28
- /* istanbul ignore next */
29
- default:
30
- break;
31
- }
32
- }
33
- }
34
- onCloseClick(event) {
35
- this.closeClick.emit();
36
- // Prevent the click event from bubbling up to the anchor tag;
37
- // otherwise it will trigger a page refresh.
38
- event.stopPropagation();
39
- event.preventDefault();
40
- }
41
- }
42
- SkyTabButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTabButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
43
- SkyTabButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTabButtonComponent, selector: "sky-tab-button", inputs: { active: "active", ariaControls: "ariaControls", buttonHref: "buttonHref", buttonId: "buttonId", buttonText: "buttonText", buttonTextCount: "buttonTextCount", closeable: "closeable", disabled: "disabled", tabStyle: "tabStyle" }, outputs: { buttonClick: "buttonClick", closeClick: "closeClick" }, ngImport: i0, template: "<div\n class=\"sky-btn-tab-wrapper\"\n [ngClass]=\"{\n 'sky-btn-tab-wrapper-selected': active,\n 'sky-btn-tab-wrapper-disabled': disabled\n }\"\n>\n <a\n class=\"sky-btn-tab\"\n role=\"tab\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-selected]=\"active\"\n [attr.href]=\"buttonHref\"\n [id]=\"buttonId\"\n [ngClass]=\"{\n 'sky-btn-tab-wizard': tabStyle === 'wizard',\n 'sky-btn-tab-selected': active,\n 'sky-btn-tab-disabled': disabled,\n 'sky-tab-btn-closeable': closeable\n }\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n (click)=\"onButtonClick($event)\"\n (keydown)=\"onTabButtonKeyDown($event)\"\n >\n <span class=\"sky-tab-heading\">\n {{ buttonText }}\n <span *ngIf=\"buttonTextCount !== undefined\" class=\"sky-tab-header-count\">\n {{ buttonTextCount }}\n </span>\n </span>\n </a>\n\n <button\n *ngIf=\"closeable\"\n class=\"sky-btn-tab-close\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_close' | skyLibResources: buttonText\"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-tab-close-disabled': disabled\n }\"\n (click)=\"onCloseClick($event)\"\n >\n <sky-icon icon=\"remove\"></sky-icon>\n </button>\n</div>\n", styles: [".sky-btn-tab-wrapper{display:inline-block;position:relative;margin-right:5px}.sky-btn-tab-wrapper .sky-btn-tab-close{position:absolute;top:10px;right:10px;color:#686c73}.sky-btn-tab-wrapper .sky-btn-tab-close:hover{color:#212327;transition:color .15s}.sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#fff}.sky-tab-btn-closeable{padding-right:43px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper{margin-right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}:host-context(.sky-theme-modern) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}:host-context(.sky-theme-modern) .sky-tab-btn-closeable{padding-right:44px}.sky-theme-modern .sky-btn-tab-wrapper{margin-right:10px}.sky-theme-modern .sky-btn-tab-wrapper .sky-btn-tab-close{top:12px;right:10px}.sky-theme-modern .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#686c73}.sky-theme-modern .sky-tab-btn-closeable{padding-right:44px}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper .sky-btn-tab-close{color:#eeeeef}.sky-theme-modern.sky-theme-mode-dark .sky-btn-tab-wrapper.sky-btn-tab-wrapper-selected:not(.sky-btn-tab-wrapper-disabled) .sky-btn-tab-close{color:#eeeeef}\n"], components: [{ type: i1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "skyLibResources": i3.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
44
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyTabButtonComponent, decorators: [{
45
- type: Component,
46
- args: [{
47
- selector: 'sky-tab-button',
48
- templateUrl: './tab-button.component.html',
49
- styleUrls: ['./tab-button.component.scss'],
50
- changeDetection: ChangeDetectionStrategy.OnPush,
51
- encapsulation: ViewEncapsulation.None,
52
- }]
53
- }], propDecorators: { active: [{
54
- type: Input
55
- }], ariaControls: [{
56
- type: Input
57
- }], buttonHref: [{
58
- type: Input
59
- }], buttonId: [{
60
- type: Input
61
- }], buttonText: [{
62
- type: Input
63
- }], buttonTextCount: [{
64
- type: Input
65
- }], closeable: [{
66
- type: Input
67
- }], disabled: [{
68
- type: Input
69
- }], tabStyle: [{
70
- type: Input
71
- }], buttonClick: [{
72
- type: Output
73
- }], closeClick: [{
74
- type: Output
75
- }] } });
76
- //# sourceMappingURL=tab-button.component.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"tab-button.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/tabs/src/lib/modules/tabs/tab-button.component.ts","../../../../../../../../libs/components/tabs/src/lib/modules/tabs/tab-button.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,YAAY,EACZ,KAAK,EACL,MAAM,EACN,iBAAiB,GAClB,MAAM,eAAe,CAAC;;;;;AAIvB;;GAEG;AAQH,MAAM,OAAO,qBAAqB;IAPlC;QAoCS,gBAAW,GAAG,IAAI,YAAY,EAAQ,CAAC;QAGvC,eAAU,GAAG,IAAI,YAAY,EAAQ,CAAC;KAgC9C;IA9BQ,aAAa,CAAC,KAAU;QAC7B,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;YACxB,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;IACH,CAAC;IAEM,kBAAkB,CAAC,KAAoB;QAC5C,yBAAyB;QACzB,IAAI,KAAK,CAAC,GAAG,EAAE;YACb,QAAQ,KAAK,CAAC,GAAG,CAAC,WAAW,EAAE,EAAE;gBAC/B,KAAK,GAAG,CAAC;gBACT,KAAK,OAAO;oBACV,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;oBAC1B,MAAM;gBACR,0BAA0B;gBAC1B;oBACE,MAAM;aACT;SACF;IACH,CAAC;IAEM,YAAY,CAAC,KAAU;QAC5B,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;QAEvB,8DAA8D;QAC9D,4CAA4C;QAC5C,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC;;mHA/DU,qBAAqB;uGAArB,qBAAqB,uWCrBlC,6xCA+CA;4FD1Ba,qBAAqB;kBAPjC,SAAS;mBAAC;oBACT,QAAQ,EAAE,gBAAgB;oBAC1B,WAAW,EAAE,6BAA6B;oBAC1C,SAAS,EAAE,CAAC,6BAA6B,CAAC;oBAC1C,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,aAAa,EAAE,iBAAiB,CAAC,IAAI;iBACtC;8BAGQ,MAAM;sBADZ,KAAK;gBAIC,YAAY;sBADlB,KAAK;gBAIC,UAAU;sBADhB,KAAK;gBAIC,QAAQ;sBADd,KAAK;gBAIC,UAAU;sBADhB,KAAK;gBAIC,eAAe;sBADrB,KAAK;gBAIC,SAAS;sBADf,KAAK;gBAIC,QAAQ;sBADd,KAAK;gBAIC,QAAQ;sBADd,KAAK;gBAIC,WAAW;sBADjB,MAAM;gBAIA,UAAU;sBADhB,MAAM","sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport { SkyTabsetStyle } from './tabset-style';\n\n/**\n * @internal\n */\n@Component({\n selector: 'sky-tab-button',\n templateUrl: './tab-button.component.html',\n styleUrls: ['./tab-button.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class SkyTabButtonComponent {\n @Input()\n public active: boolean;\n\n @Input()\n public ariaControls: string;\n\n @Input()\n public buttonHref: string;\n\n @Input()\n public buttonId: string;\n\n @Input()\n public buttonText: string;\n\n @Input()\n public buttonTextCount: string | undefined;\n\n @Input()\n public closeable: boolean;\n\n @Input()\n public disabled: boolean;\n\n @Input()\n public tabStyle: SkyTabsetStyle;\n\n @Output()\n public buttonClick = new EventEmitter<void>();\n\n @Output()\n public closeClick = new EventEmitter<void>();\n\n public onButtonClick(event: any): void {\n if (!this.disabled) {\n this.buttonClick.emit();\n event.preventDefault();\n }\n }\n\n public onTabButtonKeyDown(event: KeyboardEvent): void {\n /*istanbul ignore else */\n if (event.key) {\n switch (event.key.toUpperCase()) {\n case ' ':\n case 'ENTER':\n this.onButtonClick(event);\n break;\n /* istanbul ignore next */\n default:\n break;\n }\n }\n }\n\n public onCloseClick(event: any): void {\n this.closeClick.emit();\n\n // Prevent the click event from bubbling up to the anchor tag;\n // otherwise it will trigger a page refresh.\n event.stopPropagation();\n event.preventDefault();\n }\n}\n","<div\n class=\"sky-btn-tab-wrapper\"\n [ngClass]=\"{\n 'sky-btn-tab-wrapper-selected': active,\n 'sky-btn-tab-wrapper-disabled': disabled\n }\"\n>\n <a\n class=\"sky-btn-tab\"\n role=\"tab\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-selected]=\"active\"\n [attr.href]=\"buttonHref\"\n [id]=\"buttonId\"\n [ngClass]=\"{\n 'sky-btn-tab-wizard': tabStyle === 'wizard',\n 'sky-btn-tab-selected': active,\n 'sky-btn-tab-disabled': disabled,\n 'sky-tab-btn-closeable': closeable\n }\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n (click)=\"onButtonClick($event)\"\n (keydown)=\"onTabButtonKeyDown($event)\"\n >\n <span class=\"sky-tab-heading\">\n {{ buttonText }}\n <span *ngIf=\"buttonTextCount !== undefined\" class=\"sky-tab-header-count\">\n {{ buttonTextCount }}\n </span>\n </span>\n </a>\n\n <button\n *ngIf=\"closeable\"\n class=\"sky-btn-tab-close\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tab_close' | skyLibResources: buttonText\"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-tab-close-disabled': disabled\n }\"\n (click)=\"onCloseClick($event)\"\n >\n <sky-icon icon=\"remove\"></sky-icon>\n </button>\n</div>\n"]}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=tab-index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"tab-index.js","sourceRoot":"","sources":["../../../../../../../../libs/components/tabs/src/lib/modules/tabs/tab-index.ts"],"names":[],"mappings":"","sourcesContent":["export type SkyTabIndex = string | number;\n"]}