sprint-asia-custom-component 0.1.72 → 0.1.73

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "sprint-asia-custom-component",
3
3
  "main": "dist/index.js",
4
- "version": "0.1.72",
4
+ "version": "0.1.73",
5
5
  "private": false,
6
6
  "dependencies": {
7
7
  "@headlessui/react": "^1.7.18",
@@ -1,13 +1,15 @@
1
- import React, {useState} from "react";
1
+ import React from "react";
2
2
  import DatePicker from "react-datepicker";
3
3
  import 'react-datepicker/dist/react-datepicker.css';
4
- import { PiCalendarDuotone } from "react-icons/pi";
4
+ import { PiCalendarBlankDuotone } from "react-icons/pi";
5
5
 
6
6
  const CustomDatePicker = ({
7
7
  startDate,
8
8
  onChangeStartDate,
9
9
  endDate,
10
- onChangeEndDate
10
+ onChangeEndDate,
11
+ isRequired,
12
+ title
11
13
  }) => {
12
14
  const onChange = (dates) => {
13
15
  const [start, end] = dates
@@ -16,19 +18,28 @@ const CustomDatePicker = ({
16
18
  };
17
19
 
18
20
  return (
19
- <div className="cursor-pointer h-full border border-neutral40 bg-neutral20 rounded-md w-fit flex items-center">
20
- <div className="p-2">
21
- <PiCalendarDuotone size={16} className="text-neutral300"/>
21
+ <div>
22
+ {title && (
23
+ <div className="flex">
24
+ <p className="text-sm font-normal text-black mb-1">{title}</p>
25
+ {isRequired && <p className="text-sm font-normal text-danger500 ml-1">*</p>}
26
+ </div>
27
+ )}
28
+ <div className="cursor-pointer py-1 border border-neutral40 bg-neutral20 rounded-md w-fit flex items-center">
29
+ <div className="p-2">
30
+ <PiCalendarBlankDuotone size={16} className="text-neutral300"/>
31
+ </div>
32
+ <DatePicker
33
+ selected={startDate}
34
+ onChange={onChange}
35
+ startDate={startDate}
36
+ endDate={endDate}
37
+ selectsRange
38
+ utcOffset={0}
39
+ dateFormat="d MMM yyyy"
40
+ className="cursor-pointer bg-neutral20 text-neutral300 rounded-md pr-2 focus:outline-none text-sm"
41
+ />
22
42
  </div>
23
- <DatePicker
24
- selected={startDate}
25
- onChange={onChange}
26
- startDate={startDate}
27
- endDate={endDate}
28
- selectsRange
29
- utcOffset={0}
30
- className="cursor-pointer bg-neutral20 text-neutral300 rounded-md pr-2 focus:outline-none text-sm"
31
- />
32
43
  </div>
33
44
  )}
34
45
 
@@ -7,7 +7,7 @@ const HeaderTable = ({
7
7
  <thead>
8
8
  <tr>
9
9
  {dataHeader.map((value, index) => (
10
- <th key={index} className="py-3.5 px-4 bg-neutral40 text-neutral500 text-sm font-semibold text-left">
10
+ <th key={index} className="py-3.5 px-4 bg-neutral20 text-neutral500 text-sm font-medium text-left">
11
11
  <p>{value.toUpperCase()}</p>
12
12
  </th>
13
13
  ))}