@fluid-topics/ft-tabs 0.3.70 → 1.0.0-alpha.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.
@@ -1,2 +1 @@
1
1
  export declare const FtTabCssVariables: {};
2
- //# sourceMappingURL=ft-tab.css.d.ts.map
@@ -1,2 +1 @@
1
1
  export const FtTabCssVariables = {};
2
- //# sourceMappingURL=ft-tab.css.js.map
package/build/ft-tab.d.ts CHANGED
@@ -6,7 +6,7 @@ export declare class FtTab extends FtLitElement implements FtTabProperties {
6
6
  static elementDefinitions: ElementDefinitionsMap;
7
7
  label: string;
8
8
  icon: string;
9
- iconVariant: FtIconVariants;
9
+ iconVariant?: FtIconVariants;
10
10
  active: boolean;
11
11
  disabled: boolean;
12
12
  private readonly uniqueId;
@@ -17,4 +17,3 @@ export declare class FtTab extends FtLitElement implements FtTabProperties {
17
17
  protected render(): unknown;
18
18
  protected updated(props: PropertyValues): void;
19
19
  }
20
- //# sourceMappingURL=ft-tab.d.ts.map
package/build/ft-tab.js CHANGED
@@ -7,13 +7,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { FtLitElement } from "@fluid-topics/ft-wc-utils";
8
8
  import { html, unsafeCSS } from "lit";
9
9
  import { property } from "lit/decorators.js";
10
- import { FtIconVariants } from "@fluid-topics/ft-icon/build/ft-icon.properties";
11
- export class FtTab extends FtLitElement {
10
+ class FtTab extends FtLitElement {
12
11
  constructor() {
13
12
  super(...arguments);
14
13
  this.label = "";
15
14
  this.icon = "";
16
- this.iconVariant = FtIconVariants.material;
17
15
  this.active = false;
18
16
  this.disabled = false;
19
17
  this.uniqueId = ("" + Math.floor(Math.random() * 100000)).padStart(5, "0");
@@ -65,4 +63,4 @@ __decorate([
65
63
  __decorate([
66
64
  property({ reflect: true, attribute: "aria-labelledby" })
67
65
  ], FtTab.prototype, "ariaLabelledBy", void 0);
68
- //# sourceMappingURL=ft-tab.js.map
66
+ export { FtTab };
@@ -7,4 +7,3 @@ export interface FtTabProperties {
7
7
  rippleColor?: string;
8
8
  iconVariant?: FtIconVariants;
9
9
  }
10
- //# sourceMappingURL=ft-tab.properties.d.ts.map
@@ -1,2 +1 @@
1
1
  export {};
2
- //# sourceMappingURL=ft-tab.properties.js.map
@@ -5,4 +5,3 @@ export declare const FtTabsCssVariables: {
5
5
  colorOnSurfaceDisabled: import("@fluid-topics/ft-wc-utils").FtCssVariable;
6
6
  };
7
7
  export declare const styles: import("lit").CSSResult;
8
- //# sourceMappingURL=ft-tabs.css.d.ts.map
@@ -101,4 +101,3 @@ export const styles = css `
101
101
  overflow: auto;
102
102
  }
103
103
  `;
104
- //# sourceMappingURL=ft-tabs.css.js.map
@@ -26,4 +26,3 @@ export declare class FtTabs extends FtLitElement implements FtTabsProperties {
26
26
  private updateTabs;
27
27
  private addTooltipIfNecessary;
28
28
  }
29
- //# sourceMappingURL=ft-tabs.d.ts.map
package/build/ft-tabs.js CHANGED
@@ -21,7 +21,7 @@ export class IndexChangeEvent extends CustomEvent {
21
21
  super("index-change", { detail: index });
22
22
  }
23
23
  }
24
- export class FtTabs extends FtLitElement {
24
+ class FtTabs extends FtLitElement {
25
25
  constructor() {
26
26
  super(...arguments);
27
27
  this.dense = false;
@@ -30,7 +30,9 @@ export class FtTabs extends FtLitElement {
30
30
  this.ftTabs = [];
31
31
  this.activeIndex = 0;
32
32
  this.updateDebouncer = new Debouncer(20);
33
- this.scheduleRequestUpdate = () => this.updateDebouncer.run(() => this.requestUpdate());
33
+ this.scheduleRequestUpdate = () => this.updateDebouncer.run(() => {
34
+ this.requestUpdate();
35
+ });
34
36
  this.resizeObserver = new ResizeObserver(() => this.placeIndicator());
35
37
  }
36
38
  render() {
@@ -65,7 +67,7 @@ export class FtTabs extends FtLitElement {
65
67
  style="${(tab.color || tab.rippleColor) ? `--ft-ripple-color: ${tab.color || tab.rippleColor};` : ""}"></ft-ripple>
66
68
  <ft-icon class="ft-tabs--tab-icon"
67
69
  part="tab-icon${tab.active ? " active-tab-icon" : ""}"
68
- variant="${tab.iconVariant}">
70
+ .variant=${tab.iconVariant}>
69
71
  ${tab.icon}
70
72
  </ft-icon>
71
73
  <ft-typography class="ft-tabs--tab-label"
@@ -97,7 +99,7 @@ export class FtTabs extends FtLitElement {
97
99
  }
98
100
  updated(props) {
99
101
  super.updated(props);
100
- if (props.has("tabs") || props.has("activeIndex")) {
102
+ if (props.has("ftTabs") || props.has("activeIndex")) {
101
103
  this.updateTabs();
102
104
  }
103
105
  if (props.has("activeIndex")) {
@@ -177,4 +179,4 @@ __decorate([
177
179
  __decorate([
178
180
  property({ type: Number, reflect: true })
179
181
  ], FtTabs.prototype, "activeIndex", void 0);
180
- //# sourceMappingURL=ft-tabs.js.map
182
+ export { FtTabs };