@iyulab/components 0.2.3 → 0.4.0
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/CHANGELOG.md +33 -0
- package/dist/assets/icons/arrow-down-up.svg.js +3 -0
- package/dist/assets/icons/code-slash.svg.js +3 -0
- package/dist/assets/icons/download.svg.js +3 -0
- package/dist/assets/icons/sort-alpha-down.svg.js +3 -0
- package/dist/assets/icons/sort-alpha-up.svg.js +3 -0
- package/dist/components/UElement.d.ts +59 -0
- package/dist/components/UElement.js +96 -0
- package/dist/components/{FloatingElement.d.ts → UFloatingElement.d.ts} +4 -4
- package/dist/components/{FloatingElement.js → UFloatingElement.js} +13 -13
- package/dist/components/UJsonElement.d.ts +46 -0
- package/dist/components/UJsonElement.js +93 -0
- package/dist/components/UJsonElement.styles.js +95 -0
- package/dist/components/{ModalElement.d.ts → UModalElement.d.ts} +4 -4
- package/dist/components/{ModalElement.js → UModalElement.js} +8 -8
- package/dist/components/UModalElement.styles.d.ts +1 -0
- package/dist/components/alert/UAlert.component.d.ts +3 -3
- package/dist/components/alert/UAlert.component.js +2 -2
- package/dist/components/button/UButton.component.d.ts +3 -3
- package/dist/components/button/UButton.component.js +2 -2
- package/dist/components/card/UCard.component.d.ts +21 -0
- package/dist/components/card/UCard.component.js +66 -0
- package/dist/components/card/UCard.d.ts +7 -0
- package/dist/components/card/UCard.js +5 -0
- package/dist/components/card/UCard.styles.d.ts +1 -0
- package/dist/components/card/UCard.styles.js +76 -0
- package/dist/components/carousel/UCarousel.component.d.ts +78 -0
- package/dist/components/carousel/UCarousel.component.js +264 -0
- package/dist/components/carousel/UCarousel.d.ts +7 -0
- package/dist/components/carousel/UCarousel.js +5 -0
- package/dist/components/carousel/UCarousel.styles.d.ts +1 -0
- package/dist/components/carousel/UCarousel.styles.js +112 -0
- package/dist/components/dialog/UDialog.component.d.ts +4 -4
- package/dist/components/dialog/UDialog.component.js +2 -2
- package/dist/components/divider/UDivider.component.d.ts +3 -3
- package/dist/components/divider/UDivider.component.js +2 -2
- package/dist/components/drawer/UDrawer.component.d.ts +4 -4
- package/dist/components/drawer/UDrawer.component.js +2 -2
- package/dist/components/form/UForm.component.d.ts +3 -3
- package/dist/components/form/UForm.component.js +2 -2
- package/dist/components/icon/UIcon.component.d.ts +3 -3
- package/dist/components/icon/UIcon.component.js +2 -2
- package/dist/components/input/UInput.component.d.ts +3 -3
- package/dist/components/input/UInput.component.js +2 -2
- package/dist/components/menu/UMenu.component.d.ts +4 -4
- package/dist/components/menu/UMenu.component.js +2 -2
- package/dist/components/menu-item/UMenuItem.component.d.ts +3 -3
- package/dist/components/menu-item/UMenuItem.component.js +2 -2
- package/dist/components/progress-bar/UProgressBar.component.d.ts +3 -3
- package/dist/components/progress-bar/UProgressBar.component.js +2 -2
- package/dist/components/progress-ring/UProgressRing.component.d.ts +3 -3
- package/dist/components/progress-ring/UProgressRing.component.js +2 -2
- package/dist/components/skeleton/USkeleton.component.d.ts +3 -3
- package/dist/components/skeleton/USkeleton.component.js +2 -2
- package/dist/components/spinner/USpinner.component.d.ts +3 -3
- package/dist/components/spinner/USpinner.component.js +2 -2
- package/dist/components/split-panel/USplitPanel.component.d.ts +3 -3
- package/dist/components/split-panel/USplitPanel.component.js +2 -2
- package/dist/components/tag/UTag.component.d.ts +3 -3
- package/dist/components/tag/UTag.component.js +2 -2
- package/dist/components/tooltip/UTooltip.component.d.ts +4 -4
- package/dist/components/tooltip/UTooltip.component.js +2 -2
- package/dist/components/tree/UTree.component.d.ts +3 -3
- package/dist/components/tree/UTree.component.js +2 -2
- package/dist/components/tree-item/UTreeItem.component.d.ts +3 -3
- package/dist/components/tree-item/UTreeItem.component.js +2 -2
- package/dist/index.d.ts +8 -0
- package/dist/index.js +10 -0
- package/dist/react-components/UCard.d.ts +8 -0
- package/dist/react-components/UCard.js +10 -0
- package/dist/react-components/UCarousel.d.ts +8 -0
- package/dist/react-components/UCarousel.js +10 -0
- package/dist/react-components/index.d.ts +2 -0
- package/dist/react-components/index.js +2 -0
- package/dist/utilities/IconRegistry.js +16 -1
- package/dist/utilities/elements.d.ts +23 -0
- package/dist/utilities/elements.js +23 -1
- package/dist/utilities/sanitizers.d.ts +35 -0
- package/dist/utilities/sanitizers.js +43 -0
- package/package.json +21 -11
- package/dist/components/BaseElement.d.ts +0 -33
- package/dist/components/BaseElement.js +0 -59
- /package/dist/components/{BaseElement.styles.d.ts → UElement.styles.d.ts} +0 -0
- /package/dist/components/{BaseElement.styles.js → UElement.styles.js} +0 -0
- /package/dist/components/{FloatingElement.styles.d.ts → UFloatingElement.styles.d.ts} +0 -0
- /package/dist/components/{FloatingElement.styles.js → UFloatingElement.styles.js} +0 -0
- /package/dist/components/{ModalElement.styles.d.ts → UJsonElement.styles.d.ts} +0 -0
- /package/dist/components/{ModalElement.styles.js → UModalElement.styles.js} +0 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UModalElement } from '../UModalElement.js';
|
|
4
4
|
import { UIcon } from '../icon/UIcon.component.js';
|
|
5
5
|
import { UButton } from '../button/UButton.component.js';
|
|
6
6
|
import { styles } from './UDialog.styles.js';
|
|
@@ -14,7 +14,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
14
14
|
if (result) __defProp(target, key, result);
|
|
15
15
|
return result;
|
|
16
16
|
};
|
|
17
|
-
class UDialog extends
|
|
17
|
+
class UDialog extends UModalElement {
|
|
18
18
|
constructor() {
|
|
19
19
|
super(...arguments);
|
|
20
20
|
this.headless = false;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { UElement } from '../UElement.js';
|
|
2
2
|
/**
|
|
3
3
|
* Divider 컴포넌트는 엘리먼트 사이에 구분선을 제공합니다.
|
|
4
4
|
*/
|
|
5
|
-
export declare class UDivider extends
|
|
5
|
+
export declare class UDivider extends UElement {
|
|
6
6
|
static styles: import('lit').CSSResultGroup[];
|
|
7
|
-
static dependencies: Record<string, typeof
|
|
7
|
+
static dependencies: Record<string, typeof UElement>;
|
|
8
8
|
/** 수직 방향 여부를 설정합니다. (기본값: 수평) */
|
|
9
9
|
vertical: boolean;
|
|
10
10
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { property } from 'lit/decorators.js';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
import { styles } from './UDivider.styles.js';
|
|
4
4
|
|
|
5
5
|
var __defProp = Object.defineProperty;
|
|
@@ -11,7 +11,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
11
11
|
if (result) __defProp(target, key, result);
|
|
12
12
|
return result;
|
|
13
13
|
};
|
|
14
|
-
class UDivider extends
|
|
14
|
+
class UDivider extends UElement {
|
|
15
15
|
constructor() {
|
|
16
16
|
super(...arguments);
|
|
17
17
|
this.vertical = false;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { UElement } from '../UElement.js';
|
|
2
|
+
import { UModalElement } from '../UModalElement.js';
|
|
3
3
|
export type DrawerPlacement = 'left' | 'right' | 'top' | 'bottom';
|
|
4
4
|
/**
|
|
5
5
|
* Drawer 컴포넌트는 화면 가장자리에서 슬라이드하여 나타나는 패널을 제공합니다.
|
|
6
6
|
* 네비게이션, 설정 패널, 상세 정보 표시 등에 사용됩니다.
|
|
7
7
|
*/
|
|
8
|
-
export declare class UDrawer extends
|
|
8
|
+
export declare class UDrawer extends UModalElement {
|
|
9
9
|
static styles: import('lit').CSSResultGroup[];
|
|
10
|
-
static dependencies: Record<string, typeof
|
|
10
|
+
static dependencies: Record<string, typeof UElement>;
|
|
11
11
|
/** 드로어가 나타나는 위치 */
|
|
12
12
|
placement: DrawerPlacement;
|
|
13
13
|
/** 헤드리스 모드 여부 */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UModalElement } from '../UModalElement.js';
|
|
4
4
|
import { UIcon } from '../icon/UIcon.component.js';
|
|
5
5
|
import { UButton } from '../button/UButton.component.js';
|
|
6
6
|
import { styles } from './UDrawer.styles.js';
|
|
@@ -14,7 +14,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
14
14
|
if (result) __defProp(target, key, result);
|
|
15
15
|
return result;
|
|
16
16
|
};
|
|
17
|
-
class UDrawer extends
|
|
17
|
+
class UDrawer extends UModalElement {
|
|
18
18
|
constructor() {
|
|
19
19
|
super(...arguments);
|
|
20
20
|
this.placement = "left";
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { UElement } from '../UElement.js';
|
|
2
2
|
/**
|
|
3
3
|
* Form 컴포넌트는 여러 입력 요소를 그룹화하고 관리하는 폼 컨테이너입니다.
|
|
4
4
|
* 폼 내의 입력 요소들의 값 변경을 감지하고, 포함 및 제외 규칙에 따라 폼 컨텍스트에 데이터를 자동으로 업데이트합니다.
|
|
5
5
|
*/
|
|
6
|
-
export declare class UForm extends
|
|
6
|
+
export declare class UForm extends UElement {
|
|
7
7
|
static styles: import('lit').CSSResultGroup[];
|
|
8
|
-
static dependencies: Record<string, typeof
|
|
8
|
+
static dependencies: Record<string, typeof UElement>;
|
|
9
9
|
/** 포함할 입력 요소의 name 속성 목록입니다. */
|
|
10
10
|
includes: string[];
|
|
11
11
|
/** 제외할 입력 요소의 name 속성 목록입니다. */
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { property } from 'lit/decorators.js';
|
|
3
3
|
import { arrayAttrConverter } from '../../utilities/converters.js';
|
|
4
|
-
import {
|
|
4
|
+
import { UElement } from '../UElement.js';
|
|
5
5
|
import { UInput } from '../input/UInput.component.js';
|
|
6
6
|
import { styles } from './UForm.styles.js';
|
|
7
7
|
|
|
@@ -14,7 +14,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
14
14
|
if (result) __defProp(target, key, result);
|
|
15
15
|
return result;
|
|
16
16
|
};
|
|
17
|
-
class UForm extends
|
|
17
|
+
class UForm extends UElement {
|
|
18
18
|
constructor() {
|
|
19
19
|
super(...arguments);
|
|
20
20
|
this.includes = [];
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { nothing } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
export type IconLibrary = "internal" | "default" | (string & {});
|
|
4
4
|
/**
|
|
5
5
|
* 아이콘 컴포넌트입니다. SVG 아이콘을 이름으로 불러와서 렌더링합니다.
|
|
6
6
|
*/
|
|
7
|
-
export declare class UIcon extends
|
|
7
|
+
export declare class UIcon extends UElement {
|
|
8
8
|
static styles: import('lit').CSSResultGroup[];
|
|
9
|
-
static dependencies: Record<string, typeof
|
|
9
|
+
static dependencies: Record<string, typeof UElement>;
|
|
10
10
|
/**
|
|
11
11
|
* 사용할 아이콘 라이브러리를 지정합니다.
|
|
12
12
|
* - 기본 내장 라이브러리: `internal`, `default`
|
|
@@ -2,7 +2,7 @@ import { nothing } from 'lit';
|
|
|
2
2
|
import { property } from 'lit/decorators.js';
|
|
3
3
|
import { unsafeHTML } from 'lit/directives/unsafe-html.js';
|
|
4
4
|
import { until } from 'lit/directives/until.js';
|
|
5
|
-
import {
|
|
5
|
+
import { UElement } from '../UElement.js';
|
|
6
6
|
import { IconRegistry } from '../../utilities/IconRegistry.js';
|
|
7
7
|
import { styles } from './UIcon.styles.js';
|
|
8
8
|
|
|
@@ -15,7 +15,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
15
15
|
if (result) __defProp(target, key, result);
|
|
16
16
|
return result;
|
|
17
17
|
};
|
|
18
|
-
class UIcon extends
|
|
18
|
+
class UIcon extends UElement {
|
|
19
19
|
constructor() {
|
|
20
20
|
super(...arguments);
|
|
21
21
|
this.lib = "default";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
/**
|
|
4
4
|
* Supported input types for Input component
|
|
5
5
|
*
|
|
@@ -10,9 +10,9 @@ type InputType = ('text' | 'password' | 'email' | 'tel' | 'url' | 'search' | 'nu
|
|
|
10
10
|
* Input 컴포넌트는 사용자 입력을 받는 텍스트 입력 필드입니다.
|
|
11
11
|
* prefix, suffix 슬롯과 라벨, 도움말, 유효성 검사 등의 기능을 제공합니다.
|
|
12
12
|
*/
|
|
13
|
-
export declare class UInput extends
|
|
13
|
+
export declare class UInput extends UElement {
|
|
14
14
|
static styles: import('lit').CSSResultGroup[];
|
|
15
|
-
static dependencies: Record<string, typeof
|
|
15
|
+
static dependencies: Record<string, typeof UElement>;
|
|
16
16
|
inputEl: HTMLInputElement;
|
|
17
17
|
/** 유효성 여부 */
|
|
18
18
|
isValid: boolean;
|
|
@@ -2,7 +2,7 @@ import { html } from 'lit';
|
|
|
2
2
|
import { query, state, property } from 'lit/decorators.js';
|
|
3
3
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
4
4
|
import { live } from 'lit/directives/live.js';
|
|
5
|
-
import {
|
|
5
|
+
import { UElement } from '../UElement.js';
|
|
6
6
|
import { UIcon } from '../icon/UIcon.component.js';
|
|
7
7
|
import { UTooltip } from '../tooltip/UTooltip.component.js';
|
|
8
8
|
import { styles } from './UInput.styles.js';
|
|
@@ -16,7 +16,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
16
16
|
if (result) __defProp(target, key, result);
|
|
17
17
|
return result;
|
|
18
18
|
};
|
|
19
|
-
class UInput extends
|
|
19
|
+
class UInput extends UElement {
|
|
20
20
|
constructor() {
|
|
21
21
|
super(...arguments);
|
|
22
22
|
this.isValid = true;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
|
+
import { UFloatingElement } from '../UFloatingElement.js';
|
|
4
4
|
import { UMenuItem } from '../menu-item/UMenuItem.component.js';
|
|
5
5
|
export type MenuType = 'default' | 'dropdown' | 'contextmenu' | 'submenu';
|
|
6
6
|
export type MenuMode = 'none' | 'single' | 'multiple';
|
|
@@ -8,9 +8,9 @@ type MenuItemFilter = 'all' | 'enabled' | 'disabled' | 'selected' | 'unselected'
|
|
|
8
8
|
/**
|
|
9
9
|
* Menu 컴포넌트는 드롭다운 메뉴, 컨텍스트 메뉴, 서브메뉴 등을 구현하기 위한 컴포넌트입니다.
|
|
10
10
|
*/
|
|
11
|
-
export declare class UMenu extends
|
|
11
|
+
export declare class UMenu extends UFloatingElement {
|
|
12
12
|
static styles: import('lit').CSSResultGroup[];
|
|
13
|
-
static dependencies: Record<string, typeof
|
|
13
|
+
static dependencies: Record<string, typeof UElement>;
|
|
14
14
|
items?: UMenuItem[];
|
|
15
15
|
/**
|
|
16
16
|
* 메뉴 타입
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { queryAssignedElements, property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UFloatingElement } from '../UFloatingElement.js';
|
|
4
4
|
import { UMenuItem } from '../menu-item/UMenuItem.component.js';
|
|
5
5
|
import { styles } from './UMenu.styles.js';
|
|
6
6
|
|
|
@@ -13,7 +13,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
13
13
|
if (result) __defProp(target, key, result);
|
|
14
14
|
return result;
|
|
15
15
|
};
|
|
16
|
-
class UMenu extends
|
|
16
|
+
class UMenu extends UFloatingElement {
|
|
17
17
|
constructor() {
|
|
18
18
|
super(...arguments);
|
|
19
19
|
this.type = "default";
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
import { UMenu } from '../menu/UMenu.component.js';
|
|
4
|
-
export declare class UMenuItem extends
|
|
4
|
+
export declare class UMenuItem extends UElement {
|
|
5
5
|
static styles: import('lit').CSSResultGroup[];
|
|
6
|
-
static dependencies: Record<string, typeof
|
|
6
|
+
static dependencies: Record<string, typeof UElement>;
|
|
7
7
|
/** 서브메뉴 요소 */
|
|
8
8
|
submenu: UMenu | null;
|
|
9
9
|
/** 비활성화 여부 @default false */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { state, property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UElement } from '../UElement.js';
|
|
4
4
|
import { UIcon } from '../icon/UIcon.component.js';
|
|
5
5
|
import { UMenu } from '../menu/UMenu.component.js';
|
|
6
6
|
import { USpinner } from '../spinner/USpinner.component.js';
|
|
@@ -15,7 +15,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
15
15
|
if (result) __defProp(target, key, result);
|
|
16
16
|
return result;
|
|
17
17
|
};
|
|
18
|
-
class UMenuItem extends
|
|
18
|
+
class UMenuItem extends UElement {
|
|
19
19
|
constructor() {
|
|
20
20
|
super(...arguments);
|
|
21
21
|
this.submenu = null;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
/**
|
|
4
4
|
* ProgressBar 컴포넌트는 진행 상태를 시각적으로 표시합니다.
|
|
5
5
|
* 로딩 상태나 작업 진행률을 표시하는데 사용됩니다.
|
|
6
6
|
*/
|
|
7
|
-
export declare class UProgressBar extends
|
|
7
|
+
export declare class UProgressBar extends UElement {
|
|
8
8
|
static styles: import('lit').CSSResultGroup[];
|
|
9
|
-
static dependencies: Record<string, typeof
|
|
9
|
+
static dependencies: Record<string, typeof UElement>;
|
|
10
10
|
indicatorEl: HTMLElement;
|
|
11
11
|
/** 내부 진행 상태 */
|
|
12
12
|
progressState: 'turned-on' | 'turned-off' | 'determinate' | 'indeterminate';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { query, state, property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UElement } from '../UElement.js';
|
|
4
4
|
import { styles } from './UProgressBar.styles.js';
|
|
5
5
|
|
|
6
6
|
var __defProp = Object.defineProperty;
|
|
@@ -12,7 +12,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
12
12
|
if (result) __defProp(target, key, result);
|
|
13
13
|
return result;
|
|
14
14
|
};
|
|
15
|
-
class UProgressBar extends
|
|
15
|
+
class UProgressBar extends UElement {
|
|
16
16
|
constructor() {
|
|
17
17
|
super(...arguments);
|
|
18
18
|
this.progressState = "turned-on";
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
/** 원형 진행 표시기의 변형 타입 */
|
|
4
4
|
export type ProgressRingVariant = 'smooth' | 'blocks' | 'ticks';
|
|
5
5
|
/**
|
|
6
6
|
* ProgressRing 컴포넌트는 원형 진행 표시기를 제공합니다.
|
|
7
7
|
* 진행 상태를 시각적으로 나타내며, 크기와 두께를 스타일 속성으로 조절할 수 있습니다.
|
|
8
8
|
*/
|
|
9
|
-
export declare class UProgressRing extends
|
|
9
|
+
export declare class UProgressRing extends UElement {
|
|
10
10
|
static styles: import('lit').CSSResultGroup[];
|
|
11
|
-
static dependencies: Record<string, typeof
|
|
11
|
+
static dependencies: Record<string, typeof UElement>;
|
|
12
12
|
dasharray: string;
|
|
13
13
|
progress: number;
|
|
14
14
|
/** 진행 표시기의 스타일 변형을 설정합니다. */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { state, property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UElement } from '../UElement.js';
|
|
4
4
|
import { styles } from './UProgressRing.styles.js';
|
|
5
5
|
|
|
6
6
|
var __defProp = Object.defineProperty;
|
|
@@ -13,7 +13,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
13
13
|
return result;
|
|
14
14
|
};
|
|
15
15
|
const PATH_LENGTH = 100;
|
|
16
|
-
class UProgressRing extends
|
|
16
|
+
class UProgressRing extends UElement {
|
|
17
17
|
constructor() {
|
|
18
18
|
super(...arguments);
|
|
19
19
|
this.dasharray = PATH_LENGTH.toString();
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
export type SkeletonShape = 'default' | 'circle' | 'rounded';
|
|
4
4
|
export type SkeletonEffect = 'pulse' | 'shimmer' | 'none';
|
|
5
5
|
/**
|
|
6
6
|
* 콘텐츠가 로딩 중임을 나타내는 Skeleton 컴포넌트입니다.
|
|
7
7
|
* 다양한 모양과 애니메이션 효과를 지원합니다.
|
|
8
8
|
*/
|
|
9
|
-
export declare class USkeleton extends
|
|
9
|
+
export declare class USkeleton extends UElement {
|
|
10
10
|
static styles: import('lit').CSSResultGroup[];
|
|
11
|
-
static dependencies: Record<string, typeof
|
|
11
|
+
static dependencies: Record<string, typeof UElement>;
|
|
12
12
|
/** 모양 (default, circle, rounded) */
|
|
13
13
|
shape: SkeletonShape;
|
|
14
14
|
/** 애니메이션 효과 (pulse, shimmer, none) */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UElement } from '../UElement.js';
|
|
4
4
|
import { styles } from './USkeleton.styles.js';
|
|
5
5
|
|
|
6
6
|
var __defProp = Object.defineProperty;
|
|
@@ -12,7 +12,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
12
12
|
if (result) __defProp(target, key, result);
|
|
13
13
|
return result;
|
|
14
14
|
};
|
|
15
|
-
class USkeleton extends
|
|
15
|
+
class USkeleton extends UElement {
|
|
16
16
|
constructor() {
|
|
17
17
|
super(...arguments);
|
|
18
18
|
this.shape = "default";
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { UElement } from '../UElement.js';
|
|
2
2
|
/**
|
|
3
3
|
* Spinner 컴포넌트는 로딩 상태를 시각적으로 표시하는 회전하는 원형 스피너를 제공합니다.
|
|
4
4
|
*/
|
|
5
|
-
export declare class USpinner extends
|
|
5
|
+
export declare class USpinner extends UElement {
|
|
6
6
|
static styles: import('lit').CSSResultGroup[];
|
|
7
|
-
static dependencies: Record<string, typeof
|
|
7
|
+
static dependencies: Record<string, typeof UElement>;
|
|
8
8
|
render(): import('lit-html').TemplateResult<1>;
|
|
9
9
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
import { styles } from './USpinner.styles.js';
|
|
4
4
|
|
|
5
|
-
class USpinner extends
|
|
5
|
+
class USpinner extends UElement {
|
|
6
6
|
static {
|
|
7
7
|
this.styles = [super.styles, styles];
|
|
8
8
|
}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
/**
|
|
4
4
|
* SplitPanel 컴포넌트는 화면을 여러 개의 패널로 분할하여 표시합니다.
|
|
5
5
|
*/
|
|
6
|
-
export declare class USplitPanel extends
|
|
6
|
+
export declare class USplitPanel extends UElement {
|
|
7
7
|
static styles: import('lit').CSSResultGroup[];
|
|
8
|
-
static dependencies: Record<string, typeof
|
|
8
|
+
static dependencies: Record<string, typeof UElement>;
|
|
9
9
|
/** 현재 상태를 저장하는 패널 요소들 */
|
|
10
10
|
private panels;
|
|
11
11
|
private sizes;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { queryAssignedElements, state, property } from 'lit/decorators.js';
|
|
3
3
|
import { arrayAttrConverter } from '../../utilities/converters.js';
|
|
4
|
-
import {
|
|
4
|
+
import { UElement } from '../UElement.js';
|
|
5
5
|
import { styles } from './USplitPanel.styles.js';
|
|
6
6
|
|
|
7
7
|
var __defProp = Object.defineProperty;
|
|
@@ -13,7 +13,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
13
13
|
if (result) __defProp(target, key, result);
|
|
14
14
|
return result;
|
|
15
15
|
};
|
|
16
|
-
class USplitPanel extends
|
|
16
|
+
class USplitPanel extends UElement {
|
|
17
17
|
constructor() {
|
|
18
18
|
super(...arguments);
|
|
19
19
|
/** 현재 상태를 저장하는 패널 요소들 */
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { UElement } from '../UElement.js';
|
|
2
2
|
export type TagVariant = "default" | "info" | "success" | "warning" | "danger";
|
|
3
3
|
/**
|
|
4
4
|
* Tag 컴포넌트는 레이블, 카테고리, 상태 등을 표시하는데 사용됩니다.
|
|
@@ -6,9 +6,9 @@ export type TagVariant = "default" | "info" | "success" | "warning" | "danger";
|
|
|
6
6
|
* @slot prefix - 태그의 접두사로 표시할 콘텐츠를 삽입합니다.
|
|
7
7
|
* @slot suffix - 태그의 접미사로 표시할 콘텐츠를 삽입합니다.
|
|
8
8
|
*/
|
|
9
|
-
export declare class UTag extends
|
|
9
|
+
export declare class UTag extends UElement {
|
|
10
10
|
static styles: import('lit').CSSResultGroup[];
|
|
11
|
-
static dependencies: Record<string, typeof
|
|
11
|
+
static dependencies: Record<string, typeof UElement>;
|
|
12
12
|
/** 태그의 스타일 변형을 설정합니다. */
|
|
13
13
|
variant: TagVariant;
|
|
14
14
|
/** 태그를 둥글게 표시합니다. */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UElement } from '../UElement.js';
|
|
4
4
|
import { styles } from './UTag.styles.js';
|
|
5
5
|
|
|
6
6
|
var __defProp = Object.defineProperty;
|
|
@@ -12,7 +12,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
12
12
|
if (result) __defProp(target, key, result);
|
|
13
13
|
return result;
|
|
14
14
|
};
|
|
15
|
-
class UTag extends
|
|
15
|
+
class UTag extends UElement {
|
|
16
16
|
constructor() {
|
|
17
17
|
super(...arguments);
|
|
18
18
|
this.variant = "default";
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
|
+
import { UFloatingElement } from '../UFloatingElement.js';
|
|
4
4
|
/**
|
|
5
5
|
* Tooltip 컴포넌트는 대상 엘리먼트에 툴팁을 표시하는 기능을 제공합니다.
|
|
6
6
|
*/
|
|
7
|
-
export declare class UTooltip extends
|
|
7
|
+
export declare class UTooltip extends UFloatingElement {
|
|
8
8
|
static styles: import('lit').CSSResultGroup[];
|
|
9
|
-
static dependencies: Record<string, typeof
|
|
9
|
+
static dependencies: Record<string, typeof UElement>;
|
|
10
10
|
/**
|
|
11
11
|
* 툴팁 내부로 마우스를 이동해도 툴팁이 유지되는지 여부입니다.
|
|
12
12
|
* true일 경우 툴팁 위에 마우스를 올려놓을 수 있습니다.
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UFloatingElement } from '../UFloatingElement.js';
|
|
4
4
|
import { styles } from './UTooltip.styles.js';
|
|
5
5
|
|
|
6
6
|
var __defProp = Object.defineProperty;
|
|
@@ -12,7 +12,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
12
12
|
if (result) __defProp(target, key, result);
|
|
13
13
|
return result;
|
|
14
14
|
};
|
|
15
|
-
class UTooltip extends
|
|
15
|
+
class UTooltip extends UFloatingElement {
|
|
16
16
|
constructor() {
|
|
17
17
|
super(...arguments);
|
|
18
18
|
this.interactive = false;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { UElement } from '../UElement.js';
|
|
2
2
|
import { UTreeItem } from '../tree-item/UTreeItem.component.js';
|
|
3
3
|
/**
|
|
4
4
|
* Tree 컴포넌트는 계층적 데이터 구조를 표시하는 트리 뷰를 제공합니다.
|
|
5
5
|
* u-tree-item 컴포넌트를 자식으로 사용하여 중첩된 구조를 구성할 수 있습니다.
|
|
6
6
|
*/
|
|
7
|
-
export declare class UTree extends
|
|
7
|
+
export declare class UTree extends UElement {
|
|
8
8
|
static styles: import('lit').CSSResultGroup[];
|
|
9
|
-
static dependencies: Record<string, typeof
|
|
9
|
+
static dependencies: Record<string, typeof UElement>;
|
|
10
10
|
private selectedItems;
|
|
11
11
|
items: UTreeItem[];
|
|
12
12
|
/** 트리가 비활성화 상태인지 여부입니다. */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { queryAssignedElements, property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UElement } from '../UElement.js';
|
|
4
4
|
import { UTreeItem } from '../tree-item/UTreeItem.component.js';
|
|
5
5
|
import { styles } from './UTree.styles.js';
|
|
6
6
|
|
|
@@ -13,7 +13,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
13
13
|
if (result) __defProp(target, key, result);
|
|
14
14
|
return result;
|
|
15
15
|
};
|
|
16
|
-
class UTree extends
|
|
16
|
+
class UTree extends UElement {
|
|
17
17
|
constructor() {
|
|
18
18
|
super(...arguments);
|
|
19
19
|
this.selectedItems = /* @__PURE__ */ new Set();
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { PropertyValues } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { UElement } from '../UElement.js';
|
|
3
3
|
/**
|
|
4
4
|
* UTreeItem 컴포넌트는 트리의 개별 노드를 나타냅니다.
|
|
5
5
|
* UTree 컴포넌트와 함께 사용되며, 중첩된 구조를 지원합니다.
|
|
6
6
|
*/
|
|
7
|
-
export declare class UTreeItem extends
|
|
7
|
+
export declare class UTreeItem extends UElement {
|
|
8
8
|
static styles: import('lit').CSSResultGroup[];
|
|
9
|
-
static dependencies: Record<string, typeof
|
|
9
|
+
static dependencies: Record<string, typeof UElement>;
|
|
10
10
|
/** DOM 변경 감지를 위한 MutationObserver */
|
|
11
11
|
private mutationObserver?;
|
|
12
12
|
/** 자식 트리 아이템 배열 */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { html } from 'lit';
|
|
2
2
|
import { query, state, property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { UElement } from '../UElement.js';
|
|
4
4
|
import { UIcon } from '../icon/UIcon.component.js';
|
|
5
5
|
import { styles } from './UTreeItem.styles.js';
|
|
6
6
|
import { USpinner } from '../spinner/USpinner.component.js';
|
|
@@ -14,7 +14,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
14
14
|
if (result) __defProp(target, key, result);
|
|
15
15
|
return result;
|
|
16
16
|
};
|
|
17
|
-
class UTreeItem extends
|
|
17
|
+
class UTreeItem extends UElement {
|
|
18
18
|
constructor() {
|
|
19
19
|
super(...arguments);
|
|
20
20
|
/** 자식 트리 아이템 배열 */
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
|
+
export * from './components/UElement.js';
|
|
2
|
+
export * from './components/UFloatingElement.js';
|
|
3
|
+
export * from './components/UJsonElement.js';
|
|
4
|
+
export * from './components/UModalElement.js';
|
|
1
5
|
export * from './components/alert/UAlert.js';
|
|
2
6
|
export * from './components/button/UButton.js';
|
|
7
|
+
export * from './components/card/UCard.js';
|
|
8
|
+
export * from './components/carousel/UCarousel.js';
|
|
3
9
|
export * from './components/dialog/UDialog.js';
|
|
4
10
|
export * from './components/divider/UDivider.js';
|
|
5
11
|
export * from './components/drawer/UDrawer.js';
|
|
@@ -24,6 +30,8 @@ export * from './events/UResizeEvent';
|
|
|
24
30
|
export * from './events/USelectEvent';
|
|
25
31
|
export * from './events/UShowEvent';
|
|
26
32
|
export * from './utilities/BrowserStorage.js';
|
|
33
|
+
export * from './utilities/elements.js';
|
|
27
34
|
export * from './utilities/IconRegistry.js';
|
|
28
35
|
export * from './utilities/Notifier.js';
|
|
36
|
+
export * from './utilities/sanitizers.js';
|
|
29
37
|
export * from './utilities/Theme.js';
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
|
+
export { UElement } from './components/UElement.js';
|
|
2
|
+
export { UFloatingElement } from './components/UFloatingElement.js';
|
|
3
|
+
export { UJsonElement } from './components/UJsonElement.js';
|
|
4
|
+
export { UModalElement } from './components/UModalElement.js';
|
|
1
5
|
import './components/alert/UAlert.js';
|
|
2
6
|
import './components/button/UButton.js';
|
|
7
|
+
import './components/card/UCard.js';
|
|
8
|
+
import './components/carousel/UCarousel.js';
|
|
3
9
|
import './components/dialog/UDialog.js';
|
|
4
10
|
import './components/divider/UDivider.js';
|
|
5
11
|
import './components/drawer/UDrawer.js';
|
|
@@ -18,11 +24,15 @@ import './components/tooltip/UTooltip.js';
|
|
|
18
24
|
import './components/tree/UTree.js';
|
|
19
25
|
import './components/tree-item/UTreeItem.js';
|
|
20
26
|
export { BrowserStorage } from './utilities/BrowserStorage.js';
|
|
27
|
+
export { buildElementHTML, getParentElement, querySelectorAllWithin, querySelectorWithin } from './utilities/elements.js';
|
|
21
28
|
export { IconRegistry, getDefaultBaseUrl, setDefaultBaseUrl } from './utilities/IconRegistry.js';
|
|
22
29
|
export { Notifier } from './utilities/Notifier.js';
|
|
30
|
+
export { escapeHtmlAttr, escapeHtmlHref, escapeHtmlText, stripZeroWidth } from './utilities/sanitizers.js';
|
|
23
31
|
export { Theme } from './utilities/Theme.js';
|
|
24
32
|
export { UAlert } from './components/alert/UAlert.component.js';
|
|
25
33
|
export { UButton } from './components/button/UButton.component.js';
|
|
34
|
+
export { UCard } from './components/card/UCard.component.js';
|
|
35
|
+
export { UCarousel } from './components/carousel/UCarousel.component.js';
|
|
26
36
|
export { UDialog } from './components/dialog/UDialog.component.js';
|
|
27
37
|
export { UDivider } from './components/divider/UDivider.component.js';
|
|
28
38
|
export { UDrawer } from './components/drawer/UDrawer.component.js';
|