{"id":25005657,"url":"https://github.com/brandonxlf/c-minor","last_synced_at":"2026-01-20T09:34:06.790Z","repository":{"id":210609197,"uuid":"726998770","full_name":"BrandonXLF/c-minor","owner":"BrandonXLF","description":"Infinitesimally small package for creating HTML elements","archived":false,"fork":false,"pushed_at":"2024-09-30T19:49:04.000Z","size":219,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2024-10-16T03:31:46.298Z","etag":null,"topics":["create","createelement","document","dom","html","javascript","npm-package"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/c-minor","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/BrandonXLF.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-12-04T00:57:17.000Z","updated_at":"2024-09-30T19:24:33.000Z","dependencies_parsed_at":"2024-01-10T04:01:28.135Z","dependency_job_id":"0d2f7d20-9e51-449f-a1d3-c10b3684452c","html_url":"https://github.com/BrandonXLF/c-minor","commit_stats":null,"previous_names":["brandonxlf/c-tiny","brandonxlf/c-minor"],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BrandonXLF%2Fc-minor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BrandonXLF%2Fc-minor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BrandonXLF%2Fc-minor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BrandonXLF%2Fc-minor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BrandonXLF","download_url":"https://codeload.github.com/BrandonXLF/c-minor/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248583592,"owners_count":21128624,"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":["create","createelement","document","dom","html","javascript","npm-package"],"created_at":"2025-02-05T00:47:07.868Z","updated_at":"2026-01-20T09:34:06.784Z","avatar_url":"https://github.com/BrandonXLF.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# c-minor\n\n## Infinitesimally small package for creating HTML elements\n\n![NPM package minimized gzipped size](https://img.shields.io/bundlejs/size/c-minor)\u0026nbsp;\n![NPM version info](https://img.shields.io/npm/v/c-minor)\u0026nbsp;\n![NPM license info](https://img.shields.io/npm/l/c-minor)\u0026nbsp;\n![Test status](https://img.shields.io/github/actions/workflow/status/BrandonXLF/c-minor/tests.yml)\n\nc-minor is an extremely small and lightweight JavaScript package that enables the creation and modification of HTML elements with a concise and simple syntax.\n\nIt supports the addition of event listeners, attributes, properties, and children all while having a production size of under 300 bytes before compression! You can view an [editable live demo at JSFiddle](https://jsfiddle.net/gh/get/library/pure/BrandonXLF/c-minor/tree/master/demo/src).\n\n## Documentation\n\n### Signatures\n\n`c(element, attrs, ...children)`\n\n`c(element, ...children)`\n\n### element\n\nType: `string | HTMLElement`\n\nAn existing `HTMLElement` or `string` to use as the tag name of a newly created element. If tag name is provided, an XML namespace can be specified using the syntax `'TAG@NAMESPACE'`. For example, `'svg@http://www.w3.org/2000/svg'`.\n\n### attrs\n\nType: `{ [key: string]: any } | undefined | null`\n\nAn object containing key-value pairs of attributes, properties, and event listeners to add to the element.\n\nProperties are prefixed with `$`. For example, `$date: new Date()` will set the `date` prop of the element to a newly created `Date` object.\n\nEvent listeners are prefixed with `_`. For example, `_click: e =\u003e console.log(e)` will add a `click` event listener that logs the event object to the console.\n\nKeys without prefixes are used for attributes. For example, `class: 'foo'` sets the `class` attribute of the element to `foo`.\n\n### ...children\n\nType: `( string | HTMLElement )[]`\n\nThe remaining arguments are for children to append to the element. A child may be either a `string` or an `HTMLElement`. If the child is a string, it is converted to a `Text` node before being appended. This means strings containing HTML syntax can be safely appended to the element. Passing no children is permitted.\n\n### Return value\n\nType: `HTMLElement`\n\nReturns value of `element` if it was a `HTMLElement` or the `HTMLElement` created by the function if `element` was a `string`.\n\n### Unsafely setting HTML from a string\n\nIf you want to set the HTML value of the element using a string, you can add a `$innerHTML: '\u003ch1\u003eUnsafe HTML\u003c/h1\u003e'` entry to the `attrs` argument. Only do this for trusted HTML as this opens up possibilities for XSS attacks.\n\n## Example\n\n```js\nc(\n  document.body, // Existing element\n  {\n    style: 'color: red' // Attribute\n  },\n  c( // Child element\n    'div', // New DIV element\n    {\n      _click: e =\u003e alert(e.target.prop), // Event listener\n      $prop: 7 // Property\n    },\n    'Foo', // Child string\n    c('span', 'Bar') // Attributeless element\n  )\n);\n```\n\n## No-Transpilation Support\n\nc-minor supports browsers that implement the `append` function on `Element` without transpilation. That is:\n\n* Chrome: \u003e= 54\n* Edge: \u003e= 17\n* Firefox: \u003e= 49\n* Internet Explorer: None\n* Opera: \u003e= 41\n* Safari: \u003e= 10\n\n## Development Commands\n\n* `npm run build` - Generate publishable version of c-minor in the `dist` directory.\n* `npm run test` - Run both code tests and `c.d.ts` type tests.\n* `npm run size` - Determine the size of the files produced by the build script.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrandonxlf%2Fc-minor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbrandonxlf%2Fc-minor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrandonxlf%2Fc-minor/lists"}