@trsys-tech/matrix-library 0.3.2 → 0.3.3

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.
Files changed (33) hide show
  1. package/dist/components/date-picker/DesktopDatePicker.d.ts +1 -0
  2. package/dist/components/date-picker/DesktopDatePicker.d.ts.map +1 -1
  3. package/dist/components/date-picker/DesktopDateRangePicker.d.ts +1 -0
  4. package/dist/components/date-picker/DesktopDateRangePicker.d.ts.map +1 -1
  5. package/dist/components/date-picker/DesktopTimePicker.d.ts +1 -0
  6. package/dist/components/date-picker/DesktopTimePicker.d.ts.map +1 -1
  7. package/dist/components/date-picker/MobileDatePicker.d.ts +1 -0
  8. package/dist/components/date-picker/MobileDatePicker.d.ts.map +1 -1
  9. package/dist/components/date-picker/MobileDateRangePicker.d.ts +1 -0
  10. package/dist/components/date-picker/MobileDateRangePicker.d.ts.map +1 -1
  11. package/dist/components/date-picker/MobileTimePicker.d.ts +1 -0
  12. package/dist/components/date-picker/MobileTimePicker.d.ts.map +1 -1
  13. package/dist/components/form-date-picker/FormDatePicker.d.ts +1 -0
  14. package/dist/components/form-date-picker/FormDatePicker.d.ts.map +1 -1
  15. package/dist/desktopdatepicker.es.js +23 -21
  16. package/dist/desktopdatepicker.es.js.map +1 -1
  17. package/dist/desktopdaterangepicker.es.js +28 -26
  18. package/dist/desktopdaterangepicker.es.js.map +1 -1
  19. package/dist/desktoptimepicker.es.js +12 -12
  20. package/dist/desktoptimepicker.es.js.map +1 -1
  21. package/dist/formdatepicker.es.js +10 -10
  22. package/dist/formdatepicker.es.js.map +1 -1
  23. package/dist/formdaterangepicker.es.js +10 -10
  24. package/dist/formdaterangepicker.es.js.map +1 -1
  25. package/dist/formtimepicker.es.js +10 -10
  26. package/dist/formtimepicker.es.js.map +1 -1
  27. package/dist/mobiledatepicker.es.js +16 -14
  28. package/dist/mobiledatepicker.es.js.map +1 -1
  29. package/dist/mobiledaterangepicker.es.js +44 -42
  30. package/dist/mobiledaterangepicker.es.js.map +1 -1
  31. package/dist/mobiletimepicker.es.js +7 -7
  32. package/dist/mobiletimepicker.es.js.map +1 -1
  33. package/package.json +1 -1
package/dist/components/date-picker/DesktopDatePicker.d.ts CHANGED
@@ -7,6 +7,7 @@ type DesktopDatePickerProps = PropsBase & Omit<PropsSingle, "mode"> & {
7
7
  selected?: Date;
8
8
  required?: boolean;
9
9
  closeOnSelect?: boolean;
10
+ disabled?: boolean;
10
11
  };
11
12
  declare const DesktopDatePicker: React.FC<DesktopDatePickerProps>;
12
13
  export { DesktopDatePicker, type DesktopDatePickerProps };
package/dist/components/date-picker/DesktopDatePicker.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DesktopDatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DesktopDatePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,SAAS,EAAE,WAAW,EAAmB,MAAM,kBAAkB,CAAC;AAO3E,KAAK,sBAAsB,GAAG,SAAS,GACrC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,GAAG;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEJ,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA6CvD,CAAC;AAEF,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,CAAC"}
1
+ {"version":3,"file":"DesktopDatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DesktopDatePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,SAAS,EAAE,WAAW,EAAmB,MAAM,kBAAkB,CAAC;AAO3E,KAAK,sBAAsB,GAAG,SAAS,GACrC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,GAAG;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEJ,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA+CvD,CAAC;AAEF,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,CAAC"}
package/dist/components/date-picker/DesktopDateRangePicker.d.ts CHANGED
@@ -8,6 +8,7 @@ type DesktopDateRangePickerProps = PropsBase & Omit<PropsRange, "mode"> & {
8
8
  required?: boolean;
9
9
  fromText?: string;
10
10
  toText?: string;
11
+ disabled?: boolean;
11
12
  };
12
13
  declare const DesktopDateRangePicker: React.FC<DesktopDateRangePickerProps>;
13
14
  export { DesktopDateRangePicker, type DesktopDateRangePickerProps };
package/dist/components/date-picker/DesktopDateRangePicker.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DesktopDateRangePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DesktopDateRangePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAQpE,KAAK,2BAA2B,GAAG,SAAS,GAC1C,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,GAAG;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEJ,QAAA,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CA6EjE,CAAC;AAEF,OAAO,EAAE,sBAAsB,EAAE,KAAK,2BAA2B,EAAE,CAAC"}
1
+ {"version":3,"file":"DesktopDateRangePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DesktopDateRangePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAQpE,KAAK,2BAA2B,GAAG,SAAS,GAC1C,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,GAAG;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEJ,QAAA,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CA+EjE,CAAC;AAEF,OAAO,EAAE,sBAAsB,EAAE,KAAK,2BAA2B,EAAE,CAAC"}
package/dist/components/date-picker/DesktopTimePicker.d.ts CHANGED
@@ -4,6 +4,7 @@ type DesktopTimePickerProps = HTMLAttributes<HTMLButtonElement> & {
4
4
  time: Time | undefined;
5
5
  onTimeChange: (time: Time | undefined) => void;
6
6
  placeholder?: string;
7
+ disabled?: boolean;
7
8
  slotsProps?: {
8
9
  content?: HTMLAttributes<HTMLDivElement>;
9
10
  };
package/dist/components/date-picker/DesktopTimePicker.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DesktopTimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DesktopTimePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAIjD,OAAO,EAAE,IAAI,EAAqB,MAAM,qBAAqB,CAAC;AAG9D,KAAK,sBAAsB,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IAChE,IAAI,EAAE,IAAI,GAAG,SAAS,CAAC;IACvB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE;QACX,OAAO,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;KAC1C,CAAC;CACH,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA2BvD,CAAC;AACF,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,CAAC"}
1
+ {"version":3,"file":"DesktopTimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DesktopTimePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAIjD,OAAO,EAAE,IAAI,EAAqB,MAAM,qBAAqB,CAAC;AAG9D,KAAK,sBAAsB,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IAChE,IAAI,EAAE,IAAI,GAAG,SAAS,CAAC;IACvB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE;QACX,OAAO,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;KAC1C,CAAC;CACH,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA2BvD,CAAC;AACF,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,CAAC"}
package/dist/components/date-picker/MobileDatePicker.d.ts CHANGED
@@ -9,6 +9,7 @@ type MobileDatePickerProps = PropsBase & Omit<PropsSingle, "mode"> & {
9
9
  cancelText?: string;
10
10
  applyText?: string;
11
11
  onSelect?: (date: Date | undefined) => void;
12
+ disabled?: boolean;
12
13
  };
13
14
  declare const MobileDatePicker: React.FC<MobileDatePickerProps>;
14
15
  export { MobileDatePicker, type MobileDatePickerProps };
package/dist/components/date-picker/MobileDatePicker.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MobileDatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/MobileDatePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAS1D,KAAK,qBAAqB,GAAG,SAAS,GACpC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,GAAG;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;CAC7C,CAAC;AAEJ,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAmErD,CAAC;AAEF,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,CAAC"}
1
+ {"version":3,"file":"MobileDatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/MobileDatePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAS1D,KAAK,qBAAqB,GAAG,SAAS,GACpC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,GAAG;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEJ,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAqErD,CAAC;AAEF,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,CAAC"}
package/dist/components/date-picker/MobileDateRangePicker.d.ts CHANGED
@@ -11,6 +11,7 @@ type MobileDateRangePickerProps = PropsBase & Omit<PropsRange, "mode"> & {
11
11
  onSelect?: (date: DateRange | undefined) => void;
12
12
  fromText?: string;
13
13
  toText?: string;
14
+ disabled?: boolean;
14
15
  };
15
16
  declare const MobileDateRangePicker: React.FC<MobileDateRangePickerProps>;
16
17
  export { MobileDateRangePicker, type MobileDateRangePickerProps };
package/dist/components/date-picker/MobileDateRangePicker.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MobileDateRangePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/MobileDateRangePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAmB,MAAM,kBAAkB,CAAC;AAOrF,KAAK,0BAA0B,GAAG,SAAS,GACzC,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,GAAG;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEJ,QAAA,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAkH/D,CAAC;AAEF,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,CAAC"}
1
+ {"version":3,"file":"MobileDateRangePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/MobileDateRangePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAmB,MAAM,kBAAkB,CAAC;AAOrF,KAAK,0BAA0B,GAAG,SAAS,GACzC,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,GAAG;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEJ,QAAA,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAoH/D,CAAC;AAEF,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,CAAC"}
package/dist/components/date-picker/MobileTimePicker.d.ts CHANGED
@@ -4,6 +4,7 @@ type MobileTimePickerProps = HTMLAttributes<HTMLButtonElement> & {
4
4
  time: Time | undefined;
5
5
  onTimeChange: (time: Time | undefined) => void;
6
6
  placeholder?: string;
7
+ disabled?: boolean;
7
8
  slotsProps?: {
8
9
  content?: HTMLAttributes<HTMLDivElement>;
9
10
  };
package/dist/components/date-picker/MobileTimePicker.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MobileTimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/MobileTimePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAKjD,OAAO,EAAE,IAAI,EAAqB,MAAM,qBAAqB,CAAC;AAS9D,KAAK,qBAAqB,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IAC/D,IAAI,EAAE,IAAI,GAAG,SAAS,CAAC;IACvB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE;QACX,OAAO,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;KAC1C,CAAC;CACH,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAgCrD,CAAC;AACF,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,CAAC"}
1
+ {"version":3,"file":"MobileTimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/MobileTimePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAKjD,OAAO,EAAE,IAAI,EAAqB,MAAM,qBAAqB,CAAC;AAS9D,KAAK,qBAAqB,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IAC/D,IAAI,EAAE,IAAI,GAAG,SAAS,CAAC;IACvB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE;QACX,OAAO,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;KAC1C,CAAC;CACH,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAgCrD,CAAC;AACF,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,CAAC"}
package/dist/components/form-date-picker/FormDatePicker.d.ts CHANGED
@@ -6,6 +6,7 @@ type FormDatePickerProps<TFieldValues extends FieldValues, TName extends FieldPa
6
6
  label: string;
7
7
  control: Control<TFieldValues>;
8
8
  required?: boolean;
9
+ disabled?: boolean;
9
10
  slotProps?: {
10
11
  formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;
11
12
  formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;
package/dist/components/form-date-picker/FormDatePicker.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FormDatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/form-date-picker/FormDatePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA0B,QAAQ,EAA0B,MAAM,cAAc,CAAC;AACxF,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACnF,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAE7E,KAAK,mBAAmB,CAAC,YAAY,SAAS,WAAW,EAAE,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,IAAI,IAAI,CACtG,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,EACpC,QAAQ,CACT,GACC,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,GAAG;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE;QACV,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAChG,gBAAgB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;QAC1G,gBAAgB,CAAC,EAAE,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;QAChH,eAAe,CAAC,EAAE,eAAe,CAAC;KACnC,CAAC;CACH,CAAC;AAEJ,QAAA,MAAM,cAAc,GAAI,YAAY,SAAS,WAAW,EAAE,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,SAAS,mBAAmB,CAAC,YAAY,EAAE,KAAK,CAAC,4CA2B/I,CAAC;AACF,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,CAAC"}
1
+ {"version":3,"file":"FormDatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/form-date-picker/FormDatePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA0B,QAAQ,EAA0B,MAAM,cAAc,CAAC;AACxF,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACnF,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAE7E,KAAK,mBAAmB,CAAC,YAAY,SAAS,WAAW,EAAE,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,IAAI,IAAI,CACtG,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,EACpC,QAAQ,CACT,GACC,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,GAAG;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE;QACV,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAChG,gBAAgB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;QAC1G,gBAAgB,CAAC,EAAE,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;QAChH,eAAe,CAAC,EAAE,eAAe,CAAC;KACnC,CAAC;CACH,CAAC;AAEJ,QAAA,MAAM,cAAc,GAAI,YAAY,SAAS,WAAW,EAAE,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,SAAS,mBAAmB,CAAC,YAAY,EAAE,KAAK,CAAC,4CA2B/I,CAAC;AACF,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,CAAC"}
package/dist/desktopdatepicker.es.js CHANGED
@@ -1,55 +1,57 @@
1
1
  import { jsxs as e, jsx as r } from "react/jsx-runtime";
2
- import * as h from "react";
3
- import { Calendar as C } from "@trsys-tech/matrix-icons";
4
- import { cn as k } from "./utils.es.js";
5
- import { Calendar as x } from "./calendar.es.js";
6
- import { Button as P } from "./button.es.js";
7
- import { Popover as v, PopoverTrigger as D, PopoverContent as M } from "./popover.es.js";
2
+ import * as C from "react";
3
+ import { Calendar as k } from "@trsys-tech/matrix-icons";
4
+ import { cn as x } from "./utils.es.js";
5
+ import { Calendar as P } from "./calendar.es.js";
6
+ import { Button as v } from "./button.es.js";
7
+ import { Popover as D, PopoverTrigger as b, PopoverContent as M } from "./popover.es.js";
8
8
  import { formatDate as n } from "./format.es.js";
9
- const I = ({
9
+ const L = ({
10
10
  formatStr: o,
11
11
  selected: a,
12
12
  placeholder: i,
13
13
  className: s,
14
14
  calendarClassName: m,
15
15
  closeOnSelect: p,
16
- onDayClick: l,
17
- ...d
16
+ onDayClick: d,
17
+ disabled: l,
18
+ ...c
18
19
  }) => {
19
- const [c, t] = h.useState(!1), f = (y, u, g) => {
20
- l?.(y, u, g), p && t(!1);
20
+ const [f, t] = C.useState(!1), y = (u, g, h) => {
21
+ d?.(u, g, h), p && t(!1);
21
22
  };
22
- return /* @__PURE__ */ e(v, { open: c, onOpenChange: t, children: [
23
- /* @__PURE__ */ r(D, { asChild: !0, children: /* @__PURE__ */ e(
24
- P,
23
+ return /* @__PURE__ */ e(D, { open: f, onOpenChange: t, children: [
24
+ /* @__PURE__ */ r(b, { asChild: !0, children: /* @__PURE__ */ e(
25
+ v,
25
26
  {
26
27
  variant: "outline",
27
- className: k(
28
- "w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start",
28
+ className: x(
29
+ "w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100",
29
30
  !a && "text-muted-foreground",
30
31
  s
31
32
  ),
32
33
  "aria-label": a ? `Selected date: ${n(a, o ?? "yyyy/MM/dd")}` : "Pick a date",
34
+ disabled: l,
33
35
  children: [
34
36
  a ? n(a, o ?? "yyyy/MM/dd") : /* @__PURE__ */ r("span", { children: i ?? "Pick a date" }),
35
- /* @__PURE__ */ r(C, { className: "mr-2 ms-auto" })
37
+ /* @__PURE__ */ r(k, { className: "mr-2 ms-auto" })
36
38
  ]
37
39
  }
38
40
  ) }),
39
41
  /* @__PURE__ */ r(M, { className: "w-auto p-0", children: /* @__PURE__ */ r(
40
- x,
42
+ P,
41
43
  {
42
- ...d,
44
+ ...c,
43
45
  mode: "single",
44
46
  selected: a,
45
47
  captionLayout: "dropdown-years",
46
48
  className: m,
47
- onDayClick: f
49
+ onDayClick: y
48
50
  }
49
51
  ) })
50
52
  ] });
51
53
  };
52
54
  export {
53
- I as DesktopDatePicker
55
+ L as DesktopDatePicker
54
56
  };
55
57
  //# sourceMappingURL=desktopdatepicker.es.js.map
package/dist/desktopdatepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"desktopdatepicker.es.js","sources":["../src/components/date-picker/DesktopDatePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\nimport { PropsBase, PropsSingle, DayEventHandler } from \"react-day-picker\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\r\n\r\ntype DesktopDatePickerProps = PropsBase &\r\n Omit<PropsSingle, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: Date;\r\n required?: boolean;\r\n closeOnSelect?: boolean;\r\n };\r\n\r\nconst DesktopDatePicker: React.FC<DesktopDatePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n closeOnSelect,\r\n onDayClick,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n\r\n const handleDayClick: DayEventHandler<React.MouseEvent<Element, MouseEvent>> = (date, modifiers, e) => {\r\n onDayClick?.(date, modifiers, e);\r\n if (closeOnSelect) setIsOpen(false);\r\n };\r\n\r\n return (\r\n <Popover open={isOpen} onOpenChange={setIsOpen}>\r\n <PopoverTrigger asChild>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n aria-label={selected ? `Selected date: ${format(selected, formatStr ?? \"yyyy/MM/dd\")}` : \"Pick a date\"}\r\n >\r\n {selected ? format(selected, formatStr ?? \"yyyy/MM/dd\") : <span>{placeholder ?? \"Pick a date\"}</span>}\r\n <CalendarIcon className=\"mr-2 ms-auto\" />\r\n </Button>\r\n </PopoverTrigger>\r\n <PopoverContent className=\"w-auto p-0\">\r\n <Calendar\r\n {...props}\r\n mode=\"single\"\r\n selected={selected}\r\n captionLayout=\"dropdown-years\"\r\n className={calendarClassName}\r\n onDayClick={handleDayClick}\r\n />\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n};\r\n\r\nexport { DesktopDatePicker, type DesktopDatePickerProps };\r\n"],"names":["DesktopDatePicker","formatStr","selected","placeholder","className","calendarClassName","closeOnSelect","onDayClick","props","isOpen","setIsOpen","React","handleDayClick","date","modifiers","e","jsxs","Popover","jsx","PopoverTrigger","Button","cn","format","CalendarIcon","PopoverContent","Calendar"],"mappings":";;;;;;;;AAsBA,MAAMA,IAAsD,CAAC;AAAA,EAC3D,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAE1CC,IAAyE,CAACC,GAAMC,GAAWC,MAAM;AACxF,IAAAR,IAAAM,GAAMC,GAAWC,CAAC,GAC3BT,OAAyB,EAAK;AAAA,EACpC;AAEA,SACG,gBAAAU,EAAAC,GAAA,EAAQ,MAAMR,GAAQ,cAAcC,GACnC,UAAA;AAAA,IAAC,gBAAAQ,EAAAC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAH;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWC;AAAA,UACT;AAAA,UACA,CAACnB,KAAY;AAAA,UACbE;AAAA,QACF;AAAA,QACA,cAAYF,IAAW,kBAAkBoB,EAAOpB,GAAUD,KAAa,YAAY,CAAC,KAAK;AAAA,QAExF,UAAA;AAAA,UAAWC,IAAAoB,EAAOpB,GAAUD,KAAa,YAAY,IAAK,gBAAAiB,EAAA,QAAA,EAAM,eAAe,cAAc,CAAA;AAAA,UAC9F,gBAAAA,EAACK,GAAa,EAAA,WAAU,eAAe,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAE3C;AAAA,IACA,gBAAAL,EAACM,GAAe,EAAA,WAAU,cACxB,UAAA,gBAAAN;AAAA,MAACO;AAAAA,MAAA;AAAA,QACE,GAAGjB;AAAA,QACJ,MAAK;AAAA,QACL,UAAAN;AAAA,QACA,eAAc;AAAA,QACd,WAAWG;AAAA,QACX,YAAYO;AAAA,MAAA;AAAA,IAAA,EAEhB,CAAA;AAAA,EAAA,GACF;AAEJ;"}
1
+ {"version":3,"file":"desktopdatepicker.es.js","sources":["../src/components/date-picker/DesktopDatePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\nimport { PropsBase, PropsSingle, DayEventHandler } from \"react-day-picker\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\r\n\r\ntype DesktopDatePickerProps = PropsBase &\r\n Omit<PropsSingle, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: Date;\r\n required?: boolean;\r\n closeOnSelect?: boolean;\r\n disabled?: boolean;\r\n };\r\n\r\nconst DesktopDatePicker: React.FC<DesktopDatePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n closeOnSelect,\r\n onDayClick,\r\n disabled,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n\r\n const handleDayClick: DayEventHandler<React.MouseEvent<Element, MouseEvent>> = (date, modifiers, e) => {\r\n onDayClick?.(date, modifiers, e);\r\n if (closeOnSelect) setIsOpen(false);\r\n };\r\n\r\n return (\r\n <Popover open={isOpen} onOpenChange={setIsOpen}>\r\n <PopoverTrigger asChild>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n aria-label={selected ? `Selected date: ${format(selected, formatStr ?? \"yyyy/MM/dd\")}` : \"Pick a date\"}\r\n disabled={disabled}\r\n >\r\n {selected ? format(selected, formatStr ?? \"yyyy/MM/dd\") : <span>{placeholder ?? \"Pick a date\"}</span>}\r\n <CalendarIcon className=\"mr-2 ms-auto\" />\r\n </Button>\r\n </PopoverTrigger>\r\n <PopoverContent className=\"w-auto p-0\">\r\n <Calendar\r\n {...props}\r\n mode=\"single\"\r\n selected={selected}\r\n captionLayout=\"dropdown-years\"\r\n className={calendarClassName}\r\n onDayClick={handleDayClick}\r\n />\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n};\r\n\r\nexport { DesktopDatePicker, type DesktopDatePickerProps };\r\n"],"names":["DesktopDatePicker","formatStr","selected","placeholder","className","calendarClassName","closeOnSelect","onDayClick","disabled","props","isOpen","setIsOpen","React","handleDayClick","date","modifiers","e","jsxs","Popover","jsx","PopoverTrigger","Button","cn","format","CalendarIcon","PopoverContent","Calendar"],"mappings":";;;;;;;;AAuBA,MAAMA,IAAsD,CAAC;AAAA,EAC3D,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAE1CC,IAAyE,CAACC,GAAMC,GAAWC,MAAM;AACxF,IAAAT,IAAAO,GAAMC,GAAWC,CAAC,GAC3BV,OAAyB,EAAK;AAAA,EACpC;AAEA,SACG,gBAAAW,EAAAC,GAAA,EAAQ,MAAMR,GAAQ,cAAcC,GACnC,UAAA;AAAA,IAAC,gBAAAQ,EAAAC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAH;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWC;AAAA,UACT;AAAA,UACA,CAACpB,KAAY;AAAA,UACbE;AAAA,QACF;AAAA,QACA,cAAYF,IAAW,kBAAkBqB,EAAOrB,GAAUD,KAAa,YAAY,CAAC,KAAK;AAAA,QACzF,UAAAO;AAAA,QAEC,UAAA;AAAA,UAAWN,IAAAqB,EAAOrB,GAAUD,KAAa,YAAY,IAAK,gBAAAkB,EAAA,QAAA,EAAM,eAAe,cAAc,CAAA;AAAA,UAC9F,gBAAAA,EAACK,GAAa,EAAA,WAAU,eAAe,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAE3C;AAAA,IACA,gBAAAL,EAACM,GAAe,EAAA,WAAU,cACxB,UAAA,gBAAAN;AAAA,MAACO;AAAAA,MAAA;AAAA,QACE,GAAGjB;AAAA,QACJ,MAAK;AAAA,QACL,UAAAP;AAAA,QACA,eAAc;AAAA,QACd,WAAWG;AAAA,QACX,YAAYQ;AAAA,MAAA;AAAA,IAAA,EAEhB,CAAA;AAAA,EAAA,GACF;AAEJ;"}
package/dist/desktopdaterangepicker.es.js CHANGED
@@ -1,64 +1,66 @@
1
1
  import { jsxs as a, jsx as o } from "react/jsx-runtime";
2
- import * as g from "react";
3
- import { Calendar as c } from "@trsys-tech/matrix-icons";
4
- import { cn as i } from "./utils.es.js";
5
- import { Calendar as h } from "./calendar.es.js";
6
- import { Button as M } from "./button.es.js";
7
- import { Popover as x, PopoverTrigger as v, PopoverContent as C } from "./popover.es.js";
2
+ import * as c from "react";
3
+ import { Calendar as h } from "@trsys-tech/matrix-icons";
4
+ import { cn as m } from "./utils.es.js";
5
+ import { Calendar as M } from "./calendar.es.js";
6
+ import { Button as x } from "./button.es.js";
7
+ import { Popover as v, PopoverTrigger as C, PopoverContent as b } from "./popover.es.js";
8
8
  import { formatDate as t } from "./format.es.js";
9
- const D = ({
9
+ const R = ({
10
10
  formatStr: n,
11
11
  selected: r,
12
- placeholder: m,
12
+ placeholder: i,
13
13
  className: s,
14
14
  calendarClassName: e,
15
- fromText: p,
16
- toText: f,
17
- ...d
15
+ fromText: d,
16
+ toText: p,
17
+ disabled: f,
18
+ ...y
18
19
  }) => {
19
- const [y, l] = g.useState(!1);
20
+ const [l, g] = c.useState(!1);
20
21
  return /* @__PURE__ */ a(
21
- x,
22
+ v,
22
23
  {
23
- open: y,
24
+ open: l,
24
25
  onOpenChange: (u) => {
25
- l(u);
26
+ g(u);
26
27
  },
27
28
  children: [
28
- /* @__PURE__ */ o(v, { asChild: !0, children: /* @__PURE__ */ a(
29
- M,
29
+ /* @__PURE__ */ o(C, { asChild: !0, children: /* @__PURE__ */ a(
30
+ x,
30
31
  {
31
32
  variant: "outline",
32
- className: i(
33
- "w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start",
33
+ className: m(
34
+ "w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100",
34
35
  !r && "text-muted-foreground",
35
36
  s
36
37
  ),
37
- "aria-label": r ? `Selected date: ${r?.from ? t(r.from, n ?? "yyyy/MM/dd") : ""} - ${r?.to ? t(r.to, n ?? "yyyy/MM/dd") : ""}` : m,
38
+ "aria-label": r ? `Selected date: ${r?.from ? t(r.from, n ?? "yyyy/MM/dd") : ""} - ${r?.to ? t(r.to, n ?? "yyyy/MM/dd") : ""}` : i,
39
+ disabled: f,
38
40
  children: [
39
41
  r ? /* @__PURE__ */ a("div", { className: "grid grid-cols-2 flex-1 justify-items-start", children: [
40
42
  /* @__PURE__ */ a("span", { children: [
41
- p ?? "From",
43
+ d ?? "From",
42
44
  ": ",
43
45
  r?.from ? t(r.from, n ?? "yyyy/MM/dd") : "-"
44
46
  ] }),
45
47
  " ",
46
48
  /* @__PURE__ */ a("span", { children: [
47
- f ?? "To",
49
+ p ?? "To",
48
50
  ": ",
49
51
  r?.to ? t(r.to, n ?? "yyyy/MM/dd") : "-"
50
52
  ] })
51
- ] }) : /* @__PURE__ */ o("span", { children: m ?? "Pick a Range" }),
52
- /* @__PURE__ */ o(c, { className: "mr-2 h-5 w-4 ms-auto" })
53
+ ] }) : /* @__PURE__ */ o("span", { children: i ?? "Pick a Range" }),
54
+ /* @__PURE__ */ o(h, { className: "mr-2 h-5 w-4 ms-auto" })
53
55
  ]
54
56
  }
55
57
  ) }),
56
- /* @__PURE__ */ o(C, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ o(h, { ...d, mode: "range", selected: r, className: i(e, "md:max-w-full md:w-[36rem]"), numberOfMonths: 2 }) })
58
+ /* @__PURE__ */ o(b, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ o(M, { ...y, mode: "range", selected: r, className: m(e, "md:max-w-full md:w-[36rem]"), numberOfMonths: 2 }) })
57
59
  ]
58
60
  }
59
61
  );
60
62
  };
61
63
  export {
62
- D as DesktopDateRangePicker
64
+ R as DesktopDateRangePicker
63
65
  };
64
66
  //# sourceMappingURL=desktopdaterangepicker.es.js.map
package/dist/desktopdaterangepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"desktopdaterangepicker.es.js","sources":["../src/components/date-picker/DesktopDateRangePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { PropsBase, PropsRange, DateRange } from \"react-day-picker\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\r\n\r\ntype DesktopDateRangePickerProps = PropsBase &\r\n Omit<PropsRange, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: DateRange;\r\n required?: boolean;\r\n fromText?: string;\r\n toText?: string;\r\n };\r\n\r\nconst DesktopDateRangePicker: React.FC<DesktopDateRangePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n fromText,\r\n toText,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n\r\n return (\r\n <Popover\r\n open={isOpen}\r\n onOpenChange={open => {\r\n setIsOpen(open);\r\n }}\r\n >\r\n <PopoverTrigger asChild>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n aria-label={\r\n selected\r\n ? `Selected date: ${selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"\"} - ${selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"\"}`\r\n : placeholder\r\n }\r\n >\r\n {selected ? (\r\n <div className=\"grid grid-cols-2 flex-1 justify-items-start\">\r\n <span>\r\n {fromText ?? \"From\"}: {selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>{\" \"}\r\n <span>\r\n {toText ?? \"To\"}: {selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>\r\n </div>\r\n ) : (\r\n <span>{placeholder ?? \"Pick a Range\"}</span>\r\n )}\r\n <CalendarIcon className=\"mr-2 h-5 w-4 ms-auto\" />\r\n </Button>\r\n {/* <div className=\"flex gap-2\">\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n >\r\n {selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : <span>{placeholder ?? \"From\"}</span>}\r\n <CalendarIcon className=\"mr-2 h-5 w-5 ms-auto\" />\r\n </Button>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n >\r\n {selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : <span>{placeholder ?? \"To\"}</span>}\r\n <CalendarIcon className=\"mr-2 h-5 w-5 ms-auto\" />\r\n </Button>\r\n </div> */}\r\n </PopoverTrigger>\r\n <PopoverContent className=\"w-auto p-0\" align=\"start\">\r\n <Calendar {...props} mode=\"range\" selected={selected} className={cn(calendarClassName, \"md:max-w-full md:w-[36rem]\")} numberOfMonths={2} />\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n};\r\n\r\nexport { DesktopDateRangePicker, type DesktopDateRangePickerProps };\r\n"],"names":["DesktopDateRangePicker","formatStr","selected","placeholder","className","calendarClassName","fromText","toText","props","isOpen","setIsOpen","React","jsxs","Popover","open","jsx","PopoverTrigger","Button","cn","format","CalendarIcon","PopoverContent","Calendar"],"mappings":";;;;;;;;AAuBA,MAAMA,IAAgE,CAAC;AAAA,EACrE,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK;AAG9C,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAMJ;AAAA,MACN,cAAc,CAAQK,MAAA;AACpB,QAAAJ,EAAUI,CAAI;AAAA,MAChB;AAAA,MAEA,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAJ;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT,WAAWC;AAAA,cACT;AAAA,cACA,CAAChB,KAAY;AAAA,cACbE;AAAA,YACF;AAAA,YACA,cACEF,IACI,kBAAkBA,GAAU,OAAOiB,EAAOjB,EAAS,MAAMD,KAAa,YAAY,IAAI,EAAE,MAAMC,GAAU,KAAKiB,EAAOjB,EAAS,IAAID,KAAa,YAAY,IAAI,EAAE,KAChKE;AAAA,YAGL,UAAA;AAAA,cACCD,IAAA,gBAAAU,EAAC,OAAI,EAAA,WAAU,+CACb,UAAA;AAAA,gBAAA,gBAAAA,EAAC,QACE,EAAA,UAAA;AAAA,kBAAYN,KAAA;AAAA,kBAAO;AAAA,kBAAGJ,GAAU,OAAOiB,EAAOjB,EAAS,MAAMD,KAAa,YAAY,IAAI;AAAA,gBAAA,GAC7F;AAAA,gBAAQ;AAAA,kCACP,QACE,EAAA,UAAA;AAAA,kBAAUM,KAAA;AAAA,kBAAK;AAAA,kBAAGL,GAAU,KAAKiB,EAAOjB,EAAS,IAAID,KAAa,YAAY,IAAI;AAAA,gBAAA,EACrF,CAAA;AAAA,cAAA,EACF,CAAA,IAEA,gBAAAc,EAAC,QAAM,EAAA,UAAAZ,KAAe,gBAAe;AAAA,cAEvC,gBAAAY,EAACK,GAAa,EAAA,WAAU,uBAAuB,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA,GA0BnD;AAAA,QACA,gBAAAL,EAACM,KAAe,WAAU,cAAa,OAAM,SAC3C,UAAA,gBAAAN,EAACO,KAAU,GAAGd,GAAO,MAAK,SAAQ,UAAAN,GAAoB,WAAWgB,EAAGb,GAAmB,4BAA4B,GAAG,gBAAgB,GAAG,EAC3I,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}
1
+ {"version":3,"file":"desktopdaterangepicker.es.js","sources":["../src/components/date-picker/DesktopDateRangePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { PropsBase, PropsRange, DateRange } from \"react-day-picker\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\r\n\r\ntype DesktopDateRangePickerProps = PropsBase &\r\n Omit<PropsRange, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: DateRange;\r\n required?: boolean;\r\n fromText?: string;\r\n toText?: string;\r\n disabled?: boolean;\r\n };\r\n\r\nconst DesktopDateRangePicker: React.FC<DesktopDateRangePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n fromText,\r\n toText,\r\n disabled,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n\r\n return (\r\n <Popover\r\n open={isOpen}\r\n onOpenChange={open => {\r\n setIsOpen(open);\r\n }}\r\n >\r\n <PopoverTrigger asChild>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n aria-label={\r\n selected\r\n ? `Selected date: ${selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"\"} - ${selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"\"}`\r\n : placeholder\r\n }\r\n disabled={disabled}\r\n >\r\n {selected ? (\r\n <div className=\"grid grid-cols-2 flex-1 justify-items-start\">\r\n <span>\r\n {fromText ?? \"From\"}: {selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>{\" \"}\r\n <span>\r\n {toText ?? \"To\"}: {selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>\r\n </div>\r\n ) : (\r\n <span>{placeholder ?? \"Pick a Range\"}</span>\r\n )}\r\n <CalendarIcon className=\"mr-2 h-5 w-4 ms-auto\" />\r\n </Button>\r\n {/* <div className=\"flex gap-2\">\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n >\r\n {selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : <span>{placeholder ?? \"From\"}</span>}\r\n <CalendarIcon className=\"mr-2 h-5 w-5 ms-auto\" />\r\n </Button>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n >\r\n {selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : <span>{placeholder ?? \"To\"}</span>}\r\n <CalendarIcon className=\"mr-2 h-5 w-5 ms-auto\" />\r\n </Button>\r\n </div> */}\r\n </PopoverTrigger>\r\n <PopoverContent className=\"w-auto p-0\" align=\"start\">\r\n <Calendar {...props} mode=\"range\" selected={selected} className={cn(calendarClassName, \"md:max-w-full md:w-[36rem]\")} numberOfMonths={2} />\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n};\r\n\r\nexport { DesktopDateRangePicker, type DesktopDateRangePickerProps };\r\n"],"names":["DesktopDateRangePicker","formatStr","selected","placeholder","className","calendarClassName","fromText","toText","disabled","props","isOpen","setIsOpen","React","jsxs","Popover","open","jsx","PopoverTrigger","Button","cn","format","CalendarIcon","PopoverContent","Calendar"],"mappings":";;;;;;;;AAwBA,MAAMA,IAAgE,CAAC;AAAA,EACrE,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK;AAG9C,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAMJ;AAAA,MACN,cAAc,CAAQK,MAAA;AACpB,QAAAJ,EAAUI,CAAI;AAAA,MAChB;AAAA,MAEA,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAJ;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT,WAAWC;AAAA,cACT;AAAA,cACA,CAACjB,KAAY;AAAA,cACbE;AAAA,YACF;AAAA,YACA,cACEF,IACI,kBAAkBA,GAAU,OAAOkB,EAAOlB,EAAS,MAAMD,KAAa,YAAY,IAAI,EAAE,MAAMC,GAAU,KAAKkB,EAAOlB,EAAS,IAAID,KAAa,YAAY,IAAI,EAAE,KAChKE;AAAA,YAEN,UAAAK;AAAA,YAEC,UAAA;AAAA,cACCN,IAAA,gBAAAW,EAAC,OAAI,EAAA,WAAU,+CACb,UAAA;AAAA,gBAAA,gBAAAA,EAAC,QACE,EAAA,UAAA;AAAA,kBAAYP,KAAA;AAAA,kBAAO;AAAA,kBAAGJ,GAAU,OAAOkB,EAAOlB,EAAS,MAAMD,KAAa,YAAY,IAAI;AAAA,gBAAA,GAC7F;AAAA,gBAAQ;AAAA,kCACP,QACE,EAAA,UAAA;AAAA,kBAAUM,KAAA;AAAA,kBAAK;AAAA,kBAAGL,GAAU,KAAKkB,EAAOlB,EAAS,IAAID,KAAa,YAAY,IAAI;AAAA,gBAAA,EACrF,CAAA;AAAA,cAAA,EACF,CAAA,IAEA,gBAAAe,EAAC,QAAM,EAAA,UAAAb,KAAe,gBAAe;AAAA,cAEvC,gBAAAa,EAACK,GAAa,EAAA,WAAU,uBAAuB,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA,GA0BnD;AAAA,QACA,gBAAAL,EAACM,KAAe,WAAU,cAAa,OAAM,SAC3C,UAAA,gBAAAN,EAACO,KAAU,GAAGd,GAAO,MAAK,SAAQ,UAAAP,GAAoB,WAAWiB,EAAGd,GAAmB,4BAA4B,GAAG,gBAAgB,GAAG,EAC3I,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}
package/dist/desktoptimepicker.es.js CHANGED
@@ -1,10 +1,10 @@
1
1
  import { jsxs as s, jsx as t } from "react/jsx-runtime";
2
- import { useState as u } from "react";
2
+ import { useState as l } from "react";
3
3
  import { cn as n } from "./utils.es.js";
4
- import { Button as l } from "./button.es.js";
5
- import { TimePickerContent as f } from "./timepickercontent.es.js";
6
- import { Popover as d, PopoverTrigger as h, PopoverContent as g } from "./popover.es.js";
7
- const P = ({
4
+ import { Button as u } from "./button.es.js";
5
+ import { TimePickerContent as d } from "./timepickercontent.es.js";
6
+ import { Popover as f, PopoverTrigger as g, PopoverContent as h } from "./popover.es.js";
7
+ const C = ({
8
8
  time: r,
9
9
  onTimeChange: a,
10
10
  className: i,
@@ -12,22 +12,22 @@ const P = ({
12
12
  placeholder: p = "Pick a Time",
13
13
  ...c
14
14
  }) => {
15
- const [o, m] = u(!1);
16
- return /* @__PURE__ */ s(d, { open: o, onOpenChange: m, children: [
17
- /* @__PURE__ */ t(h, { asChild: !0, children: /* @__PURE__ */ t(
18
- l,
15
+ const [o, m] = l(!1);
16
+ return /* @__PURE__ */ s(f, { open: o, onOpenChange: m, children: [
17
+ /* @__PURE__ */ t(g, { asChild: !0, children: /* @__PURE__ */ t(
18
+ u,
19
19
  {
20
20
  variant: "outline",
21
- className: n("w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start", i),
21
+ className: n("w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100", i),
22
22
  "aria-label": r?.hour ? `Selected time: ${r.hour}:${r.minute} ${r.ampm}` : p,
23
23
  ...c,
24
24
  children: `${r?.hour?.toString()?.padStart(2, "0") ?? "--"} : ${r?.minute?.toString()?.padStart(2, "0") ?? "--"} ${r?.ampm ?? "--"}`
25
25
  }
26
26
  ) }),
27
- /* @__PURE__ */ t(g, { ...e?.content ?? {}, className: n("w-auto p-0", e?.content?.className), children: /* @__PURE__ */ t(f, { isOpen: o, onTimeChange: a, time: r, slotsProps: e }) })
27
+ /* @__PURE__ */ t(h, { ...e?.content ?? {}, className: n("w-auto p-0", e?.content?.className), children: /* @__PURE__ */ t(d, { isOpen: o, onTimeChange: a, time: r, slotsProps: e }) })
28
28
  ] });
29
29
  };
30
30
  export {
31
- P as DesktopTimePicker
31
+ C as DesktopTimePicker
32
32
  };
33
33
  //# sourceMappingURL=desktoptimepicker.es.js.map
package/dist/desktoptimepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"desktoptimepicker.es.js","sources":["../src/components/date-picker/DesktopTimePicker.tsx"],"sourcesContent":["import { HTMLAttributes, useState } from \"react\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Time, TimePickerContent } from \"./TimePickerContent\";\r\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\r\n\r\ntype DesktopTimePickerProps = HTMLAttributes<HTMLButtonElement> & {\r\n time: Time | undefined;\r\n onTimeChange: (time: Time | undefined) => void;\r\n placeholder?: string;\r\n slotsProps?: {\r\n content?: HTMLAttributes<HTMLDivElement>;\r\n };\r\n};\r\n\r\nconst DesktopTimePicker: React.FC<DesktopTimePickerProps> = ({\r\n time,\r\n onTimeChange,\r\n className,\r\n slotsProps,\r\n placeholder = \"Pick a Time\",\r\n ...restProps\r\n}) => {\r\n const [isOpen, setIsOpen] = useState(false);\r\n\r\n return (\r\n <Popover open={isOpen} onOpenChange={setIsOpen}>\r\n <PopoverTrigger asChild>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\", className)}\r\n aria-label={time?.hour ? `Selected time: ${time.hour}:${time.minute} ${time.ampm}` : placeholder}\r\n {...restProps}\r\n >\r\n {`${time?.hour?.toString()?.padStart(2, \"0\") ?? \"--\"} : ${time?.minute?.toString()?.padStart(2, \"0\") ?? \"--\"} ${time?.ampm ?? \"--\"}`}\r\n </Button>\r\n </PopoverTrigger>\r\n <PopoverContent {...(slotsProps?.content ?? {})} className={cn(\"w-auto p-0\", slotsProps?.content?.className)}>\r\n <TimePickerContent isOpen={isOpen} onTimeChange={onTimeChange} time={time} slotsProps={slotsProps} />\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n};\r\nexport { DesktopTimePicker, type DesktopTimePickerProps };\r\n"],"names":["DesktopTimePicker","time","onTimeChange","className","slotsProps","placeholder","restProps","isOpen","setIsOpen","useState","jsxs","Popover","jsx","PopoverTrigger","Button","cn","PopoverContent","TimePickerContent"],"mappings":";;;;;;AAgBA,MAAMA,IAAsD,CAAC;AAAA,EAC3D,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK;AAE1C,SACG,gBAAAC,EAAAC,GAAA,EAAQ,MAAMJ,GAAQ,cAAcC,GACnC,UAAA;AAAA,IAAC,gBAAAI,EAAAC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWC,EAAG,uFAAuFZ,CAAS;AAAA,QAC9G,cAAYF,GAAM,OAAO,kBAAkBA,EAAK,IAAI,IAAIA,EAAK,MAAM,IAAIA,EAAK,IAAI,KAAKI;AAAA,QACpF,GAAGC;AAAA,QAEH,UAAA,GAAGL,GAAM,MAAM,SAAA,GAAY,SAAS,GAAG,GAAG,KAAK,IAAI,MAAMA,GAAM,QAAQ,SAAA,GAAY,SAAS,GAAG,GAAG,KAAK,IAAI,IAAIA,GAAM,QAAQ,IAAI;AAAA,MAAA;AAAA,IAAA,GAEtI;AAAA,IACA,gBAAAW,EAACI,KAAgB,GAAIZ,GAAY,WAAW,CAAA,GAAK,WAAWW,EAAG,cAAcX,GAAY,SAAS,SAAS,GACzG,UAAC,gBAAAQ,EAAAK,GAAA,EAAkB,QAAAV,GAAgB,cAAAL,GAA4B,MAAAD,GAAY,YAAAG,GAAwB,EACrG,CAAA;AAAA,EAAA,GACF;AAEJ;"}
1
+ {"version":3,"file":"desktoptimepicker.es.js","sources":["../src/components/date-picker/DesktopTimePicker.tsx"],"sourcesContent":["import { HTMLAttributes, useState } from \"react\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Time, TimePickerContent } from \"./TimePickerContent\";\r\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\r\n\r\ntype DesktopTimePickerProps = HTMLAttributes<HTMLButtonElement> & {\r\n time: Time | undefined;\r\n onTimeChange: (time: Time | undefined) => void;\r\n placeholder?: string;\r\n disabled?: boolean;\r\n slotsProps?: {\r\n content?: HTMLAttributes<HTMLDivElement>;\r\n };\r\n};\r\n\r\nconst DesktopTimePicker: React.FC<DesktopTimePickerProps> = ({\r\n time,\r\n onTimeChange,\r\n className,\r\n slotsProps,\r\n placeholder = \"Pick a Time\",\r\n ...restProps\r\n}) => {\r\n const [isOpen, setIsOpen] = useState(false);\r\n\r\n return (\r\n <Popover open={isOpen} onOpenChange={setIsOpen}>\r\n <PopoverTrigger asChild>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100\", className)}\r\n aria-label={time?.hour ? `Selected time: ${time.hour}:${time.minute} ${time.ampm}` : placeholder}\r\n {...restProps}\r\n >\r\n {`${time?.hour?.toString()?.padStart(2, \"0\") ?? \"--\"} : ${time?.minute?.toString()?.padStart(2, \"0\") ?? \"--\"} ${time?.ampm ?? \"--\"}`}\r\n </Button>\r\n </PopoverTrigger>\r\n <PopoverContent {...(slotsProps?.content ?? {})} className={cn(\"w-auto p-0\", slotsProps?.content?.className)}>\r\n <TimePickerContent isOpen={isOpen} onTimeChange={onTimeChange} time={time} slotsProps={slotsProps} />\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n};\r\nexport { DesktopTimePicker, type DesktopTimePickerProps };\r\n"],"names":["DesktopTimePicker","time","onTimeChange","className","slotsProps","placeholder","restProps","isOpen","setIsOpen","useState","jsxs","Popover","jsx","PopoverTrigger","Button","cn","PopoverContent","TimePickerContent"],"mappings":";;;;;;AAiBA,MAAMA,IAAsD,CAAC;AAAA,EAC3D,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK;AAE1C,SACG,gBAAAC,EAAAC,GAAA,EAAQ,MAAMJ,GAAQ,cAAcC,GACnC,UAAA;AAAA,IAAC,gBAAAI,EAAAC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWC,EAAG,4GAA4GZ,CAAS;AAAA,QACnI,cAAYF,GAAM,OAAO,kBAAkBA,EAAK,IAAI,IAAIA,EAAK,MAAM,IAAIA,EAAK,IAAI,KAAKI;AAAA,QACpF,GAAGC;AAAA,QAEH,UAAA,GAAGL,GAAM,MAAM,SAAA,GAAY,SAAS,GAAG,GAAG,KAAK,IAAI,MAAMA,GAAM,QAAQ,SAAA,GAAY,SAAS,GAAG,GAAG,KAAK,IAAI,IAAIA,GAAM,QAAQ,IAAI;AAAA,MAAA;AAAA,IAAA,GAEtI;AAAA,IACA,gBAAAW,EAACI,KAAgB,GAAIZ,GAAY,WAAW,CAAA,GAAK,WAAWW,EAAG,cAAcX,GAAY,SAAS,SAAS,GACzG,UAAC,gBAAAQ,EAAAK,GAAA,EAAkB,QAAAV,GAAgB,cAAAL,GAA4B,MAAAD,GAAY,YAAAG,GAAwB,EACrG,CAAA;AAAA,EAAA,GACF;AAEJ;"}
package/dist/formdatepicker.es.js CHANGED
@@ -1,23 +1,23 @@
1
- import { jsx as r, jsxs as s } from "react/jsx-runtime";
1
+ import { jsx as r, jsxs as t } from "react/jsx-runtime";
2
2
  import { FormField as P, FormItem as f, FormLabel as F, FormControl as h, FormMessage as g } from "./form.es.js";
3
3
  import { DatePicker as x } from "./datepicker.es.js";
4
- const j = (t) => {
5
- const { name: l, control: m, defaultValue: n, disabled: a, rules: c, shouldUnregister: d, label: i, slotProps: e, required: p, ...u } = t;
4
+ const j = (l) => {
5
+ const { name: m, control: n, defaultValue: a, disabled: o, rules: c, shouldUnregister: d, label: i, slotProps: e, required: p, ...u } = l;
6
6
  return /* @__PURE__ */ r(
7
7
  P,
8
8
  {
9
- control: m,
10
- name: l,
11
- defaultValue: n,
12
- disabled: a,
9
+ control: n,
10
+ name: m,
11
+ defaultValue: a,
12
+ disabled: o,
13
13
  rules: c,
14
14
  shouldUnregister: d,
15
- render: ({ field: o }) => /* @__PURE__ */ s(f, { ...u, children: [
16
- /* @__PURE__ */ s(F, { ...e?.formLabelProps ?? {}, children: [
15
+ render: ({ field: s }) => /* @__PURE__ */ t(f, { ...u, children: [
16
+ /* @__PURE__ */ t(F, { ...e?.formLabelProps ?? {}, children: [
17
17
  i,
18
18
  p && /* @__PURE__ */ r("span", { className: "text-danger text-sm", children: "*" })
19
19
  ] }),
20
- /* @__PURE__ */ r(h, { ...e?.formControlProps ?? {}, children: /* @__PURE__ */ r(x, { ...e?.datepickerProps ?? {}, selected: o.value, onSelect: o.onChange }) }),
20
+ /* @__PURE__ */ r(h, { ...e?.formControlProps ?? {}, children: /* @__PURE__ */ r(x, { ...e?.datepickerProps ?? {}, selected: s.value, onSelect: s.onChange, disabled: o }) }),
21
21
  /* @__PURE__ */ r(g, { ...e?.formMessageProps ?? {} })
22
22
  ] })
23
23
  }
package/dist/formdatepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"formdatepicker.es.js","sources":["../src/components/form-date-picker/FormDatePicker.tsx"],"sourcesContent":["import { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { DatePicker, type DatePickerProps } from \"../date-picker/DatePicker\";\r\n\r\ntype FormDatePickerProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n datepickerProps?: DatePickerProps;\r\n };\r\n };\r\n\r\nconst FormDatePicker = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormDatePickerProps<TFieldValues, TName>) => {\r\n const { name, control, defaultValue, disabled, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <DatePicker {...(slotProps?.datepickerProps ?? {})} selected={field.value} onSelect={field.onChange} />\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormDatePicker, type FormDatePickerProps };\r\n"],"names":["FormDatePicker","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","DatePicker","FormMessage"],"mappings":";;;AAqBM,MAAAA,IAAiB,CAA0EC,MAAoD;AACnJ,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,UAAAC,GAAU,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAkB,IAAAV;AAGvH,SAAA,gBAAAW;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAV;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAO,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,uBAAsB,UAAC,IAAA,CAAA;AAAA,QAAA,GACtD;AAAA,QACA,gBAAAA,EAACM,KAAa,GAAIT,GAAW,oBAAoB,CAAA,GAC/C,4BAACU,GAAY,EAAA,GAAIV,GAAW,mBAAmB,CAAA,GAAK,UAAUK,EAAM,OAAO,UAAUA,EAAM,SAAU,CAAA,GACvG;AAAA,0BACCM,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
1
+ {"version":3,"file":"formdatepicker.es.js","sources":["../src/components/form-date-picker/FormDatePicker.tsx"],"sourcesContent":["import { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { DatePicker, type DatePickerProps } from \"../date-picker/DatePicker\";\r\n\r\ntype FormDatePickerProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n disabled?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n datepickerProps?: DatePickerProps;\r\n };\r\n };\r\n\r\nconst FormDatePicker = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormDatePickerProps<TFieldValues, TName>) => {\r\n const { name, control, defaultValue, disabled, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <DatePicker {...(slotProps?.datepickerProps ?? {})} selected={field.value} onSelect={field.onChange} disabled={disabled} />\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormDatePicker, type FormDatePickerProps };\r\n"],"names":["FormDatePicker","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","DatePicker","FormMessage"],"mappings":";;;AAsBM,MAAAA,IAAiB,CAA0EC,MAAoD;AACnJ,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,UAAAC,GAAU,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAkB,IAAAV;AAGvH,SAAA,gBAAAW;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAV;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAO,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,uBAAsB,UAAC,IAAA,CAAA;AAAA,QAAA,GACtD;AAAA,QACA,gBAAAA,EAACM,KAAa,GAAIT,GAAW,oBAAoB,CAAC,GAChD,4BAACU,GAAY,EAAA,GAAIV,GAAW,mBAAmB,IAAK,UAAUK,EAAM,OAAO,UAAUA,EAAM,UAAU,UAAAT,EAAoB,CAAA,GAC3H;AAAA,0BACCe,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
package/dist/formdaterangepicker.es.js CHANGED
@@ -1,23 +1,23 @@
1
- import { jsx as e, jsxs as s } from "react/jsx-runtime";
1
+ import { jsx as e, jsxs as t } from "react/jsx-runtime";
2
2
  import { FormField as P, FormItem as f, FormLabel as g, FormControl as F, FormMessage as h } from "./form.es.js";
3
3
  import { DateRangePicker as x } from "./daterangepicker.es.js";
4
- const j = (t) => {
5
- const { name: l, control: m, defaultValue: n, disabled: a, rules: c, shouldUnregister: d, label: i, slotProps: r, required: p, ...u } = t;
4
+ const j = (l) => {
5
+ const { name: m, control: n, defaultValue: a, disabled: o, rules: c, shouldUnregister: d, label: i, slotProps: r, required: p, ...u } = l;
6
6
  return /* @__PURE__ */ e(
7
7
  P,
8
8
  {
9
- control: m,
10
- name: l,
11
- defaultValue: n,
12
- disabled: a,
9
+ control: n,
10
+ name: m,
11
+ defaultValue: a,
12
+ disabled: o,
13
13
  rules: c,
14
14
  shouldUnregister: d,
15
- render: ({ field: o }) => /* @__PURE__ */ s(f, { ...u, children: [
16
- /* @__PURE__ */ s(g, { ...r?.formLabelProps ?? {}, children: [
15
+ render: ({ field: s }) => /* @__PURE__ */ t(f, { ...u, children: [
16
+ /* @__PURE__ */ t(g, { ...r?.formLabelProps ?? {}, children: [
17
17
  i,
18
18
  p && /* @__PURE__ */ e("span", { className: "text-danger text-sm", children: "*" })
19
19
  ] }),
20
- /* @__PURE__ */ e(F, { ...r?.formControlProps ?? {}, children: /* @__PURE__ */ e(x, { ...r?.datepickerProps ?? {}, selected: o.value, onSelect: o.onChange }) }),
20
+ /* @__PURE__ */ e(F, { ...r?.formControlProps ?? {}, children: /* @__PURE__ */ e(x, { ...r?.datepickerProps ?? {}, selected: s.value, onSelect: s.onChange, disabled: o }) }),
21
21
  /* @__PURE__ */ e(h, { ...r?.formMessageProps ?? {} })
22
22
  ] })
23
23
  }
package/dist/formdaterangepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"formdaterangepicker.es.js","sources":["../src/components/form-date-range-picker/FormDateRangePicker.tsx"],"sourcesContent":["import { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\n\r\nimport { DateRangePicker, DateRangePickerProps } from \"../date-picker/DateRangePicker\";\r\n\r\ntype FormDateRangePickerProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n datepickerProps?: DateRangePickerProps;\r\n };\r\n };\r\n\r\nconst FormDateRangePicker = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(\r\n props: FormDateRangePickerProps<TFieldValues, TName>,\r\n) => {\r\n const { name, control, defaultValue, disabled, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <DateRangePicker {...(slotProps?.datepickerProps ?? {})} selected={field.value} onSelect={field.onChange} />\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormDateRangePicker, type FormDateRangePickerProps };\r\n"],"names":["FormDateRangePicker","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","DateRangePicker","FormMessage"],"mappings":";;;AAsBM,MAAAA,IAAsB,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,UAAAC,GAAU,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAkB,IAAAV;AAGvH,SAAA,gBAAAW;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAV;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAO,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,uBAAsB,UAAC,IAAA,CAAA;AAAA,QAAA,GACtD;AAAA,QACA,gBAAAA,EAACM,KAAa,GAAIT,GAAW,oBAAoB,CAAA,GAC/C,4BAACU,GAAiB,EAAA,GAAIV,GAAW,mBAAmB,CAAA,GAAK,UAAUK,EAAM,OAAO,UAAUA,EAAM,SAAU,CAAA,GAC5G;AAAA,0BACCM,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
1
+ {"version":3,"file":"formdaterangepicker.es.js","sources":["../src/components/form-date-range-picker/FormDateRangePicker.tsx"],"sourcesContent":["import { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\n\r\nimport { DateRangePicker, DateRangePickerProps } from \"../date-picker/DateRangePicker\";\r\n\r\ntype FormDateRangePickerProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n datepickerProps?: DateRangePickerProps;\r\n };\r\n };\r\n\r\nconst FormDateRangePicker = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(\r\n props: FormDateRangePickerProps<TFieldValues, TName>,\r\n) => {\r\n const { name, control, defaultValue, disabled, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <DateRangePicker {...(slotProps?.datepickerProps ?? {})} selected={field.value} onSelect={field.onChange} disabled={disabled} />\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormDateRangePicker, type FormDateRangePickerProps };\r\n"],"names":["FormDateRangePicker","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","DateRangePicker","FormMessage"],"mappings":";;;AAsBM,MAAAA,IAAsB,CAC1BC,MACG;AACH,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,UAAAC,GAAU,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAkB,IAAAV;AAGvH,SAAA,gBAAAW;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAV;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAO,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,uBAAsB,UAAC,IAAA,CAAA;AAAA,QAAA,GACtD;AAAA,QACA,gBAAAA,EAACM,KAAa,GAAIT,GAAW,oBAAoB,CAAC,GAChD,4BAACU,GAAiB,EAAA,GAAIV,GAAW,mBAAmB,IAAK,UAAUK,EAAM,OAAO,UAAUA,EAAM,UAAU,UAAAT,EAAoB,CAAA,GAChI;AAAA,0BACCe,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
package/dist/formtimepicker.es.js CHANGED
@@ -1,23 +1,23 @@
1
- import { jsx as r, jsxs as m } from "react/jsx-runtime";
1
+ import { jsx as r, jsxs as s } from "react/jsx-runtime";
2
2
  import { FormField as P, FormItem as f, FormLabel as h, FormControl as F, FormMessage as g } from "./form.es.js";
3
3
  import { TimePicker as x } from "./timepicker.es.js";
4
- const T = (s) => {
5
- const { name: t, control: n, defaultValue: l, disabled: a, rules: i, shouldUnregister: d, label: p, slotProps: e, required: c, ...u } = s;
4
+ const T = (t) => {
5
+ const { name: n, control: l, defaultValue: a, disabled: o, rules: i, shouldUnregister: d, label: p, slotProps: e, required: c, ...u } = t;
6
6
  return /* @__PURE__ */ r(
7
7
  P,
8
8
  {
9
- control: n,
10
- name: t,
11
- defaultValue: l,
12
- disabled: a,
9
+ control: l,
10
+ name: n,
11
+ defaultValue: a,
12
+ disabled: o,
13
13
  rules: i,
14
14
  shouldUnregister: d,
15
- render: ({ field: o }) => /* @__PURE__ */ m(f, { ...u, children: [
16
- /* @__PURE__ */ m(h, { ...e?.formLabelProps ?? {}, children: [
15
+ render: ({ field: m }) => /* @__PURE__ */ s(f, { ...u, children: [
16
+ /* @__PURE__ */ s(h, { ...e?.formLabelProps ?? {}, children: [
17
17
  p,
18
18
  c && /* @__PURE__ */ r("span", { className: "text-danger text-sm", children: "*" })
19
19
  ] }),
20
- /* @__PURE__ */ r(F, { ...e?.formControlProps ?? {}, children: /* @__PURE__ */ r(x, { ...e?.datepickerProps ?? {}, time: o.value, onTimeChange: o.onChange }) }),
20
+ /* @__PURE__ */ r(F, { ...e?.formControlProps ?? {}, children: /* @__PURE__ */ r(x, { ...e?.datepickerProps ?? {}, time: m.value, onTimeChange: m.onChange, disabled: o }) }),
21
21
  /* @__PURE__ */ r(g, { ...e?.formMessageProps ?? {} })
22
22
  ] })
23
23
  }
package/dist/formtimepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"formtimepicker.es.js","sources":["../src/components/form-time-picker/FormTimePicker.tsx"],"sourcesContent":["import { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { TimePicker, TimePickerProps } from \"../date-picker/TimePicker\";\r\n\r\ntype FormTimePickerProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n datepickerProps?: TimePickerProps;\r\n };\r\n };\r\n\r\nconst FormTimePicker = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormTimePickerProps<TFieldValues, TName>) => {\r\n const { name, control, defaultValue, disabled, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <TimePicker {...(slotProps?.datepickerProps ?? {})} time={field.value} onTimeChange={field.onChange} />\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormTimePicker, type FormTimePickerProps };\r\n"],"names":["FormTimePicker","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","TimePicker","FormMessage"],"mappings":";;;AAqBM,MAAAA,IAAiB,CAA0EC,MAAoD;AACnJ,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,UAAAC,GAAU,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAkB,IAAAV;AAGvH,SAAA,gBAAAW;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAV;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAO,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,uBAAsB,UAAC,IAAA,CAAA;AAAA,QAAA,GACtD;AAAA,QACA,gBAAAA,EAACM,KAAa,GAAIT,GAAW,oBAAoB,CAAA,GAC/C,4BAACU,GAAY,EAAA,GAAIV,GAAW,mBAAmB,CAAA,GAAK,MAAMK,EAAM,OAAO,cAAcA,EAAM,SAAU,CAAA,GACvG;AAAA,0BACCM,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
1
+ {"version":3,"file":"formtimepicker.es.js","sources":["../src/components/form-time-picker/FormTimePicker.tsx"],"sourcesContent":["import { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { TimePicker, TimePickerProps } from \"../date-picker/TimePicker\";\r\n\r\ntype FormTimePickerProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n datepickerProps?: TimePickerProps;\r\n };\r\n };\r\n\r\nconst FormTimePicker = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormTimePickerProps<TFieldValues, TName>) => {\r\n const { name, control, defaultValue, disabled, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <TimePicker {...(slotProps?.datepickerProps ?? {})} time={field.value} onTimeChange={field.onChange} disabled={disabled} />\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormTimePicker, type FormTimePickerProps };\r\n"],"names":["FormTimePicker","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","TimePicker","FormMessage"],"mappings":";;;AAqBM,MAAAA,IAAiB,CAA0EC,MAAoD;AACnJ,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,UAAAC,GAAU,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAkB,IAAAV;AAGvH,SAAA,gBAAAW;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAV;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAO,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,uBAAsB,UAAC,IAAA,CAAA;AAAA,QAAA,GACtD;AAAA,QACA,gBAAAA,EAACM,KAAa,GAAIT,GAAW,oBAAoB,CAAC,GAChD,4BAACU,GAAY,EAAA,GAAIV,GAAW,mBAAmB,IAAK,MAAMK,EAAM,OAAO,cAAcA,EAAM,UAAU,UAAAT,EAAoB,CAAA,GAC3H;AAAA,0BACCe,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
package/dist/mobiledatepicker.es.js CHANGED
@@ -1,13 +1,13 @@
1
1
  import { jsxs as t, Fragment as D, jsx as e } from "react/jsx-runtime";
2
2
  import * as d from "react";
3
- import { VisuallyHidden as b } from "@radix-ui/react-visually-hidden";
4
- import { Calendar as M } from "@trsys-tech/matrix-icons";
3
+ import { VisuallyHidden as M } from "@radix-ui/react-visually-hidden";
4
+ import { Calendar as v } from "@trsys-tech/matrix-icons";
5
5
  import { cn as m } from "./utils.es.js";
6
- import { Calendar as v } from "./calendar.es.js";
6
+ import { Calendar as k } from "./calendar.es.js";
7
7
  import { Button as i } from "./button.es.js";
8
- import { Dialog as k, DialogContent as w, DialogHeader as j, DialogTitle as P, DialogDescription as O } from "./dialog.es.js";
8
+ import { Dialog as w, DialogContent as j, DialogHeader as P, DialogTitle as O, DialogDescription as S } from "./dialog.es.js";
9
9
  import { formatDate as o } from "./format.es.js";
10
- const T = ({
10
+ const V = ({
11
11
  formatStr: l,
12
12
  selected: a,
13
13
  placeholder: p,
@@ -16,7 +16,8 @@ const T = ({
16
16
  cancelText: u,
17
17
  applyText: x,
18
18
  onSelect: g,
19
- ...y
19
+ disabled: y,
20
+ ...b
20
21
  }) => {
21
22
  const [N, n] = d.useState(!1), [r, s] = d.useState(a), c = () => {
22
23
  n(!1), s(a);
@@ -29,28 +30,29 @@ const T = ({
29
30
  {
30
31
  variant: "outline",
31
32
  className: m(
32
- "w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start",
33
+ "w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100",
33
34
  !a && "text-muted-foreground",
34
35
  f
35
36
  ),
36
37
  onClick: () => n(!0),
37
38
  "aria-label": a ? `Selected date: ${o(a, l ?? "yyyy/MM/dd")}` : "Pick a date",
39
+ disabled: y,
38
40
  children: [
39
41
  a ? o(a, l ?? "eee, MMM dd") : /* @__PURE__ */ e("span", { children: p ?? "Pick a date" }),
40
- /* @__PURE__ */ e(M, { className: "mr-2 h-5 w-5 ms-auto" })
42
+ /* @__PURE__ */ e(v, { className: "mr-2 h-5 w-5 ms-auto" })
41
43
  ]
42
44
  }
43
45
  ),
44
- /* @__PURE__ */ e(k, { open: N, onOpenChange: c, children: /* @__PURE__ */ t(w, { className: "h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none", children: [
45
- /* @__PURE__ */ t(j, { className: "p-4 border-b border-b-gray-200", children: [
46
- /* @__PURE__ */ e(P, { asChild: !0, children: /* @__PURE__ */ t("div", { className: "text-sm font-bold space-y-1 mt-3", children: [
46
+ /* @__PURE__ */ e(w, { open: N, onOpenChange: c, children: /* @__PURE__ */ t(j, { className: "h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none", children: [
47
+ /* @__PURE__ */ t(P, { className: "p-4 border-b border-b-gray-200", children: [
48
+ /* @__PURE__ */ e(O, { asChild: !0, children: /* @__PURE__ */ t("div", { className: "text-sm font-bold space-y-1 mt-3", children: [
47
49
  /* @__PURE__ */ e("h5", { className: "text-text-300", children: r?.getFullYear() ?? /* @__PURE__ */ e("pre", { children: " " }) }),
48
50
  /* @__PURE__ */ e("h6", { className: "", children: r ? o(r, l ?? "eee, MMM dd") : /* @__PURE__ */ e("pre", { children: " " }) })
49
51
  ] }) }),
50
- /* @__PURE__ */ e(b, { children: /* @__PURE__ */ e(O, { children: "Date Picker" }) })
52
+ /* @__PURE__ */ e(M, { children: /* @__PURE__ */ e(S, { children: "Date Picker" }) })
51
53
  ] }),
52
54
  /* @__PURE__ */ t("div", { className: "flex-1 flex flex-col items-center p-4", children: [
53
- /* @__PURE__ */ e(v, { ...y, mode: "single", selected: r, onSelect: s, className: m("p-0", h) }),
55
+ /* @__PURE__ */ e(k, { ...b, mode: "single", selected: r, onSelect: s, className: m("p-0", h) }),
54
56
  /* @__PURE__ */ t("div", { className: "flex justify-center items-center gap-4 mt-auto w-full", children: [
55
57
  /* @__PURE__ */ e(i, { variant: "text", className: "flex-1 h-10", onClick: c, children: u ?? "Cancel" }),
56
58
  /* @__PURE__ */ e(i, { variant: "primary", className: "flex-1 h-10", onClick: C, children: x ?? "Apply" })
@@ -60,6 +62,6 @@ const T = ({
60
62
  ] });
61
63
  };
62
64
  export {
63
- T as MobileDatePicker
65
+ V as MobileDatePicker
64
66
  };
65
67
  //# sourceMappingURL=mobiledatepicker.es.js.map
package/dist/mobiledatepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"mobiledatepicker.es.js","sources":["../src/components/date-picker/MobileDatePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { PropsBase, PropsSingle } from \"react-day-picker\";\r\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from \"../dialog/Dialog\";\r\n\r\ntype MobileDatePickerProps = PropsBase &\r\n Omit<PropsSingle, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: Date;\r\n required?: boolean;\r\n cancelText?: string;\r\n applyText?: string;\r\n onSelect?: (date: Date | undefined) => void;\r\n };\r\n\r\nconst MobileDatePicker: React.FC<MobileDatePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n cancelText,\r\n applyText,\r\n onSelect,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n const [selectedDate, setSelectedDate] = React.useState<Date | undefined>(selected);\r\n\r\n const handleCancel = () => {\r\n setIsOpen(false);\r\n setSelectedDate(selected);\r\n };\r\n\r\n const handleApply = () => {\r\n onSelect?.(selectedDate);\r\n setIsOpen(false);\r\n };\r\n\r\n return (\r\n <>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n onClick={() => setIsOpen(true)}\r\n aria-label={selected ? `Selected date: ${format(selected, formatStr ?? \"yyyy/MM/dd\")}` : \"Pick a date\"}\r\n >\r\n {selected ? format(selected, formatStr ?? \"eee, MMM dd\") : <span>{placeholder ?? \"Pick a date\"}</span>}\r\n <CalendarIcon className=\"mr-2 h-5 w-5 ms-auto\" />\r\n </Button>\r\n <Dialog open={isOpen} onOpenChange={handleCancel}>\r\n <DialogContent className=\"h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none\">\r\n <DialogHeader className=\"p-4 border-b border-b-gray-200\">\r\n <DialogTitle asChild>\r\n <div className=\"text-sm font-bold space-y-1 mt-3\">\r\n <h5 className=\"text-text-300\">{selectedDate?.getFullYear() ?? <pre> </pre>}</h5>\r\n <h6 className=\"\">{selectedDate ? format(selectedDate, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n </DialogTitle>\r\n <VisuallyHidden>\r\n <DialogDescription>{\"Date Picker\"}</DialogDescription>\r\n </VisuallyHidden>\r\n </DialogHeader>\r\n <div className=\"flex-1 flex flex-col items-center p-4\">\r\n <Calendar {...props} mode=\"single\" selected={selectedDate} onSelect={setSelectedDate} className={cn(\"p-0\", calendarClassName)} />\r\n <div className=\"flex justify-center items-center gap-4 mt-auto w-full\">\r\n <Button variant=\"text\" className=\"flex-1 h-10\" onClick={handleCancel}>\r\n {cancelText ?? \"Cancel\"}\r\n </Button>\r\n <Button variant=\"primary\" className=\"flex-1 h-10\" onClick={handleApply}>\r\n {applyText ?? \"Apply\"}\r\n </Button>\r\n </div>\r\n </div>\r\n </DialogContent>\r\n </Dialog>\r\n </>\r\n );\r\n};\r\n\r\nexport { MobileDatePicker, type MobileDatePickerProps };\r\n"],"names":["MobileDatePicker","formatStr","selected","placeholder","className","calendarClassName","cancelText","applyText","onSelect","props","isOpen","setIsOpen","React","selectedDate","setSelectedDate","handleCancel","handleApply","jsxs","Fragment","Button","cn","format","jsx","CalendarIcon","Dialog","DialogContent","DialogHeader","DialogTitle","VisuallyHidden","DialogDescription","Calendar"],"mappings":";;;;;;;;;AAyBA,MAAMA,IAAoD,CAAC;AAAA,EACzD,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAC1C,CAACC,GAAcC,CAAe,IAAIF,EAAM,SAA2BV,CAAQ,GAE3Ea,IAAe,MAAM;AACzB,IAAAJ,EAAU,EAAK,GACfG,EAAgBZ,CAAQ;AAAA,EAC1B,GAEMc,IAAc,MAAM;AACxB,IAAAR,IAAWK,CAAY,GACvBF,EAAU,EAAK;AAAA,EACjB;AAEA,SAEI,gBAAAM,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWC;AAAA,UACT;AAAA,UACA,CAAClB,KAAY;AAAA,UACbE;AAAA,QACF;AAAA,QACA,SAAS,MAAMO,EAAU,EAAI;AAAA,QAC7B,cAAYT,IAAW,kBAAkBmB,EAAOnB,GAAUD,KAAa,YAAY,CAAC,KAAK;AAAA,QAExF,UAAA;AAAA,UAAWC,IAAAmB,EAAOnB,GAAUD,KAAa,aAAa,IAAK,gBAAAqB,EAAA,QAAA,EAAM,eAAe,cAAc,CAAA;AAAA,UAC/F,gBAAAA,EAACC,GAAa,EAAA,WAAU,uBAAuB,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACjD;AAAA,IACA,gBAAAD,EAACE,KAAO,MAAMd,GAAQ,cAAcK,GAClC,UAAA,gBAAAE,EAACQ,GAAc,EAAA,WAAU,qLACvB,UAAA;AAAA,MAAC,gBAAAR,EAAAS,GAAA,EAAa,WAAU,kCACtB,UAAA;AAAA,QAAA,gBAAAJ,EAACK,KAAY,SAAO,IAClB,UAAC,gBAAAV,EAAA,OAAA,EAAI,WAAU,oCACb,UAAA;AAAA,UAAC,gBAAAK,EAAA,MAAA,EAAG,WAAU,iBAAiB,UAAAT,GAAc,iBAAiB,gBAAAS,EAAC,OAAI,EAAA,UAAA,IAAA,CAAC,EAAO,CAAA;AAAA,UAC1E,gBAAAA,EAAA,MAAA,EAAG,WAAU,IAAI,UAAeT,IAAAQ,EAAOR,GAAcZ,KAAa,aAAa,IAAK,gBAAAqB,EAAA,OAAA,EAAI,eAAC,EAAO,CAAA;AAAA,QAAA,EAAA,CACnG,EACF,CAAA;AAAA,QACC,gBAAAA,EAAAM,GAAA,EACC,UAAC,gBAAAN,EAAAO,GAAA,EAAmB,yBAAc,EACpC,CAAA;AAAA,MAAA,GACF;AAAA,MACA,gBAAAZ,EAAC,OAAI,EAAA,WAAU,yCACb,UAAA;AAAA,QAAA,gBAAAK,EAACQ,GAAU,EAAA,GAAGrB,GAAO,MAAK,UAAS,UAAUI,GAAc,UAAUC,GAAiB,WAAWM,EAAG,OAAOf,CAAiB,GAAG;AAAA,QAC/H,gBAAAY,EAAC,OAAI,EAAA,WAAU,yDACb,UAAA;AAAA,UAAC,gBAAAK,EAAAH,GAAA,EAAO,SAAQ,QAAO,WAAU,eAAc,SAASJ,GACrD,eAAc,SACjB,CAAA;AAAA,UACA,gBAAAO,EAACH,KAAO,SAAQ,WAAU,WAAU,eAAc,SAASH,GACxD,UAAAT,KAAa,QAChB,CAAA;AAAA,QAAA,EACF,CAAA;AAAA,MAAA,EACF,CAAA;AAAA,IAAA,EAAA,CACF,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}
1
+ {"version":3,"file":"mobiledatepicker.es.js","sources":["../src/components/date-picker/MobileDatePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { PropsBase, PropsSingle } from \"react-day-picker\";\r\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from \"../dialog/Dialog\";\r\n\r\ntype MobileDatePickerProps = PropsBase &\r\n Omit<PropsSingle, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: Date;\r\n required?: boolean;\r\n cancelText?: string;\r\n applyText?: string;\r\n onSelect?: (date: Date | undefined) => void;\r\n disabled?: boolean;\r\n };\r\n\r\nconst MobileDatePicker: React.FC<MobileDatePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n cancelText,\r\n applyText,\r\n onSelect,\r\n disabled,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n const [selectedDate, setSelectedDate] = React.useState<Date | undefined>(selected);\r\n\r\n const handleCancel = () => {\r\n setIsOpen(false);\r\n setSelectedDate(selected);\r\n };\r\n\r\n const handleApply = () => {\r\n onSelect?.(selectedDate);\r\n setIsOpen(false);\r\n };\r\n\r\n return (\r\n <>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n onClick={() => setIsOpen(true)}\r\n aria-label={selected ? `Selected date: ${format(selected, formatStr ?? \"yyyy/MM/dd\")}` : \"Pick a date\"}\r\n disabled={disabled}\r\n >\r\n {selected ? format(selected, formatStr ?? \"eee, MMM dd\") : <span>{placeholder ?? \"Pick a date\"}</span>}\r\n <CalendarIcon className=\"mr-2 h-5 w-5 ms-auto\" />\r\n </Button>\r\n <Dialog open={isOpen} onOpenChange={handleCancel}>\r\n <DialogContent className=\"h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none\">\r\n <DialogHeader className=\"p-4 border-b border-b-gray-200\">\r\n <DialogTitle asChild>\r\n <div className=\"text-sm font-bold space-y-1 mt-3\">\r\n <h5 className=\"text-text-300\">{selectedDate?.getFullYear() ?? <pre> </pre>}</h5>\r\n <h6 className=\"\">{selectedDate ? format(selectedDate, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n </DialogTitle>\r\n <VisuallyHidden>\r\n <DialogDescription>{\"Date Picker\"}</DialogDescription>\r\n </VisuallyHidden>\r\n </DialogHeader>\r\n <div className=\"flex-1 flex flex-col items-center p-4\">\r\n <Calendar {...props} mode=\"single\" selected={selectedDate} onSelect={setSelectedDate} className={cn(\"p-0\", calendarClassName)} />\r\n <div className=\"flex justify-center items-center gap-4 mt-auto w-full\">\r\n <Button variant=\"text\" className=\"flex-1 h-10\" onClick={handleCancel}>\r\n {cancelText ?? \"Cancel\"}\r\n </Button>\r\n <Button variant=\"primary\" className=\"flex-1 h-10\" onClick={handleApply}>\r\n {applyText ?? \"Apply\"}\r\n </Button>\r\n </div>\r\n </div>\r\n </DialogContent>\r\n </Dialog>\r\n </>\r\n );\r\n};\r\n\r\nexport { MobileDatePicker, type MobileDatePickerProps };\r\n"],"names":["MobileDatePicker","formatStr","selected","placeholder","className","calendarClassName","cancelText","applyText","onSelect","disabled","props","isOpen","setIsOpen","React","selectedDate","setSelectedDate","handleCancel","handleApply","jsxs","Fragment","Button","cn","format","jsx","CalendarIcon","Dialog","DialogContent","DialogHeader","DialogTitle","VisuallyHidden","DialogDescription","Calendar"],"mappings":";;;;;;;;;AA0BA,MAAMA,IAAoD,CAAC;AAAA,EACzD,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAC1C,CAACC,GAAcC,CAAe,IAAIF,EAAM,SAA2BX,CAAQ,GAE3Ec,IAAe,MAAM;AACzB,IAAAJ,EAAU,EAAK,GACfG,EAAgBb,CAAQ;AAAA,EAC1B,GAEMe,IAAc,MAAM;AACxB,IAAAT,IAAWM,CAAY,GACvBF,EAAU,EAAK;AAAA,EACjB;AAEA,SAEI,gBAAAM,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWC;AAAA,UACT;AAAA,UACA,CAACnB,KAAY;AAAA,UACbE;AAAA,QACF;AAAA,QACA,SAAS,MAAMQ,EAAU,EAAI;AAAA,QAC7B,cAAYV,IAAW,kBAAkBoB,EAAOpB,GAAUD,KAAa,YAAY,CAAC,KAAK;AAAA,QACzF,UAAAQ;AAAA,QAEC,UAAA;AAAA,UAAWP,IAAAoB,EAAOpB,GAAUD,KAAa,aAAa,IAAK,gBAAAsB,EAAA,QAAA,EAAM,eAAe,cAAc,CAAA;AAAA,UAC/F,gBAAAA,EAACC,GAAa,EAAA,WAAU,uBAAuB,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACjD;AAAA,IACA,gBAAAD,EAACE,KAAO,MAAMd,GAAQ,cAAcK,GAClC,UAAA,gBAAAE,EAACQ,GAAc,EAAA,WAAU,qLACvB,UAAA;AAAA,MAAC,gBAAAR,EAAAS,GAAA,EAAa,WAAU,kCACtB,UAAA;AAAA,QAAA,gBAAAJ,EAACK,KAAY,SAAO,IAClB,UAAC,gBAAAV,EAAA,OAAA,EAAI,WAAU,oCACb,UAAA;AAAA,UAAC,gBAAAK,EAAA,MAAA,EAAG,WAAU,iBAAiB,UAAAT,GAAc,iBAAiB,gBAAAS,EAAC,OAAI,EAAA,UAAA,IAAA,CAAC,EAAO,CAAA;AAAA,UAC1E,gBAAAA,EAAA,MAAA,EAAG,WAAU,IAAI,UAAeT,IAAAQ,EAAOR,GAAcb,KAAa,aAAa,IAAK,gBAAAsB,EAAA,OAAA,EAAI,eAAC,EAAO,CAAA;AAAA,QAAA,EAAA,CACnG,EACF,CAAA;AAAA,QACC,gBAAAA,EAAAM,GAAA,EACC,UAAC,gBAAAN,EAAAO,GAAA,EAAmB,yBAAc,EACpC,CAAA;AAAA,MAAA,GACF;AAAA,MACA,gBAAAZ,EAAC,OAAI,EAAA,WAAU,yCACb,UAAA;AAAA,QAAA,gBAAAK,EAACQ,GAAU,EAAA,GAAGrB,GAAO,MAAK,UAAS,UAAUI,GAAc,UAAUC,GAAiB,WAAWM,EAAG,OAAOhB,CAAiB,GAAG;AAAA,QAC/H,gBAAAa,EAAC,OAAI,EAAA,WAAU,yDACb,UAAA;AAAA,UAAC,gBAAAK,EAAAH,GAAA,EAAO,SAAQ,QAAO,WAAU,eAAc,SAASJ,GACrD,eAAc,SACjB,CAAA;AAAA,UACA,gBAAAO,EAACH,KAAO,SAAQ,WAAU,WAAU,eAAc,SAASH,GACxD,UAAAV,KAAa,QAChB,CAAA;AAAA,QAAA,EACF,CAAA;AAAA,MAAA,EACF,CAAA;AAAA,IAAA,EAAA,CACF,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}
package/dist/mobiledaterangepicker.es.js CHANGED
@@ -1,88 +1,90 @@
1
- import { jsxs as i, Fragment as w, jsx as o } from "react/jsx-runtime";
1
+ import { jsxs as i, Fragment as R, jsx as r } from "react/jsx-runtime";
2
2
  import * as f from "react";
3
- import { VisuallyHidden as R } from "@radix-ui/react-visually-hidden";
4
- import { Calendar as F } from "@trsys-tech/matrix-icons";
3
+ import { VisuallyHidden as F } from "@radix-ui/react-visually-hidden";
4
+ import { Calendar as O } from "@trsys-tech/matrix-icons";
5
5
  import { cn as h } from "./utils.es.js";
6
- import { Calendar as O } from "./calendar.es.js";
6
+ import { Calendar as P } from "./calendar.es.js";
7
7
  import { Button as s } from "./button.es.js";
8
- import { Dialog as P, DialogContent as $, DialogHeader as A, DialogTitle as H, DialogDescription as B } from "./dialog.es.js";
9
- import { formatDate as l } from "./format.es.js";
10
- const L = ({
11
- formatStr: n,
12
- selected: r,
8
+ import { Dialog as $, DialogContent as A, DialogHeader as H, DialogTitle as B, DialogDescription as I } from "./dialog.es.js";
9
+ import { formatDate as n } from "./format.es.js";
10
+ const Q = ({
11
+ formatStr: l,
12
+ selected: o,
13
13
  placeholder: c,
14
- className: p,
15
- calendarClassName: g,
14
+ className: g,
15
+ calendarClassName: p,
16
16
  onDayClick: y,
17
17
  cancelText: x,
18
18
  applyText: u,
19
19
  onSelect: N,
20
- fromText: M,
21
- toText: b,
22
- ...v
20
+ fromText: b,
21
+ toText: M,
22
+ disabled: v,
23
+ ...C
23
24
  }) => {
24
- const [C, m] = f.useState(!1), [e, a] = f.useState(r), T = (t, k, j) => {
25
- y?.(t, k, j), !e || !e.from ? a({ from: t, to: void 0 }) : t < e.from ? e.to ? a({ from: t, to: e.to }) : a({ from: t, to: e.from }) : e?.from?.getTime() === t?.getTime() && (e?.from?.getTime() === e?.to?.getTime() || !e.to) ? a(void 0) : e?.from?.getTime() !== e?.to?.getTime() && (e.from?.getTime() === t?.getTime() || e?.to?.getTime() === t?.getTime()) ? a({ from: t, to: t }) : a({ ...e, to: t });
25
+ const [T, m] = f.useState(!1), [e, a] = f.useState(o), D = (t, j, w) => {
26
+ y?.(t, j, w), !e || !e.from ? a({ from: t, to: void 0 }) : t < e.from ? e.to ? a({ from: t, to: e.to }) : a({ from: t, to: e.from }) : e?.from?.getTime() === t?.getTime() && (e?.from?.getTime() === e?.to?.getTime() || !e.to) ? a(void 0) : e?.from?.getTime() !== e?.to?.getTime() && (e.from?.getTime() === t?.getTime() || e?.to?.getTime() === t?.getTime()) ? a({ from: t, to: t }) : a({ ...e, to: t });
26
27
  }, d = () => {
27
- m(!1), a(r);
28
- }, D = () => {
28
+ m(!1), a(o);
29
+ }, k = () => {
29
30
  N?.(e), m(!1);
30
31
  };
31
- return /* @__PURE__ */ i(w, { children: [
32
+ return /* @__PURE__ */ i(R, { children: [
32
33
  /* @__PURE__ */ i(
33
34
  s,
34
35
  {
35
36
  variant: "outline",
36
37
  className: h(
37
- "w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start",
38
- !r && "text-muted-foreground",
39
- p
38
+ "w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100",
39
+ !o && "text-muted-foreground",
40
+ g
40
41
  ),
41
42
  onClick: () => m(!0),
42
- "aria-label": r ? `Selected date: ${r?.from ? l(r.from, n ?? "yyyy/MM/dd") : ""} - ${r?.to ? l(r.to, n ?? "yyyy/MM/dd") : ""}` : c,
43
+ "aria-label": o ? `Selected date: ${o?.from ? n(o.from, l ?? "yyyy/MM/dd") : ""} - ${o?.to ? n(o.to, l ?? "yyyy/MM/dd") : ""}` : c,
44
+ disabled: v,
43
45
  children: [
44
- r ? /* @__PURE__ */ i("div", { className: "grid grid-cols-2 flex-1 justify-items-start", children: [
46
+ o ? /* @__PURE__ */ i("div", { className: "grid grid-cols-2 flex-1 justify-items-start", children: [
45
47
  /* @__PURE__ */ i("span", { children: [
46
- M ?? "From",
48
+ b ?? "From",
47
49
  ": ",
48
- r?.from ? l(r.from, n ?? "yyyy/MM/dd") : "-"
50
+ o?.from ? n(o.from, l ?? "yyyy/MM/dd") : "-"
49
51
  ] }),
50
52
  " ",
51
53
  /* @__PURE__ */ i("span", { children: [
52
- b ?? "To",
54
+ M ?? "To",
53
55
  ": ",
54
- r?.to ? l(r.to, n ?? "yyyy/MM/dd") : "-"
56
+ o?.to ? n(o.to, l ?? "yyyy/MM/dd") : "-"
55
57
  ] })
56
- ] }) : /* @__PURE__ */ o("span", { children: c ?? "Pick a Range" }),
57
- /* @__PURE__ */ o(F, { className: "mr-2 h-5 w-4 ms-auto" })
58
+ ] }) : /* @__PURE__ */ r("span", { children: c ?? "Pick a Range" }),
59
+ /* @__PURE__ */ r(O, { className: "mr-2 h-5 w-4 ms-auto" })
58
60
  ]
59
61
  }
60
62
  ),
61
- /* @__PURE__ */ o(P, { open: C, onOpenChange: d, children: /* @__PURE__ */ i($, { className: "h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none", children: [
62
- /* @__PURE__ */ i(A, { children: [
63
- /* @__PURE__ */ o(H, { asChild: !0, children: /* @__PURE__ */ i("div", { className: "grid grid-cols-2 border-b border-b-gray-200 mt-3", children: [
63
+ /* @__PURE__ */ r($, { open: T, onOpenChange: d, children: /* @__PURE__ */ i(A, { className: "h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none", children: [
64
+ /* @__PURE__ */ i(H, { children: [
65
+ /* @__PURE__ */ r(B, { asChild: !0, children: /* @__PURE__ */ i("div", { className: "grid grid-cols-2 border-b border-b-gray-200 mt-3", children: [
64
66
  /* @__PURE__ */ i("div", { className: "text-sm font-bold space-y-1 border-e border-e-gray-200 p-4", children: [
65
- /* @__PURE__ */ o("h5", { className: "text-text-300 font-medium text-xs", children: "From" }),
66
- /* @__PURE__ */ o("h6", { className: "", children: e?.from ? l(e.from, n ?? "eee, MMM dd") : /* @__PURE__ */ o("pre", { children: " " }) })
67
+ /* @__PURE__ */ r("h5", { className: "text-text-300 font-medium text-xs", children: "From" }),
68
+ /* @__PURE__ */ r("h6", { className: "", children: e?.from ? n(e.from, l ?? "eee, MMM dd") : /* @__PURE__ */ r("pre", { children: " " }) })
67
69
  ] }),
68
70
  /* @__PURE__ */ i("div", { className: "text-sm font-bold space-y-1 p-4 flex flex-col justify-center", children: [
69
- /* @__PURE__ */ o("h5", { className: "text-text-300 font-medium text-xs", children: "To" }),
70
- /* @__PURE__ */ o("h6", { className: "", children: e?.to ? l(e.to, n ?? "eee, MMM dd") : /* @__PURE__ */ o("pre", { children: " " }) })
71
+ /* @__PURE__ */ r("h5", { className: "text-text-300 font-medium text-xs", children: "To" }),
72
+ /* @__PURE__ */ r("h6", { className: "", children: e?.to ? n(e.to, l ?? "eee, MMM dd") : /* @__PURE__ */ r("pre", { children: " " }) })
71
73
  ] })
72
74
  ] }) }),
73
- /* @__PURE__ */ o(R, { children: /* @__PURE__ */ o(B, { children: "Date Picker" }) })
75
+ /* @__PURE__ */ r(F, { children: /* @__PURE__ */ r(I, { children: "Date Picker" }) })
74
76
  ] }),
75
77
  /* @__PURE__ */ i("div", { className: "flex-1 flex flex-col items-center p-4", children: [
76
- /* @__PURE__ */ o(O, { ...v, mode: "range", selected: r, onDayClick: T, className: h("p-0", g) }),
78
+ /* @__PURE__ */ r(P, { ...C, mode: "range", selected: o, onDayClick: D, className: h("p-0", p) }),
77
79
  /* @__PURE__ */ i("div", { className: "flex justify-center items-center gap-4 mt-auto w-full", children: [
78
- /* @__PURE__ */ o(s, { variant: "text", className: "flex-1 h-10", onClick: d, children: x ?? "Cancel" }),
79
- /* @__PURE__ */ o(s, { variant: "primary", className: "flex-1 h-10", onClick: D, children: u ?? "Apply" })
80
+ /* @__PURE__ */ r(s, { variant: "text", className: "flex-1 h-10", onClick: d, children: x ?? "Cancel" }),
81
+ /* @__PURE__ */ r(s, { variant: "primary", className: "flex-1 h-10", onClick: k, children: u ?? "Apply" })
80
82
  ] })
81
83
  ] })
82
84
  ] }) })
83
85
  ] });
84
86
  };
85
87
  export {
86
- L as MobileDateRangePicker
88
+ Q as MobileDateRangePicker
87
89
  };
88
90
  //# sourceMappingURL=mobiledaterangepicker.es.js.map
package/dist/mobiledaterangepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"mobiledaterangepicker.es.js","sources":["../src/components/date-picker/MobileDateRangePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\nimport { PropsBase, PropsRange, DateRange, DayEventHandler } from \"react-day-picker\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from \"../dialog/Dialog\";\r\n\r\ntype MobileDateRangePickerProps = PropsBase &\r\n Omit<PropsRange, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: DateRange;\r\n required?: boolean;\r\n cancelText?: string;\r\n applyText?: string;\r\n onSelect?: (date: DateRange | undefined) => void;\r\n fromText?: string;\r\n toText?: string;\r\n };\r\n\r\nconst MobileDateRangePicker: React.FC<MobileDateRangePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n onDayClick,\r\n cancelText,\r\n applyText,\r\n onSelect,\r\n fromText,\r\n toText,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n const [range, setRange] = React.useState<DateRange | undefined>(selected);\r\n\r\n const handleDayClick: DayEventHandler<React.MouseEvent<Element, MouseEvent>> = (date, modifiers, e) => {\r\n onDayClick?.(date, modifiers, e);\r\n if (!range || !range.from) {\r\n setRange({ from: date, to: undefined });\r\n } else if (date < range.from) {\r\n if (!range.to) {\r\n setRange({ from: date, to: range.from });\r\n } else {\r\n setRange({ from: date, to: range.to });\r\n }\r\n } else if (range?.from?.getTime() === date?.getTime() && (range?.from?.getTime() === range?.to?.getTime() || !range.to)) {\r\n setRange(undefined);\r\n } else if (\r\n range?.from?.getTime() !== range?.to?.getTime() &&\r\n (range.from?.getTime() === date?.getTime() || range?.to?.getTime() === date?.getTime())\r\n ) {\r\n setRange({ from: date, to: date });\r\n } else {\r\n setRange({ ...range, to: date });\r\n }\r\n };\r\n\r\n const handleCancel = () => {\r\n setIsOpen(false);\r\n setRange(selected);\r\n };\r\n\r\n const handleApply = () => {\r\n onSelect?.(range);\r\n setIsOpen(false);\r\n };\r\n\r\n return (\r\n <>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n onClick={() => setIsOpen(true)}\r\n aria-label={\r\n selected\r\n ? `Selected date: ${selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"\"} - ${selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"\"}`\r\n : placeholder\r\n }\r\n >\r\n {selected ? (\r\n <div className=\"grid grid-cols-2 flex-1 justify-items-start\">\r\n <span>\r\n {fromText ?? \"From\"}: {selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>{\" \"}\r\n <span>\r\n {toText ?? \"To\"}: {selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>\r\n </div>\r\n ) : (\r\n <span>{placeholder ?? \"Pick a Range\"}</span>\r\n )}\r\n <CalendarIcon className=\"mr-2 h-5 w-4 ms-auto\" />\r\n </Button>\r\n <Dialog open={isOpen} onOpenChange={handleCancel}>\r\n <DialogContent className=\"h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none\">\r\n <DialogHeader>\r\n <DialogTitle asChild>\r\n <div className=\"grid grid-cols-2 border-b border-b-gray-200 mt-3\">\r\n <div className=\"text-sm font-bold space-y-1 border-e border-e-gray-200 p-4\">\r\n <h5 className=\"text-text-300 font-medium text-xs\">From</h5>\r\n <h6 className=\"\">{range?.from ? format(range.from, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n <div className=\"text-sm font-bold space-y-1 p-4 flex flex-col justify-center\">\r\n <h5 className=\"text-text-300 font-medium text-xs\">To</h5>\r\n <h6 className=\"\">{range?.to ? format(range.to, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n </div>\r\n </DialogTitle>\r\n <VisuallyHidden>\r\n <DialogDescription>{\"Date Picker\"}</DialogDescription>\r\n </VisuallyHidden>\r\n </DialogHeader>\r\n <div className=\"flex-1 flex flex-col items-center p-4\">\r\n <Calendar {...props} mode=\"range\" selected={selected} onDayClick={handleDayClick} className={cn(\"p-0\", calendarClassName)} />\r\n\r\n <div className=\"flex justify-center items-center gap-4 mt-auto w-full\">\r\n <Button variant=\"text\" className=\"flex-1 h-10\" onClick={handleCancel}>\r\n {cancelText ?? \"Cancel\"}\r\n </Button>\r\n <Button variant=\"primary\" className=\"flex-1 h-10\" onClick={handleApply}>\r\n {applyText ?? \"Apply\"}\r\n </Button>\r\n </div>\r\n </div>\r\n </DialogContent>\r\n </Dialog>\r\n </>\r\n );\r\n};\r\n\r\nexport { MobileDateRangePicker, type MobileDateRangePickerProps };\r\n"],"names":["MobileDateRangePicker","formatStr","selected","placeholder","className","calendarClassName","onDayClick","cancelText","applyText","onSelect","fromText","toText","props","isOpen","setIsOpen","React","range","setRange","handleDayClick","date","modifiers","e","handleCancel","handleApply","jsxs","Fragment","Button","cn","format","jsx","CalendarIcon","Dialog","DialogContent","DialogHeader","DialogTitle","VisuallyHidden","DialogDescription","Calendar"],"mappings":"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"}
1
+ {"version":3,"file":"mobiledaterangepicker.es.js","sources":["../src/components/date-picker/MobileDateRangePicker.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { format } from \"date-fns\";\r\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\r\nimport { Calendar as CalendarIcon } from \"@trsys-tech/matrix-icons\";\r\nimport { PropsBase, PropsRange, DateRange, DayEventHandler } from \"react-day-picker\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Calendar } from \"./calendar\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from \"../dialog/Dialog\";\r\n\r\ntype MobileDateRangePickerProps = PropsBase &\r\n Omit<PropsRange, \"mode\"> & {\r\n formatStr?: string;\r\n placeholder?: string;\r\n calendarClassName?: string;\r\n selected?: DateRange;\r\n required?: boolean;\r\n cancelText?: string;\r\n applyText?: string;\r\n onSelect?: (date: DateRange | undefined) => void;\r\n fromText?: string;\r\n toText?: string;\r\n disabled?: boolean;\r\n };\r\n\r\nconst MobileDateRangePicker: React.FC<MobileDateRangePickerProps> = ({\r\n formatStr,\r\n selected,\r\n placeholder,\r\n className,\r\n calendarClassName,\r\n onDayClick,\r\n cancelText,\r\n applyText,\r\n onSelect,\r\n fromText,\r\n toText,\r\n disabled,\r\n ...props\r\n}) => {\r\n const [isOpen, setIsOpen] = React.useState(false);\r\n const [range, setRange] = React.useState<DateRange | undefined>(selected);\r\n\r\n const handleDayClick: DayEventHandler<React.MouseEvent<Element, MouseEvent>> = (date, modifiers, e) => {\r\n onDayClick?.(date, modifiers, e);\r\n if (!range || !range.from) {\r\n setRange({ from: date, to: undefined });\r\n } else if (date < range.from) {\r\n if (!range.to) {\r\n setRange({ from: date, to: range.from });\r\n } else {\r\n setRange({ from: date, to: range.to });\r\n }\r\n } else if (range?.from?.getTime() === date?.getTime() && (range?.from?.getTime() === range?.to?.getTime() || !range.to)) {\r\n setRange(undefined);\r\n } else if (\r\n range?.from?.getTime() !== range?.to?.getTime() &&\r\n (range.from?.getTime() === date?.getTime() || range?.to?.getTime() === date?.getTime())\r\n ) {\r\n setRange({ from: date, to: date });\r\n } else {\r\n setRange({ ...range, to: date });\r\n }\r\n };\r\n\r\n const handleCancel = () => {\r\n setIsOpen(false);\r\n setRange(selected);\r\n };\r\n\r\n const handleApply = () => {\r\n onSelect?.(range);\r\n setIsOpen(false);\r\n };\r\n\r\n return (\r\n <>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\r\n \"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100\",\r\n !selected && \"text-muted-foreground\",\r\n className,\r\n )}\r\n onClick={() => setIsOpen(true)}\r\n aria-label={\r\n selected\r\n ? `Selected date: ${selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"\"} - ${selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"\"}`\r\n : placeholder\r\n }\r\n disabled={disabled}\r\n >\r\n {selected ? (\r\n <div className=\"grid grid-cols-2 flex-1 justify-items-start\">\r\n <span>\r\n {fromText ?? \"From\"}: {selected?.from ? format(selected.from, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>{\" \"}\r\n <span>\r\n {toText ?? \"To\"}: {selected?.to ? format(selected.to, formatStr ?? \"yyyy/MM/dd\") : \"-\"}\r\n </span>\r\n </div>\r\n ) : (\r\n <span>{placeholder ?? \"Pick a Range\"}</span>\r\n )}\r\n <CalendarIcon className=\"mr-2 h-5 w-4 ms-auto\" />\r\n </Button>\r\n <Dialog open={isOpen} onOpenChange={handleCancel}>\r\n <DialogContent className=\"h-dscreen w-screen p-0 flex flex-col gap-0 data-[state=open]:animate-slide-from-bottom data-[state=closed]:animate-slide-to-bottom overflow-auto max-w-screen-2xl sm:rounded-none\">\r\n <DialogHeader>\r\n <DialogTitle asChild>\r\n <div className=\"grid grid-cols-2 border-b border-b-gray-200 mt-3\">\r\n <div className=\"text-sm font-bold space-y-1 border-e border-e-gray-200 p-4\">\r\n <h5 className=\"text-text-300 font-medium text-xs\">From</h5>\r\n <h6 className=\"\">{range?.from ? format(range.from, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n <div className=\"text-sm font-bold space-y-1 p-4 flex flex-col justify-center\">\r\n <h5 className=\"text-text-300 font-medium text-xs\">To</h5>\r\n <h6 className=\"\">{range?.to ? format(range.to, formatStr ?? \"eee, MMM dd\") : <pre> </pre>}</h6>\r\n </div>\r\n </div>\r\n </DialogTitle>\r\n <VisuallyHidden>\r\n <DialogDescription>{\"Date Picker\"}</DialogDescription>\r\n </VisuallyHidden>\r\n </DialogHeader>\r\n <div className=\"flex-1 flex flex-col items-center p-4\">\r\n <Calendar {...props} mode=\"range\" selected={selected} onDayClick={handleDayClick} className={cn(\"p-0\", calendarClassName)} />\r\n\r\n <div className=\"flex justify-center items-center gap-4 mt-auto w-full\">\r\n <Button variant=\"text\" className=\"flex-1 h-10\" onClick={handleCancel}>\r\n {cancelText ?? \"Cancel\"}\r\n </Button>\r\n <Button variant=\"primary\" className=\"flex-1 h-10\" onClick={handleApply}>\r\n {applyText ?? \"Apply\"}\r\n </Button>\r\n </div>\r\n </div>\r\n </DialogContent>\r\n </Dialog>\r\n </>\r\n );\r\n};\r\n\r\nexport { MobileDateRangePicker, type MobileDateRangePickerProps };\r\n"],"names":["MobileDateRangePicker","formatStr","selected","placeholder","className","calendarClassName","onDayClick","cancelText","applyText","onSelect","fromText","toText","disabled","props","isOpen","setIsOpen","React","range","setRange","handleDayClick","date","modifiers","e","handleCancel","handleApply","jsxs","Fragment","Button","cn","format","jsx","CalendarIcon","Dialog","DialogContent","DialogHeader","DialogTitle","VisuallyHidden","DialogDescription","Calendar"],"mappings":"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"}
package/dist/mobiletimepicker.es.js CHANGED
@@ -4,7 +4,7 @@ import { VisuallyHidden as m } from "@radix-ui/react-visually-hidden";
4
4
  import { cn as d } from "./utils.es.js";
5
5
  import { Button as u } from "./button.es.js";
6
6
  import { TimePickerContent as f } from "./timepickercontent.es.js";
7
- import { SwipableDrawer as h, SwipableDrawerContent as w, SwipableDrawerHeader as S, SwipableDrawerTitle as b, SwipableDrawerDescription as x } from "./swipabledrawer.es.js";
7
+ import { SwipableDrawer as b, SwipableDrawerContent as h, SwipableDrawerHeader as w, SwipableDrawerTitle as S, SwipableDrawerDescription as g } from "./swipabledrawer.es.js";
8
8
  const N = ({
9
9
  time: r,
10
10
  onTimeChange: n,
@@ -14,22 +14,22 @@ const N = ({
14
14
  ...s
15
15
  }) => {
16
16
  const [a, i] = c(!1);
17
- return /* @__PURE__ */ t(h, { open: a, onOpenChange: i, children: [
17
+ return /* @__PURE__ */ t(b, { open: a, onOpenChange: i, children: [
18
18
  /* @__PURE__ */ e(
19
19
  u,
20
20
  {
21
21
  variant: "outline",
22
- className: d("w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start", o),
22
+ className: d("w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100", o),
23
23
  onClick: () => i(!0),
24
24
  "aria-label": r?.hour ? `Selected time: ${r.hour}:${r.minute} ${r.ampm}` : p,
25
25
  ...s,
26
26
  children: `${r?.hour?.toString()?.padStart(2, "0") ?? "--"} : ${r?.minute?.toString()?.padStart(2, "0") ?? "--"} ${r?.ampm ?? "--"}`
27
27
  }
28
28
  ),
29
- /* @__PURE__ */ t(w, { children: [
30
- /* @__PURE__ */ e(S, { className: "p-0", children: /* @__PURE__ */ t(m, { children: [
31
- /* @__PURE__ */ e(b, { className: "text-primary text-lg font-bold text-start", children: " " }),
32
- /* @__PURE__ */ e(x, { children: " " })
29
+ /* @__PURE__ */ t(h, { children: [
30
+ /* @__PURE__ */ e(w, { className: "p-0", children: /* @__PURE__ */ t(m, { children: [
31
+ /* @__PURE__ */ e(S, { className: "text-primary text-lg font-bold text-start", children: " " }),
32
+ /* @__PURE__ */ e(g, { children: " " })
33
33
  ] }) }),
34
34
  /* @__PURE__ */ e(f, { isOpen: a, onTimeChange: n, time: r, slotsProps: l })
35
35
  ] })
package/dist/mobiletimepicker.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"mobiletimepicker.es.js","sources":["../src/components/date-picker/MobileTimePicker.tsx"],"sourcesContent":["import { HTMLAttributes, useState } from \"react\";\r\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Time, TimePickerContent } from \"./TimePickerContent\";\r\nimport {\r\n SwipableDrawer,\r\n SwipableDrawerContent,\r\n SwipableDrawerDescription,\r\n SwipableDrawerHeader,\r\n SwipableDrawerTitle,\r\n} from \"../drawer/SwipableDrawer\";\r\n\r\ntype MobileTimePickerProps = HTMLAttributes<HTMLButtonElement> & {\r\n time: Time | undefined;\r\n onTimeChange: (time: Time | undefined) => void;\r\n placeholder?: string;\r\n slotsProps?: {\r\n content?: HTMLAttributes<HTMLDivElement>;\r\n };\r\n};\r\n\r\nconst MobileTimePicker: React.FC<MobileTimePickerProps> = ({\r\n time,\r\n onTimeChange,\r\n className,\r\n slotsProps,\r\n placeholder = \"Pick a time\",\r\n ...restProps\r\n}) => {\r\n const [isOpen, setIsOpen] = useState(false);\r\n\r\n return (\r\n <SwipableDrawer open={isOpen} onOpenChange={setIsOpen}>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start\", className)}\r\n onClick={() => setIsOpen(true)}\r\n aria-label={time?.hour ? `Selected time: ${time.hour}:${time.minute} ${time.ampm}` : placeholder}\r\n {...restProps}\r\n >\r\n {`${time?.hour?.toString()?.padStart(2, \"0\") ?? \"--\"} : ${time?.minute?.toString()?.padStart(2, \"0\") ?? \"--\"} ${time?.ampm ?? \"--\"}`}\r\n </Button>\r\n <SwipableDrawerContent>\r\n <SwipableDrawerHeader className=\"p-0\">\r\n <VisuallyHidden>\r\n <SwipableDrawerTitle className=\"text-primary text-lg font-bold text-start\"> </SwipableDrawerTitle>\r\n <SwipableDrawerDescription> </SwipableDrawerDescription>\r\n </VisuallyHidden>\r\n </SwipableDrawerHeader>\r\n <TimePickerContent isOpen={isOpen} onTimeChange={onTimeChange} time={time} slotsProps={slotsProps} />\r\n </SwipableDrawerContent>\r\n </SwipableDrawer>\r\n );\r\n};\r\nexport { MobileTimePicker, type MobileTimePickerProps };\r\n"],"names":["MobileTimePicker","time","onTimeChange","className","slotsProps","placeholder","restProps","isOpen","setIsOpen","useState","jsxs","SwipableDrawer","jsx","Button","cn","SwipableDrawerContent","SwipableDrawerHeader","VisuallyHidden","SwipableDrawerTitle","SwipableDrawerDescription","TimePickerContent"],"mappings":";;;;;;;AAuBA,MAAMA,IAAoD,CAAC;AAAA,EACzD,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK;AAE1C,SACG,gBAAAC,EAAAC,GAAA,EAAe,MAAMJ,GAAQ,cAAcC,GAC1C,UAAA;AAAA,IAAA,gBAAAI;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWC,EAAG,uFAAuFX,CAAS;AAAA,QAC9G,SAAS,MAAMK,EAAU,EAAI;AAAA,QAC7B,cAAYP,GAAM,OAAO,kBAAkBA,EAAK,IAAI,IAAIA,EAAK,MAAM,IAAIA,EAAK,IAAI,KAAKI;AAAA,QACpF,GAAGC;AAAA,QAEH,UAAA,GAAGL,GAAM,MAAM,SAAA,GAAY,SAAS,GAAG,GAAG,KAAK,IAAI,MAAMA,GAAM,QAAQ,SAAA,GAAY,SAAS,GAAG,GAAG,KAAK,IAAI,IAAIA,GAAM,QAAQ,IAAI;AAAA,MAAA;AAAA,IACpI;AAAA,sBACCc,GACC,EAAA,UAAA;AAAA,MAAA,gBAAAH,EAACI,GAAqB,EAAA,WAAU,OAC9B,UAAA,gBAAAN,EAACO,GACC,EAAA,UAAA;AAAA,QAAC,gBAAAL,EAAAM,GAAA,EAAoB,WAAU,6CAA4C,UAAC,KAAA;AAAA,QAC5E,gBAAAN,EAACO,KAA0B,UAAC,IAAA,CAAA;AAAA,MAAA,EAAA,CAC9B,EACF,CAAA;AAAA,MACC,gBAAAP,EAAAQ,GAAA,EAAkB,QAAAb,GAAgB,cAAAL,GAA4B,MAAAD,GAAY,YAAAG,EAAwB,CAAA;AAAA,IAAA,EACrG,CAAA;AAAA,EAAA,GACF;AAEJ;"}
1
+ {"version":3,"file":"mobiletimepicker.es.js","sources":["../src/components/date-picker/MobileTimePicker.tsx"],"sourcesContent":["import { HTMLAttributes, useState } from \"react\";\r\nimport { VisuallyHidden } from \"@radix-ui/react-visually-hidden\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Time, TimePickerContent } from \"./TimePickerContent\";\r\nimport {\r\n SwipableDrawer,\r\n SwipableDrawerContent,\r\n SwipableDrawerDescription,\r\n SwipableDrawerHeader,\r\n SwipableDrawerTitle,\r\n} from \"../drawer/SwipableDrawer\";\r\n\r\ntype MobileTimePickerProps = HTMLAttributes<HTMLButtonElement> & {\r\n time: Time | undefined;\r\n onTimeChange: (time: Time | undefined) => void;\r\n placeholder?: string;\r\n disabled?: boolean;\r\n slotsProps?: {\r\n content?: HTMLAttributes<HTMLDivElement>;\r\n };\r\n};\r\n\r\nconst MobileTimePicker: React.FC<MobileTimePickerProps> = ({\r\n time,\r\n onTimeChange,\r\n className,\r\n slotsProps,\r\n placeholder = \"Pick a time\",\r\n ...restProps\r\n}) => {\r\n const [isOpen, setIsOpen] = useState(false);\r\n\r\n return (\r\n <SwipableDrawer open={isOpen} onOpenChange={setIsOpen}>\r\n <Button\r\n variant={\"outline\"}\r\n className={cn(\"w-full border-gray-300 text-text focus:ring-0 active:ring-transparent justify-start disabled:bg-gray-100\", className)}\r\n onClick={() => setIsOpen(true)}\r\n aria-label={time?.hour ? `Selected time: ${time.hour}:${time.minute} ${time.ampm}` : placeholder}\r\n {...restProps}\r\n >\r\n {`${time?.hour?.toString()?.padStart(2, \"0\") ?? \"--\"} : ${time?.minute?.toString()?.padStart(2, \"0\") ?? \"--\"} ${time?.ampm ?? \"--\"}`}\r\n </Button>\r\n <SwipableDrawerContent>\r\n <SwipableDrawerHeader className=\"p-0\">\r\n <VisuallyHidden>\r\n <SwipableDrawerTitle className=\"text-primary text-lg font-bold text-start\"> </SwipableDrawerTitle>\r\n <SwipableDrawerDescription> </SwipableDrawerDescription>\r\n </VisuallyHidden>\r\n </SwipableDrawerHeader>\r\n <TimePickerContent isOpen={isOpen} onTimeChange={onTimeChange} time={time} slotsProps={slotsProps} />\r\n </SwipableDrawerContent>\r\n </SwipableDrawer>\r\n );\r\n};\r\nexport { MobileTimePicker, type MobileTimePickerProps };\r\n"],"names":["MobileTimePicker","time","onTimeChange","className","slotsProps","placeholder","restProps","isOpen","setIsOpen","useState","jsxs","SwipableDrawer","jsx","Button","cn","SwipableDrawerContent","SwipableDrawerHeader","VisuallyHidden","SwipableDrawerTitle","SwipableDrawerDescription","TimePickerContent"],"mappings":";;;;;;;AAwBA,MAAMA,IAAoD,CAAC;AAAA,EACzD,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK;AAE1C,SACG,gBAAAC,EAAAC,GAAA,EAAe,MAAMJ,GAAQ,cAAcC,GAC1C,UAAA;AAAA,IAAA,gBAAAI;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWC,EAAG,4GAA4GX,CAAS;AAAA,QACnI,SAAS,MAAMK,EAAU,EAAI;AAAA,QAC7B,cAAYP,GAAM,OAAO,kBAAkBA,EAAK,IAAI,IAAIA,EAAK,MAAM,IAAIA,EAAK,IAAI,KAAKI;AAAA,QACpF,GAAGC;AAAA,QAEH,UAAA,GAAGL,GAAM,MAAM,SAAA,GAAY,SAAS,GAAG,GAAG,KAAK,IAAI,MAAMA,GAAM,QAAQ,SAAA,GAAY,SAAS,GAAG,GAAG,KAAK,IAAI,IAAIA,GAAM,QAAQ,IAAI;AAAA,MAAA;AAAA,IACpI;AAAA,sBACCc,GACC,EAAA,UAAA;AAAA,MAAA,gBAAAH,EAACI,GAAqB,EAAA,WAAU,OAC9B,UAAA,gBAAAN,EAACO,GACC,EAAA,UAAA;AAAA,QAAC,gBAAAL,EAAAM,GAAA,EAAoB,WAAU,6CAA4C,UAAC,KAAA;AAAA,QAC5E,gBAAAN,EAACO,KAA0B,UAAC,IAAA,CAAA;AAAA,MAAA,EAAA,CAC9B,EACF,CAAA;AAAA,MACC,gBAAAP,EAAAQ,GAAA,EAAkB,QAAAb,GAAgB,cAAAL,GAA4B,MAAAD,GAAY,YAAAG,EAAwB,CAAA;AAAA,IAAA,EACrG,CAAA;AAAA,EAAA,GACF;AAEJ;"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@trsys-tech/matrix-library",
3
3
  "description": "MatrixUI Library",
4
4
  "private": false,
5
- "version": "0.3.2",
5
+ "version": "0.3.3",
6
6
  "type": "module",
7
7
  "main": "dist/index.js",
8
8
  "module": "dist/index.es.js",