Start of the trasition to TS

This commit is contained in:
MaxOvs 2023-01-05 18:21:10 +03:00
parent 4af10dd476
commit ce3b928635
12 changed files with 733 additions and 48 deletions

View File

@ -20,3 +20,8 @@
- Исправленны выявленные баги.
- Исправленно отображение страницы с примером на мобильных устройствах.
- Обновленна документация!
### 00.00.2023 - обновление 0.2.1
- Весь селект переписан на ts.
- Документация и реадми переписаны на Английский.

View File

@ -1,6 +1,6 @@
# CG-SELECT
## version ~ 0.1.171
## version ~ 0.2.1
Этот компонент позволяет создать кастомный селект. Он предлагает более гибкую настройку и использование селекта.
Доступна кастомизация, мультивыбор и живой поиск по елементам.

View File

@ -356,4 +356,5 @@
</div>
</body>
<script type="module" src="index.js"></script>
<script type="module" src="indexTs.ts"></script>
</html>

View File

@ -2,30 +2,30 @@ import DropDown from '../index';
import './example';
// ------------------------------Обычный селект--------------------
const dropdown = new DropDown({
selector: '.cg-dropdown_one',
placeholder: 'Выберите авто',
lable: 'EXAMPLE',
items: [
'BMW',
{
id: '213sade',
title: 'Opel',
value: 1,
},
'Mersedes',
'MAN',
'Ferari',
],
styles: {
head: {
width: '830px',
},
list: {
width: '824px',
},
},
});
// const dropdown = new DropDown({
// selector: '.cg-dropdown_one',
// placeholder: 'Выберите авто',
// lable: 'EXAMPLE',
// items: [
// 'BMW',
// {
// id: '213sade',
// title: 'Opel',
// value: 1,
// },
// 'Mersedes',
// 'MAN',
// 'Ferari',
// ],
// styles: {
// head: {
// width: '830px',
// },
// list: {
// width: '824px',
// },
// },
// });
// ------------------------------NativeSelect-----------------------
const dropdownNativeSelect = new DropDown({

18
example/indexTs.ts Normal file
View File

@ -0,0 +1,18 @@
import { SGSelect } from "../src/cg-selectTS";
const dropdn = new SGSelect({
selector: '.cg-dropdown_one',
placeholder: 'Выберите авто',
// lable: 'EXAMPLE',
items: [
'BMW',
{
id: '213sade',
title: 'Opel',
value: 'ds',
},
'Mersedes',
'MAN',
'Ferari',
]
})

562
package-lock.json generated
View File

@ -10,7 +10,8 @@
"license": "ISC",
"dependencies": {
"@parcel/optimizer-css": "^2.8.0",
"gh-pages": "^4.0.0"
"gh-pages": "^4.0.0",
"typescript": "^4.9.4"
},
"devDependencies": {
"@parcel/transformer-sass": "^2.7.0",
@ -799,6 +800,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 +1163,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",
@ -1769,8 +2084,7 @@
"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 +2167,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 +2336,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 +2523,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 +2530,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",
@ -3461,7 +3771,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",
@ -3675,6 +3984,18 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"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",
@ -4275,6 +4596,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 +4820,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",
@ -4887,8 +5407,7 @@
"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 +5469,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 +5579,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 +5714,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",
@ -5712,7 +6227,8 @@
"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",
@ -6040,8 +6556,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",
@ -6185,6 +6700,11 @@
"integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
"dev": true
},
"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",

View File

@ -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",
@ -29,7 +29,8 @@
},
"dependencies": {
"@parcel/optimizer-css": "^2.8.0",
"gh-pages": "^4.0.0"
"gh-pages": "^4.0.0",
"typescript": "^4.9.4"
},
"keywords": [
"select",

View File

@ -92,6 +92,7 @@ export class DropDown {
* selector: 'Уникальный селектор',
selected: 'Выбранный элемент',
placeholder: '...',
lable: '...'
items: [string|number|object],
darkTheme: true/false,
searchMode: true/false,
@ -919,3 +920,4 @@ export class DropDown {
}
}
}

65
src/cg-selectTS.ts Normal file
View File

@ -0,0 +1,65 @@
import { ISgSelect } from './interfaces/cg-select.interface';
import { IItems } from './interfaces/items.interface';
import './main.scss';
export class SGSelect implements ISgSelect {
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?: object;
event?: string;
url?: string;
multiselect?: boolean;
multiselectTag?: boolean;
private element: Element | null;
private list: HTMLElement;
private options: object;
private caret: HTMLElement;
private category: string;
private selectedItems: object[] | object;
private itemsSelect: IItems[] | string[] | any;
private indexes: number[] = [];
constructor(setting: ISgSelect) {
this.init(setting);
}
private init(setting: ISgSelect): void {
const { items, multiselect, url, selector} = setting;
this.options = setting;
const elem = document.querySelector(selector);
this.element = elem;
this.element?.addEventListener('click', (e) => {
e.preventDefault();
});
this.itemsSelect = [];
if(multiselect === true){
this.selectedItems = [];
}
if (!items && url) {
this.renderUrl();
return;
}
items.forEach((dataItem, index) => {
this.itemsSelect.push()
})
}
private render() {}
private renderUrl() {}
}

48
src/components/utilsTs.ts Normal file
View File

@ -0,0 +1,48 @@
import { IItems } from '../interfaces/items.interface';
interface IDataItem{
category?: string;
categoryItems?: string;
ItemValue: IItems | string | number;
}
/**
* Преобразование каждого елемента полученного из поля Items;
* @param {object | string} dataItem полученный елемент переданный при создании селекта может быть как object/string
* @param {number} index индекс этого элемента
* @returns {object} возвращает сформированный объект
*/
export function getFormatItem(dataItem:IDataItem, index: number) {
const random = Math.random().toString(36).substring(2, 10);
let item: IItems;
// if (checkItemStruct(dataItem)) {
// item = {
// id: dataItem.id,
// title: dataItem.title,
// value: index,
// };
// } else {
// item = {
// id: random,
// title: dataItem,
// value: index,
// };
// }
// return item;
}
/**
* Проверка содержит ли item указанные свойства,
* @param {object} item проверяемый на определенную структуру элемент
* @returns {boolean} возвращает true/false если item содержит указанные свойства
*/
export function checkItemStruct(item: object): boolean {
if (item && typeof item !== 'object') {
return false;
}
return item.hasOwnProperty('id') && item.hasOwnProperty('title') && item.hasOwnProperty('value');
}

View File

@ -0,0 +1,20 @@
import { IItems } from "./items.interface";
export interface ISgSelect {
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?: object;
event?: string;
url?: string;
multiselect?: boolean;
multiselectTag?: boolean;
}

View File

@ -0,0 +1,5 @@
export interface IItems{
id: string;
title: string;
value: number | string
}