@cubit-ui/core 2.0.0 → 2.0.1
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.
- package/dist/base/ui-element.d.ts.map +1 -1
- package/dist/index.cjs +28 -28
- package/dist/index.js +141 -120
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ui-element.d.ts","sourceRoot":"","sources":["../../src/base/ui-element.ts"],"names":[],"mappings":"AAAA;;;GAGG;
|
|
1
|
+
{"version":3,"file":"ui-element.d.ts","sourceRoot":"","sources":["../../src/base/ui-element.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAmCH,8BAAsB,SAAU,SAAQ,WAAW;IACjD,4EAA4E;IAC5E,MAAM,CAAC,cAAc,UAAS;IAE9B,SAAS,CAAC,IAAI,EAAE,UAAU,CAAC;IAC3B,SAAS,CAAC,SAAS,EAAE,gBAAgB,GAAG,IAAI,CAAQ;IACpD,gEAAgE;IAChE,SAAS,CAAC,YAAY,UAAS;IAC/B,OAAO,CAAC,cAAc,CAAgC;;IAetD,oCAAoC;IACpC,SAAS,CAAC,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAIlD,6DAA6D;IAC7D,oBAAoB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI;IAK7C,iBAAiB,IAAI,IAAI;IAOzB,oBAAoB,IAAI,IAAI;IAM5B;;;OAGG;IACH,SAAS,CAAC,MAAM,CAAC,CAAC,SAAS,MAAM,mBAAmB,EAClD,IAAI,EAAE,CAAC,EACP,OAAO,EAAE,CAAC,KAAK,EAAE,mBAAmB,CAAC,CAAC,CAAC,KAAK,IAAI,GAC/C,IAAI;IACP,SAAS,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa,GAAG,IAAI;IAK5D;;OAEG;IACH,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM;IAS5C;;OAEG;IACH,SAAS,CAAC,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAQxC,wBAAwB,CACtB,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,MAAM,GAAG,IAAI,EACvB,QAAQ,EAAE,MAAM,GAAG,IAAI,GACtB,IAAI;IAMP;;;OAGG;IACH,SAAS,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,WAAW;IAQnD;;OAEG;IACH,SAAS,CAAC,IAAI,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,CAAC,GAAG,OAAO;IAU9D;;OAEG;IACH,SAAS,CAAC,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAI/C,SAAS,CAAC,cAAc,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,GAAG,IAAI;IAQ5D;;OAEG;IACH,SAAS,CAAC,QAAQ,CAAC,MAAM,IAAI,IAAI;CAClC"}
|
package/dist/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var nt=Object.defineProperty;var lt=(a,e,t)=>e in a?nt(a,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[e]=t;var c=(a,e,t)=>lt(a,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=new WeakSet;function ct(a){return a.replace(/[A-Z]/g,e=>`-${e.toLowerCase()}`)}function dt(a){if(S.has(a))return;S.add(a);const e=new Set(a.observedAttributes??[]);for(let t=a.prototype;t&&t!==l.prototype;t=Object.getPrototypeOf(t))for(const r of Object.getOwnPropertyNames(t)){const i=ct(r);if(!e.has(i))continue;const o=Object.getOwnPropertyDescriptor(t,r);!o||!o.get||o.set||Object.defineProperty(t,r,{...o,set(s){s==null||s===!1?this.removeAttribute(i):this.setAttribute(i,s===!0?"":String(s))}})}}class l extends HTMLElement{constructor(){super();c(this,"root");c(this,"internals",null);c(this,"formDisabled",!1);c(this,"lifecycleAbort",null);if(this.root=this.attachShadow({mode:"open"}),dt(this.constructor),this.constructor.formAssociated&&typeof this.attachInternals=="function")try{this.internals=this.attachInternals()}catch{this.internals=null}}setFormValue(t){var r;(r=this.internals)==null||r.setFormValue(t)}formDisabledCallback(t){this.formDisabled=t,this.render()}connectedCallback(){var t;(t=this.lifecycleAbort)==null||t.abort(),this.lifecycleAbort=new AbortController,this.render()}disconnectedCallback(){var t;(t=this.lifecycleAbort)==null||t.abort(),this.lifecycleAbort=null}listen(t,r){var i;this.addEventListener(t,r,{signal:(i=this.lifecycleAbort)==null?void 0:i.signal})}escapeHtml(t){return String(t??"").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'")}safeUrl(t){const r=t.trim(),i=r.replace(/[\u0000-\u0020]/g,"").match(/^([a-z][a-z0-9+.-]*):/i);return i&&!["http","https","mailto","tel"].includes((i[1]??"").toLowerCase())?"":this.escapeHtml(r)}attributeChangedCallback(t,r,i){r!==i&&this.render()}composedTarget(t){const r=t.composedPath();for(const i of r)if(i instanceof HTMLElement)return i;return t.target}emit(t,r){const i=new CustomEvent(t,{bubbles:!0,cancelable:!0,composed:!0,detail:r});return this.dispatchEvent(i)}getBooleanAttr(t){return this.hasAttribute(t)}setBooleanAttr(t,r){r?this.setAttribute(t,""):this.removeAttribute(t)}}c(l,"formAssociated",!1);const y=class y{constructor(e){c(this,"element");c(this,"firstFocusableEl",null);c(this,"lastFocusableEl",null);c(this,"handleKeyDownBound");c(this,"active",!1);this.element=e,this.handleKeyDownBound=this.handleKeyDown.bind(this)}activate(){this.updateFocusableElements(),this.firstFocusableEl&&this.firstFocusableEl.focus(),document.addEventListener("keydown",this.handleKeyDownBound),this.active=!0}deactivate(){this.active&&(document.removeEventListener("keydown",this.handleKeyDownBound),this.active=!1)}updateFocusableElements(){const e=Array.from(this.element.querySelectorAll(y.FOCUSABLE_SELECTORS)).filter(t=>t.offsetParent!==null||t.offsetWidth>0||t.offsetHeight>0);this.firstFocusableEl=e[0]||null,this.lastFocusableEl=e[e.length-1]||null}handleKeyDown(e){if(e.key==="Tab"){if(this.updateFocusableElements(),!this.firstFocusableEl||!this.lastFocusableEl){e.preventDefault();return}e.shiftKey?(document.activeElement===this.firstFocusableEl||this.element===document.activeElement)&&(this.lastFocusableEl.focus(),e.preventDefault()):document.activeElement===this.lastFocusableEl&&(this.firstFocusableEl.focus(),e.preventDefault())}}};c(y,"FOCUSABLE_SELECTORS",["a[href]","button:not([disabled])","textarea:not([disabled])","input:not([disabled])","select:not([disabled])",'[tabindex]:not([tabindex="-1"])',"ui-button:not([disabled])","ui-input:not([disabled])"].join(","));let g=y;class L extends l{static get observedAttributes(){return["variant","size","disabled","type","aria-label"]}get variant(){return this.getAttribute("variant")||"primary"}get size(){return this.getAttribute("size")||"md"}get disabled(){return this.getBooleanAttr("disabled")}set disabled(e){this.setBooleanAttr("disabled",e)}get type(){return this.getAttribute("type")||"button"}render(){const e=this.variant,t=this.size,r=this.disabled,i=this.getAttribute("aria-label")||"";this.root.innerHTML=`
|
|
2
2
|
<style>
|
|
3
3
|
:host {
|
|
4
4
|
display: inline-block;
|
|
@@ -108,7 +108,7 @@
|
|
|
108
108
|
>
|
|
109
109
|
<slot></slot>
|
|
110
110
|
</button>
|
|
111
|
-
`;const o=this.root.querySelector("button");o&&(o.onclick=s=>{if(this.disabled){s.preventDefault(),s.stopImmediatePropagation();return}if(this.type==="submit"){const n=this.closest("form");n&&n.requestSubmit()}else if(this.type==="reset"){const n=this.closest("form");n&&n.reset()}})}}customElements.get("ui-button")||customElements.define("ui-button",
|
|
111
|
+
`;const o=this.root.querySelector("button");o&&(o.onclick=s=>{if(this.disabled){s.preventDefault(),s.stopImmediatePropagation();return}if(this.type==="submit"){const n=this.closest("form");n&&n.requestSubmit()}else if(this.type==="reset"){const n=this.closest("form");n&&n.reset()}})}}customElements.get("ui-button")||customElements.define("ui-button",L);class A extends l{constructor(){super(...arguments);c(this,"defaultValue","")}static get observedAttributes(){return["value","placeholder","type","disabled","readonly","size","invalid","aria-label"]}get value(){const t=this.root.querySelector("input");return t?t.value:this.getAttribute("value")||""}set value(t){this.setAttribute("value",t);const r=this.root.querySelector("input");r&&(r.value=t)}get disabled(){return this.getBooleanAttr("disabled")||this.formDisabled}set disabled(t){this.setBooleanAttr("disabled",t)}get invalid(){return this.getBooleanAttr("invalid")}set invalid(t){this.setBooleanAttr("invalid",t)}attributeChangedCallback(t,r,i){if(t==="value"&&r!==i){this.setFormValue(i??"");const o=this.root.querySelector("input");if(o){if(o.value!==i){const s=o.selectionStart??null,n=o.selectionEnd??null;if(o.value=i??"",s!==null&&n!==null&&i!==null&&s<=i.length)try{o.setSelectionRange(s,n)}catch{}}return}}super.attributeChangedCallback(t,r,i)}connectedCallback(){this.defaultValue=this.getAttribute("value")||"",super.connectedCallback()}formResetCallback(){this.value=this.defaultValue}render(){const t=this.getAttribute("type")||"text",r=this.getAttribute("placeholder")||"",i=this.getAttribute("size")||"md",o=this.disabled,s=this.hasAttribute("readonly"),n=this.invalid,d=this.getAttribute("aria-label")||"",b=this.getAttribute("value")||"";this.setFormValue(b),this.root.innerHTML=`
|
|
112
112
|
<style>
|
|
113
113
|
:host {
|
|
114
114
|
display: block;
|
|
@@ -362,7 +362,7 @@
|
|
|
362
362
|
<div class="thumb"></div>
|
|
363
363
|
</div>
|
|
364
364
|
<span class="label"><slot></slot></span>
|
|
365
|
-
`}}c(C,"formAssociated",!0);customElements.get("ui-switch")||customElements.define("ui-switch",C);class
|
|
365
|
+
`}}c(C,"formAssociated",!0);customElements.get("ui-switch")||customElements.define("ui-switch",C);class I extends l{constructor(){super();c(this,"_isOpen",!1);c(this,"_selectedValue","");c(this,"_selectedLabel","");c(this,"handleDocumentClickBound");this.handleDocumentClickBound=this.handleDocumentClick.bind(this)}static get observedAttributes(){return["value","placeholder","disabled","size","open","aria-label"]}get value(){return this._selectedValue||this.getAttribute("value")||""}set value(t){this._selectedValue=t,this.setAttribute("value",t),this.updateSelectedLabel(),this.render()}get disabled(){return this.getBooleanAttr("disabled")}set disabled(t){this.setBooleanAttr("disabled",t)}connectedCallback(){super.connectedCallback(),this._selectedValue=this.getAttribute("value")||"",this.updateSelectedLabel(),document.addEventListener("click",this.handleDocumentClickBound),this.listen("keydown",this.handleKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.handleDocumentClickBound)}handleDocumentClick(t){!this.contains(t.target)&&!this.root.contains(t.target)&&this.close()}handleKeyDown(t){this.disabled||(t.key===" "||t.key==="Enter"?(t.preventDefault(),this.toggle()):t.key==="Escape"&&this._isOpen&&(t.preventDefault(),this.close()))}toggle(){this.disabled||(this._isOpen?this.close():this.open())}open(){this.disabled||this._isOpen||(this._isOpen=!0,this.render(),this.emit("open"))}close(){this._isOpen&&(this._isOpen=!1,this.render(),this.emit("close"))}updateSelectedLabel(){const r=Array.from(this.querySelectorAll("ui-option")).find(i=>i.getAttribute("value")===this._selectedValue);r?this._selectedLabel=r.textContent||"":this._selectedLabel=""}render(){const t=this.disabled,r=this.getAttribute("placeholder")||"선택하세요",i=this._selectedLabel||r,o=this._isOpen,s=this.getAttribute("size")||"md";this.root.innerHTML=`
|
|
366
366
|
<style>
|
|
367
367
|
:host {
|
|
368
368
|
display: inline-block;
|
|
@@ -449,7 +449,7 @@
|
|
|
449
449
|
<div class="menu" role="listbox">
|
|
450
450
|
<slot></slot>
|
|
451
451
|
</div>
|
|
452
|
-
`;const n=this.root.querySelector(".trigger");n&&n.addEventListener("click",()=>this.toggle());const d=this.root.querySelector("slot");d&&d.addEventListener("click",b=>{const h=this.composedTarget(b).closest("ui-option");if(h){const p=h.getAttribute("value")||"";this.value=p,this.close(),this.emit("change",{value:p})}})}}class
|
|
452
|
+
`;const n=this.root.querySelector(".trigger");n&&n.addEventListener("click",()=>this.toggle());const d=this.root.querySelector("slot");d&&d.addEventListener("click",b=>{const h=this.composedTarget(b).closest("ui-option");if(h){const p=h.getAttribute("value")||"";this.value=p,this.close(),this.emit("change",{value:p})}})}}class T extends HTMLElement{connectedCallback(){this.setAttribute("role","option")}}customElements.get("ui-select")||customElements.define("ui-select",I);customElements.get("ui-option")||customElements.define("ui-option",T);class B extends l{constructor(){super();c(this,"focusTrap",null);c(this,"handleKeyDownBound");this.handleKeyDownBound=this.handleKeyDown.bind(this)}static get observedAttributes(){return["open","title","aria-label"]}get open(){return this.getBooleanAttr("open")}set open(t){this.setBooleanAttr("open",t)}get title(){return this.getAttribute("title")||""}set title(t){this.setAttribute("title",t)}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.handleKeyDownBound),this.open&&this.setupFocusTrap()}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.handleKeyDownBound),this.focusTrap&&this.focusTrap.deactivate()}attributeChangedCallback(t,r,i){super.attributeChangedCallback(t,r,i),t==="open"&&(this.open?this.setupFocusTrap():this.focusTrap&&this.focusTrap.deactivate())}setupFocusTrap(){setTimeout(()=>{this.focusTrap||(this.focusTrap=new g(this.root)),this.focusTrap.activate()},0)}handleKeyDown(t){this.open&&t.key==="Escape"&&(t.preventDefault(),this.close())}close(){this.open=!1,this.emit("close")}render(){const t=this.open,r=this.title,i=this.getAttribute("aria-label")||r||"Dialog";this.root.innerHTML=`
|
|
453
453
|
<style>
|
|
454
454
|
:host {
|
|
455
455
|
display: ${t?"block":"none"};
|
|
@@ -557,7 +557,7 @@
|
|
|
557
557
|
</div>
|
|
558
558
|
</div>
|
|
559
559
|
</div>
|
|
560
|
-
`;const o=this.root.querySelector("#backdrop"),s=this.root.querySelector("#closeBtn");o&&o.addEventListener("click",n=>{n.target===o&&this.close()}),s&&s.addEventListener("click",()=>{this.close()})}}customElements.get("ui-modal")||customElements.define("ui-modal",
|
|
560
|
+
`;const o=this.root.querySelector("#backdrop"),s=this.root.querySelector("#closeBtn");o&&o.addEventListener("click",n=>{n.target===o&&this.close()}),s&&s.addEventListener("click",()=>{this.close()})}}customElements.get("ui-modal")||customElements.define("ui-modal",B);class D extends l{constructor(){super(...arguments);c(this,"timer",null)}static get observedAttributes(){return["variant","duration","open"]}get variant(){return this.getAttribute("variant")||"info"}get open(){return this.getBooleanAttr("open")}set open(t){this.setBooleanAttr("open",t)}get duration(){return parseInt(this.getAttribute("duration")||"4000",10)}connectedCallback(){super.connectedCallback(),this.setAttribute("role","status"),this.setAttribute("aria-live","polite"),this.open&&this.startTimer()}disconnectedCallback(){super.disconnectedCallback(),this.clearTimer()}attributeChangedCallback(t,r,i){super.attributeChangedCallback(t,r,i),t==="open"&&(this.open?this.startTimer():this.clearTimer())}startTimer(){this.clearTimer(),this.duration>0&&(this.timer=window.setTimeout(()=>{this.close()},this.duration))}clearTimer(){this.timer&&(clearTimeout(this.timer),this.timer=null)}close(){this.open=!1,this.clearTimer(),this.emit("close")}render(){const t=this.variant,r=this.open;this.root.innerHTML=`
|
|
561
561
|
<style>
|
|
562
562
|
:host {
|
|
563
563
|
display: ${r?"block":"none"};
|
|
@@ -628,7 +628,7 @@
|
|
|
628
628
|
</svg>
|
|
629
629
|
</button>
|
|
630
630
|
</div>
|
|
631
|
-
`;const i=this.root.querySelector("#closeBtn");i&&i.addEventListener("click",()=>this.close())}}customElements.get("ui-toast")||customElements.define("ui-toast",
|
|
631
|
+
`;const i=this.root.querySelector("#closeBtn");i&&i.addEventListener("click",()=>this.close())}}customElements.get("ui-toast")||customElements.define("ui-toast",D);class H extends l{static get observedAttributes(){return["content","position"]}get content(){return this.getAttribute("content")||""}set content(e){this.setAttribute("content",e)}get position(){return this.getAttribute("position")||"top"}set position(e){this.setAttribute("position",e)}connectedCallback(){super.connectedCallback(),this.listen("mouseenter",this.show.bind(this)),this.listen("mouseleave",this.hide.bind(this)),this.listen("focusin",this.show.bind(this)),this.listen("focusout",this.hide.bind(this)),this.listen("keydown",e=>{e.key==="Escape"&&this.hide()})}show(){const e=this.root.querySelector(".tooltip");e&&e.classList.add("visible")}hide(){const e=this.root.querySelector(".tooltip");e&&e.classList.remove("visible")}render(){const e=this.content,t=this.position;this.root.innerHTML=`
|
|
632
632
|
<style>
|
|
633
633
|
:host {
|
|
634
634
|
display: inline-block;
|
|
@@ -681,7 +681,7 @@
|
|
|
681
681
|
<div class="tooltip ${t}" role="tooltip" aria-hidden="true">
|
|
682
682
|
${e}
|
|
683
683
|
</div>
|
|
684
|
-
`}}customElements.get("ui-tooltip")||customElements.define("ui-tooltip",
|
|
684
|
+
`}}customElements.get("ui-tooltip")||customElements.define("ui-tooltip",H);class U extends l{static get observedAttributes(){return["value"]}get value(){return this.getAttribute("value")||""}set value(e){this.setAttribute("value",e),this.syncTabsAndPanels()}connectedCallback(){super.connectedCallback(),this.listen("click",this.handleClick.bind(this)),this.listen("keydown",this.handleKeyDown.bind(this)),setTimeout(()=>this.syncTabsAndPanels(),0)}handleClick(e){const t=e.target.closest("ui-tab");if(t&&!t.hasAttribute("disabled")){const r=t.getAttribute("value")||"";this.value=r,this.emit("change",{value:r})}}handleKeyDown(e){const t=Array.from(this.querySelectorAll("ui-tab:not([disabled])"));if(!t.length)return;const r=t.findIndex(o=>o.getAttribute("value")===this.value);let i=r;if(e.key==="ArrowRight"||e.key==="ArrowDown"?(e.preventDefault(),i=(r+1)%t.length):e.key==="ArrowLeft"||e.key==="ArrowUp"?(e.preventDefault(),i=(r-1+t.length)%t.length):e.key==="Home"?(e.preventDefault(),i=0):e.key==="End"&&(e.preventDefault(),i=t.length-1),i!==r&&t[i]){const o=t[i],s=o.getAttribute("value")||"";this.value=s,o.focus(),this.emit("change",{value:s})}}syncTabsAndPanels(){const e=this.value,t=Array.from(this.querySelectorAll("ui-tab")),r=Array.from(this.querySelectorAll("ui-tab-panel"));t.forEach(i=>{const o=i.getAttribute("value")===e;i.setAttribute("aria-selected",String(o)),i.setAttribute("tabindex",o?"0":"-1")}),r.forEach(i=>{i.getAttribute("value")===e?(i.removeAttribute("hidden"),i.setAttribute("tabindex","0")):i.setAttribute("hidden","")})}render(){this.root.innerHTML=`
|
|
685
685
|
<style>
|
|
686
686
|
:host {
|
|
687
687
|
display: block;
|
|
@@ -702,7 +702,7 @@
|
|
|
702
702
|
<div class="panels-wrapper">
|
|
703
703
|
<slot></slot>
|
|
704
704
|
</div>
|
|
705
|
-
`}}class
|
|
705
|
+
`}}class M extends HTMLElement{connectedCallback(){this.setAttribute("role","tab"),this.hasAttribute("tabindex")||this.setAttribute("tabindex","-1"),this.style.all="unset",this.style.display="inline-flex",this.style.alignItems="center",this.style.padding="8px 16px",this.style.cursor="pointer",this.style.fontSize="var(--ui-font-size-sm, 14px)",this.style.fontWeight="var(--ui-font-weight-medium, 500)",this.style.borderBottom="2px solid transparent",this.style.marginBottom="-1px",this.style.userSelect="none",this.render()}static get observedAttributes(){return["aria-selected","disabled"]}attributeChangedCallback(){this.render()}render(){const e=this.getAttribute("aria-selected")==="true",t=this.hasAttribute("disabled");this.style.color=e?"var(--ui-color-primary, #ff5500)":"var(--ui-color-text-secondary, #616161)",this.style.borderBottomColor=e?"var(--ui-color-primary, #ff5500)":"transparent",this.style.opacity=t?"0.5":"1",this.style.pointerEvents=t?"none":"auto"}}class q extends HTMLElement{connectedCallback(){this.setAttribute("role","tabpanel")}}customElements.get("ui-tabs")||customElements.define("ui-tabs",U);customElements.get("ui-tab")||customElements.define("ui-tab",M);customElements.get("ui-tab-panel")||customElements.define("ui-tab-panel",q);class O extends l{static get observedAttributes(){return["variant","size"]}get variant(){return this.getAttribute("variant")||"primary"}get size(){return this.getAttribute("size")||"md"}render(){const e=this.variant,t=this.size;this.root.innerHTML=`
|
|
706
706
|
<style>
|
|
707
707
|
:host {
|
|
708
708
|
display: inline-flex;
|
|
@@ -769,7 +769,7 @@
|
|
|
769
769
|
<span class="badge ${e} ${t}">
|
|
770
770
|
<slot></slot>
|
|
771
771
|
</span>
|
|
772
|
-
`}}customElements.get("ui-badge")||customElements.define("ui-badge",
|
|
772
|
+
`}}customElements.get("ui-badge")||customElements.define("ui-badge",O);class F extends l{static get observedAttributes(){return["size","aria-label"]}get size(){return this.getAttribute("size")||"md"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","status"),this.hasAttribute("aria-label")||this.setAttribute("aria-label","Loading")}render(){const e=this.size;this.root.innerHTML=`
|
|
773
773
|
<style>
|
|
774
774
|
:host {
|
|
775
775
|
display: inline-block;
|
|
@@ -888,7 +888,7 @@
|
|
|
888
888
|
</button>
|
|
889
889
|
`:""}
|
|
890
890
|
</div>
|
|
891
|
-
`;const i=this.root.querySelector("#closeBtn");i&&i.addEventListener("click",()=>this.close())}}customElements.get("ui-alert")||customElements.define("ui-alert",j);class
|
|
891
|
+
`;const i=this.root.querySelector("#closeBtn");i&&i.addEventListener("click",()=>this.close())}}customElements.get("ui-alert")||customElements.define("ui-alert",j);class P extends l{static get observedAttributes(){return["variant","bordered"]}get variant(){return this.getAttribute("variant")||"default"}get bordered(){return this.hasAttribute("bordered")||this.variant==="bordered"}render(){const e=this.variant,t=this.bordered;this.root.innerHTML=`
|
|
892
892
|
<style>
|
|
893
893
|
:host {
|
|
894
894
|
display: block;
|
|
@@ -934,7 +934,7 @@
|
|
|
934
934
|
</div>
|
|
935
935
|
<slot name="footer"></slot>
|
|
936
936
|
</div>
|
|
937
|
-
`}}customElements.get("ui-card")||customElements.define("ui-card",
|
|
937
|
+
`}}customElements.get("ui-card")||customElements.define("ui-card",P);class K extends l{static get observedAttributes(){return["multiple"]}get multiple(){return this.hasAttribute("multiple")}connectedCallback(){super.connectedCallback(),this.listen("toggle-item",this.handleItemToggle.bind(this))}handleItemToggle(e){this.multiple||e.detail.open&&Array.from(this.querySelectorAll("ui-accordion-item")).forEach(r=>{r!==e.detail.item&&r instanceof E&&(r.open=!1)})}render(){this.root.innerHTML=`
|
|
938
938
|
<style>
|
|
939
939
|
:host {
|
|
940
940
|
display: block;
|
|
@@ -1011,7 +1011,7 @@
|
|
|
1011
1011
|
<div class="content" role="region">
|
|
1012
1012
|
<slot></slot>
|
|
1013
1013
|
</div>
|
|
1014
|
-
`;const i=this.root.querySelector(".header");i&&(i.addEventListener("click",()=>this.toggle()),i.addEventListener("keydown",o=>{const s=o;(s.key===" "||s.key==="Enter")&&(s.preventDefault(),this.toggle())}))}}customElements.get("ui-accordion")||customElements.define("ui-accordion",K);customElements.get("ui-accordion-item")||customElements.define("ui-accordion-item",E);class
|
|
1014
|
+
`;const i=this.root.querySelector(".header");i&&(i.addEventListener("click",()=>this.toggle()),i.addEventListener("keydown",o=>{const s=o;(s.key===" "||s.key==="Enter")&&(s.preventDefault(),this.toggle())}))}}customElements.get("ui-accordion")||customElements.define("ui-accordion",K);customElements.get("ui-accordion-item")||customElements.define("ui-accordion-item",E);class _ extends l{constructor(){super();c(this,"_isOpen",!1);c(this,"handleDocClickBound");this.handleDocClickBound=this.handleDocClick.bind(this)}static get observedAttributes(){return["open","placement","disabled"]}get open(){return this._isOpen}set open(t){this._isOpen=t,this.setBooleanAttr("open",t),this.render()}get placement(){return this.getAttribute("placement")||"bottom-start"}get disabled(){return this.getBooleanAttr("disabled")}connectedCallback(){super.connectedCallback(),this._isOpen=this.hasAttribute("open"),document.addEventListener("click",this.handleDocClickBound),this.listen("keydown",this.handleKeyDown.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.handleDocClickBound)}handleDocClick(t){!this.contains(t.target)&&!this.root.contains(t.target)&&this._isOpen&&this.close()}handleKeyDown(t){t.key==="Escape"&&this._isOpen&&(t.preventDefault(),this.close())}toggle(){this.disabled||(this._isOpen?this.close():this.openDropdown())}openDropdown(){this.disabled||this._isOpen||(this.open=!0,this.emit("open"))}close(){this._isOpen&&(this.open=!1,this.emit("close"))}render(){const t=this._isOpen,r=this.placement;this.root.innerHTML=`
|
|
1015
1015
|
<style>
|
|
1016
1016
|
:host {
|
|
1017
1017
|
display: inline-block;
|
|
@@ -1057,7 +1057,7 @@
|
|
|
1057
1057
|
<div class="popover ${r}" role="menu" aria-hidden="${!t}">
|
|
1058
1058
|
<slot></slot>
|
|
1059
1059
|
</div>
|
|
1060
|
-
`;const i=this.root.querySelector("#trigger-wrapper");i&&i.addEventListener("click",s=>{s.stopPropagation(),this.toggle()})}}class
|
|
1060
|
+
`;const i=this.root.querySelector("#trigger-wrapper");i&&i.addEventListener("click",s=>{s.stopPropagation(),this.toggle()})}}class R extends HTMLElement{connectedCallback(){this.setAttribute("role","menuitem"),this.setAttribute("tabindex","0")}}customElements.get("ui-dropdown")||customElements.define("ui-dropdown",_);customElements.get("ui-dropdown-item")||customElements.define("ui-dropdown-item",R);class V extends l{static get observedAttributes(){return["value","max","size","variant","aria-label"]}get value(){return parseFloat(this.getAttribute("value")||"0")}set value(e){this.setAttribute("value",String(e))}get max(){return parseFloat(this.getAttribute("max")||"100")}set max(e){this.setAttribute("max",String(e))}get size(){return this.getAttribute("size")||"md"}get variant(){return this.getAttribute("variant")||"primary"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","progressbar")}render(){const e=Math.min(Math.max(this.value,0),this.max),t=this.max>0?e/this.max*100:0,r=this.size,i=this.variant,o=this.getAttribute("aria-label")||"Progress";this.setAttribute("aria-valuenow",String(e)),this.setAttribute("aria-valuemin","0"),this.setAttribute("aria-valuemax",String(this.max)),this.setAttribute("aria-label",o),this.root.innerHTML=`
|
|
1061
1061
|
<style>
|
|
1062
1062
|
:host {
|
|
1063
1063
|
display: block;
|
|
@@ -1102,7 +1102,7 @@
|
|
|
1102
1102
|
<div class="track ${r}">
|
|
1103
1103
|
<div class="bar ${i}"></div>
|
|
1104
1104
|
</div>
|
|
1105
|
-
`}}customElements.get("ui-progress")||customElements.define("ui-progress",
|
|
1105
|
+
`}}customElements.get("ui-progress")||customElements.define("ui-progress",V);class N extends l{static get observedAttributes(){return["current","total","page-size"]}get current(){return parseInt(this.getAttribute("current")||"1",10)}set current(e){this.setAttribute("current",String(e)),this.render()}get total(){return parseInt(this.getAttribute("total")||"1",10)}set total(e){this.setAttribute("total",String(e)),this.render()}get totalPages(){const e=parseInt(this.getAttribute("page-size")||"10",10);return Math.max(1,Math.ceil(this.total/e))}connectedCallback(){super.connectedCallback(),this.setAttribute("role","navigation"),this.setAttribute("aria-label","Pagination"),this.listen("click",this.handleClick.bind(this))}handleClick(e){const t=this.composedTarget(e).closest("button");if(!t||t.hasAttribute("disabled"))return;const r=t.dataset.action,i=t.dataset.page;r==="prev"?this.current>1&&this.goToPage(this.current-1):r==="next"?this.current<this.totalPages&&this.goToPage(this.current+1):i&&this.goToPage(parseInt(i,10))}goToPage(e){e!==this.current&&(this.current=e,this.emit("change",{page:e}))}render(){const e=this.current,t=this.totalPages,r=[],i=Math.max(1,e-2),o=Math.min(t,i+4);for(let s=i;s<=o;s++)r.push(s);this.root.innerHTML=`
|
|
1106
1106
|
<style>
|
|
1107
1107
|
:host {
|
|
1108
1108
|
display: inline-flex;
|
|
@@ -1163,7 +1163,7 @@
|
|
|
1163
1163
|
<button data-action="next" ${e>=t?"disabled":""} aria-label="Next page">
|
|
1164
1164
|
›
|
|
1165
1165
|
</button>
|
|
1166
|
-
`}}customElements.get("ui-pagination")||customElements.define("ui-pagination",
|
|
1166
|
+
`}}customElements.get("ui-pagination")||customElements.define("ui-pagination",N);const v=class v extends l{static get observedAttributes(){return["striped","bordered","hoverable"]}ensureLightCss(){if(v.lightCssInjected)return;v.lightCssInjected=!0;const e=document.createElement("style");e.setAttribute("data-cubit-ui-table",""),e.textContent=`
|
|
1167
1167
|
ui-table thead th,
|
|
1168
1168
|
ui-table tbody td {
|
|
1169
1169
|
padding: var(--ui-space-3, 12px) var(--ui-space-4, 16px);
|
|
@@ -1234,7 +1234,7 @@
|
|
|
1234
1234
|
<table class="table-container" role="table">
|
|
1235
1235
|
<slot></slot>
|
|
1236
1236
|
</table>
|
|
1237
|
-
`}};c(v,"lightCssInjected",!1);let x=v;customElements.get("ui-table")||customElements.define("ui-table",x);class
|
|
1237
|
+
`}};c(v,"lightCssInjected",!1);let x=v;customElements.get("ui-table")||customElements.define("ui-table",x);class W extends l{static get observedAttributes(){return["src","alt","name","size","shape"]}get src(){return this.getAttribute("src")||""}set src(e){this.setAttribute("src",e)}get alt(){return this.getAttribute("alt")||""}get name(){return this.getAttribute("name")||""}get size(){return this.getAttribute("size")||"md"}get shape(){return this.getAttribute("shape")||"circle"}getInitials(e){if(!e)return"";const t=e.trim().split(/\s+/);return t.length>=2?(t[0][0]||"")+(t[1][0]||""):e.slice(0,2).toUpperCase()}render(){const e=this.src,t=this.alt||this.name,r=this.size,i=this.shape!=="square",o=this.getInitials(this.name);this.root.innerHTML=`
|
|
1238
1238
|
<style>
|
|
1239
1239
|
:host {
|
|
1240
1240
|
display: inline-block;
|
|
@@ -1280,7 +1280,7 @@
|
|
|
1280
1280
|
<div class="avatar ${this.escapeHtml(r)}" role="img" aria-label="${this.escapeHtml(t)}">
|
|
1281
1281
|
${e?`<img src="${this.safeUrl(e)}" alt="${this.escapeHtml(t)}" onerror="this.style.display='none'; this.nextElementSibling.style.display='inline-flex';" /><span style="display:none;">${this.escapeHtml(o)}</span>`:`<span>${this.escapeHtml(o)}</span>`}
|
|
1282
1282
|
</div>
|
|
1283
|
-
`}}customElements.get("ui-avatar")||customElements.define("ui-avatar",
|
|
1283
|
+
`}}customElements.get("ui-avatar")||customElements.define("ui-avatar",W);class X extends l{static get observedAttributes(){return["separator","aria-label"]}get separator(){return this.getAttribute("separator")||"/"}connectedCallback(){super.connectedCallback(),this.setAttribute("role","navigation");const e=this.getAttribute("aria-label")||"Breadcrumbs";this.setAttribute("aria-label",e),this.syncSeparators()}attributeChangedCallback(e,t,r){super.attributeChangedCallback(e,t,r),e==="separator"&&this.syncSeparators()}syncSeparators(){const e=Array.from(this.querySelectorAll("ui-breadcrumb-item"));e.forEach((t,r)=>{r===e.length-1?(t.setAttribute("current","true"),t.removeAttribute("separator")):(t.removeAttribute("current"),t.setAttribute("separator",this.separator))})}render(){this.root.innerHTML=`
|
|
1284
1284
|
<style>
|
|
1285
1285
|
:host {
|
|
1286
1286
|
display: block;
|
|
@@ -1299,7 +1299,7 @@
|
|
|
1299
1299
|
<ol>
|
|
1300
1300
|
<slot></slot>
|
|
1301
1301
|
</ol>
|
|
1302
|
-
`;const e=this.root.querySelector("slot");e&&e.addEventListener("slotchange",()=>this.syncSeparators())}}class
|
|
1302
|
+
`;const e=this.root.querySelector("slot");e&&e.addEventListener("slotchange",()=>this.syncSeparators())}}class Y extends l{static get observedAttributes(){return["href","separator","current"]}get href(){return this.getAttribute("href")||""}get separator(){return this.getAttribute("separator")||""}get current(){return this.hasAttribute("current")||this.getAttribute("current")==="true"}render(){const e=this.href,t=this.current,r=this.separator;this.root.innerHTML=`
|
|
1303
1303
|
<style>
|
|
1304
1304
|
:host {
|
|
1305
1305
|
display: inline-flex;
|
|
@@ -1340,7 +1340,7 @@
|
|
|
1340
1340
|
${t?'<span class="current" aria-current="page"><slot></slot></span>':e?`<a href="${this.safeUrl(e)}"><slot></slot></a>`:"<span><slot></slot></span>"}
|
|
1341
1341
|
${r?`<span class="separator" aria-hidden="true">${this.escapeHtml(r)}</span>`:""}
|
|
1342
1342
|
</li>
|
|
1343
|
-
`}}customElements.get("ui-breadcrumbs")||customElements.define("ui-breadcrumbs",
|
|
1343
|
+
`}}customElements.get("ui-breadcrumbs")||customElements.define("ui-breadcrumbs",X);customElements.get("ui-breadcrumb-item")||customElements.define("ui-breadcrumb-item",Y);class G extends l{static get observedAttributes(){return["open","side","title"]}constructor(){super(),this.removeAttribute("tabindex")}get open(){return this.getBooleanAttr("open")}set open(e){this.setBooleanAttr("open",e)}get side(){return this.getAttribute("side")||"right"}get title(){return this.getAttribute("title")||""}set title(e){this.setAttribute("title",e)}connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","dialog"),this.setAttribute("aria-modal","true"),this.listen("keydown",e=>{e.key==="Escape"&&this.open&&this.close()})}close(){this.open=!1,this.emit("close",{})}render(){var s;const e=this.open,t=this.side==="left"?"left":"right",r=this.title;if(!e){this.root.innerHTML="";return}this.root.innerHTML=`
|
|
1344
1344
|
<style>
|
|
1345
1345
|
:host {
|
|
1346
1346
|
position: fixed;
|
|
@@ -1435,7 +1435,7 @@
|
|
|
1435
1435
|
<div class="body"><slot></slot></div>
|
|
1436
1436
|
<footer class="foot" style="display:none;"><slot name="footer"></slot></footer>
|
|
1437
1437
|
</div>
|
|
1438
|
-
`;const i=this.root.querySelector("footer.foot");this.querySelector('[slot="footer"]')&&(i.style.display="block"),this.root.querySelector("[data-backdrop]").addEventListener("click",()=>this.close()),(s=this.root.querySelector("[data-close]"))==null||s.addEventListener("click",()=>this.close()),requestAnimationFrame(()=>{var n;(n=this.root.querySelector(".close-btn"))==null||n.focus()})}}customElements.get("ui-drawer")||customElements.define("ui-drawer",
|
|
1438
|
+
`;const i=this.root.querySelector("footer.foot");this.querySelector('[slot="footer"]')&&(i.style.display="block"),this.root.querySelector("[data-backdrop]").addEventListener("click",()=>this.close()),(s=this.root.querySelector("[data-close]"))==null||s.addEventListener("click",()=>this.close()),requestAnimationFrame(()=>{var n;(n=this.root.querySelector(".close-btn"))==null||n.focus()})}}customElements.get("ui-drawer")||customElements.define("ui-drawer",G);class Z extends l{static get observedAttributes(){return["variant","width","height","lines"]}get variant(){return this.getAttribute("variant")||"text"}get width(){return this.getAttribute("width")||""}get height(){return this.getAttribute("height")||""}get lines(){const e=parseInt(this.getAttribute("lines")||"1",10);return Number.isFinite(e)&&e>0?Math.min(e,6):1}render(){const e=this.variant,t=this.width?`width: ${this.escape(this.width)};`:"",r=this.height?`height: ${this.escape(this.height)};`:"",i=e==="text"&&this.lines>1?Array.from({length:this.lines},(o,s)=>`<span class="shimmer bar" style="${s===this.lines-1?"width: 70%;":"width: 100%;"}"></span>`).join(""):`<span class="shimmer ${e==="circle"?"circle":e==="rect"?"rect":"bar"}" style="${t}${r}"></span>`;this.root.innerHTML=`
|
|
1439
1439
|
<style>
|
|
1440
1440
|
:host {
|
|
1441
1441
|
display: block;
|
|
@@ -1469,7 +1469,7 @@
|
|
|
1469
1469
|
}
|
|
1470
1470
|
</style>
|
|
1471
1471
|
<div class="wrap" aria-hidden="true">${i}</div>
|
|
1472
|
-
`}escape(e){return e.replace(/["<>]/g,"")}}customElements.get("ui-skeleton")||customElements.define("ui-skeleton",
|
|
1472
|
+
`}escape(e){return e.replace(/["<>]/g,"")}}customElements.get("ui-skeleton")||customElements.define("ui-skeleton",Z);class J extends l{static get observedAttributes(){return["brand","sticky"]}get brand(){return this.getAttribute("brand")||""}get sticky(){return this.getBooleanAttr("sticky")}render(){const e=this.brand,t=this.sticky;this.root.innerHTML=`
|
|
1473
1473
|
<style>
|
|
1474
1474
|
:host {
|
|
1475
1475
|
display: block;
|
|
@@ -1638,7 +1638,7 @@ ${this.escapeHtml(f)}</textarea>
|
|
|
1638
1638
|
${t?`<p class="desc">${this.escapeHtml(t)}</p>`:""}
|
|
1639
1639
|
<div class="actions"><slot></slot></div>
|
|
1640
1640
|
</div>
|
|
1641
|
-
`;const o=(s,n)=>{const d=this.root.querySelector(s?`slot[name="${s}"]`:"slot:not([name])");if(!d||!n)return;const b=()=>{n.classList.toggle("has",d.assignedNodes({flatten:!0}).some(h=>h.nodeType===1||(h.textContent||"").trim()!==""))};d.addEventListener("slotchange",b),b()};o("icon",this.root.querySelector(".icon")),o(null,this.root.querySelector(".actions"))}}customElements.get("ui-empty-state")||customElements.define("ui-empty-state",Q);class
|
|
1641
|
+
`;const o=(s,n)=>{const d=this.root.querySelector(s?`slot[name="${s}"]`:"slot:not([name])");if(!d||!n)return;const b=()=>{n.classList.toggle("has",d.assignedNodes({flatten:!0}).some(h=>h.nodeType===1||(h.textContent||"").trim()!==""))};d.addEventListener("slotchange",b),b()};o("icon",this.root.querySelector(".icon")),o(null,this.root.querySelector(".actions"))}}customElements.get("ui-empty-state")||customElements.define("ui-empty-state",Q);class tt extends l{static get observedAttributes(){return["value","size","disabled","aria-label"]}get value(){return this.getAttribute("value")||""}set value(e){this.setAttribute("value",e)}get disabled(){return this.getBooleanAttr("disabled")}set disabled(e){this.setBooleanAttr("disabled",e)}connectedCallback(){super.connectedCallback(),this.setAttribute("role","radiogroup"),this.listen("click",this.handleClick.bind(this)),this.listen("keydown",this.handleKeyDown.bind(this)),this.refresh()}attributeChangedCallback(e,t,r){super.attributeChangedCallback(e,t,r),this.refresh()}segments(){return Array.from(this.querySelectorAll("ui-segment"))}enabledSegments(){return this.segments().filter(e=>!e.hasAttribute("disabled")&&!this.disabled)}select(e){const t=e.getAttribute("value")||"";t!==this.value&&(this.value=t,this.emit("change",{value:t}))}handleClick(e){const t=e.target.closest("ui-segment");!t||t.hasAttribute("disabled")||this.disabled||this.select(t)}handleKeyDown(e){const t=this.enabledSegments();if(!t.length)return;const r=t.findIndex(s=>s.getAttribute("value")===this.value);let i=r;if(e.key==="ArrowRight"||e.key==="ArrowDown")i=r<0?0:(r+1)%t.length;else if(e.key==="ArrowLeft"||e.key==="ArrowUp")i=r<0?t.length-1:(r-1+t.length)%t.length;else if(e.key==="Home")i=0;else if(e.key==="End")i=t.length-1;else if((e.key===" "||e.key==="Enter")&&e.target.closest("ui-segment")){e.preventDefault(),this.select(e.target.closest("ui-segment"));return}else return;e.preventDefault();const o=t[i];o&&(this.select(o),o.focus())}refresh(){const e=this.segments(),t=e.some(i=>i.getAttribute("value")===this.value&&!i.hasAttribute("disabled"));let r=!1;e.forEach(i=>{const o=i.hasAttribute("disabled")||this.disabled,s=i.getAttribute("value")===this.value;i.setAttribute("aria-checked",String(s)),i.setAttribute("aria-disabled",String(o));let n=-1;!o&&(s&&t||!t&&!r)&&(n=0,r=!0),i.setAttribute("tabindex",String(n))})}render(){var t;const e=["sm","md","lg"].includes(this.getAttribute("size")||"")?this.getAttribute("size"):"md";this.root.innerHTML=`
|
|
1642
1642
|
<style>
|
|
1643
1643
|
:host {
|
|
1644
1644
|
display: inline-flex;
|
|
@@ -1678,7 +1678,7 @@ ${this.escapeHtml(f)}</textarea>
|
|
|
1678
1678
|
}
|
|
1679
1679
|
</style>
|
|
1680
1680
|
<slot></slot>
|
|
1681
|
-
`,(t=this.root.querySelector("slot"))==null||t.addEventListener("slotchange",()=>this.refresh())}}class
|
|
1681
|
+
`,(t=this.root.querySelector("slot"))==null||t.addEventListener("slotchange",()=>this.refresh())}}class et extends HTMLElement{connectedCallback(){var e;this.setAttribute("role","radio"),this.hasAttribute("aria-checked")||this.setAttribute("aria-checked","false"),this.hasAttribute("tabindex")||this.setAttribute("tabindex","-1"),(e=this.closest("ui-segmented"))==null||e.refresh()}static get observedAttributes(){return["value","disabled"]}attributeChangedCallback(){var e;(e=this.closest("ui-segmented"))==null||e.refresh()}}customElements.get("ui-segmented")||customElements.define("ui-segmented",tt);customElements.get("ui-segment")||customElements.define("ui-segment",et);class it extends l{static get observedAttributes(){return["current","orientation","aria-label"]}get current(){const e=parseInt(this.getAttribute("current")||"0",10);return Number.isFinite(e)?e:0}set current(e){this.setAttribute("current",String(e))}connectedCallback(){super.connectedCallback(),this.setAttribute("role","list"),this.refresh()}attributeChangedCallback(e,t,r){super.attributeChangedCallback(e,t,r),this.refresh()}refresh(){const e=Array.from(this.querySelectorAll("ui-step")),t=this.current;e.forEach((r,i)=>{const s=r.getAttribute("status")==="error"?"error":i<t?"done":i===t?"active":"pending";r.setAttribute("data-state",s),r.setAttribute("data-index",String(i+1)),r.toggleAttribute("data-last",i===e.length-1),r.toggleAttribute("data-vertical",this.getAttribute("orientation")==="vertical"),s==="active"?r.setAttribute("aria-current","step"):r.removeAttribute("aria-current")})}render(){var t;const e=this.getAttribute("orientation")==="vertical";this.root.innerHTML=`
|
|
1682
1682
|
<style>
|
|
1683
1683
|
:host {
|
|
1684
1684
|
display: flex;
|
|
@@ -1689,7 +1689,7 @@ ${this.escapeHtml(f)}</textarea>
|
|
|
1689
1689
|
}
|
|
1690
1690
|
</style>
|
|
1691
1691
|
<slot></slot>
|
|
1692
|
-
`,(t=this.root.querySelector("slot"))==null||t.addEventListener("slotchange",()=>this.refresh())}}class
|
|
1692
|
+
`,(t=this.root.querySelector("slot"))==null||t.addEventListener("slotchange",()=>this.refresh())}}class rt extends l{static get observedAttributes(){return["label","description","status","data-state","data-index","data-last","data-vertical"]}connectedCallback(){var e;super.connectedCallback(),this.setAttribute("role","listitem"),(e=this.closest("ui-stepper"))==null||e.refresh()}attributeChangedCallback(e,t,r){var i;super.attributeChangedCallback(e,t,r),e.startsWith("data-")||(i=this.closest("ui-stepper"))==null||i.refresh()}render(){const e=this.getAttribute("data-state")||"pending",t=this.getAttribute("data-index")||"",r=this.hasAttribute("data-last"),i=this.hasAttribute("data-vertical"),o=this.getAttribute("label")||"",s=this.getAttribute("description")||"",n=e==="done"?'<svg viewBox="0 0 16 16" width="14" height="14" aria-hidden="true"><path d="M3 8.5l3.2 3.2L13 5" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>':e==="error"?"!":this.escapeHtml(t),d={done:"completed",active:"current step",pending:"upcoming",error:"error"}[e]||"";this.root.innerHTML=`
|
|
1693
1693
|
<style>
|
|
1694
1694
|
:host {
|
|
1695
1695
|
display: flex;
|
|
@@ -1737,7 +1737,7 @@ ${this.escapeHtml(f)}</textarea>
|
|
|
1737
1737
|
<div class="row"><span class="marker" aria-hidden="true">${n}</span><span class="line"></span></div>
|
|
1738
1738
|
<div class="text"><div class="label">${this.escapeHtml(o)}<span class="vh"> (${d})</span></div>${s?`<div class="desc">${this.escapeHtml(s)}</div>`:""}<slot></slot></div>
|
|
1739
1739
|
</div>`}
|
|
1740
|
-
`}}customElements.get("ui-stepper")||customElements.define("ui-stepper",
|
|
1740
|
+
`}}customElements.get("ui-stepper")||customElements.define("ui-stepper",it);customElements.get("ui-step")||customElements.define("ui-step",rt);class ot extends l{static get observedAttributes(){return["variant","size","removable","disabled","remove-label"]}get removable(){return this.getBooleanAttr("removable")}set removable(e){this.setBooleanAttr("removable",e)}get disabled(){return this.getBooleanAttr("disabled")}set disabled(e){this.setBooleanAttr("disabled",e)}connectedCallback(){super.connectedCallback(),this.listen("keydown",this.handleKeyDown.bind(this))}requestRemove(){this.disabled||!this.removable||this.emit("remove")}handleKeyDown(e){if(e.key==="Delete"||e.key==="Backspace"){if(this.disabled||!this.removable)return;e.preventDefault(),this.requestRemove()}}render(){var s;const e=["neutral","primary","success","warning","error"].includes(this.getAttribute("variant")||"")?this.getAttribute("variant"):"neutral",t=this.getAttribute("size")==="sm"?"sm":"md",r=this.removable,i=this.disabled,o=this.getAttribute("remove-label")||"Remove";r&&!i?this.setAttribute("tabindex","0"):this.removeAttribute("tabindex"),this.setAttribute("aria-disabled",String(i)),this.root.innerHTML=`
|
|
1741
1741
|
<style>
|
|
1742
1742
|
:host { display: inline-flex; font-family: var(--ui-font-family-base, sans-serif); outline: none; }
|
|
1743
1743
|
:host(:focus-visible) .chip { box-shadow: 0 0 0 2px var(--ui-color-bg-canvas, #ffffff), 0 0 0 4px var(--ui-color-focus-ring, #ff5500); }
|
|
@@ -1783,7 +1783,7 @@ ${this.escapeHtml(f)}</textarea>
|
|
|
1783
1783
|
<svg viewBox="0 0 10 10" aria-hidden="true"><path d="M2 2l6 6M8 2L2 8" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" fill="none"/></svg>
|
|
1784
1784
|
</button>`:""}
|
|
1785
1785
|
</span>
|
|
1786
|
-
`,(s=this.root.querySelector("button"))==null||s.addEventListener("click",n=>{n.stopPropagation(),this.requestRemove()})}}customElements.get("ui-chip")||customElements.define("ui-chip",
|
|
1786
|
+
`,(s=this.root.querySelector("button"))==null||s.addEventListener("click",n=>{n.stopPropagation(),this.requestRemove()})}}customElements.get("ui-chip")||customElements.define("ui-chip",ot);class st extends l{static get observedAttributes(){return["level","time"]}get level(){const e=this.getAttribute("level")||"info";return["info","success","warning","error","debug"].includes(e)?e:"info"}get time(){return this.getAttribute("time")||""}render(){const e=this.time;this.root.innerHTML=`
|
|
1787
1787
|
<style>
|
|
1788
1788
|
:host {
|
|
1789
1789
|
display: flex;
|
|
@@ -1825,7 +1825,7 @@ ${this.escapeHtml(f)}</textarea>
|
|
|
1825
1825
|
<span class="marker" aria-hidden="true"></span>
|
|
1826
1826
|
${e?`<span class="time">${this.escapeHtml(e)}</span>`:""}
|
|
1827
1827
|
<span class="msg"><slot></slot></span>
|
|
1828
|
-
`}}customElements.get("ui-log-item")||customElements.define("ui-log-item",
|
|
1828
|
+
`}}customElements.get("ui-log-item")||customElements.define("ui-log-item",st);class at extends l{static get observedAttributes(){return["label","height","wrap","auto-scroll","max","empty"]}get label(){return this.getAttribute("label")||""}get height(){return this.getAttribute("height")||"220px"}get wrap(){return this.getBooleanAttr("wrap")}get autoScroll(){return this.getAttribute("auto-scroll")!=="false"}get max(){const e=parseInt(this.getAttribute("max")||"500",10);return Number.isFinite(e)&&e>0?e:500}get emptyText(){return this.getAttribute("empty")||"표시할 항목이 없습니다."}connectedCallback(){super.connectedCallback();const e=this.root.querySelector("slot");e==null||e.addEventListener("slotchange",()=>this.handleSlotChange())}items(){return Array.from(this.children).filter(e=>e.tagName.toLowerCase()==="ui-log-item")}handleSlotChange(){var o;const e=this.root.querySelector(".viewport"),t=e?e.scrollHeight-e.scrollTop-e.clientHeight<40:!0,r=this.items(),i=r.length-this.max;for(let s=0;s<i;s++)(o=r[s])==null||o.remove();e&&(t||this.autoScroll)&&(e.scrollTop=e.scrollHeight),this.updateEmpty(),this.updateCount()}updateEmpty(){const e=this.root.querySelector(".empty");e&&e.setAttribute("aria-hidden",this.items().length>0?"true":"false")}scrollDown(){const e=this.root.querySelector(".viewport");e&&(e.scrollTop=e.scrollHeight)}push(e,t,r){const i=document.createElement("ui-log-item");i.setAttribute("level",e),r&&i.setAttribute("time",r),i.textContent=t,this.appendChild(i)}clear(){this.items().forEach(e=>e.remove()),this.updateEmpty()}render(){var i;const e=this.label,t=`height: ${this.height.replace(/["<>]/g,"")};`,r=this.escapeHtml(this.emptyText);this.root.innerHTML=`
|
|
1829
1829
|
<style>
|
|
1830
1830
|
:host {
|
|
1831
1831
|
display: block;
|
|
@@ -1900,4 +1900,4 @@ ${this.escapeHtml(f)}</textarea>
|
|
|
1900
1900
|
</div>
|
|
1901
1901
|
</div>
|
|
1902
1902
|
`,(i=this.root.querySelector(".copy-btn"))==null||i.addEventListener("click",()=>{var n;const o=this.items().map(d=>d.textContent??"").join(`
|
|
1903
|
-
`);(n=navigator.clipboard)!=null&&n.writeText&&navigator.clipboard.writeText(o).catch(()=>{});const s=this.root.querySelector(".copy-btn");s&&(s.textContent="복사됨",window.setTimeout(()=>{s.textContent="복사"},1400)),this.emit("copy",{text:o})}),this.updateCount(),this.updateEmpty()}updateCount(){const e=this.root.querySelector(".count");e&&(e.textContent=this.items().length>0?`${this.items().length}건`:"")}}customElements.get("ui-log")||customElements.define("ui-log",
|
|
1903
|
+
`);(n=navigator.clipboard)!=null&&n.writeText&&navigator.clipboard.writeText(o).catch(()=>{});const s=this.root.querySelector(".copy-btn");s&&(s.textContent="복사됨",window.setTimeout(()=>{s.textContent="복사"},1400)),this.emit("copy",{text:o})}),this.updateCount(),this.updateEmpty()}updateCount(){const e=this.root.querySelector(".count");e&&(e.textContent=this.items().length>0?`${this.items().length}건`:"")}}customElements.get("ui-log")||customElements.define("ui-log",at);exports.FocusTrap=g;exports.UIAccordion=K;exports.UIAccordionItem=E;exports.UIAlert=j;exports.UIAvatar=W;exports.UIBadge=O;exports.UIBreadcrumbItem=Y;exports.UIBreadcrumbs=X;exports.UIButton=L;exports.UICard=P;exports.UICheckbox=z;exports.UIChip=ot;exports.UIDrawer=G;exports.UIDropdown=_;exports.UIDropdownItem=R;exports.UIElement=l;exports.UIEmptyState=Q;exports.UIInput=A;exports.UILog=at;exports.UILogItem=st;exports.UIModal=B;exports.UINavbar=J;exports.UIOption=T;exports.UIPagination=N;exports.UIProgress=V;exports.UIRadio=m;exports.UISegment=et;exports.UISegmented=tt;exports.UISelect=I;exports.UISkeleton=Z;exports.UISpinner=F;exports.UIStep=rt;exports.UIStepper=it;exports.UISwitch=C;exports.UITab=M;exports.UITabPanel=q;exports.UITable=x;exports.UITabs=U;exports.UITextarea=$;exports.UIToast=D;exports.UITooltip=H;
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,27 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var c = (a, e, t) =>
|
|
1
|
+
var L = Object.defineProperty;
|
|
2
|
+
var B = (a, e, t) => e in a ? L(a, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : a[e] = t;
|
|
3
|
+
var c = (a, e, t) => B(a, typeof e != "symbol" ? e + "" : e, t);
|
|
4
|
+
const A = /* @__PURE__ */ new WeakSet();
|
|
5
|
+
function T(a) {
|
|
6
|
+
return a.replace(/[A-Z]/g, (e) => `-${e.toLowerCase()}`);
|
|
7
|
+
}
|
|
8
|
+
function H(a) {
|
|
9
|
+
if (A.has(a)) return;
|
|
10
|
+
A.add(a);
|
|
11
|
+
const e = new Set(a.observedAttributes ?? []);
|
|
12
|
+
for (let t = a.prototype; t && t !== l.prototype; t = Object.getPrototypeOf(t))
|
|
13
|
+
for (const r of Object.getOwnPropertyNames(t)) {
|
|
14
|
+
const i = T(r);
|
|
15
|
+
if (!e.has(i)) continue;
|
|
16
|
+
const o = Object.getOwnPropertyDescriptor(t, r);
|
|
17
|
+
!o || !o.get || o.set || Object.defineProperty(t, r, {
|
|
18
|
+
...o,
|
|
19
|
+
set(s) {
|
|
20
|
+
s == null || s === !1 ? this.removeAttribute(i) : this.setAttribute(i, s === !0 ? "" : String(s));
|
|
21
|
+
}
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
}
|
|
4
25
|
class l extends HTMLElement {
|
|
5
26
|
constructor() {
|
|
6
27
|
super();
|
|
@@ -9,7 +30,7 @@ class l extends HTMLElement {
|
|
|
9
30
|
/** 상위 <fieldset disabled> 등 폼이 부여한 비활성 상태 (속성 disabled 와 별개) */
|
|
10
31
|
c(this, "formDisabled", !1);
|
|
11
32
|
c(this, "lifecycleAbort", null);
|
|
12
|
-
if (this.root = this.attachShadow({ mode: "open" }), this.constructor.formAssociated && typeof this.attachInternals == "function")
|
|
33
|
+
if (this.root = this.attachShadow({ mode: "open" }), H(this.constructor), this.constructor.formAssociated && typeof this.attachInternals == "function")
|
|
13
34
|
try {
|
|
14
35
|
this.internals = this.attachInternals();
|
|
15
36
|
} catch {
|
|
@@ -129,7 +150,7 @@ c(g, "FOCUSABLE_SELECTORS", [
|
|
|
129
150
|
"ui-input:not([disabled])"
|
|
130
151
|
].join(","));
|
|
131
152
|
let y = g;
|
|
132
|
-
class
|
|
153
|
+
class D extends l {
|
|
133
154
|
static get observedAttributes() {
|
|
134
155
|
return ["variant", "size", "disabled", "type", "aria-label"];
|
|
135
156
|
}
|
|
@@ -277,8 +298,8 @@ class B extends l {
|
|
|
277
298
|
});
|
|
278
299
|
}
|
|
279
300
|
}
|
|
280
|
-
customElements.get("ui-button") || customElements.define("ui-button",
|
|
281
|
-
class
|
|
301
|
+
customElements.get("ui-button") || customElements.define("ui-button", D);
|
|
302
|
+
class z extends l {
|
|
282
303
|
constructor() {
|
|
283
304
|
super(...arguments);
|
|
284
305
|
c(this, "defaultValue", "");
|
|
@@ -429,9 +450,9 @@ class A extends l {
|
|
|
429
450
|
});
|
|
430
451
|
}
|
|
431
452
|
}
|
|
432
|
-
c(
|
|
433
|
-
customElements.get("ui-input") || customElements.define("ui-input",
|
|
434
|
-
class
|
|
453
|
+
c(z, "formAssociated", !0);
|
|
454
|
+
customElements.get("ui-input") || customElements.define("ui-input", z);
|
|
455
|
+
class C extends l {
|
|
435
456
|
constructor() {
|
|
436
457
|
super(...arguments);
|
|
437
458
|
c(this, "defaultChecked", !1);
|
|
@@ -544,8 +565,8 @@ class z extends l {
|
|
|
544
565
|
`;
|
|
545
566
|
}
|
|
546
567
|
}
|
|
547
|
-
c(
|
|
548
|
-
customElements.get("ui-checkbox") || customElements.define("ui-checkbox",
|
|
568
|
+
c(C, "formAssociated", !0);
|
|
569
|
+
customElements.get("ui-checkbox") || customElements.define("ui-checkbox", C);
|
|
549
570
|
const m = class m extends l {
|
|
550
571
|
constructor() {
|
|
551
572
|
super(...arguments);
|
|
@@ -658,7 +679,7 @@ const m = class m extends l {
|
|
|
658
679
|
c(m, "formAssociated", !0);
|
|
659
680
|
let k = m;
|
|
660
681
|
customElements.get("ui-radio") || customElements.define("ui-radio", k);
|
|
661
|
-
class
|
|
682
|
+
class E extends l {
|
|
662
683
|
constructor() {
|
|
663
684
|
super(...arguments);
|
|
664
685
|
c(this, "defaultChecked", !1);
|
|
@@ -761,9 +782,9 @@ class C extends l {
|
|
|
761
782
|
`;
|
|
762
783
|
}
|
|
763
784
|
}
|
|
764
|
-
c(
|
|
765
|
-
customElements.get("ui-switch") || customElements.define("ui-switch",
|
|
766
|
-
class
|
|
785
|
+
c(E, "formAssociated", !0);
|
|
786
|
+
customElements.get("ui-switch") || customElements.define("ui-switch", E);
|
|
787
|
+
class M extends l {
|
|
767
788
|
constructor() {
|
|
768
789
|
super();
|
|
769
790
|
c(this, "_isOpen", !1);
|
|
@@ -914,14 +935,14 @@ class T extends l {
|
|
|
914
935
|
});
|
|
915
936
|
}
|
|
916
937
|
}
|
|
917
|
-
class
|
|
938
|
+
class q extends HTMLElement {
|
|
918
939
|
connectedCallback() {
|
|
919
940
|
this.setAttribute("role", "option");
|
|
920
941
|
}
|
|
921
942
|
}
|
|
922
|
-
customElements.get("ui-select") || customElements.define("ui-select",
|
|
923
|
-
customElements.get("ui-option") || customElements.define("ui-option",
|
|
924
|
-
class
|
|
943
|
+
customElements.get("ui-select") || customElements.define("ui-select", M);
|
|
944
|
+
customElements.get("ui-option") || customElements.define("ui-option", q);
|
|
945
|
+
class I extends l {
|
|
925
946
|
constructor() {
|
|
926
947
|
super();
|
|
927
948
|
c(this, "focusTrap", null);
|
|
@@ -1082,8 +1103,8 @@ class D extends l {
|
|
|
1082
1103
|
});
|
|
1083
1104
|
}
|
|
1084
1105
|
}
|
|
1085
|
-
customElements.get("ui-modal") || customElements.define("ui-modal",
|
|
1086
|
-
class
|
|
1106
|
+
customElements.get("ui-modal") || customElements.define("ui-modal", I);
|
|
1107
|
+
class U extends l {
|
|
1087
1108
|
constructor() {
|
|
1088
1109
|
super(...arguments);
|
|
1089
1110
|
c(this, "timer", null);
|
|
@@ -1201,8 +1222,8 @@ class M extends l {
|
|
|
1201
1222
|
i && i.addEventListener("click", () => this.close());
|
|
1202
1223
|
}
|
|
1203
1224
|
}
|
|
1204
|
-
customElements.get("ui-toast") || customElements.define("ui-toast",
|
|
1205
|
-
class
|
|
1225
|
+
customElements.get("ui-toast") || customElements.define("ui-toast", U);
|
|
1226
|
+
class F extends l {
|
|
1206
1227
|
static get observedAttributes() {
|
|
1207
1228
|
return ["content", "position"];
|
|
1208
1229
|
}
|
|
@@ -1289,8 +1310,8 @@ class q extends l {
|
|
|
1289
1310
|
`;
|
|
1290
1311
|
}
|
|
1291
1312
|
}
|
|
1292
|
-
customElements.get("ui-tooltip") || customElements.define("ui-tooltip",
|
|
1293
|
-
class
|
|
1313
|
+
customElements.get("ui-tooltip") || customElements.define("ui-tooltip", F);
|
|
1314
|
+
class O extends l {
|
|
1294
1315
|
static get observedAttributes() {
|
|
1295
1316
|
return ["value"];
|
|
1296
1317
|
}
|
|
@@ -1354,7 +1375,7 @@ class I extends l {
|
|
|
1354
1375
|
`;
|
|
1355
1376
|
}
|
|
1356
1377
|
}
|
|
1357
|
-
class
|
|
1378
|
+
class j extends HTMLElement {
|
|
1358
1379
|
connectedCallback() {
|
|
1359
1380
|
this.setAttribute("role", "tab"), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "-1"), this.style.all = "unset", this.style.display = "inline-flex", this.style.alignItems = "center", this.style.padding = "8px 16px", this.style.cursor = "pointer", this.style.fontSize = "var(--ui-font-size-sm, 14px)", this.style.fontWeight = "var(--ui-font-weight-medium, 500)", this.style.borderBottom = "2px solid transparent", this.style.marginBottom = "-1px", this.style.userSelect = "none", this.render();
|
|
1360
1381
|
}
|
|
@@ -1369,15 +1390,15 @@ class U extends HTMLElement {
|
|
|
1369
1390
|
this.style.color = e ? "var(--ui-color-primary, #ff5500)" : "var(--ui-color-text-secondary, #616161)", this.style.borderBottomColor = e ? "var(--ui-color-primary, #ff5500)" : "transparent", this.style.opacity = t ? "0.5" : "1", this.style.pointerEvents = t ? "none" : "auto";
|
|
1370
1391
|
}
|
|
1371
1392
|
}
|
|
1372
|
-
class
|
|
1393
|
+
class K extends HTMLElement {
|
|
1373
1394
|
connectedCallback() {
|
|
1374
1395
|
this.setAttribute("role", "tabpanel");
|
|
1375
1396
|
}
|
|
1376
1397
|
}
|
|
1377
|
-
customElements.get("ui-tabs") || customElements.define("ui-tabs",
|
|
1378
|
-
customElements.get("ui-tab") || customElements.define("ui-tab",
|
|
1379
|
-
customElements.get("ui-tab-panel") || customElements.define("ui-tab-panel",
|
|
1380
|
-
class
|
|
1398
|
+
customElements.get("ui-tabs") || customElements.define("ui-tabs", O);
|
|
1399
|
+
customElements.get("ui-tab") || customElements.define("ui-tab", j);
|
|
1400
|
+
customElements.get("ui-tab-panel") || customElements.define("ui-tab-panel", K);
|
|
1401
|
+
class P extends l {
|
|
1381
1402
|
static get observedAttributes() {
|
|
1382
1403
|
return ["variant", "size"];
|
|
1383
1404
|
}
|
|
@@ -1459,8 +1480,8 @@ class j extends l {
|
|
|
1459
1480
|
`;
|
|
1460
1481
|
}
|
|
1461
1482
|
}
|
|
1462
|
-
customElements.get("ui-badge") || customElements.define("ui-badge",
|
|
1463
|
-
class
|
|
1483
|
+
customElements.get("ui-badge") || customElements.define("ui-badge", P);
|
|
1484
|
+
class _ extends l {
|
|
1464
1485
|
static get observedAttributes() {
|
|
1465
1486
|
return ["size", "aria-label"];
|
|
1466
1487
|
}
|
|
@@ -1511,8 +1532,8 @@ class K extends l {
|
|
|
1511
1532
|
`;
|
|
1512
1533
|
}
|
|
1513
1534
|
}
|
|
1514
|
-
customElements.get("ui-spinner") || customElements.define("ui-spinner",
|
|
1515
|
-
class
|
|
1535
|
+
customElements.get("ui-spinner") || customElements.define("ui-spinner", _);
|
|
1536
|
+
class R extends l {
|
|
1516
1537
|
static get observedAttributes() {
|
|
1517
1538
|
return ["variant", "title", "closable", "aria-label"];
|
|
1518
1539
|
}
|
|
@@ -1624,8 +1645,8 @@ class O extends l {
|
|
|
1624
1645
|
i && i.addEventListener("click", () => this.close());
|
|
1625
1646
|
}
|
|
1626
1647
|
}
|
|
1627
|
-
customElements.get("ui-alert") || customElements.define("ui-alert",
|
|
1628
|
-
class
|
|
1648
|
+
customElements.get("ui-alert") || customElements.define("ui-alert", R);
|
|
1649
|
+
class V extends l {
|
|
1629
1650
|
static get observedAttributes() {
|
|
1630
1651
|
return ["variant", "bordered"];
|
|
1631
1652
|
}
|
|
@@ -1686,8 +1707,8 @@ class P extends l {
|
|
|
1686
1707
|
`;
|
|
1687
1708
|
}
|
|
1688
1709
|
}
|
|
1689
|
-
customElements.get("ui-card") || customElements.define("ui-card",
|
|
1690
|
-
class
|
|
1710
|
+
customElements.get("ui-card") || customElements.define("ui-card", V);
|
|
1711
|
+
class N extends l {
|
|
1691
1712
|
static get observedAttributes() {
|
|
1692
1713
|
return ["multiple"];
|
|
1693
1714
|
}
|
|
@@ -1699,7 +1720,7 @@ class _ extends l {
|
|
|
1699
1720
|
}
|
|
1700
1721
|
handleItemToggle(e) {
|
|
1701
1722
|
this.multiple || e.detail.open && Array.from(this.querySelectorAll("ui-accordion-item")).forEach((r) => {
|
|
1702
|
-
r !== e.detail.item && r instanceof
|
|
1723
|
+
r !== e.detail.item && r instanceof $ && (r.open = !1);
|
|
1703
1724
|
});
|
|
1704
1725
|
}
|
|
1705
1726
|
render() {
|
|
@@ -1717,7 +1738,7 @@ class _ extends l {
|
|
|
1717
1738
|
`;
|
|
1718
1739
|
}
|
|
1719
1740
|
}
|
|
1720
|
-
class
|
|
1741
|
+
class $ extends l {
|
|
1721
1742
|
static get observedAttributes() {
|
|
1722
1743
|
return ["open", "title", "disabled"];
|
|
1723
1744
|
}
|
|
@@ -1815,9 +1836,9 @@ class E extends l {
|
|
|
1815
1836
|
}));
|
|
1816
1837
|
}
|
|
1817
1838
|
}
|
|
1818
|
-
customElements.get("ui-accordion") || customElements.define("ui-accordion",
|
|
1819
|
-
customElements.get("ui-accordion-item") || customElements.define("ui-accordion-item",
|
|
1820
|
-
class
|
|
1839
|
+
customElements.get("ui-accordion") || customElements.define("ui-accordion", N);
|
|
1840
|
+
customElements.get("ui-accordion-item") || customElements.define("ui-accordion-item", $);
|
|
1841
|
+
class W extends l {
|
|
1821
1842
|
constructor() {
|
|
1822
1843
|
super();
|
|
1823
1844
|
c(this, "_isOpen", !1);
|
|
@@ -1915,14 +1936,14 @@ class R extends l {
|
|
|
1915
1936
|
});
|
|
1916
1937
|
}
|
|
1917
1938
|
}
|
|
1918
|
-
class
|
|
1939
|
+
class X extends HTMLElement {
|
|
1919
1940
|
connectedCallback() {
|
|
1920
1941
|
this.setAttribute("role", "menuitem"), this.setAttribute("tabindex", "0");
|
|
1921
1942
|
}
|
|
1922
1943
|
}
|
|
1923
|
-
customElements.get("ui-dropdown") || customElements.define("ui-dropdown",
|
|
1924
|
-
customElements.get("ui-dropdown-item") || customElements.define("ui-dropdown-item",
|
|
1925
|
-
class
|
|
1944
|
+
customElements.get("ui-dropdown") || customElements.define("ui-dropdown", W);
|
|
1945
|
+
customElements.get("ui-dropdown-item") || customElements.define("ui-dropdown-item", X);
|
|
1946
|
+
class Y extends l {
|
|
1926
1947
|
static get observedAttributes() {
|
|
1927
1948
|
return ["value", "max", "size", "variant", "aria-label"];
|
|
1928
1949
|
}
|
|
@@ -1997,8 +2018,8 @@ class N extends l {
|
|
|
1997
2018
|
`;
|
|
1998
2019
|
}
|
|
1999
2020
|
}
|
|
2000
|
-
customElements.get("ui-progress") || customElements.define("ui-progress",
|
|
2001
|
-
class
|
|
2021
|
+
customElements.get("ui-progress") || customElements.define("ui-progress", Y);
|
|
2022
|
+
class G extends l {
|
|
2002
2023
|
static get observedAttributes() {
|
|
2003
2024
|
return ["current", "total", "page-size"];
|
|
2004
2025
|
}
|
|
@@ -2100,7 +2121,7 @@ class W extends l {
|
|
|
2100
2121
|
`;
|
|
2101
2122
|
}
|
|
2102
2123
|
}
|
|
2103
|
-
customElements.get("ui-pagination") || customElements.define("ui-pagination",
|
|
2124
|
+
customElements.get("ui-pagination") || customElements.define("ui-pagination", G);
|
|
2104
2125
|
const v = class v extends l {
|
|
2105
2126
|
static get observedAttributes() {
|
|
2106
2127
|
return ["striped", "bordered", "hoverable"];
|
|
@@ -2204,7 +2225,7 @@ const v = class v extends l {
|
|
|
2204
2225
|
c(v, "lightCssInjected", !1);
|
|
2205
2226
|
let w = v;
|
|
2206
2227
|
customElements.get("ui-table") || customElements.define("ui-table", w);
|
|
2207
|
-
class
|
|
2228
|
+
class Z extends l {
|
|
2208
2229
|
static get observedAttributes() {
|
|
2209
2230
|
return ["src", "alt", "name", "size", "shape"];
|
|
2210
2231
|
}
|
|
@@ -2282,8 +2303,8 @@ class X extends l {
|
|
|
2282
2303
|
`;
|
|
2283
2304
|
}
|
|
2284
2305
|
}
|
|
2285
|
-
customElements.get("ui-avatar") || customElements.define("ui-avatar",
|
|
2286
|
-
class
|
|
2306
|
+
customElements.get("ui-avatar") || customElements.define("ui-avatar", Z);
|
|
2307
|
+
class J extends l {
|
|
2287
2308
|
static get observedAttributes() {
|
|
2288
2309
|
return ["separator", "aria-label"];
|
|
2289
2310
|
}
|
|
@@ -2329,7 +2350,7 @@ class Y extends l {
|
|
|
2329
2350
|
e && e.addEventListener("slotchange", () => this.syncSeparators());
|
|
2330
2351
|
}
|
|
2331
2352
|
}
|
|
2332
|
-
class
|
|
2353
|
+
class Q extends l {
|
|
2333
2354
|
static get observedAttributes() {
|
|
2334
2355
|
return ["href", "separator", "current"];
|
|
2335
2356
|
}
|
|
@@ -2388,9 +2409,9 @@ class G extends l {
|
|
|
2388
2409
|
`;
|
|
2389
2410
|
}
|
|
2390
2411
|
}
|
|
2391
|
-
customElements.get("ui-breadcrumbs") || customElements.define("ui-breadcrumbs",
|
|
2392
|
-
customElements.get("ui-breadcrumb-item") || customElements.define("ui-breadcrumb-item",
|
|
2393
|
-
class
|
|
2412
|
+
customElements.get("ui-breadcrumbs") || customElements.define("ui-breadcrumbs", J);
|
|
2413
|
+
customElements.get("ui-breadcrumb-item") || customElements.define("ui-breadcrumb-item", Q);
|
|
2414
|
+
class tt extends l {
|
|
2394
2415
|
static get observedAttributes() {
|
|
2395
2416
|
return ["open", "side", "title"];
|
|
2396
2417
|
}
|
|
@@ -2530,8 +2551,8 @@ class J extends l {
|
|
|
2530
2551
|
});
|
|
2531
2552
|
}
|
|
2532
2553
|
}
|
|
2533
|
-
customElements.get("ui-drawer") || customElements.define("ui-drawer",
|
|
2534
|
-
class
|
|
2554
|
+
customElements.get("ui-drawer") || customElements.define("ui-drawer", tt);
|
|
2555
|
+
class et extends l {
|
|
2535
2556
|
static get observedAttributes() {
|
|
2536
2557
|
return ["variant", "width", "height", "lines"];
|
|
2537
2558
|
}
|
|
@@ -2590,8 +2611,8 @@ class Q extends l {
|
|
|
2590
2611
|
return e.replace(/["<>]/g, "");
|
|
2591
2612
|
}
|
|
2592
2613
|
}
|
|
2593
|
-
customElements.get("ui-skeleton") || customElements.define("ui-skeleton",
|
|
2594
|
-
class
|
|
2614
|
+
customElements.get("ui-skeleton") || customElements.define("ui-skeleton", et);
|
|
2615
|
+
class it extends l {
|
|
2595
2616
|
static get observedAttributes() {
|
|
2596
2617
|
return ["brand", "sticky"];
|
|
2597
2618
|
}
|
|
@@ -2677,8 +2698,8 @@ class Z extends l {
|
|
|
2677
2698
|
`;
|
|
2678
2699
|
}
|
|
2679
2700
|
}
|
|
2680
|
-
customElements.get("ui-navbar") || customElements.define("ui-navbar",
|
|
2681
|
-
class
|
|
2701
|
+
customElements.get("ui-navbar") || customElements.define("ui-navbar", it);
|
|
2702
|
+
class S extends l {
|
|
2682
2703
|
constructor() {
|
|
2683
2704
|
super(...arguments);
|
|
2684
2705
|
c(this, "defaultValue", "");
|
|
@@ -2820,9 +2841,9 @@ ${this.escapeHtml(f)}</textarea>
|
|
|
2820
2841
|
});
|
|
2821
2842
|
}
|
|
2822
2843
|
}
|
|
2823
|
-
c(
|
|
2824
|
-
customElements.get("ui-textarea") || customElements.define("ui-textarea",
|
|
2825
|
-
class
|
|
2844
|
+
c(S, "formAssociated", !0);
|
|
2845
|
+
customElements.get("ui-textarea") || customElements.define("ui-textarea", S);
|
|
2846
|
+
class rt extends l {
|
|
2826
2847
|
static get observedAttributes() {
|
|
2827
2848
|
return ["heading", "description", "size", "variant"];
|
|
2828
2849
|
}
|
|
@@ -2878,8 +2899,8 @@ class tt extends l {
|
|
|
2878
2899
|
o("icon", this.root.querySelector(".icon")), o(null, this.root.querySelector(".actions"));
|
|
2879
2900
|
}
|
|
2880
2901
|
}
|
|
2881
|
-
customElements.get("ui-empty-state") || customElements.define("ui-empty-state",
|
|
2882
|
-
class
|
|
2902
|
+
customElements.get("ui-empty-state") || customElements.define("ui-empty-state", rt);
|
|
2903
|
+
class ot extends l {
|
|
2883
2904
|
static get observedAttributes() {
|
|
2884
2905
|
return ["value", "size", "disabled", "aria-label"];
|
|
2885
2906
|
}
|
|
@@ -2989,7 +3010,7 @@ class et extends l {
|
|
|
2989
3010
|
`, (t = this.root.querySelector("slot")) == null || t.addEventListener("slotchange", () => this.refresh());
|
|
2990
3011
|
}
|
|
2991
3012
|
}
|
|
2992
|
-
class
|
|
3013
|
+
class st extends HTMLElement {
|
|
2993
3014
|
connectedCallback() {
|
|
2994
3015
|
var e;
|
|
2995
3016
|
this.setAttribute("role", "radio"), this.hasAttribute("aria-checked") || this.setAttribute("aria-checked", "false"), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "-1"), (e = this.closest("ui-segmented")) == null || e.refresh();
|
|
@@ -3002,9 +3023,9 @@ class it extends HTMLElement {
|
|
|
3002
3023
|
(e = this.closest("ui-segmented")) == null || e.refresh();
|
|
3003
3024
|
}
|
|
3004
3025
|
}
|
|
3005
|
-
customElements.get("ui-segmented") || customElements.define("ui-segmented",
|
|
3006
|
-
customElements.get("ui-segment") || customElements.define("ui-segment",
|
|
3007
|
-
class
|
|
3026
|
+
customElements.get("ui-segmented") || customElements.define("ui-segmented", ot);
|
|
3027
|
+
customElements.get("ui-segment") || customElements.define("ui-segment", st);
|
|
3028
|
+
class at extends l {
|
|
3008
3029
|
static get observedAttributes() {
|
|
3009
3030
|
return ["current", "orientation", "aria-label"];
|
|
3010
3031
|
}
|
|
@@ -3046,7 +3067,7 @@ class rt extends l {
|
|
|
3046
3067
|
`, (t = this.root.querySelector("slot")) == null || t.addEventListener("slotchange", () => this.refresh());
|
|
3047
3068
|
}
|
|
3048
3069
|
}
|
|
3049
|
-
class
|
|
3070
|
+
class nt extends l {
|
|
3050
3071
|
static get observedAttributes() {
|
|
3051
3072
|
return ["label", "description", "status", "data-state", "data-index", "data-last", "data-vertical"];
|
|
3052
3073
|
}
|
|
@@ -3111,9 +3132,9 @@ class ot extends l {
|
|
|
3111
3132
|
`;
|
|
3112
3133
|
}
|
|
3113
3134
|
}
|
|
3114
|
-
customElements.get("ui-stepper") || customElements.define("ui-stepper",
|
|
3115
|
-
customElements.get("ui-step") || customElements.define("ui-step",
|
|
3116
|
-
class
|
|
3135
|
+
customElements.get("ui-stepper") || customElements.define("ui-stepper", at);
|
|
3136
|
+
customElements.get("ui-step") || customElements.define("ui-step", nt);
|
|
3137
|
+
class lt extends l {
|
|
3117
3138
|
static get observedAttributes() {
|
|
3118
3139
|
return ["variant", "size", "removable", "disabled", "remove-label"];
|
|
3119
3140
|
}
|
|
@@ -3195,8 +3216,8 @@ class st extends l {
|
|
|
3195
3216
|
});
|
|
3196
3217
|
}
|
|
3197
3218
|
}
|
|
3198
|
-
customElements.get("ui-chip") || customElements.define("ui-chip",
|
|
3199
|
-
class
|
|
3219
|
+
customElements.get("ui-chip") || customElements.define("ui-chip", lt);
|
|
3220
|
+
class ct extends l {
|
|
3200
3221
|
static get observedAttributes() {
|
|
3201
3222
|
return ["level", "time"];
|
|
3202
3223
|
}
|
|
@@ -3254,8 +3275,8 @@ class at extends l {
|
|
|
3254
3275
|
`;
|
|
3255
3276
|
}
|
|
3256
3277
|
}
|
|
3257
|
-
customElements.get("ui-log-item") || customElements.define("ui-log-item",
|
|
3258
|
-
class
|
|
3278
|
+
customElements.get("ui-log-item") || customElements.define("ui-log-item", ct);
|
|
3279
|
+
class dt extends l {
|
|
3259
3280
|
static get observedAttributes() {
|
|
3260
3281
|
return ["label", "height", "wrap", "auto-scroll", "max", "empty"];
|
|
3261
3282
|
}
|
|
@@ -3412,47 +3433,47 @@ class nt extends l {
|
|
|
3412
3433
|
e && (e.textContent = this.items().length > 0 ? `${this.items().length}건` : "");
|
|
3413
3434
|
}
|
|
3414
3435
|
}
|
|
3415
|
-
customElements.get("ui-log") || customElements.define("ui-log",
|
|
3436
|
+
customElements.get("ui-log") || customElements.define("ui-log", dt);
|
|
3416
3437
|
export {
|
|
3417
3438
|
y as FocusTrap,
|
|
3418
|
-
|
|
3419
|
-
|
|
3420
|
-
|
|
3421
|
-
|
|
3422
|
-
|
|
3423
|
-
|
|
3424
|
-
|
|
3425
|
-
|
|
3426
|
-
|
|
3427
|
-
|
|
3428
|
-
|
|
3429
|
-
|
|
3430
|
-
|
|
3431
|
-
|
|
3439
|
+
N as UIAccordion,
|
|
3440
|
+
$ as UIAccordionItem,
|
|
3441
|
+
R as UIAlert,
|
|
3442
|
+
Z as UIAvatar,
|
|
3443
|
+
P as UIBadge,
|
|
3444
|
+
Q as UIBreadcrumbItem,
|
|
3445
|
+
J as UIBreadcrumbs,
|
|
3446
|
+
D as UIButton,
|
|
3447
|
+
V as UICard,
|
|
3448
|
+
C as UICheckbox,
|
|
3449
|
+
lt as UIChip,
|
|
3450
|
+
tt as UIDrawer,
|
|
3451
|
+
W as UIDropdown,
|
|
3452
|
+
X as UIDropdownItem,
|
|
3432
3453
|
l as UIElement,
|
|
3433
|
-
|
|
3434
|
-
|
|
3435
|
-
|
|
3436
|
-
|
|
3437
|
-
|
|
3438
|
-
|
|
3439
|
-
|
|
3440
|
-
|
|
3441
|
-
|
|
3454
|
+
rt as UIEmptyState,
|
|
3455
|
+
z as UIInput,
|
|
3456
|
+
dt as UILog,
|
|
3457
|
+
ct as UILogItem,
|
|
3458
|
+
I as UIModal,
|
|
3459
|
+
it as UINavbar,
|
|
3460
|
+
q as UIOption,
|
|
3461
|
+
G as UIPagination,
|
|
3462
|
+
Y as UIProgress,
|
|
3442
3463
|
k as UIRadio,
|
|
3443
|
-
|
|
3444
|
-
|
|
3445
|
-
|
|
3446
|
-
|
|
3447
|
-
|
|
3448
|
-
|
|
3449
|
-
|
|
3450
|
-
|
|
3451
|
-
|
|
3452
|
-
|
|
3464
|
+
st as UISegment,
|
|
3465
|
+
ot as UISegmented,
|
|
3466
|
+
M as UISelect,
|
|
3467
|
+
et as UISkeleton,
|
|
3468
|
+
_ as UISpinner,
|
|
3469
|
+
nt as UIStep,
|
|
3470
|
+
at as UIStepper,
|
|
3471
|
+
E as UISwitch,
|
|
3472
|
+
j as UITab,
|
|
3473
|
+
K as UITabPanel,
|
|
3453
3474
|
w as UITable,
|
|
3454
|
-
|
|
3455
|
-
|
|
3456
|
-
|
|
3457
|
-
|
|
3475
|
+
O as UITabs,
|
|
3476
|
+
S as UITextarea,
|
|
3477
|
+
U as UIToast,
|
|
3478
|
+
F as UITooltip
|
|
3458
3479
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cubit-ui/core",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.1",
|
|
4
4
|
"description": "Core Web Components for Cubit UI Design System",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"repository": {
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"dist"
|
|
37
37
|
],
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@cubit-ui/tokens": "2.0.
|
|
39
|
+
"@cubit-ui/tokens": "2.0.1"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"typescript": "^5.7.3",
|