{"_id":"@alpeshabitat/quick-filter","_rev":"5-e13facc6b5c61849826cb7ef31c9cd27","time":{"created":"2022-08-31T16:52:24.605Z","1.0.0":"2022-08-31T16:40:32.296Z","modified":"2024-05-14T14:33:56.500Z","1.0.1":"2022-08-31T16:52:24.927Z","1.2.0":"2022-09-19T10:18:22.949Z"},"name":"@alpeshabitat/quick-filter","dist-tags":{"latest":"1.2.0"},"versions":{"1.0.1":{"name":"@alpeshabitat/quick-filter","version":"1.0.1","description":"Micro librairie permettant d'implémenter une recherche javascript facilement.","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"keywords":["search"],"author":{"name":"benoit.barberot@alpeshabitat.fr"},"license":"ISC","dependencies":{"core-js":"^3.25.0"},"gitHead":"2b4d356c15ce43d30a70defaa131ed96df9211ac","_id":"@alpeshabitat/quick-filter@1.0.1","_nodeVersion":"16.15.0","_npmVersion":"8.5.5","dist":{"integrity":"sha512-FbcDp4Nesk7tD8BSH+O1CZZTbPSKMfCVG85uVFl90hWYCrcW763qufLlIfXilz4Ar6vpVGB3QHAhcZTTTkRHZA==","shasum":"1ba7045bc4a831ec9b5ebfdafde997b348ab8fc8","tarball":"https://registry.npmjs.org/@alpeshabitat/quick-filter/-/quick-filter-1.0.1.tgz","fileCount":5,"unpackedSize":581124,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCbHhZvtLYPP4zkVQthettu2zxqZnlIyfYh7aUNoDFdFgIgb6aZjX5n3Apv+lsOe7QDTXEPJAZFQ9q23a5naLKtUqI="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjD5HIACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrHeg//QlQElsdRnKajKl88+7FqnBvsjNYo08kvXPwjX/VqTM5dy72w\r\n6oy/oLQf92ExMzVXrAAXsDNVk/AJj/iLOZZt8rXMFCsXibzMnpl0wgMMk1si\r\nCrG958bnnUOa4xkUNOBeiMMG4j9MJDey4VtnP1d1GwCE8mWG6XYeEraPr7gp\r\nAGobp2JUvtpMahsLmtE20mXNR96oBaAqAxZ15R6KIk4OJySNbIZeNVA8MfhG\r\nFDf8GgG/XWNba5I1/yqBFYHnWUVTiTV0s+7i0qD/ejZR1YS5h8x8PN+u1y3T\r\nUvwuQz4RW8yH3ysOkPAjdDRcdK0grekW3KewxdDhlcfJWO8MoOjc3p2d8hD0\r\nl7WhyL41La++aH6gYfdOws89sOSx5EQ9XbpKBufW3TMiYYXgPLF4zpUwYIKL\r\nUSkISD2SQcSx0PT12f5kS9SgsbgkDuck6kmdBXaL76/Qv5BFKDnOtg/uJ33m\r\nxtnXhA+JweyuU6NluFkwrzE3IVqHMU8oOzSHNSkr4tF+T7BSerd3I7rVjtFC\r\n19sFCHr2e+7gqjlXLWMgmlUp9aypGK7ws3c/0NllOo/3GVOd+87B65Da/NOJ\r\nDfL22k2p07fKlybIHSS2WF/14+Kciglnq2JY6z5fWbAKmI9O+HCJXUrXgeD8\r\ny8OrPmCO7p6Yo+bJEQ6LgLmZX7F+w083O8o=\r\n=Zkbw\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"barberob","email":"barberot.b@proton.me"},"directories":{},"maintainers":[{"name":"barberob","email":"barberot.b@proton.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/quick-filter_1.0.1_1661964744654_0.6681699071596572"},"_hasShrinkwrap":false},"1.2.0":{"name":"@alpeshabitat/quick-filter","version":"1.2.0","description":"Filtrer facilement des données dans une liste d'éléments HTML","scripts":{"dev":"vite","build":"tsc && vite build","watch":"vite build --watch","preview":"vite preview"},"keywords":["search"],"author":{"name":"benoit.barberot@alpeshabitat.fr"},"license":"ISC","main":"./dist/main.js","module":"./dist/main.es.js","typings":"./dist/main.d.ts","exports":{".":{"import":"./dist/main.js","require":"./dist/main.cjs.js"}},"dependencies":{"core-js":"^3.25.0"},"devDependencies":{"@rollup/plugin-typescript":"^8.5.0","@types/node":"^18.7.18","prettier":"2.7.1","rollup-plugin-typescript-paths":"^1.4.0","tslib":"^2.4.0","typescript":"^4.8.3","vite":"^3.1.0"},"gitHead":"af2634c4866c0865ea4c7417c2098af3cfda994b","_id":"@alpeshabitat/quick-filter@1.2.0","_nodeVersion":"16.15.0","_npmVersion":"8.5.5","dist":{"integrity":"sha512-0QmsPrh5qIMYnt0xWtrGQ5h0cAx4OOr4HjuoNwI7fSjoBHwDeEG2vOW9P94tcpFllv56cNOw+cD5whKb2uVq1A==","shasum":"984bdff1fe1284cf4abdae5869fdfa0a064cea3e","tarball":"https://registry.npmjs.org/@alpeshabitat/quick-filter/-/quick-filter-1.2.0.tgz","fileCount":6,"unpackedSize":6520,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD0tenX3F66njMuy9Ooq7mi6bVCBqWoguip9ZdfP8/W6gIgZ3HakaENA4V0dWQozSYGVz4gPfiblpB1GNCP1s6Eg78="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjKEHuACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp5RQ/9Ef04zDSaX49U0CwV0nUkvEARY7uPLE1Xx3SPk5MX0mMW+xYB\r\nCRErEtVokTc+Dxl3mHgp6MzScPjertpLLmSHa2ErQbl0G2YawQRQiUn5FwNY\r\n54Zj2yDN3zMw5LivoMBOdG/dYZt0OGpU1yrBETUtrL8QPsR3o5jYO+bllyRz\r\nxQRZ37gJQ5vATAslzWCUSj2VECdQxL4vPiICZKsDBpv/RMBWc0Dife+zVOgS\r\nE5ZI7jeNS5pjDeJTjOzRx+o1aypNPw23SVYhzzHa5m2gHz1STkGO/NlxrwMN\r\nnsiBhITdZs6/WHJpBD3rz0msyQdJzQyaNkK9tNZsHLSYjmvw+SenWRbCM2Zj\r\njo8t1fdB+kJ4ZfMrgO2WPldIk9G22PEzIQTQ2E/U7R/8C964HlQv9F6Pw61p\r\n701ndFjekYjL6xeP5K2w4eOmERzmSSyPWE03bU9/ybJxeAPtaHps0bTyhJA7\r\n3ADJ2GPZcQFqGxX+SvNO5jVmJI8wJHnBkrMWExEmppSczG4ErHYFGm6+UApg\r\nGXmh28uleX1DD6IK8FjLhmRIYDfhMVpJskbYbLejtJ6RoXorMKmS205sevgN\r\nUaKe3VjnbcxAHba9HqfQtHAXOQdlZUngmVFdQ7l85ajhXp5R2g+tn0In8B9q\r\nisdyt5SmlwG1uYE+dohLvQoqGWekhIkRoCg=\r\n=hACQ\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"barberob","email":"barberot.b@proton.me"},"directories":{},"maintainers":[{"name":"barberob","email":"barberot.b@proton.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/quick-filter_1.2.0_1663582702752_0.30126367937559584"},"_hasShrinkwrap":false}},"maintainers":[{"email":"bruno.barthez@alpeshabitat.fr","name":"bruno38000"},{"email":"barberot.b@proton.me","name":"barberob"}],"description":"Filtrer facilement des données dans une liste d'éléments HTML","keywords":["search"],"author":{"name":"benoit.barberot@alpeshabitat.fr"},"license":"ISC","readme":"# QuickFilter\nMicro librairie permettant d'implémenter une recherche javascript facilement.\n\n![Démo](./quickfilter.gif)\n\n## Utilisation de QuickFilter\n\n> ⚠️ Attention ⚠️ Cette librairie ne fonctionne qu'avec une seule recherche par page\n\n### Installation\nL'utilisation de la librairie se veux le plus simple possible.\nInstallez la avec\n```bash\nnpm install @alpeshabitat/quick-filter\n```\n### Utilisation\nImportez la librairie dans votre fichier JavaScript\n```js\nimport quickFilter from '@alpeshabitat/quick-filter'\n```\n\nIl faut ensuite l'activer\n```js\nquickFilter()\n```\nOn peut également passer un objet de configuration pour modifier certains paramètres si besoin. Voici les valeurs par défaut et leur utilité.\n```js\nquickFilter({\n    containerDisplay: 'block', // QuickFilter passe les éléments en display none pour les masquer. On précise ici la valeur de display à remettre lors du ré-affichage des éléments. Plus d'informations ci-dessous\n    searchInput: '#qf-filter-input', // L'input sur lequel on effectue la recherche\n    dataAttribute: 'data-qf-filter-value' // l'attribut a placer sur les éléments a filtrer\n})\n```\nOn peut alors l'utiliser en ajoutant tout d'abord l'id ```qf-filter-input``` sur l'input de recherche\n```html\n<input id=\"qf-filter-input\" type=\"text\" placeholder=\"🔎 Recherche\">\n```\nAinsi que l'attribut ```data-qf-filter-value``` sur les éléments à trier. Par exemple: \n```html\n<div class=\"monContainer\" data-qf-filter-value=\"maValeur\">maValeur</div>\n\n<div class=\"monContainer\" data-qf-filter-value=\"monAutreValeur\">monAutreValeur</div>\n```\n### ⚠️ Cas particuliers ⚠️\nIl est possible que les espaces ne soient pas conservés dans l'attribut data-qf-filter-value. Pour éviter cela on peut utiliser le filtre url_encode de twig dans le cas d'une utilisation avec Symfony.\n```twig\n<div data-qf-filter-value=\"{{ maValeur|url_encode }}\">{{ maValeur }}</div>\n```\nSi besoin particuliers, il est possible de définir la valeur css de display des conteneurs directement sur l'input de recherche avec l'attribut ```data-qf-display```. Si défini, cet attribut prévaudra la valeur passée en paramètre lors de l'appel de la fonction ```quickFilter()```.\n```html\n<div data-qf-display=\"flex\" id=\"qf-filter-input\"></div>\n```\n\n\nEt c'est tout!\n\n## 👾 Environnement de développement\n\n### 🏁 Pré-requis\n\n* [NPM/Nodejs](https://nodejs.org/en/)\n\n## 🤝 Contribuer au projet\n\nFaire un \n```bash\nnpm install\n```\nIl est possible de tester facilement le paquet en l'installant dans un autre projet avec la commande\n```bash\nnpm install /chemin/complet/vers/le/dossier/de/quickFilter\n```\nLes changements s'appliqueront en temps réel\n\n\n### 📃 Règles de codage\n\n- Le projet utilise une configuration prettier disponible dans le fichier prettierrc, il faut donc installer l'extension [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) sur VsCode\n- Indentation = 4 espaces\n\n### 🔍 Merge Request\n\nLes \"Merges Requests\" sont les bienvenues.\n\nPour les changements majeurs, veuillez en discuter avec le reste de l'équipe.\n\nMerci de ne jamais travailler directement dans la branche main.\n\n### 🏛 Code de Conduite\n\nDans l'intérêt de favoriser un environnement ouvert et accueillant, nous nous engageons à faire de la participation à ce projet une expérience exempte de harcèlement pour tout le monde, quel que soit le niveau d'expérience, le sexe, l'identité ou l'expression de genre, l'orientation sexuelle, le handicap, l'apparence personnelle, la taille physique, l'origine ethnique, l'âge, la religion ou la nationalité.","readmeFilename":"README.md"}