diff --git a/CHANGELOG.md b/CHANGELOG.md index 6796be1..f179c9c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -20,3 +20,8 @@ - Исправленны выявленные баги. - Исправленно отображение страницы с примером на мобильных устройствах. - Обновленна документация! + +### 00.00.2023 - обновление 0.2.1 + +- Весь селект переписан на ts. +- Документация и реадми переписаны на Английский. diff --git a/README.md b/README.md index 72986a5..0fcabf1 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # CG-SELECT -## version ~ 0.1.171 +## version ~ 0.2.1 Этот компонент позволяет создать кастомный селект. Он предлагает более гибкую настройку и использование селекта. Доступна кастомизация, мультивыбор и живой поиск по елементам. diff --git a/example/index.html b/example/index.html index fc867c5..4a483c4 100644 --- a/example/index.html +++ b/example/index.html @@ -356,4 +356,5 @@ + diff --git a/example/index.js b/example/index.js index 97649f8..a440293 100644 --- a/example/index.js +++ b/example/index.js @@ -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({ diff --git a/example/indexTs.ts b/example/indexTs.ts new file mode 100644 index 0000000..aebfdd1 --- /dev/null +++ b/example/indexTs.ts @@ -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', + ] +}) \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 75f0f49..65d6fdc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -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", diff --git a/package.json b/package.json index 407c559..5df75e9 100644 --- a/package.json +++ b/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", @@ -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", diff --git a/src/cg-select.js b/src/cg-select.js index 5a41e7c..96bf00c 100644 --- a/src/cg-select.js +++ b/src/cg-select.js @@ -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 { } } } + diff --git a/src/cg-selectTS.ts b/src/cg-selectTS.ts new file mode 100644 index 0000000..cfcad63 --- /dev/null +++ b/src/cg-selectTS.ts @@ -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() {} +} diff --git a/src/components/utilsTs.ts b/src/components/utilsTs.ts new file mode 100644 index 0000000..b879140 --- /dev/null +++ b/src/components/utilsTs.ts @@ -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'); +} diff --git a/src/interfaces/cg-select.interface.ts b/src/interfaces/cg-select.interface.ts new file mode 100644 index 0000000..fd3190c --- /dev/null +++ b/src/interfaces/cg-select.interface.ts @@ -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; +} \ No newline at end of file diff --git a/src/interfaces/items.interface.ts b/src/interfaces/items.interface.ts new file mode 100644 index 0000000..c7bfa0d --- /dev/null +++ b/src/interfaces/items.interface.ts @@ -0,0 +1,5 @@ +export interface IItems{ + id: string; + title: string; + value: number | string +} \ No newline at end of file