@fluid-topics/ft-chip 1.3.44 → 1.3.46

package/build/ftds-chip.d.ts

@@ -17,7 +17,7 @@ export declare class FtdsChip extends FtdsBase implements FtdsChipProperties {
     private renderAction;
     private resolveButtonSize;
     private getLabel;
-    get textContent(): string;
+    getTextContent(): string;
     private onSlotchange;
     private dispatchRemoveEvent;
     private typographyVariant;

package/build/ftds-chip.js

@@ -4,11 +4,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { html, nothing, } from "lit";
+import { html, nothing } from "lit";
 import { property, query } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 import { DesignSystemFamily, FtdsBase } from "@fluid-topics/ft-wc-utils";
-import { FtTypography, FtTypographyVariants } from "@fluid-topics/ft-typography";
+import { FtdsTypography, FtdsTypographyVariants } from "@fluid-topics/ft-typography";
 import { FtIcon, FtIcons, FtIconVariants } from "@fluid-topics/ft-icon";
 import { designSystemStyle } from "./ftds-chip.styles";
 import { DesignSystemSize } from "@fluid-topics/design-system-variables";
@@ -31,27 +31,27 @@ class FtdsChip extends FtdsBase {
             "ftds-chip": true,
             "ftds-chip--with-action": this.removable || this.withAction,
             "ftds-chip--with-icon": !!this.icon,
-            ...this.getDesignSystemBaseClasses()
+            ...this.getDesignSystemBaseClasses(),
         };
         return html `
             <div class="${classMap(classes)}"
                  aria-label="${this.getLabel()}"
                  part="chip">
                 ${this.renderIcon()}
-                <ft-typography variant=${this.typographyVariant()} element="span" class="ftds-chip--label" part="label">
+                <ftds-typography variant="${this.typographyVariant()}" element="span" class="ftds-chip--label" part="label">
                     <slot @slotchange=${this.onSlotchange}></slot>
-                </ft-typography>
+                </ftds-typography>
                 ${this.renderAction()}
             </div>
         `;
     }
     renderIcon() {
-        return this.icon ?
-            html `
-                   <div class="ftds-chip--icon-container" part="icon-container">
-                       <ft-icon .variant=${FtIconVariants.fluid_topics} .value="${this.icon}" part="icon"></ft-icon>
-                   </div>
-               ` : nothing;
+        return this.icon
+            ? html `
+                <div class="ftds-chip--icon-container" part="icon-container">
+                    <ft-icon .variant=${FtIconVariants.fluid_topics} .value=${this.icon} part="icon"></ft-icon>
+                </div>
+            ` : nothing;
     }
     renderAction() {
         if (this.removable) {
@@ -59,10 +59,10 @@ class FtdsChip extends FtdsBase {
                 <ftds-button round
                              class="ftds-chip--remove-button"
                              @click=${this.dispatchRemoveEvent}
-                             icon=${FtIcons.X_MARK}
-                             label=${this.removeButtonLabel}
-                             family=${DesignSystemFamily.neutral}
-                             size=${this.resolveButtonSize()}
+                             icon="${FtIcons.X_MARK}"
+                             label="${this.removeButtonLabel}"
+                             family="${DesignSystemFamily.neutral}"
+                             size="${this.resolveButtonSize()}"
                              part="icon-button"
                 ></ftds-button>
             `;
@@ -75,17 +75,16 @@ class FtdsChip extends FtdsBase {
         switch (this.size) {
             case DesignSystemSize.large:
                 return DesignSystemSize.medium;
-            case DesignSystemSize.medium:
-            case DesignSystemSize.small:
+            default:
                 return DesignSystemSize.small;
         }
     }
     getLabel() {
-        return this.label || this.textContent;
+        return this.label || this.getTextContent();
     }
-    get textContent() {
+    getTextContent() {
         var _a, _b;
-        return (_b = (_a = this.slottedContent) === null || _a === void 0 ? void 0 : _a.assignedNodes().map(n => n.textContent).join("").trim()) !== null && _b !== void 0 ? _b : "";
+        return (_b = (_a = this.slottedContent) === null || _a === void 0 ? void 0 : _a.assignedNodes().map((n) => n.textContent).join("").trim()) !== null && _b !== void 0 ? _b : "";
     }
     onSlotchange() {
         this.requestUpdate();
@@ -96,15 +95,14 @@ class FtdsChip extends FtdsBase {
     typographyVariant() {
         switch (this.size) {
             case DesignSystemSize.large:
-                return FtTypographyVariants.body2medium;
-            case DesignSystemSize.medium:
-            case DesignSystemSize.small:
-                return FtTypographyVariants.caption1medium;
+                return FtdsTypographyVariants.body2medium;
+            default:
+                return FtdsTypographyVariants.caption1medium;
         }
     }
 }
 FtdsChip.elementDefinitions = {
-    "ft-typography": FtTypography,
+    "ftds-typography": FtdsTypography,
     "ft-icon": FtIcon,
     "ftds-button": FtdsButton,
 };
@@ -125,6 +123,6 @@ __decorate([
     property()
 ], FtdsChip.prototype, "icon", void 0);
 __decorate([
-    query("ft-typography slot")
+    query("ftds-typography slot")
 ], FtdsChip.prototype, "slottedContent", void 0);
 export { FtdsChip };

package/build/ftds-chip.styles.js

@@ -24,7 +24,7 @@ export const designSystemStyle = [
             flex: none;
         }
 
-        .ftds-chip ft-typography {
+        .ftds-chip ftds-typography {
             display: flex; /* For typo alignment in the chip */
         }
 
@@ -51,7 +51,7 @@ export const designSystemStyle = [
             padding-right: ${chip.smallButtonRightPadding};
         }
 
-        .ftds--size-small ft-typography {
+        .ftds--size-small ftds-typography {
             overflow: visible;
             padding: 0 2px;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fluid-topics/ft-chip",
-    "version": "1.3.44",
+    "version": "1.3.46",
     "description": "A generic Fluid Topics chip",
     "keywords": [
         "Lit"
@@ -20,11 +20,11 @@
     },
     "dependencies": {
         "@fluid-topics/design-system-variables": "2.53.1",
-        "@fluid-topics/ft-icon": "1.3.44",
-        "@fluid-topics/ft-ripple": "1.3.44",
-        "@fluid-topics/ft-typography": "1.3.44",
-        "@fluid-topics/ft-wc-utils": "1.3.44",
+        "@fluid-topics/ft-icon": "1.3.46",
+        "@fluid-topics/ft-ripple": "1.3.46",
+        "@fluid-topics/ft-typography": "1.3.46",
+        "@fluid-topics/ft-wc-utils": "1.3.46",
         "lit": "3.1.0"
     },
-    "gitHead": "a65783a64db6d2d22420bbcb424cf5d51e0483c6"
+    "gitHead": "d6cf25d6ed0dead8c7aff4f94a493c35d12f1392"
 }