1.1.0 • Published 5 months ago
hikma-datepicker v1.1.0
hikma-datepicker - A Simple and Flexible React Datepicker Component
Description
hikma-datepicker is a lightweight and flexible date picker reusable component, designed for easy integration into web applications. Customize date formats, styles, and locales effortlessly.
Datepicker | Datepicker Range |
---|---|
![]() | ![]() |
Features
- Simple and lightweight date picker.
- Fully customizable date formats and themes.
- Compatible with Reactjs JavaScript & Typescript.
Installation
Install the package via NPM:
npm install hikma-datepicker
Install the package via YARN:
yarn hikma-datepicker
Example :
import { UiDatepicker } from "hikma-datepicker";
import 'hikma-datepicker/dist/index.css';
const Example = () => {
return (
<UiDatepicker
disablePastDates={true}
dateFormat='dd-MM-yyyy'
onChange={(e) => alert(JSON.stringify(e))}
/>
);
};
Example with Tailwindcss :
import { UiDatepicker } from "hikma-datepicker";
const Example = () => {
return (
<UiDatepicker
disablePastDates={true}
dateFormat='dd-MM-yyyy'
onChange={(e) => alert(JSON.stringify(e))}
/>
);
};
Configuration with Tailwindcss for change your won color :
module.exports = {
content: ["./src/**/*.{js,jsx,ts,tsx}"], // Watch only the src folder
theme: {
extend: {
colors: {
primary: {
50: "#f4f1ff",
100: "#ebe5ff",
200: "#d7cfff",
300: "#bba8ff",
400: "#9b77ff",
500: "#7d40ff",
600: "#6f19ff",
700: "#6207fa",
800: "#5206d1",
900: "#4507ac",
950: "#270075",
},
},
},
},
plugins: [],
}
1.1.0
5 months ago
1.1.0-next.1
5 months ago
1.0.0-next.2
8 months ago
1.0.0
8 months ago
1.0.0-next.1
8 months ago
0.0.0-development
8 months ago