@memberjunction/ng-tabstrip 0.9.2 → 0.9.3

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.
@@ -262,10 +262,10 @@ MJTabStripComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJTabSt
262
262
  i0.ɵɵproperty("ngIf", ctx.showLeftButton);
263
263
  i0.ɵɵadvance(4);
264
264
  i0.ɵɵproperty("ngIf", ctx.showRightButton);
265
- } }, dependencies: [i1.NgIf, i2.FillContainer], styles: [".tab-header-outer[_ngcontent-%COMP%] {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n overflow: hidden; \n\r\n background-color: #D5D8E5;\r\n}\r\n\r\n.tab-header-inner[_ngcontent-%COMP%] {\r\n display: flex;\r\n flex-direction: row;\r\n white-space: nowrap; \n\r\n position: relative; \n\r\n z-index: 1; \n\r\n\r\n padding-left: 5px;\r\n padding-top: 5px;\r\n background-color: #D5D8E5;\r\n border-bottom: #F5F6FA;\r\n}\r\n\r\n.tab-scroll-button-left[_ngcontent-%COMP%], .tab-scroll-button-right[_ngcontent-%COMP%] {\r\n position: absolute;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n z-index: 2; \n\r\n}\r\n\r\n.tab-scroll-button-left[_ngcontent-%COMP%] {\r\n left: 0;\r\n}\r\n\r\n.tab-scroll-button-right[_ngcontent-%COMP%] {\r\n right: 0;\r\n}\r\n\r\n \r\n\r\n.tab-body[_ngcontent-%COMP%] {\r\n border-top: 0;\r\n background-color: #F5F6FA; \r\n width: 100%;\r\n height: 200px;\r\n}"] });
265
+ } }, dependencies: [i1.NgIf, i2.FillContainer], styles: [".tab-header-outer[_ngcontent-%COMP%] {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n overflow: hidden; \n\r\n background-color: #D5D8E5;\r\n}\r\n\r\n.tab-header-inner[_ngcontent-%COMP%] {\r\n display: flex;\r\n flex-direction: row;\r\n white-space: nowrap; \n\r\n position: relative; \n\r\n z-index: 1; \n\r\n\r\n padding-left: 5px;\r\n padding-top: 5px;\r\n background-color: #D5D8E5;\r\n border-bottom: #F5F6FA;\r\n}\r\n\r\n.tab-scroll-button-left[_ngcontent-%COMP%], .tab-scroll-button-right[_ngcontent-%COMP%] {\r\n position: absolute;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n z-index: 2; \n\r\n}\r\n\r\n.tab-scroll-button-left[_ngcontent-%COMP%] {\r\n left: 0;\r\n}\r\n\r\n.tab-scroll-button-right[_ngcontent-%COMP%] {\r\n right: 0;\r\n}\r\n\r\n \r\n\r\n.tab-body[_ngcontent-%COMP%] {\r\n border-top: 0;\r\n background-color: #F5F6FA; \r\n width: 100%;\r\n height: 200px;\r\n display: block;\r\n}"] });
266
266
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJTabStripComponent, [{
267
267
  type: Component,
268
- args: [{ selector: 'mj-tabstrip', template: "<!-- mj-tabstrip.component.html -->\r\n<div class=\"tabstrip-container\" mjFillContainer>\r\n <!-- Tab Headers -->\r\n <div class=\"tab-header-outer\">\r\n <button kendoButton *ngIf=\"showLeftButton\" class=\"tab-scroll-button-left\" (click)=\"scrollLeft()\">\u21E6</button>\r\n <div class=\"tab-header-inner\" #tabInnerContainer>\r\n <ng-content select=\"mj-tab\"></ng-content> <!-- Where <mj-tab> components are projected -->\r\n </div>\r\n <button kendoButton *ngIf=\"showRightButton\" class=\"tab-scroll-button-right\" (click)=\"scrollRight()\">\u21E8</button>\r\n </div>\r\n <!-- Tab Content -->\r\n <div class=\"tab-body\" mjFillContainer>\r\n <ng-content select=\"mj-tab-body\"></ng-content> <!-- Where <mj-tab-body> components are projected -->\r\n </div>\r\n</div>", styles: [".tab-header-outer {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n overflow: hidden; /* Hide the overflow */\r\n background-color: #D5D8E5;\r\n}\r\n\r\n.tab-header-inner {\r\n display: flex;\r\n flex-direction: row;\r\n white-space: nowrap; /* Prevent wrapping of tabs */\r\n position: relative; /* Needed for z-index to work */\r\n z-index: 1; /* Place tabs above the content */\r\n\r\n padding-left: 5px;\r\n padding-top: 5px;\r\n background-color: #D5D8E5;\r\n border-bottom: #F5F6FA;\r\n}\r\n\r\n.tab-scroll-button-left, .tab-scroll-button-right {\r\n position: absolute;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n z-index: 2; /* Ensure buttons are above the content */\r\n}\r\n\r\n.tab-scroll-button-left {\r\n left: 0;\r\n}\r\n\r\n.tab-scroll-button-right {\r\n right: 0;\r\n}\r\n\r\n \r\n\r\n.tab-body {\r\n border-top: 0;\r\n background-color: #F5F6FA; \r\n width: 100%;\r\n height: 200px;\r\n} "] }]
268
+ args: [{ selector: 'mj-tabstrip', template: "<!-- mj-tabstrip.component.html -->\r\n<div class=\"tabstrip-container\" mjFillContainer>\r\n <!-- Tab Headers -->\r\n <div class=\"tab-header-outer\">\r\n <button kendoButton *ngIf=\"showLeftButton\" class=\"tab-scroll-button-left\" (click)=\"scrollLeft()\">\u21E6</button>\r\n <div class=\"tab-header-inner\" #tabInnerContainer>\r\n <ng-content select=\"mj-tab\"></ng-content> <!-- Where <mj-tab> components are projected -->\r\n </div>\r\n <button kendoButton *ngIf=\"showRightButton\" class=\"tab-scroll-button-right\" (click)=\"scrollRight()\">\u21E8</button>\r\n </div>\r\n <!-- Tab Content -->\r\n <div class=\"tab-body\" mjFillContainer>\r\n <ng-content select=\"mj-tab-body\"></ng-content> <!-- Where <mj-tab-body> components are projected -->\r\n </div>\r\n</div>", styles: [".tab-header-outer {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n overflow: hidden; /* Hide the overflow */\r\n background-color: #D5D8E5;\r\n}\r\n\r\n.tab-header-inner {\r\n display: flex;\r\n flex-direction: row;\r\n white-space: nowrap; /* Prevent wrapping of tabs */\r\n position: relative; /* Needed for z-index to work */\r\n z-index: 1; /* Place tabs above the content */\r\n\r\n padding-left: 5px;\r\n padding-top: 5px;\r\n background-color: #D5D8E5;\r\n border-bottom: #F5F6FA;\r\n}\r\n\r\n.tab-scroll-button-left, .tab-scroll-button-right {\r\n position: absolute;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n z-index: 2; /* Ensure buttons are above the content */\r\n}\r\n\r\n.tab-scroll-button-left {\r\n left: 0;\r\n}\r\n\r\n.tab-scroll-button-right {\r\n right: 0;\r\n}\r\n\r\n \r\n\r\n.tab-body {\r\n border-top: 0;\r\n background-color: #F5F6FA; \r\n width: 100%;\r\n height: 200px;\r\n display: block;\r\n} "] }]
269
269
  }], null, { SelectedTabIndex: [{
270
270
  type: Input
271
271
  }], BeforeTabSelected: [{
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@memberjunction/ng-tabstrip",
3
- "version": "0.9.2",
3
+ "version": "0.9.3",
4
4
  "description": "MemberJunction: Very simple tab strip component used in the MJ Explorer app and reusable anywhere else in an Angular project.",
5
5
  "main": "./dist/public-api.js",
6
6
  "typings": "./dist/public-api.d.ts",
@@ -23,7 +23,7 @@
23
23
  "@angular/core": "~17.2.2"
24
24
  },
25
25
  "dependencies": {
26
- "@memberjunction/ng-container-directives": "^0.9.147",
26
+ "@memberjunction/ng-container-directives": "^0.9.148",
27
27
  "tslib": "^2.3.0"
28
28
  },
29
29
  "sideEffects": false