@lazhus/kg-ui 0.9.7 → 0.9.9

package/custom-elements.json

@@ -3646,7 +3646,7 @@
               "kind": "field",
               "name": "styles",
               "static": true,
-              "default": "css` :host { display: block; --kg-modal-z-index: 2000; } .kg-modal-dimmer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); backdrop-filter: blur(5px); display: flex; align-items: center; justify-content: center; z-index: var(--kg-modal-z-index); opacity: 0; visibility: hidden; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); padding: var(--kg-space-md); box-sizing: border-box; } .kg-modal-dimmer.open { opacity: 1; visibility: visible; } .kg-modal-content { background: var(--kg-bg); color: var(--kg-text); border-radius: var(--kg-radius-lg); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); width: 100%; max-width: 600px; transform: scale(0.95) translateY(10px); transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); display: flex; flex-direction: column; max-height: 90vh; overflow: hidden; } .kg-modal-dimmer.open .kg-modal-content { transform: scale(1) translateY(0); } /* Sizes */ .size-mini { max-width: 350px; } .size-tiny { max-width: 450px; } .size-small { max-width: 550px; } .size-large { max-width: 900px; } .size-fullscreen { max-width: 95vw; height: 95vh; } /* Basic style */ :host([basic]) .kg-modal-content { background: transparent; box-shadow: none; color: white; } .modal-header { padding: var(--kg-space-lg); font-size: 1.25rem; font-weight: 700; border-bottom: 1px solid var(--kg-border); display: flex; justify-content: space-between; align-items: center; } .modal-body { padding: var(--kg-space-lg); overflow-y: auto; flex: 1; } .modal-footer { padding: var(--kg-space-md) var(--kg-space-lg); border-top: 1px solid var(--kg-border); background: var(--kg-surface); display: flex; justify-content: flex-end; gap: 0.75rem; } .close-button { background: none; border: none; color: var(--kg-text-muted); cursor: pointer; font-size: 1.5rem; padding: 0.5rem; line-height: 1; border-radius: var(--kg-radius-sm); transition: all 0.2s; } .close-button:hover { background: var(--kg-surface); color: var(--kg-text); } `"
+              "default": "css` :host { display: block; --kg-modal-z-index: 2000; } .kg-modal-dimmer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); backdrop-filter: blur(5px); display: flex; align-items: center; justify-content: center; z-index: var(--kg-modal-z-index); opacity: 0; visibility: hidden; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); padding: var(--kg-space-md); box-sizing: border-box; } .kg-modal-dimmer.open { opacity: 1; visibility: visible; } .kg-modal-content { background: var(--kg-bg); color: var(--kg-text); border-radius: var(--kg-radius-lg); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); width: 100%; max-width: 600px; transform: scale(0.95) translateY(10px); transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); display: flex; flex-direction: column; max-height: 90vh; overflow: visible; } .kg-modal-dimmer.open .kg-modal-content { transform: scale(1) translateY(0); } /* Sizes */ .size-mini { max-width: 350px; } .size-tiny { max-width: 450px; } .size-small { max-width: 550px; } .size-large { max-width: 900px; } .size-fullscreen { max-width: 95vw; height: 95vh; } /* Basic style */ :host([basic]) .kg-modal-content { background: transparent; box-shadow: none; color: white; } .modal-header { padding: var(--kg-space-lg); font-size: 1.25rem; font-weight: 700; border-bottom: 1px solid var(--kg-border); display: flex; justify-content: space-between; align-items: center; } .modal-body { padding: var(--kg-space-lg); overflow-y: auto; flex: 1; } .modal-footer { padding: var(--kg-space-md) var(--kg-space-lg); border-top: 1px solid var(--kg-border); background: var(--kg-surface); display: flex; justify-content: flex-end; gap: 0.75rem; } .close-button { background: none; border: none; color: var(--kg-text-muted); cursor: pointer; font-size: 1.5rem; padding: 0.5rem; line-height: 1; border-radius: var(--kg-radius-sm); transition: all 0.2s; } .close-button:hover { background: var(--kg-surface); color: var(--kg-text); } `"
             },
             {
               "kind": "field",

package/dist/components/kg-modal.js

@@ -57,7 +57,7 @@ var e=Object.defineProperty,o=(o,t,i)=>((o,t,i)=>t in o?e(o,t,{enumerable:!0,con
       display: flex;
       flex-direction: column;
       max-height: 90vh;
-      overflow: hidden;
+      overflow: visible;
     }
 
     .kg-modal-dimmer.open .kg-modal-content {

package/dist/components/kg-select.js

@@ -1,4 +1,4 @@
-var e,t=Object.defineProperty;import{LitElement as r,css as i,html as s}from"lit";import"lit/directives/class-map.js";import{F as o}from"../chunks/FormAssociated-Cx5D8YQA.js";class a extends(o(r)){static get properties(){return{...super.properties,options:{type:Array},value:{type:Object},placeholder:{type:String},label:{type:String},multiple:{type:Boolean},searchable:{type:Boolean},clearable:{type:Boolean},_open:{type:Boolean,state:!0},_searchQuery:{type:String,state:!0}}}constructor(){super(),this.options=[],this.value=null,this.placeholder="Seçiniz...",this.multiple=!1,this.searchable=!1,this.clearable=!1,this._open=!1,this._searchQuery="",this._handleOutsideClick=this._handleOutsideClick.bind(this)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this._handleOutsideClick)}_updateFormValue(){if(this.multiple&&Array.isArray(this.value)){const e=new FormData;this.value.forEach(t=>e.append(this.name,t)),this.internals.setFormValue(e)}else this.internals.setFormValue(this.value)}_handleOutsideClick(e){this._open&&(e.composedPath().includes(this)||this._closeDropdown())}_toggleDropdown(e){this.disabled||(this._open=!this._open,this._open&&(this._searchQuery="",this._positionDropdown(),setTimeout(()=>{const e=this.shadowRoot.querySelector(".search-input");e&&e.focus()},100)))}_positionDropdown(){requestAnimationFrame(()=>{const e=this.shadowRoot.querySelector(".select-trigger"),t=this.shadowRoot.querySelector(".select-dropdown");if(!e||!t)return;const r=e.getBoundingClientRect();t.style.top=`${r.bottom+5}px`,t.style.left=`${r.left}px`,t.style.width=`${r.width}px`})}_closeDropdown(){this._open=!1}_selectOption(e,t){if(t.stopPropagation(),this.multiple){let t=Array.isArray(this.value)?[...this.value]:[];const r=t.indexOf(e.value);r>-1?t.splice(r,1):t.push(e.value),this.value=t}else this.value=e.value,this._closeDropdown();this._dispatchChange()}_dispatchChange(){this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))}_clearValue(e){e.stopPropagation(),this.value=this.multiple?[]:null,this._dispatchChange(),this._open&&this._closeDropdown()}_handleSearch(e){this._searchQuery=e.target.value.toLowerCase()}_removeTag(e,t){t.stopPropagation();let r=[...this.value];const i=r.indexOf(e);i>-1&&(r.splice(i,1),this.value=r,this._dispatchChange())}render(){const e=e=>this.multiple&&Array.isArray(this.value)?this.value.includes(e):this.value===e,t=(()=>{if(!this.value)return null;if(this.multiple&&Array.isArray(this.value))return this.options.filter(e=>this.value.includes(e.value));const e=this.options.find(e=>e.value===this.value);return e?e.label:null})(),r=(this.options||[]).filter(e=>e.label.toLowerCase().includes(this._searchQuery||""));return s`
+var e,t=Object.defineProperty;import{LitElement as r,css as i,html as s}from"lit";import"lit/directives/class-map.js";import{F as o}from"../chunks/FormAssociated-Cx5D8YQA.js";class a extends(o(r)){static get properties(){return{...super.properties,options:{type:Array},value:{type:Object},placeholder:{type:String},label:{type:String},multiple:{type:Boolean},searchable:{type:Boolean},clearable:{type:Boolean},_open:{type:Boolean,state:!0},_searchQuery:{type:String,state:!0}}}constructor(){super(),this.options=[],this.value=null,this.placeholder="Seçiniz...",this.multiple=!1,this.searchable=!1,this.clearable=!1,this._open=!1,this._searchQuery="",this._handleOutsideClick=this._handleOutsideClick.bind(this)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this._handleOutsideClick)}_updateFormValue(){if(this.multiple&&Array.isArray(this.value)){const e=new FormData;this.value.forEach(t=>e.append(this.name,t)),this.internals.setFormValue(e)}else this.internals.setFormValue(this.value)}_handleOutsideClick(e){this._open&&(e.composedPath().includes(this)||this._closeDropdown())}_toggleDropdown(e){this.disabled||(this._open=!this._open,this._open&&(this._searchQuery="",this._positionDropdown(),setTimeout(()=>{const e=this.shadowRoot.querySelector(".search-input");e&&e.focus()},100)))}_positionDropdown(){requestAnimationFrame(()=>{const e=this.shadowRoot.querySelector(".select-trigger"),t=this.shadowRoot.querySelector(".select-dropdown");if(!e||!t)return;const r=e.getBoundingClientRect();t.style.top="0px",t.style.left="0px";const i=t.getBoundingClientRect(),s=i.left,o=i.top;t.style.top=r.bottom+5-o+"px",t.style.left=r.left-s+"px",t.style.width=`${r.width}px`})}_closeDropdown(){this._open=!1}_selectOption(e,t){if(t.stopPropagation(),this.multiple){let t=Array.isArray(this.value)?[...this.value]:[];const r=t.indexOf(e.value);r>-1?t.splice(r,1):t.push(e.value),this.value=t}else this.value=e.value,this._closeDropdown();this._dispatchChange()}_dispatchChange(){this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))}_clearValue(e){e.stopPropagation(),this.value=this.multiple?[]:null,this._dispatchChange(),this._open&&this._closeDropdown()}_handleSearch(e){this._searchQuery=e.target.value.toLowerCase()}_removeTag(e,t){t.stopPropagation();let r=[...this.value];const i=r.indexOf(e);i>-1&&(r.splice(i,1),this.value=r,this._dispatchChange())}render(){const e=e=>this.multiple&&Array.isArray(this.value)?this.value.includes(e):this.value===e,t=(()=>{if(!this.value)return null;if(this.multiple&&Array.isArray(this.value))return this.options.filter(e=>this.value.includes(e.value));const e=this.options.find(e=>e.value===this.value);return e?e.label:null})(),r=(this.options||[]).filter(e=>e.label.toLowerCase().includes(this._searchQuery||""));return s`
       <div class="kg-select-container">
         ${this.label?s`<label class="select-label">${this.label}</label>`:""}
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lazhus/kg-ui",
-  "version": "0.9.7",
+  "version": "0.9.9",
   "type": "module",
   "files": [
     "dist",