{"id":24617439,"url":"https://github.com/matthewbub/calendar-widgets","last_synced_at":"2025-05-07T05:09:22.477Z","repository":{"id":37848077,"uuid":"498556518","full_name":"matthewbub/calendar-widgets","owner":"matthewbub","description":"Craft beautifully robust date components in React.","archived":false,"fork":false,"pushed_at":"2024-09-04T08:28:00.000Z","size":9315,"stargazers_count":4,"open_issues_count":10,"forks_count":12,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-05-03T01:27:41.538Z","etag":null,"topics":["calendar","calendar-widget","component-library","javascript","open-source","react","typescript","widgets"],"latest_commit_sha":null,"homepage":"http://calendar-widgets.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/matthewbub.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-06-01T01:51:31.000Z","updated_at":"2024-05-17T16:36:13.000Z","dependencies_parsed_at":"2023-11-18T16:25:31.093Z","dependency_job_id":"d1a37e23-7c68-4458-a1d6-28372accb403","html_url":"https://github.com/matthewbub/calendar-widgets","commit_stats":null,"previous_names":["matthewbub/calendar-widgets","9mbs/calendar-widgets"],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/matthewbub%2Fcalendar-widgets","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/matthewbub%2Fcalendar-widgets/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/matthewbub%2Fcalendar-widgets/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/matthewbub%2Fcalendar-widgets/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/matthewbub","download_url":"https://codeload.github.com/matthewbub/calendar-widgets/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252534786,"owners_count":21763842,"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":["calendar","calendar-widget","component-library","javascript","open-source","react","typescript","widgets"],"created_at":"2025-01-24T23:24:44.441Z","updated_at":"2025-05-07T05:09:22.458Z","avatar_url":"https://github.com/matthewbub.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"./docs/static/branding-assets/CW-Logo-Medium-50x50_3@3x.png\"/\u003e\n\u003c/p\u003e\n\n# Calendar Widgets\n\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://github.com/9mbs/calendar-widgets/blob/v0.0.13/LICENSE)\n![Current bundle size: 9.29 kB](https://img.shields.io/badge/Bundle_Size-9.29_kB-blue.svg)\n\nCraft beautifully robust **date** components in React.\n\n- [Documentation](https://calendar-widgets.com)\n- [Changelog](https://calendar-widgets.com/changelog)\n- [Getting Started](#getting-started)\n- [Contributing \u0026 Bug Reports](#contributing--bug-reports)\n\n## Getting Started\n\nTo begin, you'll want to add the `calendar-widgets` package to a new or existing React project.\n\n```sh\n# npm\nnpm install calendar-widgets\n\n# yarn\nyarn add calendar-widgets\n\n# pnpm\npnpm add calendar-widgets\n```\n\n## Examples\n\nTo help you get started, take a look at this simple implementation of a Calendar. Here we're overriding the default component used to display a particular date with our custom variation.\n\nWe're also passing an array of custom dates. When the custom date's `date` aligns with the `date` in our `CustomDay` component, we'll have access to that custom date.\n\n```jsx\nimport React from 'react';\nimport { Calendar } from 'calendar-widgets';\nimport 'calendar-widgets/styles/Calendar-grid.css';\n\n/* defining an optional custom day component */\nconst CustomDay = ({date, customDate}) =\u003e (\n  \u003cdiv\u003e\n    \u003cb\u003e{date.getDate()}\u003c/b\u003e\n    {customDate?.name \u0026\u0026 \u003csmall\u003e{customDate?.name}\u003c/small\u003e}\n  \u003c/div\u003e\n);\n\nconst App = () =\u003e {\n  return (\n    \u003cCalendar \n      customDay={CustomDay}\n      customDates={[\n        {\n          name: 'Lisa\\'s Birthday',\n          date: new Date(2023, 4, 10)\n        }\n        // ...\n      ]}\n    /\u003e\n  )\n};\n```\n\n## Contributing / Bug Reports\n\nWe'd be appreciative of bug reports/ fixes, and would gladly accept new proposals.\n\nIf you'd like to contribute to an existing issue, kindly communicate through the designated ticket to avoid overlapping efforts. Check out the [Open Issues](https://github.com/matthewbub/calendar/issues?q=is%3Aissue+is%3Aopen) and our [Contributing Guide](./CONTRIBUTING.md) for more information.\n\nThis project requires [Node.js](https://nodejs.org/en) and [pnpm](https://pnpm.io/) to be installed. If needed, you can install them from Node.js website and pnpm website.\n\n### Contributors Setup\n\n1. Fork this repository\n2. Clone the forked repository to your local machine, or open a new Code Space\n3. Checkout to a clean branch. e.g `git checkout feature/addSomeCode` (Please be more descriptive)\n4. Install the dependencies via `pnpm install`\n5. You're all set up. Run `pnpm run build` to run the production build and ensure everything is working. If not, please open an issue in \u003chttps://github.com/matthewbub/calendar-widgets/issues\u003e 🙂\n\n### Scripts\n\n- `pnpm run build` Run the build that we push to NPM\n- `pnpm run dev` Run the dev build that does not minify the code\n- `pnpm run storybook` Run Storybook for local development\n- `pnpm run lint` Run ESLint to catch errors\n- `pnpm run lint:fix` Run ESLint to catch auto-fix errors\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmatthewbub%2Fcalendar-widgets","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmatthewbub%2Fcalendar-widgets","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmatthewbub%2Fcalendar-widgets/lists"}