{"id":18537938,"url":"https://github.com/easywebapp/bootcell","last_synced_at":"2025-04-09T17:37:16.771Z","repository":{"id":44610265,"uuid":"215826495","full_name":"EasyWebApp/BootCell","owner":"EasyWebApp","description":"Web Components UI library based on WebCell v3, Bootstrap v5, Bootstrap Icon v1 \u0026 FontAwesome v5","archived":false,"fork":false,"pushed_at":"2024-06-16T21:26:40.000Z","size":1028,"stargazers_count":13,"open_issues_count":8,"forks_count":4,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-06-16T22:34:05.023Z","etag":null,"topics":["bootstrap","component","ui","web","web-cell"],"latest_commit_sha":null,"homepage":"http://web-cell.dev/BootCell/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/EasyWebApp.png","metadata":{"files":{"readme":"ReadMe.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","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},"funding":{"custom":["https://paypal.me/TechQuery","https://tech-query.me/image/TechQuery-Alipay.jpg"]}},"created_at":"2019-10-17T15:30:43.000Z","updated_at":"2024-06-16T21:25:12.000Z","dependencies_parsed_at":"2024-01-18T01:14:36.762Z","dependency_job_id":"b4be5e1f-925b-4c2b-9673-3ea7e294d0b2","html_url":"https://github.com/EasyWebApp/BootCell","commit_stats":{"total_commits":86,"total_committers":1,"mean_commits":86.0,"dds":0.0,"last_synced_commit":"3d30027a97fe0a8c4ab8fabc8dfef22aede04de7"},"previous_names":[],"tags_count":16,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EasyWebApp%2FBootCell","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EasyWebApp%2FBootCell/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EasyWebApp%2FBootCell/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EasyWebApp%2FBootCell/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/EasyWebApp","download_url":"https://codeload.github.com/EasyWebApp/BootCell/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223405433,"owners_count":17140223,"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":["bootstrap","component","ui","web","web-cell"],"created_at":"2024-11-06T19:41:21.048Z","updated_at":"2024-11-06T19:41:21.546Z","avatar_url":"https://github.com/EasyWebApp.png","language":"TypeScript","funding_links":["https://paypal.me/TechQuery","https://tech-query.me/image/TechQuery-Alipay.jpg"],"categories":[],"sub_categories":[],"readme":"![WebCell](https://web-cell.dev/WebCell-0.f1ffd28b.png)\n\n# BootCell\n\n[Web Components][1] UI library based on [WebCell v3][2], [BootStrap v5][3], [BootStrap Icon v1][4] \u0026 [FontAwesome v6][5]\n\n[![NPM Dependency](https://img.shields.io/librariesio/github/EasyWebApp/BootCell.svg)][6]\n[![CI \u0026 CD](https://github.com/EasyWebApp/BootCell/actions/workflows/main.yml/badge.svg)][7]\n\n[![Anti 996 license](https://img.shields.io/badge/license-Anti%20996-blue.svg)][8]\n[![jaywcjlove/sb](https://jaywcjlove.github.io/sb/ico/awesome.svg)][9]\n\n[![NPM](https://nodei.co/npm/boot-cell.png?downloads=true\u0026downloadRank=true\u0026stars=true)][10]\n\n## Usage\n\n### Installation\n\n```shell\nnpm install dom-renderer web-cell boot-cell\nnpm install parcel @parcel/config-default @parcel/transformer-typescript-tsc -D\n```\n\n#### `package.json`\n\n```json\n{\n    \"scripts\": {\n        \"start\": \"parcel source/index.html --open\",\n        \"build\": \"parcel build source/index.html --public-url .\"\n    }\n}\n```\n\n#### `tsconfig.json`\n\n```json\n{\n    \"compilerOptions\": {\n        \"target\": \"ES6\",\n        \"module\": \"ES2020\",\n        \"moduleResolution\": \"Node\",\n        \"useDefineForClassFields\": true,\n        \"jsx\": \"react-jsx\",\n        \"jsxImportSource\": \"dom-renderer\"\n    }\n}\n```\n\n#### `.parcelrc`\n\n```json\n{\n    \"extends\": \"@parcel/config-default\",\n    \"transformers\": {\n        \"*.{ts,tsx}\": [\"@parcel/transformer-typescript-tsc\"]\n    }\n}\n```\n\n### `source/index.html`\n\n```html\n\u003clink\n    rel=\"stylesheet\"\n    href=\"https://unpkg.com/bootstrap@5.3.3/dist/css/bootstrap.min.css\"\n/\u003e\n\u003clink\n    rel=\"stylesheet\"\n    href=\"https://unpkg.com/bootstrap-icons@1.11.3/font/bootstrap-icons.css\"\n/\u003e\n\u003clink\n    rel=\"stylesheet\"\n    href=\"https://unpkg.com/@fortawesome/fontawesome-free@6.5.1/css/all.min.css\"\n/\u003e\n\u003cscript src=\"https://polyfill.web-cell.dev/feature/ECMAScript.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://polyfill.web-cell.dev/feature/WebComponents.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://polyfill.web-cell.dev/feature/ElementInternals.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://polyfill.web-cell.dev/feature/Dialog.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://polyfill.web-cell.dev/feature/Share.js\"\u003e\u003c/script\u003e\n```\n\n## Components\n\n### Content\n\n1. [ListItem](https://web-cell.dev/BootCell/interfaces/content_listgroup.listitemprops.html)\n2. [ListGroup](https://web-cell.dev/BootCell/interfaces/content_listgroup.listgroupprops.html)\n3. [Table](https://web-cell.dev/BootCell/interfaces/content_table.tableprops.html)\n4. [TableRow](https://web-cell.dev/BootCell/interfaces/content_table.tablerowprops.html)\n5. [InputCell](https://web-cell.dev/BootCell/interfaces/content_table.inputcellprops.html)\n6. [Jumbotron](https://web-cell.dev/BootCell/interfaces/content_jumbotron.jumbotronprops.html)\n7. [Card](https://web-cell.dev/BootCell/interfaces/content_card.cardprops.html)\n8. [CardHeader](https://web-cell.dev/BootCell/interfaces/content_card.cardheaderprops.html)\n9. [CardFooter](https://web-cell.dev/BootCell/interfaces/content_card.cardfooterprops.html)\n10. [MediaObject](https://web-cell.dev/BootCell/interfaces/content_mediaobject.mediaobjectprops.html)\n11. [EdgeDetector](https://web-cell.dev/BootCell/interfaces/content_edgedetector.edgedetectorprops.html)\n12. [SplitView](https://web-cell.dev/BootCell/classes/content_splitview.splitview.html)\n13. [AccordionPanel](https://web-cell.dev/BootCell/interfaces/content_accordion.accordionpanelprops.html)\n14. [Accordion](https://web-cell.dev/BootCell/interfaces/content_accordion.accordionprops.html)\n15. [CollapseBox](https://web-cell.dev/BootCell/interfaces/content_collapse.collapseprops.html)\n16. [TabPanel](https://web-cell.dev/BootCell/modules/content_tabview.html#tabpanel)\n17. [TabView](https://web-cell.dev/BootCell/interfaces/content_tabview.tabviewprops.html)\n\n### Reminder\n\n1. [Badge](https://web-cell.dev/BootCell/interfaces/reminder_badge.badgeprops.html)\n2. [ProgressBar](https://web-cell.dev/BootCell/interfaces/reminder_progress.progressbarprops.html)\n3. [Progress](https://web-cell.dev/BootCell/interfaces/reminder_progress.progressprops.html)\n4. [Icon](https://web-cell.dev/BootCell/interfaces/reminder_icon.iconprops.html)\n5. [FAIcon](https://web-cell.dev/BootCell/interfaces/reminder_faicon.faiconprops.html)\n6. [BGIcon](https://web-cell.dev/BootCell/interfaces/reminder_faicon.bgiconprops.html)\n\n### Media\n\n1. [Image](https://web-cell.dev/BootCell/interfaces/media_image.imageprops.html)\n2. [Embed](https://web-cell.dev/BootCell/interfaces/media_embed.embedprops.html)\n3. [CarouselCaption](https://web-cell.dev/BootCell/interfaces/media_carousel.carouselcaptionprops.html)\n4. [CarouselItem](https://web-cell.dev/BootCell/interfaces/media_carousel.carouselitemprops.html)\n5. [CarouselView](https://web-cell.dev/BootCell/interfaces/media_carousel.carouselprops.html)\n\n### Navigator\n\n1. [BreadCrumb](https://web-cell.dev/BootCell/interfaces/navigator_breadcrumb.breadcrumbprops.html)\n2. [Pagination](https://web-cell.dev/BootCell/interfaces/navigator_pagination.paginationprops.html)\n3. [NavLink](https://web-cell.dev/BootCell/interfaces/navigator_nav.navlinkprops.html)\n4. [Nav](https://web-cell.dev/BootCell/interfaces/navigator_nav.navprops.html)\n5. [NavBar](https://web-cell.dev/BootCell/interfaces/navigator_navbar.navbarprops.html)\n6. [BannerNavBar](https://web-cell.dev/BootCell/interfaces/navigator_navbar.bannernavbarprops.html)\n7. [NavBarToggler](https://web-cell.dev/BootCell/interfaces/navigator_navbar.navbartogglerprops.html)\n8. [Step](https://web-cell.dev/BootCell/interfaces/navigator_stepper.stepprops.html)\n9. [Stepper](https://web-cell.dev/BootCell/interfaces/navigator_stepper.stepperprops.html)\n10. [DropMenuItem](https://web-cell.dev/BootCell/interfaces/navigator_dropmenu.dropmenuitemprops.html)\n11. [DropMenu](https://web-cell.dev/BootCell/interfaces/navigator_dropmenu.dropmenuprops.html)\n12. [ShareBar](https://web-cell.dev/BootCell/interfaces/navigator_sharebar.sharebarprops.html)\n\n### Prompt\n\n1. [Spinner](https://web-cell.dev/BootCell/interfaces/prompt_spinner.spinnerprops.html)\n2. [SpinnerBox](https://web-cell.dev/BootCell/interfaces/prompt_spinner.spinnerboxprops.html)\n3. [TooltipBox](https://web-cell.dev/BootCell/interfaces/prompt_tooltip.tooltipprops.html)\n4. [PopoverBox](https://web-cell.dev/BootCell/interfaces/prompt_popover.popoverprops.html)\n5. [AlertBox](https://web-cell.dev/BootCell/interfaces/prompt_alert.alertprops.html)\n6. [ToastBox](https://web-cell.dev/BootCell/interfaces/prompt_toast.toastprops.html)\n7. [Modal](https://web-cell.dev/BootCell/interfaces/prompt_dialog.modalprops.html)\n8. [`openDialog()`](https://web-cell.dev/BootCell/modules/prompt_dialog.html#opendialog)\n\n### Form\n\n1. [Form](https://web-cell.dev/BootCell/interfaces/form_form.formprops.html)\n2. [Button](https://web-cell.dev/BootCell/interfaces/form_button.buttonprops.html)\n3. [ButtonGroup](https://web-cell.dev/BootCell/interfaces/form_buttongroup.buttongroupprops.html)\n4. [Toolbar](https://web-cell.dev/BootCell/modules/form_buttongroup.html#toolbar)\n5. [IconButton](https://web-cell.dev/BootCell/modules/form_button.html#iconbuttonprops)\n6. [CloseButton](https://web-cell.dev/BootCell/modules/form_button.html#closebutton)\n7. [ToggleField](https://web-cell.dev/BootCell/interfaces/form_togglefield.togglefieldprops.html)\n8. [ScoreRange](https://web-cell.dev/BootCell/interfaces/form_scorerange.scorerangeprops.html)\n9. [Field](https://web-cell.dev/BootCell/interfaces/form_field.fieldprops.html)\n10. [FormField](https://web-cell.dev/BootCell/interfaces/form_formfield.formfieldprops.html)\n11. [InputGroup](https://web-cell.dev/BootCell/interfaces/form_inputgroup.inputgroupprops.html)\n12. [FileInput](https://web-cell.dev/BootCell/interfaces/form_fileinput.fileinputprops.html)\n\n### Calendar\n\n1. [CountDown](https://web-cell.dev/BootCell/interfaces/calendar_countdown.countdownprops.html)\n2. [CalendarTable](https://web-cell.dev/BootCell/interfaces/calendar_calendartable.calendartableprops.html)\n3. [WeekCalendar](https://web-cell.dev/BootCell/interfaces/calendar_weekcalendar.weekcalendarprops.html)\n4. [MonthCalendar](https://web-cell.dev/BootCell/interfaces/calendar_monthcalendar.monthcalendarprops.html)\n\n## Constants\n\n1. [Color](https://web-cell.dev/BootCell/enums/utility_constant.color.html)\n2. [Theme](https://web-cell.dev/BootCell/enums/utility_constant.theme.html)\n3. [Status](https://web-cell.dev/BootCell/enums/utility_constant.status.html)\n4. [CommonColors](https://web-cell.dev/BootCell/modules/utility_constant.html#commoncolors)\n5. [TextColors](https://web-cell.dev/BootCell/modules/utility_constant.html#textcolors)\n6. [BackgroundColors](https://web-cell.dev/BootCell/modules/utility_constant.html#backgroundcolors)\n7. [Size](https://web-cell.dev/BootCell/enums/utility_constant.size.html)\n8. [Position](https://web-cell.dev/BootCell/enums/utility_constant.position.html)\n9. [JustifyType](https://web-cell.dev/BootCell/enums/utility_constant.justifytype.html)\n\n## Theme\n\nReplace **BootStrap official CSS** file with these 3th-party libraries's directly:\n\n-   https://bootswatch.com/\n-   https://mdbootstrap.github.io/bootstrap-material-design/\n-   https://daemonite.github.io/material/\n\n[1]: https://www.webcomponents.org/\n[2]: https://web-cell.dev/\n[3]: https://getbootstrap.com/\n[4]: https://icons.getbootstrap.com/\n[5]: https://fontawesome.com/\n[6]: https://libraries.io/npm/boot-cell\n[7]: https://github.com/EasyWebApp/BootCell/actions/workflows/main.yml\n[8]: https://github.com/996icu/996.ICU/blob/master/LICENSE\n[9]: https://github.com/jaywcjlove/awesome-uikit\n[10]: https://nodei.co/npm/boot-cell/\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feasywebapp%2Fbootcell","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feasywebapp%2Fbootcell","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feasywebapp%2Fbootcell/lists"}