npm - @esri/calcite-components - Versions diffs - 1.0.0-next.596 → 1.0.0-next.597 - Mend

@esri/calcite-components 1.0.0-next.596 → 1.0.0-next.597

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 (1227) hide show

package/dist/collection/components/tab-title/tab-title.js CHANGED Viewed

@@ -1,9 +1,9 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.596
+ * v1.0.0-next.597
  */
-import { Build, Component, Element, Event, h, Host, Listen, Method, Prop, State, Watch } from "@stencil/core";
+import { Build, h, Host } from "@stencil/core";
 import { guid } from "../../utils/guid";
 import { getElementDir, getElementProp, toAriaBoolean } from "../../utils/dom";
 import { createObserver } from "../../utils/observers";
@@ -23,7 +23,7 @@ export class TabTitle {
      *
      * Only one tab can be selected within the `calcite-tabs` parent.
      *
-     * @deprecated Use "selected" instead.
+     * @deprecated Use `selected` instead.
      */
     this.active = false;
     /**
@@ -112,14 +112,10 @@ export class TabTitle {
     const id = this.el.id || this.guid;
     const iconStartEl = (h("calcite-icon", { class: "calcite-tab-title--icon icon-start", flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: "s" }));
     const iconEndEl = (h("calcite-icon", { class: "calcite-tab-title--icon icon-end", flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: "s" }));
-    return (h(Host, { "aria-controls": this.controls, "aria-selected": toAriaBoolean(this.selected), id: id, role: "tab", tabIndex: this.selected ? 0 : -1 },
-      h("div", { class: {
-          container: true,
-          "container--has-text": this.hasText
-        }, ref: (el) => { var _a; return (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(el); } },
-        this.iconStart ? iconStartEl : null,
-        h("slot", null),
-        this.iconEnd ? iconEndEl : null)));
+    return (h(Host, { "aria-controls": this.controls, "aria-selected": toAriaBoolean(this.selected), id: id, role: "tab", tabIndex: this.selected ? 0 : -1 }, h("div", { class: {
+        container: true,
+        "container--has-text": this.hasText
+      }, ref: (el) => { var _a; return (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(el); } }, this.iconStart ? iconStartEl : null, h("slot", null), this.iconEnd ? iconEndEl : null)));
   }
   async componentDidLoad() {
     this.calciteInternalTabTitleRegister.emit(await this.getTabIdentifier());
@@ -225,474 +221,490 @@ export class TabTitle {
   }
   static get is() { return "calcite-tab-title"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["tab-title.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["tab-title.css"]
-  }; }
-  static get properties() { return {
-    "active": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "deprecated",
-            "text": "Use \"selected\" instead."
-          }],
-        "text": "When true, the component and its respective `calcite-tab` contents are selected.\n\nOnly one tab can be selected within the `calcite-tabs` parent."
-      },
-      "attribute": "active",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "selected": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When true, the component and its respective `calcite-tab` contents are selected.\n\nOnly one tab can be selected within the `calcite-tabs` parent."
-      },
-      "attribute": "selected",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["tab-title.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["tab-title.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "active": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "deprecated",
+              "text": "Use `selected` instead."
+            }],
+          "text": "When true, the component and its respective `calcite-tab` contents are selected.\n\nOnly one tab can be selected within the `calcite-tabs` parent."
+        },
+        "attribute": "active",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When true, interaction is prevented and the component is displayed with lower opacity."
+      "selected": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When true, the component and its respective `calcite-tab` contents are selected.\n\nOnly one tab can be selected within the `calcite-tabs` parent."
+        },
+        "attribute": "selected",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "attribute": "disabled",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "iconEnd": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When true, interaction is prevented and the component is displayed with lower opacity."
+        },
+        "attribute": "disabled",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Specifies an icon to display at the end of the component - accepts Calcite UI icon names."
+      "iconEnd": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Specifies an icon to display at the end of the component."
+        },
+        "attribute": "icon-end",
+        "reflect": true
       },
-      "attribute": "icon-end",
-      "reflect": true
-    },
-    "iconFlipRtl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "FlipContext",
-        "resolved": "\"both\" | \"end\" | \"start\"",
-        "references": {
-          "FlipContext": {
-            "location": "import",
-            "path": "../interfaces"
+      "iconFlipRtl": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "FlipContext",
+          "resolved": "\"both\" | \"end\" | \"start\"",
+          "references": {
+            "FlipContext": {
+              "location": "import",
+              "path": "../interfaces"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "When true, the icon will be flipped when the element direction is right-to-left (\"rtl\")."
-      },
-      "attribute": "icon-flip-rtl",
-      "reflect": true
-    },
-    "iconStart": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "When true, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`)."
+        },
+        "attribute": "icon-flip-rtl",
+        "reflect": true
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Specifies an icon to display at the start of the component - accepts Calcite UI icon names."
+      "iconStart": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Specifies an icon to display at the start of the component."
+        },
+        "attribute": "icon-start",
+        "reflect": true
       },
-      "attribute": "icon-start",
-      "reflect": true
-    },
-    "layout": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "TabLayout",
-        "resolved": "\"center\" | \"inline\"",
-        "references": {
-          "TabLayout": {
-            "location": "import",
-            "path": "../tabs/interfaces"
+      "layout": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "TabLayout",
+          "resolved": "\"center\" | \"inline\"",
+          "references": {
+            "TabLayout": {
+              "location": "import",
+              "path": "../tabs/interfaces"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "attribute": "layout",
+        "reflect": true
       },
-      "attribute": "layout",
-      "reflect": true
-    },
-    "position": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "TabPosition",
-        "resolved": "\"above\" | \"below\" | \"bottom\" | \"top\"",
-        "references": {
-          "TabPosition": {
-            "location": "import",
-            "path": "../tabs/interfaces"
+      "position": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "TabPosition",
+          "resolved": "\"above\" | \"below\" | \"bottom\" | \"top\"",
+          "references": {
+            "TabPosition": {
+              "location": "import",
+              "path": "../tabs/interfaces"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "attribute": "position",
+        "reflect": true
       },
-      "attribute": "position",
-      "reflect": true
-    },
-    "scale": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "Scale",
-        "resolved": "\"l\" | \"m\" | \"s\"",
-        "references": {
-          "Scale": {
-            "location": "import",
-            "path": "../interfaces"
+      "scale": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "Scale",
+          "resolved": "\"l\" | \"m\" | \"s\"",
+          "references": {
+            "Scale": {
+              "location": "import",
+              "path": "../interfaces"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "attribute": "scale",
-      "reflect": true
-    },
-    "bordered": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "attribute": "bordered",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "tab": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Specifies a unique name for the component.\n\nWhen specified, use the same value on the `calcite-tab`."
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "attribute": "scale",
+        "reflect": true
       },
-      "attribute": "tab",
-      "reflect": true
-    }
-  }; }
-  static get states() { return {
-    "controls": {},
-    "hasText": {}
-  }; }
-  static get events() { return [{
-      "method": "calciteTabsActivate",
-      "name": "calciteTabsActivate",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "see",
-            "text": "[TabChangeEventDetail](https://github.com/Esri/calcite-components/blob/master/src/components/tab/interfaces.ts#L1)"
-          }],
-        "text": "Fires when a `calcite-tab` is selected. Emits the \"tab\" property, or the index position."
+      "bordered": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "attribute": "bordered",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "complexType": {
-        "original": "TabChangeEventDetail",
-        "resolved": "TabChangeEventDetail",
-        "references": {
-          "TabChangeEventDetail": {
-            "location": "import",
-            "path": "../tab/interfaces"
-          }
-        }
+      "tab": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Specifies a unique name for the component.\n\nWhen specified, use the same value on the `calcite-tab`."
+        },
+        "attribute": "tab",
+        "reflect": true
       }
-    }, {
-      "method": "calciteInternalTabsActivate",
-      "name": "calciteInternalTabsActivate",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "see",
-            "text": "[TabChangeEventDetail](https://github.com/Esri/calcite-components/blob/master/src/components/tab/interfaces.ts#L1)"
-          }, {
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": "Fires when a `calcite-tab` is selected (`event.details`)."
-      },
-      "complexType": {
-        "original": "TabChangeEventDetail",
-        "resolved": "TabChangeEventDetail",
-        "references": {
-          "TabChangeEventDetail": {
-            "location": "import",
-            "path": "../tab/interfaces"
+    };
+  }
+  static get states() {
+    return {
+      "controls": {},
+      "hasText": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "calciteTabsActivate",
+        "name": "calciteTabsActivate",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "see",
+              "text": "[TabChangeEventDetail](https://github.com/Esri/calcite-components/blob/master/src/components/tab/interfaces.ts#L1)"
+            }],
+          "text": "Fires when a `calcite-tab` is selected. Emits the \"tab\" property, or the index position."
+        },
+        "complexType": {
+          "original": "TabChangeEventDetail",
+          "resolved": "TabChangeEventDetail",
+          "references": {
+            "TabChangeEventDetail": {
+              "location": "import",
+              "path": "../tab/interfaces"
+            }
           }
         }
-      }
-    }, {
-      "method": "calciteInternalTabsFocusNext",
-      "name": "calciteInternalTabsFocusNext",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }, {
-      "method": "calciteInternalTabsFocusPrevious",
-      "name": "calciteInternalTabsFocusPrevious",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }, {
-      "method": "calciteInternalTabTitleRegister",
-      "name": "calciteInternalTabTitleRegister",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "complexType": {
-        "original": "TabID",
-        "resolved": "number | string",
-        "references": {
-          "TabID": {
-            "location": "import",
-            "path": "../tabs/interfaces"
+      }, {
+        "method": "calciteInternalTabsActivate",
+        "name": "calciteInternalTabsActivate",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "see",
+              "text": "[TabChangeEventDetail](https://github.com/Esri/calcite-components/blob/master/src/components/tab/interfaces.ts#L1)"
+            }, {
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": "Fires when a `calcite-tab` is selected (`event.details`)."
+        },
+        "complexType": {
+          "original": "TabChangeEventDetail",
+          "resolved": "TabChangeEventDetail",
+          "references": {
+            "TabChangeEventDetail": {
+              "location": "import",
+              "path": "../tab/interfaces"
+            }
           }
         }
-      }
-    }, {
-      "method": "calciteInternalTabIconChanged",
-      "name": "calciteInternalTabIconChanged",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }]; }
-  static get methods() { return {
-    "getTabIndex": {
-      "complexType": {
-        "signature": "() => Promise<number>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
+      }, {
+        "method": "calciteInternalTabsFocusNext",
+        "name": "calciteInternalTabsFocusNext",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "calciteInternalTabsFocusPrevious",
+        "name": "calciteInternalTabsFocusPrevious",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "calciteInternalTabTitleRegister",
+        "name": "calciteInternalTabTitleRegister",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        },
+        "complexType": {
+          "original": "TabID",
+          "resolved": "number | string",
+          "references": {
+            "TabID": {
+              "location": "import",
+              "path": "../tabs/interfaces"
+            }
           }
+        }
+      }, {
+        "method": "calciteInternalTabIconChanged",
+        "name": "calciteInternalTabIconChanged",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
         },
-        "return": "Promise<number>"
-      },
-      "docs": {
-        "text": "Returns the index of the title within the `calcite-tab-nav`.",
-        "tags": []
-      }
-    },
-    "getTabIdentifier": {
-      "complexType": {
-        "signature": "() => Promise<TabID>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "getTabIndex": {
+        "complexType": {
+          "signature": "() => Promise<number>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
           },
-          "TabID": {
-            "location": "import",
-            "path": "../tabs/interfaces"
-          }
+          "return": "Promise<number>"
         },
-        "return": "Promise<TabID>"
+        "docs": {
+          "text": "Returns the index of the title within the `calcite-tab-nav`.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "",
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }]
-      }
-    },
-    "updateAriaInfo": {
-      "complexType": {
-        "signature": "(tabIds?: string[], titleIds?: string[]) => Promise<void>",
-        "parameters": [{
-            "tags": [{
-                "name": "param",
-                "text": "tabIds"
-              }],
-            "text": ""
-          }, {
-            "tags": [{
-                "name": "param",
-                "text": "titleIds"
-              }],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "getTabIdentifier": {
+        "complexType": {
+          "signature": "() => Promise<TabID>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "TabID": {
+              "location": "import",
+              "path": "../tabs/interfaces"
+            }
+          },
+          "return": "Promise<TabID>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "",
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }]
+        }
       },
-      "docs": {
-        "text": "",
-        "tags": [{
-            "name": "param",
-            "text": "tabIds"
-          }, {
-            "name": "param",
-            "text": "titleIds"
-          }, {
-            "name": "internal",
-            "text": undefined
-          }]
+      "updateAriaInfo": {
+        "complexType": {
+          "signature": "(tabIds?: string[], titleIds?: string[]) => Promise<void>",
+          "parameters": [{
+              "tags": [{
+                  "name": "param",
+                  "text": "tabIds"
+                }],
+              "text": ""
+            }, {
+              "tags": [{
+                  "name": "param",
+                  "text": "titleIds"
+                }],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": [{
+              "name": "param",
+              "text": "tabIds"
+            }, {
+              "name": "param",
+              "text": "titleIds"
+            }, {
+              "name": "internal",
+              "text": undefined
+            }]
+        }
       }
-    }
-  }; }
+    };
+  }
   static get elementRef() { return "el"; }
-  static get watchers() { return [{
-      "propName": "active",
-      "methodName": "activeHandler"
-    }, {
-      "propName": "selected",
-      "methodName": "selectedHandler"
-    }]; }
-  static get listeners() { return [{
-      "name": "calciteInternalTabChange",
-      "method": "internalTabChangeHandler",
-      "target": "body",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "click",
-      "method": "onClick",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "keydown",
-      "method": "keyDownHandler",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "active",
+        "methodName": "activeHandler"
+      }, {
+        "propName": "selected",
+        "methodName": "selectedHandler"
+      }];
+  }
+  static get listeners() {
+    return [{
+        "name": "calciteInternalTabChange",
+        "method": "internalTabChangeHandler",
+        "target": "body",
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "click",
+        "method": "onClick",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "keydown",
+        "method": "keyDownHandler",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }];
+  }
 }