@3t-transform/threeteeui 1.9.64 → 1.9.65

package/dist/esm/tttx-button-v2_1_9_64.entry.js

@@ -1,117 +0,0 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-6b9af9c9.js';
-
-const tttxButtonV2Css = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}:host{display:inline-block}button{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;line-height:16px;white-space:nowrap;vertical-align:middle;font-weight:600;text-transform:none;cursor:pointer;background:transparent;min-width:96px;max-width:240px;box-sizing:border-box}button:disabled{cursor:not-allowed}button.notext{min-width:40px;max-width:40px;height:40px;padding:8px;aspect-ratio:1/1;justify-content:center;align-items:center;box-sizing:border-box}button:focus-visible{outline:2px solid currentColor;outline-offset:2px}.label-text{display:inline-block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}button.button.btn-size-s{font-size:13px;padding:6px 10px;gap:4px}button.button.btn-size-m{font-size:14px;padding:8px 12px;gap:4px}button.button.btn-size-l{font-size:16px;padding:12px 24px;gap:8px}button.btn-primary{background-color:#1479c6;border:1px solid #1479c6;color:#ffffff;transition:background-color 0.2s ease}button.btn-primary:hover:not(:disabled){background-color:#146eb3}button.btn-primary:active:not(:disabled){background-color:#115a8f}button.btn-primary:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-secondary{background-color:#ffffff;color:#17272b;border:1px solid #D4D4D4;transition:background-color 0.2s ease}button.btn-secondary:hover:not(:disabled){background-color:#fafafa}button.btn-secondary:active:not(:disabled){background-color:#f5f5f5}button.btn-secondary:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-danger{background-color:#dc2626;color:#ffffff;transition:background-color 0.2s ease;border:1px solid #DC2626}button.btn-danger:hover:not(:disabled){background-color:#b91c1c}button.btn-danger:active:not(:disabled){background-color:#991b1b}button.btn-danger:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-success{background-color:#16a34a;color:#ffffff;transition:background-color 0.2s ease;border:1px solid #16a34a}button.btn-success:hover:not(:disabled){background-color:#15803d}button.btn-success:active:not(:disabled){background-color:#166534}button.btn-success:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-warning{background-color:#eab308;color:#ffffff;transition:background-color 0.2s ease;border:1px solid #eab308}button.btn-warning:hover:not(:disabled){background-color:#ca8a04}button.btn-warning:active:not(:disabled){background-color:#885544}button.btn-warning:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-light{background-color:#000000;color:#ffffff;border:1px solid #000000}button.btn-light:hover:not(:disabled){background-color:#222222}button.btn-light:active:not(:disabled){background-color:#1a1a1a}button.btn-transparent{background:transparent;border:1px solid transparent;box-shadow:none;color:#1479c6;border:1px solid transparent}button.btn-transparent:hover:not(:disabled){background:rgba(0, 0, 0, 0.04)}button.btn-transparent:disabled{opacity:0.4;pointer-events:none}button.icon-start .button-content,button.icon-end .button-content{gap:8px}button.icon-start .icon-left,button.icon-end .icon-right{display:flex;align-items:center;justify-content:center}.button-content{font-family:Roboto;display:inline-flex;align-items:center;justify-content:center;gap:4px;width:100%}.button-content:not(:has(.icon-left,.icon-right)){justify-content:center}button.notext .button-content{justify-content:center !important;align-items:center;width:100%;display:flex;gap:0}tttx-icon,tttx-icon_1_9_64{cursor:inherit;display:inline-flex;vertical-align:middle;font-size:16px}.button-wrapper{position:relative}.button-wrapper .dropdown-list{position:absolute;top:100%;left:0;list-style:none;z-index:1;width:260px;border-radius:8px;padding:4px;background-color:white;border:1px solid #d4d4d4;margin-top:8px}.button-wrapper .dropdown-list .dropdown-option{padding:8px;cursor:pointer;white-space:nowrap;font-family:Roboto;font-size:14px;font-weight:400;line-height:16px}.button-wrapper .dropdown-list .dropdown-option:hover,.button-wrapper .dropdown-list .dropdown-option:focus{background-color:#f5f5f5;border-radius:8px}.button-wrapper .dropdown-button{border-radius:4px;width:100%;justify-content:space-between}.button-wrapper .dropdown-button:hover{background-color:#f0f0f0}.button-wrapper .dropdown-button:active{background-color:#e3e3e3}.button-wrapper .dropdown-button .dropdown-arrow{display:flex;align-items:center;margin-left:8px}.button-wrapper .dropdown-button .dropdown-arrow .hydrated{display:flex;align-items:center}.dropdown-item-content{display:flex;align-items:center;gap:8px}.dropdown-item-icon{display:flex;align-items:center;justify-content:center}";
-
-const TttxButton = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.buttonDropdownChange = createEvent(this, "buttonDropdownChange", 7);
-    this.toggleDropdown = () => {
-      if (!this.isDisabled) {
-        this.dropdownOpen = !this.dropdownOpen;
-      }
-    };
-    this.handleDropdownItemClick = (item) => {
-      this.dropdownOpen = false;
-      this.buttonDropdownChange.emit(item);
-    };
-    this.notext = false;
-    this.icon = undefined;
-    this.label = undefined;
-    this.iconcolor = 'black';
-    this.iconposition = 'left';
-    this.iconStart = undefined;
-    this.iconEnd = undefined;
-    this.design = 'primary';
-    this.disabled = false;
-    this.type = 'button';
-    this.href = undefined;
-    this.options = [];
-    this.size = 'M';
-    this.dropdownOpen = false;
-  }
-  get isDisabled() {
-    return this.disabled || this.design === 'disabled';
-  }
-  get parsedOptions() {
-    if (Array.isArray(this.options)) {
-      return this.options.map(opt => (typeof opt === 'string' ? { label: opt } : opt));
-    }
-    try {
-      const parsed = JSON.parse(this.options);
-      return parsed.map((opt) => (typeof opt === 'string' ? { label: opt } : opt));
-    }
-    catch (_a) {
-      return [];
-    }
-  }
-  get iconSize() {
-    switch (this.size) {
-      case 'L':
-        return 24;
-      case 'M':
-        return 20;
-      case 'S':
-      default:
-        return 16;
-    }
-  }
-  componentWillLoad() {
-    const validDesigns = [
-      'primary',
-      'secondary',
-      'default',
-      'disabled',
-      'danger',
-      'light',
-      'success',
-      'warning',
-      'transparent'
-    ];
-    const validSizes = ['S', 'M', 'L'];
-    if (!validDesigns.includes(this.design)) {
-      this.design = 'primary';
-    }
-    if (!validSizes.includes(this.size)) {
-      this.size = 'M';
-    }
-    if (['primary', 'danger', 'light', 'success', 'warning'].includes(this.design)) {
-      this.iconcolor = 'white';
-    }
-    if (this.design === 'transparent') {
-      this.iconcolor = '#1479c6';
-    }
-  }
-  handleClickOutside(event) {
-    if (this.dropdownOpen && !this.host.contains(event.target)) {
-      this.dropdownOpen = false;
-    }
-  }
-  renderButtonContent() {
-    var _a;
-    return (h("div", { class: "button-content" }, this.iconStart && (h("div", { class: "icon-left" }, h("tttx-icon_1_9_64", { icon: this.iconStart, color: this.iconcolor, size: this.iconSize }))), !this.notext && (h("div", { class: "label-text" }, (_a = this.label) !== null && _a !== void 0 ? _a : h("slot", null))), this.iconEnd && (h("div", { class: "icon-right" }, h("tttx-icon_1_9_64", { icon: this.iconEnd, color: this.iconcolor, size: this.iconSize }))), this.type === 'dropdown' && (h("div", { class: "dropdown-arrow" }, h("tttx-icon_1_9_64", { icon: "keyboard_arrow_down", color: this.iconcolor, size: this.iconSize })))));
-  }
-  renderDropdownList() {
-    if (this.type !== 'dropdown' || !this.dropdownOpen)
-      return null;
-    return (h("ul", { class: "dropdown-list", role: "listbox" }, this.parsedOptions.map((item, index) => (h("li", { class: "dropdown-option", role: "option", tabindex: 0, key: index, onClick: () => this.handleDropdownItemClick(item.label) }, h("div", { class: "dropdown-item-content" }, item.icon && (h("tttx-icon_1_9_64", { icon: item.icon, color: "black", size: this.iconSize, class: "dropdown-item-icon" })), h("span", { class: "dropdown-item-label" }, item.label)))))));
-  }
-  render() {
-    const classes = [
-      'button',
-      `btn-${this.design}`,
-      this.iconStart ? 'icon-start' : '',
-      this.iconEnd ? 'icon-end' : '',
-      this.notext ? 'notext' : '',
-      this.type === 'dropdown' ? 'dropdown-button' : '',
-      `btn-size-${this.size.toLowerCase()}`
-    ]
-      .filter(Boolean)
-      .join(' ');
-    return (h(Host, null, h("div", { class: "button-wrapper" }, h("button", { class: classes, disabled: this.isDisabled, onClick: this.type === 'dropdown' ? this.toggleDropdown : undefined, "aria-haspopup": this.type === 'dropdown' ? 'listbox' : undefined, "aria-expanded": this.type === 'dropdown' ? String(this.dropdownOpen) : undefined }, this.renderButtonContent()), this.renderDropdownList())));
-  }
-  get host() { return getElement(this); }
-};
-TttxButton.style = tttxButtonV2Css;
-
-export { TttxButton as tttx_button_v2_1_9_64 };

package/dist/tttx/p-1c0db631.entry.js

@@ -1 +0,0 @@
-import{r as t,c as o,h as n,H as r,g as i}from"./p-c2a82822.js";const e=class{constructor(n){t(this,n),this.buttonDropdownChange=o(this,"buttonDropdownChange",7),this.toggleDropdown=()=>{this.isDisabled||(this.dropdownOpen=!this.dropdownOpen)},this.handleDropdownItemClick=t=>{this.dropdownOpen=!1,this.buttonDropdownChange.emit(t)},this.notext=!1,this.icon=void 0,this.label=void 0,this.iconcolor="black",this.iconposition="left",this.iconStart=void 0,this.iconEnd=void 0,this.design="primary",this.disabled=!1,this.type="button",this.href=void 0,this.options=[],this.size="M",this.dropdownOpen=!1}get isDisabled(){return this.disabled||"disabled"===this.design}get parsedOptions(){if(Array.isArray(this.options))return this.options.map((t=>"string"==typeof t?{label:t}:t));try{return JSON.parse(this.options).map((t=>"string"==typeof t?{label:t}:t))}catch(t){return[]}}get iconSize(){switch(this.size){case"L":return 24;case"M":return 20;default:return 16}}componentWillLoad(){["primary","secondary","default","disabled","danger","light","success","warning","transparent"].includes(this.design)||(this.design="primary"),["S","M","L"].includes(this.size)||(this.size="M"),["primary","danger","light","success","warning"].includes(this.design)&&(this.iconcolor="white"),"transparent"===this.design&&(this.iconcolor="#1479c6")}handleClickOutside(t){this.dropdownOpen&&!this.host.contains(t.target)&&(this.dropdownOpen=!1)}renderButtonContent(){var t;return n("div",{class:"button-content"},this.iconStart&&n("div",{class:"icon-left"},n("tttx-icon_1_9_64",{icon:this.iconStart,color:this.iconcolor,size:this.iconSize})),!this.notext&&n("div",{class:"label-text"},null!==(t=this.label)&&void 0!==t?t:n("slot",null)),this.iconEnd&&n("div",{class:"icon-right"},n("tttx-icon_1_9_64",{icon:this.iconEnd,color:this.iconcolor,size:this.iconSize})),"dropdown"===this.type&&n("div",{class:"dropdown-arrow"},n("tttx-icon_1_9_64",{icon:"keyboard_arrow_down",color:this.iconcolor,size:this.iconSize})))}renderDropdownList(){return"dropdown"===this.type&&this.dropdownOpen?n("ul",{class:"dropdown-list",role:"listbox"},this.parsedOptions.map(((t,o)=>n("li",{class:"dropdown-option",role:"option",tabindex:0,key:o,onClick:()=>this.handleDropdownItemClick(t.label)},n("div",{class:"dropdown-item-content"},t.icon&&n("tttx-icon_1_9_64",{icon:t.icon,color:"black",size:this.iconSize,class:"dropdown-item-icon"}),n("span",{class:"dropdown-item-label"},t.label)))))):null}render(){const t=["button",`btn-${this.design}`,this.iconStart?"icon-start":"",this.iconEnd?"icon-end":"",this.notext?"notext":"","dropdown"===this.type?"dropdown-button":"",`btn-size-${this.size.toLowerCase()}`].filter(Boolean).join(" ");return n(r,null,n("div",{class:"button-wrapper"},n("button",{class:t,disabled:this.isDisabled,onClick:"dropdown"===this.type?this.toggleDropdown:void 0,"aria-haspopup":"dropdown"===this.type?"listbox":void 0,"aria-expanded":"dropdown"===this.type?String(this.dropdownOpen):void 0},this.renderButtonContent()),this.renderDropdownList()))}get host(){return i(this)}};e.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}:host{display:inline-block}button{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;line-height:16px;white-space:nowrap;vertical-align:middle;font-weight:600;text-transform:none;cursor:pointer;background:transparent;min-width:96px;max-width:240px;box-sizing:border-box}button:disabled{cursor:not-allowed}button.notext{min-width:40px;max-width:40px;height:40px;padding:8px;aspect-ratio:1/1;justify-content:center;align-items:center;box-sizing:border-box}button:focus-visible{outline:2px solid currentColor;outline-offset:2px}.label-text{display:inline-block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}button.button.btn-size-s{font-size:13px;padding:6px 10px;gap:4px}button.button.btn-size-m{font-size:14px;padding:8px 12px;gap:4px}button.button.btn-size-l{font-size:16px;padding:12px 24px;gap:8px}button.btn-primary{background-color:#1479c6;border:1px solid #1479c6;color:#ffffff;transition:background-color 0.2s ease}button.btn-primary:hover:not(:disabled){background-color:#146eb3}button.btn-primary:active:not(:disabled){background-color:#115a8f}button.btn-primary:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-secondary{background-color:#ffffff;color:#17272b;border:1px solid #D4D4D4;transition:background-color 0.2s ease}button.btn-secondary:hover:not(:disabled){background-color:#fafafa}button.btn-secondary:active:not(:disabled){background-color:#f5f5f5}button.btn-secondary:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-danger{background-color:#dc2626;color:#ffffff;transition:background-color 0.2s ease;border:1px solid #DC2626}button.btn-danger:hover:not(:disabled){background-color:#b91c1c}button.btn-danger:active:not(:disabled){background-color:#991b1b}button.btn-danger:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-success{background-color:#16a34a;color:#ffffff;transition:background-color 0.2s ease;border:1px solid #16a34a}button.btn-success:hover:not(:disabled){background-color:#15803d}button.btn-success:active:not(:disabled){background-color:#166534}button.btn-success:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-warning{background-color:#eab308;color:#ffffff;transition:background-color 0.2s ease;border:1px solid #eab308}button.btn-warning:hover:not(:disabled){background-color:#ca8a04}button.btn-warning:active:not(:disabled){background-color:#885544}button.btn-warning:disabled{background-color:#e5e5e5;color:#525252;border-color:#d4d4d4}button.btn-light{background-color:#000000;color:#ffffff;border:1px solid #000000}button.btn-light:hover:not(:disabled){background-color:#222222}button.btn-light:active:not(:disabled){background-color:#1a1a1a}button.btn-transparent{background:transparent;border:1px solid transparent;box-shadow:none;color:#1479c6;border:1px solid transparent}button.btn-transparent:hover:not(:disabled){background:rgba(0, 0, 0, 0.04)}button.btn-transparent:disabled{opacity:0.4;pointer-events:none}button.icon-start .button-content,button.icon-end .button-content{gap:8px}button.icon-start .icon-left,button.icon-end .icon-right{display:flex;align-items:center;justify-content:center}.button-content{font-family:Roboto;display:inline-flex;align-items:center;justify-content:center;gap:4px;width:100%}.button-content:not(:has(.icon-left,.icon-right)){justify-content:center}button.notext .button-content{justify-content:center !important;align-items:center;width:100%;display:flex;gap:0}tttx-icon,tttx-icon_1_9_64{cursor:inherit;display:inline-flex;vertical-align:middle;font-size:16px}.button-wrapper{position:relative}.button-wrapper .dropdown-list{position:absolute;top:100%;left:0;list-style:none;z-index:1;width:260px;border-radius:8px;padding:4px;background-color:white;border:1px solid #d4d4d4;margin-top:8px}.button-wrapper .dropdown-list .dropdown-option{padding:8px;cursor:pointer;white-space:nowrap;font-family:Roboto;font-size:14px;font-weight:400;line-height:16px}.button-wrapper .dropdown-list .dropdown-option:hover,.button-wrapper .dropdown-list .dropdown-option:focus{background-color:#f5f5f5;border-radius:8px}.button-wrapper .dropdown-button{border-radius:4px;width:100%;justify-content:space-between}.button-wrapper .dropdown-button:hover{background-color:#f0f0f0}.button-wrapper .dropdown-button:active{background-color:#e3e3e3}.button-wrapper .dropdown-button .dropdown-arrow{display:flex;align-items:center;margin-left:8px}.button-wrapper .dropdown-button .dropdown-arrow .hydrated{display:flex;align-items:center}.dropdown-item-content{display:flex;align-items:center;gap:8px}.dropdown-item-icon{display:flex;align-items:center;justify-content:center}';export{e as tttx_button_v2_1_9_64}