@operato/scene-tab 1.2.62 → 1.2.76
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 +26 -0
- package/dist/tab-container.js +6 -3
- package/dist/tab-container.js.map +1 -1
- package/dist/tab.d.ts +1 -0
- package/dist/tab.js +12 -41
- package/dist/tab.js.map +1 -1
- package/helps/scene/component/tab-container.ja.md +63 -0
- package/helps/scene/component/tab-container.ko.md +4 -1
- package/helps/scene/component/tab-container.md +31 -31
- package/helps/scene/component/tab-container.ms.md +61 -0
- package/helps/scene/component/tab-container.zh.md +33 -35
- package/helps/scene/component/tab.ja.md +31 -0
- package/helps/scene/component/tab.ko.md +25 -7
- package/helps/scene/component/tab.md +25 -7
- package/helps/scene/component/tab.ms.md +31 -0
- package/helps/scene/component/tab.zh.md +25 -7
- package/package.json +2 -2
- package/schema.graphql +3866 -0
- package/src/tab-container.ts +9 -3
- package/src/tab.ts +14 -42
- package/tsconfig.json +1 -0
- package/tsconfig.tsbuildinfo +1 -1
- package/helps/scene/images/container-04.png +0 -0
|
@@ -1,14 +1,32 @@
|
|
|
1
|
-
# tab
|
|
1
|
+
# 탭 컴포넌트 (tab)
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
탭
|
|
3
|
+
탭 컨테이너를 사용자 인터랙션으로 컨트롤하기위한 컴포넌트이다.
|
|
4
|
+
대상 탭 컨테이너의 카드들을 버튼으로 표현하며, 사용자가 클릭하는 버튼에 해당하는 카드가 탭 컨테이너 전면에 보이게 된다.
|
|
5
5
|
|
|
6
|
+
## properties
|
|
6
7
|
|
|
7
|
-
|
|
8
|
+
1. 탭 참조(reference)
|
|
8
9
|
|
|
9
|
-
|
|
10
|
+
- 이 탭 컴포넌트로 컨트롤 하고자하는 대상 탭컨테이너를 지정한다.
|
|
10
11
|
|
|
12
|
+
2. 활성탭인덱스(activeIndex) - value-property
|
|
11
13
|
|
|
12
|
-
|
|
14
|
+
- 현재 활성화된 카드의 0 기반 인덱스이다.
|
|
15
|
+
- 이 컴포넌트의 value-property로서 이 값이 변경되면 탭 컨테이너의 활성 카드가 변경된다.
|
|
16
|
+
- 이 컴포넌트의 data 값도 이 값과 동일하게 변경된다.
|
|
17
|
+
|
|
18
|
+
3. 활성탭 채우기 스타일(activeFillStyle)
|
|
19
|
+
|
|
20
|
+
- 활성화된 인덱스에 해당하는 버튼에 채워지는 색상을 지정한다.
|
|
21
|
+
|
|
22
|
+
4. 활성탭 글씨 색상(activeFontColor)
|
|
23
|
+
|
|
24
|
+
- 활성화된 인덱스에 해당하는 버튼의 글자 색상을 지정한다.
|
|
25
|
+
|
|
26
|
+
5. 활성탭 테두리 색상(activeLineColor)
|
|
27
|
+
|
|
28
|
+
- 활성화된 인덱스에 해당하는 버튼의 테두리 색상을 지정한다.
|
|
29
|
+
|
|
30
|
+
6. 활성탭 테두리 굵기(activeLineWidth)
|
|
13
31
|
|
|
14
|
-
|
|
32
|
+
- 활성화된 인덱스에 해당하는 버튼의 테두리 굵기를 지정한다.
|
|
@@ -1,13 +1,31 @@
|
|
|
1
|
-
# tab
|
|
1
|
+
# Tab Component (tab)
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
Tab
|
|
3
|
+
A component used to control a tab container through user interaction. It represents the cards of the target tab container as buttons, and when a user clicks on a button, the card corresponding to that button is displayed at the forefront of the tab container.
|
|
5
4
|
|
|
5
|
+
## Properties
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
1. Tab Reference (reference)
|
|
8
8
|
|
|
9
|
-
|
|
9
|
+
- Specifies the target tab container to be controlled by this tab component.
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
2. Active Tab Index (activeIndex)
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
- The zero-based index of the currently active card.
|
|
14
|
+
- As a value property of this component, when this value changes, the active card of the tab container changes.
|
|
15
|
+
- The data value of this component also changes to match this value.
|
|
16
|
+
|
|
17
|
+
3. Active Tab Fill Style (activeFillStyle)
|
|
18
|
+
|
|
19
|
+
- Specifies the color to fill the button corresponding to the active index.
|
|
20
|
+
|
|
21
|
+
4. Active Tab Font Color (activeFontColor)
|
|
22
|
+
|
|
23
|
+
- Specifies the text color of the button corresponding to the active index.
|
|
24
|
+
|
|
25
|
+
5. Active Tab Border Color (activeLineColor)
|
|
26
|
+
|
|
27
|
+
- Specifies the border color of the button corresponding to the active index.
|
|
28
|
+
|
|
29
|
+
6. Active Tab Border Width (activeLineWidth)
|
|
30
|
+
|
|
31
|
+
- Specifies the border width of the button corresponding to the active index.
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
# Komponen Tab (tab)
|
|
2
|
+
|
|
3
|
+
Sebuah komponen yang digunakan untuk mengawal tab container melalui interaksi pengguna. Ia mewakili kad-kad dalam tab container sasaran sebagai butang, dan apabila pengguna mengklik butang, kad yang sepadan dengan butang tersebut akan dipaparkan di hadapan tab container.
|
|
4
|
+
|
|
5
|
+
## Ciri-ciri
|
|
6
|
+
|
|
7
|
+
1. Rujukan Tab (reference)
|
|
8
|
+
|
|
9
|
+
- Menentukan tab container sasaran yang ingin dikawal oleh komponen tab ini.
|
|
10
|
+
|
|
11
|
+
2. Indeks Tab Aktif (activeIndex)
|
|
12
|
+
|
|
13
|
+
- Indeks berasaskan sifar bagi kad yang kini aktif.
|
|
14
|
+
- Sebagai ciri nilai komponen ini, apabila nilai ini berubah, kad aktif dalam tab container juga berubah.
|
|
15
|
+
- Nilai data komponen ini juga berubah untuk sepadan dengan nilai ini.
|
|
16
|
+
|
|
17
|
+
3. Gaya Isi Tab Aktif (activeFillStyle)
|
|
18
|
+
|
|
19
|
+
- Menentukan warna untuk mengisi butang yang sepadan dengan indeks aktif.
|
|
20
|
+
|
|
21
|
+
4. Warna Fon Tab Aktif (activeFontColor)
|
|
22
|
+
|
|
23
|
+
- Menentukan warna teks butang yang sepadan dengan indeks aktif.
|
|
24
|
+
|
|
25
|
+
5. Warna Sempadan Tab Aktif (activeLineColor)
|
|
26
|
+
|
|
27
|
+
- Menentukan warna sempadan butang yang sepadan dengan indeks aktif.
|
|
28
|
+
|
|
29
|
+
6. Lebar Sempadan Tab Aktif (activeLineWidth)
|
|
30
|
+
|
|
31
|
+
- Menentukan lebar sempadan butang yang sepadan dengan indeks aktif.
|
|
@@ -1,13 +1,31 @@
|
|
|
1
|
-
# tab
|
|
2
|
-
![Container][Container-04]
|
|
3
|
-
标签
|
|
1
|
+
# 选项卡组件(tab)
|
|
4
2
|
|
|
3
|
+
这是一个用于通过用户交互控制选项卡容器的组件。它将目标选项卡容器的卡片表示为按钮,当用户单击按钮时,与该按钮对应的卡片将显示在选项卡容器的最前面。
|
|
5
4
|
|
|
6
|
-
|
|
5
|
+
## 属性
|
|
7
6
|
|
|
8
|
-
|
|
7
|
+
1. 选项卡引用(reference)
|
|
9
8
|
|
|
9
|
+
- 指定要由此选项卡组件控制的目标选项卡容器。
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
2. 活动选项卡索引(activeIndex)
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
- 当前活动卡片的基于零的索引。
|
|
14
|
+
- 作为此组件的值属性,当此值更改时,选项卡容器的活动卡片也会更改。
|
|
15
|
+
- 此组件的数据值也会与此值匹配而更改。
|
|
16
|
+
|
|
17
|
+
3. 活动选项卡填充样式(activeFillStyle)
|
|
18
|
+
|
|
19
|
+
- 指定要填充到与活动索引对应的按钮的颜色。
|
|
20
|
+
|
|
21
|
+
4. 活动选项卡字体颜色(activeFontColor)
|
|
22
|
+
|
|
23
|
+
- 指定与活动索引对应的按钮的文本颜色。
|
|
24
|
+
|
|
25
|
+
5. 活动选项卡边框颜色(activeLineColor)
|
|
26
|
+
|
|
27
|
+
- 指定与活动索引对应的按钮的边框颜色。
|
|
28
|
+
|
|
29
|
+
6. 活动选项卡边框宽度(activeLineWidth)
|
|
30
|
+
|
|
31
|
+
- 指定与活动索引对应的按钮的边框宽度。
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@operato/scene-tab",
|
|
3
3
|
"description": "Tab style container for Things Scene",
|
|
4
4
|
"author": "heartyoh",
|
|
5
|
-
"version": "1.2.
|
|
5
|
+
"version": "1.2.76",
|
|
6
6
|
"main": "dist/index.js",
|
|
7
7
|
"module": "dist/index.js",
|
|
8
8
|
"license": "MIT",
|
|
@@ -57,5 +57,5 @@
|
|
|
57
57
|
"prettier --write"
|
|
58
58
|
]
|
|
59
59
|
},
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "c134e8af29c863a4eaaf5e9d9dd309a41c334c44"
|
|
61
61
|
}
|