gnui 1.1.7 → 1.2.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/@types/gnui.d.ts +195 -154
- package/README.md +9 -3
- package/assets/NotoSansKR-Black.otf +0 -0
- package/assets/NotoSansKR-Black.woff +0 -0
- package/assets/NotoSansKR-Black.woff2 +0 -0
- package/assets/NotoSansKR-Bold.otf +0 -0
- package/assets/NotoSansKR-Bold.woff +0 -0
- package/assets/NotoSansKR-Bold.woff2 +0 -0
- package/assets/NotoSansKR-DemiLight.otf +0 -0
- package/assets/NotoSansKR-DemiLight.woff +0 -0
- package/assets/NotoSansKR-DemiLight.woff2 +0 -0
- package/assets/NotoSansKR-Light.otf +0 -0
- package/assets/NotoSansKR-Light.woff +0 -0
- package/assets/NotoSansKR-Light.woff2 +0 -0
- package/assets/NotoSansKR-Medium.otf +0 -0
- package/assets/NotoSansKR-Medium.woff +0 -0
- package/assets/NotoSansKR-Medium.woff2 +0 -0
- package/assets/NotoSansKR-Regular.otf +0 -0
- package/assets/NotoSansKR-Regular.woff +0 -0
- package/assets/NotoSansKR-Regular.woff2 +0 -0
- package/assets/NotoSansKR-Thin.otf +0 -0
- package/assets/NotoSansKR-Thin.woff +0 -0
- package/assets/NotoSansKR-Thin.woff2 +0 -0
- package/assets/{LICENSE_OFL.txt → OFL.txt} +93 -92
- package/assets/images/flags.png +0 -0
- package/dist/js/gnui.esm.js +19752 -17625
- package/dist/js/gnui.js +19767 -17931
- package/dist/js/gnui.min.js +23 -1
- package/dist/styles/default.css +1 -3
- package/dist/styles/gpi.css +1 -3
- package/dist/styles/green24.css +1 -0
- package/dist/styles/insights.css +1 -3
- package/dist/styles/nac.css +1 -3
- package/dist/styles/ztnac.css +1 -0
- package/package.json +39 -30
- package/styleguide/assets/components.js +1031 -579
- package/styleguide/assets/guide.js +28 -26
- package/styleguide/assets/okadia.css +115 -117
- package/styleguide/assets/theme.css +140 -82
- package/styleguide/category/COLOR/index.html +75 -77
- package/styleguide/category/COMPONENT/Alert(js)/index.html +89 -92
- package/styleguide/category/COMPONENT/Bignumber/index.html +78 -82
- package/styleguide/category/COMPONENT/Breadcrumb/index.html +78 -82
- package/styleguide/category/COMPONENT/Calendar(js)/index.html +89 -92
- package/styleguide/category/COMPONENT/Card/index.html +78 -82
- package/styleguide/category/COMPONENT/Chart(js)/index.html +89 -92
- package/styleguide/category/COMPONENT/Datagrid(js)/index.html +354 -206
- package/styleguide/category/COMPONENT/Datalist(js)/index.html +471 -0
- package/styleguide/category/COMPONENT/Growl(js)/index.html +89 -92
- package/styleguide/category/COMPONENT/JsonView(js)/index.html +544 -246
- package/styleguide/category/{CONTROLS → COMPONENT}/MenuButton(js)/index.html +116 -92
- package/styleguide/category/COMPONENT/Message(js)/index.html +219 -95
- package/styleguide/category/COMPONENT/Modal(js)/index.html +128 -94
- package/styleguide/category/COMPONENT/Pagination/index.html +78 -82
- package/styleguide/category/COMPONENT/Panel/index.html +78 -82
- package/styleguide/category/COMPONENT/Progressbar(js)/index.html +89 -92
- package/styleguide/category/COMPONENT/Tab(js)/index.html +122 -93
- package/styleguide/category/COMPONENT/Tagcloud(js)/index.html +88 -89
- package/styleguide/category/COMPONENT/Tooltip(js)/index.html +175 -92
- package/styleguide/category/COMPONENT/Tree(js)/index.html +95 -92
- package/styleguide/category/CONTROLS/Button(js)/index.html +110 -95
- package/styleguide/category/CONTROLS/Checkbox/index.html +82 -86
- package/styleguide/category/CONTROLS/Colorpicker(js)/index.html +147 -93
- package/styleguide/category/CONTROLS/Datepicker(js)/index.html +124 -92
- package/styleguide/category/CONTROLS/Dropdown(js)/index.html +161 -132
- package/styleguide/category/CONTROLS/File/index.html +78 -82
- package/styleguide/category/CONTROLS/Form/Control/index.html +78 -82
- package/styleguide/category/CONTROLS/Form/Field/index.html +78 -82
- package/styleguide/category/CONTROLS/Form/Plain/index.html +78 -82
- package/styleguide/category/CONTROLS/Input/index.html +80 -84
- package/styleguide/category/CONTROLS/MultiText(js)/index.html +105 -92
- package/styleguide/category/CONTROLS/Picklist(js)/index.html +165 -141
- package/styleguide/category/CONTROLS/Radio/index.html +78 -82
- package/styleguide/category/CONTROLS/Select/index.html +80 -84
- package/styleguide/category/CONTROLS/SelectButton(js)/index.html +147 -92
- package/styleguide/category/CONTROLS/Slider/index.html +78 -82
- package/styleguide/category/CONTROLS/Switch(js)/index.html +105 -93
- package/styleguide/category/CONTROLS/SyntaxInput(js)/index.html +89 -92
- package/styleguide/category/CONTROLS/Textarea/index.html +78 -82
- package/styleguide/category/{COMPONENT → CONTROLS}/Time(js)/index.html +111 -92
- package/styleguide/category/ELEMENTS/Box/index.html +78 -82
- package/styleguide/category/ELEMENTS/Icon/index.html +122 -82
- package/styleguide/category/ELEMENTS/Image/index.html +78 -82
- package/styleguide/category/ELEMENTS/List/index.html +78 -82
- package/styleguide/category/ELEMENTS/Table/index.html +78 -82
- package/styleguide/category/ELEMENTS/Tag/index.html +78 -82
- package/styleguide/category/ELEMENTS/Title/index.html +78 -82
- package/styleguide/category/LAYOUT/Container/index.html +78 -82
- package/styleguide/category/LAYOUT/Grid/index.html +78 -82
- package/styleguide/category/LAYOUT/Splitter(js)/index.html +89 -92
- package/styleguide/category/UTILITY/index.html +80 -82
- package/styleguide/category/Utils/index.html +97 -71
- package/styleguide/color.html +66 -65
- package/styleguide/index.html +66 -65
- package/styleguide/tag/javascript/index.html +1984 -1011
- package/styleguide/tag/v.0.1.0/index.html +2730 -1568
- package/assets/NotoSansCJKkr-Black.otf +0 -0
- package/assets/NotoSansCJKkr-Bold.otf +0 -0
- package/assets/NotoSansCJKkr-DemiLight.otf +0 -0
- package/assets/NotoSansCJKkr-Light.otf +0 -0
- package/assets/NotoSansCJKkr-Medium.otf +0 -0
- package/assets/NotoSansCJKkr-Regular.otf +0 -0
- package/assets/NotoSansCJKkr-Thin.otf +0 -0
- package/assets/NotoSansMonoCJKkr-Bold.otf +0 -0
- package/assets/NotoSansMonoCJKkr-Regular.otf +0 -0
- package/assets/README +0 -11
- package/dist/styles/zt-nac.css +0 -3
|
@@ -1,65 +1,71 @@
|
|
|
1
1
|
<!DOCTYPE html>
|
|
2
2
|
<html>
|
|
3
3
|
<head>
|
|
4
|
-
<meta charset="utf-8"
|
|
5
|
-
<meta name="viewport" content="width=device-width"
|
|
6
|
-
<link href="../../../../dist/styles/default.css" rel="stylesheet" id="ThemeFile"
|
|
7
|
-
<link href="../../../assets/okadia.css" rel="stylesheet"
|
|
8
|
-
<link href="../../../assets/theme.css" rel="stylesheet"
|
|
9
|
-
<link
|
|
10
|
-
|
|
4
|
+
<meta charset="utf-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width" />
|
|
6
|
+
<link href="../../../../dist/styles/default.css" rel="stylesheet" id="ThemeFile" />
|
|
7
|
+
<link href="../../../assets/okadia.css" rel="stylesheet" />
|
|
8
|
+
<link href="../../../assets/theme.css" rel="stylesheet" />
|
|
9
|
+
<link
|
|
10
|
+
rel="stylesheet"
|
|
11
|
+
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css"
|
|
12
|
+
integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA=="
|
|
13
|
+
crossorigin="anonymous"
|
|
14
|
+
/>
|
|
15
|
+
<link href="https://fonts.googleapis.com/css?family=Squada+One&display=swap" rel="stylesheet" />
|
|
11
16
|
<script src="../../../assets/components.js"></script>
|
|
12
17
|
<script src="../../../../dist/js/gnui.js"></script>
|
|
13
18
|
</head>
|
|
14
|
-
<body>
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
19
|
+
<body>
|
|
20
|
+
<div class="aigis-container">
|
|
21
|
+
<header class="aigis-header gn-gcolor is-primary">
|
|
22
|
+
<span><a href="../../../index.html" class="main-link" style="font-family: 'Squada One', cursive">GNUI</a></span>
|
|
23
|
+
<span class="has-text-invert" style="font-size: 1em; padding-left: 10px">Start your next web project with GNUI.</span>
|
|
24
|
+
<div class="gn-select is-medium">
|
|
25
|
+
<select id="ThemeSelector">
|
|
26
|
+
|
|
22
27
|
<option value="default">default</option>
|
|
23
|
-
|
|
28
|
+
|
|
24
29
|
<option value="nac">nac</option>
|
|
25
|
-
|
|
30
|
+
|
|
26
31
|
<option value="insights">insights</option>
|
|
27
|
-
|
|
32
|
+
|
|
28
33
|
<option value="gpi">gpi</option>
|
|
29
|
-
|
|
30
|
-
<option value="
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
34
|
+
|
|
35
|
+
<option value="ztnac">ztnac</option>
|
|
36
|
+
|
|
37
|
+
<option value="green24">green24</option>
|
|
38
|
+
|
|
39
|
+
</select>
|
|
40
|
+
</div>
|
|
41
|
+
<div>
|
|
42
|
+
<a class="gn-button is-primary util-link" href="../../../category/Utils/index.html">
|
|
43
|
+
<span class="gn-icon is-small">
|
|
44
|
+
<i class="fas fa-tools"></i>
|
|
45
|
+
</span>
|
|
46
|
+
Gn.util
|
|
47
|
+
</a>
|
|
48
|
+
</div>
|
|
49
|
+
</header>
|
|
50
|
+
<div class="aigis-sidemenu">
|
|
51
|
+
<nav class="gn-tree is-borderless is-large left-menu"></nav>
|
|
46
52
|
</div>
|
|
47
53
|
|
|
48
54
|
<script>
|
|
49
55
|
window.Gn = window.gnui;
|
|
50
56
|
|
|
51
|
-
Gn.ready(function(){
|
|
52
|
-
var leftMenu = setTree('COLOR,COMPONENT/Alert(js),COMPONENT/Bignumber,COMPONENT/Breadcrumb,COMPONENT/Calendar(js),COMPONENT/Card,COMPONENT/Chart(js),COMPONENT/Datagrid(js),COMPONENT/Growl(js),COMPONENT/JsonView(js),COMPONENT/Message(js),COMPONENT/Modal(js),COMPONENT/Pagination,COMPONENT/Panel,COMPONENT/Progressbar(js),COMPONENT/Tab(js),COMPONENT/Tagcloud(js),COMPONENT/
|
|
57
|
+
Gn.ready(function () {
|
|
58
|
+
var leftMenu = setTree('COLOR,COMPONENT/Alert(js),COMPONENT/Bignumber,COMPONENT/Breadcrumb,COMPONENT/Calendar(js),COMPONENT/Card,COMPONENT/Chart(js),COMPONENT/Datagrid(js),COMPONENT/Datalist(js),COMPONENT/Growl(js),COMPONENT/JsonView(js),COMPONENT/MenuButton(js),COMPONENT/Message(js),COMPONENT/Modal(js),COMPONENT/Pagination,COMPONENT/Panel,COMPONENT/Progressbar(js),COMPONENT/Tab(js),COMPONENT/Tagcloud(js),COMPONENT/Tooltip(js),COMPONENT/Tree(js),CONTROLS/Button(js),CONTROLS/Checkbox,CONTROLS/Colorpicker(js),CONTROLS/Datepicker(js),CONTROLS/Dropdown(js),CONTROLS/File,CONTROLS/Form/Control,CONTROLS/Form/Field,CONTROLS/Form/Plain,CONTROLS/Input,CONTROLS/MultiText(js),CONTROLS/Picklist(js),CONTROLS/Radio,CONTROLS/Select,CONTROLS/SelectButton(js),CONTROLS/Slider,CONTROLS/Switch(js),CONTROLS/SyntaxInput(js),CONTROLS/Textarea,CONTROLS/Time(js),ELEMENTS/Box,ELEMENTS/Icon,ELEMENTS/Image,ELEMENTS/List,ELEMENTS/Table,ELEMENTS/Tag,ELEMENTS/Title,LAYOUT/Container,LAYOUT/Grid,LAYOUT/Splitter(js),UTILITY,Utils'.split(','));
|
|
53
59
|
var jsComps = ''.split(',');
|
|
54
60
|
delete leftMenu.Utils;
|
|
55
61
|
Gn.util.append('.left-menu', renderTree(leftMenu));
|
|
56
62
|
Gn.util.scrollIntoView(Gn.util.$('.tree-item.is-active'), 300);
|
|
57
63
|
|
|
58
|
-
function renderTree(menus){
|
|
64
|
+
function renderTree(menus) {
|
|
59
65
|
var $depths = Gn.util.$('<ul></ul>');
|
|
60
|
-
Gn.util.each(menus, function (child, menu){
|
|
61
|
-
if(Gn.util.isString(child)){
|
|
62
|
-
Gn.util.append($depths, renderMenu(menu, '../../../category/'+child+'/index.html', location.href.indexOf(child+'/') > -1));
|
|
66
|
+
Gn.util.each(menus, function (child, menu) {
|
|
67
|
+
if (Gn.util.isString(child)) {
|
|
68
|
+
Gn.util.append($depths, renderMenu(menu, '../../../category/' + child + '/index.html', location.href.indexOf(child + '/') > -1));
|
|
63
69
|
} else {
|
|
64
70
|
var $_depth = renderMenu(menu, '');
|
|
65
71
|
Gn.util.append($_depth, renderTree(child));
|
|
@@ -69,35 +75,35 @@
|
|
|
69
75
|
return $depths;
|
|
70
76
|
}
|
|
71
77
|
|
|
72
|
-
function renderMenu(name, link, isActive){
|
|
78
|
+
function renderMenu(name, link, isActive) {
|
|
73
79
|
var $_menu;
|
|
74
|
-
if (link === ''){
|
|
80
|
+
if (link === '') {
|
|
75
81
|
$_menu = Gn.util.$('<li>' + name + '</li>');
|
|
76
82
|
} else {
|
|
77
|
-
var menuClass = isActive ? ' is-active' :''
|
|
78
|
-
$_menu = Gn.util.$('<li><a href="' + link + '"><div class="tree-item'+menuClass+'">' + name.split('(js)').join('') + '</a></div></li>');
|
|
83
|
+
var menuClass = isActive ? ' is-active' : '';
|
|
84
|
+
$_menu = Gn.util.$('<li><a href="' + link + '"><div class="tree-item' + menuClass + '">' + name.split('(js)').join('') + '</a></div></li>');
|
|
79
85
|
}
|
|
80
|
-
if(name.indexOf('(js)') > 0){
|
|
86
|
+
if (name.indexOf('(js)') > 0) {
|
|
81
87
|
Gn.util.append(Gn.util.find('.tree-item', $_menu), Gn.util.$('<span class="gn-tag is-small is-info-light">JS</span>'));
|
|
82
88
|
}
|
|
83
89
|
return $_menu;
|
|
84
90
|
}
|
|
85
91
|
|
|
86
|
-
function setTree(categorys){
|
|
92
|
+
function setTree(categorys) {
|
|
87
93
|
var menus = {};
|
|
88
94
|
|
|
89
|
-
categorys.forEach(function(category){
|
|
95
|
+
categorys.forEach(function (category) {
|
|
90
96
|
parseTree(menus, category.split('/'), category);
|
|
91
97
|
});
|
|
92
98
|
return menus;
|
|
93
99
|
}
|
|
94
100
|
|
|
95
|
-
function parseTree(parents, child, catgry){
|
|
101
|
+
function parseTree(parents, child, catgry) {
|
|
96
102
|
var _depth = child.shift();
|
|
97
103
|
if (parents[_depth] === undefined) {
|
|
98
|
-
parents[_depth] = {}
|
|
104
|
+
parents[_depth] = {};
|
|
99
105
|
}
|
|
100
|
-
if(child.length === 1){
|
|
106
|
+
if (child.length === 1) {
|
|
101
107
|
parents[_depth][child] = catgry;
|
|
102
108
|
} else if (child.length > 1) {
|
|
103
109
|
parseTree(parents[_depth], child, catgry);
|
|
@@ -108,27 +114,20 @@
|
|
|
108
114
|
});
|
|
109
115
|
</script>
|
|
110
116
|
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
<span class="gn-tag">v.0.1.0</span>
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
</div>
|
|
130
|
-
|
|
131
|
-
<h3 id="-">기본 사용</h3>
|
|
117
|
+
<div class="aigis-contents">
|
|
118
|
+
<div class="aigis-contents__body">
|
|
119
|
+
|
|
120
|
+
<div>
|
|
121
|
+
|
|
122
|
+
<div class="aigis-module Input">
|
|
123
|
+
<h2 class="aigis-module__heading" id="Input">Input</h2>
|
|
124
|
+
<div class="aigis-module__filepath">/scss/controls/input.scss</div>
|
|
125
|
+
<div class="aigis-tags">
|
|
126
|
+
|
|
127
|
+
<span class="gn-tag">v.0.1.0</span>
|
|
128
|
+
|
|
129
|
+
</div>
|
|
130
|
+
<h3 id="-">기본 사용</h3>
|
|
132
131
|
<ul>
|
|
133
132
|
<li>사용 태그 : <code>input[text]</code>, <code>input[password]</code>, <code>input[search]</code>, <code>input[email]</code>, <code>input[tel]</code></li>
|
|
134
133
|
</ul>
|
|
@@ -178,7 +177,7 @@
|
|
|
178
177
|
</div>
|
|
179
178
|
<input type="text" class="gn-input" placeholder="cost">
|
|
180
179
|
<a class="gn-plain" role="button">
|
|
181
|
-
<span class="gn-icon">
|
|
180
|
+
<span class="gn-icon is-small">
|
|
182
181
|
<i class="fas fa-calculator"></i>
|
|
183
182
|
</span>
|
|
184
183
|
</a>
|
|
@@ -222,7 +221,7 @@
|
|
|
222
221
|
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ></</span>div</span><span class="token punctuation" >></span></span>
|
|
223
222
|
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ><</span>input</span> <span class="token attr-name" >type</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>text<span class="token punctuation" >"</span></span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-input<span class="token punctuation" >"</span></span> <span class="token attr-name" >placeholder</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>cost<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
|
|
224
223
|
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ><</span>a</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-plain<span class="token punctuation" >"</span></span> <span class="token attr-name" >role</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>button<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
|
|
225
|
-
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ><</span>span</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-icon<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
|
|
224
|
+
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ><</span>span</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>gn-icon is-small<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span>
|
|
226
225
|
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ><</span>i</span> <span class="token attr-name" >class</span><span class="token attr-value" ><span class="token punctuation" >=</span><span class="token punctuation" >"</span>fas fa-calculator<span class="token punctuation" >"</span></span><span class="token punctuation" >></span></span><span class="token tag" ><span class="token tag" ><span class="token punctuation" ></</span>i</span><span class="token punctuation" >></span></span>
|
|
227
226
|
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ></</span>span</span><span class="token punctuation" >></span></span>
|
|
228
227
|
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ></</span>a</span><span class="token punctuation" >></span></span>
|
|
@@ -317,18 +316,15 @@
|
|
|
317
316
|
<span class="token tag" ><span class="token tag" ><span class="token punctuation" ></</span>p</span><span class="token punctuation" >></span></span>
|
|
318
317
|
</code></pre>
|
|
319
318
|
|
|
320
|
-
</div>
|
|
321
319
|
</div>
|
|
322
320
|
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
321
|
+
</div>
|
|
322
|
+
|
|
323
|
+
|
|
324
|
+
<footer class="aigis-footer">Last update at 2024/04/15 13:52</footer>
|
|
325
|
+
</div>
|
|
326
326
|
</div>
|
|
327
327
|
</div>
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
</body>
|
|
328
|
+
<script src="../../../assets/guide.js"></script>
|
|
329
|
+
</body>
|
|
331
330
|
</html>
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
@@ -1,65 +1,71 @@
|
|
|
1
1
|
<!DOCTYPE html>
|
|
2
2
|
<html>
|
|
3
3
|
<head>
|
|
4
|
-
<meta charset="utf-8"
|
|
5
|
-
<meta name="viewport" content="width=device-width"
|
|
6
|
-
<link href="../../../../dist/styles/default.css" rel="stylesheet" id="ThemeFile"
|
|
7
|
-
<link href="../../../assets/okadia.css" rel="stylesheet"
|
|
8
|
-
<link href="../../../assets/theme.css" rel="stylesheet"
|
|
9
|
-
<link
|
|
10
|
-
|
|
4
|
+
<meta charset="utf-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width" />
|
|
6
|
+
<link href="../../../../dist/styles/default.css" rel="stylesheet" id="ThemeFile" />
|
|
7
|
+
<link href="../../../assets/okadia.css" rel="stylesheet" />
|
|
8
|
+
<link href="../../../assets/theme.css" rel="stylesheet" />
|
|
9
|
+
<link
|
|
10
|
+
rel="stylesheet"
|
|
11
|
+
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css"
|
|
12
|
+
integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA=="
|
|
13
|
+
crossorigin="anonymous"
|
|
14
|
+
/>
|
|
15
|
+
<link href="https://fonts.googleapis.com/css?family=Squada+One&display=swap" rel="stylesheet" />
|
|
11
16
|
<script src="../../../assets/components.js"></script>
|
|
12
17
|
<script src="../../../../dist/js/gnui.js"></script>
|
|
13
18
|
</head>
|
|
14
|
-
<body>
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
19
|
+
<body>
|
|
20
|
+
<div class="aigis-container">
|
|
21
|
+
<header class="aigis-header gn-gcolor is-primary">
|
|
22
|
+
<span><a href="../../../index.html" class="main-link" style="font-family: 'Squada One', cursive">GNUI</a></span>
|
|
23
|
+
<span class="has-text-invert" style="font-size: 1em; padding-left: 10px">Start your next web project with GNUI.</span>
|
|
24
|
+
<div class="gn-select is-medium">
|
|
25
|
+
<select id="ThemeSelector">
|
|
26
|
+
|
|
22
27
|
<option value="default">default</option>
|
|
23
|
-
|
|
28
|
+
|
|
24
29
|
<option value="nac">nac</option>
|
|
25
|
-
|
|
30
|
+
|
|
26
31
|
<option value="insights">insights</option>
|
|
27
|
-
|
|
32
|
+
|
|
28
33
|
<option value="gpi">gpi</option>
|
|
29
|
-
|
|
30
|
-
<option value="
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
34
|
+
|
|
35
|
+
<option value="ztnac">ztnac</option>
|
|
36
|
+
|
|
37
|
+
<option value="green24">green24</option>
|
|
38
|
+
|
|
39
|
+
</select>
|
|
40
|
+
</div>
|
|
41
|
+
<div>
|
|
42
|
+
<a class="gn-button is-primary util-link" href="../../../category/Utils/index.html">
|
|
43
|
+
<span class="gn-icon is-small">
|
|
44
|
+
<i class="fas fa-tools"></i>
|
|
45
|
+
</span>
|
|
46
|
+
Gn.util
|
|
47
|
+
</a>
|
|
48
|
+
</div>
|
|
49
|
+
</header>
|
|
50
|
+
<div class="aigis-sidemenu">
|
|
51
|
+
<nav class="gn-tree is-borderless is-large left-menu"></nav>
|
|
46
52
|
</div>
|
|
47
53
|
|
|
48
54
|
<script>
|
|
49
55
|
window.Gn = window.gnui;
|
|
50
56
|
|
|
51
|
-
Gn.ready(function(){
|
|
52
|
-
var leftMenu = setTree('COLOR,COMPONENT/Alert(js),COMPONENT/Bignumber,COMPONENT/Breadcrumb,COMPONENT/Calendar(js),COMPONENT/Card,COMPONENT/Chart(js),COMPONENT/Datagrid(js),COMPONENT/Growl(js),COMPONENT/JsonView(js),COMPONENT/Message(js),COMPONENT/Modal(js),COMPONENT/Pagination,COMPONENT/Panel,COMPONENT/Progressbar(js),COMPONENT/Tab(js),COMPONENT/Tagcloud(js),COMPONENT/
|
|
57
|
+
Gn.ready(function () {
|
|
58
|
+
var leftMenu = setTree('COLOR,COMPONENT/Alert(js),COMPONENT/Bignumber,COMPONENT/Breadcrumb,COMPONENT/Calendar(js),COMPONENT/Card,COMPONENT/Chart(js),COMPONENT/Datagrid(js),COMPONENT/Datalist(js),COMPONENT/Growl(js),COMPONENT/JsonView(js),COMPONENT/MenuButton(js),COMPONENT/Message(js),COMPONENT/Modal(js),COMPONENT/Pagination,COMPONENT/Panel,COMPONENT/Progressbar(js),COMPONENT/Tab(js),COMPONENT/Tagcloud(js),COMPONENT/Tooltip(js),COMPONENT/Tree(js),CONTROLS/Button(js),CONTROLS/Checkbox,CONTROLS/Colorpicker(js),CONTROLS/Datepicker(js),CONTROLS/Dropdown(js),CONTROLS/File,CONTROLS/Form/Control,CONTROLS/Form/Field,CONTROLS/Form/Plain,CONTROLS/Input,CONTROLS/MultiText(js),CONTROLS/Picklist(js),CONTROLS/Radio,CONTROLS/Select,CONTROLS/SelectButton(js),CONTROLS/Slider,CONTROLS/Switch(js),CONTROLS/SyntaxInput(js),CONTROLS/Textarea,CONTROLS/Time(js),ELEMENTS/Box,ELEMENTS/Icon,ELEMENTS/Image,ELEMENTS/List,ELEMENTS/Table,ELEMENTS/Tag,ELEMENTS/Title,LAYOUT/Container,LAYOUT/Grid,LAYOUT/Splitter(js),UTILITY,Utils'.split(','));
|
|
53
59
|
var jsComps = ''.split(',');
|
|
54
60
|
delete leftMenu.Utils;
|
|
55
61
|
Gn.util.append('.left-menu', renderTree(leftMenu));
|
|
56
62
|
Gn.util.scrollIntoView(Gn.util.$('.tree-item.is-active'), 300);
|
|
57
63
|
|
|
58
|
-
function renderTree(menus){
|
|
64
|
+
function renderTree(menus) {
|
|
59
65
|
var $depths = Gn.util.$('<ul></ul>');
|
|
60
|
-
Gn.util.each(menus, function (child, menu){
|
|
61
|
-
if(Gn.util.isString(child)){
|
|
62
|
-
Gn.util.append($depths, renderMenu(menu, '../../../category/'+child+'/index.html', location.href.indexOf(child+'/') > -1));
|
|
66
|
+
Gn.util.each(menus, function (child, menu) {
|
|
67
|
+
if (Gn.util.isString(child)) {
|
|
68
|
+
Gn.util.append($depths, renderMenu(menu, '../../../category/' + child + '/index.html', location.href.indexOf(child + '/') > -1));
|
|
63
69
|
} else {
|
|
64
70
|
var $_depth = renderMenu(menu, '');
|
|
65
71
|
Gn.util.append($_depth, renderTree(child));
|
|
@@ -69,35 +75,35 @@
|
|
|
69
75
|
return $depths;
|
|
70
76
|
}
|
|
71
77
|
|
|
72
|
-
function renderMenu(name, link, isActive){
|
|
78
|
+
function renderMenu(name, link, isActive) {
|
|
73
79
|
var $_menu;
|
|
74
|
-
if (link === ''){
|
|
80
|
+
if (link === '') {
|
|
75
81
|
$_menu = Gn.util.$('<li>' + name + '</li>');
|
|
76
82
|
} else {
|
|
77
|
-
var menuClass = isActive ? ' is-active' :''
|
|
78
|
-
$_menu = Gn.util.$('<li><a href="' + link + '"><div class="tree-item'+menuClass+'">' + name.split('(js)').join('') + '</a></div></li>');
|
|
83
|
+
var menuClass = isActive ? ' is-active' : '';
|
|
84
|
+
$_menu = Gn.util.$('<li><a href="' + link + '"><div class="tree-item' + menuClass + '">' + name.split('(js)').join('') + '</a></div></li>');
|
|
79
85
|
}
|
|
80
|
-
if(name.indexOf('(js)') > 0){
|
|
86
|
+
if (name.indexOf('(js)') > 0) {
|
|
81
87
|
Gn.util.append(Gn.util.find('.tree-item', $_menu), Gn.util.$('<span class="gn-tag is-small is-info-light">JS</span>'));
|
|
82
88
|
}
|
|
83
89
|
return $_menu;
|
|
84
90
|
}
|
|
85
91
|
|
|
86
|
-
function setTree(categorys){
|
|
92
|
+
function setTree(categorys) {
|
|
87
93
|
var menus = {};
|
|
88
94
|
|
|
89
|
-
categorys.forEach(function(category){
|
|
95
|
+
categorys.forEach(function (category) {
|
|
90
96
|
parseTree(menus, category.split('/'), category);
|
|
91
97
|
});
|
|
92
98
|
return menus;
|
|
93
99
|
}
|
|
94
100
|
|
|
95
|
-
function parseTree(parents, child, catgry){
|
|
101
|
+
function parseTree(parents, child, catgry) {
|
|
96
102
|
var _depth = child.shift();
|
|
97
103
|
if (parents[_depth] === undefined) {
|
|
98
|
-
parents[_depth] = {}
|
|
104
|
+
parents[_depth] = {};
|
|
99
105
|
}
|
|
100
|
-
if(child.length === 1){
|
|
106
|
+
if (child.length === 1) {
|
|
101
107
|
parents[_depth][child] = catgry;
|
|
102
108
|
} else if (child.length > 1) {
|
|
103
109
|
parseTree(parents[_depth], child, catgry);
|
|
@@ -108,38 +114,32 @@
|
|
|
108
114
|
});
|
|
109
115
|
</script>
|
|
110
116
|
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
</div>
|
|
123
|
-
<div class="aigis-tags">
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
<span class="gn-tag">v.0.1.0</span>
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
<a class="js-guide"><span class="gn-tag is-info">javascript</span></a>
|
|
131
|
-
|
|
117
|
+
<div class="aigis-contents">
|
|
118
|
+
<div class="aigis-contents__body">
|
|
119
|
+
|
|
120
|
+
<div>
|
|
121
|
+
|
|
122
|
+
<div class="aigis-module MultiText">
|
|
123
|
+
<h2 class="aigis-module__heading" id="MultiText">MultiText</h2>
|
|
124
|
+
<div class="aigis-module__filepath">/scss/controls/multitext.scss</div>
|
|
125
|
+
<div class="aigis-tags">
|
|
126
|
+
|
|
127
|
+
<span class="gn-tag">v.0.1.0</span>
|
|
132
128
|
|
|
133
|
-
</
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
129
|
+
<a class="js-guide"><span class="gn-tag is-info">javascript</span></a>
|
|
130
|
+
|
|
131
|
+
</div>
|
|
132
|
+
<!-- <div id="ComponentTab">
|
|
133
|
+
<ul>
|
|
134
|
+
<li><a href="#styleguide">Style</a></li>
|
|
135
|
+
<li>
|
|
136
|
+
<a href="#scriptguide"
|
|
137
|
+
>Script <span class="gn-icon"><i class="fas fa-code"></i></span
|
|
138
|
+
></a>
|
|
139
|
+
</li>
|
|
140
|
+
</ul>
|
|
141
|
+
</div> -->
|
|
142
|
+
<h3 id="-">생성 옵션</h3>
|
|
143
143
|
<div class="aigis-preview">
|
|
144
144
|
|
|
145
145
|
<div class="default-multitext">
|
|
@@ -223,6 +223,12 @@ Gn<span class="token punctuation" >.</span><span class="token function" >create<
|
|
|
223
223
|
<td></td>
|
|
224
224
|
<td>값 변경 시 발생 이벤트</td>
|
|
225
225
|
</tr>
|
|
226
|
+
<tr>
|
|
227
|
+
<td colspan="2">disabled</td>
|
|
228
|
+
<td>boolean</td>
|
|
229
|
+
<td>false</td>
|
|
230
|
+
<td>비활성화 여부</td>
|
|
231
|
+
</tr>
|
|
226
232
|
</tbody>
|
|
227
233
|
</table>
|
|
228
234
|
|
|
@@ -240,21 +246,28 @@ Gn<span class="token punctuation" >.</span><span class="token function" >create<
|
|
|
240
246
|
<td>String</td>
|
|
241
247
|
<td>값을 반환한다. </td>
|
|
242
248
|
</tr>
|
|
249
|
+
<tr>
|
|
250
|
+
<td>disable()</td>
|
|
251
|
+
<td>void</td>
|
|
252
|
+
<td>Disabled 처리한다.</td>
|
|
253
|
+
</tr>
|
|
254
|
+
<tr>
|
|
255
|
+
<td>enable()</td>
|
|
256
|
+
<td>void</td>
|
|
257
|
+
<td>Enabled 처리한다.</td>
|
|
258
|
+
</tr>
|
|
243
259
|
</tbody>
|
|
244
260
|
</table>
|
|
245
261
|
|
|
246
|
-
</div>
|
|
247
262
|
</div>
|
|
248
263
|
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
264
|
+
</div>
|
|
265
|
+
|
|
266
|
+
|
|
267
|
+
<footer class="aigis-footer">Last update at 2024/04/15 13:52</footer>
|
|
268
|
+
</div>
|
|
252
269
|
</div>
|
|
253
270
|
</div>
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
</body>
|
|
271
|
+
<script src="../../../assets/guide.js"></script>
|
|
272
|
+
</body>
|
|
257
273
|
</html>
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|