@iyulab/components 0.1.7 → 0.1.9

package/dist/{integrations/react → react-components}/UProgressRing.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { ProgressRing } from '../../components/progress-ring/index';
+import { UProgressRing } from '../components/progress-ring/UProgressRing';
 
 export const UProgressRing = createComponent({
   react: React,
   tagName: 'u-progress-ring',
-  elementClass: ProgressRing,
+  elementClass: UProgressRing,
   events: {}
 });

package/dist/react-components/USkeleton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { USkeleton } from '../components/skeleton/USkeleton';
+
+export declare const USkeleton: React.ForwardRefExoticComponent<
+  Partial<USkeleton> & React.HTMLAttributes<USkeleton>
+>;
+
+export type USkeletonProps = React.ComponentProps<typeof USkeleton>;

package/dist/react-components/USkeleton.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import { createComponent } from '@lit/react';
+import { USkeleton } from '../components/skeleton/USkeleton';
+
+export const USkeleton = createComponent({
+  react: React,
+  tagName: 'u-skeleton',
+  elementClass: USkeleton,
+  events: {}
+});

package/dist/{integrations/react → react-components}/USpinner.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { Spinner } from '../../components/spinner/index';
+import { USpinner } from '../components/spinner/USpinner';
 
 export declare const USpinner: React.ForwardRefExoticComponent<
-  Partial<Spinner> & React.HTMLAttributes<Spinner>
+  Partial<USpinner> & React.HTMLAttributes<USpinner>
 >;
 
 export type USpinnerProps = React.ComponentProps<typeof USpinner>;

package/dist/{integrations/react → react-components}/USpinner.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { Spinner } from '../../components/spinner/index';
+import { USpinner } from '../components/spinner/USpinner';
 
 export const USpinner = createComponent({
   react: React,
   tagName: 'u-spinner',
-  elementClass: Spinner,
+  elementClass: USpinner,
   events: {}
 });

package/dist/{integrations/react → react-components}/USplitPanel.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { SplitPanel } from '../../components/split-panel/index';
+import { USplitPanel } from '../components/split-panel/USplitPanel';
 
 export declare const USplitPanel: React.ForwardRefExoticComponent<
-  Partial<SplitPanel> & React.HTMLAttributes<SplitPanel>
+  Partial<USplitPanel> & React.HTMLAttributes<USplitPanel>
 >;
 
 export type USplitPanelProps = React.ComponentProps<typeof USplitPanel>;

package/dist/{integrations/react → react-components}/USplitPanel.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { SplitPanel } from '../../components/split-panel/index';
+import { USplitPanel } from '../components/split-panel/USplitPanel';
 
 export const USplitPanel = createComponent({
   react: React,
   tagName: 'u-split-panel',
-  elementClass: SplitPanel,
+  elementClass: USplitPanel,
   events: {}
 });

package/dist/{integrations/react → react-components}/UTooltip.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { Tooltip } from '../../components/tooltip/index';
+import { UTooltip } from '../components/tooltip/UTooltip';
 
 export declare const UTooltip: React.ForwardRefExoticComponent<
-  Partial<Tooltip> & React.HTMLAttributes<Tooltip>
+  Partial<UTooltip> & React.HTMLAttributes<UTooltip>
 >;
 
 export type UTooltipProps = React.ComponentProps<typeof UTooltip>;

package/dist/{integrations/react → react-components}/UTooltip.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { Tooltip } from '../../components/tooltip/index';
+import { UTooltip } from '../components/tooltip/UTooltip';
 
 export const UTooltip = createComponent({
   react: React,
   tagName: 'u-tooltip',
-  elementClass: Tooltip,
+  elementClass: UTooltip,
   events: {}
 });

package/dist/{integrations/react → react-components}/UTree.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { Tree } from '../../components/tree/index';
+import { UTree } from '../components/tree/UTree';
 
 export declare const UTree: React.ForwardRefExoticComponent<
-  Partial<Tree> & React.HTMLAttributes<Tree>
+  Partial<UTree> & React.HTMLAttributes<UTree>
 >;
 
 export type UTreeProps = React.ComponentProps<typeof UTree>;

package/dist/{integrations/react → react-components}/UTree.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { Tree } from '../../components/tree/index';
+import { UTree } from '../components/tree/UTree';
 
 export const UTree = createComponent({
   react: React,
   tagName: 'u-tree',
-  elementClass: Tree,
+  elementClass: UTree,
   events: {}
 });

package/dist/{integrations/react → react-components}/UTreeItem.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { TreeItem } from '../../components/tree-item/index';
+import { UTreeItem } from '../components/tree-item/UTreeItem';
 
 export declare const UTreeItem: React.ForwardRefExoticComponent<
-  Partial<TreeItem> & React.HTMLAttributes<TreeItem>
+  Partial<UTreeItem> & React.HTMLAttributes<UTreeItem>
 >;
 
 export type UTreeItemProps = React.ComponentProps<typeof UTreeItem>;

package/dist/{integrations/react → react-components}/UTreeItem.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { TreeItem } from '../../components/tree-item/index';
+import { UTreeItem } from '../components/tree-item/UTreeItem';
 
 export const UTreeItem = createComponent({
   react: React,
   tagName: 'u-tree-item',
-  elementClass: TreeItem,
+  elementClass: UTreeItem,
   events: {}
 });

package/dist/{integrations/react → react-components}/index.d.ts

@@ -7,11 +7,9 @@
 
 export { UAlert, UAlertProps } from './UAlert';
 export { UButton, UButtonProps } from './UButton';
-export { UContextMenu, UContextMenuProps } from './UContextMenu';
-export { UCopyButton, UCopyButtonProps } from './UCopyButton';
 export { UDialog, UDialogProps } from './UDialog';
 export { UDivider, UDividerProps } from './UDivider';
-export { UDropdownMenu, UDropdownMenuProps } from './UDropdownMenu';
+export { UDrawer, UDrawerProps } from './UDrawer';
 export { UForm, UFormProps } from './UForm';
 export { UIcon, UIconProps } from './UIcon';
 export { UIconButton, UIconButtonProps } from './UIconButton';
@@ -20,6 +18,7 @@ export { UMenu, UMenuProps } from './UMenu';
 export { UMenuItem, UMenuItemProps } from './UMenuItem';
 export { UProgressBar, UProgressBarProps } from './UProgressBar';
 export { UProgressRing, UProgressRingProps } from './UProgressRing';
+export { USkeleton, USkeletonProps } from './USkeleton';
 export { USpinner, USpinnerProps } from './USpinner';
 export { USplitPanel, USplitPanelProps } from './USplitPanel';
 export { UTooltip, UTooltipProps } from './UTooltip';

package/dist/{integrations/react → react-components}/index.js

@@ -1,10 +1,8 @@
 export { UAlert } from './UAlert.js';
 export { UButton } from './UButton.js';
-export { UContextMenu } from './UContextMenu.js';
-export { UCopyButton } from './UCopyButton.js';
 export { UDialog } from './UDialog.js';
 export { UDivider } from './UDivider.js';
-export { UDropdownMenu } from './UDropdownMenu.js';
+export { UDrawer } from './UDrawer.js';
 export { UForm } from './UForm.js';
 export { UIcon } from './UIcon.js';
 export { UIconButton } from './UIconButton.js';
@@ -13,6 +11,7 @@ export { UMenu } from './UMenu.js';
 export { UMenuItem } from './UMenuItem.js';
 export { UProgressBar } from './UProgressBar.js';
 export { UProgressRing } from './UProgressRing.js';
+export { USkeleton } from './USkeleton.js';
 export { USpinner } from './USpinner.js';
 export { USplitPanel } from './USplitPanel.js';
 export { UTooltip } from './UTooltip.js';

package/dist/utilities/icons.js

@@ -107,8 +107,5 @@ const icons = IconRegistry.instance;
 function getDefaultBaseUrl() {
   return defaultIconBaseUrl;
 }
-function setDefaultBaseUrl(url) {
-  defaultIconBaseUrl = url;
-}
 
-export { getDefaultBaseUrl, icons, setDefaultBaseUrl };
+export { getDefaultBaseUrl, icons };

package/dist/utilities/notifier.d.ts

@@ -1,4 +1,4 @@
-import { AlertType } from '../components/alert/Alert.js';
+import { AlertType } from '../components/alert/UAlert.component.js';
 export type ScreenPosition = "top-left" | "top-center" | "top-right" | "middle-left" | "middle-center" | "middle-right" | "bottom-left" | "bottom-center" | "bottom-right";
 /** 토스트 알림 옵션 */
 export interface ToastOptions {

package/dist/utilities/notifier.js

@@ -1,6 +1,6 @@
-import { Alert } from '../components/alert/Alert.js';
+import { UAlert } from '../components/alert/UAlert.component.js';
 
-Alert.define("u-alert");
+UAlert.define("u-alert");
 class Notifier {
   constructor() {
     this.containers = /* @__PURE__ */ new Map();
@@ -16,7 +16,7 @@ class Notifier {
    * 토스트 알림을 생성합니다.
    */
   async toast(options) {
-    const el = new Alert();
+    const el = new UAlert();
     el.type = options.type;
     el.heading = options.heading;
     el.content = options.content;

package/package.json

@@ -1,59 +1,60 @@
-{
-  "name": "@iyulab/components",
-  "description": "web-components library based on lit-element made by iyulab",
-  "version": "0.1.7",
-  "keywords": [
-    "iyulab",
-    "components",
-    "web-components",
-    "lit-element"
-  ],
-  "license": "MIT",
-  "author": "iyulab",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/iyulab/node-components.git"
-  },
-  "files": [
-    "dist",
-    "LICENSE",
-    "README.md",
-    "CHANGELOG.md",
-    "package.json"
-  ],
-  "type": "module",
-  "types": "./dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
-    },
-    "./dist/*": {
-      "types": "./dist/*.d.ts",
-      "import": "./dist/*"
-    }
-  },
-  "scripts": {
-    "start": "vite --force",
-    "build": "eslint && vite build"
-  },
-  "dependencies": {
-    "@floating-ui/dom": "^1.7.4",
-    "lit": "^3.3.1",
-    "react": "^19.2.3",
-    "reflect-metadata": "^0.2.2"
-  },
-  "devDependencies": {
-    "@lit/react": "^1.0.8",
-    "@eslint/js": "^9.39.1",
-    "@types/node": "^25.0.1",
-    "eslint": "^9.39.1",
-    "eslint-plugin-lit": "^2.1.1",
-    "globals": "^16.5.0",
-    "typescript": "^5.9.3",
-    "typescript-eslint": "^8.49.0",
-    "vite": "^7.2.7",
-    "vite-plugin-dts": "^4.5.4",
-    "vite-plugin-static-copy": "^3.1.4"
-  }
-}
+{
+  "name": "@iyulab/components",
+  "description": "web-components library based on lit-element made by iyulab",
+  "version": "0.1.9",
+  "keywords": [
+    "iyulab",
+    "components",
+    "web-components",
+    "lit",
+    "lit-element"
+  ],
+  "license": "MIT",
+  "author": "iyulab",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/iyulab/node-components.git"
+  },
+  "files": [
+    "dist",
+    "LICENSE",
+    "README.md",
+    "CHANGELOG.md",
+    "package.json"
+  ],
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./dist/*": {
+      "types": "./dist/*.d.ts",
+      "import": "./dist/*"
+    }
+  },
+  "scripts": {
+    "start": "vite --force",
+    "build": "eslint && vite build"
+  },
+  "dependencies": {
+    "@floating-ui/dom": "^1.7.4",
+    "lit": "^3.3.1",
+    "react": "^19.2.3",
+    "reflect-metadata": "^0.2.2"
+  },
+  "devDependencies": {
+    "@lit/react": "^1.0.8",
+    "@eslint/js": "^9.39.2",
+    "@types/node": "^25.0.3",
+    "eslint": "^9.39.2",
+    "eslint-plugin-lit": "^2.1.1",
+    "globals": "^16.5.0",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.50.0",
+    "vite": "^7.3.0",
+    "vite-plugin-dts": "^4.5.4",
+    "vite-plugin-static-copy": "^3.1.4"
+  }
+}

package/dist/components/alert/index.d.ts

@@ -1,7 +0,0 @@
-import { Alert } from './Alert.js';
-declare global {
-    interface HTMLElementTagNameMap {
-        'u-alert': Alert;
-    }
-}
-export { Alert };

package/dist/components/alert/index.js

@@ -1,5 +0,0 @@
-import { Alert } from './Alert.js';
-
-Alert.define("u-alert");
-
-export { Alert };

package/dist/components/button/index.d.ts

@@ -1,7 +0,0 @@
-import { Button } from './Button.js';
-declare global {
-    interface HTMLElementTagNameMap {
-        "u-button": Button;
-    }
-}
-export { Button };

package/dist/components/button/index.js

@@ -1,5 +0,0 @@
-import { Button } from './Button.js';
-
-Button.define("u-button");
-
-export { Button };

package/dist/components/context-menu/ContextMenu.d.ts

@@ -1,29 +0,0 @@
-import { PropertyValues } from 'lit';
-import { BaseElement } from '../BaseElement.js';
-import { FloatingElement } from '../FloatingElement.js';
-export declare class ContextMenu extends FloatingElement {
-    static styles: import('lit').CSSResultGroup[];
-    static dependencies: Record<string, typeof BaseElement>;
-    preventNative: boolean;
-    closeOnSelect: boolean;
-    closeOnCheck: boolean;
-    private get menu();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    protected updated(changed: PropertyValues): void;
-    render(): import('lit-html').TemplateResult<1>;
-    /** 컨텍스트 메뉴는 Virtual anchor를 쓰므로 autoUpdate는 꺼버림 */
-    protected autoPosition(_enable: boolean): void;
-    private attachAnchor;
-    private detachAnchor;
-    private onContextMenu;
-    hide: () => Promise<void>;
-    private onDocPointerDown;
-    private onWindowBlur;
-    private onWindowScrollOrResize;
-    private attachDismiss;
-    private detachDismiss;
-    private onSelect;
-    private onCheck;
-    private onRequestClose;
-}

package/dist/components/context-menu/ContextMenu.js

@@ -1,148 +0,0 @@
-import { html } from 'lit';
-import { property } from 'lit/decorators.js';
-import { FloatingElement } from '../FloatingElement.js';
-import { Menu } from '../menu/Menu.js';
-import { MenuItem } from '../menu-item/MenuItem.js';
-import { styles } from './ContextMenu.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 ContextMenu extends FloatingElement {
-  constructor() {
-    super(...arguments);
-    this.preventNative = true;
-    this.closeOnSelect = true;
-    this.closeOnCheck = false;
-    this.onContextMenu = async (e) => {
-      if (this.preventNative) e.preventDefault();
-      this.menu && (this.menu.open = true);
-      const virtual = {
-        getBoundingClientRect: () => ({
-          x: e.clientX,
-          y: e.clientY,
-          top: e.clientY,
-          left: e.clientX,
-          right: e.clientX,
-          bottom: e.clientY,
-          width: 0,
-          height: 0,
-          toJSON() {
-            return {};
-          }
-        })
-      };
-      await super.show(virtual);
-      await this.menu?.focusFirstItem?.();
-    };
-    this.hide = async () => {
-      await super.hide();
-      this.menu && (this.menu.open = false);
-      this.querySelectorAll("u-menu-item").forEach((i) => i.closeSubmenu?.());
-    };
-    this.onDocPointerDown = (e) => {
-      if (!this.visible) return;
-      const path = e.composedPath();
-      if (path.includes(this)) return;
-      this.hide();
-    };
-    this.onWindowBlur = () => {
-      if (this.visible) this.hide();
-    };
-    this.onWindowScrollOrResize = () => {
-      if (this.visible) this.hide();
-    };
-    this.onSelect = async () => {
-      if (this.closeOnSelect) await this.hide();
-    };
-    this.onCheck = async () => {
-      if (this.closeOnCheck) await this.hide();
-    };
-    this.onRequestClose = async () => {
-      await this.hide();
-    };
-  }
-  static {
-    this.styles = [super.styles, styles];
-  }
-  static {
-    this.dependencies = {
-      "u-menu": Menu,
-      "u-menu-item": MenuItem
-    };
-  }
-  get menu() {
-    return this.querySelector("u-menu");
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.strategy = "fixed";
-    this.placement ||= "bottom-start";
-    this.distance ||= 4;
-    this.addEventListener("u-select", this.onSelect);
-    this.addEventListener("u-check", this.onCheck);
-    this.addEventListener("u-request-close", this.onRequestClose);
-  }
-  disconnectedCallback() {
-    this.detachAnchor(this.anchor);
-    this.detachDismiss();
-    this.removeEventListener("u-select", this.onSelect);
-    this.removeEventListener("u-check", this.onCheck);
-    this.removeEventListener("u-request-close", this.onRequestClose);
-    super.disconnectedCallback();
-  }
-  updated(changed) {
-    super.updated(changed);
-    if (changed.has("anchor")) {
-      this.detachAnchor(changed.get("anchor"));
-      this.attachAnchor(this.anchor);
-    }
-    if (changed.has("visible")) {
-      if (this.visible) this.attachDismiss();
-      else this.detachDismiss();
-    }
-  }
-  render() {
-    return html`<slot></slot>`;
-  }
-  /** 컨텍스트 메뉴는 Virtual anchor를 쓰므로 autoUpdate는 꺼버림 */
-  autoPosition(_enable) {
-  }
-  attachAnchor(target) {
-    if (!target) return;
-    target.addEventListener("contextmenu", this.onContextMenu);
-  }
-  detachAnchor(target) {
-    if (!target) return;
-    target.removeEventListener("contextmenu", this.onContextMenu);
-  }
-  attachDismiss() {
-    document.addEventListener("pointerdown", this.onDocPointerDown, true);
-    window.addEventListener("blur", this.onWindowBlur);
-    window.addEventListener("scroll", this.onWindowScrollOrResize, true);
-    window.addEventListener("resize", this.onWindowScrollOrResize);
-  }
-  detachDismiss() {
-    document.removeEventListener("pointerdown", this.onDocPointerDown, true);
-    window.removeEventListener("blur", this.onWindowBlur);
-    window.removeEventListener("scroll", this.onWindowScrollOrResize, true);
-    window.removeEventListener("resize", this.onWindowScrollOrResize);
-  }
-}
-__decorateClass([
-  property({ type: Boolean })
-], ContextMenu.prototype, "preventNative");
-__decorateClass([
-  property({ type: Boolean })
-], ContextMenu.prototype, "closeOnSelect");
-__decorateClass([
-  property({ type: Boolean })
-], ContextMenu.prototype, "closeOnCheck");
-
-export { ContextMenu };

package/dist/components/context-menu/ContextMenu.styles.js

@@ -1,15 +0,0 @@
-import { css } from 'lit';
-
-const styles = css`
-  :host {
-    opacity: 0;
-    transform: scale(0.98);
-    transition: opacity 0.12s ease, transform 0.12s ease;
-  }
-  :host([visible]) {
-    opacity: 1;
-    transform: scale(1);
-  }
-`;
-
-export { styles };

package/dist/components/context-menu/index.d.ts

@@ -1,7 +0,0 @@
-import { ContextMenu } from './ContextMenu.js';
-declare global {
-    interface HTMLElementTagNameMap {
-        "u-context-menu": ContextMenu;
-    }
-}
-export { ContextMenu };

package/dist/components/context-menu/index.js

@@ -1,5 +0,0 @@
-import { ContextMenu } from './ContextMenu.js';
-
-ContextMenu.define("u-context-menu");
-
-export { ContextMenu };

package/dist/components/copy-button/CopyButton.d.ts

@@ -1,19 +0,0 @@
-import { BaseElement } from '../BaseElement.js';
-/**
- * 복사 버튼 컴포넌트입니다.
- */
-export declare class CopyButton extends BaseElement {
-    static styles: import('lit').CSSResultGroup[];
-    static dependencies: Record<string, typeof BaseElement>;
-    /** 버튼의 복사 상태를 설정합니다. 복사가 완료되면 true로 변경됩니다. */
-    copied: boolean;
-    /** 버튼의 테두리 유무를 설정합니다. 기본값은 false입니다. */
-    borderless: boolean;
-    /** 버튼이 비활성화 상태인지 여부를 설정합니다. 비활성화된 버튼은 클릭할 수 없습니다. */
-    disabled: boolean;
-    /** 복사할 텍스트를 설정합니다. */
-    value: string;
-    render(): import('lit-html').TemplateResult<1>;
-    /** 복사 버튼 클릭 핸들러 */
-    private handleButtonClick;
-}