{"id":30820971,"url":"https://github.com/tram-one/tram-lite","last_synced_at":"2025-10-27T14:12:08.974Z","repository":{"id":65095896,"uuid":"581914941","full_name":"Tram-One/tram-lite","owner":"Tram-One","description":"💡 Declarative HTML library for native web-components","archived":false,"fork":false,"pushed_at":"2025-01-26T15:53:50.000Z","size":4998,"stargazers_count":79,"open_issues_count":6,"forks_count":5,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-09-04T17:15:20.360Z","etag":null,"topics":["hacktoberfest","html","javascript","web-components"],"latest_commit_sha":null,"homepage":"https://tram-one.io/tram-lite/","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/Tram-One.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-12-24T21:07:37.000Z","updated_at":"2025-08-26T07:06:39.000Z","dependencies_parsed_at":"2023-02-09T20:30:52.004Z","dependency_job_id":"7d6f4cf8-1d45-466c-90f7-ecf67b7c6020","html_url":"https://github.com/Tram-One/tram-lite","commit_stats":{"total_commits":7,"total_committers":1,"mean_commits":7.0,"dds":0.0,"last_synced_commit":"d713544f7d004ec9190bfc1fc349e1fd3fb6349b"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Tram-One/tram-lite","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tram-One%2Ftram-lite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tram-One%2Ftram-lite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tram-One%2Ftram-lite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tram-One%2Ftram-lite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Tram-One","download_url":"https://codeload.github.com/Tram-One/tram-lite/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tram-One%2Ftram-lite/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":273888057,"owners_count":25185805,"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","status":"online","status_checked_at":"2025-09-06T02:00:13.247Z","response_time":2576,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["hacktoberfest","html","javascript","web-components"],"created_at":"2025-09-06T10:04:59.878Z","updated_at":"2025-10-27T14:12:08.879Z","avatar_url":"https://github.com/Tram-One.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003e [!warning]\n\u003e this specific project in the Tram-One org is no longer under active development. We recommend checking out our other projects for web-development, namely [Tram-Deco](https://github.com/Tram-One/tram-deco)\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"http://tram-one.io/tram-lite/\" target=\"_blank\"\u003e\n    \u003cimg src=\"https://unpkg.com/@tram-one/tram-logo@5.0.1/dist/lite.svg\" width=\"128\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://tram-one.io/tram-lite/#install\"\u003e\n    \u003cimg src=\"https://img.shields.io/npm/dm/tram-lite.svg\" alt=\"Downloads\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://tram-one.io/tram-lite/\"\u003e\n    \u003cimg src=\"https://img.shields.io/npm/v/tram-lite.svg\" alt=\"Version\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://unpkg.com/tram-lite/output/tram-lite.min.js\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/gzip-2.2kB-006369.svg?style=flat\" alt=\"Gzipped Size\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/Tram-One/tram-lite/blob/main/LICENSE\"\u003e\n    \u003cimg src=\"https://img.shields.io/npm/l/tram-lite.svg\" alt=\"License\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://discord.gg/dpBXAQC\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/discord-join-5865F2.svg?style=flat\" alt=\"Join Discord\"\u003e\n  \u003c/a\u003e\n\u003c/div\u003e\n\n# Tram-Lite\n\nTram-Lite is an HTML-first library that helps developers build native web-components, and makes building simple native\nweb-applications easier and more elegant!\n\n```html\n\u003c!-- include the tram-lite library --\u003e\n\u003cscript src=\"https://unpkg.com/tram-lite@5\"\u003e\u003c/script\u003e\n\n\u003c!-- define a new web-component, custom-title --\u003e\n\u003ctemplate tl-definition\u003e\n\t\u003ccustom-title color=\"blue\"\u003e\n\t\t\u003c!-- embed attributes right in the template --\u003e\n\t\t\u003cstyle\u003e\n\t\t\th1 { color: ${'color'} }\n\t\t\u003c/style\u003e\n\t\t\u003ch1\u003e${'page'}\u003c/h1\u003e\n\n\t\t\u003c!-- use controlled elements to update the component attributes --\u003e\n\t\t\u003cinput tl-controlled placeholder=\"Title\" tl-attrmap=\"value:page\" /\u003e\n\n\t\t\u003c!-- effects run on mount, and when dependencies change --\u003e\n\t\t\u003cscript tl-effect tl-dependencies=\"page\"\u003e\n\t\t\tthis.ownerDocument.title = this.getAttribute('page');\n\t\t\u003c/script\u003e\n\t\u003c/custom-title\u003e\n\u003c/template\u003e\n\n\u003c!-- use your new component anywhere in your HTML! --\u003e\n\u003ccustom-title page=\"Introduction!\"\u003e\u003c/custom-title\u003e\n```\n\nTo install, you can simply include a script tag pointed to `unpkg.com` in your `index.html`:\n\n```html\n\u003cscript src=\"https://unpkg.com/tram-lite@5\"\u003e\u003c/script\u003e\n```\n\nTo learn more check out the website at https://tram-one.io/tram-lite\n\n### Discord\n\nIf you want to start contributing, need help, or would just like to say hi,\n[join our discord](https://discord.gg/dpBXAQC)!\n\n### Development\n\nIf you would like to do development in this repo, the following are commands you can run after cloning this repo:\n\n#### ci\n\nBy running `npm ci`, you can install all the development dependencies. This is required for building, testing, and\nrunning any of the other commands listed.\n\n#### start\n\nYou can start a simple http server using `npm run start`. By clicking on the link that it prints out, you can go to the\n`examples/` folder, and see a set of components built with Tram-Lite.\n\n#### build\n\nYou can build a single asset that is used for publishing to npm, as well as the minified result using `npm run build`.\nThis is automatically triggered before `start` and `publish`. You can run this manually when making changes to validate\nagainst the example components.\n\n#### docs\n\nYou can view the website by running `npm run docs`.\n\n#### tests\n\nYou can run the test suite by running `npm test`. This launches cypress, and can run in any browser. You do not need to\nrun any other commands (aside from an initial install) for this to work (we launch the file directly).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftram-one%2Ftram-lite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftram-one%2Ftram-lite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftram-one%2Ftram-lite/lists"}