{"id":16484536,"url":"https://github.com/winston0410/ramda-dom-utilities","last_synced_at":"2025-05-09T00:55:07.735Z","repository":{"id":45046021,"uuid":"290977866","full_name":"winston0410/ramda-dom-utilities","owner":"winston0410","description":"An utility library that enables currying and piping for DOM manipulation functions with Ramda","archived":false,"fork":false,"pushed_at":"2022-01-12T20:20:16.000Z","size":586,"stargazers_count":3,"open_issues_count":4,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-05-09T00:55:04.219Z","etag":null,"topics":["dom","functional-programming","ramda","utilities-library"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/winston0410.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-08-28T07:15:41.000Z","updated_at":"2021-11-09T23:13:55.000Z","dependencies_parsed_at":"2022-09-03T00:23:21.868Z","dependency_job_id":null,"html_url":"https://github.com/winston0410/ramda-dom-utilities","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/winston0410%2Framda-dom-utilities","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/winston0410%2Framda-dom-utilities/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/winston0410%2Framda-dom-utilities/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/winston0410%2Framda-dom-utilities/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/winston0410","download_url":"https://codeload.github.com/winston0410/ramda-dom-utilities/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253171250,"owners_count":21865290,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dom","functional-programming","ramda","utilities-library"],"created_at":"2024-10-11T13:17:25.970Z","updated_at":"2025-05-09T00:55:07.714Z","avatar_url":"https://github.com/winston0410.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Ramda DOM Utilities\n\n[![Maintainability](https://api.codeclimate.com/v1/badges/09d6cd7166295e953d9b/maintainability)](https://codeclimate.com/github/winston0410/ramda-dom-utilities/maintainability) [![Codacy Badge](https://app.codacy.com/project/badge/Grade/0177a95320534809b107fa55ca567cf6)](https://www.codacy.com/manual/winston0410/ramda-dom-utilities?utm_source=github.com\u0026utm_medium=referral\u0026utm_content=winston0410/ramda-dom-utilities\u0026utm_campaign=Badge_Grade) [![Known Vulnerabilities](https://snyk.io/test/github/winston0410/ramda-dom-utilities/badge.svg?targetFile=package.json)](https://snyk.io/test/github/winston0410/ramda-dom-utilities?targetFile=package.json) [![Test Coverage](https://api.codeclimate.com/v1/badges/09d6cd7166295e953d9b/test_coverage)](https://codeclimate.com/github/winston0410/ramda-dom-utilities/test_coverage)\n\nA lightweight (**4.5kb gzipped**) collection of curried DOM manipulation functions, created with the help of [Ramda](https://ramdajs.com/).\n\n```javascript\n//Instead of writing this\n\nconst element = document.getElementById('test-id')\nelement.textContent = 'Hello world'\nelement.id = 'new-id'\nelement.classList.add('foo')\n\n//Write this: Compact and reusable\nimport * as Rdom from 'ramda-dom-utilities' //Or import as R, or any name you like\n\nconst element = R.pipe(\n  Rdom.getElementById('test-id'),\n  Rdom.setProp('textContent')('Hello world'),\n  Rdom.setProp('id')('new-id'),\n  Rdom.addClass('foo')\n)(document)\n```\n\n## Installation\n\nWith npm:\n\n```bash\nnpm i ramda-dom-utilities\n```\n\nOr via CDN:\n\n```html\n\u003cscript defer src=\"https://unpkg.com/browse/ramda-dom-utilities/dist/index.esm.js\"\u003e\u003c/script\u003e\n\n\u003cscript defer src=\"https://unpkg.com/browse/ramda-dom-utilities/dist/index.cjs.js\"\u003e\u003c/script\u003e\n```\n\nOr directly include the script in you site:\n\n```html\n\u003cscript defer src=\"/path/to/your/dir/index.esm.js\"\u003e\u003c/script\u003e\n\n```\n\nThen in the script where you want to use this library:\n\n```javascript\nimport * as Rdom from 'ramda-dom-utilities'\n```\n\n## Features\n\n- All functions in this library return the mutated element, so that you can easily use them in a pipe\n\n- All functions in this library are curried, so that you can easily reuse them\n\n- For API functions that return **undefined**, the **element being used as data** (after mutated by the API) will be returned\n\n### List of curried functions\n\nWe try to keep the name of the curried function identical with the Web API, and have the same parameter orders, except you would put the element that uses the API functions to the very end, so as to follow Ramda's \"data-last\" pattern.\n\n```javascript\n//Web API\n\nelement.setAttribute('id', 'test-id')\n\n//Curried version provided by this library\n\nsetAttribute('id')('test-id')(element)\n```\n\n- [x] **addClass**\n\n- [x] **containsClass**\n\n- [x] **removeClass**\n\n- [x] **setAttribute**\n\n- [x] **removeAttribute**\n\n- [x] **hasAttribute**\n\n- [x] **hasAttributes**\n\n- [x] **getAttribute**\n\n- [x] **getAttributeName**\n\n- [x] **getAttributeNS**\n\n- [x] **before**\n\n- [x] **after**\n\n- [x] **append**\n\n- [x] **prepend**\n\n- [x] **remove**\n\n- [x] **replaceWith**\n\n- [x] **getElementById**\n\n- [x] **getElementsByClassName**\n\n- [x] **getElementsByName**\n\n- [x] **getElementsByTagNameNS**\n\n- [x] **getElementsByTagName**\n\n- [x] **querySelector**\n\n- [x] **querySelectorAll**\n\n- [x] **addEventListener**\n\n- [x] **removeEventListener**\n\n- [x] **matches**\n\n- [x] **contains**\n\nOther than these curried Web API version, we provide the following functions to help you put DOM manipulation in a pipe\n\n**R.setProp**\n\n```javascript\nelement.textContent = 'Hello world'\nelement.id = 'test-id'\n\n//Can be directly translated to:\n\nR.pipe(\n  setProp('textContent')('Hello world'),\n  setProp('id')('test-id')\n)(element)\n```\n\n**R.readProp**\n\n```javascript\nconst lastChild = element.lastElementChild\n\n//Can be directly translated to:\n\nconst lastChild = R.readProp('lastElementChild')(element)\n```\n\n## How to contribute?\n\n- Use [gitmoji](https://github.com/carloscuesta/gitmoji) to write commit message\n\n- TODO\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwinston0410%2Framda-dom-utilities","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwinston0410%2Framda-dom-utilities","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwinston0410%2Framda-dom-utilities/lists"}