{"id":24734609,"url":"https://github.com/dd3tech/bui","last_synced_at":"2025-10-10T04:31:00.575Z","repository":{"id":142780888,"uuid":"614031670","full_name":"dd3tech/bui","owner":"dd3tech","description":"BUI: Tailwind based React component library to build back-office platforms :rocket:","archived":false,"fork":false,"pushed_at":"2025-10-02T16:49:47.000Z","size":64061,"stargazers_count":24,"open_issues_count":14,"forks_count":2,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-02T18:32:52.587Z","etag":null,"topics":["components","design-system","javascript","library","nextjs","nextjs-tailwind","production-code","react","react-components","react-ui-components","tailwindcss","typescipt","typescript","ui-components","uikit"],"latest_commit_sha":null,"homepage":"https://bui.dd360.mx","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/dd3tech.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2023-03-14T18:49:57.000Z","updated_at":"2025-10-02T16:47:56.000Z","dependencies_parsed_at":"2023-07-19T00:20:23.867Z","dependency_job_id":"7003de92-1663-43fb-b3e8-a8655e8d487c","html_url":"https://github.com/dd3tech/bui","commit_stats":null,"previous_names":["dd3tech/bui","dd3tech/dd360-components"],"tags_count":351,"template":false,"template_full_name":null,"purl":"pkg:github/dd3tech/bui","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dd3tech%2Fbui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dd3tech%2Fbui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dd3tech%2Fbui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dd3tech%2Fbui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dd3tech","download_url":"https://codeload.github.com/dd3tech/bui/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dd3tech%2Fbui/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278483831,"owners_count":25994722,"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-10-05T02:00:06.059Z","response_time":54,"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":["components","design-system","javascript","library","nextjs","nextjs-tailwind","production-code","react","react-components","react-ui-components","tailwindcss","typescipt","typescript","ui-components","uikit"],"created_at":"2025-01-27T19:39:29.533Z","updated_at":"2025-10-10T04:30:59.047Z","avatar_url":"https://github.com/dd3tech.png","language":"TypeScript","readme":"\n\u003cdiv align=\"center\"\u003e\n\u003cimg src=\"./assets/logo-light.svg\" alt=\"BUI logo\"\u003e\n\u003chr /\u003e\n\u003cbr/\u003e\n\nA React ecosystem library for building back-office platforms like [DD360](https://dd360.mx/). \u003cbr/\u003e\nIt's library created by developers for developers \n\u003cbr/\u003e\n\n**[Stable v6](https://bui.dd360.mx/)**\n\n[![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/dd3tech/bui)\n[![npm latest package](https://img.shields.io/npm/v/dd360-ds/latest.svg)](https://www.npmjs.com/package/dd360-ds)\n[![npm downloads](https://img.shields.io/npm/dm/dd360-ds)](https://www.npmjs.com/package/dd360-ds)\n[![Average time to resolve an issue](https://isitmaintained.com/badge/resolution/dd3tech/bui.svg)](https://isitmaintained.com/project/dd3tech/bui 'Average time to resolve an issue')\n[![CII Best Practices](https://bestpractices.coreinfrastructure.org/projects/7584/badge)](https://bestpractices.coreinfrastructure.org/projects/7584)\n[![Storybook](https://raw.githubusercontent.com/storybooks/brand/master/badge/badge-storybook.svg)](https://main--62ffec7466615c40c8dbe435.chromatic.com)\n\n\n\u003cp\u003e\n  \u003ca href=\"https://bui.dd360.mx/\" rel=\"noopener\" target=\"_blank\"\u003e\u003cimg style=\"border-radius:6px\" src=\"./assets/bui-components-dark.png\" alt=\"BUI components\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch3\u003e\n  \u003ca rel=\"noopener\" target=\"_blank\" href=\"https://bui.dd360.mx/docs/get-started/getting-started\"\u003eDocs\u003c/a\u003e \u0026bull;\n  \u003ca rel=\"noopener\" target=\"_blank\" href=\"https://bui.dd360.mx\"\u003eWebsite\u003c/a\u003e\n\u003c/h3\u003e\n\n\u003c/div\u003e\n\n## 📲 Installation\n\n```bash\nnpm install dd360-ds\n```\n\nor\n\n```bash\nyarn add dd360-ds\n```\n\n## 💅 Customize theme\n\nIf you want to use a provider to configure the library's theme, you can do so using the ThemeProvider provided by dd360-ds. This will allow you to set your own settings for the theme.\n\nTo use the ThemeProvider, you must import it as follows:\n\n```tsx\nimport { createTheme, ThemeProvider } from \"dd360-ds/theme\";\n```\n\nYou can then create your own theme configuration using the createTheme function, which accepts an object with different properties to customize the theme. For example, you can define the primary and secondary colors as shown below:\n\n```tsx\nconst theme = createTheme({\n  palette: {\n    primary: {\n      main: \"purple\"\n    },\n    secondary: {\n      main: \"#FFC107\"\n    }\n  }\n});\n```\n\nAfter creating your theme configuration, you can use the ThemeProvider to wrap your React app. This can be done as follows:\n\n```tsx\nReactDOM.createRoot(document.getElementById(\"root\")).render(\n  \u003cStrictMode\u003e\n    \u003cThemeProvider theme={theme}\u003e\n      \u003cApp /\u003e\n    \u003c/ThemeProvider\u003e\n  \u003c/StrictMode\u003e\n);\n```\n\nWithin the ThemeProvider, you can use the components provided by dd360-ds and the corresponding styles will be applied based on your theme settings.\n\nRemember that to use the ThemeProvider, you must import both the createTheme component and the ThemeProvider component from dd360-ds/theme.\n\n## 💡 Usage\n\nAfter Installation, you will have to make some extra configurations for everything to work normally.\n\nImport stylesheets into the `App.js` or `App.tsx`\n\n```js\nimport 'dd360-ds/dd360.css'\n```\n\n⚠️ ***Warning: If you want to combine it with other styles, be sure to import our css as the last one.***\n\n\nHow to import components?\n\n```jsx\nimport { Button } from 'dd360-ds'\n```\n\n## 🔫 Components\n\nThis is the most fun part. Below we will explain the use of the components we are currently developing.\n\nYou can checking and contribute to the docs website [here](https://github.com/dd3tech/bui-docs)\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdd3tech%2Fbui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdd3tech%2Fbui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdd3tech%2Fbui/lists"}