@kodaris/krubble-components 1.0.30 → 1.0.31
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.
- package/breaking-changes.json +6 -1
- package/custom-elements.json +14 -14
- package/dist/button/button.js +2 -2
- package/dist/krubble-components.bundled.js +10 -9
- package/dist/krubble-components.bundled.js.map +1 -1
- package/dist/krubble-components.bundled.min.js +5 -5
- package/dist/krubble-components.bundled.min.js.map +1 -1
- package/dist/krubble-components.umd.js +10 -9
- package/dist/krubble-components.umd.js.map +1 -1
- package/dist/krubble-components.umd.min.js +5 -5
- package/dist/krubble-components.umd.min.js.map +1 -1
- package/dist/tabs/tab.d.ts +3 -3
- package/dist/tabs/tab.d.ts.map +1 -1
- package/dist/tabs/tab.js +5 -4
- package/dist/tabs/tab.js.map +1 -1
- package/dist/tabs/tabs.d.ts +2 -2
- package/dist/tabs/tabs.js +3 -3
- package/package.json +1 -1
|
@@ -889,8 +889,8 @@
|
|
|
889
889
|
}
|
|
890
890
|
|
|
891
891
|
:host(.kr-button--small) ::slotted([slot="icon"]) {
|
|
892
|
-
width:
|
|
893
|
-
height:
|
|
892
|
+
width: 16px;
|
|
893
|
+
height: 16px;
|
|
894
894
|
}
|
|
895
895
|
|
|
896
896
|
:host(.kr-button--large) ::slotted([slot="icon"]) {
|
|
@@ -1894,11 +1894,11 @@
|
|
|
1894
1894
|
* @example
|
|
1895
1895
|
* ```html
|
|
1896
1896
|
* <kr-tab-group active-tab-id="settings">
|
|
1897
|
-
* <kr-tab id="home"
|
|
1897
|
+
* <kr-tab id="home" label="Home">
|
|
1898
1898
|
* <svg slot="icon" viewBox="0 0 20 20" fill="currentColor" width="16" height="16">...</svg>
|
|
1899
1899
|
* <p>Home content here</p>
|
|
1900
1900
|
* </kr-tab>
|
|
1901
|
-
* <kr-tab id="settings"
|
|
1901
|
+
* <kr-tab id="settings" label="Settings" badge="3">
|
|
1902
1902
|
* <svg slot="icon" viewBox="0 0 20 20" fill="currentColor" width="16" height="16">...</svg>
|
|
1903
1903
|
* <p>Settings content here</p>
|
|
1904
1904
|
* </kr-tab>
|
|
@@ -2018,7 +2018,7 @@
|
|
|
2018
2018
|
@click=${() => this._handleTabClick(tab)}
|
|
2019
2019
|
>
|
|
2020
2020
|
${this._renderTabIcon(tab)}
|
|
2021
|
-
<span>${tab.
|
|
2021
|
+
<span>${tab.label}</span>
|
|
2022
2022
|
${tab.badge ? b `<span class="label-badge" style=${o$1({ backgroundColor: tab.badgeBackground, color: tab.badgeColor })}>${tab.badge}</span>` : A}
|
|
2023
2023
|
${tab.dismissible
|
|
2024
2024
|
? b `
|
|
@@ -2212,11 +2212,11 @@
|
|
|
2212
2212
|
*/
|
|
2213
2213
|
this.id = '';
|
|
2214
2214
|
/**
|
|
2215
|
-
* Display
|
|
2215
|
+
* Display label for the tab
|
|
2216
2216
|
*/
|
|
2217
|
-
this.
|
|
2217
|
+
this.label = '';
|
|
2218
2218
|
/**
|
|
2219
|
-
* Badge text displayed next to
|
|
2219
|
+
* Badge text displayed next to label (e.g. notification count)
|
|
2220
2220
|
*/
|
|
2221
2221
|
this.badge = '';
|
|
2222
2222
|
/**
|
|
@@ -2247,6 +2247,7 @@
|
|
|
2247
2247
|
return this.querySelector('[slot="icon"]');
|
|
2248
2248
|
}
|
|
2249
2249
|
render() {
|
|
2250
|
+
console.log('tab render');
|
|
2250
2251
|
return b `<slot></slot>`;
|
|
2251
2252
|
}
|
|
2252
2253
|
};
|
|
@@ -2269,7 +2270,7 @@
|
|
|
2269
2270
|
], exports.KRTab.prototype, "id", void 0);
|
|
2270
2271
|
__decorate$8([
|
|
2271
2272
|
n$1({ type: String })
|
|
2272
|
-
], exports.KRTab.prototype, "
|
|
2273
|
+
], exports.KRTab.prototype, "label", void 0);
|
|
2273
2274
|
__decorate$8([
|
|
2274
2275
|
n$1({ type: String })
|
|
2275
2276
|
], exports.KRTab.prototype, "badge", void 0);
|