gnui 1.2.19 → 1.2.20

package/package.json

@@ -4,7 +4,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "1.2.19",
+  "version": "1.2.20",
   "type": "module",
   "main": "dist/js/gnui.js",
   "types": "@types/gnui.d.ts",
@@ -29,7 +29,7 @@
   ],
   "scripts": {
     "build": "npm install && npm run build-clean && npm run build-sass && npm run build-autoprefix && npm run docs && npm run build-ts",
-    "build-autoprefix": "postcss css/ --use autoprefixer --no-map --dir dist/styles",
+    "build-autoprefix": "postcss css/ --no-map --dir dist/styles",
     "build-clean": "rimraf css styleguide dist",
     "build-sass": "sass --no-source-map theme/:css/",
     "build-ts": "rollup -c",
@@ -109,6 +109,7 @@
     "node-aigis": "^1.4.1",
     "npm-watch": "^0.11.0",
     "postcss-cli": "^11.0.0",
+    "postcss-discard-comments": "^7.0.5",
     "prettier": "^3.1.1",
     "rimraf": "^5.0.5",
     "rollup": "^4.9.1",

package/styleguide/assets/components.js

@@ -311,6 +311,20 @@ const components = {
       hasSearch: true,
       color: 'danger'
     });
+    Gn.create('dropdown', {
+      target: '.new-dropdown5',
+      onChange: function (val, txt, values) {
+        console.log('선택된 값은 [ ' + val + ' ]입니다.');
+      },
+      width: '300px',
+      data: [
+        { value: '1', cols: ['항목1', '카테고리A', '1000'] },
+        { value: '2', cols: ['항목2', '카테고리B', '2000'] },
+        { value: '3', cols: ['항목3', '카테고리C', '3000'] },
+        { value: '4', cols: ['항목4', '카테고리A', '4000'] },
+        { value: '5', cols: ['항목5', '카테고리B', '5000'] }
+      ]
+    });
   },
   Datagrid: function () {
     Gn.create('datagrid', {
@@ -1287,7 +1301,7 @@ const components = {
   },
   MenuButton: function () {
     Gn.create('menubutton', {
-      target: 'button[name=new-button]',
+      target: '.new-button',
       size: 'normal',
       textSets: {
         buttonText: '메뉴버튼'
@@ -1319,8 +1333,33 @@ const components = {
         ]
       ]
     });
+    // 다중 컬럼 예제
     Gn.create('menubutton', {
-      target: 'button[name=new-button2]',
+      target: '.new-menubutton-cols',
+      size: 'normal',
+      textSets: {
+        buttonText: '다중 컬럼 메뉴'
+      },
+      onSelect: function (menu) {
+        console.log('선택된 메뉴는 ' + menu);
+      },
+      data: [
+        {
+          value: 'menu1',
+          cols: ['item1', '1', '상세정보1']
+        },
+        {
+          value: 'menu2',
+          cols: ['item2', '2', '상세정보2']
+        },
+        {
+          value: 'menu3',
+          cols: ['item3', '3', '상세정보3']
+        }
+      ]
+    });
+    Gn.create('menubutton', {
+      target: '.new-button2',
       style: 'simple',
       icon: 'list',
       data: [
@@ -1336,7 +1375,7 @@ const components = {
     });
     // 서브메뉴 테스트
     Gn.create('menubutton', {
-      target: 'button[name=new-button-submenu]',
+      target: '.new-button-submenu',
       size: 'normal',
       textSets: {
         buttonText: '편집 메뉴'
@@ -1497,6 +1536,22 @@ const components = {
         targetCaption: '할당됨'
       }
     });
+    Gn.create('picklist', {
+      target: '.new-picklist-cols',
+      data: {
+        source: [
+          { value: '항목1', cols: ['item1', '1', '상세정보1'] },
+          { value: '항목2', cols: ['item2', '2', '상세정보2'] },
+          { value: '항목3', cols: ['item3', '3', '상세정보3'] },
+          { value: '항목4', cols: ['item4', '4', '상세정보4'] },
+          { value: '항목5', cols: ['item5', '5', '상세정보5'] }
+        ],
+        target: []
+      },
+      direction: 'vertical',
+      width: '500px',
+      height: 150
+    });
   },
   SortableList: function () {
     Gn.create('sortablelist', {