@iyulab/components 0.3.0 → 1.0.0

package/dist/components/progress-ring/UProgressRing.component.js

@@ -1,114 +0,0 @@
-import { html } from 'lit';
-import { state, property } from 'lit/decorators.js';
-import { BaseElement } from '../BaseElement.js';
-import { styles } from './UProgressRing.styles.js';
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-const PATH_LENGTH = 100;
-class UProgressRing extends BaseElement {
-  constructor() {
-    super(...arguments);
-    this.dasharray = PATH_LENGTH.toString();
-    this.progress = 0;
-    this.variant = "smooth";
-    this.minValue = 0;
-    this.maxValue = 100;
-    this.value = 0;
-  }
-  static {
-    this.styles = [super.styles, styles];
-  }
-  static {
-    this.dependencies = {};
-  }
-  willUpdate(changedProperties) {
-    super.willUpdate(changedProperties);
-    if (changedProperties.has("variant")) {
-      this.updateDashArray();
-    }
-    if (changedProperties.has("minValue") || changedProperties.has("maxValue") || changedProperties.has("value")) {
-      this.updateProgressState();
-    }
-  }
-  render() {
-    return html`
-      <svg class="progress-ring" part="base">
-        <defs>
-          <mask id="progress-mask">
-            <circle
-              pathLength="${PATH_LENGTH}"
-              stroke="white"
-              stroke-dasharray="${PATH_LENGTH}"
-              stroke-dashoffset="${PATH_LENGTH * (1 - this.progress)}"
-              stroke-linecap=${this.variant === "smooth" ? "round" : "butt"}
-            ></circle>
-          </mask>
-        </defs>
-        
-        <circle 
-          class="track"
-          pathLength="${PATH_LENGTH}"
-          stroke-dasharray="${this.dasharray}"
-        ></circle>
-        <circle 
-          class="indicator"
-          pathLength="${PATH_LENGTH}"
-          stroke-dasharray="${this.dasharray}"
-          mask="url(#progress-mask)"
-        ></circle>
-      </svg>
-      <div class="label" part="label">
-        ${Math.round(this.progress * 100)} %
-      </div>
-    `;
-  }
-  /** 
-   * 진행 상태를 0과 1 사이의 값으로 반환합니다. 
-   */
-  updateProgressState() {
-    const range = this.maxValue - this.minValue;
-    const clampedValue = Math.max(this.minValue, Math.min(this.maxValue, this.value));
-    this.progress = range === 0 ? 0 : (clampedValue - this.minValue) / range;
-  }
-  /** 
-   * variant에 따라 dasharray 값을 반환합니다. 
-   * [dash-length] [gap-length] or [dash-length] 형식
-   */
-  updateDashArray() {
-    if (this.variant === "ticks") {
-      this.dasharray = "1 1";
-    } else if (this.variant === "blocks") {
-      this.dasharray = "8 2";
-    } else {
-      this.dasharray = PATH_LENGTH.toString();
-    }
-  }
-}
-__decorateClass([
-  state()
-], UProgressRing.prototype, "dasharray");
-__decorateClass([
-  state()
-], UProgressRing.prototype, "progress");
-__decorateClass([
-  property({ type: String, reflect: true })
-], UProgressRing.prototype, "variant");
-__decorateClass([
-  property({ type: Number })
-], UProgressRing.prototype, "minValue");
-__decorateClass([
-  property({ type: Number })
-], UProgressRing.prototype, "maxValue");
-__decorateClass([
-  property({ type: Number })
-], UProgressRing.prototype, "value");
-
-export { UProgressRing };

package/dist/components/skeleton/USkeleton.component.d.ts

@@ -1,22 +0,0 @@
-import { PropertyValues } from 'lit';
-import { BaseElement } from '../BaseElement.js';
-export type SkeletonShape = 'default' | 'circle' | 'rounded';
-export type SkeletonEffect = 'pulse' | 'shimmer' | 'none';
-/**
- * 콘텐츠가 로딩 중임을 나타내는 Skeleton 컴포넌트입니다.
- * 다양한 모양과 애니메이션 효과를 지원합니다.
- */
-export declare class USkeleton extends BaseElement {
-    static styles: import('lit').CSSResultGroup[];
-    static dependencies: Record<string, typeof BaseElement>;
-    /** 모양 (default, circle, rounded) */
-    shape: SkeletonShape;
-    /** 애니메이션 효과 (pulse, shimmer, none) */
-    effect: SkeletonEffect;
-    /** 스켈레톤의 너비 (CSS 값) */
-    width?: string;
-    /** 스켈레톤의 높이 (CSS 값) */
-    height?: string;
-    protected updated(changedProperties: PropertyValues): void;
-    render(): import('lit-html').TemplateResult<1>;
-}

package/dist/components/skeleton/USkeleton.component.js

@@ -1,58 +0,0 @@
-import { html } from 'lit';
-import { property } from 'lit/decorators.js';
-import { BaseElement } from '../BaseElement.js';
-import { styles } from './USkeleton.styles.js';
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-class USkeleton extends BaseElement {
-  constructor() {
-    super(...arguments);
-    this.shape = "default";
-    this.effect = "pulse";
-  }
-  static {
-    this.styles = [super.styles, styles];
-  }
-  static {
-    this.dependencies = {};
-  }
-  updated(changedProperties) {
-    super.updated(changedProperties);
-    if (changedProperties.has("width") && this.width) {
-      this.style.setProperty("--skeleton-width", this.width);
-    }
-    if (changedProperties.has("height") && this.height) {
-      this.style.setProperty("--skeleton-height", this.height);
-    }
-  }
-  render() {
-    return html`
-      <div class="skeleton" part="base"
-        shape=${this.shape}
-        effect=${this.effect}
-      ></div>
-    `;
-  }
-}
-__decorateClass([
-  property({ type: String, reflect: true })
-], USkeleton.prototype, "shape");
-__decorateClass([
-  property({ type: String, reflect: true })
-], USkeleton.prototype, "effect");
-__decorateClass([
-  property({ type: String })
-], USkeleton.prototype, "width");
-__decorateClass([
-  property({ type: String })
-], USkeleton.prototype, "height");
-
-export { USkeleton };

package/dist/components/spinner/USpinner.component.d.ts

@@ -1,9 +0,0 @@
-import { BaseElement } from '../BaseElement.js';
-/**
- * Spinner 컴포넌트는 로딩 상태를 시각적으로 표시하는 회전하는 원형 스피너를 제공합니다.
- */
-export declare class USpinner extends BaseElement {
-    static styles: import('lit').CSSResultGroup[];
-    static dependencies: Record<string, typeof BaseElement>;
-    render(): import('lit-html').TemplateResult<1>;
-}

package/dist/components/spinner/USpinner.component.js

@@ -1,22 +0,0 @@
-import { html } from 'lit';
-import { BaseElement } from '../BaseElement.js';
-import { styles } from './USpinner.styles.js';
-
-class USpinner extends BaseElement {
-  static {
-    this.styles = [super.styles, styles];
-  }
-  static {
-    this.dependencies = {};
-  }
-  render() {
-    return html`
-      <svg class="spinner" part="base">
-        <circle class="track"></circle>
-        <circle class="indicator"></circle>
-      </svg>
-    `;
-  }
-}
-
-export { USpinner };

package/dist/components/split-panel/USplitPanel.component.d.ts

@@ -1,44 +0,0 @@
-import { PropertyValues } from 'lit';
-import { BaseElement } from '../BaseElement.js';
-/**
- * SplitPanel 컴포넌트는 화면을 여러 개의 패널로 분할하여 표시합니다.
- */
-export declare class USplitPanel extends BaseElement {
-    static styles: import('lit').CSSResultGroup[];
-    static dependencies: Record<string, typeof BaseElement>;
-    /** 현재 상태를 저장하는 패널 요소들 */
-    private panels;
-    private sizes;
-    /** 드래그 시작 시 저장되는 정보 */
-    private draggingIndex;
-    private dragStartSizes;
-    private dragStartPosition;
-    private containerSize;
-    slotEls?: HTMLElement[];
-    /** 스플리터 개수 (렌더링용) */
-    splitterCount: number;
-    /** 분할 방향을 설정합니다. 'horizontal'은 좌우 분할, 'vertical'은 상하 분할입니다. */
-    orientation: 'horizontal' | 'vertical';
-    /** 초기 패널 크기 비율을 설정합니다. (예: [30, 70]은 첫 번째 패널이 30%, 두 번째 패널이 70%를 차지) */
-    initRatio: number[];
-    /** 각 패널의 최소 크기를 설정합니다. (픽셀 단위) */
-    minSizes: number[];
-    /** 각 패널의 최대 크기를 설정합니다. (픽셀 단위) */
-    maxSizes: number[];
-    disconnectedCallback(): void;
-    protected willUpdate(changedProperties: PropertyValues): void;
-    render(): import('lit-html').TemplateResult<1>;
-    /** 슬롯 변경시 패널 초기화 */
-    private handleSlotChange;
-    /** 패널 및 크기 초기화 */
-    private initialize;
-    /** 패널에 새로운 스타일 적용 */
-    private updatePanelStyles;
-    private handleSplitterMouseDown;
-    private handleDocumentMouseMove;
-    private handleDocumentMouseUp;
-    /** 전역 이벤트 리스너 제거 */
-    private removeEventListeners;
-    /** 거터 크기 가져오기 */
-    private getGutterSize;
-}

package/dist/components/split-panel/USplitPanel.component.js

@@ -1,185 +0,0 @@
-import { html } from 'lit';
-import { queryAssignedElements, state, property } from 'lit/decorators.js';
-import { arrayAttrConverter } from '../../utilities/converters.js';
-import { BaseElement } from '../BaseElement.js';
-import { styles } from './USplitPanel.styles.js';
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-class USplitPanel extends BaseElement {
-  constructor() {
-    super(...arguments);
-    /** 현재 상태를 저장하는 패널 요소들 */
-    this.panels = [];
-    this.sizes = [];
-    /** 드래그 시작 시 저장되는 정보 */
-    this.draggingIndex = -1;
-    this.dragStartSizes = [];
-    this.dragStartPosition = 0;
-    this.containerSize = 0;
-    this.splitterCount = 0;
-    this.orientation = "horizontal";
-    this.initRatio = [];
-    this.minSizes = [];
-    this.maxSizes = [];
-    /** 슬롯 변경시 패널 초기화 */
-    this.handleSlotChange = () => {
-      const panels = this.slotEls || [];
-      if (panels.every((p, i) => p === this.panels[i])) {
-        return;
-      }
-      this.initialize();
-    };
-    /** 패널 및 크기 초기화 */
-    this.initialize = () => {
-      this.panels = this.slotEls || [];
-      if (this.panels.length === 0) {
-        this.splitterCount = 0;
-        return;
-      }
-      this.splitterCount = Math.max(0, this.panels.length - 1);
-      if (this.initRatio.length === this.panels.length) {
-        const total = this.initRatio.reduce((sum, r) => sum + r, 0);
-        this.sizes = this.initRatio.map((r) => r / total * 100);
-      } else {
-        const equalSize = 100 / this.panels.length;
-        this.sizes = this.panels.map(() => equalSize);
-      }
-      this.updatePanelStyles();
-      this.requestUpdate();
-    };
-    this.handleSplitterMouseDown = (e, index) => {
-      if (e.button !== 0) return;
-      e.preventDefault();
-      this.draggingIndex = index;
-      this.dragStartPosition = this.orientation === "horizontal" ? e.clientX : e.clientY;
-      this.dragStartSizes = [...this.sizes];
-      const rect = this.getBoundingClientRect();
-      this.containerSize = this.orientation === "horizontal" ? rect.width : rect.height;
-      this.containerSize -= this.getGutterSize() * this.splitterCount;
-      const splitters = this.shadowRoot?.querySelectorAll(".splitter");
-      splitters?.[index]?.classList.add("active");
-      document.addEventListener("mousemove", this.handleDocumentMouseMove);
-      document.addEventListener("mouseup", this.handleDocumentMouseUp);
-      document.body.style.userSelect = "none";
-      document.body.style.cursor = this.orientation === "horizontal" ? "col-resize" : "row-resize";
-    };
-    this.handleDocumentMouseMove = (e) => {
-      if (this.draggingIndex === -1) return;
-      e.preventDefault();
-      const currentPosition = this.orientation === "horizontal" ? e.clientX : e.clientY;
-      const delta = currentPosition - this.dragStartPosition;
-      const deltaPercent = delta / this.containerSize * 100;
-      const aIndex = this.draggingIndex;
-      const bIndex = this.draggingIndex + 1;
-      let newASize = this.dragStartSizes[aIndex] + deltaPercent;
-      let newBSize = this.dragStartSizes[bIndex] - deltaPercent;
-      const minAPercent = (this.minSizes[aIndex] ?? 0) / this.containerSize * 100;
-      const minBPercent = (this.minSizes[bIndex] ?? 0) / this.containerSize * 100;
-      const maxAPercent = this.maxSizes[aIndex] ? this.maxSizes[aIndex] / this.containerSize * 100 : 100;
-      const maxBPercent = this.maxSizes[bIndex] ? this.maxSizes[bIndex] / this.containerSize * 100 : 100;
-      if (newASize < minAPercent) {
-        newASize = minAPercent;
-        newBSize = this.dragStartSizes[aIndex] + this.dragStartSizes[bIndex] - newASize;
-      }
-      if (newBSize < minBPercent) {
-        newBSize = minBPercent;
-        newASize = this.dragStartSizes[aIndex] + this.dragStartSizes[bIndex] - newBSize;
-      }
-      if (newASize > maxAPercent) {
-        newASize = maxAPercent;
-        newBSize = this.dragStartSizes[aIndex] + this.dragStartSizes[bIndex] - newASize;
-      }
-      if (newBSize > maxBPercent) {
-        newBSize = maxBPercent;
-        newASize = this.dragStartSizes[aIndex] + this.dragStartSizes[bIndex] - newBSize;
-      }
-      this.sizes[aIndex] = newASize;
-      this.sizes[bIndex] = newBSize;
-      this.updatePanelStyles();
-    };
-    this.handleDocumentMouseUp = () => {
-      if (this.draggingIndex === -1) return;
-      const splitters = this.shadowRoot?.querySelectorAll(".splitter");
-      splitters?.[this.draggingIndex]?.classList.remove("active");
-      this.draggingIndex = -1;
-      this.removeEventListeners();
-      document.body.style.userSelect = "";
-      document.body.style.cursor = "";
-    };
-  }
-  static {
-    this.styles = [super.styles, styles];
-  }
-  static {
-    this.dependencies = {};
-  }
-  disconnectedCallback() {
-    this.removeEventListeners();
-    super.disconnectedCallback();
-  }
-  willUpdate(changedProperties) {
-    super.willUpdate(changedProperties);
-    if (changedProperties.has("orientation")) {
-      this.initialize();
-    }
-  }
-  render() {
-    return html`
-      ${Array.from({ length: this.splitterCount }, (_, i) => html`
-        <div class="splitter" style="order: ${i * 2 + 1}"
-          orientation=${this.orientation}
-          @mousedown=${(e) => this.handleSplitterMouseDown(e, i)}>
-        </div>
-      `)}
-      <slot @slotchange=${this.handleSlotChange}></slot>
-    `;
-  }
-  /** 패널에 새로운 스타일 적용 */
-  updatePanelStyles() {
-    const dimension = this.orientation === "horizontal" ? "width" : "height";
-    const gutterSize = this.getGutterSize();
-    this.panels.forEach((panel, index) => {
-      const size = this.sizes[index];
-      panel.style[dimension] = `calc(${size}% - ${gutterSize * (this.splitterCount / this.panels.length)}px)`;
-      panel.style.order = String(index * 2);
-    });
-  }
-  /** 전역 이벤트 리스너 제거 */
-  removeEventListeners() {
-    document.removeEventListener("mousemove", this.handleDocumentMouseMove);
-    document.removeEventListener("mouseup", this.handleDocumentMouseUp);
-  }
-  /** 거터 크기 가져오기 */
-  getGutterSize() {
-    const sizeStr = getComputedStyle(this).getPropertyValue("--splitter-size").trim();
-    return parseFloat(sizeStr) || 4;
-  }
-}
-__decorateClass([
-  queryAssignedElements({ flatten: true })
-], USplitPanel.prototype, "slotEls");
-__decorateClass([
-  state()
-], USplitPanel.prototype, "splitterCount");
-__decorateClass([
-  property({ type: String, reflect: true })
-], USplitPanel.prototype, "orientation");
-__decorateClass([
-  property({ type: Array, attribute: "init-ratio", converter: arrayAttrConverter(parseFloat) })
-], USplitPanel.prototype, "initRatio");
-__decorateClass([
-  property({ type: Array, attribute: "min-sizes", converter: arrayAttrConverter(parseFloat) })
-], USplitPanel.prototype, "minSizes");
-__decorateClass([
-  property({ type: Array, attribute: "max-sizes", converter: arrayAttrConverter(parseFloat) })
-], USplitPanel.prototype, "maxSizes");
-
-export { USplitPanel };

package/dist/components/tag/UTag.component.d.ts

@@ -1,23 +0,0 @@
-import { BaseElement } from '../BaseElement.js';
-export type TagVariant = "default" | "info" | "success" | "warning" | "danger";
-/**
- * Tag 컴포넌트는 레이블, 카테고리, 상태 등을 표시하는데 사용됩니다.
- * @slot - 태그 내부에 표시할 콘텐츠를 삽입합니다.
- * @slot prefix - 태그의 접두사로 표시할 콘텐츠를 삽입합니다.
- * @slot suffix - 태그의 접미사로 표시할 콘텐츠를 삽입합니다.
- */
-export declare class UTag extends BaseElement {
-    static styles: import('lit').CSSResultGroup[];
-    static dependencies: Record<string, typeof BaseElement>;
-    /** 태그의 스타일 변형을 설정합니다. */
-    variant: TagVariant;
-    /** 태그를 둥글게 표시합니다. */
-    rounded: boolean;
-    /** 태그를 제거 가능하게 설정합니다. */
-    removable: boolean;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    render(): import('lit-html').TemplateResult<1>;
-    private handleRemoveButtonClick;
-    private handleTransitionEnd;
-}

package/dist/components/tag/UTag.component.js

@@ -1,72 +0,0 @@
-import { html } from 'lit';
-import { property } from 'lit/decorators.js';
-import { BaseElement } from '../BaseElement.js';
-import { styles } from './UTag.styles.js';
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-class UTag extends BaseElement {
-  constructor() {
-    super(...arguments);
-    this.variant = "default";
-    this.rounded = false;
-    this.removable = false;
-    this.handleRemoveButtonClick = (e) => {
-      e.stopPropagation();
-      this.emit("u-remove");
-      requestAnimationFrame(() => {
-        this.style.transform = "scale(0.8)";
-        this.style.opacity = "0";
-      });
-    };
-    this.handleTransitionEnd = (e) => {
-      if (e.propertyName === "opacity" && this.style.opacity === "0") {
-        this.remove();
-      }
-    };
-  }
-  static {
-    this.styles = [super.styles, styles];
-  }
-  static {
-    this.dependencies = {};
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.addEventListener("transitionend", this.handleTransitionEnd);
-  }
-  disconnectedCallback() {
-    this.removeEventListener("transitionend", this.handleTransitionEnd);
-    super.disconnectedCallback();
-  }
-  render() {
-    return html`
-      <slot name="prefix"></slot>
-      <slot></slot>
-      <slot name="suffix"></slot>
-      <button class="remove-btn" part="remove-btn"
-        ?hidden=${!this.removable}
-        @click=${this.handleRemoveButtonClick}>
-        &times;
-      </button>
-    `;
-  }
-}
-__decorateClass([
-  property({ type: String, reflect: true })
-], UTag.prototype, "variant");
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], UTag.prototype, "rounded");
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], UTag.prototype, "removable");
-
-export { UTag };

package/dist/components/tooltip/UTooltip.component.d.ts

@@ -1,27 +0,0 @@
-import { PropertyValues } from 'lit';
-import { BaseElement } from '../BaseElement.js';
-import { FloatingElement } from '../FloatingElement.js';
-/**
- * Tooltip 컴포넌트는 대상 엘리먼트에 툴팁을 표시하는 기능을 제공합니다.
- */
-export declare class UTooltip extends FloatingElement {
-    static styles: import('lit').CSSResultGroup[];
-    static dependencies: Record<string, typeof BaseElement>;
-    /**
-     * 툴팁 내부로 마우스를 이동해도 툴팁이 유지되는지 여부입니다.
-     * true일 경우 툴팁 위에 마우스를 올려놓을 수 있습니다.
-     *
-     * @default false
-     */
-    interactive: boolean;
-    protected updated(changedProperties: PropertyValues): void;
-    render(): import('lit-html').TemplateResult<1>;
-    /** this 바인딩 이벤트 핸들러 */
-    private _show;
-    /** this 바인딩 이벤트 핸들러 */
-    private _hide;
-    /** 바인딩 이벤트 핸들러 */
-    private bind;
-    /** 바인딩 해제 이벤트 핸들러 */
-    private unbind;
-}

package/dist/components/tooltip/UTooltip.component.js

@@ -1,88 +0,0 @@
-import { html } from 'lit';
-import { property } from 'lit/decorators.js';
-import { FloatingElement } from '../FloatingElement.js';
-import { styles } from './UTooltip.styles.js';
-
-var __defProp = Object.defineProperty;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = void 0 ;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(target, key, result) ) || result;
-  if (result) __defProp(target, key, result);
-  return result;
-};
-class UTooltip extends FloatingElement {
-  constructor() {
-    super(...arguments);
-    this.interactive = false;
-    /** this 바인딩 이벤트 핸들러 */
-    this._show = (event) => {
-      const target = event.currentTarget;
-      if (!target) return;
-      this.show(target);
-    };
-    /** this 바인딩 이벤트 핸들러 */
-    this._hide = (event) => {
-      if (this.interactive) {
-        const target = this.target;
-        const related = event.relatedTarget;
-        if (!target || !related) return;
-        if (this.contains(related) || target.contains(related)) return;
-      }
-      this.hide();
-    };
-  }
-  static {
-    this.styles = [super.styles, styles];
-  }
-  static {
-    this.dependencies = {};
-  }
-  updated(changedProperties) {
-    super.updated(changedProperties);
-    if (changedProperties.has("anchors")) {
-      const oldAnchors = changedProperties.get("anchors");
-      const newAnchors = this.anchors;
-      if (oldAnchors) this.unbind(oldAnchors);
-      if (newAnchors) this.bind(newAnchors);
-    }
-    if (changedProperties.has("distance")) {
-      if (this.distance > 0) {
-        this.style.setProperty("--interactive-area", `${this.distance}px`);
-      } else {
-        this.style.removeProperty("--interactive-area");
-      }
-    }
-  }
-  render() {
-    return html`<slot></slot>`;
-  }
-  /** 바인딩 이벤트 핸들러 */
-  bind(anchors) {
-    for (const anchor of anchors) {
-      anchor.addEventListener("pointerenter", this._show);
-      anchor.addEventListener("pointerleave", this._hide);
-      anchor.addEventListener("focusin", this._show);
-      anchor.addEventListener("focusout", this._hide);
-    }
-    this.addEventListener("pointerleave", this._hide);
-    this.addEventListener("focusout", this._hide);
-  }
-  /** 바인딩 해제 이벤트 핸들러 */
-  unbind(anchors) {
-    for (const anchor of anchors) {
-      anchor.removeEventListener("pointerenter", this._show);
-      anchor.removeEventListener("pointerleave", this._hide);
-      anchor.removeEventListener("focusin", this._show);
-      anchor.removeEventListener("focusout", this._hide);
-    }
-    this.addEventListener("pointerleave", this._hide);
-    this.addEventListener("focusout", this._hide);
-  }
-}
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], UTooltip.prototype, "interactive");
-
-export { UTooltip };