contests

src/components/button/PrimaryButton.tsx

@@ -5,7 +5,7 @@ interface ButtonProps {
     disabled?: boolean;
     text?: string;
     className?: string;
-    onClick: () => void;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
     children?: React.ReactNode;
     color?: 'primary' | 'secondary' | 'error' | 'warning' | 'success';
 }
@@ -60,8 +60,10 @@ export const PrimaryButton: React.FC<ButtonProps> = ({
                         '[&:focus-visible+*]:outline-liquid-brightmain',
                     )}
                     disabled={disabled}
-                    onClick={() => {
-                        onClick();
+                    onClick={(
+                        e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
+                    ) => {
+                        onClick(e);
                     }}
                 />
 

src/components/button/ReverseButton.tsx

@@ -5,7 +5,7 @@ interface ButtonProps {
     disabled?: boolean;
     text?: string;
     className?: string;
-    onClick: () => void;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
     children?: React.ReactNode;
 }
 
@@ -42,8 +42,10 @@ export const ReverseButton: React.FC<ButtonProps> = ({
                         '[&:focus-visible+*]:outline-liquid-brightmain',
                     )}
                     disabled={disabled}
-                    onClick={() => {
-                        onClick();
+                    onClick={(
+                        e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
+                    ) => {
+                        onClick(e);
                     }}
                 />
 

src/components/button/SecondaryButton.tsx

@@ -5,7 +5,7 @@ interface ButtonProps {
     disabled?: boolean;
     text?: string;
     className?: string;
-    onClick: () => void;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
     children?: React.ReactNode;
 }
 
@@ -41,8 +41,8 @@ export const SecondaryButton: React.FC<ButtonProps> = ({
                         '[&:focus-visible+*]:outline-liquid-brightmain',
                     )}
                     disabled={disabled}
-                    onClick={() => {
-                        onClick();
+                    onClick={(e) => {
+                        onClick(e);
                     }}
                 />
 

src/components/input/DateRangeInput.tsx

@@ -0,0 +1,48 @@
+import React from 'react';
+
+interface DateRangeInputProps {
+    startLabel?: string;
+    endLabel?: string;
+    startValue?: string;
+    endValue?: string;
+    onChange: (field: 'startsAt' | 'endsAt', value: string) => void;
+    className?: string;
+}
+
+const DateRangeInput: React.FC<DateRangeInputProps> = ({
+    startLabel = 'Дата начала',
+    endLabel = 'Дата окончания',
+    startValue,
+    endValue,
+    onChange,
+    className = '',
+}) => {
+    return (
+        <div className={`flex flex-col gap-2 ${className}`}>
+            <div>
+                <label className="block text-sm font-medium text-gray-700">
+                    {startLabel}
+                </label>
+                <input
+                    type="datetime-local"
+                    value={startValue}
+                    onChange={(e) => onChange('startsAt', e.target.value)}
+                    className="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm"
+                />
+            </div>
+            <div>
+                <label className="block text-sm font-medium text-gray-700">
+                    {endLabel}
+                </label>
+                <input
+                    type="datetime-local"
+                    value={endValue}
+                    onChange={(e) => onChange('endsAt', e.target.value)}
+                    className="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm"
+                />
+            </div>
+        </div>
+    );
+};
+
+export default DateRangeInput;