@3t-transform/threeteeui 1.9.102 → 1.9.103

package/dist/collection/components/atoms/tttx-tag-v2/tttx-tag-v2.js

@@ -1,281 +1,281 @@
-import { Host, h } from '@stencil/core';
-export class TttxTagV2 {
-  constructor() {
-    this.text = undefined;
-    this.color = undefined;
-    this.textColor = undefined;
-    this.iconStart = 'star';
-    this.iconEnd = 'close';
-    this.iconSize = 16;
-    this.state = 'neutral';
-    this.size = 'M';
-    this.variant = undefined;
-    this.hasStartIcon = true;
-    this.hasEndIcon = true;
-  }
-  getColors() {
-    // If both variant and state are given, state overrides variant
-    if (this.variant) {
-      let base;
-      switch (this.variant) {
-        case 'primary':
-          base = { bg: '#1479c6', text: '#FFFFFF', icon: '#FFFFFF' };
-          break;
-        case 'secondary':
-          base = { bg: '#b9d5ed', text: '#1479c6', icon: '#1479c6' };
-          break;
-      }
-      if (this.state && this.state !== 'neutral') {
-        // apply state overrides
-        switch (this.state) {
-          case 'danger':
-            return { bg: '#DC2626', text: '#FFFFFF', icon: '#FFFFFF' };
-          case 'success':
-            return { bg: '#16A34A', text: '#FFFFFF', icon: '#FFFFFF' };
-          case 'warning':
-            return { bg: '#FACC15', text: '#58310E', icon: '#58310E' };
-          case 'brand':
-            return { bg: '#1479c6', text: '#FFFFFF', icon: '#FFFFFF' };
-        }
-      }
-      return base;
-    }
-    // fall back to custom color or state
-    if (this.color || this.textColor) {
-      return {
-        bg: this.color || '#E5E5E5',
-        text: this.textColor || '#737373',
-        icon: this.textColor || '#737373',
-      };
-    }
-    // state only (no variant)
-    switch (this.state) {
-      case 'brand':
-        return { bg: '#197A68', text: '#FFFFFF', icon: '#FFFFFF' };
-      case 'danger':
-        return { bg: '#DC2626', text: '#FFFFFF', icon: '#FFFFFF' };
-      case 'success':
-        return { bg: '#16A34A', text: '#FFFFFF', icon: '#FFFFFF' };
-      case 'warning':
-        return { bg: '#FACC15', text: '#58310E', icon: '#58310E' };
-      case 'neutral':
-        return { bg: '#E5E5E5', text: '#737373', icon: '#737373' };
-      default:
-        return { bg: '#E5E5E5', text: '#737373', icon: '#737373' };
-    }
-  }
-  render() {
-    const colors = this.getColors();
-    return (h(Host, null, h("div", { class: `tag ${this.state} ${this.size} ${this.variant || ''}`, style: { 'background-color': colors.bg, color: colors.text } }, this.hasStartIcon && this.iconStart && (h("tttx-icon_localcomponent", { role: "icon", class: "tag_icon", "aria-label": colors.text, icon: this.iconStart, color: colors.icon, size: this.size === 'S' ? 12 : 16 })), h("span", null, this.text), this.hasEndIcon && this.iconEnd && (h("tttx-icon_localcomponent", { role: "icon", class: "tag_icon", "aria-label": colors.text, icon: this.iconEnd, color: colors.icon, size: this.iconSize })))));
-  }
-  static get is() { return "tttx-tag-v2_localcomponent"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["tttx-tag-v2.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["tttx-tag-v2.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "text": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "text",
-        "reflect": false
-      },
-      "color": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "color",
-        "reflect": false
-      },
-      "textColor": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "text-color",
-        "reflect": false
-      },
-      "iconStart": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "icon-start",
-        "reflect": false,
-        "defaultValue": "'star'"
-      },
-      "iconEnd": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "icon-end",
-        "reflect": false,
-        "defaultValue": "'close'"
-      },
-      "iconSize": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "icon-size",
-        "reflect": false,
-        "defaultValue": "16"
-      },
-      "state": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'brand' | 'danger' | 'success' | 'warning' | 'neutral'",
-          "resolved": "\"brand\" | \"danger\" | \"neutral\" | \"success\" | \"warning\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "state",
-        "reflect": false,
-        "defaultValue": "'neutral'"
-      },
-      "size": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'S' | 'M'",
-          "resolved": "\"M\" | \"S\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "size",
-        "reflect": false,
-        "defaultValue": "'M'"
-      },
-      "variant": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'primary' | 'secondary'",
-          "resolved": "\"primary\" | \"secondary\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "variant",
-        "reflect": false
-      },
-      "hasStartIcon": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "has-start-icon",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "hasEndIcon": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "has-end-icon",
-        "reflect": false,
-        "defaultValue": "true"
-      }
-    };
-  }
-}
+import { Host, h } from '@stencil/core';
+export class TttxTagV2 {
+  constructor() {
+    this.text = undefined;
+    this.color = undefined;
+    this.textColor = undefined;
+    this.iconStart = 'star';
+    this.iconEnd = 'close';
+    this.iconSize = 16;
+    this.state = 'neutral';
+    this.size = 'M';
+    this.variant = undefined;
+    this.hasStartIcon = true;
+    this.hasEndIcon = true;
+  }
+  getColors() {
+    // If both variant and state are given, state overrides variant
+    if (this.variant) {
+      let base;
+      switch (this.variant) {
+        case 'primary':
+          base = { bg: '#1479c6', text: '#FFFFFF', icon: '#FFFFFF' };
+          break;
+        case 'secondary':
+          base = { bg: '#b9d5ed', text: '#1479c6', icon: '#1479c6' };
+          break;
+      }
+      if (this.state && this.state !== 'neutral') {
+        // apply state overrides
+        switch (this.state) {
+          case 'danger':
+            return { bg: '#DC2626', text: '#FFFFFF', icon: '#FFFFFF' };
+          case 'success':
+            return { bg: '#16A34A', text: '#FFFFFF', icon: '#FFFFFF' };
+          case 'warning':
+            return { bg: '#FACC15', text: '#58310E', icon: '#58310E' };
+          case 'brand':
+            return { bg: '#1479c6', text: '#FFFFFF', icon: '#FFFFFF' };
+        }
+      }
+      return base;
+    }
+    // fall back to custom color or state
+    if (this.color || this.textColor) {
+      return {
+        bg: this.color || '#E5E5E5',
+        text: this.textColor || '#737373',
+        icon: this.textColor || '#737373',
+      };
+    }
+    // state only (no variant)
+    switch (this.state) {
+      case 'brand':
+        return { bg: '#197A68', text: '#FFFFFF', icon: '#FFFFFF' };
+      case 'danger':
+        return { bg: '#DC2626', text: '#FFFFFF', icon: '#FFFFFF' };
+      case 'success':
+        return { bg: '#16A34A', text: '#FFFFFF', icon: '#FFFFFF' };
+      case 'warning':
+        return { bg: '#FACC15', text: '#58310E', icon: '#58310E' };
+      case 'neutral':
+        return { bg: '#E5E5E5', text: '#737373', icon: '#737373' };
+      default:
+        return { bg: '#E5E5E5', text: '#737373', icon: '#737373' };
+    }
+  }
+  render() {
+    const colors = this.getColors();
+    return (h(Host, null, h("div", { class: `tag ${this.state} ${this.size} ${this.variant || ''}`, style: { 'background-color': colors.bg, color: colors.text } }, this.hasStartIcon && this.iconStart && (h("tttx-icon_1_9_103", { role: "icon", class: "tag_icon", "aria-label": colors.text, icon: this.iconStart, color: colors.icon, size: this.size === 'S' ? 12 : 16 })), h("span", null, this.text), this.hasEndIcon && this.iconEnd && (h("tttx-icon_1_9_103", { role: "icon", class: "tag_icon", "aria-label": colors.text, icon: this.iconEnd, color: colors.icon, size: this.iconSize })))));
+  }
+  static get is() { return "tttx-tag-v2_1_9_103"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["tttx-tag-v2.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["tttx-tag-v2.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "text": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "text",
+        "reflect": false
+      },
+      "color": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "color",
+        "reflect": false
+      },
+      "textColor": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "text-color",
+        "reflect": false
+      },
+      "iconStart": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "icon-start",
+        "reflect": false,
+        "defaultValue": "'star'"
+      },
+      "iconEnd": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "icon-end",
+        "reflect": false,
+        "defaultValue": "'close'"
+      },
+      "iconSize": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "icon-size",
+        "reflect": false,
+        "defaultValue": "16"
+      },
+      "state": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'brand' | 'danger' | 'success' | 'warning' | 'neutral'",
+          "resolved": "\"brand\" | \"danger\" | \"neutral\" | \"success\" | \"warning\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "state",
+        "reflect": false,
+        "defaultValue": "'neutral'"
+      },
+      "size": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'S' | 'M'",
+          "resolved": "\"M\" | \"S\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "size",
+        "reflect": false,
+        "defaultValue": "'M'"
+      },
+      "variant": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'primary' | 'secondary'",
+          "resolved": "\"primary\" | \"secondary\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "variant",
+        "reflect": false
+      },
+      "hasStartIcon": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "has-start-icon",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "hasEndIcon": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "has-end-icon",
+        "reflect": false,
+        "defaultValue": "true"
+      }
+    };
+  }
+}