{"id":14990316,"url":"https://github.com/beforesemicolon/cwco","last_synced_at":"2025-04-12T02:10:53.513Z","repository":{"id":42198280,"uuid":"443214944","full_name":"beforesemicolon/cwco","owner":"beforesemicolon","description":"Powerful and Fast Web Component Library with a Simple API","archived":false,"fork":false,"pushed_at":"2023-10-22T03:19:35.000Z","size":1366,"stargazers_count":57,"open_issues_count":4,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-05-01T09:46:48.709Z","etag":null,"topics":["components","components-framework","components-library","css","custom-elements","cwco","html","javascript","typescript","vanilla-js","web-component","web-components","webapp","webcomponents"],"latest_commit_sha":null,"homepage":"https://cwco.beforesemicolon.com/","language":"TypeScript","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/beforesemicolon.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["beforesemicolon"]}},"created_at":"2021-12-31T00:29:23.000Z","updated_at":"2024-06-21T14:23:24.570Z","dependencies_parsed_at":"2023-02-18T16:15:45.240Z","dependency_job_id":"c5ebb025-8ebc-4081-9ba3-4d2010897444","html_url":"https://github.com/beforesemicolon/cwco","commit_stats":{"total_commits":229,"total_committers":4,"mean_commits":57.25,"dds":0.1834061135371179,"last_synced_commit":"f8eac92f27438f299f6e9fb42deea9ec60e470ad"},"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beforesemicolon%2Fcwco","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beforesemicolon%2Fcwco/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beforesemicolon%2Fcwco/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/beforesemicolon%2Fcwco/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/beforesemicolon","download_url":"https://codeload.github.com/beforesemicolon/cwco/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248505929,"owners_count":21115354,"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":["components","components-framework","components-library","css","custom-elements","cwco","html","javascript","typescript","vanilla-js","web-component","web-components","webapp","webcomponents"],"created_at":"2024-09-24T14:19:52.898Z","updated_at":"2025-04-12T02:10:53.493Z","avatar_url":"https://github.com/beforesemicolon.png","language":"TypeScript","funding_links":["https://github.com/sponsors/beforesemicolon"],"categories":[],"sub_categories":[],"readme":"# CWCO\n\n![CWCO Banner](https://github.com/beforesemicolon/cwco/blob/master/docs/Git-Banner.jpg)\n\n[![website](https://img.shields.io/badge/website-cwco.beforesemicolon.com-blue)](https://cwco.beforesemicolon.com/)\n[![npm](https://img.shields.io/npm/v/cwco)](https://www.npmjs.com/package/cwco)\n[![license](https://img.shields.io/github/license/beforesemicolon/cwco)](https://github.com/beforesemicolon/cwco/blob/master/LICENSE)\n[![sponsor](https://img.shields.io/github/sponsors/beforesemicolon)](https://github.com/sponsors/beforesemicolon)\n\n![node version](https://img.shields.io/badge/min%20node%20version-14.*-brightgreen)\n![Build](https://github.com/beforesemicolon/cwco/actions/workflows/codeql-analysis.yml/badge.svg)\n![Build](https://github.com/beforesemicolon/cwco/actions/workflows/node.js.yml/badge.svg)\n\n**Contextfull Web Component Library** created to improve native Web Component APIs user experience with:\n- ✅ No Build Required (Plug and Play)!\n- ✅ Works with other library and frameworks like React, Angular, Vue, Svelte, etc;\n- ✅ Truly Reactive Template\n- ✅ Powerful built-in Directives(including ability to create your own)\n- ✅ Built-in Context Data Handling\n- ✅ Event and Data Binding in HTML and CSS\n- ✅ Build view directly in HTML file\n- ✅ Simple API\n- ✅ Fast rendering\n- ✅ Lightweight package\n\n### Documentation ([cwco.beforesemicolon.com](https://cwco.beforesemicolon.com/))\n\n- [Getting Started](https://cwco.beforesemicolon.com/documentation/getting-started)\n- [WebComponent](https://cwco.beforesemicolon.com/documentation/web-component)\n- [ContextProviderComponent](https://cwco.beforesemicolon.com/documentation/context-provider-component)\n- [Configurations](https://cwco.beforesemicolon.com/documentation/configurations)\n- [Template](https://cwco.beforesemicolon.com/documentation/template)\n- [Styling](https://cwco.beforesemicolon.com/documentation/stylesheet)\n- [Events](https://cwco.beforesemicolon.com/documentation/events)\n- [Attributes](https://cwco.beforesemicolon.com/documentation/observed-attributes)\n- [Properties](https://cwco.beforesemicolon.com/documentation/properties)\n- [Context](https://cwco.beforesemicolon.com/documentation/context)\n- [Directives](https://cwco.beforesemicolon.com/documentation/if-directive)\n- [Custom Directives](https://cwco.beforesemicolon.com/documentation/custom-directive)\n- [LiveCycles](https://cwco.beforesemicolon.com/documentation/on-mount)\n- [Error Handling](https://cwco.beforesemicolon.com/documentation/on-error)\n\n### Install\n\nThis module can be used directly in the browser as well in Node environment. You can even use it along with other\nweb libraries and frameworks like `React` and `Angular`.\n\n#### Browser\n```html \n\n\u003c!-- use the latest version --\u003e\n\u003cscript src=\"https://unpkg.com/cwco/dist/cwco.min.js\"\u003e\u003c/script\u003e\n\n\u003c!-- use a specific version --\u003e\n\u003cscript src=\"https://unpkg.com/cwco@1.0.0/dist/cwco.min.js\"\u003e\u003c/script\u003e\n\n\u003c!-- link your app script after --\u003e\n\u003cscript src=\"app.js\"\u003e\u003c/script\u003e\n```\n\n#### NodeJs\n\n```\nnpm install cwco\n```\n\nYou can then import the constructors class according to what you are building.\n\n```js\nconst { WebComponent, ContextProviderComponent, Directive } = require('cwco');\n```\n\n### Code Editors \u0026 IDEs\nCWCO is just HTML and if you want syntax highlighting for VSCode you can use the inline-html\n\n#### VSCode\nFor syntax highlighting of HTML and CSS in javascript use [inline-html](https://github.com/pushqrdx/vscode-inline-html) \nor [lit-html](https://marketplace.visualstudio.com/items?itemName=bierner.lit-html) plugins.\n\nYou can import `html` from `cwco` which is just a help for VSCode which does nothing special\nto the HTML string you use it with.\n\n```js\nimport {html, css, WebComponent} from \"./cwco\";\n\nclass MyButton extends WebComponent {\n  get template() {\n    return html`\u003cbutton\u003e\u003cslot\u003e\u003c/slot\u003e\u003c/button\u003e`\n  }\n  \n  get stylesheet() {\n    return css`\u003cstyle\u003ebutton {color: #222}\u003c/style\u003e`\n    // or \n    // return css`button {color: #222}`\n  }\n}\n```\n\n#### Jet Brain IDEs\nThese IDEs have built-in HTML-in-Javascript syntax highlighting which can be useful when developing CWCO web components.\n\n### Want to Help?\n\n[Learn How](https://github.com/beforesemicolon/cwco/blob/master/CONTRIBUTING.md)\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbeforesemicolon%2Fcwco","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbeforesemicolon%2Fcwco","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbeforesemicolon%2Fcwco/lists"}