build and format
This commit is contained in:
@@ -2,8 +2,8 @@
|
||||
import MainMap from "@/components/MainMap";
|
||||
import { motion, AnimatePresence } from "framer-motion";
|
||||
import LocationMarker from "./LocationMarker";
|
||||
import {useModalStore} from "@/stores/useModalStore";
|
||||
import {CloseIcon} from "@/assets";
|
||||
import { useModalStore } from "@/stores/useModalStore";
|
||||
import { CloseIcon } from "@/assets";
|
||||
import MarkerPosition from "@/components/Home/MarkerPosition";
|
||||
|
||||
const backdropVariants = {
|
||||
|
||||
@@ -7,7 +7,7 @@ import DatePickerField from "@/components/UI/DatePickerField";
|
||||
const options = [
|
||||
{ label: "Home", value: "home" },
|
||||
{ label: "Search", value: "search" },
|
||||
]
|
||||
];
|
||||
|
||||
export default function SearchBar() {
|
||||
const openModal = useModalStore((s) => s.openModal);
|
||||
@@ -26,16 +26,21 @@ export default function SearchBar() {
|
||||
|
||||
{/* تاریخ */}
|
||||
<SearchItem icon={<CalenderIcon className="size-5" />}>
|
||||
<DatePickerField name="bill_of_lading_date" setValue={()=>{
|
||||
console.log("hello DatePickerField")}} />
|
||||
<DatePickerField
|
||||
name="bill_of_lading_date"
|
||||
setValue={() => {
|
||||
console.log("hello DatePickerField");
|
||||
}}
|
||||
/>
|
||||
</SearchItem>
|
||||
|
||||
{/* دسته بندی */}
|
||||
<SearchItem icon={<SearchIcon className="size-5" />}>
|
||||
<NoFormSelect
|
||||
value={""}
|
||||
onChange={()=>{
|
||||
console.log("hello")}}
|
||||
onChange={() => {
|
||||
console.log("hello");
|
||||
}}
|
||||
options={options}
|
||||
loading={false}
|
||||
error={null}
|
||||
|
||||
@@ -8,9 +8,7 @@ const createMarkerElement = (preview: boolean) => {
|
||||
const el = document.createElement("div");
|
||||
const Icon = preview ? MarkerPreviewIcon : MarkerIcon;
|
||||
|
||||
el.innerHTML = renderToStaticMarkup(
|
||||
<Icon className="size-10 text-neo-aqua" />
|
||||
);
|
||||
el.innerHTML = renderToStaticMarkup(<Icon className="text-neo-aqua size-10" />);
|
||||
|
||||
return el;
|
||||
};
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
import MainMap from "@/components/MainMap";
|
||||
import { motion, AnimatePresence } from "framer-motion";
|
||||
import LocationMarker from "./LocationMarker";
|
||||
import {useModalStore} from "@/stores/useModalStore";
|
||||
import {CloseIcon} from "@/assets";
|
||||
import { useModalStore } from "@/stores/useModalStore";
|
||||
import { CloseIcon } from "@/assets";
|
||||
import MarkerPosition from "@/components/Home/MarkerPosition";
|
||||
|
||||
const backdropVariants = {
|
||||
|
||||
@@ -7,7 +7,7 @@ import DatePickerField from "@/components/UI/DatePickerField";
|
||||
const options = [
|
||||
{ label: "Home", value: "home" },
|
||||
{ label: "Search", value: "search" },
|
||||
]
|
||||
];
|
||||
|
||||
export default function SearchBar() {
|
||||
const openModal = useModalStore((s) => s.openModal);
|
||||
@@ -26,16 +26,21 @@ export default function SearchBar() {
|
||||
|
||||
{/* تاریخ */}
|
||||
<SearchItem icon={<CalenderIcon className="size-5" />}>
|
||||
<DatePickerField name="bill_of_lading_date" setValue={()=>{
|
||||
console.log("hello DatePickerField")}} />
|
||||
<DatePickerField
|
||||
name="bill_of_lading_date"
|
||||
setValue={() => {
|
||||
console.log("hello DatePickerField");
|
||||
}}
|
||||
/>
|
||||
</SearchItem>
|
||||
|
||||
{/* دسته بندی */}
|
||||
<SearchItem icon={<SearchIcon className="size-5" />}>
|
||||
<NoFormSelect
|
||||
value={""}
|
||||
onChange={()=>{
|
||||
console.log("hello")}}
|
||||
onChange={() => {
|
||||
console.log("hello");
|
||||
}}
|
||||
options={options}
|
||||
loading={false}
|
||||
error={null}
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
|
||||
export default function MobileHome() {
|
||||
return (
|
||||
<div className="h-full w-full">
|
||||
</div>
|
||||
);
|
||||
return <div className="h-full w-full"></div>;
|
||||
}
|
||||
|
||||
@@ -48,9 +48,7 @@ export default function DatePickerField<T extends Record<string, any>>({
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setOpen(true)}
|
||||
className={
|
||||
"text-black rounded-lg px-3 text-start focus:outline-none"
|
||||
}
|
||||
className={"rounded-lg px-3 text-start text-black focus:outline-none"}
|
||||
>
|
||||
{date ? formatJalali(date) : "تاریخ"}
|
||||
</button>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
"use client";
|
||||
import React from "react";
|
||||
import {Select, SelectTrigger, SelectValue, SelectContent, SelectItem} from "@/components/UI/Select";
|
||||
import {motion} from "framer-motion";
|
||||
import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from "@/components/UI/Select";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
interface Option {
|
||||
value: string | number;
|
||||
@@ -19,14 +19,14 @@ interface ReusableSelectProps {
|
||||
}
|
||||
|
||||
const NoFormSelect: React.FC<ReusableSelectProps> = ({
|
||||
value,
|
||||
onChange,
|
||||
options,
|
||||
loading = false,
|
||||
error = null,
|
||||
placeholder = "انتخاب کنید",
|
||||
onOpen,
|
||||
}) => {
|
||||
value,
|
||||
onChange,
|
||||
options,
|
||||
loading = false,
|
||||
error = null,
|
||||
placeholder = "انتخاب کنید",
|
||||
onOpen,
|
||||
}) => {
|
||||
return (
|
||||
<Select
|
||||
value={value?.toString() || ""}
|
||||
@@ -35,13 +35,10 @@ const NoFormSelect: React.FC<ReusableSelectProps> = ({
|
||||
if (open && onOpen) onOpen();
|
||||
}}
|
||||
>
|
||||
<SelectTrigger
|
||||
className={`"text-black placeholder-black w-full overflow-x-scroll rounded-lg `}
|
||||
>
|
||||
<SelectValue placeholder={placeholder}/>
|
||||
<SelectTrigger className={`"text-black w-full overflow-x-scroll rounded-lg placeholder-black`}>
|
||||
<SelectValue placeholder={placeholder} />
|
||||
</SelectTrigger>
|
||||
<SelectContent
|
||||
className="bg-card overflow-y-auto rounded-xl border-0 shadow-lg">
|
||||
<SelectContent className="bg-card overflow-y-auto rounded-xl border-0 shadow-lg">
|
||||
{loading && (
|
||||
<SelectItem value="loading" disabled>
|
||||
در حال بارگذاری...
|
||||
@@ -55,8 +52,8 @@ const NoFormSelect: React.FC<ReusableSelectProps> = ({
|
||||
{!loading && !error && (
|
||||
<>
|
||||
<motion.div
|
||||
whileHover={{scale: 1.05}}
|
||||
whileTap={{scale: 0.95}}
|
||||
whileHover={{ scale: 1.05 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
className="rounded px-2 py-1"
|
||||
>
|
||||
<SelectItem
|
||||
@@ -69,8 +66,8 @@ const NoFormSelect: React.FC<ReusableSelectProps> = ({
|
||||
{options.map((opt) => (
|
||||
<motion.div
|
||||
key={opt.value}
|
||||
whileHover={{scale: 1.05}}
|
||||
whileTap={{scale: 0.95}}
|
||||
whileHover={{ scale: 1.05 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
className="rounded px-2 py-1"
|
||||
>
|
||||
<SelectItem
|
||||
|
||||
@@ -25,7 +25,7 @@ function SelectTrigger({
|
||||
data-slot="select-trigger"
|
||||
data-size={size}
|
||||
className={cn(
|
||||
"data-[placeholder]:text-black [&_svg:not([class*='text-'])]:text-black dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md bg-transparent px-3 text-sm whitespace-nowrap transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-7 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
||||
"dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md bg-transparent px-3 text-sm whitespace-nowrap transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-black data-[size=default]:h-7 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-black",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
|
||||
Reference in New Issue
Block a user