Package Health Score

57 / 100

security
No known security issues
popularity
Recognized
maintenance
Inactive
community
Sustainable

Explore Similar Packages

Security

No known security issues

All security vulnerabilities belong to production dependencies of direct and indirect packages.

Security and license risk for significant versions

Version				Vulnerabilities	License Risk
13.1.1	\|	07/2023	Popular	0 C 0 H 0 M 0 L	0 H 0 M 0 L
13.0.3	\|	06/2023		0 C 0 H 0 M 0 L	0 H 0 M 0 L
9.0.0	\|	06/2023		0 C 0 H 0 M 0 L	0 H 0 M 0 L
11.0.0	\|	06/2023		0 C 0 H 0 M 0 L	0 H 0 M 0 L
12.1.0	\|	06/2023		0 C 0 H 0 M 0 L	0 H 0 M 0 L

License

MIT

Security Policy

Is your project affected by vulnerabilities?

Scan your projects for vulnerabilities. Fix quickly with automated fixes. Get started with Snyk for free.

Get started free

Popularity

Recognized

Weekly Downloads (43,398)

GitHub Stars: 342
Forks: 139
Contributors: 20

Direct Usage Popularity

The npm package ngx-material-timepicker receives a total of 43,398 downloads a week. As such, we scored ngx-material-timepicker popularity level to be Recognized.

Based on project statistics from the GitHub repository for the npm package ngx-material-timepicker, we found that it has been starred 342 times.

Downloads are calculated as moving averages for a period of the last 12 months, excluding weekends and known missing data points.

Community

Sustainable

Readme.md: Yes
Contributing.md: No
Code of Conduct: No
Contributors: 20
Funding: Yes

With more than 10 contributors for the ngx-material-timepicker repository, this is possibly a sign for a growing and inviting community.

We found a way for you to contribute to the project! Looks like ngx-material-timepicker is missing a Code of Conduct.

Embed Package Health Score Badge

Maintenance

Inactive

Commit Frequency

No Recent Commits

Open Issues: 68
Open PR: 8
Last Release: 1 year ago
Last Commit: 1 year ago

Further analysis of the maintenance status of ngx-material-timepicker based on released npm versions cadence, the repository activity, and other data points determined that its maintenance is Inactive.

An important project maintenance signal to consider for ngx-material-timepicker is that it hasn't seen any new versions released to npm in the past 12 months, and could be considered as a discontinued project, or that which receives low attention from its maintainers.

In the past month we didn't find any pull request activity or change in issues status has been detected for the GitHub repository.

Keep your project healthy

Check your package.json

Ensure all the packages you're using are healthy and well-maintained

Snyk Vulnerability Scanner

Get health score & security insights directly in your IDE

Package

Node.js Compatibility: not defined

Age: 7 years
Dependencies: 1 Direct
Versions: 89
Install Size: 1.31 MB
Dist-tags: 1
# of Files: 107
Maintainers: 1
TS Typings: Yes

ngx-material-timepicker has more than a single and default latest tag published for the npm package. This means, there may be other tags available for this package, such as next to indicate future releases, or stable to indicate stable releases.

Readme

Angular Material Timepicker

Handy multifunctional material design timepicker for Angular 6.0+

Demo

https://agranom.github.io/ngx-material-timepicker/

Getting started

Install timepicker through npm:

npm install --save ngx-material-timepicker
npm install --save luxon

Next import the timepicker module into your app's module:

import {NgModule} from '@angular/core';
import {NgxMaterialTimepickerModule} from 'ngx-material-timepicker';

@NgModule({
  imports: [NgxMaterialTimepickerModule]
})
export class MyModule {}

Finally connect the timepicker to an input via a template property:

<input>

The timepicker opens once you click on the input

Internationalization

Timepicker supports locales in format BCP 47. It has en-US locale by default.

To override default locale and numbering system (latn or arab):

import {NgModule} from '@angular/core';
import {NgxMaterialTimepickerModule} from 'ngx-material-timepicker';

@NgModule({
  imports: [NgxMaterialTimepickerModule.setOpts('ar-AE', 'arab')]
})
export class MyModule {}

Documentation

API reference for Angular Material Timepicker

import {NgxMaterialTimepickerModule} from 'ngx-material-timepicker';

NgxTimepicker

Directive responsible for managing the timepicker popup and setting value to input

Selector: ngxTimepicker

Properties

Name	Description
@Input()
ngxTimepicker: NgxMaterialTimepickerComponent	The timepicker that this input is associated with.
@Input()
disabled: boolean	Weather the timepicker popup should be disabled.
@Input()
value: string	Set a default value and time for a timepicker. The format of the time is in 12 hours notation `11:00 PM` or in 24 hours notation `23:00`. A Date string won't work.
@Input()
format: number	`12` or `24` . 12h/24h view for hour selection clock . `12` (AM/PM) format by default.
@Input()
min: string or DateTime	Set min time for timepicker (`11:15 pm` )
@Input()
max: string or DateTime	Set max time for timepicker (`11:15 pm` )
@Input()
disableClick: boolean	Set `true` to disable opening timepicker by clicking on the input

NgxMaterialTimepickerComponent

Component responsible for visualisation the timepicker

Selector: ngx-material-timepicker

Properties

Name	Description
@Input()
cancelBtnTmpl: TemplateRef	Set if you want to change cancel button to your custom one.
@Input()
confirmBtnTmpl: TemplateRef	Set if you want to change confirm button to your custom one.
@Input()
editableHintTmpl: TemplateRef	Set if you want to change dial hint to your custom one. Works only if `enableKeyboardInput = true`
@Input()
ESC: boolean	Disable or enable closing timepicker by ESC.
@Input()
enableKeyboardInput: boolean	To disable or enable changing time through a keyboard on the timepicker dial without interaction with a clock face. Set `false` by default
@Input()
minutesGap: number	To define a gap between minutes. Set `1` by default
@Input()
defaultTime: string	Set default time for a timepicker. `12:00 AM` by default
@Input()
preventOverlayClick: boolean	Set `true` to prevent closing the timepicker by overlay click. Uses `false` by default
@Input()
disableAnimation: boolean	Set `true` to prevent opening and closing timepicker animation. Uses `false` by default
@Input()
hoursOnly: boolean	Set `true` to prevent switching to minutes automatically once hour is selected. Uses `false` by default
@Input()
theme: NgxMaterialTimepickerTheme	Custom css properties which will override the defaults
@Input()
timepickerClass: string	To provide a custom css class for the timepicker
@Output()
timeSet: EventEmitter\	Emits time when that was set.
@Output()
opened: EventEmitter\	Emits after timepicker was opened.
@Output()
closed: EventEmitter\	Emits after timepicker was closed.
@Output()
hourSelected: EventEmitter\	Emits after hour was selected.
@Output()
timeChanged: EventEmitter\	Emits once time was changed.

NgxTimepickerFieldComponent

The timepicker as a control.

Selector: ngx-timepicker-field

Properties

Name	Description
@Input()
disabled: boolean	Whether the timepicker is disabled
@Input()
toggleIcon: TemplateRef\	Provide custom `svg` icon for toggle button
@Input()
buttonAlign: 'right' or 'left'	Positioning toggle button (`right` by default)
@Input()
clockTheme: NgxMaterialTimepickerTheme	Custom css properties which will override timepicker clock
@Input()
controlOnly: boolean	Hide or display toggle button with the timepicker clock
@Input()
format: number	`12` or `24` . Set format for timepicker. `12` (AM/PM) format by default.
@Input()
cancelBtnTmpl: TemplateRef\	Set if you want to change cancel button for timepicker to your custom one.
@Input()
confirmBtnTmpl: TemplateRef\	Set if you want to change confirm button for timepicker to your custom one.
@Input()
min: string or DateTime	Set min time for timepicker (`11:15 pm` )
@Input()
max: string or DateTime	Set max time for timepicker (`11:15 pm` )
@Input()
minutesGap: number	To define a gap between minutes. Set `1` by default
@Output()
timeChanged: EventEmitter\	Emit a new time once it is changed.

NgxMaterialTimepickerToggleComponent

Component responsible for opening the timepicker.

Selector: ngx-material-timepicker-toggle

Properties

Name	Description
@Input()
for: NgxMaterialTimepickerComponent	Timepicker instance that the button will toggle
@Input()
disabled: boolean	Whether the toggle button is disabled

NgxMaterialTimepickerToggleIconDirective

Can be used to override the icon of a NgxMaterialTimepickerToggleComponent.

Selector: [ngxMaterialTimepickerToggleIcon]

NgxMaterialTimepickerThemeDirective (deprecated)

Can be used to override styles of a NgxMaterialTimepicker.

Selector: ngx-material-timepicker[ngxMaterialTimepickerTheme]

Properties

Name	Description
@Input()
ngxMaterialTimepickerTheme: NgxMaterialTimepickerTheme	Custom css properties which will override the defaults

Development

Prepare your environment

Install local dev dependencies: npm install while current directory is this repo.

Development server

Run npm start to start a development server on a port 4200.

Open http//:localhost:4200 on your browser.

Tests

Run npm test to run tests once or npm run test:watch to continually run tests.

License

MIT

ngx-material-timepicker dependencies

tslib

FAQs

What is ngx-material-timepicker?

Handy material design timepicker for angular. Visit Snyk Advisor to see a full health score report for ngx-material-timepicker, including popularity, security, maintenance & community analysis.

Is ngx-material-timepicker popular?

The npm package ngx-material-timepicker receives a total of 43,398 weekly downloads. As such, ngx-material-timepicker popularity was classified as a recognized. Visit the popularity section on Snyk Advisor to see the full health analysis.

Is ngx-material-timepicker well maintained?

We found indications that ngx-material-timepicker is an Inactive project. See the full package health analysis to learn more about the package maintenance status.

Is ngx-material-timepicker safe to use?

The npm package ngx-material-timepicker was scanned for known vulnerabilities and missing license, and no issues were found. Thus the package was deemed as safe to use. See the full health analysis review.

Last updated on 21 December-2024, at 02:40 (UTC).

Build a secure application checklist

Select a recommended open source package

Minimize your risk by selecting secure & well maintained open source packages

DONE

Scan your app for vulnerabilities

Scan your application to find vulnerabilities in your: source code, open source dependencies, containers and configuration files

SCAN NOW

Fix identified vulnerabilities

Easily fix your code by leveraging automatically generated PRs

AUTO FIX

Monitor for new issues

New vulnerabilities are discovered every day. Get notified if your application is affected

MONITOR APP

Package Health Score

Explore Similar Packages

Security and license risk for significant versions

Is your project affected by vulnerabilities?

Weekly Downloads (43,398)

Direct Usage Popularity

Embed Package Health Score Badge

Commit Frequency

Keep your project healthy

Check your package.json

Snyk Vulnerability Scanner

Readme

Angular Material Timepicker

Demo

Table of contents

Getting started

Internationalization

Documentation

API reference for Angular Material Timepicker

NgxTimepicker

NgxMaterialTimepickerComponent

NgxTimepickerFieldComponent

NgxMaterialTimepickerToggleComponent

NgxMaterialTimepickerToggleIconDirective

NgxMaterialTimepickerThemeDirective (deprecated)

Development

Prepare your environment

Development server

Tests

License

ngx-material-timepicker dependencies

FAQs

What is ngx-material-timepicker?

Is ngx-material-timepicker popular?

Is ngx-material-timepicker well maintained?

Is ngx-material-timepicker safe to use?

Build a secure application checklist

Select a recommended open source package

Scan your app for vulnerabilities

Source Code

Open Source

Container

Config

Fix identified vulnerabilities

Monitor for new issues