From 93fec79c1edd00cc08a1900d7380c55aa2e859ef Mon Sep 17 00:00:00 2001
From: MaxOvs19 <gshk3669@gmail.com>
Date: Fri, 17 Feb 2023 19:56:41 +0300
Subject: [PATCH] Constructor in working. Added description in style builder

---
 example/index.html                     | 14 +++++++++++++-
 example/src/constructor/constructor.js |  9 +++------
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/example/index.html b/example/index.html
index 890d4b7..a977315 100644
--- a/example/index.html
+++ b/example/index.html
@@ -322,6 +322,19 @@
 
       <div class="example-select">
         <h1 class="example-select_title">Select constructor</h1>
+        <div class="col" style="margin: 20px; color: white">
+          <h5 style="font-size: 18px">Select Style Builder:</h5>
+          <p style="margin-right: 50px; font-size: 17px">
+            This is a constructor for styling a select online without downloading. For it to work,
+            you need to: 
+            <ol style="font-size: 15px;">
+              <li>Select a part of the select for customization. </li>
+              <li>Enter styles in the text field in the form "color: red;".</li>
+              <li>Click on the render button.</li>
+            </ol>
+             
+          </p>
+        </div>
         <div class="layout-select constructor">
           <button class="cg-dropdown body"></button>
           <textarea
@@ -334,7 +347,6 @@
             disabled="disabled"
           ></textarea>
           <button type="button" class="check-code render">Render</button>
-          <button type="button" class="check-code saveStyle">Save style</button>
         </div>
         <div class="layout-select constructor">
           <button class="cg-dropdown select"></button>
diff --git a/example/src/constructor/constructor.js b/example/src/constructor/constructor.js
index 7aaafe9..097a98a 100644
--- a/example/src/constructor/constructor.js
+++ b/example/src/constructor/constructor.js
@@ -3,19 +3,17 @@ import { CGSelect } from '../../../src/cg-select';
 const body = new CGSelect({
   selector: '.body',
   placeholder: 'Select element to style',
-  items: ['head', 'list', 'placeholder', 'caret', 'search', 'chips'],
+  items: ['head', 'list', 'placeholder', 'caret', 'search'],
 });
 
 let head = '';
 let list = '';
 let placeholder = '';
 let caret = '';
-let chips = '';
 let valueSelect = '';
 
 const textarea = document.querySelector('#styles');
 const renderBtn = document.querySelector('.render');
-const saveStyleBtn = document.querySelector('.saveStyle');
 
 body.on('select', (e, value) => {
   valueSelect = value;
@@ -43,9 +41,6 @@ function getValueSelect(value) {
       case 'search':
         search = textarea.value;
         break;
-      case 'chips':
-        chips = textarea.value;
-        break;
 
       default:
         break;
@@ -69,6 +64,8 @@ renderBtn.addEventListener('click', () => {
       'Ferari',
     ],
     searchMode: true,
+    multiselect: true,
+    multiselectTag: true,
   });
 
   const drop = document.querySelector('.select');