@mbao01/common 0.0.30 → 0.0.32

package/dist/types/components/DatePicker/DatePicker.d.ts

@@ -1,2 +1,2 @@
 import { type DatePickerProps } from "./types";
-export declare const DatePicker: ({ name, size, wide, label, outline, variant, disabled, defaultDate, children, getDateValue, getDateLabel, ...props }: DatePickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DatePicker: ({ name, size, wide, label, outline, variant, disabled, defaultDate, children, getDateValue, getDateLabel, triggerClassName, ...props }: DatePickerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/DatePicker/DateRangePicker.d.ts

@@ -1,2 +1,2 @@
 import { type DateRangePickerProps } from "./types";
-export declare const DateRangePicker: ({ name, size, wide, label, outline, variant, disabled, defaultRange, getRangeValue, getRangeLabel, ...props }: DateRangePickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DateRangePicker: ({ name, size, wide, label, outline, variant, disabled, defaultRange, getRangeValue, getRangeLabel, triggerClassName, ...props }: DateRangePickerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/DatePicker/types.d.ts

@@ -3,8 +3,9 @@ import { DateRange, DayPickerMultipleProps, DayPickerRangeProps, DayPickerSingle
 import { ButtonProps } from "../Button/types";
 type BaseDatePickerProps = Pick<ButtonProps, "variant" | "outline" | "wide" | "size" | "name" | "disabled"> & {
     label?: string;
+    triggerClassName?: string;
 };
-export type DatePickerProps = BaseDatePickerProps & Omit<DayPickerSingleProps, "mode" | "selected" | "onSelect"> & {
+export type DatePickerProps = BaseDatePickerProps & Omit<DayPickerSingleProps, "mode"> & {
     children?: ({ date, setDate, }: {
         date: Date | undefined;
         setDate: React.Dispatch<React.SetStateAction<Date | undefined>>;
@@ -13,7 +14,7 @@ export type DatePickerProps = BaseDatePickerProps & Omit<DayPickerSingleProps, "
     getDateLabel?: (date: Date | undefined) => string | undefined;
     getDateValue?: (date: Date | undefined) => string | undefined;
 };
-export type DateRangePickerProps = BaseDatePickerProps & Omit<DayPickerRangeProps, "mode" | "selected" | "onSelect"> & {
+export type DateRangePickerProps = BaseDatePickerProps & Omit<DayPickerRangeProps, "mode"> & {
     defaultRange?: DateRange;
     getRangeValue?: (range: DateRange | undefined) => {
         from: string | undefined;
@@ -21,7 +22,7 @@ export type DateRangePickerProps = BaseDatePickerProps & Omit<DayPickerRangeProp
     };
     getRangeLabel?: (range: DateRange | undefined) => string | JSX.Element | undefined;
 };
-export type MultipleDatesPickerProps = BaseDatePickerProps & Omit<DayPickerMultipleProps, "mode" | "selected" | "onSelect"> & {
+export type MultipleDatesPickerProps = BaseDatePickerProps & Omit<DayPickerMultipleProps, "mode"> & {
     defaultDates?: Date[];
     getDatesValue?: (dates: Date[] | undefined) => string[] | undefined;
     getDatesLabel?: (dates: Date[] | undefined) => string | JSX.Element | undefined;

package/dist/types/components/ScrollArea/index.d.ts

@@ -1 +1 @@
-export { ScrollArea } from "./ScrollArea";
+export { ScrollArea, Scrollbar } from "./ScrollArea";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mbao01/common",
   "private": false,
-  "version": "0.0.30",
+  "version": "0.0.32",
   "type": "module",
   "author": "Ayomide Bakare",
   "license": "MIT",
@@ -142,5 +142,5 @@
     "react-dom": "^18.2.0",
     "typescript": "^5.2.2"
   },
-  "gitHead": "1ab357d82f27002c7a0fe7211a39248077ce33d3"
+  "gitHead": "3646dbdb6bcfc492b8ec63094f6d16f98c73d4dc"
 }

package/src/components/DatePicker/DatePicker.tsx

@@ -21,6 +21,7 @@ export const DatePicker = ({
   children,
   getDateValue = (date) => date?.toUTCString(),
   getDateLabel = (date) => (date ? format(date, "PPP") : undefined),
+  triggerClassName,
   ...props
 }: DatePickerProps) => {
   const [date, setDate] = useState<Date | undefined>(defaultDate);
@@ -49,7 +50,11 @@ export const DatePicker = ({
           outline={outline}
           variant={variant}
           disabled={disabled}
-          className={cn("justify-start", !date && "font-normal")}
+          className={cn(
+            "justify-start",
+            !date && "font-normal",
+            triggerClassName
+          )}
           value={dateValue}
         >
           {dateLabel ?? <span>{label ?? "Pick a date"}</span>}

package/src/components/DatePicker/DateRangePicker.tsx

@@ -33,6 +33,7 @@ export const DateRangePicker = ({
         format(range.from, "LLL dd, y")
       )
     ) : undefined,
+  triggerClassName,
   ...props
 }: DateRangePickerProps) => {
   const [range, setRange] = useState<DateRange | undefined>(defaultRange);
@@ -68,9 +69,13 @@ export const DateRangePicker = ({
           outline={outline}
           variant={variant}
           disabled={disabled}
-          className={cn("justify-start flex-nowrap", !range && "font-normal")}
+          className={cn(
+            "justify-start flex-nowrap",
+            !range && "font-normal",
+            triggerClassName
+          )}
         >
-          <span className="text-left line-clamp-1">
+          <span className="text-left text-ellipsis overflow-hidden text-nowrap">
             {rangeLabel ?? label ?? "Pick a range"}
           </span>
           <CalendarIcon className="ml-auto h-4 w-4 opacity-50" />

package/src/components/DatePicker/MultipleDatesPicker.tsx

@@ -59,7 +59,7 @@ export const MultipleDatesPicker = ({
             !dates?.length && "font-normal"
           )}
         >
-          <span className="text-left line-clamp-1">
+          <span className="text-left text-ellipsis overflow-hidden text-nowrap">
             {rangeLabel ?? label ?? "Pick one or more dates"}
           </span>
           <CalendarIcon className="ml-auto h-4 w-4 opacity-50" />

package/src/components/DatePicker/types.ts

@@ -11,10 +11,11 @@ type BaseDatePickerProps = Pick<
   "variant" | "outline" | "wide" | "size" | "name" | "disabled"
 > & {
   label?: string;
+  triggerClassName?: string;
 };
 
 export type DatePickerProps = BaseDatePickerProps &
-  Omit<DayPickerSingleProps, "mode" | "selected" | "onSelect"> & {
+  Omit<DayPickerSingleProps, "mode"> & {
     children?: ({
       date,
       setDate,
@@ -28,7 +29,7 @@ export type DatePickerProps = BaseDatePickerProps &
   };
 
 export type DateRangePickerProps = BaseDatePickerProps &
-  Omit<DayPickerRangeProps, "mode" | "selected" | "onSelect"> & {
+  Omit<DayPickerRangeProps, "mode"> & {
     defaultRange?: DateRange;
     getRangeValue?: (range: DateRange | undefined) => {
       from: string | undefined;
@@ -40,7 +41,7 @@ export type DateRangePickerProps = BaseDatePickerProps &
   };
 
 export type MultipleDatesPickerProps = BaseDatePickerProps &
-  Omit<DayPickerMultipleProps, "mode" | "selected" | "onSelect"> & {
+  Omit<DayPickerMultipleProps, "mode"> & {
     defaultDates?: Date[];
     getDatesValue?: (dates: Date[] | undefined) => string[] | undefined;
     getDatesLabel?: (

package/src/components/ScrollArea/index.ts

@@ -1 +1 @@
-export { ScrollArea } from "./ScrollArea";
+export { ScrollArea, Scrollbar } from "./ScrollArea";