diff --git a/README.md b/README.md index 0030d5c..d28a824 100644 --- a/README.md +++ b/README.md @@ -36,18 +36,18 @@ Then, include AvalynxTable: Replace `path/to/avalynx-table.js` and `path/to/avalynx-table.css` with the actual path to the files in your project. -## Installation via jsDelivr +## Installation via jsDelivr ([Link](https://cdn.jsdelivr.net/npm/avalynx-table/)) AvalynxTable is also available via [jsDelivr](https://www.jsdelivr.com/). You can include it in your project like this: ```html - - + + ``` Make sure to also include Bootstrap's JS/CSS in your project to ensure AvalynxTable displays correctly. -## Installation via NPM +## Installation via NPM ([Link](https://www.npmjs.com/package/avalynx-table)) AvalynxTable is also available as a npm package. You can add it to your project with the following command: @@ -79,6 +79,23 @@ import 'avalynx-table/dist/css/avalynx-table.min.css'; Make sure to also include Bootstrap's JS/CSS in your project to ensure AvalynxTable displays correctly. +## Installation via Composer ([Link](https://packagist.org/packages/avalynx/avalynx-table)) + +AvalynxTable is also available as a Composer package. You can add it to your project with the following command: + +```bash +composer require avalynx/avalynx-table +``` + +After installing, you can import AvalynxTable into your HTML file like this: + +```html + + +``` + +Make sure to also include Bootstrap's JS/CSS in your project to ensure AvalynxTable displays correctly. + ## Usage To use AvalynxTable in your project, first ensure you have tables marked up in your HTML. Then, include the AvalynxTable JavaScript file in your project and initialize the class with the appropriate selector. @@ -109,7 +126,7 @@ new AvalynxTable('.avalynx-table'); AvalynxTable allows the following options for customization: -- `selector`: (string) The selector to use for targeting tables within the DOM (default: `.avalynx-table`) +- `selector`: (string) The selector to use for targeting tables within the DOM (default: `'.avalynx-table'`). - `options`: An object containing the following keys: (**coming soon**) ## Contributing diff --git a/__tests__/avalynx-table.test.js b/__tests__/avalynx-table.test.js index 7010aee..a04ca61 100644 --- a/__tests__/avalynx-table.test.js +++ b/__tests__/avalynx-table.test.js @@ -23,6 +23,10 @@ describe('AvalynxTable', function() { document.body.appendChild(table); }); + afterEach(() => { + document.body.removeChild(div); + }); + it('should initialize with default selector', () => { const table = new AvalynxTable('.avalynx-table'); console.log(table.tables.length); diff --git a/composer.json b/composer.json new file mode 100644 index 0000000..f954c6c --- /dev/null +++ b/composer.json @@ -0,0 +1,30 @@ +{ + "name": "avalynx/avalynx-table", + "description": "AvalynxTable is a simple table system for web applications. Based on Bootstrap >=5.3 without any framework dependencies.", + "keywords": [ + "avalynx", + "table", + "bootstrap", + "bootstrap5", + "component", + "stackable", + "responsive" + ], + "homepage": "https://github.com/avalynx/avalynx-table", + "license": "MIT", + "authors": [ + { + "name": "Juergen Schwind an the AvalynxTable authors", + "homepage": "https://github.com/avalynx/avalynx-table/graphs/contributors" + } + ], + "require": { + "twbs/bootstrap": "^5.3" + }, + "repositories": [ + { + "type": "vcs", + "url": "https://github.com/avalynx/avalynx-table.git" + } + ] +} diff --git a/dist/js/avalynx-table.esm.js b/dist/js/avalynx-table.esm.js index aec5982..af035a9 100644 --- a/dist/js/avalynx-table.esm.js +++ b/dist/js/avalynx-table.esm.js @@ -10,8 +10,9 @@ * @repository https://github.com/avalynx/avalynx-table.git * @bugs https://github.com/avalynx/avalynx-table/issues * - * @param {string} selector - The selector to find the tables - * @param {object} options - The options for the table. + * @param {string} selector - The selector to use for targeting tables within the DOM (default: '.avalynx-table'). + * @param {object} options - An object containing the following keys: (*coming soon*) + * */ export class AvalynxTable { diff --git a/dist/js/avalynx-table.js b/dist/js/avalynx-table.js index 907d5ab..1f43ff4 100644 --- a/dist/js/avalynx-table.js +++ b/dist/js/avalynx-table.js @@ -10,8 +10,9 @@ * @repository https://github.com/avalynx/avalynx-table.git * @bugs https://github.com/avalynx/avalynx-table/issues * - * @param {string} selector - The selector to find the tables - * @param {object} options - The options for the table. + * @param {string} selector - The selector to use for targeting tables within the DOM (default: '.avalynx-table'). + * @param {object} options - An object containing the following keys: (*coming soon*) + * */ class AvalynxTable { diff --git a/docker-compose.yml b/docker-compose.yml index 3eedf30..3420152 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,4 +1,3 @@ -version: "3.9" services: web: build: ./docker/web @@ -18,4 +17,4 @@ services: - PHP_MEMORY_LIMIT=512M - PHP_MAX_EXECUTION_TIME=300 - PHP_POST_MAX_SIZE=100M - - PHP_UPLOAD_MAX_FILESIZE=100M \ No newline at end of file + - PHP_UPLOAD_MAX_FILESIZE=100M diff --git a/examples/table.html b/examples/table.html index b3b88ae..8b8c823 100644 --- a/examples/table.html +++ b/examples/table.html @@ -17,8 +17,8 @@ - - + + diff --git a/src/js/avalynx-table.esm.js b/src/js/avalynx-table.esm.js index aec5982..af035a9 100644 --- a/src/js/avalynx-table.esm.js +++ b/src/js/avalynx-table.esm.js @@ -10,8 +10,9 @@ * @repository https://github.com/avalynx/avalynx-table.git * @bugs https://github.com/avalynx/avalynx-table/issues * - * @param {string} selector - The selector to find the tables - * @param {object} options - The options for the table. + * @param {string} selector - The selector to use for targeting tables within the DOM (default: '.avalynx-table'). + * @param {object} options - An object containing the following keys: (*coming soon*) + * */ export class AvalynxTable { diff --git a/src/js/avalynx-table.js b/src/js/avalynx-table.js index 907d5ab..1f43ff4 100644 --- a/src/js/avalynx-table.js +++ b/src/js/avalynx-table.js @@ -10,8 +10,9 @@ * @repository https://github.com/avalynx/avalynx-table.git * @bugs https://github.com/avalynx/avalynx-table/issues * - * @param {string} selector - The selector to find the tables - * @param {object} options - The options for the table. + * @param {string} selector - The selector to use for targeting tables within the DOM (default: '.avalynx-table'). + * @param {object} options - An object containing the following keys: (*coming soon*) + * */ class AvalynxTable {