Merge https://github.com/apuc/cg-select

CHANGELOG.md

@@ -1,22 +1,27 @@
 # CG-SELECT
 
-### 16.12.2022 - релиз версии 0.1.0!
+### 16.12.2022 - release version 0.1.0!
 
-### 20.12.2022 - обновление 0.1.12.
+### 20.12.2022 - update 0.1.12.
 
-Проведены тесты в JS и React. Выявленны ошибки в работе в Реакт приложениях.
+Tested in JS and React. Errors in work in React applications are revealed.
 
-- Изменена файловая структура приложения.
+- Changed the file structure of the application.
 
-### 22.12.2022 - обновление 0.1.14.
+### 22.12.2022 - update 0.1.14.
 
-- Изменеия в расположении файлов scss.
-- Исправлено влияние стилей селекта на JS приложение.
+- Changes in the location of the scss files.
+- Fixed influence of select styles on JS application.
 
-### 29.12.2022 - обновление 0.1.17
+### 29.12.2022 - update 0.1.17
 
-- Добавленна возможность менять отображения селекта на телефонах (нативный/cg-select).
-- Добавленна возможность менять отображения листа с выбором (обычный/модальное окно).
-- Исправленны выявленные баги.
-- Исправленно отображение страницы с примером на мобильных устройствах.
-- Обновленна документация!
+- Added ability to change select display on phones (native/cg-select).
+- Added the ability to change the display of the sheet with a choice (normal / modal window).
+- Fixed identified bugs.
+- Fixed display of the example page on mobile devices.
+- Updated documentation!
+
+### 00.00.2023 - update 0.2.1
+
+- All select rewritten to ts.
+- Fixed bugs and shortcomings.

README.md

@@ -1,18 +1,18 @@
 # CG-SELECT
 
-## version ~ 0.1.171
+## version ~ 0.2.1
 
-Этот компонент позволяет создать кастомный селект. Он предлагает более гибкую настройку и использование селекта.
-Доступна кастомизация, мультивыбор и живой поиск по елементам.
+This component allows you to create a custom select. It offers more flexible customization and use of select.
+Customization, multi-selection and live search by elements are available.
 
-### Доступна возможность кастомизации основных элементов, таких как:
+### The ability to customize basic elements, such as:
 
-- Кнопка селекта.
-- Список c элементами селекта.
+- Select button.
+- List with select elements.
 - Placeholder.
-- При режиме мультиселект доступна кастомизация chips(выбранных эл-ов).
-- Label элемента(если он был указан)
-- Переключение тем с темной на светлую
+- In the multiselect mode, customization of chips (selected elements) is available.
+- Label of the element (if it was specified).
+- Switch themes from dark to light.
 
 ## Installation
 
@@ -22,33 +22,32 @@ npm i cg-select
 
 ## Usage
 
-### Для создания компонета нужно:
+### To create a component, you need:
 
-1. Создать обычный button елемент.
-2. Присвоить ему класс cg-dropdown.
+1. Create a regular button element.
+2. Give it the cg-dropdown class.
 
 ```
 <button class="cg-dropdown"></button>
 ```
 
-3. Присвоить ему **уникальный класс**, например(cg-dropdown_categories)
+3. Give it a **unique class**, e.g. (cg-dropdown_categories).
 
 ```
 <button class="cg-dropdown cg-dropdown_categories"></button>
 ```
 
-4. Создать новый экземпляр класса(new DropDown)
-5. Передать все желаемые настройки как объект
+4. Create a new instance of the class (new CGSelect)
+5. Pass all desired settings as an object
 
-#### Все опции для создания и управления находятся в документации, раздел "Конструктор класса DropDown".
+#### All options for creating and managing are in the documentation, section "CGSelect class constructor".
 
-### Пример создния обычного селекта
+### An example of creating a regular select.
 
 ```javascript
-import { DropDown } from 'cg-select/src/cg-select';
-import 'cg-select/src/main.scss';
+import { CGSelect } from 'cg-select';
 
-const dropdown = new DropDown({
+const dropdown = new CGSelect({
   selector: '.cg-dropdown_selector',
   placeholder: 'Выберите авто',
   items: [
@@ -65,18 +64,18 @@ const dropdown = new DropDown({
 });
 ```
 
-## Пример разных селектов
+## Example of different selects
 
-Так же рабочий пример -- https://cg-select.itguild.info/
+Same working example -- https://cg-select.itguild.info/
 
 ![image](https://github.com/apuc/cg-select/blob/main/src/images/DefaultSelect.png)
 ![image](https://github.com/apuc/cg-select/blob/main/src/images/MultiSelect.png)
 ![image](https://github.com/apuc/cg-select/blob/main/src/images/WhiteTheme.png)
 ![image](https://github.com/apuc/cg-select/blob/main/src/images/Categories.png)
 
-Вся документация по CG-SELECT находится в одноименной папке. В документации описаны все методы и переменные, также есть примеры передачи настроек в select. Так же её можно открыть на странице с примером, или перейти по ссылке ниже.
+All documentation on CG-SELECT is located in the folder of the same name. The documentation describes all methods and variables, there are also examples of passing settings to select. You can also open it on the page with an example, or follow the link below.
 
-**Чтобы ознакомиться с ней, перейдите по ссылке -** https://cg-select.itguild.info/up_/documentation/index.html
+**To view it, follow the link -** https://cg-select.itguild.info/up_/documentation/index.html
 
 ## Contributing
 
@@ -88,11 +87,12 @@ const dropdown = new DropDown({
 
 ## Compatibility
 
-| Совместимость с приложениями |                                    JS                                    |                                                                      React                                                                       |                                 Angular                                 |                                   Vue                                   |
-| ---------------------------- | :----------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------: | :---------------------------------------------------------------------: |
-| CG-SELECT                    | ![image](https://github.com/apuc/cg-select/blob/main/src/images/yes.png) | ![image](https://github.com/apuc/cg-select/blob/main/src/images/yes.png) ![image](https://github.com/apuc/cg-select/blob/main/src/images/no.png) | ![image](https://github.com/apuc/cg-select/blob/main/src/images/no.png) | ![image](https://github.com/apuc/cg-select/blob/main/src/images/no.png) |
-| Комментарий                  |            Протестирован в Js приложениях и работает успешно.            |                                                 Работает только с костылем в виде `setTimeout()`                                                 |                             пока недоступно                             |                           тесты не проведены                            |
+| Application Compatibility |                                    JS                                    |                                                                      React                                                                       |                                 Angular                                 |                                   Vue                                   |
+| ------------------------- | :----------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------: | :---------------------------------------------------------------------: |
+| CG-SELECT                 | ![image](https://github.com/apuc/cg-select/blob/main/src/images/yes.png) | ![image](https://github.com/apuc/cg-select/blob/main/src/images/yes.png) ![image](https://github.com/apuc/cg-select/blob/main/src/images/no.png) | ![image](https://github.com/apuc/cg-select/blob/main/src/images/no.png) | ![image](https://github.com/apuc/cg-select/blob/main/src/images/no.png) |
+| Comment                   |              Tested in Js applications and it worksуспешно.              |                                               Works only with a crutch in the form `setTimeout()`                                                |                            not yet available                            |                            not yet available                            |
 
 ## History
 
-16.12.2022 - релиз версии 0.1.0!
+16.12.2022 - release version 0.1.0!
+00.00.2023 - upgrade to version 0.2.1

docs/.nojekyll

@@ -0,0 +1 @@
+TypeDoc added this file to prevent GitHub Pages from using Jekyll. You can turn off this behavior by setting the `githubPages` option to false.

docs/assets/highlight.css

@@ -0,0 +1,92 @@
+:root {
+    --light-hl-0: #001080;
+    --dark-hl-0: #9CDCFE;
+    --light-hl-1: #000000;
+    --dark-hl-1: #D4D4D4;
+    --light-hl-2: #A31515;
+    --dark-hl-2: #CE9178;
+    --light-hl-3: #267F99;
+    --dark-hl-3: #4EC9B0;
+    --light-hl-4: #AF00DB;
+    --dark-hl-4: #C586C0;
+    --light-hl-5: #0000FF;
+    --dark-hl-5: #569CD6;
+    --light-hl-6: #0070C1;
+    --dark-hl-6: #4FC1FF;
+    --light-hl-7: #795E26;
+    --dark-hl-7: #DCDCAA;
+    --light-hl-8: #098658;
+    --dark-hl-8: #B5CEA8;
+    --light-hl-9: #000000;
+    --dark-hl-9: #C8C8C8;
+    --light-code-background: #FFFFFF;
+    --dark-code-background: #1E1E1E;
+}
+
+@media (prefers-color-scheme: light) { :root {
+    --hl-0: var(--light-hl-0);
+    --hl-1: var(--light-hl-1);
+    --hl-2: var(--light-hl-2);
+    --hl-3: var(--light-hl-3);
+    --hl-4: var(--light-hl-4);
+    --hl-5: var(--light-hl-5);
+    --hl-6: var(--light-hl-6);
+    --hl-7: var(--light-hl-7);
+    --hl-8: var(--light-hl-8);
+    --hl-9: var(--light-hl-9);
+    --code-background: var(--light-code-background);
+} }
+
+@media (prefers-color-scheme: dark) { :root {
+    --hl-0: var(--dark-hl-0);
+    --hl-1: var(--dark-hl-1);
+    --hl-2: var(--dark-hl-2);
+    --hl-3: var(--dark-hl-3);
+    --hl-4: var(--dark-hl-4);
+    --hl-5: var(--dark-hl-5);
+    --hl-6: var(--dark-hl-6);
+    --hl-7: var(--dark-hl-7);
+    --hl-8: var(--dark-hl-8);
+    --hl-9: var(--dark-hl-9);
+    --code-background: var(--dark-code-background);
+} }
+
+:root[data-theme='light'] {
+    --hl-0: var(--light-hl-0);
+    --hl-1: var(--light-hl-1);
+    --hl-2: var(--light-hl-2);
+    --hl-3: var(--light-hl-3);
+    --hl-4: var(--light-hl-4);
+    --hl-5: var(--light-hl-5);
+    --hl-6: var(--light-hl-6);
+    --hl-7: var(--light-hl-7);
+    --hl-8: var(--light-hl-8);
+    --hl-9: var(--light-hl-9);
+    --code-background: var(--light-code-background);
+}
+
+:root[data-theme='dark'] {
+    --hl-0: var(--dark-hl-0);
+    --hl-1: var(--dark-hl-1);
+    --hl-2: var(--dark-hl-2);
+    --hl-3: var(--dark-hl-3);
+    --hl-4: var(--dark-hl-4);
+    --hl-5: var(--dark-hl-5);
+    --hl-6: var(--dark-hl-6);
+    --hl-7: var(--dark-hl-7);
+    --hl-8: var(--dark-hl-8);
+    --hl-9: var(--dark-hl-9);
+    --code-background: var(--dark-code-background);
+}
+
+.hl-0 { color: var(--hl-0); }
+.hl-1 { color: var(--hl-1); }
+.hl-2 { color: var(--hl-2); }
+.hl-3 { color: var(--hl-3); }
+.hl-4 { color: var(--hl-4); }
+.hl-5 { color: var(--hl-5); }
+.hl-6 { color: var(--hl-6); }
+.hl-7 { color: var(--hl-7); }
+.hl-8 { color: var(--hl-8); }
+.hl-9 { color: var(--hl-9); }
+pre, code { background: var(--code-background); }

docs/classes/cg_select.CGSelect.html

@@ -0,0 +1,820 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>CGSelect | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/cg_select.html">cg-select</a></li>
+<li><a href="cg_select.CGSelect.html">CGSelect</a></li></ul>
+<h1>Class CGSelect</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>This class implements the functionality of a custom select, with customization capabilities.</p>
+
+<h3>Author</h3><p>Ovsyanikov Maxim</p>
+</div></section>
+<section class="tsd-panel tsd-hierarchy">
+<h4>Hierarchy</h4>
+<ul class="tsd-hierarchy">
+<li><span class="target">CGSelect</span></li></ul></section>
+<section class="tsd-panel">
+<h4>Implements</h4>
+<ul class="tsd-hierarchy">
+<li><a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html" class="tsd-signature-type" data-tsd-kind="Interface">ICgSelect</a></li></ul></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L33">cg-select.ts:33</a></li></ul></aside>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary">
+<h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex=0><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M1.5 5.50969L8 11.6609L14.5 5.50969L12.5466 3.66086L8 7.96494L3.45341 3.66086L1.5 5.50969Z" fill="var(--color-text)"></path></svg> Index</h5></summary>
+<div class="tsd-accordion-details">
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Constructors</h3>
+<div class="tsd-index-list"><a href="cg_select.CGSelect.html#constructor" class="tsd-index-link tsd-kind-constructor tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#4D7FFF" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-512-path"></rect><path d="M11.898 16.1201C11.098 16.1201 10.466 15.8961 10.002 15.4481C9.53803 15.0001 9.30603 14.3841 9.30603 13.6001V9.64012C9.30603 8.85612 9.53803 8.24012 10.002 7.79212C10.466 7.34412 11.098 7.12012 11.898 7.12012C12.682 7.12012 13.306 7.34812 13.77 7.80412C14.234 8.25212 14.466 8.86412 14.466 9.64012H13.386C13.386 9.14412 13.254 8.76412 12.99 8.50012C12.734 8.22812 12.37 8.09212 11.898 8.09212C11.426 8.09212 11.054 8.22412 10.782 8.48812C10.518 8.75212 10.386 9.13212 10.386 9.62812V13.6001C10.386 14.0961 10.518 14.4801 10.782 14.7521C11.054 15.0161 11.426 15.1481 11.898 15.1481C12.37 15.1481 12.734 15.0161 12.99 14.7521C13.254 14.4801 13.386 14.0961 13.386 13.6001H14.466C14.466 14.3761 14.234 14.9921 13.77 15.4481C13.306 15.8961 12.682 16.1201 11.898 16.1201Z" fill="var(--color-text)" id="icon-512-text"></path></svg><span>constructor</span></a>
+</div></section>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Properties</h3>
+<div class="tsd-index-list"><a href="cg_select.CGSelect.html#btnCntr" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF984D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-1024-path"></rect><path d="M9.354 16V7.24H12.174C12.99 7.24 13.638 7.476 14.118 7.948C14.606 8.412 14.85 9.036 14.85 9.82C14.85 10.604 14.606 11.232 14.118 11.704C13.638 12.168 12.99 12.4 12.174 12.4H10.434V16H9.354ZM10.434 11.428H12.174C12.646 11.428 13.022 11.284 13.302 10.996C13.59 10.7 13.734 10.308 13.734 9.82C13.734 9.324 13.59 8.932 13.302 8.644C13.022 8.356 12.646 8.212 12.174 8.212H10.434V11.428Z" fill="var(--color-text)" id="icon-1024-text"></path></svg><span>btn<wbr/>Cntr?</span></a>
+<a href="cg_select.CGSelect.html#caret" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>caret</span></a>
+<a href="cg_select.CGSelect.html#category" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>category?</span></a>
+<a href="cg_select.CGSelect.html#closeOnSelect" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>close<wbr/>On<wbr/>Select?</span></a>
+<a href="cg_select.CGSelect.html#darkTheme" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>dark<wbr/>Theme?</span></a>
+<a href="cg_select.CGSelect.html#element" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>element</span></a>
+<a href="cg_select.CGSelect.html#event" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>event?</span></a>
+<a href="cg_select.CGSelect.html#indexes" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>indexes</span></a>
+<a href="cg_select.CGSelect.html#items" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>items?</span></a>
+<a href="cg_select.CGSelect.html#lable" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>lable?</span></a>
+<a href="cg_select.CGSelect.html#language" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>language?</span></a>
+<a href="cg_select.CGSelect.html#list" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>list</span></a>
+<a href="cg_select.CGSelect.html#listDisplayMode" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>list<wbr/>Display<wbr/>Mode?</span></a>
+<a href="cg_select.CGSelect.html#multiselect" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>multiselect?</span></a>
+<a href="cg_select.CGSelect.html#multiselectTag" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>multiselect<wbr/>Tag?</span></a>
+<a href="cg_select.CGSelect.html#nativeSelectMode" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>native<wbr/>Select<wbr/>Mode?</span></a>
+<a href="cg_select.CGSelect.html#options" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>options</span></a>
+<a href="cg_select.CGSelect.html#placeholder" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>placeholder?</span></a>
+<a href="cg_select.CGSelect.html#randomId" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>random<wbr/>Id</span></a>
+<a href="cg_select.CGSelect.html#searchMode" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>search<wbr/>Mode?</span></a>
+<a href="cg_select.CGSelect.html#selected" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>selected?</span></a>
+<a href="cg_select.CGSelect.html#selectedItems" class="tsd-index-link tsd-kind-property tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>selected<wbr/>Items</span></a>
+<a href="cg_select.CGSelect.html#selector" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>selector?</span></a>
+<a href="cg_select.CGSelect.html#styles" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>styles?</span></a>
+<a href="cg_select.CGSelect.html#url" class="tsd-index-link tsd-kind-property tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>url?</span></a>
+</div></section>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Accessors</h3>
+<div class="tsd-index-list"><a href="cg_select.CGSelect.html#indexesOf" class="tsd-index-link tsd-kind-accessor tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF4D4D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-262144-path"></rect><path d="M8.85 16L11.13 7.24H12.582L14.85 16H13.758L13.182 13.672H10.53L9.954 16H8.85ZM10.746 12.76H12.954L12.282 10.06C12.154 9.548 12.054 9.12 11.982 8.776C11.91 8.432 11.866 8.208 11.85 8.104C11.834 8.208 11.79 8.432 11.718 8.776C11.646 9.12 11.546 9.544 11.418 10.048L10.746 12.76Z" fill="var(--color-text)" id="icon-262144-text"></path></svg><span>indexes<wbr/>Of</span></a>
+<a href="cg_select.CGSelect.html#value" class="tsd-index-link tsd-kind-accessor tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-262144-path"></use><use href="#icon-262144-text"></use></svg><span>value</span></a>
+</div></section>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Methods</h3>
+<div class="tsd-index-list"><a href="cg_select.CGSelect.html#addItem" class="tsd-index-link tsd-kind-method tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF4DB8" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-2048-path"></rect><path d="M9.162 16V7.24H10.578L11.514 10.072C11.602 10.328 11.674 10.584 11.73 10.84C11.794 11.088 11.842 11.28 11.874 11.416C11.906 11.28 11.954 11.088 12.018 10.84C12.082 10.584 12.154 10.324 12.234 10.06L13.122 7.24H14.538V16H13.482V12.82C13.482 12.468 13.49 12.068 13.506 11.62C13.53 11.172 13.558 10.716 13.59 10.252C13.622 9.78 13.654 9.332 13.686 8.908C13.726 8.476 13.762 8.1 13.794 7.78L12.366 12.16H11.334L9.894 7.78C9.934 8.092 9.97 8.456 10.002 8.872C10.042 9.28 10.078 9.716 10.11 10.18C10.142 10.636 10.166 11.092 10.182 11.548C10.206 12.004 10.218 12.428 10.218 12.82V16H9.162Z" fill="var(--color-text)" id="icon-2048-text"></path></svg><span>add<wbr/>Item</span></a>
+<a href="cg_select.CGSelect.html#addLanguage" class="tsd-index-link tsd-kind-method tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>add<wbr/>Language</span></a>
+<a href="cg_select.CGSelect.html#addOptionsBehaviour" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>add<wbr/>Options<wbr/>Behaviour</span></a>
+<a href="cg_select.CGSelect.html#buttonControl" class="tsd-index-link tsd-kind-method tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>button<wbr/>Control</span></a>
+<a href="cg_select.CGSelect.html#checkTheme" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>check<wbr/>Theme</span></a>
+<a href="cg_select.CGSelect.html#close" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>close</span></a>
+<a href="cg_select.CGSelect.html#closeSelectClick" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>close<wbr/>Select<wbr/>Click</span></a>
+<a href="cg_select.CGSelect.html#deleteItem" class="tsd-index-link tsd-kind-method tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>delete<wbr/>Item</span></a>
+<a href="cg_select.CGSelect.html#deleteItemAll" class="tsd-index-link tsd-kind-method tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>delete<wbr/>Item<wbr/>All</span></a>
+<a href="cg_select.CGSelect.html#disabled" class="tsd-index-link tsd-kind-method tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>disabled</span></a>
+<a href="cg_select.CGSelect.html#displayMode" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>display<wbr/>Mode</span></a>
+<a href="cg_select.CGSelect.html#getElement" class="tsd-index-link tsd-kind-method tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>get<wbr/>Element</span></a>
+<a href="cg_select.CGSelect.html#init" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>init</span></a>
+<a href="cg_select.CGSelect.html#initEvent" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>init<wbr/>Event</span></a>
+<a href="cg_select.CGSelect.html#initSelected" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>init<wbr/>Selected</span></a>
+<a href="cg_select.CGSelect.html#open" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>open</span></a>
+<a href="cg_select.CGSelect.html#render" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>render</span></a>
+<a href="cg_select.CGSelect.html#renderUrl" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>render<wbr/>Url</span></a>
+<a href="cg_select.CGSelect.html#searchModeSelect" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>search<wbr/>Mode<wbr/>Select</span></a>
+<a href="cg_select.CGSelect.html#selectIndex" class="tsd-index-link tsd-kind-method tsd-parent-kind-class"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>select<wbr/>Index</span></a>
+<a href="cg_select.CGSelect.html#selectMode" class="tsd-index-link tsd-kind-method tsd-parent-kind-class tsd-is-private"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg><span>select<wbr/>Mode</span></a>
+</div></section></div></details></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Constructors</h2>
+<section class="tsd-panel tsd-member tsd-kind-constructor tsd-parent-kind-class"><a id="constructor" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>constructor</span><a href="#constructor" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-constructor tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="constructor.new_CGSelect">new CGSelect<span class="tsd-signature-symbol">(</span>setting<span class="tsd-signature-symbol">: </span><a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html" class="tsd-signature-type" data-tsd-kind="Interface">ICgSelect</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="cg_select.CGSelect.html" class="tsd-signature-type" data-tsd-kind="Class">CGSelect</a><a href="#constructor.new_CGSelect" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>The constructor takes an object and renders the select.</p>
+
+<h3>Example</h3><pre><code class="language-ts"><span class="hl-0">options</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-0">selector:</span><span class="hl-1"> </span><span class="hl-2">&#39;Unique selector&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">selected:</span><span class="hl-1"> </span><span class="hl-2">&#39;Selected item&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">placeholder:</span><span class="hl-1"> </span><span class="hl-2">&#39;...&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">lable:</span><span class="hl-1"> </span><span class="hl-2">&#39;...&#39;</span><br/><span class="hl-1">   </span><span class="hl-0">items</span><span class="hl-1">: [</span><span class="hl-0">string</span><span class="hl-1">|</span><span class="hl-0">number</span><span class="hl-1">|</span><span class="hl-0">object</span><span class="hl-1">],</span><br/><span class="hl-1">   </span><span class="hl-0">darkTheme:</span><span class="hl-1"> </span><span class="hl-5">true</span><span class="hl-1">/</span><span class="hl-5">false</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">searchMode:</span><span class="hl-1"> </span><span class="hl-5">true</span><span class="hl-1">/</span><span class="hl-5">false</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">closeOnSelect:</span><span class="hl-1">  </span><span class="hl-5">true</span><span class="hl-1">/</span><span class="hl-5">false</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">nativeSelectMode:</span><span class="hl-1"> </span><span class="hl-5">true</span><span class="hl-1">/</span><span class="hl-5">false</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">listDisplayMode:</span><span class="hl-1"> </span><span class="hl-5">true</span><span class="hl-1">/</span><span class="hl-5">false</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">language:</span><span class="hl-1"> </span><span class="hl-2">&#39;ru/en&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">styles:</span><span class="hl-1"> {</span><br/><span class="hl-1">     </span><span class="hl-0">head:</span><span class="hl-1"> {</span><br/><span class="hl-1">       </span><span class="hl-0">background:</span><span class="hl-1"> </span><span class="hl-2">&#39;...&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">     },</span><br/><span class="hl-1">     </span><span class="hl-0">list:</span><span class="hl-1"> {...},</span><br/><span class="hl-1">     </span><span class="hl-0">chips:</span><span class="hl-1"> {...},</span><br/><span class="hl-1">     </span><span class="hl-0">caret:</span><span class="hl-1"> {...},</span><br/><span class="hl-1">     </span><span class="hl-0">placeholder:</span><span class="hl-1"> {...},</span><br/><span class="hl-1">     </span><span class="hl-0">lable:</span><span class="hl-1"> {..},</span><br/><span class="hl-1">   },</span><br/><span class="hl-1">   </span><span class="hl-0">event:</span><span class="hl-1"> </span><span class="hl-2">&#39;...&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">url:</span><span class="hl-1"> </span><span class="hl-2">&#39;http/...&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">multiselect:</span><span class="hl-1"> </span><span class="hl-5">true</span><span class="hl-1">/</span><span class="hl-5">false</span><span class="hl-1">,</span><br/><span class="hl-1">   </span><span class="hl-0">multiselectTag:</span><span class="hl-1"> </span><span class="hl-5">true</span><span class="hl-1">/</span><span class="hl-5">false</span><span class="hl-1">,</span><br/><span class="hl-1">}</span>
+</code></pre>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>setting: <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html" class="tsd-signature-type" data-tsd-kind="Interface">ICgSelect</a></h5>
+<div class="tsd-comment tsd-typography"><p>Object accepting select settings.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <a href="cg_select.CGSelect.html" class="tsd-signature-type" data-tsd-kind="Class">CGSelect</a></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L131">cg-select.ts:131</a></li></ul></aside></li></ul></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Properties</h2>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="btnCntr" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <code class="tsd-tag ts-flagOptional">Optional</code> <span>btn<wbr/>Cntr</span><a href="#btnCntr" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">btn<wbr/>Cntr<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Element</span></div>
+<div class="tsd-comment tsd-typography"><p>Button, to control the select.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L96">cg-select.ts:96</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="caret" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>caret</span><a href="#caret" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">caret<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Element</span></div>
+<div class="tsd-comment tsd-typography"><p>Variable for carriage control.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L76">cg-select.ts:76</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="category" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <code class="tsd-tag ts-flagOptional">Optional</code> <span>category</span><a href="#category" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">category<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Transferred categories.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L81">cg-select.ts:81</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="closeOnSelect" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>close<wbr/>On<wbr/>Select</span><a href="#closeOnSelect" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">close<wbr/>On<wbr/>Select<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select when opening, if closeOnSelect: false,
+then when an element is selected in the selector, closing does not occur,
+and you can select another element by default, closeOnSelect:true.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#closeOnSelect">closeOnSelect</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L41">cg-select.ts:41</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="darkTheme" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>dark<wbr/>Theme</span><a href="#darkTheme" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">dark<wbr/>Theme<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for enabling a light / dark theme by default, the dark theme is set (darkTheme == true).</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#darkTheme">darkTheme</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L39">cg-select.ts:39</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="element" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>element</span><a href="#element" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">element<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Element</span></div>
+<div class="tsd-comment tsd-typography"><p>Created HTML element.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L56">cg-select.ts:56</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="event" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>event</span><a href="#event" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">event<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select, passing to this parameter an event of the &#39;mouseenter&#39; type,
+select will open on hover.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#event">event</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L47">cg-select.ts:47</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="indexes" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>indexes</span><a href="#indexes" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">indexes<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol"> = []</span></div>
+<div class="tsd-comment tsd-typography"><p>Array of indexes of selected elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L91">cg-select.ts:91</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="items" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>items</span><a href="#items" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">items<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">any</span></div>
+<div class="tsd-comment tsd-typography"><p>*Required parameter (if no other way to get data (url) is specified), this is an array of elements,
+ which will be displayed in the select when selected.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#items">items</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L38">cg-select.ts:38</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="lable" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>lable</span><a href="#lable" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">lable<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that adds a lable before the select.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#lable">lable</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L45">cg-select.ts:45</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="language" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>language</span><a href="#language" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">language<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Optional parameter responsible for the localization of some text elements.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#language">language</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L44">cg-select.ts:44</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="list" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>list</span><a href="#list" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">list<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Element</span></div>
+<div class="tsd-comment tsd-typography"><p>Created list(ul), with class list.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L61">cg-select.ts:61</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="listDisplayMode" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>list<wbr/>Display<wbr/>Mode</span><a href="#listDisplayMode" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">list<wbr/>Display<wbr/>Mode<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select when opening.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#listDisplayMode">listDisplayMode</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L43">cg-select.ts:43</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="multiselect" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>multiselect</span><a href="#multiselect" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">multiselect<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter, which is responsible for the behavior of the select, adds the ability to select multiple elements.
+Selected elements are rendered as plain text, separated by commas.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#multiselect">multiselect</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L49">cg-select.ts:49</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="multiselectTag" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>multiselect<wbr/>Tag</span><a href="#multiselectTag" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">multiselect<wbr/>Tag<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select,
+for him, *** works only in a place with a multiselect connection.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#multiselectTag">multiselectTag</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L50">cg-select.ts:50</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="nativeSelectMode" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>native<wbr/>Select<wbr/>Mode</span><a href="#nativeSelectMode" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">native<wbr/>Select<wbr/>Mode<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select when opened on mobile devices.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#nativeSelectMode">nativeSelectMode</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L42">cg-select.ts:42</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="options" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>options</span><a href="#options" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">options<span class="tsd-signature-symbol">:</span> <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html" class="tsd-signature-type" data-tsd-kind="Interface">ICgSelect</a></div>
+<div class="tsd-comment tsd-typography"><p>Select settings passed when creating an instance of the class.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L66">cg-select.ts:66</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="placeholder" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>placeholder</span><a href="#placeholder" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">placeholder<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Placeholder optional parameter to which the text of the select placeholder is passed.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#placeholder">placeholder</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L37">cg-select.ts:37</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="randomId" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>random<wbr/>Id</span><a href="#randomId" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">random<wbr/>Id<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Unique Id for elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L71">cg-select.ts:71</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="searchMode" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>search<wbr/>Mode</span><a href="#searchMode" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">search<wbr/>Mode<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that adds a live search on the select elements.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#searchMode">searchMode</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L40">cg-select.ts:40</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="selected" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>selected</span><a href="#selected" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">selected<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter, which is passed the element that will be selected initially in the select.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#selected">selected</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L36">cg-select.ts:36</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class tsd-is-private"><a id="selectedItems" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>selected<wbr/>Items</span><a href="#selectedItems" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">selected<wbr/>Items<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">[]</span></div>
+<div class="tsd-comment tsd-typography"><p>Selected or an array of selected items from a list.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L86">cg-select.ts:86</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="selector" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>selector</span><a href="#selector" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">selector<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Unique selector - *mandatory parameter (indicator) that is set when creating a select.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#selector">selector</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L35">cg-select.ts:35</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="styles" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>styles</span><a href="#styles" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">styles<span class="tsd-signature-symbol">?:</span> <a href="../interfaces/interfaces_cg_select_interface.IStyle.html" class="tsd-signature-type" data-tsd-kind="Interface">IStyle</a></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for customizing the select elements,
+objects with CSS properties for customizable elements are passed to it.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#styles">styles</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L46">cg-select.ts:46</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"><a id="url" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>url</span><a href="#url" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">url<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Required parameter (if no other way to get data (items) is specified),
+data that comes from the backend in the format { id: &quot;&quot;, title: &quot;&quot;, value: &quot;&quot;}.</p>
+</div><aside class="tsd-sources">
+<p>Implementation of <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a>.<a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html#url">url</a></p>
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L48">cg-select.ts:48</a></li></ul></aside></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Accessors</h2>
+<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="indexesOf" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>indexes<wbr/>Of</span><a href="#indexesOf" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-accessor tsd-parent-kind-class">
+<li class="tsd-signature" id="indexesOf.indexesOf-1"><span class="tsd-signature-symbol">get</span> indexesOf<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Returns</h3><p>Returns the indices of the selected element(s) as an array / empty array.</p>
+
+<h3>Description</h3><p>A getter that returns the indexes of the selected element(s) of the select.</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">number</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L151">cg-select.ts:151</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-accessor tsd-parent-kind-class"><a id="value" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>value</span><a href="#value" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-accessor tsd-parent-kind-class">
+<li class="tsd-signature" id="value.value-1"><span class="tsd-signature-symbol">get</span> value<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">[]</span></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Returns</h3><p>Returns the selected element(s) as an array / element / null.</p>
+
+<h3>Description</h3><p>Getter returning the selected element(s) of the select.</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">[]</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L143">cg-select.ts:143</a></li></ul></aside></li></ul></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Methods</h2>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class"><a id="addItem" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>add<wbr/>Item</span><a href="#addItem" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="addItem.addItem-1">add<wbr/>Item<span class="tsd-signature-symbol">(</span>item<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol"> | </span><a href="../interfaces/interfaces_items_interface.IItems.html" class="tsd-signature-type" data-tsd-kind="Interface">IItems</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">false</span><a href="#addItem.addItem-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>adds the given element to the end of the list and redraws the list. Cannot be used when passing elements with categories.</p>
+
+<h3>Method</h3><p>addItem</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>item: <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol"> | </span><a href="../interfaces/interfaces_items_interface.IItems.html" class="tsd-signature-type" data-tsd-kind="Interface">IItems</a></h5>
+<div class="tsd-comment tsd-typography"><p>added element.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">false</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L881">cg-select.ts:881</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class"><a id="addLanguage" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>add<wbr/>Language</span><a href="#addLanguage" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="addLanguage.addLanguage-1">add<wbr/>Language<span class="tsd-signature-symbol">(</span>language<span class="tsd-signature-symbol">: </span><a href="../interfaces/interfaces_language_interface.ILanguage.html" class="tsd-signature-type" data-tsd-kind="Interface">ILanguage</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#addLanguage.addLanguage-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>a method that allows you to change the placeholder in the search and the text that is displayed if there is no result.</p>
+
+<h3>Method</h3><p>addLanguage</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>language: <a href="../interfaces/interfaces_language_interface.ILanguage.html" class="tsd-signature-type" data-tsd-kind="Interface">ILanguage</a></h5>
+<div class="tsd-comment tsd-typography"><p>the object in which the fields for connecting the language are located has two mandatory fields placeholder, textInListSearch, selectPlaceholder.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L813">cg-select.ts:813</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="addOptionsBehaviour" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>add<wbr/>Options<wbr/>Behaviour</span><a href="#addOptionsBehaviour" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="addOptionsBehaviour.addOptionsBehaviour-1">add<wbr/>Options<wbr/>Behaviour<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#addOptionsBehaviour.addOptionsBehaviour-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>A method that implements the selection of elements in different modes.</p>
+
+<h3>Method</h3><p>addOptionsBehaviour</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L536">cg-select.ts:536</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class"><a id="buttonControl" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>button<wbr/>Control</span><a href="#buttonControl" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="buttonControl.buttonControl-1">button<wbr/>Control<span class="tsd-signature-symbol">(</span>button<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Element</span>, method<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#buttonControl.buttonControl-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>A method that allows you to open / close the select using buttons.</p>
+
+<h3>Method</h3><p>buttonControl</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>button: <span class="tsd-signature-type">Element</span></h5>
+<div class="tsd-comment tsd-typography"><p>HTML button.</p>
+</div></li>
+<li>
+<h5>method: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>open/close method.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L839">cg-select.ts:839</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="checkTheme" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>check<wbr/>Theme</span><a href="#checkTheme" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="checkTheme.checkTheme-1">check<wbr/>Theme<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#checkTheme.checkTheme-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Method</h3><p>checkTheme</p>
+
+<h3>Description</h3><p>Changes the color scheme from dark to light.</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L663">cg-select.ts:663</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="close" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>close</span><a href="#close" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="close.close-1">close<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#close.close-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Closes the list.</p>
+
+<h3>Method</h3><p>close</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L506">cg-select.ts:506</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="closeSelectClick" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>close<wbr/>Select<wbr/>Click</span><a href="#closeSelectClick" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="closeSelectClick.closeSelectClick-1">close<wbr/>Select<wbr/>Click<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#closeSelectClick.closeSelectClick-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Closes the list on click outside of an element.</p>
+
+<h3>Method</h3><p>closeSelectClick</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L516">cg-select.ts:516</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class"><a id="deleteItem" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>delete<wbr/>Item</span><a href="#deleteItem" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="deleteItem.deleteItem-1">delete<wbr/>Item<span class="tsd-signature-symbol">(</span>index<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#deleteItem.deleteItem-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>removes the element by index from the list and redraws it. Cannot be used when passing elements with categories.</p>
+
+<h3>Method</h3><p>deleteItem</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>index: <span class="tsd-signature-type">number</span></h5>
+<div class="tsd-comment tsd-typography"><p>the index of the element to be removed.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L902">cg-select.ts:902</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class"><a id="deleteItemAll" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>delete<wbr/>Item<wbr/>All</span><a href="#deleteItemAll" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="deleteItemAll.deleteItemAll-1">delete<wbr/>Item<wbr/>All<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#deleteItemAll.deleteItemAll-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>removes all elements from the list and redraws it.</p>
+
+<h3>Method</h3><p>deleteItemAll</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L918">cg-select.ts:918</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class"><a id="disabled" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>disabled</span><a href="#disabled" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="disabled.disabled-1">disabled<span class="tsd-signature-symbol">(</span>value<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#disabled.disabled-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>A method that allows you to toggle the state of the disabled select.</p>
+
+<h3>Method</h3><p>disabled</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>value: <span class="tsd-signature-type">boolean</span></h5>
+<div class="tsd-comment tsd-typography"><p>Passed parameter to add the disabled attribute.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L861">cg-select.ts:861</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="displayMode" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>display<wbr/>Mode</span><a href="#displayMode" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="displayMode.displayMode-1">display<wbr/>Mode<span class="tsd-signature-symbol">(</span>listDisplayMode<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#displayMode.displayMode-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Changes the display of a sheet with a selection as a modal window.</p>
+
+<h3>Method</h3><p>displayMode</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>listDisplayMode: <span class="tsd-signature-type">boolean</span></h5>
+<div class="tsd-comment tsd-typography"><p>parameter responsible for displaying the selection in the form of a modal window.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L774">cg-select.ts:774</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class"><a id="getElement" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>get<wbr/>Element</span><a href="#getElement" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="getElement.getElement-1">get<wbr/>Element<span class="tsd-signature-symbol">(</span>numberItem<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span><a href="#getElement.getElement-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Returns</h3><p>returns a reference to the selected HTML element.</p>
+
+<h3>Method</h3><p>getElement</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>numberItem: <span class="tsd-signature-type">number</span></h5>
+<div class="tsd-comment tsd-typography"><p>returned element number.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">any</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L800">cg-select.ts:800</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="init" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>init</span><a href="#init" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="init.init-1">init<span class="tsd-signature-symbol">(</span>setting<span class="tsd-signature-symbol">: </span><a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html" class="tsd-signature-type" data-tsd-kind="Interface">ICgSelect</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#init.init-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography"><p>Private method for initializing an instance of the ICgSelect class.</p>
+
+<h3>Method</h3><p>init</p>
+
+<h3>Member</h3>
+<h3>Description</h3><p>Private method. General initialization of the select. Obtaining tinctures and converting select elements.</p>
+
+<h3>Example</h3><pre><code class="language-ts"><span class="hl-1">{</span><br/><span class="hl-1">        </span><span class="hl-9">selector</span><span class="hl-1">: </span><span class="hl-2">&#39;.cg-dropdown_one&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-9">placeholder</span><span class="hl-1">: </span><span class="hl-2">&#39;Choose a car&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-9">items</span><span class="hl-1">: [</span><br/><span class="hl-1">          </span><span class="hl-2">&#39;BMW&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">          {</span><br/><span class="hl-1">            </span><span class="hl-0">id:</span><span class="hl-1"> </span><span class="hl-2">&#39;213sade&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">            </span><span class="hl-0">title:</span><span class="hl-1"> </span><span class="hl-2">&#39;Opel&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">            </span><span class="hl-0">value:</span><span class="hl-1"> </span><span class="hl-8">1</span><span class="hl-1">,</span><br/><span class="hl-1">          },</span><br/><span class="hl-1">          </span><span class="hl-2">&#39;Mersedes&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">          </span><span class="hl-2">&#39;MAN&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">          </span><span class="hl-2">&#39;max&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">        ],</span><br/><span class="hl-1">        </span><span class="hl-9">darkTheme</span><span class="hl-1">: </span><span class="hl-5">true</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-9">multiselect</span><span class="hl-1">: </span><span class="hl-5">true</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-9">multiselectTag</span><span class="hl-1">: </span><span class="hl-5">true</span><span class="hl-1">,</span><br/><span class="hl-1">      }</span>
+</code></pre>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>setting: <a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html" class="tsd-signature-type" data-tsd-kind="Interface">ICgSelect</a></h5>
+<div class="tsd-comment tsd-typography"><p>passed select settings.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L182">cg-select.ts:182</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="initEvent" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>init<wbr/>Event</span><a href="#initEvent" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="initEvent.initEvent-1">init<wbr/>Event<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#initEvent.initEvent-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Opens and closes the list by the passed event.</p>
+
+<h3>Method</h3><p>initEvent</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L468">cg-select.ts:468</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="initSelected" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>init<wbr/>Selected</span><a href="#initSelected" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="initSelected.initSelected-1">init<wbr/>Selected<span class="tsd-signature-symbol">(</span>select<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#initSelected.initSelected-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Method</h3><p>initSelected</p>
+
+<h3>Description</h3><p>Renders and styles the select.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5><code class="tsd-tag ts-flagOptional">Optional</code> select: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>optional element. Used in the selectedIndex method.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L441">cg-select.ts:441</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="open" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>open</span><a href="#open" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="open.open-1">open<span class="tsd-signature-symbol">(</span>oneClick<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#open.open-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Opens a list to select an element.</p>
+
+<h3>Method</h3><p>open</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5><code class="tsd-tag ts-flagOptional">Optional</code> oneClick: <span class="tsd-signature-type">boolean</span></h5>
+<div class="tsd-comment tsd-typography"><p>optional parameter passed from the buttonControl function.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L491">cg-select.ts:491</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="render" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>render</span><a href="#render" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="render.render-1">render<span class="tsd-signature-symbol">(</span>select<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#render.render-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Method</h3><p>render</p>
+
+<h3>Description</h3><p>Render elements in select.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5><code class="tsd-tag ts-flagOptional">Optional</code> select: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>optional element. Passed to the initSelected.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L271">cg-select.ts:271</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="renderUrl" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>render<wbr/>Url</span><a href="#renderUrl" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="renderUrl.renderUrl-1">render<wbr/>Url<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span><a href="#renderUrl.renderUrl-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Method</h3><p>renderUrl</p>
+
+<h3>Description</h3><p>Rendering elements in the select passed from the URL and setting them up.</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">&gt;</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L378">cg-select.ts:378</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="searchModeSelect" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>search<wbr/>Mode<wbr/>Select</span><a href="#searchModeSelect" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="searchModeSelect.searchModeSelect-1">search<wbr/>Mode<wbr/>Select<span class="tsd-signature-symbol">(</span>random<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#searchModeSelect.searchModeSelect-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>The method that implements the search for elements in the select.</p>
+
+<h3>Method</h3><p>searchMode</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>random: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>unique value for input element.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L719">cg-select.ts:719</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class"><a id="selectIndex" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>select<wbr/>Index</span><a href="#selectIndex" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class">
+<li class="tsd-signature tsd-anchor-link" id="selectIndex.selectIndex-1">select<wbr/>Index<span class="tsd-signature-symbol">(</span>index<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#selectIndex.selectIndex-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>selects the element that will be initially rendered in the select.</p>
+
+<h3>Method</h3><p>selectIndex</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>index: <span class="tsd-signature-type">number</span></h5>
+<div class="tsd-comment tsd-typography"><p>the index of the selected element.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L928">cg-select.ts:928</a></li></ul></aside></li></ul></section>
+<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-private"><a id="selectMode" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagPrivate">Private</code> <span>select<wbr/>Mode</span><a href="#selectMode" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-private">
+<li class="tsd-signature tsd-anchor-link" id="selectMode.selectMode-1">select<wbr/>Mode<span class="tsd-signature-symbol">(</span>nativeSelectMode<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#selectMode.selectMode-1" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></li>
+<li class="tsd-description"><code class="tsd-tag ts-flagPrivate">Private</code> 
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Changes the display of the select on mobile devices.</p>
+
+<h3>Method</h3><p>selectMode</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>nativeSelectMode: <span class="tsd-signature-type">boolean</span></h5>
+<div class="tsd-comment tsd-typography"><p>parameter responsible for adding native select.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L690">cg-select.ts:690</a></li></ul></aside></li></ul></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="current tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-class tsd-parent-kind-module"><a href="cg_select.CGSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-class)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-128-path"></rect><path d="M11.898 16.1201C11.098 16.1201 10.466 15.8961 10.002 15.4481C9.53803 15.0001 9.30603 14.3841 9.30603 13.6001V9.64012C9.30603 8.85612 9.53803 8.24012 10.002 7.79212C10.466 7.34412 11.098 7.12012 11.898 7.12012C12.682 7.12012 13.306 7.34812 13.77 7.80412C14.234 8.25212 14.466 8.86412 14.466 9.64012H13.386C13.386 9.14412 13.254 8.76412 12.99 8.50012C12.734 8.22812 12.37 8.09212 11.898 8.09212C11.426 8.09212 11.054 8.22412 10.782 8.48812C10.518 8.75212 10.386 9.13212 10.386 9.62812V13.6001C10.386 14.0961 10.518 14.4801 10.782 14.7521C11.054 15.0161 11.426 15.1481 11.898 15.1481C12.37 15.1481 12.734 15.0161 12.99 14.7521C13.254 14.4801 13.386 14.0961 13.386 13.6001H14.466C14.466 14.3761 14.234 14.9921 13.77 15.4481C13.306 15.8961 12.682 16.1201 11.898 16.1201Z" fill="var(--color-text)" id="icon-128-text"></path></svg><span>CGSelect</span></a>
+<ul>
+<li class="tsd-kind-constructor tsd-parent-kind-class"><a href="cg_select.CGSelect.html#constructor" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-512-path"></use><use href="#icon-512-text"></use></svg>constructor</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#btnCntr" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>btn<wbr/>Cntr?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#caret" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>caret</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#category" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>category?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#closeOnSelect" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>close<wbr/>On<wbr/>Select?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#darkTheme" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>dark<wbr/>Theme?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#element" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>element</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#event" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>event?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#indexes" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>indexes</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#items" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>items?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#lable" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>lable?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#language" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>language?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#list" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>list</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#listDisplayMode" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>list<wbr/>Display<wbr/>Mode?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#multiselect" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>multiselect?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#multiselectTag" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>multiselect<wbr/>Tag?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#nativeSelectMode" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>native<wbr/>Select<wbr/>Mode?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#options" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>options</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#placeholder" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>placeholder?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#randomId" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>random<wbr/>Id</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#searchMode" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>search<wbr/>Mode?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#selected" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>selected?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#selectedItems" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>selected<wbr/>Items</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#selector" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>selector?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#styles" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>styles?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-class"><a href="cg_select.CGSelect.html#url" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>url?</a></li>
+<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="cg_select.CGSelect.html#indexesOf" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-262144-path"></use><use href="#icon-262144-text"></use></svg>indexes<wbr/>Of</a></li>
+<li class="tsd-kind-accessor tsd-parent-kind-class"><a href="cg_select.CGSelect.html#value" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-262144-path"></use><use href="#icon-262144-text"></use></svg>value</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class"><a href="cg_select.CGSelect.html#addItem" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>add<wbr/>Item</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class"><a href="cg_select.CGSelect.html#addLanguage" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>add<wbr/>Language</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#addOptionsBehaviour" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>add<wbr/>Options<wbr/>Behaviour</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class"><a href="cg_select.CGSelect.html#buttonControl" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>button<wbr/>Control</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#checkTheme" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>check<wbr/>Theme</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#close" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>close</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#closeSelectClick" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>close<wbr/>Select<wbr/>Click</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class"><a href="cg_select.CGSelect.html#deleteItem" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>delete<wbr/>Item</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class"><a href="cg_select.CGSelect.html#deleteItemAll" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>delete<wbr/>Item<wbr/>All</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class"><a href="cg_select.CGSelect.html#disabled" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>disabled</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#displayMode" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>display<wbr/>Mode</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class"><a href="cg_select.CGSelect.html#getElement" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>get<wbr/>Element</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#init" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>init</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#initEvent" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>init<wbr/>Event</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#initSelected" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>init<wbr/>Selected</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#open" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>open</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#render" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>render</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#renderUrl" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>render<wbr/>Url</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#searchModeSelect" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>search<wbr/>Mode<wbr/>Select</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class"><a href="cg_select.CGSelect.html#selectIndex" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>select<wbr/>Index</a></li>
+<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><a href="cg_select.CGSelect.html#selectMode" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-2048-path"></use><use href="#icon-2048-text"></use></svg>select<wbr/>Mode</a></li></ul></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.checkItemStruct.html

@@ -0,0 +1,80 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>checkItemStruct | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.checkItemStruct.html">checkItemStruct</a></li></ul>
+<h1>Function checkItemStruct</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="checkItemStruct">check<wbr/>Item<wbr/>Struct<span class="tsd-signature-symbol">(</span>item<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">object</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><a href="#checkItemStruct" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>Checking if item contains the specified properties.</p>
+
+<h3>Returns</h3><p>returns true/false if item contains the specified properties.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>item: <span class="tsd-signature-type">object</span></h5>
+<div class="tsd-comment tsd-typography"><p>element to be checked against a certain structure.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">boolean</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L60">components/utils/utils.ts:60</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.clearSelect.html

@@ -0,0 +1,86 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>clearSelect | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.clearSelect.html">clearSelect</a></li></ul>
+<h1>Function clearSelect</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="clearSelect">clear<wbr/>Select<span class="tsd-signature-symbol">(</span>select<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span>, element<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Element</span>, dataSelectText<span class="tsd-signature-symbol">: </span><a href="../interfaces/components_utils_urils_interface.ISelectedItems.html" class="tsd-signature-type" data-tsd-kind="Interface">ISelectedItems</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#clearSelect" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>Creating a clear select button, with a single selection.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>select: <span class="tsd-signature-type">HTMLElement</span></h5>
+<div class="tsd-comment tsd-typography"><p>place in the select that will be reassigned to &#39;&#39;.</p>
+</div></li>
+<li>
+<h5>element: <span class="tsd-signature-type">Element</span></h5>
+<div class="tsd-comment tsd-typography"><p>class instance CgSelect.</p>
+</div></li>
+<li>
+<h5>dataSelectText: <a href="../interfaces/components_utils_urils_interface.ISelectedItems.html" class="tsd-signature-type" data-tsd-kind="Interface">ISelectedItems</a></h5>
+<div class="tsd-comment tsd-typography"><p>the text that is rendered in the select.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L105">components/utils/utils.ts:105</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.createSelected.html

@@ -0,0 +1,86 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>createSelected | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.createSelected.html">createSelected</a></li></ul>
+<h1>Function createSelected</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="createSelected">create<wbr/>Selected<span class="tsd-signature-symbol">(</span>element<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Element</span>, content<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">string</span>, styles<span class="tsd-signature-symbol">?: </span><a href="../interfaces/interfaces_cg_select_interface.IStyle.html" class="tsd-signature-type" data-tsd-kind="Interface">IStyle</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#createSelected" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>Creating an Item Selector Button.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>element: <span class="tsd-signature-type">Element</span></h5>
+<div class="tsd-comment tsd-typography"><p>instantiated class CgSelect.</p>
+</div></li>
+<li>
+<h5><code class="tsd-tag ts-flagOptional">Optional</code> content: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>placeholer passed from select settings.</p>
+</div></li>
+<li>
+<h5><code class="tsd-tag ts-flagOptional">Optional</code> styles: <a href="../interfaces/interfaces_cg_select_interface.IStyle.html" class="tsd-signature-type" data-tsd-kind="Interface">IStyle</a></h5>
+<div class="tsd-comment tsd-typography"><p>optional parameter. The object in which the settings for customizing parts of the select are located.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L74">components/utils/utils.ts:74</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.customStyles.html

@@ -0,0 +1,82 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>customStyles | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.customStyles.html">customStyles</a></li></ul>
+<h1>Function customStyles</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="customStyles">custom<wbr/>Styles<span class="tsd-signature-symbol">(</span>element<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Element</span>, styles<span class="tsd-signature-symbol">: </span><a href="../interfaces/interfaces_cg_select_interface.IStyle.html" class="tsd-signature-type" data-tsd-kind="Interface">IStyle</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#customStyles" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>Finding and styling elements derived from the styles instance CgSelect</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>element: <span class="tsd-signature-type">Element</span></h5>
+<div class="tsd-comment tsd-typography"><p>instantiated class CgSelect.</p>
+</div></li>
+<li>
+<h5>styles: <a href="../interfaces/interfaces_cg_select_interface.IStyle.html" class="tsd-signature-type" data-tsd-kind="Interface">IStyle</a></h5>
+<div class="tsd-comment tsd-typography"><p>object in which there are settings for customizing parts of the select.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L211">components/utils/utils.ts:211</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.customStylesFormat.html

@@ -0,0 +1,82 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>customStylesFormat | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.customStylesFormat.html">customStylesFormat</a></li></ul>
+<h1>Function customStylesFormat</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="customStylesFormat">custom<wbr/>Styles<wbr/>Format<span class="tsd-signature-symbol">(</span>elemOption<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">object</span>, selector<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#customStylesFormat" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>Generic Method for Styling a Select.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>elemOption: <span class="tsd-signature-type">object</span></h5>
+<div class="tsd-comment tsd-typography"><p>an object obtained from the styles object from which we get the styles key-value.</p>
+</div></li>
+<li>
+<h5>selector: <span class="tsd-signature-type">any</span></h5>
+<div class="tsd-comment tsd-typography"><p>HTMLElement subject to customization.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L231">components/utils/utils.ts:231</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.getFormatItem.html

@@ -0,0 +1,84 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>getFormatItem | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.getFormatItem.html">getFormatItem</a></li></ul>
+<h1>Function getFormatItem</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="getFormatItem">get<wbr/>Format<wbr/>Item<span class="tsd-signature-symbol">(</span>dataItem<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span>, index<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/interfaces_items_interface.IItems.html" class="tsd-signature-type" data-tsd-kind="Interface">IItems</a><a href="#getFormatItem" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>Converting each item obtained from the Items field;</p>
+
+<h3>Returns</h3><p>returns the formed object</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>dataItem: <span class="tsd-signature-type">any</span></h5>
+<div class="tsd-comment tsd-typography"><p>received element passed when creating the select.</p>
+</div></li>
+<li>
+<h5>index: <span class="tsd-signature-type">number</span></h5>
+<div class="tsd-comment tsd-typography"><p>index of this element.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <a href="../interfaces/interfaces_items_interface.IItems.html" class="tsd-signature-type" data-tsd-kind="Interface">IItems</a></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L15">components/utils/utils.ts:15</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.getSelectText.html

@@ -0,0 +1,84 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>getSelectText | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.getSelectText.html">getSelectText</a></li></ul>
+<h1>Function getSelectText</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="getSelectText">get<wbr/>Select<wbr/>Text<span class="tsd-signature-symbol">(</span>data<span class="tsd-signature-symbol">: </span><a href="../interfaces/components_utils_urils_interface.ISelectedItems.html" class="tsd-signature-type" data-tsd-kind="Interface">ISelectedItems</a>, select<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">HTMLElement</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span><a href="#getSelectText" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>Insert initial select text (before selection)</p>
+
+<h3>Returns</h3><p>returns the generated select element.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>data: <a href="../interfaces/components_utils_urils_interface.ISelectedItems.html" class="tsd-signature-type" data-tsd-kind="Interface">ISelectedItems</a></h5>
+<div class="tsd-comment tsd-typography"><p>the object in which the title of the select is located.</p>
+</div></li>
+<li>
+<h5>select: <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">HTMLElement</span></h5>
+<div class="tsd-comment tsd-typography"><p>select element where title will be inserted.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">HTMLElement</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L38">components/utils/utils.ts:38</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.nativeOptionMultiple.html

@@ -0,0 +1,86 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>nativeOptionMultiple | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.nativeOptionMultiple.html">nativeOptionMultiple</a></li></ul>
+<h1>Function nativeOptionMultiple</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="nativeOptionMultiple">native<wbr/>Option<wbr/>Multiple<span class="tsd-signature-symbol">(</span>element<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">NodeListOf</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">Element</span><span class="tsd-signature-symbol">&gt;</span>, item<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, condition<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#nativeOptionMultiple" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>The behavior of the native (Multiple) select when choosing in a custom one.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>element: <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">NodeListOf</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">Element</span><span class="tsd-signature-symbol">&gt;</span></h5>
+<div class="tsd-comment tsd-typography"><p>NodeList of native select.</p>
+</div></li>
+<li>
+<h5>item: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>selected element in custom select.</p>
+</div></li>
+<li>
+<h5>condition: <span class="tsd-signature-type">boolean</span></h5>
+<div class="tsd-comment tsd-typography"><p>a special flag that adds / removes attributes from the native select.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L186">components/utils/utils.ts:186</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/Utils.nativeOptionOrdinary.html

@@ -0,0 +1,82 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>nativeOptionOrdinary | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/Utils.html">Utils</a></li>
+<li><a href="Utils.nativeOptionOrdinary.html">nativeOptionOrdinary</a></li></ul>
+<h1>Function nativeOptionOrdinary</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="nativeOptionOrdinary">native<wbr/>Option<wbr/>Ordinary<span class="tsd-signature-symbol">(</span>element<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">NodeListOf</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">Element</span><span class="tsd-signature-symbol">&gt;</span>, item<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span><a href="#nativeOptionOrdinary" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>Behavior of a native (single) select when choosing a custom one.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>element: <span class="tsd-signature-type">undefined</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">NodeListOf</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-type">Element</span><span class="tsd-signature-symbol">&gt;</span></h5>
+<div class="tsd-comment tsd-typography"><p>NodeList native select.</p>
+</div></li>
+<li>
+<h5>item: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>selected element in custom select.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L171">components/utils/utils.ts:171</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/components_create_element_create_element.createBreadCrumb.html

@@ -0,0 +1,87 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>createBreadCrumb | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/components_create_element_create_element.html">components/create-element/create-element</a></li>
+<li><a href="components_create_element_create_element.createBreadCrumb.html">createBreadCrumb</a></li></ul>
+<h1>Function createBreadCrumb</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="createBreadCrumb">create<wbr/>Bread<wbr/>Crumb<span class="tsd-signature-symbol">(</span>data<span class="tsd-signature-symbol">: </span><a href="../interfaces/components_create_element_create_element_interface.ICreateBreadCrumb.html" class="tsd-signature-type" data-tsd-kind="Interface">ICreateBreadCrumb</a>, title<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, index<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span>, id<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLLIElement</span><a href="#createBreadCrumb" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>The method that creates and is responsible for the behavior of the chips.</p>
+
+<h3>Returns</h3><p>returns the generated HTMLElement chips item.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>data: <a href="../interfaces/components_create_element_create_element_interface.ICreateBreadCrumb.html" class="tsd-signature-type" data-tsd-kind="Interface">ICreateBreadCrumb</a></h5>
+<div class="tsd-comment tsd-typography"><p>an object that contains settings and select elements.</p>
+</div></li>
+<li>
+<h5>title: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>the name of the selected element to draw chips.</p>
+</div></li>
+<li>
+<h5>index: <span class="tsd-signature-type">number</span></h5>
+<div class="tsd-comment tsd-typography"><p>index of the selected item to draw chips.</p>
+</div></li>
+<li>
+<h5>id: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>unique id of the selected element.</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">HTMLLIElement</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.ts#L35">components/create-element/create-element.ts:35</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="current tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createBreadCrumb.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>create<wbr/>Bread<wbr/>Crumb</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createInputSearch.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Input<wbr/>Search</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createNativeSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createNativeSelectOption.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select<wbr/>Option</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/components_create_element_create_element.createInputSearch.html

@@ -0,0 +1,79 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>createInputSearch | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/components_create_element_create_element.html">components/create-element/create-element</a></li>
+<li><a href="components_create_element_create_element.createInputSearch.html">createInputSearch</a></li></ul>
+<h1>Function createInputSearch</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="createInputSearch">create<wbr/>Input<wbr/>Search<span class="tsd-signature-symbol">(</span>random<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, lenguage<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLInputElement</span><a href="#createInputSearch" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>The method that creates a search for elements in the select.</p>
+
+<h3>Returns</h3><p>Returns the rendered input element.</p>
+</div>
+<div class="tsd-parameters">
+<h4 class="tsd-parameters-title">Parameters</h4>
+<ul class="tsd-parameter-list">
+<li>
+<h5>random: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>unique value for input element.</p>
+</div></li>
+<li>
+<h5>lenguage: <span class="tsd-signature-type">string</span></h5>
+<div class="tsd-comment tsd-typography"><p>text in specific language passed from language.ts file</p>
+</div></li></ul></div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">HTMLInputElement</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.ts#L106">components/create-element/create-element.ts:106</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="current tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createBreadCrumb.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>create<wbr/>Bread<wbr/>Crumb</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createInputSearch.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Input<wbr/>Search</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createNativeSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createNativeSelectOption.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select<wbr/>Option</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/components_create_element_create_element.createNativeSelect.html

@@ -0,0 +1,68 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>createNativeSelect | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/components_create_element_create_element.html">components/create-element/create-element</a></li>
+<li><a href="components_create_element_create_element.createNativeSelect.html">createNativeSelect</a></li></ul>
+<h1>Function createNativeSelect</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="createNativeSelect">create<wbr/>Native<wbr/>Select<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLSelectElement</span><a href="#createNativeSelect" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>The method that creates the native select.</p>
+
+<h3>Returns</h3><p>Returns the created native select.</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">HTMLSelectElement</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.ts#L8">components/create-element/create-element.ts:8</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="current tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createBreadCrumb.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>create<wbr/>Bread<wbr/>Crumb</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createInputSearch.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Input<wbr/>Search</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createNativeSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createNativeSelectOption.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select<wbr/>Option</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/functions/components_create_element_create_element.createNativeSelectOption.html

@@ -0,0 +1,68 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>createNativeSelectOption | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/components_create_element_create_element.html">components/create-element/create-element</a></li>
+<li><a href="components_create_element_create_element.createNativeSelectOption.html">createNativeSelectOption</a></li></ul>
+<h1>Function createNativeSelectOption</h1></div>
+<section class="tsd-panel">
+<ul class="tsd-signatures tsd-kind-function tsd-parent-kind-module">
+<li class="tsd-signature tsd-anchor-link" id="createNativeSelectOption">create<wbr/>Native<wbr/>Select<wbr/>Option<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLOptionElement</span><a href="#createNativeSelectOption" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></li>
+<li class="tsd-description">
+<div class="tsd-comment tsd-typography"><p>The method that creates Options for the native select.</p>
+
+<h3>Returns</h3><p>Returns the generated Options of the native select.</p>
+</div>
+<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">HTMLOptionElement</span></h4><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.ts#L20">components/create-element/create-element.ts:20</a></li></ul></aside></li></ul></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="current tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createBreadCrumb.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg>create<wbr/>Bread<wbr/>Crumb</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createInputSearch.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Input<wbr/>Search</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createNativeSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select</a></li>
+<li class="current tsd-kind-function tsd-parent-kind-module"><a href="components_create_element_create_element.createNativeSelectOption.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select<wbr/>Option</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/index.html

@@ -0,0 +1,443 @@
+<!DOCTYPE html>
+<html class="default" lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta http-equiv="x-ua-compatible" content="IE=edge" />
+    <title>cg-select</title>
+    <meta name="description" content="Documentation for cg-select" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="stylesheet" href="assets/style.css" />
+    <link rel="stylesheet" href="assets/highlight.css" />
+    <script async src="assets/search.js" id="search-script"></script>
+  </head>
+  <body>
+    <script>
+      document.documentElement.dataset.theme = localStorage.getItem('tsd-theme') || 'os';
+    </script>
+    <header class="tsd-page-toolbar">
+      <div class="tsd-toolbar-contents container">
+        <div class="table-cell" id="tsd-search" data-base=".">
+          <div class="field">
+            <label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"
+              ><svg width="16" height="16" viewBox="0 0 16 16" fill="none">
+                <path
+                  d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z"
+                  fill="var(--color-text)"
+                ></path></svg></label
+            ><input type="text" id="tsd-search-field" aria-label="Search" />
+          </div>
+          <div class="field">
+            <div id="tsd-toolbar-links"></div>
+          </div>
+          <ul class="results">
+            <li class="state loading">Preparing search index...</li>
+            <li class="state failure">The search index is not available</li>
+          </ul>
+          <a href="index.html" class="title">Home</a>
+        </div>
+        <div class="table-cell" id="tsd-widgets">
+          <a
+            href="#"
+            class="tsd-widget tsd-toolbar-icon menu no-caption"
+            data-toggle="menu"
+            aria-label="Menu"
+            ><svg width="16" height="16" viewBox="0 0 16 16" fill="none">
+              <rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect>
+              <rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect>
+              <rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg
+          ></a>
+        </div>
+      </div>
+    </header>
+    <div class="container container-main">
+      <div class="col-8 col-content">
+        <div class="tsd-page-title">
+          <h2>cg-select</h2>
+        </div>
+        <div class="tsd-panel tsd-typography">
+          <a href="#cg-select" id="cg-select" style="color: inherit; text-decoration: none">
+            <h1>CG-SELECT</h1>
+          </a>
+
+          <a href="#version--021" id="version--021" style="color: inherit; text-decoration: none">
+            <h2>version ~ 0.2.1</h2>
+          </a>
+          <p>
+            This component allows you to create a custom select. It offers more flexible
+            customization and use of select. Customization, multi-selection and live search by
+            elements are available.
+          </p>
+
+          <a
+            href="#the-ability-to-customize-basic-elements-such-as"
+            id="the-ability-to-customize-basic-elements-such-as"
+            style="color: inherit; text-decoration: none"
+          >
+            <h3>The ability to customize basic elements, such as:</h3>
+          </a>
+          <ul>
+            <li>Select button.</li>
+            <li>List with select elements.</li>
+            <li>Placeholder.</li>
+            <li>
+              In the multiselect mode, customization of chips (selected elements) is available.
+            </li>
+            <li>Label of the element (if it was specified).</li>
+            <li>Switch themes from dark to light.</li>
+          </ul>
+
+          <a href="#installation" id="installation" style="color: inherit; text-decoration: none">
+            <h2>Installation</h2>
+          </a>
+          <pre><code><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-0">i</span><span class="hl-1"> </span><span class="hl-0">cg</span><span class="hl-1">-</span><span class="hl-0">select</span>
+</code></pre>
+
+          <a href="#usage" id="usage" style="color: inherit; text-decoration: none">
+            <h2>Usage</h2>
+          </a>
+
+          <a
+            href="#to-create-a-component-you-need"
+            id="to-create-a-component-you-need"
+            style="color: inherit; text-decoration: none"
+          >
+            <h3>To create a component, you need:</h3>
+          </a>
+          <ol>
+            <li>Create a regular button element.</li>
+            <li>Give it the cg-dropdown class.</li>
+          </ol>
+          <pre><code><span class="hl-1">&lt;</span><span class="hl-0">button</span><span class="hl-1"> </span><span class="hl-0">class</span><span class="hl-1">=</span><span class="hl-2">&quot;cg-dropdown&quot;</span><span class="hl-1">&gt;&lt;/</span><span class="hl-3">button</span><span class="hl-1">&gt;</span>
+</code></pre>
+          <ol start="3">
+            <li>Give it a <strong>unique class</strong>, e.g. (cg-dropdown_categories).</li>
+          </ol>
+          <pre><code><span class="hl-1">&lt;</span><span class="hl-0">button</span><span class="hl-1"> </span><span class="hl-0">class</span><span class="hl-1">=</span><span class="hl-2">&quot;cg-dropdown cg-dropdown_categories&quot;</span><span class="hl-1">&gt;&lt;/</span><span class="hl-3">button</span><span class="hl-1">&gt;</span>
+</code></pre>
+          <ol start="4">
+            <li>Create a new instance of the class (new CGSelect)</li>
+            <li>Pass all desired settings as an object</li>
+          </ol>
+
+          <a
+            href="#all-options-for-creating-and-managing-are-in-the-documentation-section-quotcgselect-class-constructorquot"
+            id="all-options-for-creating-and-managing-are-in-the-documentation-section-quotcgselect-class-constructorquot"
+            style="color: inherit; text-decoration: none"
+          >
+            <h4>
+              All options for creating and managing are in the documentation, section &quot;CGSelect
+              class constructor&quot;.
+            </h4>
+          </a>
+
+          <a
+            href="#an-example-of-creating-a-regular-select"
+            id="an-example-of-creating-a-regular-select"
+            style="color: inherit; text-decoration: none"
+          >
+            <h3>An example of creating a regular select.</h3>
+          </a>
+          <pre><code class="language-javascript"><span class="hl-4">import</span><span class="hl-1"> { </span><span class="hl-0">CGSelect</span><span class="hl-1"> } </span><span class="hl-4">from</span><span class="hl-1"> </span><span class="hl-2">&#39;cg-select&#39;</span><span class="hl-1">;</span><br/><br/><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">dropdown</span><span class="hl-1"> = </span><span class="hl-5">new</span><span class="hl-1"> </span><span class="hl-7">CGSelect</span><span class="hl-1">({</span><br/><span class="hl-1">  </span><span class="hl-0">selector:</span><span class="hl-1"> </span><span class="hl-2">&#39;.cg-dropdown_selector&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  </span><span class="hl-0">placeholder:</span><span class="hl-1"> </span><span class="hl-2">&#39;Выберите авто&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  </span><span class="hl-0">items:</span><span class="hl-1"> [</span><br/><span class="hl-1">    </span><span class="hl-2">&#39;BMW&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">    {</span><br/><span class="hl-1">      </span><span class="hl-0">id:</span><span class="hl-1"> </span><span class="hl-2">&#39;213sade&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">      </span><span class="hl-0">title:</span><span class="hl-1"> </span><span class="hl-2">&#39;Opel&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">      </span><span class="hl-0">value:</span><span class="hl-1"> </span><span class="hl-8">1</span><span class="hl-1">,</span><br/><span class="hl-1">    },</span><br/><span class="hl-1">    </span><span class="hl-2">&#39;Mersedes&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-2">&#39;MAN&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-2">&#39;Ferari&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  ],</span><br/><span class="hl-1">});</span>
+</code></pre>
+
+          <a
+            href="#example-of-different-selects"
+            id="example-of-different-selects"
+            style="color: inherit; text-decoration: none"
+          >
+            <h2>Example of different selects</h2>
+          </a>
+          <p>
+            Same working example --
+            <a href="https://cg-select.itguild.info/">https://cg-select.itguild.info/</a>
+          </p>
+          <p>
+            <img src="../src/images/DefaultSelect.png" alt="image" />
+            <img src="../src/images/MultiSelect.png" alt="image" />
+            <img src="../src/images/WhiteTheme.png" alt="image" />
+            <img src="../src/images/Categories.png" alt="image" />
+          </p>
+          <p>
+            All documentation on CG-SELECT is located in the folder of the same name. The
+            documentation describes all methods and variables, there are also examples of passing
+            settings to select. You can also open it on the page with an example, or follow the link
+            below.
+          </p>
+
+          <a href="#contributing" id="contributing" style="color: inherit; text-decoration: none">
+            <h2>Contributing</h2>
+          </a>
+          <ol>
+            <li>Fork it!</li>
+            <li>Create your feature branch: <code>git checkout -b my-new-feature</code></li>
+            <li>Commit your changes: <code>git commit -am &#39;Add some feature&#39;</code></li>
+            <li>Push to the branch: <code>git push origin my-new-feature</code></li>
+            <li>Submit a pull request :D</li>
+          </ol>
+
+          <a href="#compatibility" id="compatibility" style="color: inherit; text-decoration: none">
+            <h2>Compatibility</h2>
+          </a>
+          <table>
+            <thead>
+              <tr>
+                <th>Application Compatibility</th>
+                <th align="center">JS</th>
+                <th align="center">React</th>
+                <th align="center">Angular</th>
+                <th align="center">Vue</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr>
+                <td>CG-SELECT</td>
+                <td align="center">
+                  <img src="../src/images/yes.png" alt="image" />
+                </td>
+                <td align="center">
+                  <img src="../src/images/yes.png" alt="image" />
+                  <img src="../src/images/no.png" alt="image" />
+                </td>
+                <td align="center">
+                  <img src="../src/images/no.png" alt="image" />
+                </td>
+                <td align="center">
+                  <img src="../src/images/no.png" alt="image" />
+                </td>
+              </tr>
+              <tr>
+                <td>Comment</td>
+                <td align="center">Tested in Js applications and it worksуспешно.</td>
+                <td align="center">
+                  Works only with a crutch in the form <code>setTimeout()</code>
+                </td>
+                <td align="center">not yet available</td>
+                <td align="center">not yet available</td>
+              </tr>
+            </tbody>
+          </table>
+
+          <a href="#history" id="history" style="color: inherit; text-decoration: none">
+            <h2>History</h2>
+          </a>
+          <p>
+            16.12.2022 - release version 0.1.0! <br />
+            00.00.2023 - upgrade to version 0.2.1
+          </p>
+        </div>
+      </div>
+      <div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+        <div class="tsd-navigation settings">
+          <details class="tsd-index-accordion">
+            <summary class="tsd-accordion-summary">
+              <h3>
+                <svg width="20" height="20" viewBox="0 0 24 24" fill="none">
+                  <path
+                    d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z"
+                    fill="var(--color-text)"
+                  ></path>
+                </svg>
+                Settings
+              </h3>
+            </summary>
+            <div class="tsd-accordion-details">
+              <div class="tsd-filter-visibility">
+                <h4 class="uppercase">Member Visibility</h4>
+                <form>
+                  <ul id="tsd-filter-options">
+                    <li class="tsd-filter-item">
+                      <label class="tsd-filter-input"
+                        ><input type="checkbox" id="tsd-filter-protected" name="protected" /><svg
+                          width="32"
+                          height="32"
+                          viewBox="0 0 32 32"
+                          aria-hidden="true"
+                        >
+                          <rect
+                            class="tsd-checkbox-background"
+                            width="30"
+                            height="30"
+                            x="1"
+                            y="1"
+                            rx="6"
+                            fill="none"
+                          ></rect>
+                          <path
+                            class="tsd-checkbox-checkmark"
+                            d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25"
+                            stroke="none"
+                            stroke-width="3.5"
+                            stroke-linejoin="round"
+                            fill="none"
+                          ></path></svg
+                        ><span>Protected</span></label
+                      >
+                    </li>
+                    <li class="tsd-filter-item">
+                      <label class="tsd-filter-input"
+                        ><input type="checkbox" id="tsd-filter-private" name="private" /><svg
+                          width="32"
+                          height="32"
+                          viewBox="0 0 32 32"
+                          aria-hidden="true"
+                        >
+                          <rect
+                            class="tsd-checkbox-background"
+                            width="30"
+                            height="30"
+                            x="1"
+                            y="1"
+                            rx="6"
+                            fill="none"
+                          ></rect>
+                          <path
+                            class="tsd-checkbox-checkmark"
+                            d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25"
+                            stroke="none"
+                            stroke-width="3.5"
+                            stroke-linejoin="round"
+                            fill="none"
+                          ></path></svg
+                        ><span>Private</span></label
+                      >
+                    </li>
+                    <li class="tsd-filter-item">
+                      <label class="tsd-filter-input"
+                        ><input
+                          type="checkbox"
+                          id="tsd-filter-inherited"
+                          name="inherited"
+                          checked
+                        /><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true">
+                          <rect
+                            class="tsd-checkbox-background"
+                            width="30"
+                            height="30"
+                            x="1"
+                            y="1"
+                            rx="6"
+                            fill="none"
+                          ></rect>
+                          <path
+                            class="tsd-checkbox-checkmark"
+                            d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25"
+                            stroke="none"
+                            stroke-width="3.5"
+                            stroke-linejoin="round"
+                            fill="none"
+                          ></path></svg
+                        ><span>Inherited</span></label
+                      >
+                    </li>
+                    <li class="tsd-filter-item">
+                      <label class="tsd-filter-input"
+                        ><input type="checkbox" id="tsd-filter-external" name="external" /><svg
+                          width="32"
+                          height="32"
+                          viewBox="0 0 32 32"
+                          aria-hidden="true"
+                        >
+                          <rect
+                            class="tsd-checkbox-background"
+                            width="30"
+                            height="30"
+                            x="1"
+                            y="1"
+                            rx="6"
+                            fill="none"
+                          ></rect>
+                          <path
+                            class="tsd-checkbox-checkmark"
+                            d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25"
+                            stroke="none"
+                            stroke-width="3.5"
+                            stroke-linejoin="round"
+                            fill="none"
+                          ></path></svg
+                        ><span>External</span></label
+                      >
+                    </li>
+                  </ul>
+                </form>
+              </div>
+              <div class="tsd-theme-toggle">
+                <h4 class="uppercase">Theme</h4>
+                <select id="theme">
+                  <option value="os">OS</option>
+                  <option value="light">Light</option>
+                  <option value="dark">Dark</option>
+                </select>
+              </div>
+            </div>
+          </details>
+        </div>
+        <nav class="tsd-navigation primary">
+          <details class="tsd-index-accordion" open>
+            <summary class="tsd-accordion-summary">
+              <h3>
+                <svg width="20" height="20" viewBox="0 0 24 24" fill="none">
+                  <path
+                    d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z"
+                    fill="var(--color-text)"
+                  ></path>
+                </svg>
+                Modules
+              </h3>
+            </summary>
+            <div class="tsd-accordion-details">
+              <ul>
+                <li class="current selected">
+                  <a href="modules.html">cg-<wbr />select</a>
+                  <ul>
+                    <li class="tsd-kind-module"><a href="modules/Utils.html">Utils</a></li>
+                    <li class="selected tsd-kind-module">
+                      <a href="modules/cg_select.html">cg-<wbr />select</a>
+                    </li>
+                    <li class="tsd-kind-module">
+                      <a href="modules/components_create_element_create_element.html"
+                        >components/create-<wbr />element/create-<wbr />element</a
+                      >
+                    </li>
+                    <li class="tsd-kind-module">
+                      <a href="modules/components_create_element_create_element_interface.html"
+                        >components/create-<wbr />element/create-<wbr />element.interface</a
+                      >
+                    </li>
+                    <li class="tsd-kind-module">
+                      <a href="modules/components_utils_urils_interface.html"
+                        >components/utils/urils.interface</a
+                      >
+                    </li>
+                    <li class="tsd-kind-module">
+                      <a href="modules/interfaces_cg_select_interface.html"
+                        >interfaces/cg-<wbr />select.interface</a
+                      >
+                    </li>
+                    <li class="tsd-kind-module">
+                      <a href="modules/interfaces_items_interface.html"
+                        >interfaces/items.interface</a
+                      >
+                    </li>
+                    <li class="tsd-kind-module">
+                      <a href="modules/interfaces_language_interface.html"
+                        >interfaces/language.interface</a
+                      >
+                    </li>
+                    <li class="tsd-kind-module">
+                      <a href="modules/language_language.html">language/language</a>
+                    </li>
+                  </ul>
+                </li>
+              </ul>
+            </div>
+          </details>
+        </nav>
+      </div>
+    </div>
+    <div class="container tsd-generator">
+      <p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p>
+    </div>
+    <div class="overlay"></div>
+    <script src="assets/main.js"></script>
+  </body>
+</html>

docs/interfaces/components_create_element_create_element_interface.ICreateBreadCrumb.html

@@ -0,0 +1,111 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>ICreateBreadCrumb | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/components_create_element_create_element_interface.html">components/create-element/create-element.interface</a></li>
+<li><a href="components_create_element_create_element_interface.ICreateBreadCrumb.html">ICreateBreadCrumb</a></li></ul>
+<h1>Interface ICreateBreadCrumb</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>cSettings for creating chips.</p>
+</div></section>
+<section class="tsd-panel tsd-hierarchy">
+<h4>Hierarchy</h4>
+<ul class="tsd-hierarchy">
+<li><span class="target">ICreateBreadCrumb</span></li></ul></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.interface.ts#L6">components/create-element/create-element.interface.ts:6</a></li></ul></aside>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary">
+<h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex=0><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M1.5 5.50969L8 11.6609L14.5 5.50969L12.5466 3.66086L8 7.96494L3.45341 3.66086L1.5 5.50969Z" fill="var(--color-text)"></path></svg> Index</h5></summary>
+<div class="tsd-accordion-details">
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Properties</h3>
+<div class="tsd-index-list"><a href="components_create_element_create_element_interface.ICreateBreadCrumb.html#element" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF984D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-1024-path"></rect><path d="M9.354 16V7.24H12.174C12.99 7.24 13.638 7.476 14.118 7.948C14.606 8.412 14.85 9.036 14.85 9.82C14.85 10.604 14.606 11.232 14.118 11.704C13.638 12.168 12.99 12.4 12.174 12.4H10.434V16H9.354ZM10.434 11.428H12.174C12.646 11.428 13.022 11.284 13.302 10.996C13.59 10.7 13.734 10.308 13.734 9.82C13.734 9.324 13.59 8.932 13.302 8.644C13.022 8.356 12.646 8.212 12.174 8.212H10.434V11.428Z" fill="var(--color-text)" id="icon-1024-text"></path></svg><span>element</span></a>
+<a href="components_create_element_create_element_interface.ICreateBreadCrumb.html#indexes" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>indexes</span></a>
+<a href="components_create_element_create_element_interface.ICreateBreadCrumb.html#option" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>option</span></a>
+<a href="components_create_element_create_element_interface.ICreateBreadCrumb.html#selectedItems" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>selected<wbr/>Items</span></a>
+</div></section></div></details></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Properties</h2>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="element" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>element</span><a href="#element" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></h3>
+<div class="tsd-signature">element<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">null</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">Element</span></div>
+<div class="tsd-comment tsd-typography"><p>A specific instance of a class.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.interface.ts#L11">components/create-element/create-element.interface.ts:11</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="indexes" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>indexes</span><a href="#indexes" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">indexes<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span></div>
+<div class="tsd-comment tsd-typography"><p>Array of indexes of selected elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.interface.ts#L21">components/create-element/create-element.interface.ts:21</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="option" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>option</span><a href="#option" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">option<span class="tsd-signature-symbol">:</span> <a href="interfaces_cg_select_interface.ICgSelect.html" class="tsd-signature-type" data-tsd-kind="Interface">ICgSelect</a></div>
+<div class="tsd-comment tsd-typography"><p>Select settings.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.interface.ts#L16">components/create-element/create-element.interface.ts:16</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="selectedItems" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>selected<wbr/>Items</span><a href="#selectedItems" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">selected<wbr/>Items<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">[]</span></div>
+<div class="tsd-comment tsd-typography"><p>Array with selected elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.interface.ts#L26">components/create-element/create-element.interface.ts:26</a></li></ul></aside></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="current tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-interface tsd-parent-kind-module"><a href="components_create_element_create_element_interface.ICreateBreadCrumb.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>ICreate<wbr/>Bread<wbr/>Crumb</span></a>
+<ul>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_create_element_create_element_interface.ICreateBreadCrumb.html#element" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>element</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_create_element_create_element_interface.ICreateBreadCrumb.html#indexes" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>indexes</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_create_element_create_element_interface.ICreateBreadCrumb.html#option" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>option</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_create_element_create_element_interface.ICreateBreadCrumb.html#selectedItems" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>selected<wbr/>Items</a></li></ul></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/interfaces/components_utils_urils_interface.IDataItem.html

@@ -0,0 +1,102 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>IDataItem | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li><a href="components_utils_urils_interface.IDataItem.html">IDataItem</a></li></ul>
+<h1>Interface IDataItem</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Receive Item Settings.</p>
+</div></section>
+<section class="tsd-panel tsd-hierarchy">
+<h4>Hierarchy</h4>
+<ul class="tsd-hierarchy">
+<li><span class="target">IDataItem</span></li></ul></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L6">components/utils/urils.interface.ts:6</a></li></ul></aside>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary">
+<h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex=0><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M1.5 5.50969L8 11.6609L14.5 5.50969L12.5466 3.66086L8 7.96494L3.45341 3.66086L1.5 5.50969Z" fill="var(--color-text)"></path></svg> Index</h5></summary>
+<div class="tsd-accordion-details">
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Properties</h3>
+<div class="tsd-index-list"><a href="components_utils_urils_interface.IDataItem.html#ItemValue" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF984D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-1024-path"></rect><path d="M9.354 16V7.24H12.174C12.99 7.24 13.638 7.476 14.118 7.948C14.606 8.412 14.85 9.036 14.85 9.82C14.85 10.604 14.606 11.232 14.118 11.704C13.638 12.168 12.99 12.4 12.174 12.4H10.434V16H9.354ZM10.434 11.428H12.174C12.646 11.428 13.022 11.284 13.302 10.996C13.59 10.7 13.734 10.308 13.734 9.82C13.734 9.324 13.59 8.932 13.302 8.644C13.022 8.356 12.646 8.212 12.174 8.212H10.434V11.428Z" fill="var(--color-text)" id="icon-1024-text"></path></svg><span>Item<wbr/>Value</span></a>
+<a href="components_utils_urils_interface.IDataItem.html#category" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>category?</span></a>
+<a href="components_utils_urils_interface.IDataItem.html#categoryItems" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>category<wbr/>Items?</span></a>
+</div></section></div></details></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Properties</h2>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="ItemValue" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>Item<wbr/>Value</span><a href="#ItemValue" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></h3>
+<div class="tsd-signature">Item<wbr/>Value<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol"> | </span><a href="interfaces_items_interface.IItems.html" class="tsd-signature-type" data-tsd-kind="Interface">IItems</a></div>
+<div class="tsd-comment tsd-typography"><p>The value of the passed element.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L21">components/utils/urils.interface.ts:21</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="category" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>category</span><a href="#category" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">category<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Optional parameter. Item group category.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L11">components/utils/urils.interface.ts:11</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="categoryItems" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>category<wbr/>Items</span><a href="#categoryItems" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">category<wbr/>Items<span class="tsd-signature-symbol">?:</span> <a href="interfaces_items_interface.IItems.html" class="tsd-signature-type" data-tsd-kind="Interface">IItems</a><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">[]</span></div>
+<div class="tsd-comment tsd-typography"><p>Optional parameter. Array with elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L16">components/utils/urils.interface.ts:16</a></li></ul></aside></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="current tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-interface tsd-parent-kind-module"><a href="components_utils_urils_interface.IDataItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>IData<wbr/>Item</span></a>
+<ul>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.IDataItem.html#ItemValue" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>Item<wbr/>Value</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.IDataItem.html#category" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>category?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.IDataItem.html#categoryItems" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>category<wbr/>Items?</a></li></ul></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/interfaces/components_utils_urils_interface.ISelectedItems.html

@@ -0,0 +1,130 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>ISelectedItems | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li><a href="components_utils_urils_interface.ISelectedItems.html">ISelectedItems</a></li></ul>
+<h1>Interface ISelectedItems</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Settings for select text, etc.</p>
+</div></section>
+<section class="tsd-panel tsd-hierarchy">
+<h4>Hierarchy</h4>
+<ul class="tsd-hierarchy">
+<li><span class="target">ISelectedItems</span></li></ul></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L27">components/utils/urils.interface.ts:27</a></li></ul></aside>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary">
+<h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex=0><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M1.5 5.50969L8 11.6609L14.5 5.50969L12.5466 3.66086L8 7.96494L3.45341 3.66086L1.5 5.50969Z" fill="var(--color-text)"></path></svg> Index</h5></summary>
+<div class="tsd-accordion-details">
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Properties</h3>
+<div class="tsd-index-list"><a href="components_utils_urils_interface.ISelectedItems.html#darkTheme" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF984D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-1024-path"></rect><path d="M9.354 16V7.24H12.174C12.99 7.24 13.638 7.476 14.118 7.948C14.606 8.412 14.85 9.036 14.85 9.82C14.85 10.604 14.606 11.232 14.118 11.704C13.638 12.168 12.99 12.4 12.174 12.4H10.434V16H9.354ZM10.434 11.428H12.174C12.646 11.428 13.022 11.284 13.302 10.996C13.59 10.7 13.734 10.308 13.734 9.82C13.734 9.324 13.59 8.932 13.302 8.644C13.022 8.356 12.646 8.212 12.174 8.212H10.434V11.428Z" fill="var(--color-text)" id="icon-1024-text"></path></svg><span>dark<wbr/>Theme?</span></a>
+<a href="components_utils_urils_interface.ISelectedItems.html#indexes" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>indexes?</span></a>
+<a href="components_utils_urils_interface.ISelectedItems.html#multiselectTag" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>multiselect<wbr/>Tag?</span></a>
+<a href="components_utils_urils_interface.ISelectedItems.html#placeholder" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>placeholder?</span></a>
+<a href="components_utils_urils_interface.ISelectedItems.html#selected" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>selected?</span></a>
+<a href="components_utils_urils_interface.ISelectedItems.html#selectedItems" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>selected<wbr/>Items?</span></a>
+</div></section></div></details></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Properties</h2>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="darkTheme" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>dark<wbr/>Theme</span><a href="#darkTheme" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></h3>
+<div class="tsd-signature">dark<wbr/>Theme<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for enabling a light/dark theme by default, the dark theme is set.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L58">components/utils/urils.interface.ts:58</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="indexes" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>indexes</span><a href="#indexes" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">indexes<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">[]</span></div>
+<div class="tsd-comment tsd-typography"><p>Array of indexes of selected elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L47">components/utils/urils.interface.ts:47</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="multiselectTag" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>multiselect<wbr/>Tag</span><a href="#multiselectTag" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">multiselect<wbr/>Tag<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select,
+for him, *** works only in a place with a multiselect connection.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L53">components/utils/urils.interface.ts:53</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="placeholder" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>placeholder</span><a href="#placeholder" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">placeholder<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Placeholder  optional parameter to which the text of the select placeholder is passed.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L32">components/utils/urils.interface.ts:32</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="selected" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>selected</span><a href="#selected" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">selected<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter, which is passed the element that will be selected initially in the select.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L37">components/utils/urils.interface.ts:37</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="selectedItems" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>selected<wbr/>Items</span><a href="#selectedItems" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">selected<wbr/>Items<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">[]</span></div>
+<div class="tsd-comment tsd-typography"><p>Array of selected items from the list.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L42">components/utils/urils.interface.ts:42</a></li></ul></aside></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="current tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-interface tsd-parent-kind-module"><a href="components_utils_urils_interface.ISelectedItems.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>ISelected<wbr/>Items</span></a>
+<ul>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.ISelectedItems.html#darkTheme" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>dark<wbr/>Theme?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.ISelectedItems.html#indexes" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>indexes?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.ISelectedItems.html#multiselectTag" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>multiselect<wbr/>Tag?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.ISelectedItems.html#placeholder" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>placeholder?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.ISelectedItems.html#selected" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>selected?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="components_utils_urils_interface.ISelectedItems.html#selectedItems" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>selected<wbr/>Items?</a></li></ul></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/interfaces/interfaces_cg_select_interface.ICgSelect.html

@@ -0,0 +1,231 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>ICgSelect | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-select.interface</a></li>
+<li><a href="interfaces_cg_select_interface.ICgSelect.html">ICgSelect</a></li></ul>
+<h1>Interface ICgSelect</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Select settings.</p>
+</div></section>
+<section class="tsd-panel tsd-hierarchy">
+<h4>Hierarchy</h4>
+<ul class="tsd-hierarchy">
+<li><span class="target">ICgSelect</span></li></ul></section>
+<section class="tsd-panel">
+<h4>Implemented by</h4>
+<ul class="tsd-hierarchy">
+<li><a href="../classes/cg_select.CGSelect.html" class="tsd-signature-type" data-tsd-kind="Class">CGSelect</a></li></ul></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L6">interfaces/cg-select.interface.ts:6</a></li></ul></aside>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary">
+<h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex=0><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M1.5 5.50969L8 11.6609L14.5 5.50969L12.5466 3.66086L8 7.96494L3.45341 3.66086L1.5 5.50969Z" fill="var(--color-text)"></path></svg> Index</h5></summary>
+<div class="tsd-accordion-details">
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Properties</h3>
+<div class="tsd-index-list"><a href="interfaces_cg_select_interface.ICgSelect.html#closeOnSelect" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF984D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-1024-path"></rect><path d="M9.354 16V7.24H12.174C12.99 7.24 13.638 7.476 14.118 7.948C14.606 8.412 14.85 9.036 14.85 9.82C14.85 10.604 14.606 11.232 14.118 11.704C13.638 12.168 12.99 12.4 12.174 12.4H10.434V16H9.354ZM10.434 11.428H12.174C12.646 11.428 13.022 11.284 13.302 10.996C13.59 10.7 13.734 10.308 13.734 9.82C13.734 9.324 13.59 8.932 13.302 8.644C13.022 8.356 12.646 8.212 12.174 8.212H10.434V11.428Z" fill="var(--color-text)" id="icon-1024-text"></path></svg><span>close<wbr/>On<wbr/>Select?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#darkTheme" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>dark<wbr/>Theme?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#event" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>event?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#items" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>items?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#lable" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>lable?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#language" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>language?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#listDisplayMode" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>list<wbr/>Display<wbr/>Mode?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#multiselect" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>multiselect?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#multiselectTag" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>multiselect<wbr/>Tag?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#nativeSelectMode" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>native<wbr/>Select<wbr/>Mode?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#placeholder" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>placeholder?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#searchMode" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>search<wbr/>Mode?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#selected" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>selected?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#selector" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>selector?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#styles" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>styles?</span></a>
+<a href="interfaces_cg_select_interface.ICgSelect.html#url" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>url?</span></a>
+</div></section></div></details></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Properties</h2>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="closeOnSelect" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>close<wbr/>On<wbr/>Select</span><a href="#closeOnSelect" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></h3>
+<div class="tsd-signature">close<wbr/>On<wbr/>Select<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select when opening, if closeOnSelect: false,
+then when an element is selected in the selector, closing does not occur,
+and you can select another element by default, closeOnSelect:true.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L44">interfaces/cg-select.interface.ts:44</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="darkTheme" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>dark<wbr/>Theme</span><a href="#darkTheme" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">dark<wbr/>Theme<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for enabling a light / dark theme by default, the dark theme is set (darkTheme == true).</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L32">interfaces/cg-select.interface.ts:32</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="event" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>event</span><a href="#event" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">event<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select, passing to this parameter an event of the &#39;mouseenter&#39; type,
+select will open on hover.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L76">interfaces/cg-select.interface.ts:76</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="items" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>items</span><a href="#items" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">items<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">any</span></div>
+<div class="tsd-comment tsd-typography"><p>*Required parameter (if no other way to get data (url) is specified), this is an array of elements,
+ which will be displayed in the select when selected.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L27">interfaces/cg-select.interface.ts:27</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="lable" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>lable</span><a href="#lable" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">lable<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that adds a lable before the select.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L64">interfaces/cg-select.interface.ts:64</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="language" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>language</span><a href="#language" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">language<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Optional parameter responsible for the localization of some text elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L59">interfaces/cg-select.interface.ts:59</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="listDisplayMode" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>list<wbr/>Display<wbr/>Mode</span><a href="#listDisplayMode" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">list<wbr/>Display<wbr/>Mode<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select when opening.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L54">interfaces/cg-select.interface.ts:54</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="multiselect" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>multiselect</span><a href="#multiselect" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">multiselect<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter, which is responsible for the behavior of the select, adds the ability to select multiple elements.
+Selected elements are rendered as plain text, separated by commas.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L88">interfaces/cg-select.interface.ts:88</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="multiselectTag" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>multiselect<wbr/>Tag</span><a href="#multiselectTag" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">multiselect<wbr/>Tag<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select,
+for him, *** works only in a place with a multiselect connection.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L94">interfaces/cg-select.interface.ts:94</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="nativeSelectMode" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>native<wbr/>Select<wbr/>Mode</span><a href="#nativeSelectMode" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">native<wbr/>Select<wbr/>Mode<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for the behavior of the select when opened on mobile devices.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L49">interfaces/cg-select.interface.ts:49</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="placeholder" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>placeholder</span><a href="#placeholder" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">placeholder<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Placeholder optional parameter to which the text of the select placeholder is passed.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L21">interfaces/cg-select.interface.ts:21</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="searchMode" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>search<wbr/>Mode</span><a href="#searchMode" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">search<wbr/>Mode<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">boolean</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that adds a live search on the select elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L37">interfaces/cg-select.interface.ts:37</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="selected" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>selected</span><a href="#selected" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">selected<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter, which is passed the element that will be selected initially in the select.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L16">interfaces/cg-select.interface.ts:16</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="selector" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>selector</span><a href="#selector" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">selector<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Unique selector - *mandatory parameter (indicator) that is set when creating a select.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L11">interfaces/cg-select.interface.ts:11</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="styles" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>styles</span><a href="#styles" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">styles<span class="tsd-signature-symbol">?:</span> <a href="interfaces_cg_select_interface.IStyle.html" class="tsd-signature-type" data-tsd-kind="Interface">IStyle</a></div>
+<div class="tsd-comment tsd-typography"><p>An optional parameter that is responsible for customizing the select elements,
+objects with CSS properties for customizable elements are passed to it.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L70">interfaces/cg-select.interface.ts:70</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="url" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>url</span><a href="#url" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">url<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Required parameter (if no other way to get data (items) is specified),
+data that comes from the backend in the format { id: &quot;&quot;, title: &quot;&quot;, value: &quot;&quot;}.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L82">interfaces/cg-select.interface.ts:82</a></li></ul></aside></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="current tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-interface tsd-parent-kind-module"><a href="interfaces_cg_select_interface.ICgSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>ICg<wbr/>Select</span></a>
+<ul>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#closeOnSelect" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>close<wbr/>On<wbr/>Select?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#darkTheme" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>dark<wbr/>Theme?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#event" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>event?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#items" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>items?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#lable" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>lable?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#language" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>language?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#listDisplayMode" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>list<wbr/>Display<wbr/>Mode?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#multiselect" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>multiselect?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#multiselectTag" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>multiselect<wbr/>Tag?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#nativeSelectMode" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>native<wbr/>Select<wbr/>Mode?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#placeholder" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>placeholder?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#searchMode" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>search<wbr/>Mode?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#selected" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>selected?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#selector" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>selector?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#styles" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>styles?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.ICgSelect.html#url" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>url?</a></li></ul></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/interfaces/interfaces_cg_select_interface.IStyle.html

@@ -0,0 +1,138 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>IStyle | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-select.interface</a></li>
+<li><a href="interfaces_cg_select_interface.IStyle.html">IStyle</a></li></ul>
+<h1>Interface IStyle</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Style Settings.</p>
+</div></section>
+<section class="tsd-panel tsd-hierarchy">
+<h4>Hierarchy</h4>
+<ul class="tsd-hierarchy">
+<li><span class="target">IStyle</span></li></ul></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L100">interfaces/cg-select.interface.ts:100</a></li></ul></aside>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary">
+<h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex=0><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M1.5 5.50969L8 11.6609L14.5 5.50969L12.5466 3.66086L8 7.96494L3.45341 3.66086L1.5 5.50969Z" fill="var(--color-text)"></path></svg> Index</h5></summary>
+<div class="tsd-accordion-details">
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Properties</h3>
+<div class="tsd-index-list"><a href="interfaces_cg_select_interface.IStyle.html#caret" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF984D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-1024-path"></rect><path d="M9.354 16V7.24H12.174C12.99 7.24 13.638 7.476 14.118 7.948C14.606 8.412 14.85 9.036 14.85 9.82C14.85 10.604 14.606 11.232 14.118 11.704C13.638 12.168 12.99 12.4 12.174 12.4H10.434V16H9.354ZM10.434 11.428H12.174C12.646 11.428 13.022 11.284 13.302 10.996C13.59 10.7 13.734 10.308 13.734 9.82C13.734 9.324 13.59 8.932 13.302 8.644C13.022 8.356 12.646 8.212 12.174 8.212H10.434V11.428Z" fill="var(--color-text)" id="icon-1024-text"></path></svg><span>caret?</span></a>
+<a href="interfaces_cg_select_interface.IStyle.html#chips" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>chips?</span></a>
+<a href="interfaces_cg_select_interface.IStyle.html#head" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>head?</span></a>
+<a href="interfaces_cg_select_interface.IStyle.html#lable" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>lable?</span></a>
+<a href="interfaces_cg_select_interface.IStyle.html#list" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>list?</span></a>
+<a href="interfaces_cg_select_interface.IStyle.html#placeholder" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>placeholder?</span></a>
+<a href="interfaces_cg_select_interface.IStyle.html#search" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>search?</span></a>
+</div></section></div></details></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Properties</h2>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="caret" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>caret</span><a href="#caret" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></h3>
+<div class="tsd-signature">caret<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">object</span></div>
+<div class="tsd-comment tsd-typography"><p>Carriage customization.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L110">interfaces/cg-select.interface.ts:110</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="chips" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>chips</span><a href="#chips" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">chips<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">object</span></div>
+<div class="tsd-comment tsd-typography"><p>Chips customization with selected elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L135">interfaces/cg-select.interface.ts:135</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="head" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>head</span><a href="#head" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">head<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">object</span></div>
+<div class="tsd-comment tsd-typography"><p>Select button customization.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L105">interfaces/cg-select.interface.ts:105</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="lable" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>lable</span><a href="#lable" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">lable<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">object</span></div>
+<div class="tsd-comment tsd-typography"><p>Lable select customization.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L120">interfaces/cg-select.interface.ts:120</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="list" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>list</span><a href="#list" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">list<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">object</span></div>
+<div class="tsd-comment tsd-typography"><p>Sheet customization with a selection of elements.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L125">interfaces/cg-select.interface.ts:125</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="placeholder" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>placeholder</span><a href="#placeholder" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">placeholder<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">object</span></div>
+<div class="tsd-comment tsd-typography"><p>Customization placeholder.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L115">interfaces/cg-select.interface.ts:115</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="search" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>search</span><a href="#search" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">search<span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">object</span></div>
+<div class="tsd-comment tsd-typography"><p>Search customization.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L130">interfaces/cg-select.interface.ts:130</a></li></ul></aside></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="current tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-interface tsd-parent-kind-module"><a href="interfaces_cg_select_interface.IStyle.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>IStyle</span></a>
+<ul>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.IStyle.html#caret" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>caret?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.IStyle.html#chips" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>chips?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.IStyle.html#head" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>head?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.IStyle.html#lable" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>lable?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.IStyle.html#list" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>list?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.IStyle.html#placeholder" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>placeholder?</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_cg_select_interface.IStyle.html#search" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>search?</a></li></ul></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/interfaces/interfaces_items_interface.IItems.html

@@ -0,0 +1,102 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>IItems | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li><a href="interfaces_items_interface.IItems.html">IItems</a></li></ul>
+<h1>Interface IItems</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Element structure.</p>
+</div></section>
+<section class="tsd-panel tsd-hierarchy">
+<h4>Hierarchy</h4>
+<ul class="tsd-hierarchy">
+<li><span class="target">IItems</span></li></ul></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/items.interface.ts#L4">interfaces/items.interface.ts:4</a></li></ul></aside>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary">
+<h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex=0><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M1.5 5.50969L8 11.6609L14.5 5.50969L12.5466 3.66086L8 7.96494L3.45341 3.66086L1.5 5.50969Z" fill="var(--color-text)"></path></svg> Index</h5></summary>
+<div class="tsd-accordion-details">
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Properties</h3>
+<div class="tsd-index-list"><a href="interfaces_items_interface.IItems.html#id" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF984D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-1024-path"></rect><path d="M9.354 16V7.24H12.174C12.99 7.24 13.638 7.476 14.118 7.948C14.606 8.412 14.85 9.036 14.85 9.82C14.85 10.604 14.606 11.232 14.118 11.704C13.638 12.168 12.99 12.4 12.174 12.4H10.434V16H9.354ZM10.434 11.428H12.174C12.646 11.428 13.022 11.284 13.302 10.996C13.59 10.7 13.734 10.308 13.734 9.82C13.734 9.324 13.59 8.932 13.302 8.644C13.022 8.356 12.646 8.212 12.174 8.212H10.434V11.428Z" fill="var(--color-text)" id="icon-1024-text"></path></svg><span>id</span></a>
+<a href="interfaces_items_interface.IItems.html#title" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>title</span></a>
+<a href="interfaces_items_interface.IItems.html#value" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>value</span></a>
+</div></section></div></details></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Properties</h2>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="id" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>id</span><a href="#id" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></h3>
+<div class="tsd-signature">id<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Unique item ID.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/items.interface.ts#L9">interfaces/items.interface.ts:9</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="title" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>title</span><a href="#title" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">title<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Element text value.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/items.interface.ts#L14">interfaces/items.interface.ts:14</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="value" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>value</span><a href="#value" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">value<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">number</span></div>
+<div class="tsd-comment tsd-typography"><p>Sequence number, or other information.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/items.interface.ts#L19">interfaces/items.interface.ts:19</a></li></ul></aside></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="current tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-interface tsd-parent-kind-module"><a href="interfaces_items_interface.IItems.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>IItems</span></a>
+<ul>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_items_interface.IItems.html#id" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>id</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_items_interface.IItems.html#title" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>title</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_items_interface.IItems.html#value" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>value</a></li></ul></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/interfaces/interfaces_language_interface.ILanguage.html

@@ -0,0 +1,102 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>ILanguage | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li><a href="interfaces_language_interface.ILanguage.html">ILanguage</a></li></ul>
+<h1>Interface ILanguage</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography">
+<h3>Description</h3><p>Settings for adding languages.</p>
+</div></section>
+<section class="tsd-panel tsd-hierarchy">
+<h4>Hierarchy</h4>
+<ul class="tsd-hierarchy">
+<li><span class="target">ILanguage</span></li></ul></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/language.interface.ts#L4">interfaces/language.interface.ts:4</a></li></ul></aside>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<details class="tsd-index-content tsd-index-accordion" open><summary class="tsd-accordion-summary tsd-index-summary">
+<h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex=0><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M1.5 5.50969L8 11.6609L14.5 5.50969L12.5466 3.66086L8 7.96494L3.45341 3.66086L1.5 5.50969Z" fill="var(--color-text)"></path></svg> Index</h5></summary>
+<div class="tsd-accordion-details">
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Properties</h3>
+<div class="tsd-index-list"><a href="interfaces_language_interface.ILanguage.html#placeholder" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="#FF984D" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="12" id="icon-1024-path"></rect><path d="M9.354 16V7.24H12.174C12.99 7.24 13.638 7.476 14.118 7.948C14.606 8.412 14.85 9.036 14.85 9.82C14.85 10.604 14.606 11.232 14.118 11.704C13.638 12.168 12.99 12.4 12.174 12.4H10.434V16H9.354ZM10.434 11.428H12.174C12.646 11.428 13.022 11.284 13.302 10.996C13.59 10.7 13.734 10.308 13.734 9.82C13.734 9.324 13.59 8.932 13.302 8.644C13.022 8.356 12.646 8.212 12.174 8.212H10.434V11.428Z" fill="var(--color-text)" id="icon-1024-text"></path></svg><span>placeholder</span></a>
+<a href="interfaces_language_interface.ILanguage.html#selectPlaceholder" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>select<wbr/>Placeholder</span></a>
+<a href="interfaces_language_interface.ILanguage.html#textInListSearch" class="tsd-index-link tsd-kind-property tsd-parent-kind-interface"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg><span>text<wbr/>In<wbr/>List<wbr/>Search</span></a>
+</div></section></div></details></section></section>
+<section class="tsd-panel-group tsd-member-group">
+<h2>Properties</h2>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="placeholder" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>placeholder</span><a href="#placeholder" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" id="icon-anchor-a"></path><path d="M10 14a3.5 3.5 0 0 0 5 0l4 -4a3.5 3.5 0 0 0 -5 -5l-.5 .5" id="icon-anchor-b"></path><path d="M14 10a3.5 3.5 0 0 0 -5 0l-4 4a3.5 3.5 0 0 0 5 5l.5 -.5" id="icon-anchor-c"></path></svg></a></h3>
+<div class="tsd-signature">placeholder<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Search text.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/language.interface.ts#L9">interfaces/language.interface.ts:9</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="selectPlaceholder" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>select<wbr/>Placeholder</span><a href="#selectPlaceholder" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">select<wbr/>Placeholder<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Default Select Text if no placeholder or selected element is specified.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/language.interface.ts#L14">interfaces/language.interface.ts:14</a></li></ul></aside></section>
+<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-interface"><a id="textInListSearch" class="tsd-anchor"></a>
+<h3 class="tsd-anchor-link"><span>text<wbr/>In<wbr/>List<wbr/>Search</span><a href="#textInListSearch" aria-label="Permalink" class="tsd-anchor-icon"><svg class="icon icon-tabler icon-tabler-link" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><use href="#icon-anchor-a"></use><use href="#icon-anchor-b"></use><use href="#icon-anchor-c"></use></svg></a></h3>
+<div class="tsd-signature">text<wbr/>In<wbr/>List<wbr/>Search<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div>
+<div class="tsd-comment tsd-typography"><p>Text if no match.</p>
+</div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/language.interface.ts#L19">interfaces/language.interface.ts:19</a></li></ul></aside></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="current tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-interface tsd-parent-kind-module"><a href="interfaces_language_interface.ILanguage.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>ILanguage</span></a>
+<ul>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_language_interface.ILanguage.html#placeholder" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>placeholder</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_language_interface.ILanguage.html#selectPlaceholder" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>select<wbr/>Placeholder</a></li>
+<li class="tsd-kind-property tsd-parent-kind-interface"><a href="interfaces_language_interface.ILanguage.html#textInListSearch" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-1024-path"></use><use href="#icon-1024-text"></use></svg>text<wbr/>In<wbr/>List<wbr/>Search</a></li></ul></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules.html

@@ -0,0 +1,62 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="assets/style.css"/><link rel="stylesheet" href="assets/highlight.css"/><script async src="assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base=".">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<h2>cg-select</h2></div>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Modules</h3>
+<div class="tsd-index-list"><a href="modules/Utils.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-namespace)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-4-path"></rect><path d="M9.33 16V7.24H10.77L13.446 14.74C13.43 14.54 13.41 14.296 13.386 14.008C13.37 13.712 13.354 13.404 13.338 13.084C13.33 12.756 13.326 12.448 13.326 12.16V7.24H14.37V16H12.93L10.266 8.5C10.282 8.692 10.298 8.936 10.314 9.232C10.33 9.52 10.342 9.828 10.35 10.156C10.366 10.476 10.374 10.784 10.374 11.08V16H9.33Z" fill="var(--color-text)" id="icon-4-text"></path></svg><span>Utils</span></a>
+<a href="modules/cg_select.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-4-path"></use><use href="#icon-4-text"></use></svg><span>cg-<wbr/>select</span></a>
+<a href="modules/components_create_element_create_element.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-4-path"></use><use href="#icon-4-text"></use></svg><span>components/create-<wbr/>element/create-<wbr/>element</span></a>
+<a href="modules/components_create_element_create_element_interface.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-4-path"></use><use href="#icon-4-text"></use></svg><span>components/create-<wbr/>element/create-<wbr/>element.interface</span></a>
+<a href="modules/components_utils_urils_interface.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-4-path"></use><use href="#icon-4-text"></use></svg><span>components/utils/urils.interface</span></a>
+<a href="modules/interfaces_cg_select_interface.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-4-path"></use><use href="#icon-4-text"></use></svg><span>interfaces/cg-<wbr/>select.interface</span></a>
+<a href="modules/interfaces_items_interface.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-4-path"></use><use href="#icon-4-text"></use></svg><span>interfaces/items.interface</span></a>
+<a href="modules/interfaces_language_interface.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-4-path"></use><use href="#icon-4-text"></use></svg><span>interfaces/language.interface</span></a>
+<a href="modules/language_language.html" class="tsd-index-link tsd-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-4-path"></use><use href="#icon-4-text"></use></svg><span>language/language</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current selected"><a href="modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="modules/Utils.html">Utils</a></li>
+<li class="selected tsd-kind-module"><a href="modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="assets/main.js"></script></body></html>

docs/modules/Utils.html

@@ -0,0 +1,83 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>Utils | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="Utils.html">Utils</a></li></ul>
+<h1>Module Utils</h1></div>
+<section class="tsd-panel tsd-comment">
+<div class="tsd-comment tsd-typography"><p>Utils module</p>
+</div></section><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/utils.ts#L5">components/utils/utils.ts:5</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Functions</h3>
+<div class="tsd-index-list"><a href="../functions/Utils.checkItemStruct.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg><span>check<wbr/>Item<wbr/>Struct</span></a>
+<a href="../functions/Utils.clearSelect.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>clear<wbr/>Select</span></a>
+<a href="../functions/Utils.createSelected.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>create<wbr/>Selected</span></a>
+<a href="../functions/Utils.customStyles.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>custom<wbr/>Styles</span></a>
+<a href="../functions/Utils.customStylesFormat.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>custom<wbr/>Styles<wbr/>Format</span></a>
+<a href="../functions/Utils.getFormatItem.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>get<wbr/>Format<wbr/>Item</span></a>
+<a href="../functions/Utils.getSelectText.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>get<wbr/>Select<wbr/>Text</span></a>
+<a href="../functions/Utils.nativeOptionMultiple.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>native<wbr/>Option<wbr/>Multiple</span></a>
+<a href="../functions/Utils.nativeOptionOrdinary.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>native<wbr/>Option<wbr/>Ordinary</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="current selected tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.checkItemStruct.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>check<wbr/>Item<wbr/>Struct</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.clearSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>clear<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.createSelected.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Selected</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.customStyles.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.customStylesFormat.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>custom<wbr/>Styles<wbr/>Format</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.getFormatItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Format<wbr/>Item</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.getSelectText.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>get<wbr/>Select<wbr/>Text</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.nativeOptionMultiple.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Multiple</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/Utils.nativeOptionOrdinary.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>native<wbr/>Option<wbr/>Ordinary</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules/cg_select.html

@@ -0,0 +1,64 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="cg_select.html">cg-select</a></li></ul>
+<h1>Module cg-select</h1></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/cg-select.ts#L1">cg-select.ts:1</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Classes</h3>
+<div class="tsd-index-list"><a href="../classes/cg_select.CGSelect.html" class="tsd-index-link tsd-kind-class tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-class)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-128-path"></rect><path d="M11.898 16.1201C11.098 16.1201 10.466 15.8961 10.002 15.4481C9.53803 15.0001 9.30603 14.3841 9.30603 13.6001V9.64012C9.30603 8.85612 9.53803 8.24012 10.002 7.79212C10.466 7.34412 11.098 7.12012 11.898 7.12012C12.682 7.12012 13.306 7.34812 13.77 7.80412C14.234 8.25212 14.466 8.86412 14.466 9.64012H13.386C13.386 9.14412 13.254 8.76412 12.99 8.50012C12.734 8.22812 12.37 8.09212 11.898 8.09212C11.426 8.09212 11.054 8.22412 10.782 8.48812C10.518 8.75212 10.386 9.13212 10.386 9.62812V13.6001C10.386 14.0961 10.518 14.4801 10.782 14.7521C11.054 15.0161 11.426 15.1481 11.898 15.1481C12.37 15.1481 12.734 15.0161 12.99 14.7521C13.254 14.4801 13.386 14.0961 13.386 13.6001H14.466C14.466 14.3761 14.234 14.9921 13.77 15.4481C13.306 15.8961 12.682 16.1201 11.898 16.1201Z" fill="var(--color-text)" id="icon-128-text"></path></svg><span>CGSelect</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="current selected tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-class tsd-parent-kind-module"><a href="../classes/cg_select.CGSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-128-path"></use><use href="#icon-128-text"></use></svg>CGSelect</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules/components_create_element_create_element.html

@@ -0,0 +1,70 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>components/create-element/create-element | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="components_create_element_create_element.html">components/create-element/create-element</a></li></ul>
+<h1>Module components/create-element/create-element</h1></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.ts#L1">components/create-element/create-element.ts:1</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Functions</h3>
+<div class="tsd-index-list"><a href="../functions/components_create_element_create_element.createBreadCrumb.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-function)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-64-path"></rect><path d="M9.39 16V7.24H14.55V8.224H10.446V11.128H14.238V12.112H10.47V16H9.39Z" fill="var(--color-text)" id="icon-64-text"></path></svg><span>create<wbr/>Bread<wbr/>Crumb</span></a>
+<a href="../functions/components_create_element_create_element.createInputSearch.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>create<wbr/>Input<wbr/>Search</span></a>
+<a href="../functions/components_create_element_create_element.createNativeSelect.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>create<wbr/>Native<wbr/>Select</span></a>
+<a href="../functions/components_create_element_create_element.createNativeSelectOption.html" class="tsd-index-link tsd-kind-function tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg><span>create<wbr/>Native<wbr/>Select<wbr/>Option</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="current selected tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/components_create_element_create_element.createBreadCrumb.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Bread<wbr/>Crumb</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/components_create_element_create_element.createInputSearch.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Input<wbr/>Search</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/components_create_element_create_element.createNativeSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select</a></li>
+<li class="tsd-kind-function tsd-parent-kind-module"><a href="../functions/components_create_element_create_element.createNativeSelectOption.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-64-path"></use><use href="#icon-64-text"></use></svg>create<wbr/>Native<wbr/>Select<wbr/>Option</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules/components_create_element_create_element_interface.html

@@ -0,0 +1,64 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>components/create-element/create-element.interface | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="components_create_element_create_element_interface.html">components/create-element/create-element.interface</a></li></ul>
+<h1>Module components/create-element/create-element.interface</h1></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/create-element/create-element.interface.ts#L1">components/create-element/create-element.interface.ts:1</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Interfaces</h3>
+<div class="tsd-index-list"><a href="../interfaces/components_create_element_create_element_interface.ICreateBreadCrumb.html" class="tsd-index-link tsd-kind-interface tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>ICreate<wbr/>Bread<wbr/>Crumb</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="current selected tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/components_create_element_create_element_interface.ICreateBreadCrumb.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg>ICreate<wbr/>Bread<wbr/>Crumb</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules/components_utils_urils_interface.html

@@ -0,0 +1,66 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>components/utils/urils.interface | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li></ul>
+<h1>Module components/utils/urils.interface</h1></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/components/utils/urils.interface.ts#L1">components/utils/urils.interface.ts:1</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Interfaces</h3>
+<div class="tsd-index-list"><a href="../interfaces/components_utils_urils_interface.IDataItem.html" class="tsd-index-link tsd-kind-interface tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>IData<wbr/>Item</span></a>
+<a href="../interfaces/components_utils_urils_interface.ISelectedItems.html" class="tsd-index-link tsd-kind-interface tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg><span>ISelected<wbr/>Items</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="current selected tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/components_utils_urils_interface.IDataItem.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg>IData<wbr/>Item</a></li>
+<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/components_utils_urils_interface.ISelectedItems.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg>ISelected<wbr/>Items</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules/interfaces_cg_select_interface.html

@@ -0,0 +1,66 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>interfaces/cg-select.interface | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="interfaces_cg_select_interface.html">interfaces/cg-select.interface</a></li></ul>
+<h1>Module interfaces/cg-select.interface</h1></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/cg-select.interface.ts#L1">interfaces/cg-select.interface.ts:1</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Interfaces</h3>
+<div class="tsd-index-list"><a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html" class="tsd-index-link tsd-kind-interface tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>ICg<wbr/>Select</span></a>
+<a href="../interfaces/interfaces_cg_select_interface.IStyle.html" class="tsd-index-link tsd-kind-interface tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg><span>IStyle</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="current selected tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/interfaces_cg_select_interface.ICgSelect.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg>ICg<wbr/>Select</a></li>
+<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/interfaces_cg_select_interface.IStyle.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg>IStyle</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules/interfaces_items_interface.html

@@ -0,0 +1,64 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>interfaces/items.interface | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="interfaces_items_interface.html">interfaces/items.interface</a></li></ul>
+<h1>Module interfaces/items.interface</h1></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/items.interface.ts#L4">interfaces/items.interface.ts:4</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Interfaces</h3>
+<div class="tsd-index-list"><a href="../interfaces/interfaces_items_interface.IItems.html" class="tsd-index-link tsd-kind-interface tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>IItems</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="current selected tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/interfaces_items_interface.IItems.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg>IItems</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules/interfaces_language_interface.html

@@ -0,0 +1,64 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>interfaces/language.interface | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="interfaces_language_interface.html">interfaces/language.interface</a></li></ul>
+<h1>Module interfaces/language.interface</h1></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/interfaces/language.interface.ts#L4">interfaces/language.interface.ts:4</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Interfaces</h3>
+<div class="tsd-index-list"><a href="../interfaces/interfaces_language_interface.ILanguage.html" class="tsd-index-link tsd-kind-interface tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-interface)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-256-path"></rect><path d="M9.51 16V15.016H11.298V8.224H9.51V7.24H14.19V8.224H12.402V15.016H14.19V16H9.51Z" fill="var(--color-text)" id="icon-256-text"></path></svg><span>ILanguage</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="current selected tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-interface tsd-parent-kind-module"><a href="../interfaces/interfaces_language_interface.ILanguage.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-256-path"></use><use href="#icon-256-text"></use></svg>ILanguage</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/modules/language_language.html

@@ -0,0 +1,66 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>language/language | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="language_language.html">language/language</a></li></ul>
+<h1>Module language/language</h1></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/language/language.ts#L1">language/language.ts:1</a></li></ul></aside>
+<section class="tsd-panel-group">
+<section class="tsd-panel tsd-typography"></section></section>
+<section class="tsd-panel-group tsd-index-group">
+<section class="tsd-panel tsd-index-panel">
+<h3 class="tsd-index-heading uppercase">Index</h3>
+<section class="tsd-index-section">
+<h3 class="tsd-index-heading">Variables</h3>
+<div class="tsd-index-list"><a href="../variables/language_language.en.html" class="tsd-index-link tsd-kind-variable tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-variable)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-32-path"></rect><path d="M11.106 16L8.85 7.24H9.966L11.454 13.192C11.558 13.608 11.646 13.996 11.718 14.356C11.79 14.708 11.842 14.976 11.874 15.16C11.906 14.976 11.954 14.708 12.018 14.356C12.09 13.996 12.178 13.608 12.282 13.192L13.758 7.24H14.85L12.582 16H11.106Z" fill="var(--color-text)" id="icon-32-text"></path></svg><span>en</span></a>
+<a href="../variables/language_language.ru.html" class="tsd-index-link tsd-kind-variable tsd-parent-kind-module"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-32-path"></use><use href="#icon-32-text"></use></svg><span>ru</span></a>
+</div></section></section></section></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="current selected tsd-kind-module"><a href="language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-variable tsd-parent-kind-module"><a href="../variables/language_language.en.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-32-path"></use><use href="#icon-32-text"></use></svg>en</a></li>
+<li class="tsd-kind-variable tsd-parent-kind-module"><a href="../variables/language_language.ru.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-32-path"></use><use href="#icon-32-text"></use></svg>ru</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/variables/language_language.en.html

@@ -0,0 +1,58 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>en | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/language_language.html">language/language</a></li>
+<li><a href="language_language.en.html">en</a></li></ul>
+<h1>Variable en<code class="tsd-tag ts-flagConst">Const</code> </h1></div>
+<div class="tsd-signature">en<span class="tsd-signature-symbol">:</span> <a href="../interfaces/interfaces_language_interface.ILanguage.html" class="tsd-signature-type" data-tsd-kind="Interface">ILanguage</a><span class="tsd-signature-symbol"> = ...</span></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/language/language.ts#L9">language/language.ts:9</a></li></ul></aside></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="current tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="current tsd-kind-variable tsd-parent-kind-module"><a href="language_language.en.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-variable)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-32-path"></rect><path d="M11.106 16L8.85 7.24H9.966L11.454 13.192C11.558 13.608 11.646 13.996 11.718 14.356C11.79 14.708 11.842 14.976 11.874 15.16C11.906 14.976 11.954 14.708 12.018 14.356C12.09 13.996 12.178 13.608 12.282 13.192L13.758 7.24H14.85L12.582 16H11.106Z" fill="var(--color-text)" id="icon-32-text"></path></svg>en</a></li>
+<li class="tsd-kind-variable tsd-parent-kind-module"><a href="language_language.ru.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-32-path"></use><use href="#icon-32-text"></use></svg>ru</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

docs/variables/language_language.ru.html

@@ -0,0 +1,58 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>ru | cg-select</title><meta name="description" content="Documentation for cg-select"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script async src="../assets/search.js" id="search-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os"</script><header class="tsd-page-toolbar">
+<div class="tsd-toolbar-contents container">
+<div class="table-cell" id="tsd-search" data-base="..">
+<div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M15.7824 13.833L12.6666 10.7177C12.5259 10.5771 12.3353 10.499 12.1353 10.499H11.6259C12.4884 9.39596 13.001 8.00859 13.001 6.49937C13.001 2.90909 10.0914 0 6.50048 0C2.90959 0 0 2.90909 0 6.49937C0 10.0896 2.90959 12.9987 6.50048 12.9987C8.00996 12.9987 9.39756 12.4863 10.5008 11.6239V12.1332C10.5008 12.3332 10.5789 12.5238 10.7195 12.6644L13.8354 15.7797C14.1292 16.0734 14.6042 16.0734 14.8948 15.7797L15.7793 14.8954C16.0731 14.6017 16.0731 14.1267 15.7824 13.833ZM6.50048 10.499C4.29094 10.499 2.50018 8.71165 2.50018 6.49937C2.50018 4.29021 4.28781 2.49976 6.50048 2.49976C8.71001 2.49976 10.5008 4.28708 10.5008 6.49937C10.5008 8.70852 8.71314 10.499 6.50048 10.499Z" fill="var(--color-text)"></path></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div>
+<div class="field">
+<div id="tsd-toolbar-links"></div></div>
+<ul class="results">
+<li class="state loading">Preparing search index...</li>
+<li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">cg-select</a></div>
+<div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><rect x="1" y="3" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="7" width="14" height="2" fill="var(--color-text)"></rect><rect x="1" y="11" width="14" height="2" fill="var(--color-text)"></rect></svg></a></div></div></header>
+<div class="container container-main">
+<div class="col-8 col-content">
+<div class="tsd-page-title">
+<ul class="tsd-breadcrumb">
+<li><a href="../modules.html">cg-select</a></li>
+<li><a href="../modules/language_language.html">language/language</a></li>
+<li><a href="language_language.ru.html">ru</a></li></ul>
+<h1>Variable ru<code class="tsd-tag ts-flagConst">Const</code> </h1></div>
+<div class="tsd-signature">ru<span class="tsd-signature-symbol">:</span> <a href="../interfaces/interfaces_language_interface.ILanguage.html" class="tsd-signature-type" data-tsd-kind="Interface">ILanguage</a><span class="tsd-signature-symbol"> = ...</span></div><aside class="tsd-sources">
+<ul>
+<li>Defined in <a href="https://github.com/apuc/cg-select/blob/15f73b1/src/language/language.ts#L3">language/language.ts:3</a></li></ul></aside></div>
+<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
+<div class="tsd-navigation settings">
+<details class="tsd-index-accordion"><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Settings</h3></summary>
+<div class="tsd-accordion-details">
+<div class="tsd-filter-visibility">
+<h4 class="uppercase">Member Visibility</h4><form>
+<ul id="tsd-filter-options">
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-private" name="private"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Private</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
+<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></form></div>
+<div class="tsd-theme-toggle">
+<h4 class="uppercase">Theme</h4><select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
+<nav class="tsd-navigation primary">
+<details class="tsd-index-accordion" open><summary class="tsd-accordion-summary">
+<h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M4.93896 8.531L12 15.591L19.061 8.531L16.939 6.409L12 11.349L7.06098 6.409L4.93896 8.531Z" fill="var(--color-text)"></path></svg> Modules</h3></summary>
+<div class="tsd-accordion-details">
+<ul>
+<li class="current"><a href="../modules.html">cg-<wbr/>select</a>
+<ul>
+<li class="tsd-kind-module"><a href="../modules/Utils.html">Utils</a></li>
+<li class="tsd-kind-module"><a href="../modules/cg_select.html">cg-<wbr/>select</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element.html">components/create-<wbr/>element/create-<wbr/>element</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_create_element_create_element_interface.html">components/create-<wbr/>element/create-<wbr/>element.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/components_utils_urils_interface.html">components/utils/urils.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_cg_select_interface.html">interfaces/cg-<wbr/>select.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_items_interface.html">interfaces/items.interface</a></li>
+<li class="tsd-kind-module"><a href="../modules/interfaces_language_interface.html">interfaces/language.interface</a></li>
+<li class="current tsd-kind-module"><a href="../modules/language_language.html">language/language</a></li></ul></li></ul></div></details></nav>
+<nav class="tsd-navigation secondary menu-sticky">
+<ul>
+<li class="tsd-kind-variable tsd-parent-kind-module"><a href="language_language.en.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><rect fill="var(--color-icon-background)" stroke="var(--color-ts-variable)" stroke-width="1.5" x="1" y="1" width="22" height="22" rx="6" id="icon-32-path"></rect><path d="M11.106 16L8.85 7.24H9.966L11.454 13.192C11.558 13.608 11.646 13.996 11.718 14.356C11.79 14.708 11.842 14.976 11.874 15.16C11.906 14.976 11.954 14.708 12.018 14.356C12.09 13.996 12.178 13.608 12.282 13.192L13.758 7.24H14.85L12.582 16H11.106Z" fill="var(--color-text)" id="icon-32-text"></path></svg>en</a></li>
+<li class="current tsd-kind-variable tsd-parent-kind-module"><a href="language_language.ru.html" class="tsd-index-link"><svg class="tsd-kind-icon" width="24" height="24" viewBox="0 0 24 24"><use href="#icon-32-path"></use><use href="#icon-32-text"></use></svg>ru</a></li></ul></nav></div></div>
+<div class="container tsd-generator">
+<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></div>
+<div class="overlay"></div><script src="../assets/main.js"></script></body></html>

example/index.html

@@ -46,7 +46,7 @@
           <button type="button" class="check-code" id="first">Посмотреть код</button>
           <code id="codeFirst">
             <pre>
-              <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">DropDown</span>({
+              <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">CGSelect</span>({
                 selector: <span class="code__string">'.cg-dropdown_one',</span> 
                 placeholder: <span class="code__string">'Выберите авто',</span> 
                 lable: <span class="code__string">'EXAMPLE',</span> 
@@ -89,7 +89,7 @@
           <button type="button" class="check-code" id="Native">Посмотреть код</button>
           <code id="codeNative">
             <pre>
-              <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">DropDown</span>({
+              <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">CGSelect</span>({
                 selector: <span class="code__string">'.cg-dropdown_one',</span> 
                 placeholder: <span class="code__string">'Выберите авто',</span> 
                 nativeSelectMode: <span class="code__keyword">true,</span>
@@ -133,7 +133,7 @@
 
           <code id="codeSix">
             <pre>
-              <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">DropDown</span>({
+              <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">CGSelect</span>({
                 selector: <span class="code__string">'.cg-dropdown_listDisplayMode',</span> 
                 placeholder: <span class="code__string">'Выберите авто',</span> 
                 listDisplayMode: <span class="code__keyword">true,</span>
@@ -171,7 +171,7 @@
 
         <code id="codeSecond">
           <pre>
-            <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">DropDown</span>({
+            <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">CGSelect</span>({
               selector: <span class="code__string">'.cg-dropdown_three',</span> 
               placeholder: <span class="code__string">'URL',</span> 
               url: <span class="code__string">'https://jsonplaceholder.typicode.com/users',</span>            
@@ -201,7 +201,7 @@
 
         <code id="codeThird">
           <pre>
-            <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">DropDown</span>({
+            <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">CGSelect</span>({
               selector: <span class="code__string">'.cg-dropdown_categories',</span> 
               placeholder: <span class="code__string">'Выберите регион',</span> 
               searchMode: <span class="code__keyword">true,</span>
@@ -267,7 +267,7 @@
 
         <code id="codeFourth">
           <pre>
-            <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">DropDown</span>({
+            <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">CGSelect</span>({
               selector: <span class="code__string">'.cg-dropdown_usedBtn',</span> 
               placeholder: <span class="code__string">'Выберите авто',</span> 
               searchMode: <span class="code__keyword">true,</span>
@@ -323,7 +323,7 @@
         <button type="button" class="check-code" id="fifth">Посмотреть код</button>
         <code id="codeFifth">
           <pre>
-            <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">DropDown</span>({
+            <span class="code__keyword">const</span> <span class="code__var">dropdown</span> = <span class="code__keyword">new</span> <span class="code__class">CGSelect</span>({
               selector: <span class="code__string">'.cg-dropdown_checkboxDisable',</span> 
               placeholder: <span class="code__string">'Выберите авто',</span> 
               searchMode: <span class="code__keyword">true,</span>

example/index.js

@@ -1,8 +1,8 @@
-import DropDown from '../index';
+import { CGSelect } from '../src/cg-select';
 import './example';
 
 // ------------------------------Обычный селект--------------------
-const dropdown = new DropDown({
+const dropdown = new CGSelect({
   selector: '.cg-dropdown_one',
   placeholder: 'Выберите авто',
   lable: 'EXAMPLE',
@@ -28,7 +28,7 @@ const dropdown = new DropDown({
 });
 
 // ------------------------------NativeSelect-----------------------
-const dropdownNativeSelect = new DropDown({
+const dropdownNativeSelect = new CGSelect({
   selector: '.cg-dropdown_selectNative',
   placeholder: 'Выберите авто',
   nativeSelectMode: true,
@@ -43,7 +43,7 @@ const dropdownNativeSelect = new DropDown({
     'MAN',
     'Ferari',
     'Kamaz',
-    'Ural'
+    'Ural',
   ],
   styles: {
     head: {
@@ -56,7 +56,7 @@ const dropdownNativeSelect = new DropDown({
 });
 
 // ------------------------------listDisplayMode--------------------
-const dropdownlistDisplayMode = new DropDown({
+const dropdownlistDisplayMode = new CGSelect({
   selector: '.cg-dropdown_listDisplayMode',
   placeholder: 'Выберите авто',
   listDisplayMode: true,
@@ -81,26 +81,8 @@ const dropdownlistDisplayMode = new DropDown({
   },
 });
 
-// ------------------------------URL--------------------
-const dropdown3 = new DropDown({
-  selector: '.cg-dropdown_three',
-  placeholder: 'URL',
-  url: 'https://jsonplaceholder.typicode.com/users',
-  searchMode: true,
-  darkTheme: false,
-  language: 'ru',
-  styles: {
-    head: {
-      width: '830px',
-    },
-    list: {
-      width: '824px',
-    },
-  },
-});
-
 // --------------------------------Категории--------------------------
-const dropdown4 = new DropDown({
+const dropdown4 = new CGSelect({
   selector: '.cg-dropdown_categories',
   placeholder: 'Выберите регион',
   searchMode: true,
@@ -145,7 +127,7 @@ const dropdown4 = new DropDown({
 });
 
 //----------------управление с помощью кнопок----------------------------------
-const dropdownBtn = new DropDown({
+const dropdownBtn = new CGSelect({
   selector: '.cg-dropdown_usedBtn',
   placeholder: 'Выберите авто',
   searchMode: true,
@@ -192,7 +174,7 @@ dropdownBtn.buttonControl(buttonOpen, 'open');
 dropdownBtn.buttonControl(buttonClose, 'close');
 
 //-------------------------Функция Disabled----------------------------------
-const dropdownDisabled = new DropDown({
+const dropdownDisabled = new CGSelect({
   selector: '.cg-dropdown_checkboxDisable',
   placeholder: 'Выберите авто',
   searchMode: true,
@@ -230,3 +212,22 @@ chbox.addEventListener('click', () => {
     dropdownDisabled.disabled(true);
   }
 });
+
+// ------------------------------URL--------------------
+const dropdown3 = new CGSelect({
+  selector: '.cg-dropdown_three',
+  placeholder: 'URL',
+  url: 'https://jsonplaceholder.typicode.com/todos',
+  searchMode: true,
+  darkTheme: false,
+  language: 'ru',
+  styles: {
+    head: {
+      width: '830px',
+    },
+    list: {
+      width: '824px',
+    },
+  },
+  multiselect: true,
+});

index.js

@@ -1,3 +1,3 @@
-import { DropDown } from './src/cg-select';
+import { CGSelect } from './src/cg-select';
 
-export default DropDown;
+export default CGSelect;

package-lock.json

@@ -1,16 +1,19 @@
 {
   "name": "cg-select",
-  "version": "0.1.171",
+  "version": "0.2.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "cg-select",
-      "version": "0.1.171",
+      "version": "0.2.1",
       "license": "ISC",
       "dependencies": {
         "@parcel/optimizer-css": "^2.8.0",
-        "gh-pages": "^4.0.0"
+        "@types/prettier": "^2.7.2",
+        "gh-pages": "^4.0.0",
+        "typedoc": "^0.23.24",
+        "typescript": "^4.9.4"
       },
       "devDependencies": {
         "@parcel/transformer-sass": "^2.7.0",
@@ -799,6 +802,304 @@
         "url": "https://opencollective.com/parcel"
       }
     },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/core/-/core-2.8.2.tgz",
+      "integrity": "sha512-ZGuq6p+Lzx6fgufaVsuOBwgpU3hgskTvIDIMdIDi9gOZyhGPK7U2srXdX+VYUL5ZSGbX04/P6QlB9FMAXK+nEg==",
+      "peer": true,
+      "dependencies": {
+        "@mischnic/json-sourcemap": "^0.1.0",
+        "@parcel/cache": "2.8.2",
+        "@parcel/diagnostic": "2.8.2",
+        "@parcel/events": "2.8.2",
+        "@parcel/fs": "2.8.2",
+        "@parcel/graph": "2.8.2",
+        "@parcel/hash": "2.8.2",
+        "@parcel/logger": "2.8.2",
+        "@parcel/package-manager": "2.8.2",
+        "@parcel/plugin": "2.8.2",
+        "@parcel/source-map": "^2.1.1",
+        "@parcel/types": "2.8.2",
+        "@parcel/utils": "2.8.2",
+        "@parcel/workers": "2.8.2",
+        "abortcontroller-polyfill": "^1.1.9",
+        "base-x": "^3.0.8",
+        "browserslist": "^4.6.6",
+        "clone": "^2.1.1",
+        "dotenv": "^7.0.0",
+        "dotenv-expand": "^5.1.0",
+        "json5": "^2.2.0",
+        "msgpackr": "^1.5.4",
+        "nullthrows": "^1.1.1",
+        "semver": "^5.7.1"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/cache": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/cache/-/cache-2.8.2.tgz",
+      "integrity": "sha512-kiyoOgh1RXp5qp+wlb8Pi/Z7o9D82Oj5RlHnKSAauyR7jgnI8Vq8JTeBmlLqrf+kHxcDcp2p86hidSeANhlQNg==",
+      "peer": true,
+      "dependencies": {
+        "@parcel/fs": "2.8.2",
+        "@parcel/logger": "2.8.2",
+        "@parcel/utils": "2.8.2",
+        "lmdb": "2.5.2"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "peerDependencies": {
+        "@parcel/core": "^2.8.2"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/codeframe": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/codeframe/-/codeframe-2.8.2.tgz",
+      "integrity": "sha512-U2GT9gq1Zs3Gr83j8JIs10bLbGOHFl57Y8D57nrdR05F4iilV/UR6K7jkhdoiFc9WiHh3ewvrko5+pSdAVFPgQ==",
+      "peer": true,
+      "dependencies": {
+        "chalk": "^4.1.0"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/diagnostic": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/diagnostic/-/diagnostic-2.8.2.tgz",
+      "integrity": "sha512-tGSMwM2rSYLjJW0fCd9gb3tNjfCX/83PZ10/5u2E33UZVkk8OIHsQmsrtq2H2g4oQL3rFxkfEx6nGPDGHwlx7A==",
+      "peer": true,
+      "dependencies": {
+        "@mischnic/json-sourcemap": "^0.1.0",
+        "nullthrows": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/events": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/events/-/events-2.8.2.tgz",
+      "integrity": "sha512-o5etrsKm16y8iRPnjtEBNy4lD0WAigD66yt/RZl9Rx0vPVDly/63Rr9+BrXWVW7bJ7x0S0VVpWW4j3f/qZOsXg==",
+      "peer": true,
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/fs": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/fs/-/fs-2.8.2.tgz",
+      "integrity": "sha512-aN8znbMndSqn1xwZEmMblzqmJsxcExv2jKLl/a9RUHAP7LaPYcPZIykDL3YwGCiKTCzjmRpXnNoyosjFFeBaHA==",
+      "peer": true,
+      "dependencies": {
+        "@parcel/fs-search": "2.8.2",
+        "@parcel/types": "2.8.2",
+        "@parcel/utils": "2.8.2",
+        "@parcel/watcher": "^2.0.7",
+        "@parcel/workers": "2.8.2"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "peerDependencies": {
+        "@parcel/core": "^2.8.2"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/fs-search": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/fs-search/-/fs-search-2.8.2.tgz",
+      "integrity": "sha512-ovQnupRm/MoE/tbgH0Ivknk0QYenXAewjcog+T5umDmUlTmnIRZjURrgDf5Xtw8T/CD5Xv+HmIXpJ9Ez/LzJpw==",
+      "peer": true,
+      "dependencies": {
+        "detect-libc": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/hash": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/hash/-/hash-2.8.2.tgz",
+      "integrity": "sha512-NBnP8Hu0xvAqAfZXRaMM66i8nJyxpKS86BbhwkbgTGbwO1OY87GERliHeREJfcER0E0ZzwNow7MNR8ZDm6IvJQ==",
+      "peer": true,
+      "dependencies": {
+        "detect-libc": "^1.0.3",
+        "xxhash-wasm": "^0.4.2"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/logger": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/logger/-/logger-2.8.2.tgz",
+      "integrity": "sha512-zlhK6QHxfFJMlVJxxcCw0xxBDrYPFPOhMxSD6p6b0z9Yct1l3NdpmfabgjKX8wnZmHokFsil6daleM+M80n2Ew==",
+      "peer": true,
+      "dependencies": {
+        "@parcel/diagnostic": "2.8.2",
+        "@parcel/events": "2.8.2"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/markdown-ansi": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/markdown-ansi/-/markdown-ansi-2.8.2.tgz",
+      "integrity": "sha512-5y29TXgRgG0ybuXaDsDk4Aofg/nDUeAAyVl9/toYCDDhxpQV4yZt8WNPu4PaNYKGLuNgXwsmz+ryZQHGmfbAIQ==",
+      "peer": true,
+      "dependencies": {
+        "chalk": "^4.1.0"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/package-manager": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/package-manager/-/package-manager-2.8.2.tgz",
+      "integrity": "sha512-hx4Imi0yhsSS0aNZkEANPYNNKqBuR63EUNWSxMyHh4ZOvbHoOXnMn1ySGdx6v0oi9HvKymNsLMQ1T5CuI4l4Bw==",
+      "peer": true,
+      "dependencies": {
+        "@parcel/diagnostic": "2.8.2",
+        "@parcel/fs": "2.8.2",
+        "@parcel/logger": "2.8.2",
+        "@parcel/types": "2.8.2",
+        "@parcel/utils": "2.8.2",
+        "@parcel/workers": "2.8.2",
+        "semver": "^5.7.1"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "peerDependencies": {
+        "@parcel/core": "^2.8.2"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/plugin": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/plugin/-/plugin-2.8.2.tgz",
+      "integrity": "sha512-YG7TWfKsoNm72jbz3b3TLec0qJHVkuAWSzGzowdIhX37cP1kRfp6BU2VcH+qYPP/KYJLzhcZa9n3by147mGcxw==",
+      "peer": true,
+      "dependencies": {
+        "@parcel/types": "2.8.2"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/types": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/types/-/types-2.8.2.tgz",
+      "integrity": "sha512-HAYhokWxM10raIhqaYj9VR9eAvJ+xP2sNfQ1IcQybHpq3qblcBe/4jDeuUpwIyKeQ4gorp7xY+q8KDoR20j43w==",
+      "peer": true,
+      "dependencies": {
+        "@parcel/cache": "2.8.2",
+        "@parcel/diagnostic": "2.8.2",
+        "@parcel/fs": "2.8.2",
+        "@parcel/package-manager": "2.8.2",
+        "@parcel/source-map": "^2.1.1",
+        "@parcel/workers": "2.8.2",
+        "utility-types": "^3.10.0"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/utils": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/utils/-/utils-2.8.2.tgz",
+      "integrity": "sha512-Ufax7wZxC9FNsUpR0EU7Z22LEY/q9jjsDTwswctCdfpWb7TE/NudOfM9myycfRvwBVEYN50lPbkt1QltEVnXQQ==",
+      "peer": true,
+      "dependencies": {
+        "@parcel/codeframe": "2.8.2",
+        "@parcel/diagnostic": "2.8.2",
+        "@parcel/hash": "2.8.2",
+        "@parcel/logger": "2.8.2",
+        "@parcel/markdown-ansi": "2.8.2",
+        "@parcel/source-map": "^2.1.1",
+        "chalk": "^4.1.0"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/core/node_modules/@parcel/workers": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/workers/-/workers-2.8.2.tgz",
+      "integrity": "sha512-Eg6CofIrJSNBa2fjXwvnzVLPKwR/6fkfQTFAm3Jl+4JYLVknBtTSFzQNp/Fa+HUEG889H9ucTk2CBi/fVPBAFw==",
+      "peer": true,
+      "dependencies": {
+        "@parcel/diagnostic": "2.8.2",
+        "@parcel/logger": "2.8.2",
+        "@parcel/types": "2.8.2",
+        "@parcel/utils": "2.8.2",
+        "chrome-trace-event": "^1.0.2",
+        "nullthrows": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "peerDependencies": {
+        "@parcel/core": "^2.8.2"
+      }
+    },
     "node_modules/@parcel/optimizer-css/node_modules/@parcel/diagnostic": {
       "version": "2.8.0",
       "resolved": "https://registry.npmjs.org/@parcel/diagnostic/-/diagnostic-2.8.0.tgz",
@@ -864,6 +1165,22 @@
         "url": "https://opencollective.com/parcel"
       }
     },
+    "node_modules/@parcel/optimizer-css/node_modules/@parcel/graph": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/@parcel/graph/-/graph-2.8.2.tgz",
+      "integrity": "sha512-SLEvBQBgfkXgU4EBu30+CNanpuKjcNuEv/x8SwobCF0i3Rk+QKbe7T36bNR7727mao++2Ha69q93Dd9dTPw0kQ==",
+      "peer": true,
+      "dependencies": {
+        "nullthrows": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
     "node_modules/@parcel/optimizer-css/node_modules/@parcel/hash": {
       "version": "2.8.0",
       "resolved": "https://registry.npmjs.org/@parcel/hash/-/hash-2.8.0.tgz",
@@ -1766,11 +2083,15 @@
       "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==",
       "dev": true
     },
+    "node_modules/@types/prettier": {
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.7.2.tgz",
+      "integrity": "sha512-KufADq8uQqo1pYKVIYzfKbJfBAc0sOeXqGbFaSpv8MRmC/zXgowNZmFcbngndGk922QDmOASEXUZCaY48gs4cg=="
+    },
     "node_modules/abortcontroller-polyfill": {
       "version": "1.7.3",
       "resolved": "https://registry.npmjs.org/abortcontroller-polyfill/-/abortcontroller-polyfill-1.7.3.tgz",
-      "integrity": "sha512-zetDJxd89y3X99Kvo4qFx8GKlt6GsvN3UcRZHwU6iFA/0KiOmhkTVhe8oRoTBiTVPZu09x3vCra47+w8Yz1+2Q==",
-      "dev": true
+      "integrity": "sha512-zetDJxd89y3X99Kvo4qFx8GKlt6GsvN3UcRZHwU6iFA/0KiOmhkTVhe8oRoTBiTVPZu09x3vCra47+w8Yz1+2Q=="
     },
     "node_modules/acorn": {
       "version": "8.8.0",
@@ -1853,7 +2174,6 @@
       "version": "3.0.9",
       "resolved": "https://registry.npmjs.org/base-x/-/base-x-3.0.9.tgz",
       "integrity": "sha512-H7JU6iBHTal1gp56aKoaa//YUxEaAOUiydvrV/pILqIHXTtqxSkATOnDA2u+jZ/61sD+L/412+7kzXRtWukhpQ==",
-      "dev": true,
       "dependencies": {
         "safe-buffer": "^5.0.1"
       }
@@ -2023,7 +2343,6 @@
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
       "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==",
-      "dev": true,
       "engines": {
         "node": ">=0.8"
       }
@@ -2211,7 +2530,6 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-7.0.0.tgz",
       "integrity": "sha512-M3NhsLbV1i6HuGzBUH8vXrtxOk+tWmzWKDMbAVSUp3Zsjm7ywFeuwrUXhmhQyRK1q5B5GGy7hcXPbj3bnfZg2g==",
-      "dev": true,
       "engines": {
         "node": ">=6"
       }
@@ -2219,8 +2537,7 @@
     "node_modules/dotenv-expand": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/dotenv-expand/-/dotenv-expand-5.1.0.tgz",
-      "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==",
-      "dev": true
+      "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA=="
     },
     "node_modules/electron-to-chromium": {
       "version": "1.4.251",
@@ -2700,6 +3017,11 @@
         "node": ">=6"
       }
     },
+    "node_modules/jsonc-parser": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.0.tgz",
+      "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w=="
+    },
     "node_modules/jsonfile": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
@@ -2951,6 +3273,11 @@
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
+    "node_modules/lunr": {
+      "version": "2.3.9",
+      "resolved": "https://registry.npmjs.org/lunr/-/lunr-2.3.9.tgz",
+      "integrity": "sha512-zTU3DaZaF3Rt9rhN3uBMGQD3dD2/vFQqnvZCDv4dl5iOzq2IZQqTxu90r4E5J+nP70J3ilqVCrbho2eWaeW8Ow=="
+    },
     "node_modules/make-dir": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
@@ -3012,7 +3339,6 @@
       "version": "4.2.5",
       "resolved": "https://registry.npmjs.org/marked/-/marked-4.2.5.tgz",
       "integrity": "sha512-jPueVhumq7idETHkb203WDD4fMA3yV9emQ5vLwop58lu8bTclMghBWcYAavlDqIEMaisADinV1TooIFCfqOsYQ==",
-      "dev": true,
       "bin": {
         "marked": "bin/marked.js"
       },
@@ -3461,7 +3787,6 @@
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
       "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -3502,6 +3827,16 @@
         "semver": "bin/semver"
       }
     },
+    "node_modules/shiki": {
+      "version": "0.12.1",
+      "resolved": "https://registry.npmjs.org/shiki/-/shiki-0.12.1.tgz",
+      "integrity": "sha512-aieaV1m349rZINEBkjxh2QbBvFFQOlgqYTNtCal82hHj4dDZ76oMlQIX+C7ryerBTDiga3e5NfH6smjdJ02BbQ==",
+      "dependencies": {
+        "jsonc-parser": "^3.2.0",
+        "vscode-oniguruma": "^1.7.0",
+        "vscode-textmate": "^8.0.0"
+      }
+    },
     "node_modules/source-map": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
@@ -3675,6 +4010,57 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/typedoc": {
+      "version": "0.23.24",
+      "resolved": "https://registry.npmjs.org/typedoc/-/typedoc-0.23.24.tgz",
+      "integrity": "sha512-bfmy8lNQh+WrPYcJbtjQ6JEEsVl/ce1ZIXyXhyW+a1vFrjO39t6J8sL/d6FfAGrJTc7McCXgk9AanYBSNvLdIA==",
+      "dependencies": {
+        "lunr": "^2.3.9",
+        "marked": "^4.2.5",
+        "minimatch": "^5.1.2",
+        "shiki": "^0.12.1"
+      },
+      "bin": {
+        "typedoc": "bin/typedoc"
+      },
+      "engines": {
+        "node": ">= 14.14"
+      },
+      "peerDependencies": {
+        "typescript": "4.6.x || 4.7.x || 4.8.x || 4.9.x"
+      }
+    },
+    "node_modules/typedoc/node_modules/brace-expansion": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/typedoc/node_modules/minimatch": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.2.tgz",
+      "integrity": "sha512-bNH9mmM9qsJ2X4r2Nat1B//1dJVcn3+iBLa3IgqJ7EbGaDNepL9QSHOxN4ng33s52VMMhhIfgCYDk3C4ZmlDAg==",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/typescript": {
+      "version": "4.9.4",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.4.tgz",
+      "integrity": "sha512-Uz+dTXYzxXXbsFpM86Wh3dKCxrQqUcVMxwU54orwlJjOpO3ao8L7j5lH+dWfTwgCwIuM9GQ2kvVotzYJMXTBZg==",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=4.2.0"
+      }
+    },
     "node_modules/uc.micro": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz",
@@ -3734,6 +4120,16 @@
       "integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==",
       "dev": true
     },
+    "node_modules/vscode-oniguruma": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/vscode-oniguruma/-/vscode-oniguruma-1.7.0.tgz",
+      "integrity": "sha512-L9WMGRfrjOhgHSdOYgCt/yRMsXzLDJSL7BPrOZt73gU0iWO4mpqzqQzOz5srxqTvMBaR0XZTSrVWo4j55Rc6cA=="
+    },
+    "node_modules/vscode-textmate": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/vscode-textmate/-/vscode-textmate-8.0.0.tgz",
+      "integrity": "sha512-AFbieoL7a5LMqcnOF04ji+rpXadgOXnZsxQr//r83kLPr7biP7am3g9zbaZIaBGwBRWeSvoMD4mgPdX3e4NWBg=="
+    },
     "node_modules/weak-lru-cache": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/weak-lru-cache/-/weak-lru-cache-1.2.2.tgz",
@@ -4275,6 +4671,196 @@
             "chalk": "^4.1.0"
           }
         },
+        "@parcel/core": {
+          "version": "2.8.2",
+          "resolved": "https://registry.npmjs.org/@parcel/core/-/core-2.8.2.tgz",
+          "integrity": "sha512-ZGuq6p+Lzx6fgufaVsuOBwgpU3hgskTvIDIMdIDi9gOZyhGPK7U2srXdX+VYUL5ZSGbX04/P6QlB9FMAXK+nEg==",
+          "peer": true,
+          "requires": {
+            "@mischnic/json-sourcemap": "^0.1.0",
+            "@parcel/cache": "2.8.2",
+            "@parcel/diagnostic": "2.8.2",
+            "@parcel/events": "2.8.2",
+            "@parcel/fs": "2.8.2",
+            "@parcel/graph": "2.8.2",
+            "@parcel/hash": "2.8.2",
+            "@parcel/logger": "2.8.2",
+            "@parcel/package-manager": "2.8.2",
+            "@parcel/plugin": "2.8.2",
+            "@parcel/source-map": "^2.1.1",
+            "@parcel/types": "2.8.2",
+            "@parcel/utils": "2.8.2",
+            "@parcel/workers": "2.8.2",
+            "abortcontroller-polyfill": "^1.1.9",
+            "base-x": "^3.0.8",
+            "browserslist": "^4.6.6",
+            "clone": "^2.1.1",
+            "dotenv": "^7.0.0",
+            "dotenv-expand": "^5.1.0",
+            "json5": "^2.2.0",
+            "msgpackr": "^1.5.4",
+            "nullthrows": "^1.1.1",
+            "semver": "^5.7.1"
+          },
+          "dependencies": {
+            "@parcel/cache": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/cache/-/cache-2.8.2.tgz",
+              "integrity": "sha512-kiyoOgh1RXp5qp+wlb8Pi/Z7o9D82Oj5RlHnKSAauyR7jgnI8Vq8JTeBmlLqrf+kHxcDcp2p86hidSeANhlQNg==",
+              "peer": true,
+              "requires": {
+                "@parcel/fs": "2.8.2",
+                "@parcel/logger": "2.8.2",
+                "@parcel/utils": "2.8.2",
+                "lmdb": "2.5.2"
+              }
+            },
+            "@parcel/codeframe": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/codeframe/-/codeframe-2.8.2.tgz",
+              "integrity": "sha512-U2GT9gq1Zs3Gr83j8JIs10bLbGOHFl57Y8D57nrdR05F4iilV/UR6K7jkhdoiFc9WiHh3ewvrko5+pSdAVFPgQ==",
+              "peer": true,
+              "requires": {
+                "chalk": "^4.1.0"
+              }
+            },
+            "@parcel/diagnostic": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/diagnostic/-/diagnostic-2.8.2.tgz",
+              "integrity": "sha512-tGSMwM2rSYLjJW0fCd9gb3tNjfCX/83PZ10/5u2E33UZVkk8OIHsQmsrtq2H2g4oQL3rFxkfEx6nGPDGHwlx7A==",
+              "peer": true,
+              "requires": {
+                "@mischnic/json-sourcemap": "^0.1.0",
+                "nullthrows": "^1.1.1"
+              }
+            },
+            "@parcel/events": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/events/-/events-2.8.2.tgz",
+              "integrity": "sha512-o5etrsKm16y8iRPnjtEBNy4lD0WAigD66yt/RZl9Rx0vPVDly/63Rr9+BrXWVW7bJ7x0S0VVpWW4j3f/qZOsXg==",
+              "peer": true
+            },
+            "@parcel/fs": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/fs/-/fs-2.8.2.tgz",
+              "integrity": "sha512-aN8znbMndSqn1xwZEmMblzqmJsxcExv2jKLl/a9RUHAP7LaPYcPZIykDL3YwGCiKTCzjmRpXnNoyosjFFeBaHA==",
+              "peer": true,
+              "requires": {
+                "@parcel/fs-search": "2.8.2",
+                "@parcel/types": "2.8.2",
+                "@parcel/utils": "2.8.2",
+                "@parcel/watcher": "^2.0.7",
+                "@parcel/workers": "2.8.2"
+              }
+            },
+            "@parcel/fs-search": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/fs-search/-/fs-search-2.8.2.tgz",
+              "integrity": "sha512-ovQnupRm/MoE/tbgH0Ivknk0QYenXAewjcog+T5umDmUlTmnIRZjURrgDf5Xtw8T/CD5Xv+HmIXpJ9Ez/LzJpw==",
+              "peer": true,
+              "requires": {
+                "detect-libc": "^1.0.3"
+              }
+            },
+            "@parcel/hash": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/hash/-/hash-2.8.2.tgz",
+              "integrity": "sha512-NBnP8Hu0xvAqAfZXRaMM66i8nJyxpKS86BbhwkbgTGbwO1OY87GERliHeREJfcER0E0ZzwNow7MNR8ZDm6IvJQ==",
+              "peer": true,
+              "requires": {
+                "detect-libc": "^1.0.3",
+                "xxhash-wasm": "^0.4.2"
+              }
+            },
+            "@parcel/logger": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/logger/-/logger-2.8.2.tgz",
+              "integrity": "sha512-zlhK6QHxfFJMlVJxxcCw0xxBDrYPFPOhMxSD6p6b0z9Yct1l3NdpmfabgjKX8wnZmHokFsil6daleM+M80n2Ew==",
+              "peer": true,
+              "requires": {
+                "@parcel/diagnostic": "2.8.2",
+                "@parcel/events": "2.8.2"
+              }
+            },
+            "@parcel/markdown-ansi": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/markdown-ansi/-/markdown-ansi-2.8.2.tgz",
+              "integrity": "sha512-5y29TXgRgG0ybuXaDsDk4Aofg/nDUeAAyVl9/toYCDDhxpQV4yZt8WNPu4PaNYKGLuNgXwsmz+ryZQHGmfbAIQ==",
+              "peer": true,
+              "requires": {
+                "chalk": "^4.1.0"
+              }
+            },
+            "@parcel/package-manager": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/package-manager/-/package-manager-2.8.2.tgz",
+              "integrity": "sha512-hx4Imi0yhsSS0aNZkEANPYNNKqBuR63EUNWSxMyHh4ZOvbHoOXnMn1ySGdx6v0oi9HvKymNsLMQ1T5CuI4l4Bw==",
+              "peer": true,
+              "requires": {
+                "@parcel/diagnostic": "2.8.2",
+                "@parcel/fs": "2.8.2",
+                "@parcel/logger": "2.8.2",
+                "@parcel/types": "2.8.2",
+                "@parcel/utils": "2.8.2",
+                "@parcel/workers": "2.8.2",
+                "semver": "^5.7.1"
+              }
+            },
+            "@parcel/plugin": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/plugin/-/plugin-2.8.2.tgz",
+              "integrity": "sha512-YG7TWfKsoNm72jbz3b3TLec0qJHVkuAWSzGzowdIhX37cP1kRfp6BU2VcH+qYPP/KYJLzhcZa9n3by147mGcxw==",
+              "peer": true,
+              "requires": {
+                "@parcel/types": "2.8.2"
+              }
+            },
+            "@parcel/types": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/types/-/types-2.8.2.tgz",
+              "integrity": "sha512-HAYhokWxM10raIhqaYj9VR9eAvJ+xP2sNfQ1IcQybHpq3qblcBe/4jDeuUpwIyKeQ4gorp7xY+q8KDoR20j43w==",
+              "peer": true,
+              "requires": {
+                "@parcel/cache": "2.8.2",
+                "@parcel/diagnostic": "2.8.2",
+                "@parcel/fs": "2.8.2",
+                "@parcel/package-manager": "2.8.2",
+                "@parcel/source-map": "^2.1.1",
+                "@parcel/workers": "2.8.2",
+                "utility-types": "^3.10.0"
+              }
+            },
+            "@parcel/utils": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/utils/-/utils-2.8.2.tgz",
+              "integrity": "sha512-Ufax7wZxC9FNsUpR0EU7Z22LEY/q9jjsDTwswctCdfpWb7TE/NudOfM9myycfRvwBVEYN50lPbkt1QltEVnXQQ==",
+              "peer": true,
+              "requires": {
+                "@parcel/codeframe": "2.8.2",
+                "@parcel/diagnostic": "2.8.2",
+                "@parcel/hash": "2.8.2",
+                "@parcel/logger": "2.8.2",
+                "@parcel/markdown-ansi": "2.8.2",
+                "@parcel/source-map": "^2.1.1",
+                "chalk": "^4.1.0"
+              }
+            },
+            "@parcel/workers": {
+              "version": "2.8.2",
+              "resolved": "https://registry.npmjs.org/@parcel/workers/-/workers-2.8.2.tgz",
+              "integrity": "sha512-Eg6CofIrJSNBa2fjXwvnzVLPKwR/6fkfQTFAm3Jl+4JYLVknBtTSFzQNp/Fa+HUEG889H9ucTk2CBi/fVPBAFw==",
+              "peer": true,
+              "requires": {
+                "@parcel/diagnostic": "2.8.2",
+                "@parcel/logger": "2.8.2",
+                "@parcel/types": "2.8.2",
+                "@parcel/utils": "2.8.2",
+                "chrome-trace-event": "^1.0.2",
+                "nullthrows": "^1.1.1"
+              }
+            }
+          }
+        },
         "@parcel/diagnostic": {
           "version": "2.8.0",
           "resolved": "https://registry.npmjs.org/@parcel/diagnostic/-/diagnostic-2.8.0.tgz",
@@ -4309,6 +4895,15 @@
             "detect-libc": "^1.0.3"
           }
         },
+        "@parcel/graph": {
+          "version": "2.8.2",
+          "resolved": "https://registry.npmjs.org/@parcel/graph/-/graph-2.8.2.tgz",
+          "integrity": "sha512-SLEvBQBgfkXgU4EBu30+CNanpuKjcNuEv/x8SwobCF0i3Rk+QKbe7T36bNR7727mao++2Ha69q93Dd9dTPw0kQ==",
+          "peer": true,
+          "requires": {
+            "nullthrows": "^1.1.1"
+          }
+        },
         "@parcel/hash": {
           "version": "2.8.0",
           "resolved": "https://registry.npmjs.org/@parcel/hash/-/hash-2.8.0.tgz",
@@ -4884,11 +5479,15 @@
       "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==",
       "dev": true
     },
+    "@types/prettier": {
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.7.2.tgz",
+      "integrity": "sha512-KufADq8uQqo1pYKVIYzfKbJfBAc0sOeXqGbFaSpv8MRmC/zXgowNZmFcbngndGk922QDmOASEXUZCaY48gs4cg=="
+    },
     "abortcontroller-polyfill": {
       "version": "1.7.3",
       "resolved": "https://registry.npmjs.org/abortcontroller-polyfill/-/abortcontroller-polyfill-1.7.3.tgz",
-      "integrity": "sha512-zetDJxd89y3X99Kvo4qFx8GKlt6GsvN3UcRZHwU6iFA/0KiOmhkTVhe8oRoTBiTVPZu09x3vCra47+w8Yz1+2Q==",
-      "dev": true
+      "integrity": "sha512-zetDJxd89y3X99Kvo4qFx8GKlt6GsvN3UcRZHwU6iFA/0KiOmhkTVhe8oRoTBiTVPZu09x3vCra47+w8Yz1+2Q=="
     },
     "acorn": {
       "version": "8.8.0",
@@ -4950,7 +5549,6 @@
       "version": "3.0.9",
       "resolved": "https://registry.npmjs.org/base-x/-/base-x-3.0.9.tgz",
       "integrity": "sha512-H7JU6iBHTal1gp56aKoaa//YUxEaAOUiydvrV/pILqIHXTtqxSkATOnDA2u+jZ/61sD+L/412+7kzXRtWukhpQ==",
-      "dev": true,
       "requires": {
         "safe-buffer": "^5.0.1"
       }
@@ -5061,8 +5659,7 @@
     "clone": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
-      "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==",
-      "dev": true
+      "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w=="
     },
     "color-convert": {
       "version": "2.0.1",
@@ -5197,14 +5794,12 @@
     "dotenv": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-7.0.0.tgz",
-      "integrity": "sha512-M3NhsLbV1i6HuGzBUH8vXrtxOk+tWmzWKDMbAVSUp3Zsjm7ywFeuwrUXhmhQyRK1q5B5GGy7hcXPbj3bnfZg2g==",
-      "dev": true
+      "integrity": "sha512-M3NhsLbV1i6HuGzBUH8vXrtxOk+tWmzWKDMbAVSUp3Zsjm7ywFeuwrUXhmhQyRK1q5B5GGy7hcXPbj3bnfZg2g=="
     },
     "dotenv-expand": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/dotenv-expand/-/dotenv-expand-5.1.0.tgz",
-      "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==",
-      "dev": true
+      "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA=="
     },
     "electron-to-chromium": {
       "version": "1.4.251",
@@ -5538,6 +6133,11 @@
       "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.1.tgz",
       "integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA=="
     },
+    "jsonc-parser": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.0.tgz",
+      "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w=="
+    },
     "jsonfile": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
@@ -5672,6 +6272,11 @@
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
+    "lunr": {
+      "version": "2.3.9",
+      "resolved": "https://registry.npmjs.org/lunr/-/lunr-2.3.9.tgz",
+      "integrity": "sha512-zTU3DaZaF3Rt9rhN3uBMGQD3dD2/vFQqnvZCDv4dl5iOzq2IZQqTxu90r4E5J+nP70J3ilqVCrbho2eWaeW8Ow=="
+    },
     "make-dir": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
@@ -5712,13 +6317,13 @@
       "version": "8.6.6",
       "resolved": "https://registry.npmjs.org/markdown-it-anchor/-/markdown-it-anchor-8.6.6.tgz",
       "integrity": "sha512-jRW30YGywD2ESXDc+l17AiritL0uVaSnWsb26f+68qaW9zgbIIr1f4v2Nsvc0+s0Z2N3uX6t/yAw7BwCQ1wMsA==",
-      "dev": true
+      "dev": true,
+      "requires": {}
     },
     "marked": {
       "version": "4.2.5",
       "resolved": "https://registry.npmjs.org/marked/-/marked-4.2.5.tgz",
-      "integrity": "sha512-jPueVhumq7idETHkb203WDD4fMA3yV9emQ5vLwop58lu8bTclMghBWcYAavlDqIEMaisADinV1TooIFCfqOsYQ==",
-      "dev": true
+      "integrity": "sha512-jPueVhumq7idETHkb203WDD4fMA3yV9emQ5vLwop58lu8bTclMghBWcYAavlDqIEMaisADinV1TooIFCfqOsYQ=="
     },
     "mdn-data": {
       "version": "2.0.14",
@@ -6040,8 +6645,7 @@
     "safe-buffer": {
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
-      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-      "dev": true
+      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="
     },
     "sass": {
       "version": "1.54.9",
@@ -6059,6 +6663,16 @@
       "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
       "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ=="
     },
+    "shiki": {
+      "version": "0.12.1",
+      "resolved": "https://registry.npmjs.org/shiki/-/shiki-0.12.1.tgz",
+      "integrity": "sha512-aieaV1m349rZINEBkjxh2QbBvFFQOlgqYTNtCal82hHj4dDZ76oMlQIX+C7ryerBTDiga3e5NfH6smjdJ02BbQ==",
+      "requires": {
+        "jsonc-parser": "^3.2.0",
+        "vscode-oniguruma": "^1.7.0",
+        "vscode-textmate": "^8.0.0"
+      }
+    },
     "source-map": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
@@ -6185,6 +6799,40 @@
       "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
       "dev": true
     },
+    "typedoc": {
+      "version": "0.23.24",
+      "resolved": "https://registry.npmjs.org/typedoc/-/typedoc-0.23.24.tgz",
+      "integrity": "sha512-bfmy8lNQh+WrPYcJbtjQ6JEEsVl/ce1ZIXyXhyW+a1vFrjO39t6J8sL/d6FfAGrJTc7McCXgk9AanYBSNvLdIA==",
+      "requires": {
+        "lunr": "^2.3.9",
+        "marked": "^4.2.5",
+        "minimatch": "^5.1.2",
+        "shiki": "^0.12.1"
+      },
+      "dependencies": {
+        "brace-expansion": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+          "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+          "requires": {
+            "balanced-match": "^1.0.0"
+          }
+        },
+        "minimatch": {
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.2.tgz",
+          "integrity": "sha512-bNH9mmM9qsJ2X4r2Nat1B//1dJVcn3+iBLa3IgqJ7EbGaDNepL9QSHOxN4ng33s52VMMhhIfgCYDk3C4ZmlDAg==",
+          "requires": {
+            "brace-expansion": "^2.0.1"
+          }
+        }
+      }
+    },
+    "typescript": {
+      "version": "4.9.4",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.4.tgz",
+      "integrity": "sha512-Uz+dTXYzxXXbsFpM86Wh3dKCxrQqUcVMxwU54orwlJjOpO3ao8L7j5lH+dWfTwgCwIuM9GQ2kvVotzYJMXTBZg=="
+    },
     "uc.micro": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz",
@@ -6222,6 +6870,16 @@
       "integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==",
       "dev": true
     },
+    "vscode-oniguruma": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/vscode-oniguruma/-/vscode-oniguruma-1.7.0.tgz",
+      "integrity": "sha512-L9WMGRfrjOhgHSdOYgCt/yRMsXzLDJSL7BPrOZt73gU0iWO4mpqzqQzOz5srxqTvMBaR0XZTSrVWo4j55Rc6cA=="
+    },
+    "vscode-textmate": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/vscode-textmate/-/vscode-textmate-8.0.0.tgz",
+      "integrity": "sha512-AFbieoL7a5LMqcnOF04ji+rpXadgOXnZsxQr//r83kLPr7biP7am3g9zbaZIaBGwBRWeSvoMD4mgPdX3e4NWBg=="
+    },
     "weak-lru-cache": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/weak-lru-cache/-/weak-lru-cache-1.2.2.tgz",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cg-select",
-  "version": "0.1.171",
+  "version": "0.2.1",
   "description": "Feature rich Select control for React/JS with multiselect, autocomplete and styling",
   "author": {
     "name": "CraftGroup",
@@ -9,7 +9,7 @@
   "homepage": "https://cg-select.itguild.info",
   "scripts": {
     "start": "parcel example/index.html -p 4500 --open ",
-    "build": "parcel build index.js",
+    "build": "parcel build example/index.js --no-cache",
     "deploy": "gh-pages -d dist",
     "predeploy": "npm run build"
   },
@@ -29,7 +29,10 @@
   },
   "dependencies": {
     "@parcel/optimizer-css": "^2.8.0",
-    "gh-pages": "^4.0.0"
+    "@types/prettier": "^2.7.2",
+    "gh-pages": "^4.0.0",
+    "typedoc": "^0.23.24",
+    "typescript": "^4.9.4"
   },
   "keywords": [
     "select",

src/cg-select.js

@@ -1,921 +0,0 @@
-import {
-  createSelected,
-  customStyles,
-  getFormatItem,
-  getSelectText,
-  customStylesFormat,
-  nativeOptionMultiple,
-  nativeOptionOrdinary,
-  clearSelect,
-} from './components/utils';
-import {
-  createBreadcrumb,
-  createInputSearch,
-  createNativeSelectOption,
-  createNativeSelect,
-} from './components/create-element';
-import { ru, en } from './language/language';
-import './main.scss'
-
-/**
- * @class Описание класса DropDown
- * @description Этот класс реализовывает функционал кастомного селекта, с возможностями кастомизации.
- * @author Овсяников Максим
- */
-export class DropDown {
-  /**
-   * Созданный HTML елемент
-   * @type {HTMLElement}
-   */
-  #element;
-  /**
-   * Созданный список(ul), с классом list
-   * @type {HTMLElement}
-   */
-  #list;
-  /**
-   * Настройки селекта передаваемые при создании экземпляра класса
-   * @type {object}
-   */
-  #options;
-  /**
-   * Переменная для управления каретки
-   * @type {HTMLElement}
-   */
-  #caret;
-  /**
-   * Массив переданных элементов
-   * @type {object[]}
-   */
-  #items;
-  /**
-   * Переданные категории
-   * @type {string}
-   */
-  #category;
-  /**
-   * Выбранный или массив выбранных элементов из списка
-   * @type {object[] | object}
-   */
-  #selectedItems;
-  /**
-   * Массив индексов выбранных элементов
-   * @type {number[]}
-   */
-  #indexes = [];
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @returns {string[] | string | null} Возвращает выбранные элемент(ы) в виде массива/элемента/null
-   * @description Геттер возвращающий выбранные элемент(ы) селекта
-   */
-  get value() {
-    return this.#selectedItems ?? null;
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @returns {number | number[]}Возвращает индексы выбранных элемента(ов) в виде массива/пустой массив
-   * @description Геттер возвращающий индексы выбранных элемента(ов) селекта
-   */
-  get indexes() {
-    return this.#indexes ?? [];
-  }
-
-  /**
-   *
-   * @param {object} options Объект принимающий настройки селекта
-   * @constructor Конструктор класса DropDown
-   * @description  Конструктор принимает объект и рендерит селект.
-   * @example
-   * options = {
-   *  selector: 'Уникальный селектор',
-      selected: 'Выбранный элемент',
-      placeholder: '...',
-      items: [string|number|object],
-      darkTheme: true/false,
-      searchMode: true/false,
-      closeOnSelect:  true/false,
-      nativeSelectMode: true/false,
-      listDisplayMode: true/false,
-      language: 'ru/en',
-      styles: {
-        head: {
-          background: '...',
-        },
-        list: {...},
-        chips: {...},
-        caret: {...},
-        placeholder: {...},
-        lable: {..},
-      },
-      event: '...',
-      url: 'http/...',
-      multiselect: true/false,
-      multiselectTag: true/false,
-   * }
-     
-   */
-  constructor(options = {}) {
-    this.#init(options);
-    this.#render();
-    this.#initEvent();
-    this.#closeSelectClick();
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @param {string | object} item добавляемый елемент
-   * @description добавляет переданный элемент в конец списка и перерисовывает список. Не может использоваться при передачи элементов с категорями
-   * @method addItem
-   */
-  addItem(item) {
-    if (this.#category) {
-      console.log('can`t add item to category');
-      return;
-    }
-
-    if (!item) {
-      return false;
-    }
-
-    const index = this.#items.length;
-
-    this.#items.push(getFormatItem(item, index));
-    this.#render();
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @param {number} index индекс удаляемого элемента
-   * @description удаляет елемент по индексу из списка и перерисовывает его. Не может использоваться при передачи элементов с категорями.
-   * @method deleteItem
-   */
-  deleteItem(index) {
-    if (this.#category) {
-      console.log('can`t add item to category');
-      return;
-    }
-
-    const item = this.#items[index];
-
-    this.#items.splice(index, 1);
-    this.#render();
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @description удаляет все елементы из списка и перерисовывает его.
-   * @method deleteItemAll
-   */
-  deleteItemAll() {
-    this.#items.splice(0, this.#items.length);
-    this.#render();
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @param {number} index индекс выбранного элемента
-   * @description  выбирает элемент который будет изначально отрисовываться в селекте
-   * @method selectIndex
-   */
-  selectIndex(index) {
-    if (this.#category) {
-      console.log('can`t add item to category');
-      return;
-    }
-
-    const options = this.#element.querySelectorAll('.list__item');
-
-    if (index > options.length) {
-      return;
-    }
-
-    const select = options[index].innerText;
-    this.#render(select);
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @param {number} numberItem номер возвращаемого элемента
-   * @returns {HTMLElement} возвращает ссылку на выбранный HTML элемент
-   * @method getElement
-   */
-  getElement(numberItem) {
-    if (numberItem > this.#items.length) {
-      return;
-    }
-    return this.#items[numberItem];
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @param {boolean} value - Передаваемый параметр для добавления атрибута disabled;
-   * @description Метод позволяющий переключать состояние селекта disabled,
-   * @method disabled
-   */
-  disabled(value) {
-    if (typeof value !== 'boolean') {
-      return;
-    }
-
-    const select = this.#element.querySelector('.cg-select');
-    const nativeSelect = this.#element.querySelector('.nativeSelect');
-    if (value === true) {
-      this.#element.setAttribute('disabled', true);
-      nativeSelect.setAttribute('disabled', true);
-      select.classList.add('disabled');
-    } else {
-      this.#element.removeAttribute('disabled');
-      nativeSelect.removeAttribute('disabled');
-      select.classList.remove('disabled');
-    }
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @param {HTMLInputElement} button - HTML кнопка
-   * @param {string} method - метод открытия open/close
-   * @description Метод позволяющий открывать/закрывать селект с помощью кнопок
-   * @method buttonControl
-   */
-  buttonControl(button, method) {
-    const { listDisplayMode } = this.#options;
-
-    if (listDisplayMode === true) {
-      return;
-    }
-
-    this.btn = button;
-    button.addEventListener('click', () => {
-      if (method.toLowerCase() === 'open') {
-        this.#open(true);
-      } else if (method.toLowerCase() === 'close') {
-        this.#close();
-      } else {
-        return;
-      }
-    });
-  }
-
-  /**
-   * Метод экземпляра класса DropDown
-   * @param {object} language объект в котором находятся поля для подключения языка имеет два обязательных поля placeholder, textInListSearch
-   * @description метод позволяющий заменить плейсхолдер в поиске и текст который выводится если нет результата
-   * @method addLanguage
-   */
-  addLanguage(language) {
-    const { placeholder, textInListSearch, selectPlaceholder } = language;
-    const { searchMode } = this.#options;
-
-    const select = this.#element.querySelector('.selected');
-    const textNodeSelect = document.createTextNode(selectPlaceholder);
-    select.appendChild(textNodeSelect);
-
-    if (searchMode && searchMode == true) {
-      const search = this.#element.querySelector('.inputSearch');
-      const textNoRezult = this.#element.querySelector('.noRezult');
-      const textNode = document.createTextNode(textInListSearch);
-
-      search.setAttribute('placeholder', placeholder);
-      search.setAttribute('placeholder', placeholder);
-
-      textNoRezult.innerText = '';
-      textNoRezult.appendChild(textNode);
-    }
-  }
-
-  /**
-   * Приватный метод инициализации экземпляра класса DropDown
-   * @method #init
-   * @member
-   * @protected
-   * @param {object} options передаваемые настройки селекта
-   * @description Приватный метод. Общая инициализация селекта. Получение настоек и преобразвание элементов селекта.
-   * @example
-   *  {
-        selector: '.cg-dropdown_one',
-        placeholder: 'Выберите авто',
-        items: [
-          'BMW',
-          {
-            id: '213sade',
-            title: 'Opel',
-            value: 1,
-          },
-          'Mersedes',
-          'MAN',
-          'max',
-        ],
-        darkTheme: true,
-        multiselect: true,
-        multiselectTag: true,
-      }
-   */
-  #init(options) {
-    this.#options = options;
-    const { items, multiselect, url } = this.#options;
-
-    const elem = document.querySelector(options.selector);
-
-    //TODO: для теста в реакте нужно пересмотреть необходимость этой проверки!
-    // if (!elem) {
-    //   throw new Error(`Element with selector ${options.selector}`);
-    // }
-
-    this.#element = elem;
-
-    this.#element.addEventListener('click', (e) => {
-      e.preventDefault();
-      this.#open();
-    });
-
-    this.#items = [];
-
-    if (multiselect && multiselect == true) {
-      this.#selectedItems = [];
-    }
-
-    if (!items && url) {
-      this.#renderUrl();
-      return;
-    }
-
-    items.forEach((dataItem, index) => {
-      if (dataItem.category && dataItem.categoryItems) {
-        this.#category = dataItem.category;
-
-        this.#items.push(this.#category);
-        dataItem.categoryItems.forEach((categoryItem, indexCategory) => {
-          this.#items.push(getFormatItem(categoryItem, indexCategory));
-        });
-      } else {
-        this.#items.push(getFormatItem(dataItem, index));
-      }
-    });
-  }
-
-  /**
-   * Привaтный метод экземпляра класса DropDown
-   *
-   * @method #initSelected
-   * @param {string} select необязательный елемент. Используется в методе selectIndex
-   * @description Отрисовывает и стилизует селект
-   * @protected
-   */
-  #initSelected(select) {
-    const { styles, selected, placeholder, lable, language } = this.#options;
-
-    if (selected) {
-      createSelected(this.#element, selected);
-    } else if (placeholder) {
-      createSelected(this.#element, placeholder);
-    } else {
-      if (language && language === 'ru') {
-        createSelected(this.#element, ru.selectPlaceholder);
-      } else {
-        createSelected(this.#element, en.selectPlaceholder);
-      }
-    }
-
-    if (select) {
-      createSelected(this.#element, select, styles);
-    }
-
-    if (lable) {
-      const lableItem = document.createElement('h1');
-      const textLable = document.createTextNode(lable);
-
-      lableItem.appendChild(textLable);
-      lableItem.classList.add('label');
-
-      this.#element.insertAdjacentElement('beforebegin', lableItem);
-    }
-
-    if (styles) {
-      customStyles(this.#element, styles);
-    }
-  }
-
-  /**
-   * Приватный метод рендера экземпляра класса DropDown
-   *@protected
-   * @method #render
-   * @param {string} select  необязательный елемент. Передаеться в метод initSelected
-   * @description Рендер елементов в селекте.
-   */
-  #render(select) {
-    const {
-      styles,
-      multiselect,
-      searchMode,
-      multiselectTag,
-      darkTheme,
-      language,
-      nativeSelectMode,
-      listDisplayMode,
-    } = this.#options;
-
-    const random = Math.random().toString(36).substring(2, 10);
-
-    if (select || (select && styles)) {
-      this.#initSelected(select);
-      customStyles(this.#element, styles);
-    } else {
-      this.#initSelected();
-    }
-
-    const ulList = document.createElement('ul');
-    const nativeSelect = createNativeSelect();
-
-    let inputSearch = '';
-    this.random = random;
-
-    if (searchMode) {
-      if (language === 'ru') {
-        inputSearch = createInputSearch(random, ru.placeholder);
-      } else {
-        inputSearch = createInputSearch(random, en.placeholder);
-      }
-      const { search } = styles;
-      customStylesFormat(search, inputSearch);
-      ulList.appendChild(inputSearch);
-    }
-
-    ulList.classList.add('list');
-
-    if (styles) {
-      const { list } = styles;
-      customStylesFormat(list, ulList);
-    }
-
-    this.#element.appendChild(ulList);
-
-    this.#items.forEach((dataItem) => {
-      this.#element.appendChild(nativeSelect);
-
-      const liItem = document.createElement('li');
-      const nativeOption = createNativeSelectOption();
-      const strongItem = document.createElement('strong');
-
-      liItem.classList.add('list__item');
-      strongItem.classList.add('category');
-
-      if (multiselect && multiselect == true) {
-        const checkBox = document.createElement('input');
-        checkBox.type = 'checkbox';
-        checkBox.setAttribute('id', `chbox-${dataItem.id}`);
-        liItem.appendChild(checkBox);
-
-        if (multiselectTag && multiselectTag == true) {
-          checkBox.classList.add('displayHide');
-        }
-
-        nativeSelect.setAttribute('multiple', 'multiple');
-      }
-
-      let textNode = '';
-
-      if (dataItem.title) {
-        nativeOption.text = dataItem.title;
-        nativeOption.value = dataItem.title;
-        textNode = document.createTextNode(dataItem.title);
-
-        nativeSelect.appendChild(nativeOption);
-        liItem.appendChild(textNode);
-        ulList.appendChild(liItem);
-      } else {
-        textNode = document.createTextNode(dataItem);
-        strongItem.appendChild(textNode);
-        ulList.appendChild(strongItem);
-      }
-    });
-
-    this.#items.filter((item, index) => {
-      if (typeof item !== 'object') {
-        this.#items.splice(index, 1);
-      }
-      return item;
-    });
-
-    if (darkTheme == false) {
-      this.#checkTheme();
-    }
-
-    if (nativeSelectMode === true) {
-      this.#selectMode(nativeSelectMode);
-    }
-
-    this.#list = this.#element.querySelector('.list');
-    this.#caret = this.#element.querySelector('.caret');
-
-    if (listDisplayMode === true) {
-      this.#displayMode(listDisplayMode);
-    }
-
-    this.#addOptionsBehaviour();
-  }
-
-  /**
-   * Приватный метод рендера экземпляра класса DropDown
-   * @protected
-   * @method #checkTheme
-   * @description Изменяет цветовую схему с темной на светлую.
-   */
-  #checkTheme() {
-    const { darkTheme, searchMode } = this.#options;
-
-    const select = this.#element.querySelector('.cg-select');
-    const caret = this.#element.querySelector('.caret');
-    const list = this.#element.querySelector('ul.list');
-    const search = this.#element.querySelector('.inputSearch');
-
-    if (darkTheme == false) {
-      select.classList.add('selectWhite');
-      caret.classList.add('caretWhite');
-      list.classList.add('listWhite');
-
-      if (searchMode == true) {
-        search.classList.add('inputWhite');
-      }
-    } else if (darkTheme == true || !darkTheme) {
-      return;
-    } else {
-      throw new Error('Styles error or invalid value entered!');
-    }
-  }
-
-  /**
-   * Приватный метод рендера экземпляра класса DropDown
-   *@protected
-   * @method #renderUrl
-   * @description Рендер елементов в селекте переданных с URL и их настойка
-   */
-  async #renderUrl() {
-    const { url, items, multiselect, multiselectTag } = this.#options;
-
-    if (items) {
-      return;
-    }
-
-    if (!url) {
-      return;
-    }
-
-    const response = await fetch(url);
-    const dataUrl = await response.json();
-
-    const nativeSelect = createNativeSelect();
-
-    dataUrl.forEach((dataItem, index) => {
-      const item = {
-        id: dataItem.id,
-        title: dataItem.name,
-        value: index,
-      };
-      const ulUrl = this.#element.querySelector('.list');
-
-      const nativeOption = createNativeSelectOption();
-      const liUrl = document.createElement('li');
-      const textUrl = document.createTextNode(item.title);
-
-      if (multiselect && multiselect == true) {
-        const checkBox = document.createElement('input');
-        checkBox.type = 'checkbox';
-        if (multiselectTag && multiselectTag == true) {
-          checkBox.classList.add('displayHide');
-        }
-
-        checkBox.setAttribute('id', `chbox-${item.id}`);
-        nativeSelect.setAttribute('multiple', 'multiple');
-
-        liUrl.appendChild(checkBox);
-      }
-
-      liUrl.classList.add('list__item');
-      nativeOption.value = item.title;
-      nativeOption.text = item.title;
-
-      nativeSelect.appendChild(nativeOption);
-      liUrl.appendChild(textUrl);
-      ulUrl.appendChild(liUrl);
-
-      this.#items.push(item);
-    });
-
-    this.#element.appendChild(nativeSelect);
-
-    this.#items.filter((item, index) => {
-      if (typeof item !== 'object') {
-        this.#items.splice(index, 1);
-      }
-      return item;
-    });
-
-    this.#addOptionsBehaviour();
-  }
-
-  /**
-   * Приватный метод экземпляра класса DropDown
-   * @protected
-   * @param {boolean} oneClick необязательный параметр передаваемый из функции buttonControl
-   * @description Открывает список для выбора элемента
-   * @method #open
-   */
-  #open(oneClick) {
-    if (oneClick === true) {
-      this.#list.classList.add('open');
-      this.#caret.classList.add('caret_rotate');
-    } else {
-      this.#list.classList.toggle('open');
-      this.#caret.classList.toggle('caret_rotate');
-    }
-  }
-
-  /**
-   * Приватный метод экземпляра класса DropDown
-   * @protected
-   * @description Закрывает список
-   * @method #close
-   */
-  #close() {
-    this.#list.classList.remove('open');
-    this.#caret.classList.remove('caret_rotate');
-  }
-
-  /**
-   * Приватный метод экземпляра класса DropDown
-   * @protected
-   * @description Метод реализовывающий выбор элементов в разных режимах. Обычный/Мультиселект/Мультиселект + Мультиселект Таг.
-   * @method #addOptionsBehaviour
-   */
-  #addOptionsBehaviour() {
-    const {
-      multiselect,
-      placeholder,
-      selected,
-      multiselectTag,
-      searchMode,
-      closeOnSelect,
-      darkTheme,
-    } = this.#options;
-
-    const options = this.#element.querySelectorAll('.list__item');
-    const select = this.#element.querySelector('.selected');
-    const nativeOption = this.#element.querySelectorAll('.nativeSelect__nativeOption');
-
-    const ulMultipul = document.createElement('ul');
-
-    if (multiselect && multiselect == true) {
-      ulMultipul.classList.add('multiselect-tag');
-      select.classList.add('overflow-hidden');
-    }
-
-    if (searchMode && searchMode === true) {
-      this.#searchMode(this.random);
-    }
-
-    options.forEach((option, index) => {
-      option.addEventListener('click', (event) => {
-        const dataSelectText = {
-          placeholder,
-          selected,
-          selectedItems: this.#selectedItems,
-          indexes: this.#indexes,
-          darkTheme,
-          multiselectTag,
-        };
-
-        const item = this.#items[index];
-
-        if (closeOnSelect == false || (multiselect && multiselect == true)) {
-          event.stopPropagation();
-          event.preventDefault();
-        }
-
-        const checkIndex = this.#indexes.indexOf(index);
-
-        if (multiselect && multiselect == true) {
-          option.classList.toggle('active');
-          const checkBox = option.querySelector('input[type="checkbox"]');
-
-          if (checkBox) {
-            if (!(event.target instanceof HTMLInputElement)) {
-              checkBox.checked = !checkBox.checked;
-            }
-
-            if (checkIndex === -1) {
-              nativeOptionMultiple(nativeOption, item.title, true);
-              this.#indexes.push(index);
-              select.innerText = '';
-
-              if (multiselectTag && multiselectTag == true) {
-                this.#selectedItems.push(item);
-                select.appendChild(ulMultipul);
-
-                const data = {
-                  option: this.#options,
-                  element: this.#element,
-                  indexes: this.#indexes,
-                  selectedItems: this.#selectedItems,
-                };
-
-                ulMultipul.appendChild(createBreadcrumb(data, item.title, index, item.id));
-              } else {
-                this.#selectedItems.push(item.title);
-                select.innerText = this.#selectedItems;
-              }
-            } else {
-              if (multiselectTag && multiselectTag == true) {
-                const tagItem = document.getElementById(`tag-${index}-${item.id}`);
-                ulMultipul.removeChild(tagItem);
-              }
-
-              this.#indexes.splice(checkIndex, 1);
-              this.#selectedItems.splice(checkIndex, 1);
-              nativeOptionMultiple(nativeOption, item.title, false);
-            }
-
-            if (!this.#selectedItems.length) {
-              getSelectText(dataSelectText, select);
-            } else {
-              if (multiselectTag && multiselectTag == true) {
-                select.appendChild(ulMultipul);
-              } else {
-                select.innerText = this.#selectedItems;
-              }
-            }
-          }
-        } else {
-          select.innerText = item.title;
-          this.#selectedItems = item;
-
-          nativeOptionOrdinary(nativeOption, item.title);
-
-          options.forEach((option) => {
-            option.classList.remove('active');
-          });
-          option.classList.add('active');
-        }
-
-        clearSelect(select, this.#element, dataSelectText);
-      });
-    });
-  }
-
-  /**
-   * Метод который реализует поиск элементов в селекте
-   * @protected
-   * @param {string} random уникальное значение для input элемента.
-   * @method #searchMode
-   */
-  #searchMode(random) {
-    const { language } = this.#options;
-
-    const input = this.#element.querySelector(`#searchSelect-${random}`);
-    const searchSelect = this.#element.querySelectorAll('.list__item');
-    const result = document.createElement('p');
-
-    let textNode = '';
-    if (language && language === 'ru') {
-      textNode = document.createTextNode(`${ru.textInListSearch}`);
-    } else {
-      textNode = document.createTextNode(`${en.textInListSearch}`);
-    }
-
-    result.appendChild(textNode);
-    result.classList.add('displayHide');
-    result.classList.add('noRezult');
-    input.parentElement.appendChild(result);
-
-    input.addEventListener('click', (e) => {
-      e.stopPropagation();
-    });
-
-    input.oninput = function () {
-      let valueSearch = this.value.trim().toLowerCase();
-      let anyMatch = false;
-
-      if (valueSearch != '') {
-        searchSelect.forEach((elem) => {
-          let isMatching = new RegExp(valueSearch, 'gi').test(elem.textContent);
-          anyMatch = anyMatch || isMatching;
-
-          if (elem.textContent.toLowerCase().search(valueSearch) == -1) {
-            elem.classList.add('displayHide');
-          } else {
-            elem.classList.remove('displayHide');
-          }
-        });
-
-        result.classList.toggle('displayHide', anyMatch);
-      } else {
-        searchSelect.forEach((elem) => {
-          elem.classList.remove('displayHide');
-          result.classList.add('displayHide');
-        });
-      }
-    };
-  }
-
-  /**
-   * Приватный метод экземпляра класса DropDown
-   * @protected
-   * @description Открывает и закрывает список по переданному эвенту
-   * @method #initEvent
-   */
-  #initEvent() {
-    const { event } = this.#options;
-    if (!event) {
-      return;
-    }
-
-    if (event) {
-      if (event === 'mouseenter') {
-        this.#element.addEventListener(event, () => {
-          this.#open();
-        });
-        this.#element.addEventListener('mouseleave', () => {
-          this.#close();
-        });
-      }
-    }
-  }
-
-  /**
-   * Приватный метод экземпляра класса DropDown
-   * @protected
-   * @description Закрывает список по клику вне элемента
-   * @method #closeSelectClick
-   */
-  #closeSelectClick() {
-    const dropdown = document.querySelector(`${this.#options.selector}`);
-
-    document.addEventListener('click', (e) => {
-      const withinBoundaries = e.composedPath().includes(dropdown);
-      if (!withinBoundaries) {
-        if (this.btn) {
-          return;
-        } else {
-          this.#close();
-        }
-      }
-    });
-  }
-
-  /**
-   * Приватный метод экземпляра класса DropDown
-   * @protected
-   * @param {boolean} nativeSelectMode параметр отвечающий за добавления нативного селекта.
-   * @description Изменяет отображение селекта на мобильных устройствах
-   * @method #selectMode
-   */
-  #selectMode(nativeSelectMode) {
-    let win = window.outerWidth;
-
-    if (nativeSelectMode === true) {
-      const select = this.#element.querySelector('.cg-select');
-      const list = this.#element.querySelector('.list');
-      const nativeSelect = this.#element.querySelector('.nativeSelect');
-
-      if (win < 576) {
-        select.classList.add('displayHide');
-        list.classList.add('displayHide');
-        nativeSelect.classList.add('nativeSelectActive');
-      } else if (win > 576) {
-        select.classList.remove('displayHide');
-        list.classList.remove('displayHide');
-        nativeSelect.classList.remove('nativeSelectActive');
-        nativeSelect.classList.add('displayHide');
-      }
-    } else {
-      return;
-    }
-  }
-
-  /**
-   * Приватный метод экземпляра класса DropDown
-   * @protected
-   * @param {boolean} listDisplayMode параметр отвечающий за отображение выбора в виде модального окна.
-   * @description Изменяет отображение листа с выбором в виде модального окна.
-   * @method #displayMode
-   */
-  #displayMode(listDisplayMode) {
-    if (listDisplayMode === true) {
-      const modal = document.createElement('div');
-      const body = document.querySelector('body');
-      const list = this.#list;
-
-      modal.appendChild(list);
-      this.#element.appendChild(modal);
-
-      this.#element.addEventListener('click', () => {
-        modal.classList.toggle('modal');
-        list.classList.toggle('listModal');
-        body.classList.toggle('overflowHide');
-      });
-    } else {
-      return;
-    }
-  }
-}

src/cg-select.ts

@@ -0,0 +1,943 @@
+import {
+  createBreadCrumb,
+  createInputSearch,
+  createNativeSelect,
+  createNativeSelectOption,
+} from './components/create-element/create-element';
+import { ICreateBreadCrumb } from './components/create-element/create-element.interface';
+
+import {
+  clearSelect,
+  createSelected,
+  customStyles,
+  customStylesFormat,
+  getFormatItem,
+  getSelectText,
+  nativeOptionMultiple,
+  nativeOptionOrdinary,
+} from './components/utils/utils';
+import { IDataItem, ISelectedItems } from './components/utils/urils.interface';
+
+import { ICgSelect, IStyle } from './interfaces/cg-select.interface';
+import { IItems } from './interfaces/items.interface';
+import { ru, en } from './language/language';
+import { ILanguage } from './interfaces/language.interface';
+
+import './main.scss';
+
+/**
+ * @class Class Description ICgSelect
+ * @description This class implements the functionality of a custom select, with customization capabilities.
+ * @author Ovsyanikov Maxim
+ */
+export class CGSelect implements ICgSelect {
+  // Select settings
+  selector?: string;
+  selected?: string;
+  placeholder?: string;
+  items?: IItems[] | string[] | any;
+  darkTheme?: boolean;
+  searchMode?: boolean;
+  closeOnSelect?: boolean;
+  nativeSelectMode?: boolean;
+  listDisplayMode?: boolean;
+  language?: string;
+  lable?: string;
+  styles?: IStyle;
+  event?: string;
+  url?: string;
+  multiselect?: boolean;
+  multiselectTag?: boolean;
+
+  /**
+   * Created HTML element.
+   * @type {Element | null}
+   */
+  private element!: Element | null;
+  /**
+   * Created list(ul), with class list.
+   * @type {Element | null | undefined}
+   */
+  private list!: Element | null;
+  /**
+   * Select settings passed when creating an instance of the class.
+   * @type {ICgSelect}
+   */
+  private options!: ICgSelect;
+  /**
+   * Unique Id for elements.
+   * @type {string}
+   */
+  private randomId!: string;
+  /**
+   * Variable for carriage control.
+   * @type {Element | null | undefined}
+   */
+  private caret: Element | null | undefined;
+  /**
+   * Transferred categories.
+   * @type {string}
+   */
+  private category?: string;
+  /**
+   * Selected or an array of selected items from a list.
+   * @type {string[] | string}
+   */
+  private selectedItems!: string[] | string;
+  /**
+   * Array of indexes of selected elements.
+   * @type {number[]}
+   */
+  private indexes: number[] = [];
+  /**
+   * Button, to control the select.
+   * @type {Element | null}
+   */
+  private btnCntr?: Element | null;
+
+  /**
+   * @param {ICgSelect} setting Object accepting select settings.
+   * @constructor ICgSelect class constructor.
+   * @description The constructor takes an object and renders the select.
+   * @example
+   * options = {
+   *  selector: 'Unique selector',
+      selected: 'Selected item',
+      placeholder: '...',
+      lable: '...'
+      items: [string|number|object],
+      darkTheme: true/false,
+      searchMode: true/false,
+      closeOnSelect:  true/false,
+      nativeSelectMode: true/false,
+      listDisplayMode: true/false,
+      language: 'ru/en',
+      styles: {
+        head: {
+          background: '...',
+        },
+        list: {...},
+        chips: {...},
+        caret: {...},
+        placeholder: {...},
+        lable: {..},
+      },
+      event: '...',
+      url: 'http/...',
+      multiselect: true/false,
+      multiselectTag: true/false,
+   * } 
+   */
+  constructor(setting: ICgSelect) {
+    this.init(setting);
+    this.render();
+    this.closeSelectClick();
+    this.initEvent();
+  }
+
+  //Getters
+  /**
+   * @returns {string[] | string} Returns the selected element(s) as an array / element / null.
+   * @description Getter returning the selected element(s) of the select.
+   */
+  get value(): string | string[] {
+    return this.selectedItems ?? null;
+  }
+
+  /**
+   * @returns {number | number[]} Returns the indices of the selected element(s) as an array / empty array.
+   * @description A getter that returns the indexes of the selected element(s) of the select.
+   */
+  get indexesOf(): number | number[] {
+    return this.indexes ?? [];
+  }
+
+  /**
+   * Private method for initializing an instance of the ICgSelect class.
+   * @method init
+   * @member
+   * @private
+   * @param {ISgSelect} setting passed select settings.
+   * @description Private method. General initialization of the select. Obtaining tinctures and converting select elements.
+   * @example
+   *  {
+        selector: '.cg-dropdown_one',
+        placeholder: 'Choose a car',
+        items: [
+          'BMW',
+          {
+            id: '213sade',
+            title: 'Opel',
+            value: 1,
+          },
+          'Mersedes',
+          'MAN',
+          'max',
+        ],
+        darkTheme: true,
+        multiselect: true,
+        multiselectTag: true,
+      }
+   */
+  private init(setting: ICgSelect): void {
+    const {
+      items,
+      multiselect,
+      multiselectTag,
+      url,
+      selector,
+      listDisplayMode,
+      nativeSelectMode,
+      searchMode,
+      darkTheme,
+      language,
+      styles,
+      lable,
+      event,
+      selected,
+      placeholder,
+    } = setting;
+
+    this.options = setting;
+
+    this.multiselect = multiselect;
+    this.multiselectTag = multiselectTag;
+    this.url = url;
+    this.selector = selector;
+    this.items = items;
+    this.searchMode = searchMode;
+    this.darkTheme = darkTheme;
+    this.language = language;
+    this.nativeSelectMode = nativeSelectMode;
+    this.listDisplayMode = listDisplayMode;
+    this.styles = styles;
+    this.lable = lable;
+    this.event = event;
+    this.selected = selected;
+    this.placeholder = placeholder;
+
+    const elem = document.querySelector(this.selector!);
+    this.element = elem;
+
+    this.element?.addEventListener('click', (e) => {
+      e.preventDefault();
+      this.open();
+    });
+
+    this.items = [];
+
+    if (this.url && !items) {
+      this.renderUrl();
+      return;
+    }
+
+    if (this.lable) {
+      const lableItem = document.createElement('h1');
+      const textLable = document.createTextNode(this.lable);
+
+      lableItem.appendChild(textLable);
+      lableItem.classList.add('label');
+
+      this.element!.insertAdjacentElement('beforebegin', lableItem);
+    }
+
+    items.forEach((dataItem: any, index: number) => {
+      let itemInputs: IDataItem = {
+        ItemValue: dataItem,
+        category: dataItem.category,
+        categoryItems: dataItem.categoryItems,
+      };
+
+      if (itemInputs.category && itemInputs.categoryItems) {
+        this.category = itemInputs.category!;
+        this.items.push(this.category);
+        itemInputs.categoryItems.forEach(
+          (categoryItem: string | IItems | any, indexCategory: number) => {
+            this.items.push(getFormatItem(categoryItem, indexCategory));
+          },
+        );
+      } else {
+        this.items.push(getFormatItem(itemInputs.ItemValue, index));
+      }
+    });
+  }
+
+  /**
+   * @private
+   * @method render
+   * @param {string} select  optional element. Passed to the initSelected.
+   * @description Render elements in select.
+   */
+  private render(select?: string): void {
+    const random = Math.random().toString(36).substring(2, 10);
+
+    if (select || (select && this.styles)) {
+      this.initSelected(select);
+      customStyles(this.element!, this.styles!);
+    } else {
+      this.initSelected();
+    }
+
+    const ulList = document.createElement('ul');
+    const nativeSelect = createNativeSelect();
+
+    let inputSearch: HTMLInputElement;
+    let textNode: Text;
+
+    this.randomId = random;
+
+    ulList.classList.add('list');
+
+    if (this.styles) {
+      customStylesFormat(this.styles.list!, ulList);
+    }
+
+    if (this.searchMode) {
+      if (this.language === 'ru') {
+        inputSearch = createInputSearch(random, ru.placeholder);
+      } else {
+        inputSearch = createInputSearch(random, en.placeholder);
+      }
+
+      customStylesFormat(this.styles?.search!, inputSearch);
+      ulList.appendChild(inputSearch);
+    }
+
+    this.element?.appendChild(ulList);
+
+    this.items.forEach((dataItem: IItems | any) => {
+      this.element?.appendChild(nativeSelect);
+
+      const liItem = document.createElement('li');
+      const nativeOption = createNativeSelectOption();
+      const strongItem = document.createElement('strong');
+
+      liItem.classList.add('list__item');
+      strongItem.classList.add('category');
+
+      if (this.multiselect) {
+        const checkBox = document.createElement('input');
+        checkBox.type = 'checkbox';
+        checkBox.setAttribute('id', `chbox-${dataItem.id}`);
+        liItem.appendChild(checkBox);
+
+        if (this.multiselectTag) {
+          checkBox.classList.add('displayHide');
+        }
+
+        nativeSelect.setAttribute('multiple', 'multiple');
+      }
+
+      if (dataItem.title) {
+        nativeOption.text = dataItem.title;
+        nativeOption.value = dataItem.title;
+        textNode = document.createTextNode(dataItem.title);
+
+        nativeSelect.appendChild(nativeOption);
+        liItem.appendChild(textNode);
+        ulList.appendChild(liItem);
+      } else {
+        // Для отрисовки категорий
+        textNode = document.createTextNode(dataItem);
+        strongItem.appendChild(textNode);
+        ulList.appendChild(strongItem);
+      }
+    });
+
+    this.items.filter((item: IItems | any, index: number) => {
+      if (typeof item !== 'object') {
+        this.items.splice(index, 1);
+      }
+
+      return item;
+    });
+
+    this.list = this.element!.querySelector('.list');
+    this.caret = this.element!.querySelector('.caret');
+
+    if (this.darkTheme == false) {
+      this.checkTheme();
+    }
+
+    if (this.nativeSelectMode === true) {
+      this.selectMode(this.nativeSelectMode);
+    }
+
+    if (this.listDisplayMode) {
+      this.displayMode(this.listDisplayMode);
+    }
+
+    this.addOptionsBehaviour();
+  }
+
+  /**
+   * @private
+   * @method renderUrl
+   * @description Rendering elements in the select passed from the URL and setting them up.
+   */
+  private async renderUrl() {
+    const response = await fetch(this.url!);
+    const dataUrl = await response.json();
+    console.log(dataUrl);
+
+    const nativeSelect = createNativeSelect();
+
+    dataUrl.forEach((dataItem: IItems, index: number) => {
+      const item = {
+        id: dataItem.id,
+        title: dataItem.title,
+        value: index,
+      };
+
+      const ulUrl = this.element!.querySelector('.list');
+
+      const nativeOption = createNativeSelectOption();
+      const liUrl = document.createElement('li');
+      const textUrl = document.createTextNode(item.title);
+
+      if (this.multiselect) {
+        const checkBox = document.createElement('input');
+        checkBox.type = 'checkbox';
+
+        if (this.multiselectTag) {
+          checkBox.classList.add('displayHide');
+        }
+
+        checkBox.setAttribute('id', `chbox-${item.id}`);
+        nativeSelect.setAttribute('multiple', 'multiple');
+
+        liUrl.appendChild(checkBox);
+      }
+
+      liUrl.classList.add('list__item');
+      nativeOption.value = item.title;
+      nativeOption.text = item.title;
+
+      nativeSelect.appendChild(nativeOption);
+      liUrl.appendChild(textUrl);
+      ulUrl!.appendChild(liUrl);
+
+      this.items.push(item);
+    });
+
+    this.element!.appendChild(nativeSelect);
+
+    this.items.filter((item: IItems | string | any, index: number) => {
+      if (typeof item !== 'object') {
+        this.items.splice(index, 1);
+      }
+      return item;
+    });
+
+    this.addOptionsBehaviour();
+  }
+
+  /**
+   * @method initSelected
+   * @param {string} select optional element. Used in the selectedIndex method.
+   * @description Renders and styles the select.
+   * @private
+   */
+  private initSelected(select?: string): void {
+    if (this.selected) {
+      createSelected(this.element!, this.selected);
+    } else if (this.placeholder) {
+      createSelected(this.element!, this.placeholder);
+    } else {
+      if (this.language && this.language === 'ru') {
+        createSelected(this.element!, ru.selectPlaceholder);
+      } else {
+        createSelected(this.element!, en.selectPlaceholder);
+      }
+    }
+
+    if (select) {
+      createSelected(this.element!, select, this.styles);
+    }
+
+    if (this.styles) {
+      customStyles(this.element!, this.styles);
+    }
+  }
+
+  /**
+   * @private
+   * @description Opens and closes the list by the passed event.
+   * @method initEvent
+   */
+  private initEvent() {
+    if (!this.event) {
+      return;
+    }
+
+    if (this.event) {
+      if (this.event === 'mouseenter') {
+        this.element!.addEventListener(this.event, () => {
+          this.open();
+        });
+        this.element!.addEventListener('mouseleave', () => {
+          this.close();
+        });
+      }
+    }
+  }
+
+  /**
+   * @private
+   * @param {boolean} oneClick optional parameter passed from the buttonControl function.
+   * @description Opens a list to select an element.
+   * @method open
+   */
+  private open(oneClick?: boolean): void {
+    if (oneClick === true) {
+      this.list!.classList.add('open');
+      this.caret!.classList.add('caret_rotate');
+    } else {
+      this.list!.classList.toggle('open');
+      this.caret!.classList.toggle('caret_rotate');
+    }
+  }
+
+  /**
+   * @private
+   * @description Closes the list.
+   * @method close
+   */
+  private close(): void {
+    this.list?.classList.remove('open');
+    this.caret?.classList.remove('caret_rotate');
+  }
+
+  /**
+   * @private
+   * @description Closes the list on click outside of an element.
+   * @method closeSelectClick
+   */
+  private closeSelectClick(): void {
+    const dropdown = document.querySelector(`${this.options.selector}`);
+
+    document.addEventListener('click', (e) => {
+      const withinBoundaries = e.composedPath().includes(dropdown!);
+      if (!withinBoundaries) {
+        if (this.btnCntr) {
+          return;
+        } else {
+          this.close();
+        }
+      }
+    });
+  }
+
+  /**
+   * @private
+   * @description A method that implements the selection of elements in different modes.
+   * @method addOptionsBehaviour
+   */
+  private addOptionsBehaviour() {
+    const options = this.element?.querySelectorAll('.list__item');
+    const select: HTMLElement | null | undefined = this.element?.querySelector('.selected');
+    const nativeOption = this.element!.querySelectorAll('.nativeSelect__nativeOption');
+
+    let selectedItemsClear: ISelectedItems = {
+      placeholder: this.placeholder!,
+      selected: this.selected!,
+    };
+
+    const ulMultipul = document.createElement('ul');
+
+    if (this.multiselect) {
+      this.selectedItems = [];
+      ulMultipul.classList.add('multiselect-tag');
+      select?.classList.add('overflow-hidden');
+    }
+
+    if (this.searchMode) {
+      this.searchModeSelect(this.randomId);
+    }
+
+    options?.forEach((option: Element, index: number) => {
+      option.addEventListener('click', (event) => {
+        if (Array.isArray(this.selectedItems)) {
+          selectedItemsClear = {
+            placeholder: this.placeholder!,
+            selected: this.selected!,
+            selectedItems: this.selectedItems,
+            indexes: this.indexes,
+            darkTheme: this.darkTheme,
+            multiselectTag: this.multiselectTag,
+          };
+        }
+
+        const item: IItems = this.items[index];
+
+        const checkIndex = this.indexes.indexOf(index);
+
+        if (this.closeOnSelect == false || this.multiselect) {
+          event.stopPropagation();
+          event.preventDefault();
+        }
+
+        if (this.multiselect) {
+          option.classList.toggle('active');
+
+          const checkBox: HTMLInputElement | null = option.querySelector('input[type="checkbox"]');
+
+          if (checkBox) {
+            if (!(event.target instanceof HTMLInputElement)) {
+              checkBox.checked = !checkBox.checked;
+            }
+
+            if (checkIndex == -1) {
+              this.indexes.push(index);
+              nativeOptionMultiple(nativeOption, item.title, true);
+              select!.textContent = '';
+
+              if (this.multiselectTag) {
+                if (Array.isArray(this.selectedItems)) {
+                  const dataBreadCrumb: ICreateBreadCrumb = {
+                    option: this.options,
+                    element: this.element,
+                    indexes: this.indexes,
+                    selectedItems: this.selectedItems,
+                  };
+
+                  this.selectedItems.push(item.title);
+                  select!.appendChild(ulMultipul);
+                  ulMultipul.appendChild(
+                    createBreadCrumb(dataBreadCrumb, item.title, index, item.id),
+                  );
+                }
+              } else {
+                if (Array.isArray(this.selectedItems)) {
+                  this.selectedItems.push(item.title);
+                  select!.innerText = this.selectedItems.join(',');
+                }
+              }
+            } else {
+              if (this.multiselectTag) {
+                const tagItem = document.getElementById(`tag-${index}-${item.id}`);
+                ulMultipul.removeChild<Element>(tagItem!);
+              }
+
+              if (Array.isArray(this.selectedItems)) {
+                this.selectedItems.splice(checkIndex, 1);
+                this.indexes.splice(checkIndex, 1);
+                nativeOptionMultiple(nativeOption, item.title, false);
+              }
+            }
+
+            if (!this.selectedItems.length) {
+              getSelectText(selectedItemsClear, select);
+            } else {
+              if (this.multiselectTag) {
+                select!.appendChild(ulMultipul);
+              } else {
+                if (Array.isArray(this.selectedItems)) {
+                  select!.innerText = this.selectedItems.join(',');
+                }
+              }
+            }
+          }
+        } else {
+          select!.textContent = item.title;
+          this.selectedItems = item.title;
+
+          nativeOptionOrdinary(nativeOption, item.title);
+
+          options.forEach((option) => {
+            option.classList.remove('active');
+          });
+          option.classList.add('active');
+        }
+
+        clearSelect(select!, this.element!, selectedItemsClear);
+      });
+    });
+  }
+
+  /**
+   * @private
+   * @method checkTheme
+   * @description Changes the color scheme from dark to light.
+   */
+  private checkTheme(): void {
+    const select = this.element!.querySelector('.cg-select');
+    const caret = this.element!.querySelector('.caret');
+    const list = this.element!.querySelector('ul.list');
+    const search = this.element!.querySelector('.inputSearch');
+
+    if (this.darkTheme == false) {
+      select!.classList.add('selectWhite');
+      caret!.classList.add('caretWhite');
+      list!.classList.add('listWhite');
+
+      if (this.searchMode == true) {
+        search!.classList.add('inputWhite');
+      }
+    } else if (this.darkTheme == true) {
+      return;
+    } else {
+      throw new Error('Styles error or invalid value entered!');
+    }
+  }
+
+  /**
+   * @private
+   * @param {boolean} nativeSelectMode parameter responsible for adding native select.
+   * @description Changes the display of the select on mobile devices.
+   * @method selectMode
+   */
+  private selectMode(nativeSelectMode: boolean) {
+    let win = window.outerWidth;
+
+    if (nativeSelectMode === true) {
+      const select = this.element!.querySelector('.cg-select');
+      const list = this.element!.querySelector('.list');
+      const nativeSelect = this.element!.querySelector('.nativeSelect');
+
+      if (win < 576) {
+        select!.classList.add('displayHide');
+        list!.classList.add('displayHide');
+        nativeSelect!.classList.add('nativeSelectActive');
+      } else if (win > 576) {
+        select!.classList.remove('displayHide');
+        list!.classList.remove('displayHide');
+        nativeSelect!.classList.remove('nativeSelectActive');
+        nativeSelect!.classList.add('displayHide');
+      }
+    } else {
+      return;
+    }
+  }
+
+  /**
+   * @description The method that implements the search for elements in the select.
+   * @private
+   * @param {string} random unique value for input element.
+   * @method searchMode
+   */
+  private searchModeSelect(random: string) {
+    const input = this.element!.querySelector(`#searchSelect-${random}`) as HTMLInputElement;
+    const searchSelect = this.element!.querySelectorAll('.list__item');
+    const result = document.createElement('p');
+
+    let textNode: Text;
+    if (this.language && this.language === 'ru') {
+      textNode = document.createTextNode(`${ru.textInListSearch}`);
+    } else {
+      textNode = document.createTextNode(`${en.textInListSearch}`);
+    }
+
+    result.appendChild(textNode);
+    result.classList.add('displayHide');
+    result.classList.add('noRezult');
+    input!.parentElement!.appendChild(result);
+
+    input!.addEventListener('click', (e) => {
+      e.stopPropagation();
+    });
+
+    if (input instanceof HTMLInputElement) {
+      input!.oninput = function () {
+        let valueSearch: string = input.value.trim().toLowerCase();
+        let anyMatch = false;
+
+        if (valueSearch != '') {
+          searchSelect.forEach((elem) => {
+            let isMatching = new RegExp(valueSearch, 'gi').test(elem.textContent!);
+            anyMatch = anyMatch || isMatching;
+
+            if (elem.textContent!.toLowerCase().search(valueSearch) == -1) {
+              elem.classList.add('displayHide');
+            } else {
+              elem.classList.remove('displayHide');
+            }
+          });
+
+          result.classList.toggle('displayHide', anyMatch);
+        } else {
+          searchSelect.forEach((elem) => {
+            elem.classList.remove('displayHide');
+            result.classList.add('displayHide');
+          });
+        }
+      };
+    }
+  }
+
+  /**
+   * @private
+   * @param {boolean} listDisplayMode parameter responsible for displaying the selection in the form of a modal window.
+   * @description Changes the display of a sheet with a selection as a modal window.
+   * @method displayMode
+   */
+  private displayMode(listDisplayMode: boolean): void {
+    if (listDisplayMode) {
+      const modal = document.createElement('div');
+      const body = document.querySelector('body');
+      const list = this.list!;
+
+      modal.appendChild(list);
+      this.element!.appendChild(modal);
+
+      this.element!.addEventListener('click', () => {
+        modal.classList.toggle('modal');
+        list.classList.toggle('listModal');
+        body!.classList.toggle('overflowHide');
+      });
+    } else {
+      return;
+    }
+  }
+
+  // Public methods
+
+  /**
+   * @param {number} numberItem returned element number.
+   * @returns {HTMLElement} returns a reference to the selected HTML element.
+   * @method getElement
+   */
+  public getElement(numberItem: number): IItems[] | string[] | any {
+    if (numberItem > this.items.length) {
+      return;
+    }
+
+    return this.items[numberItem];
+  }
+
+  /**
+   * @param {ILanguage} language the object in which the fields for connecting the language are located has two mandatory fields placeholder, textInListSearch, selectPlaceholder.
+   * @description a method that allows you to change the placeholder in the search and the text that is displayed if there is no result.
+   * @method addLanguage
+   */
+  public addLanguage(language: ILanguage) {
+    const { placeholder, textInListSearch, selectPlaceholder } = language;
+
+    const select = this.element!.querySelector('.selected');
+    const textNodeSelect = document.createTextNode(selectPlaceholder);
+    select!.appendChild(textNodeSelect);
+
+    if (this.searchMode) {
+      const search = this.element!.querySelector('.inputSearch');
+      const textNoRezult = this.element!.querySelector('.noRezult');
+      const textNode = document.createTextNode(textInListSearch);
+
+      search!.setAttribute('placeholder', placeholder);
+      search!.setAttribute('placeholder', placeholder);
+
+      textNoRezult!.textContent = '';
+      textNoRezult!.appendChild(textNode);
+    }
+  }
+
+  /**
+   * @param {HTMLInputElement} button - HTML button.
+   * @param {string} method - open/close method.
+   * @description A method that allows you to open / close the select using buttons.
+   * @method buttonControl
+   */
+  public buttonControl(button: Element, method: string) {
+    if (this.listDisplayMode) {
+      return;
+    }
+
+    this.btnCntr = button!;
+    button.addEventListener('click', () => {
+      if (method.toLowerCase() === 'open') {
+        this.open(true);
+      } else if (method.toLowerCase() === 'close') {
+        this.close();
+      } else {
+        return;
+      }
+    });
+  }
+
+  /**
+   * @param {boolean} value - Passed parameter to add the disabled attribute.
+   * @description A method that allows you to toggle the state of the disabled select.
+   * @method disabled
+   */
+  public disabled(value: boolean) {
+    const select = this.element!.querySelector('.cg-select');
+    const nativeSelect = this.element!.querySelector('.nativeSelect');
+
+    if (value === true) {
+      this.element!.setAttribute('disabled', 'true');
+      nativeSelect!.setAttribute('disabled', 'true');
+      select!.classList.add('disabled');
+    } else {
+      this.element!.removeAttribute('disabled');
+      nativeSelect!.removeAttribute('disabled');
+      select!.classList.remove('disabled');
+    }
+  }
+
+  /**
+   * @param {string | IItems} item added element.
+   * @description adds the given element to the end of the list and redraws the list. Cannot be used when passing elements with categories.
+   * @method addItem
+   */
+  public addItem(item: IItems | string | number) {
+    if (this.category) {
+      console.log('can`t add item to category');
+      return;
+    }
+
+    if (!item) {
+      return false;
+    }
+
+    const index = this.items.length;
+
+    this.items.push(getFormatItem(item, index));
+    this.render();
+  }
+
+  /**
+   * @param {number} index the index of the element to be removed.
+   * @description removes the element by index from the list and redraws it. Cannot be used when passing elements with categories.
+   * @method deleteItem
+   */
+  public deleteItem(index: number) {
+    if (this.category) {
+      console.log('can`t add item to category');
+      return;
+    }
+
+    const item = this.items[index];
+
+    this.items.splice(index, 1);
+    this.render();
+  }
+
+  /**
+   * @description removes all elements from the list and redraws it.
+   * @method deleteItemAll
+   */
+  public deleteItemAll() {
+    this.items.splice(0, this.items.length);
+    this.render();
+  }
+
+  /**
+   * @param {number} index the index of the selected element.
+   * @description selects the element that will be initially rendered in the select.
+   * @method selectIndex
+   */
+  public selectIndex(index: number) {
+    if (this.category) {
+      console.log('can`t add item to category');
+      return;
+    }
+
+    const options = this.element!.querySelectorAll('.list__item') as NodeListOf<HTMLElement>;
+
+    if (index > options!.length) {
+      return;
+    }
+
+    const select: string = options[index].innerText;
+    this.render(select);
+  }
+}

src/components/create-element/create-element.interface.ts

@@ -0,0 +1,27 @@
+import { ICgSelect } from 'interfaces/cg-select.interface';
+
+/**
+ * @description cSettings for creating chips.
+ */
+export interface ICreateBreadCrumb {
+  /**
+   * A specific instance of a class.
+   * @type {Element | null}
+   */
+  element: Element | null;
+  /**
+   * Select settings.
+   * @type {ICgSelect}
+   */
+  option: ICgSelect;
+  /**
+   * Array of indexes of selected elements.
+   * @type {number[]}
+   */
+  indexes: number[];
+  /**
+   * Array with selected elements.
+   * @type {string[]}
+   */
+  selectedItems: string[];
+}

src/components/create-element/create-element.ts

@@ -1,22 +1,48 @@
-import { customStylesFormat, nativeOptionMultiple } from './utils';
-/**
- * @module createBreadcrumb
- */
+import { customStylesFormat, nativeOptionMultiple } from '../utils/utils';
+import { ICreateBreadCrumb } from './create-element.interface';
 
 /**
- * Метод который создает и отвечает за поведение chips
- * @param {object} data объект в котором содержатся настройки и элементы селекта
- * @param {string} title имя выбранного элемента для отрисовки chips
- * @param {number} index индекс выбранного элемента для отрисовки chips
- * @param {string} id уникальное id выбранного элемента
- * @returns {HTMLElement} возвращает сформированный HTMLElement chips item
+ * The method that creates the native select.
+ * @returns {HTMLSelectElement} Returns the created native select.
  */
-export function createBreadcrumb(data, title, index, id) {
+export function createNativeSelect(): HTMLSelectElement {
+  const nativeSelect = document.createElement('select');
+
+  nativeSelect.setAttribute('name', 'dataSelect');
+  nativeSelect.classList.add('nativeSelect');
+  return nativeSelect;
+}
+
+/**
+ * The method that creates Options for the native select.
+ * @returns {HTMLOptionElement} Returns the generated Options of the native select.
+ */
+export function createNativeSelectOption(): HTMLOptionElement {
+  const nativeOption = document.createElement('option');
+
+  nativeOption.classList.add('nativeSelect__nativeOption');
+  return nativeOption;
+}
+
+/**
+ * The method that creates and is responsible for the behavior of the chips.
+ * @param {ICreateBreadCrumb} data an object that contains settings and select elements.
+ * @param {string} title the name of the selected element to draw chips.
+ * @param {number} index index of the selected item to draw chips.
+ * @param {string} id unique id of the selected element.
+ * @returns {HTMLElement} returns the generated HTMLElement chips item.
+ */
+export function createBreadCrumb(
+  data: ICreateBreadCrumb,
+  title: string,
+  index: number,
+  id: string,
+): HTMLLIElement {
   const { element, option, indexes, selectedItems } = data;
   const { placeholder, styles } = option;
 
-  const selected = element.querySelector('.selected');
-  const nativeOption = element.querySelectorAll('.nativeSelect__nativeOption');
+  const selected: HTMLElement | null | undefined = element?.querySelector('.selected');
+  const nativeOption = element!.querySelectorAll('.nativeSelect__nativeOption');
 
   const liChip = document.createElement('li');
   const textNode = document.createTextNode(title);
@@ -38,7 +64,7 @@ export function createBreadcrumb(data, title, index, id) {
 
   if (styles) {
     const { chips } = styles;
-    customStylesFormat(chips, liChip);
+    customStylesFormat(chips!, liChip);
   }
 
   svgIcon.addEventListener('click', (event) => {
@@ -47,7 +73,7 @@ export function createBreadcrumb(data, title, index, id) {
     nativeOptionMultiple(nativeOption, title, false);
 
     const deleteIcon = indexes.indexOf(index);
-    let checkBox = '';
+    let checkBox: any;
 
     indexes.splice(deleteIcon, 1);
     selectedItems.splice(deleteIcon, 1);
@@ -62,45 +88,22 @@ export function createBreadcrumb(data, title, index, id) {
     checkBox.parentElement.classList.remove('active');
 
     if (!selectedItems.length) {
-      selected.innerText = placeholder;
+      selected!.innerText = placeholder!;
     }
 
-    liChip.parentElement.removeChild(liChip);
+    liChip.parentElement!.removeChild(liChip);
   });
 
   return liChip;
 }
 
 /**
- * Метод который создает нативный селект
- * @returns {HTMLSelectElement} Возвращает созданный нативный селект
+ * The method that creates a search for elements in the select.
+ * @param {string} random unique value for input element.
+ * @param {string} lenguage text in specific language passed from language.ts file
+ * @returns {HTMLInputElement} Returns the rendered input element.
  */
-export function createNativeSelect() {
-  const nativeSelect = document.createElement('select');
-
-  nativeSelect.setAttribute('name', 'dataSelect');
-  nativeSelect.classList.add('nativeSelect');
-  return nativeSelect;
-}
-
-/**
- * Метод который создает Options для нативного селекта
- * @returns {HTMLOptionElement} Возвращает созданные Options нативного селекта
- */
-export function createNativeSelectOption() {
-  const nativeOption = document.createElement('option');
-
-  nativeOption.classList.add('nativeSelect__nativeOption');
-  return nativeOption;
-}
-
-/**
- * Метод который создает поиск элементов в селекте
- * @param {string} random уникальное значение для input элемента.
- * @param {string} lenguage текст на определенном языке переданный из файла language.js
- * @returns {HTMLInputElement} Возвращает сформированный input елемент.
- */
-export function createInputSearch(random, lenguage) {
+export function createInputSearch(random: string, lenguage: string): HTMLInputElement {
   const inputSearch = document.createElement('input');
 
   inputSearch.type = 'text';

src/components/utils.js

@@ -1,227 +0,0 @@
-/**
- * Utils module
- * @module Utils
- */
-
-/**
- * Создание кнопки выбора элементов
- * @param {HTMLElement} element созданный экземпляр класса DropDown
- * @param {string} content placeholer передаваемый из настроек селекта
- * @param {object} styles не обязательный параметр. Объект в котором находяться настройки кастомизации частей селекта
- */
-export function createSelected(element, content, styles) {
-  if (content) {
-    element.innerHTML = `
-      <div class="cg-select">
-         <p class="selected">${content}</p>
-          <div class="caret"></div>
-       </div>
-      `;
-  }
-
-  if (styles) {
-    customStyles(element, styles);
-
-    element.innerHTML = `
-      <div class="cg-select" style = "${styles}">
-          <p class="selected" style = "${styles}">${content}</p>
-          <div class="caret" style = "${styles}"></div>
-      </div>
-    `;
-  }
-}
-
-/**
- * Поиск и стилизация елементов полученных из styles экземпляра DropDown
- * @param {HTMLElement} element созданный экземпляр класса DropDown
- * @param {object} styles объект в котором находяться настройки кастомизации частей селекта
- */
-export function customStyles(element, styles) {
-  if (!styles) {
-    return;
-  }
-
-  const { head, caret, placeholder, lable } = styles;
-
-  const cgSelect = element.querySelector('.cg-select');
-  const caretSelect = element.querySelector('.caret');
-  const placeholderSelect = element.querySelector('.selected');
-  const lableItem = element.parentElement.querySelector('h1.label');
-
-  customStylesFormat(head, cgSelect);
-  customStylesFormat(caret, caretSelect);
-  customStylesFormat(lable, lableItem);
-
-  if (placeholderSelect) {
-    customStylesFormat(placeholder, placeholderSelect);
-  }
-}
-
-/**
- * Универсальный метод для стилизации селекта
- * @param {object} elemOption объект полученное из объекта styles у которого мы получаем ключ-значение стилей
- * @param {HTMLElement} selector  HTMLElement подвергающиеся кастомизации
- */
-export function customStylesFormat(elemOption, selector) {
-  if (elemOption) {
-    Object.entries(elemOption).forEach(([key, value]) => {
-      selector.style[key] = value;
-    });
-  }
-}
-
-/**
- * Проверка содержит ли item  указанные свойства,
- * @param {object} item проверяемый на определенную структуру элемент
- * @returns {boolean} возвращает true/false если item содержит указанные свойства
- */
-export function checkItemStruct(item) {
-  if (item && typeof item !== 'object') {
-    return false;
-  }
-
-  return item.hasOwnProperty('id') && item.hasOwnProperty('title') && item.hasOwnProperty('value');
-}
-
-/**
- * Вставка изначального текста селекта(до выбора)
- * @param {object} data объект в котором находяться title селекта
- * @param {HTMLElement} select елемент селекта, куда будет вставляться title
- * @returns {HTMLElement} возвращает сформированный елемент селекта
- */
-export function getSelectText(data, select) {
-  const { placeholder, selected } = data;
-
-  if (placeholder) {
-    select.innerText = placeholder;
-  } else if (selected) {
-    select.innerText = selected;
-  } else {
-    select.innerText = 'Select...';
-  }
-  return select;
-}
-
-/**
- * Преобразование каждого елемента полученного из поля Items;
- * @param {object | string} dataItem полученный елемент переданный при создании селекта может быть как object/string
- * @param {number} index индекс этого элемента
- * @returns {object} возвращает сформированный объект
- */
-export function getFormatItem(dataItem, index) {
-  const random = Math.random().toString(36).substring(2, 10);
-  let item = {};
-
-  if (checkItemStruct(dataItem)) {
-    item = {
-      id: dataItem.id,
-      title: dataItem.title,
-      value: index,
-    };
-  } else {
-    item = {
-      id: random,
-      title: dataItem,
-      value: index,
-    };
-  }
-
-  return item;
-}
-
-/**
- * Поведение нативного(одинарного) селекта при выборе кастомного
- * @param {NodeList} element NodeList нативного селекта
- * @param {object} item выбранный элемент в кастомном селекте
- */
-export function nativeOptionOrdinary(element, item) {
-  element.forEach((option) => {
-    option.removeAttribute('selected');
-    if (option.textContent === item) {
-      option.setAttribute('selected', 'selected');
-    }
-  });
-}
-
-/**
- * Поведение нативного(Multiple) селекта при выборе в кастомном
- * @param {NodeList} element NodeList нативного селекта
- * @param {object} item выбранный элемент в кастомном селекте
- * @param {boolean} condition специальный флаг при котором добавляются/убераются атрибуты у нативного селекта
- */
-export function nativeOptionMultiple(element, item, condition) {
-  element.forEach((option) => {
-    if (condition == true) {
-      if (option.textContent === item) {
-        option.setAttribute('selected', 'selected');
-      }
-    } else if (condition == false) {
-      if (option.textContent === item) {
-        option.removeAttribute('selected');
-      }
-    } else {
-      return;
-    }
-  });
-}
-
-/**
- * Создание кнопки отчиски селекта, при единичном выборе.
- * @param {HTMLElement} select место в селекте которое будет переназначено на ''.
- * @param {HTMLElement} element экземпляр класса DropDown.
- * @param {object} dataSelectText текст который отрисовывается в селекте.
- */
-export function clearSelect(select, element, dataSelectText) {
-  const { selectedItems, indexes, darkTheme, multiselectTag } = dataSelectText;
-
-  const options = element.querySelectorAll('.list__item');
-  const ulMultiSelect = element.querySelector('.multiselect-tag');
-  const svgIcon = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-  const path1 = document.createElementNS('http://www.w3.org/2000/svg', 'path');
-  const path2 = document.createElementNS('http://www.w3.org/2000/svg', 'path');
-  const checkBox = element.querySelectorAll('li input');
-
-  svgIcon.setAttribute('viewBox', '0 0 10 10');
-  path1.setAttribute('d', 'M2,8 L8,2');
-  path2.setAttribute('d', 'M2,2 L8,8');
-  svgIcon.appendChild(path1);
-  svgIcon.appendChild(path2);
-
-  if (multiselectTag && multiselectTag == true) {
-    return;
-  }
-
-  if (darkTheme === true || !darkTheme) {
-    path1.classList.add('pathWhite');
-    path2.classList.add('pathWhite');
-  }
-
-  if (darkTheme === false) {
-    path1.classList.add('pathBlack');
-    path2.classList.add('pathBlack');
-  }
-
-  svgIcon.classList.add('svg-icon');
-  svgIcon.classList.add('svg-clear');
-
-  select.appendChild(svgIcon);
-
-  svgIcon.addEventListener('click', () => {
-    select.innerText = '';
-
-    if (Array.isArray(selectedItems)) {
-      selectedItems.splice(0);
-      indexes.splice(0);
-    }
-
-    checkBox.forEach((item) => {
-      item.checked = false;
-    });
-
-    getSelectText(dataSelectText, select);
-
-    options.forEach((option) => {
-      option.classList.remove('active');
-    });
-  });
-}

src/components/utils/urils.interface.ts

@@ -0,0 +1,59 @@
+import { IItems } from 'interfaces/items.interface';
+
+/**
+ * @description Receive Item Settings.
+ */
+export interface IDataItem {
+  /**
+   * Optional parameter. Item group category.
+   * @type {string}
+   */
+  category?: string;
+  /**
+   * Optional parameter. Array with elements.
+   * @type {IItems[] | string[] | any}
+   */
+  categoryItems?: IItems[] | string[];
+  /**
+   * The value of the passed element.
+   * @type {string | IItems | number}
+   */
+  ItemValue: string | IItems | number;
+}
+
+/**
+ * @description Settings for select text, etc.
+ */
+export interface ISelectedItems {
+  /**
+   * Placeholder  optional parameter to which the text of the select placeholder is passed.
+   * @type {string}
+   */
+  placeholder?: string;
+  /**
+   * An optional parameter, which is passed the element that will be selected initially in the select.
+   * @type {string}
+   */
+  selected?: string;
+  /**
+   * Array of selected items from the list.
+   * @type {string[]}
+   */
+  selectedItems?: string[];
+  /**
+   * Array of indexes of selected elements.
+   * @type {number[]}
+   */
+  indexes?: number[];
+  /**
+   * An optional parameter that is responsible for the behavior of the select,
+   * for him, *** works only in a place with a multiselect connection.
+   * @type {boolean}
+   */
+  multiselectTag?: boolean;
+  /**
+   * An optional parameter that is responsible for enabling a light/dark theme by default, the dark theme is set.
+   * @type {boolean}
+   */
+  darkTheme?: boolean;
+}

src/components/utils/utils.ts

@@ -0,0 +1,237 @@
+/**
+ * Utils module
+ * @module Utils
+ */
+import { IStyle } from 'interfaces/cg-select.interface';
+import { IItems } from 'interfaces/items.interface';
+import { ISelectedItems } from './urils.interface';
+
+/**
+ * Converting each item obtained from the Items field;
+ * @param {any} dataItem received element passed when creating the select.
+ * @param {number} index index of this element.
+ * @returns {IItems} returns the formed object
+ */
+export function getFormatItem(dataItem: any, index: number): IItems {
+  const random = Math.random().toString(36).substring(2, 10);
+  let item: IItems;
+
+  if (checkItemStruct(dataItem)) {
+    return dataItem;
+  } else {
+    item = {
+      id: random,
+      title: dataItem,
+      value: index,
+    };
+
+    return item;
+  }
+}
+
+/**
+ * Insert initial select text (before selection)
+ * @param {ITextSelect} data the object in which the title of the select is located.
+ * @param {HTMLElement | null | undefined} select select element where title will be inserted.
+ * @returns {HTMLElement} returns the generated select element.
+ */
+export function getSelectText(
+  data: ISelectedItems,
+  select: HTMLElement | null | undefined,
+): HTMLElement {
+  const { placeholder, selected } = data;
+
+  if (placeholder) {
+    select!.innerText = placeholder;
+  } else if (selected) {
+    select!.innerText = selected;
+  } else {
+    select!.innerText = 'Select...';
+  }
+
+  return select!;
+}
+
+/**
+ * Checking if item contains the specified properties.
+ * @param {object} item element to be checked against a certain structure.
+ * @returns {boolean} returns true/false if item contains the specified properties.
+ */
+export function checkItemStruct(item: object): boolean {
+  if (item && typeof item !== 'object') {
+    return false;
+  }
+
+  return item.hasOwnProperty('id') && item.hasOwnProperty('title') && item.hasOwnProperty('value');
+}
+
+/**
+ * Creating an Item Selector Button.
+ * @param {HTMLElement} element instantiated class CgSelect.
+ * @param {string} content placeholer passed from select settings.
+ * @param {object} styles optional parameter. The object in which the settings for customizing parts of the select are located.
+ */
+export function createSelected(element: Element, content?: string, styles?: IStyle) {
+  const select = document.createElement('div');
+  const selected = document.createElement('p');
+  const caret = document.createElement('div');
+
+  select.classList.add('cg-select');
+  selected.classList.add('selected');
+  caret.classList.add('caret');
+
+  select.appendChild(selected);
+  select.appendChild(caret);
+
+  if (content) {
+    const text = document.createTextNode(content);
+    selected.appendChild(text);
+    element.innerHTML = '';
+    element?.insertAdjacentElement('afterbegin', select);
+  } else if (styles) {
+    customStyles(element!, styles);
+    select.setAttribute('style', `${styles}`);
+    selected.setAttribute('style', `${styles}`);
+    caret.setAttribute('style', `${styles}`);
+  }
+}
+
+/**
+ * Creating a clear select button, with a single selection.
+ * @param {HTMLElement} select place in the select that will be reassigned to ''.
+ * @param {Element} element class instance CgSelect.
+ * @param {ISelectedItems} dataSelectText the text that is rendered in the select.
+ */
+export function clearSelect(select: HTMLElement, element: Element, dataSelectText: ISelectedItems) {
+  const { selectedItems, indexes, darkTheme, multiselectTag } = dataSelectText;
+
+  const options = element.querySelectorAll('.list__item');
+  const nativeOption = element!.querySelectorAll('.nativeSelect__nativeOption');
+  const svgIcon = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+  const path1 = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+  const path2 = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+  const checkBox = element.querySelectorAll('li input');
+
+  svgIcon.setAttribute('viewBox', '0 0 10 10');
+  path1.setAttribute('d', 'M2,8 L8,2');
+  path2.setAttribute('d', 'M2,2 L8,8');
+  svgIcon.appendChild(path1);
+  svgIcon.appendChild(path2);
+
+  if (multiselectTag && multiselectTag == true) {
+    return;
+  }
+
+  if (darkTheme === true || !darkTheme) {
+    path1.classList.add('pathWhite');
+    path2.classList.add('pathWhite');
+  }
+
+  if (darkTheme === false) {
+    path1.classList.add('pathBlack');
+    path2.classList.add('pathBlack');
+  }
+
+  svgIcon.classList.add('svg-icon');
+  svgIcon.classList.add('svg-clear');
+
+  select!.appendChild(svgIcon);
+
+  svgIcon.addEventListener('click', () => {
+    select!.innerText = '';
+
+    nativeOption.forEach((option) => {
+      option.removeAttribute('selected');
+    });
+
+    if (Array.isArray(selectedItems)) {
+      selectedItems!.splice(0);
+      indexes!.splice(0);
+    }
+
+    checkBox.forEach((item) => {
+      if (item instanceof HTMLInputElement) {
+        item.checked = false;
+      }
+    });
+
+    getSelectText(dataSelectText, select);
+
+    options.forEach((option) => {
+      option.classList.remove('active');
+    });
+  });
+}
+
+/**
+ * Behavior of a native (single) select when choosing a custom one.
+ * @param {NodeList} element NodeList native select.
+ * @param {any} item selected element in custom select.
+ */
+export function nativeOptionOrdinary(element: NodeListOf<Element> | undefined, item: string) {
+  element!.forEach((option) => {
+    option.removeAttribute('selected');
+    if (option.textContent === item) {
+      option.setAttribute('selected', 'selected');
+    }
+  });
+}
+
+/**
+ * The behavior of the native (Multiple) select when choosing in a custom one.
+ * @param {NodeListOf<Element> | undefined} element NodeList of native select.
+ * @param {string} item selected element in custom select.
+ * @param {boolean} condition a special flag that adds / removes attributes from the native select.
+ */
+export function nativeOptionMultiple(
+  element: NodeListOf<Element> | undefined,
+  item: string,
+  condition: boolean,
+) {
+  element!.forEach((option) => {
+    if (condition == true) {
+      if (option.textContent === item) {
+        option.setAttribute('selected', 'selected');
+      }
+    } else if (condition == false) {
+      if (option.textContent === item) {
+        option.removeAttribute('selected');
+      }
+    } else {
+      return;
+    }
+  });
+}
+
+/**
+ * Finding and styling elements derived from the styles instance CgSelect
+ * @param {Element} element instantiated class CgSelect.
+ * @param {object} styles object in which there are settings for customizing parts of the select.
+ */
+export function customStyles(element: Element, styles: IStyle) {
+  const cgSelect = element.querySelector('.cg-select');
+  const caretSelect = element.querySelector('.caret');
+  const placeholderSelect = element.querySelector('.selected');
+  const lableItem = element.parentElement!.querySelector('h1.label');
+
+  customStylesFormat(styles.head!, cgSelect!);
+  customStylesFormat(styles.caret!, caretSelect!);
+  customStylesFormat(styles.lable!, lableItem!);
+
+  if (placeholderSelect) {
+    customStylesFormat(styles.placeholder!, placeholderSelect);
+  }
+}
+
+/**
+ * Generic Method for Styling a Select.
+ * @param {object} elemOption an object obtained from the styles object from which we get the styles key-value.
+ * @param {HTMLElement} selector  HTMLElement subject to customization.
+ */
+export function customStylesFormat(elemOption: object, selector: any) {
+  if (elemOption) {
+    Object.entries(elemOption).forEach(([key, value]) => {
+      selector.style[key] = value;
+    });
+  }
+}

src/interfaces/cg-select.interface.ts

@@ -0,0 +1,136 @@
+import { IItems } from './items.interface';
+
+/**
+ * @description Select settings.
+ */
+export interface ICgSelect {
+  /**
+   * Unique selector - *mandatory parameter (indicator) that is set when creating a select.
+   * @type {string}
+   */
+  selector?: string;
+  /**
+   * An optional parameter, which is passed the element that will be selected initially in the select.
+   * @type {string}
+   */
+  selected?: string;
+  /**
+   * Placeholder optional parameter to which the text of the select placeholder is passed.
+   * @type {string}
+   */
+  placeholder?: string;
+  /**
+   * *Required parameter (if no other way to get data (url) is specified), this is an array of elements,
+   *  which will be displayed in the select when selected.
+   * @type {IItems[] | string[] | any}
+   */
+  items?: IItems[] | string[] | any;
+  /**
+   * An optional parameter that is responsible for enabling a light / dark theme by default, the dark theme is set (darkTheme == true).
+   * @type {boolean}
+   */
+  darkTheme?: boolean;
+  /**
+   * An optional parameter that adds a live search on the select elements.
+   * @type {boolean}
+   */
+  searchMode?: boolean;
+  /**
+   * An optional parameter that is responsible for the behavior of the select when opening, if closeOnSelect: false,
+   * then when an element is selected in the selector, closing does not occur,
+   * and you can select another element by default, closeOnSelect:true.
+   * @type {boolean}
+   */
+  closeOnSelect?: boolean;
+  /**
+   * An optional parameter that is responsible for the behavior of the select when opened on mobile devices.
+   * @type {boolean}
+   */
+  nativeSelectMode?: boolean;
+  /**
+   * An optional parameter that is responsible for the behavior of the select when opening.
+   * @type {boolean}
+   */
+  listDisplayMode?: boolean;
+  /**
+   * Optional parameter responsible for the localization of some text elements.
+   * @type {string}
+   */
+  language?: string;
+  /**
+   * An optional parameter that adds a lable before the select.
+   * @type {string}
+   */
+  lable?: string;
+  /**
+   * An optional parameter that is responsible for customizing the select elements,
+   * objects with CSS properties for customizable elements are passed to it.
+   * @type {IStyle}
+   */
+  styles?: IStyle;
+  /**
+   * An optional parameter that is responsible for the behavior of the select, passing to this parameter an event of the 'mouseenter' type,
+   * select will open on hover.
+   * @type {string}
+   */
+  event?: string;
+  /**
+   * Required parameter (if no other way to get data (items) is specified),
+   * data that comes from the backend in the format { id: "", title: "", value: ""}.
+   * @type {string}
+   */
+  url?: string;
+  /**
+   * An optional parameter, which is responsible for the behavior of the select, adds the ability to select multiple elements.
+   * Selected elements are rendered as plain text, separated by commas.
+   * @type {boolean}
+   */
+  multiselect?: boolean;
+  /**
+   * An optional parameter that is responsible for the behavior of the select,
+   * for him, *** works only in a place with a multiselect connection.
+   * @type {boolean}
+   */
+  multiselectTag?: boolean;
+}
+
+/**
+ * @description Style Settings.
+ */
+export interface IStyle {
+  /**
+   * Select button customization.
+   * @type {object}
+   */
+  head?: object;
+  /**
+   * Carriage customization.
+   * @type {object}
+   */
+  caret?: object;
+  /**
+   * Customization placeholder.
+   * @type {object}
+   */
+  placeholder?: object;
+  /**
+   * Lable select customization.
+   * @type {object}
+   */
+  lable?: object;
+  /**
+   * Sheet customization with a selection of elements.
+   * @type {object}
+   */
+  list?: object;
+  /**
+   * Search customization.
+   * @type {object}
+   */
+  search?: object;
+  /**
+   * Chips customization with selected elements.
+   * @type {object}
+   */
+  chips?: object;
+}

src/interfaces/items.interface.ts

@@ -0,0 +1,20 @@
+/**
+ * @description Element structure.
+ */
+export interface IItems {
+  /**
+   * Unique item ID.
+   * @type {string}
+   */
+  id: string;
+  /**
+   * Element text value.
+   * @type {string}
+   */
+  title: string;
+  /**
+   * Sequence number, or other information.
+   * @type {number | string}
+   */
+  value: number | string;
+}

src/interfaces/language.interface.ts

@@ -0,0 +1,20 @@
+/**
+ * @description Settings for adding languages.
+ */
+export interface ILanguage {
+  /**
+   * Search text.
+   * @type {string}
+   */
+  placeholder: string;
+  /**
+   * Default Select Text if no placeholder or selected element is specified.
+   * @type {string}
+   */
+  selectPlaceholder: string;
+  /**
+   * Text if no match.
+   * @type {string}
+   */
+  textInListSearch: string;
+}

src/language/language.ts

@@ -1,10 +1,12 @@
-export const ru = {
+import { ILanguage } from 'interfaces/language.interface';
+
+export const ru: ILanguage = {
   selectPlaceholder: 'Выберите элемент...',
   placeholder: 'Поиск...',
   textInListSearch: 'Совпадений нет...',
 };
 
-export const en = {
+export const en: ILanguage = {
   selectPlaceholder: 'Select element...',
   placeholder: 'Search...',
   textInListSearch: 'No matches...',

tsconfig.json

@@ -0,0 +1,83 @@
+{
+  // "include": ["src/**/*", "index.ts"],
+  "compilerOptions": {
+    /* Projects */
+    // "incremental": true,                              /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
+    // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with project references. */
+    // "tsBuildInfoFile": "./.tsbuildinfo",              /* Specify the path to .tsbuildinfo incremental compilation file. */
+    // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when referencing composite projects. */
+    // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
+    // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
+
+    /* Language and Environment */
+    "target": "es2017" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
+    // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
+    // "jsx": "preserve",                                /* Specify what JSX code is generated. */
+    // "experimentalDecorators": true,                   /* Enable experimental support for TC39 stage 2 draft decorators. */
+    // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
+    // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
+    // "jsxFragmentFactory": "",                         /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
+    // "jsxImportSource": "",                            /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
+    // "reactNamespace": "",                             /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
+    // "noLib": true,                                    /* Disable including any library files, including the default lib.d.ts. */
+    // "useDefineForClassFields": true,                  /* Emit ECMAScript-standard-compliant class fields. */
+    // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
+
+    /* Modules */
+    "module": "commonjs" /* Specify what module code is generated. */,
+    "rootDir": "./" /* Specify the root folder within your source files. */,
+    // "moduleResolution": "node",                       /* Specify how TypeScript looks up a file from a given module specifier. */
+    "baseUrl": "./src" /* Specify the base directory to resolve non-relative module names. */,
+    // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
+    // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
+    // "typeRoots": [],                                  /* Specify multiple folders that act like './node_modules/@types'. */
+    // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
+    // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
+    // "moduleSuffixes": [],                             /* List of file name suffixes to search when resolving a module. */
+    // "resolveJsonModule": true,                        /* Enable importing .json files. */
+    // "noResolve": true,                                /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
+
+    /* JavaScript Support */
+    // "allowJs": true,                                  /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */
+    // "checkJs": true,                                  /* Enable error reporting in type-checked JavaScript files. */
+    // "maxNodeModuleJsDepth": 1,                        /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
+
+    /* Emit */
+    // "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
+    // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
+    // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
+    // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
+    // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
+    "outDir": "./dist" /* Specify an output folder for all emitted files. */,
+    // "removeComments": true,                           /* Disable emitting comments. */
+    // "noEmit": true,                                   /* Disable emitting files from a compilation. */
+    // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
+    // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types. */
+    // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
+    // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
+    // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
+    // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
+    // "inlineSources": true,                            /* Include source code in the sourcemaps inside the emitted JavaScript. */
+    // "emitBOM": true,                                  /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
+    // "newLine": "crlf",                                /* Set the newline character for emitting files. */
+    // "stripInternal": true,                            /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
+    // "noEmitHelpers": true,                            /* Disable generating custom helper functions like '__extends' in compiled output. */
+    // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
+    // "preserveConstEnums": true,                       /* Disable erasing 'const enum' declarations in generated code. */
+    // "declarationDir": "./",                           /* Specify the output directory for generated declaration files. */
+    // "preserveValueImports": true,                     /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
+
+    /* Interop Constraints */
+    // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
+    "allowSyntheticDefaultImports": true /* Allow 'import x from y' when a module doesn't have a default export. */,
+    "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
+    // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
+    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
+
+    "strict": true,
+
+    /* Completeness */
+    // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
+    "skipLibCheck": true /* Skip type checking all .d.ts files. */
+  }
+}