{"id":16101926,"url":"https://github.com/tomblachut/skimmed-datepicker","last_synced_at":"2025-03-18T08:30:45.810Z","repository":{"id":57362411,"uuid":"110389029","full_name":"tomblachut/skimmed-datepicker","owner":"tomblachut","description":"📅 Datepicker component for Angular, containing around 0.1% fat","archived":false,"fork":false,"pushed_at":"2018-11-16T01:34:11.000Z","size":656,"stargazers_count":12,"open_issues_count":2,"forks_count":0,"subscribers_count":5,"default_branch":"master","last_synced_at":"2024-10-10T18:51:55.208Z","etag":null,"topics":["angular","component","datepicker","touch-compatible"],"latest_commit_sha":null,"homepage":"https://tomblachut.github.io/skimmed-datepicker/","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/tomblachut.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-11-11T23:33:18.000Z","updated_at":"2022-02-24T12:19:16.000Z","dependencies_parsed_at":"2022-09-06T08:01:46.961Z","dependency_job_id":null,"html_url":"https://github.com/tomblachut/skimmed-datepicker","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tomblachut%2Fskimmed-datepicker","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tomblachut%2Fskimmed-datepicker/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tomblachut%2Fskimmed-datepicker/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tomblachut%2Fskimmed-datepicker/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tomblachut","download_url":"https://codeload.github.com/tomblachut/skimmed-datepicker/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221708922,"owners_count":16867651,"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":["angular","component","datepicker","touch-compatible"],"created_at":"2024-10-09T18:51:42.666Z","updated_at":"2024-10-27T17:07:19.186Z","avatar_url":"https://github.com/tomblachut.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003eSkimmed Datepicker\u003c/h1\u003e\n\u003cp align=\"center\"\u003e\u003cimg src=\"https://cdn.rawgit.com/tomblachut/skimmed-datepicker/master/src/assets/logo.svg\"\u003e\u003c/p\u003e\n\u003cp align=\"center\"\u003eCompatible with \u003cb\u003eAngular 6\u003c/b\u003e and up\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.npmjs.com/package/skimmed-datepicker\"\u003e\u003cimg alt=\"npm\" src=\"https://img.shields.io/npm/v/skimmed-datepicker.svg\"\u003e\u003c/a\u003e\n  \u003c!-- \u003ca href=\"https://travis-ci.org/tomblachut/neo-async\"\u003e\u003cimg alt=\"Travis Status\" src=\"https://img.shields.io/travis/tomblachut/skimmed-datepicker.svg\"\u003e\u003c/a\u003e --\u003e\n  \u003c!-- \u003ca href=\"https://codecov.io/gh/tomblachut/neo-async\"\u003e\u003cimg alt=\"Coverage Status\" src=\"https://img.shields.io/codecov/c/github/tomblachut/skimmed-datepicker/master.svg\"\u003e\u003c/a\u003e --\u003e\n  \u003ca href=\"https://www.npmjs.com/package/skimmed-datepicker\"\u003e\u003cimg alt=\"downloads\" src=\"https://img.shields.io/npm/dt/skimmed-datepicker.svg\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch3 align=\"center\"\u003e\u003ca href=\"https://tomblachut.github.io/skimmed-datepicker/\"\u003eSEE THE DEMO\u003c/a\u003e\u003c/h3\u003e\n\n## Features\n* 📅 Picks dates\n* 🔥 Blazing fast\n* 📱 Tap, pan \u0026 swipe enabled\n* 🖱️ Mouse friendly\n* 💧 Minimal required styles\n* 🎨 Maximally themeable\n* ⛔ Specify min \u0026 max dates\n* 🏷️ Customizable labels \u0026 date formats\n* 🔎 Transitions smoothly between daily, monthly \u0026 yearly views\n* 🛣️ Doesn't block vertical page scrolling on touch devices\n\n## Quick start\n1. Skimmed Datepicker is available as a [package on npm](https://www.npmjs.com/package/skimmed-datepicker). Simply use ubiquitous command and you are good to go!\n    ```\n    npm i skimmed-datepicker\n    ```\n    Alternatively when [using Yarn](https://yarnpkg.com/en/package/skimmed-datepicker):\n    ```\n    yarn add skimmed-datepicker\n    ```\n\n2. Import `BrowserAnimationsModule` into root module \u0026 and `DatepickerModule` wherever you want to use it\n    ```typescript\n    import { BrowserAnimationsModule } from '@angular/platform-browser/animations';\n    import { DatepickerModule } from 'skimmed-datepicker';\n    \n    @NgModule({\n    imports: [\n      BrowserAnimationsModule,\n      DatepickerModule,\n    ],\n    })\n    export class AppModule {\n    }\n    ```\n    Ensure that `@angular/animations` package is installed.\n\n3. Include stylesheet\n    ```\n    TODO\n    ```\n\n4. *(Optional)* For gesture support install and import `hammerjs` globally.\n    ```\n    npm i hammerjs\n    ```\n    A popular place, recommended by [Angular Material](https://material.angular.io/guide/getting-started), is `src/main.ts`.\n    ```typescript\n    import 'hammerjs';\n    ```\n\n5. Use `skm-datepicker` in a template\n    ```html\n    \u003cskm-datepicker [formControl]=\"dateControl\"\u003e\u003c/skm-datepicker\u003e\n    \u003cskm-datepicker [(ngModel)]=\"date\"\u003e\u003c/skm-datepicker\u003e\n    \u003cskm-datepicker [(date)]=\"date\"\u003e\u003c/skm-datepicker\u003e\n    ```\n\n## Configuration\n`TODO: Freeze API \u0026 document everything`\n\n```typescript\ndate: Date;\nmin: Date;\nmax: Date;\n\ndeselectEnabled: boolean;\nyearFormat = 'y';\nheadingFormat = 'MMMM y';\nfirstWeekDay = WeekDay.Monday;\ndayLabels: string[];\nweekDayLabels: string[];\nmonthLabels: string[];\n\ndateChange: EventEmitter\u003cDate\u003e;\n```\n\n## Roadmap\n* Full compatibility with `ReactiveFormsModule`\n* Extend configurability\n* Popover mode\n* Keyboard support\n* Improve accessibility\n* Date range mode\n* Expose as Web Component\n\n## Credits\n* Created by Tomasz Błachut ([@tomblachut](https://github.com/tomblachut))\n* Spatial easing function perfected by Michał Wiatrowski ([@michel4ngel0](https://github.com/michel4ngel0))\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftomblachut%2Fskimmed-datepicker","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftomblachut%2Fskimmed-datepicker","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftomblachut%2Fskimmed-datepicker/lists"}