status añadido, cambios en el responsive al ver el producto
This commit is contained in:
@@ -0,0 +1,8 @@
|
||||
DROP VIEW "public"."v_product_store";--> statement-breakpoint
|
||||
ALTER TABLE "products" ALTER COLUMN "price" SET DEFAULT '0';--> statement-breakpoint
|
||||
ALTER TABLE "products" ALTER COLUMN "stock" SET DEFAULT 0;--> statement-breakpoint
|
||||
ALTER TABLE "products" ADD COLUMN "status" text DEFAULT 'BORRADOR' NOT NULL;--> statement-breakpoint
|
||||
CREATE VIEW "public"."v_product_store" AS (
|
||||
select p.id as product_id, p.title, p.description, p.price, p.stock, p.url_img, p.address, p.status, p.user_id, u.fullname, u.email, u.phone
|
||||
from products p
|
||||
left join auth.users as u on u.id = p.user_id);
|
||||
1537
apps/api/src/database/migrations/meta/0006_snapshot.json
Normal file
1537
apps/api/src/database/migrations/meta/0006_snapshot.json
Normal file
File diff suppressed because it is too large
Load Diff
@@ -43,6 +43,13 @@
|
||||
"when": 1752500607554,
|
||||
"tag": "0005_little_bloodscream",
|
||||
"breakpoints": true
|
||||
},
|
||||
{
|
||||
"idx": 6,
|
||||
"version": "7",
|
||||
"when": 1752507413748,
|
||||
"tag": "0006_real_tyger_tiger",
|
||||
"breakpoints": true
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -9,10 +9,11 @@ export const products = t.pgTable(
|
||||
id: t.serial('id').primaryKey(),
|
||||
title: t.text('title').notNull(),
|
||||
description: t.text('description').notNull(),
|
||||
price: t.numeric('price').notNull(),
|
||||
stock: t.integer('stock').notNull(),
|
||||
price: t.numeric('price').notNull().default('0'),
|
||||
stock: t.integer('stock').notNull().default(0),
|
||||
address: t.text('address').notNull(),
|
||||
urlImg: t.text('url_img').notNull(),
|
||||
status: t.text('status').notNull().default('BORRADOR'),
|
||||
userId: t.integer('user_id').references(() => users.id, { onDelete: 'cascade' }).notNull(),
|
||||
...timestamps,
|
||||
}
|
||||
@@ -26,11 +27,12 @@ export const viewProductsStore = t.pgView('v_product_store', {
|
||||
stock: t.integer('stock'),
|
||||
urlImg: t.text('url_img'),
|
||||
address: t.text('address'),
|
||||
status: t.text('status'),
|
||||
userId: t.integer('user_id'),
|
||||
fullname: t.text('fullname'),
|
||||
email: t.text('email'),
|
||||
phone: t.text('phone')
|
||||
}).as(sql`
|
||||
select p.id as product_id, p.title, p.description, p.price, p.stock, p.url_img, p.address, p.user_id, u.fullname, u.email, u.phone
|
||||
select p.id as product_id, p.title, p.description, p.price, p.stock, p.url_img, p.address, p.status, p.user_id, u.fullname, u.email, u.phone
|
||||
from products p
|
||||
left join auth.users as u on u.id = p.user_id`);
|
||||
@@ -7,19 +7,31 @@ export async function seedProducts(db: NodePgDatabase<typeof schema>) {
|
||||
console.log('Seeding example product...');
|
||||
|
||||
// Insert inventory
|
||||
const array = [{title:'manzana',description:'fruta roja',price:'100',urlImg:'apple.avif',address:"Calle 1",userId:1,stock:0}];
|
||||
const array = [
|
||||
{
|
||||
title:'manzana',
|
||||
description:'Fruta pequeña y roja, extraída de los árboles de nuestra fundación, de increíble sabor',
|
||||
price:'100',
|
||||
stock:10,
|
||||
address:"Calle 1",
|
||||
status:'PUBLICADO', // PUBLICADO, AGOTADO, BORRADOR
|
||||
urlImg:'apple.avif',
|
||||
userId:1
|
||||
}
|
||||
];
|
||||
|
||||
for (const item of array) {
|
||||
try {
|
||||
await db.insert(products).values({
|
||||
title: item.title,
|
||||
description: item.description,
|
||||
price: item.price,
|
||||
stock: item.stock,
|
||||
address: item.address,
|
||||
urlImg: item.urlImg,
|
||||
userId: item.userId
|
||||
}).onConflictDoNothing();
|
||||
// await db.insert(products).values({
|
||||
// title: item.title,
|
||||
// description: item.description,
|
||||
// price: item.price,
|
||||
// stock: item.stock,
|
||||
// address: item.address,
|
||||
// urlImg: item.urlImg,
|
||||
// userId: item.userId
|
||||
// }).onConflictDoNothing();
|
||||
await db.insert(products).values(item).onConflictDoNothing();
|
||||
} catch (error) {
|
||||
console.error(`Error creating products '${item.title}':`, error);
|
||||
}
|
||||
|
||||
@@ -32,10 +32,17 @@ export class CreateProductDto {
|
||||
address: string;
|
||||
|
||||
@ApiProperty()
|
||||
@IsInt({
|
||||
message: 'stock must be a number',
|
||||
@IsString({
|
||||
message: 'address must be a string',
|
||||
})
|
||||
@IsOptional()
|
||||
status: string;
|
||||
|
||||
@ApiProperty()
|
||||
@IsInt({
|
||||
message: 'userID must be a number',
|
||||
})
|
||||
// @IsOptional()
|
||||
userId: number;
|
||||
|
||||
@ApiProperty()
|
||||
|
||||
@@ -20,6 +20,9 @@ export class UpdateProductDto extends PartialType(CreateProductDto) {
|
||||
@IsOptional()
|
||||
address: string;
|
||||
|
||||
@IsOptional()
|
||||
status: string;
|
||||
|
||||
@IsOptional()
|
||||
urlImg: string;
|
||||
}
|
||||
|
||||
@@ -16,7 +16,7 @@ export class UsersController {
|
||||
@ApiOperation({ summary: 'Get all products with pagination and filters' })
|
||||
@ApiResponse({ status: 200, description: 'Return paginated products.' })
|
||||
async findAll(@Query() paginationDto: PaginationDto) {
|
||||
const result = await this.inventoryService.findAll(paginationDto);
|
||||
const result = await this.inventoryService.findAll(paginationDto,true);
|
||||
return {
|
||||
message: 'products fetched successfully',
|
||||
data: result.data,
|
||||
|
||||
@@ -56,6 +56,7 @@ export class InventoryService {
|
||||
address: products.address,
|
||||
price: products.price,
|
||||
stock: products.stock,
|
||||
status: products.status,
|
||||
urlImg: products.urlImg
|
||||
})
|
||||
.from(products)
|
||||
@@ -78,7 +79,7 @@ export class InventoryService {
|
||||
return { data, meta };
|
||||
}
|
||||
|
||||
async findAll(paginationDto?: PaginationDto): Promise<{ data: Store[], meta: any }> {
|
||||
async findAll(paginationDto?: PaginationDto, isStore: boolean = false): Promise<{ data: Store[], meta: any }> {
|
||||
const { page = 1, limit = 10, search = '', sortBy = 'id', sortOrder = 'asc' } = paginationDto || {};
|
||||
|
||||
// Calculate offset
|
||||
@@ -86,11 +87,21 @@ export class InventoryService {
|
||||
|
||||
// Build search condition
|
||||
let searchCondition: SQL<unknown> | undefined;
|
||||
if (search) {
|
||||
searchCondition = or(
|
||||
if (search && isStore) {
|
||||
searchCondition = and(
|
||||
or(
|
||||
like(viewProductsStore.title, `%${search}%`),
|
||||
like(viewProductsStore.description, `%${search}%`),
|
||||
);
|
||||
like(viewProductsStore.description, `%${search}%`)
|
||||
),
|
||||
or(eq(viewProductsStore.status, 'PUBLICADO'), eq(viewProductsStore.status, 'AGOTADO'))
|
||||
)
|
||||
} else if(search){
|
||||
or(
|
||||
like(viewProductsStore.title, `%${search}%`),
|
||||
like(viewProductsStore.description, `%${search}%`)
|
||||
)
|
||||
} else if(isStore){
|
||||
searchCondition = or(eq(viewProductsStore.status, 'PUBLICADO'), eq(viewProductsStore.status, 'AGOTADO'))
|
||||
}
|
||||
|
||||
// Build sort condition
|
||||
@@ -117,6 +128,7 @@ export class InventoryService {
|
||||
address: viewProductsStore.address,
|
||||
urlImg: viewProductsStore.urlImg,
|
||||
stock: viewProductsStore.stock,
|
||||
status: viewProductsStore.status,
|
||||
userId: viewProductsStore.userId,
|
||||
fullname: viewProductsStore.fullname,
|
||||
email: viewProductsStore.email,
|
||||
@@ -152,6 +164,7 @@ export class InventoryService {
|
||||
address: viewProductsStore.address,
|
||||
urlImg: viewProductsStore.urlImg,
|
||||
stock: viewProductsStore.stock,
|
||||
status: viewProductsStore.status,
|
||||
userId: viewProductsStore.userId,
|
||||
fullname: viewProductsStore.fullname,
|
||||
email: viewProductsStore.email,
|
||||
@@ -185,6 +198,7 @@ export class InventoryService {
|
||||
address: createProductDto.address,
|
||||
urlImg: createProductDto.urlImg,
|
||||
stock: createProductDto.stock,
|
||||
status: createProductDto.status,
|
||||
userId: createProductDto.userId
|
||||
})
|
||||
.returning();
|
||||
@@ -194,6 +208,7 @@ export class InventoryService {
|
||||
|
||||
async update(id: string, updateProductDto: UpdateProductDto): Promise<Product> {
|
||||
const productId = parseInt(id);
|
||||
console.log(updateProductDto);
|
||||
|
||||
// Check if exists
|
||||
await this.findOne(id);
|
||||
@@ -204,6 +219,7 @@ export class InventoryService {
|
||||
if (updateProductDto.description) updateData.description = updateProductDto.description;
|
||||
if (updateProductDto.price) updateData.price = updateProductDto.price;
|
||||
if (updateProductDto.address) updateData.address = updateProductDto.address;
|
||||
if (updateProductDto.status) updateData.status = updateProductDto.status;
|
||||
if (updateProductDto.stock) updateData.stock = updateProductDto.stock;
|
||||
if (updateProductDto.urlImg) updateData.urlImg = updateProductDto.urlImg;
|
||||
|
||||
|
||||
@@ -40,34 +40,36 @@ export default async function SurveyResponsePage({
|
||||
|
||||
return (
|
||||
// <PageContainer>
|
||||
<main className='p-4 md:px-6 flex flex-col md:flex-row gap-4 md:relative'>
|
||||
<main className='px-4 lg:px-6 flex flex-col md:flex-row gap-3 lg:gap-4 md:relative'>
|
||||
<img
|
||||
className="border-2 object-cover w-full h-full aspect-square rounded-2xl"
|
||||
className="border-2 object-cover w-full f-full min-h-[400px] md:h-[85vh] aspect-square rounded-2xl"
|
||||
src={`http://localhost:3000/${product.urlImg}`}
|
||||
alt=""
|
||||
/>
|
||||
<Card className="flex flex-col md:w-[500px] md:max-h-[90vh] md:overflow-auto md:sticky top-0 right-0">
|
||||
<CardHeader>
|
||||
<Card className="flex flex-col md:w-[400px] lg:w-[500px] min-h-[400px] md:h-[85vh] md:overflow-auto md:sticky top-0 right-0">
|
||||
<CardHeader className='py-2 px-2 md:px-4 lg:px-6'>
|
||||
<CardTitle className="font-bold text-2xl">
|
||||
{product.title.charAt(0).toUpperCase() + product.title.slice(1)}
|
||||
</CardTitle>
|
||||
<p className='font-semibold'>$ {product.price}</p>
|
||||
<p className='font-semibold'>$ {product.price} </p>
|
||||
{product.status === 'AGOTADO' ? (
|
||||
<p className="font-semibold text-lg text-red-900">AGOTADO</p>
|
||||
): ('')}
|
||||
</CardHeader>
|
||||
<CardContent className="flex-grow flex justify-between flex-col gap-4">
|
||||
<CardContent className="py-0 px-2 md:px-4 lg:px-6 flex-col justify-between flex-grow md:overflow-auto">
|
||||
<div>
|
||||
<p className='font-semibold text-lg border-t border-b'> Descripción</p>
|
||||
<p className='p-1'>{product.description}</p>
|
||||
{/* <p className='p-1'>{lorem+lorem+lorem+lorem}</p> */}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div className='mt-2'>
|
||||
<p className='font-semibold text-lg border-t border-b'> Dirección</p>
|
||||
<p>{product.address}</p>
|
||||
<p className='p-1'>{product.address}</p>
|
||||
</div>
|
||||
|
||||
|
||||
</CardContent>
|
||||
<CardFooter className="">
|
||||
|
||||
<CardFooter className="px-2 md:px-4 lg:px-6">
|
||||
<div>
|
||||
<p className='font-semibold text-lg border-t border-b mt-4'>Información del vendedor</p>
|
||||
<p>{product.fullname}</p>
|
||||
|
||||
5
apps/web/constants/status.ts
Normal file
5
apps/web/constants/status.ts
Normal file
@@ -0,0 +1,5 @@
|
||||
export const STATUS = {
|
||||
PUBLICADO:"Publicado",
|
||||
AGOTADO:"Agotado",
|
||||
BORRADOR:"Borrador",
|
||||
}
|
||||
@@ -9,11 +9,19 @@ import {
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from '@repo/shadcn/form';
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from '@repo/shadcn/select';
|
||||
import { Textarea } from '@repo/shadcn/textarea';
|
||||
import { Input } from '@repo/shadcn/input';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { useCreateUser } from "@/feactures/inventory/hooks/use-mutation";
|
||||
import { EditInventory, editInventory, formDataInput } from '@/feactures/inventory/schemas/inventory';
|
||||
import {STATUS} from '@/constants/status'
|
||||
|
||||
interface CreateFormProps {
|
||||
onSuccess?: () => void;
|
||||
@@ -34,9 +42,11 @@ export function CreateForm({
|
||||
const defaultformValues = {
|
||||
title: '',
|
||||
description: '',
|
||||
address: '',
|
||||
price: '',
|
||||
stock: '',
|
||||
urlImg: ''
|
||||
urlImg: '',
|
||||
status: ''
|
||||
}
|
||||
|
||||
const form = useForm<formDataInput>({
|
||||
@@ -100,6 +110,20 @@ export function CreateForm({
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="address"
|
||||
render={({ field }) => (
|
||||
<FormItem className='col-span-2'>
|
||||
<FormLabel>Dirección</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="description"
|
||||
@@ -107,7 +131,6 @@ export function CreateForm({
|
||||
<FormItem className='col-span-2'>
|
||||
<FormLabel>Descripción</FormLabel>
|
||||
<FormControl>
|
||||
{/* <Input {...field} /> */}
|
||||
<Textarea {...field} className="resize-none"/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
@@ -122,13 +145,36 @@ export function CreateForm({
|
||||
<FormItem>
|
||||
<FormLabel>Cantidad/Stock</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} />
|
||||
<Input {...field} type='number' />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="status"
|
||||
render={({ field }) => (
|
||||
<FormItem className="w-full">
|
||||
<FormLabel>Estatus</FormLabel>
|
||||
<Select onValueChange={(value) => field.onChange(value)}>
|
||||
<SelectTrigger className="w-full">
|
||||
<SelectValue placeholder="Seleccione un estatus" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{Object.entries(STATUS).map(([value, label]) => (
|
||||
<SelectItem key={value} value={value}>
|
||||
{label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="urlImg"
|
||||
|
||||
@@ -22,6 +22,8 @@ export const columns: ColumnDef<InventoryTable>[] = [
|
||||
{
|
||||
accessorKey: "description",
|
||||
header: "Descripcion",
|
||||
cell: ({ row }) => row.original.description.length > 40 ?
|
||||
`${row.original.description.slice(0, 40)}...` : row.original.description
|
||||
},
|
||||
{
|
||||
accessorKey: 'price',
|
||||
@@ -32,7 +34,10 @@ export const columns: ColumnDef<InventoryTable>[] = [
|
||||
accessorKey: 'stock',
|
||||
header: 'Stock',
|
||||
},
|
||||
|
||||
{
|
||||
accessorKey: 'status',
|
||||
header: 'Estado',
|
||||
},
|
||||
{
|
||||
id: 'actions',
|
||||
header: 'Acciones',
|
||||
|
||||
@@ -9,11 +9,19 @@ import {
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from '@repo/shadcn/form';
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from '@repo/shadcn/select';
|
||||
import { Input } from '@repo/shadcn/input';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { useUpdateUser } from "@/feactures/inventory/hooks/use-mutation";
|
||||
import { editInventory, formDataInput, EditInventory } from '@/feactures/inventory/schemas/inventory'; // Renombrado EditInventory para claridad
|
||||
import { Textarea } from '@repo/shadcn/components/ui/textarea';
|
||||
import {STATUS} from '@/constants/status'
|
||||
|
||||
interface UpdateFormProps {
|
||||
onSuccess?: () => void;
|
||||
@@ -37,6 +45,8 @@ export function UpdateForm({
|
||||
title: defaultValues?.title || '',
|
||||
description: defaultValues?.description || '',
|
||||
price: defaultValues?.price || '',
|
||||
address: defaultValues?.address || '',
|
||||
status: defaultValues?.status || 'BORRADOR',
|
||||
stock: (defaultValues?.stock ?? '').toString(),
|
||||
urlImg: defaultValues?.urlImg || '',
|
||||
userId: defaultValues?.userId
|
||||
@@ -49,6 +59,7 @@ export function UpdateForm({
|
||||
});
|
||||
|
||||
const onSubmit = async (data: formDataInput) => {
|
||||
console.log(data);
|
||||
|
||||
saveAccountingAccounts(data, {
|
||||
onSuccess: () => {
|
||||
@@ -88,13 +99,11 @@ export function UpdateForm({
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="price"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormItem >
|
||||
<FormLabel>Precio</FormLabel>
|
||||
<FormControl>
|
||||
{/* Simplificado. price es z.string(), field.value ya es string o undefined. */}
|
||||
@@ -105,6 +114,21 @@ export function UpdateForm({
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="address"
|
||||
render={({ field }) => (
|
||||
<FormItem className='col-span-2'>
|
||||
<FormLabel>Dirección</FormLabel>
|
||||
<FormControl>
|
||||
{/* Simplificado. price es z.string(), field.value ya es string o undefined. */}
|
||||
<Input {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="description"
|
||||
@@ -112,7 +136,6 @@ export function UpdateForm({
|
||||
<FormItem className='col-span-2'>
|
||||
<FormLabel>Descripción</FormLabel>
|
||||
<FormControl>
|
||||
{/* <Input {...field} /> */}
|
||||
<Textarea {...field} className="resize-none"/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
@@ -127,7 +150,6 @@ export function UpdateForm({
|
||||
<FormItem>
|
||||
<FormLabel>Cantidad/Stock</FormLabel>
|
||||
<FormControl>
|
||||
{/* Añadido type="number" para UX. field.value ya es string debido a formDataInput */}
|
||||
<Input {...field} type="number" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
@@ -135,6 +157,29 @@ export function UpdateForm({
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="status"
|
||||
render={({ field }) => (
|
||||
<FormItem className="w-full">
|
||||
<FormLabel>Estatus</FormLabel>
|
||||
<Select value={field.value} onValueChange={(value) => field.onChange(value)}>
|
||||
<SelectTrigger className="w-full">
|
||||
<SelectValue placeholder="Seleccione un estatus" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{Object.entries(STATUS).map(([value, label]) => (
|
||||
<SelectItem key={value} value={value}>
|
||||
{label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="urlImg"
|
||||
|
||||
@@ -42,12 +42,15 @@ export function ProductList() {
|
||||
</CardHeader>
|
||||
<CardContent className="p-0 flex-grow">
|
||||
<img
|
||||
className="object-cover w-full h-full aspect-square"
|
||||
className="object-cover w-full h-full aspect-square border"
|
||||
src={`http://localhost:3000/${data.urlImg}`}
|
||||
alt=""
|
||||
/>
|
||||
</CardContent>
|
||||
<CardFooter className="flex justify-between items-center p-4">
|
||||
<CardFooter className="flex-col items-start p-4">
|
||||
{data.status === 'AGOTADO' ? (
|
||||
<p className="font-semibold text-lg text-red-900">AGOTADO</p>
|
||||
): ('')}
|
||||
<p className="font-semibold text-lg">$ {data.price}</p>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
|
||||
@@ -17,6 +17,7 @@ export const product = z.object({
|
||||
stock: z.number(),
|
||||
price: z.string(),
|
||||
urlImg: z.string(),
|
||||
status: z.string(),
|
||||
userId: z.number().optional()
|
||||
})
|
||||
|
||||
@@ -32,9 +33,11 @@ export const editInventory = z.object({
|
||||
description: z.string().min(10, { message: "Debe de tener 10 o más caracteres" }),
|
||||
stock: z.string().transform(val => Number(val)).pipe(z.number(
|
||||
{ invalid_type_error: 'El stock debe ser un número' }).min(0, { message: "El stock debe ser mayor a 0" })
|
||||
),
|
||||
),
|
||||
address: z.string().min(5, { message: "Debe de tener 5 o más caracteres" }),
|
||||
price: z.string(),
|
||||
urlImg: z.string(),
|
||||
status: z.string().min(1, { message: "Debe de seleccionar un valor" }),
|
||||
userId: z.number().optional(),
|
||||
})
|
||||
|
||||
|
||||
BIN
apps/web/public/apples.avif
Normal file
BIN
apps/web/public/apples.avif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
@@ -7,7 +7,7 @@ function Textarea({ className, ...props }: React.ComponentProps<'textarea'>) {
|
||||
<textarea
|
||||
data-slot="textarea"
|
||||
className={cn(
|
||||
'border-input placeholder:text-muted-foreground ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 aria-invalid:outline-destructive/60 dark:aria-invalid:outline-destructive dark:aria-invalid:ring-destructive/40 aria-invalid:ring-destructive/20 aria-invalid:border-destructive/60 dark:aria-invalid:border-destructive dark:aria-invalid:ring-destructive/50 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] focus-visible:ring-4 focus-visible:outline-1 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:focus-visible:ring-[3px] aria-invalid:focus-visible:outline-none md:text-sm dark:aria-invalid:focus-visible:ring-4',
|
||||
'border-gray-400 dark:border-input placeholder:text-muted-foreground ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 aria-invalid:outline-destructive/60 dark:aria-invalid:outline-destructive dark:aria-invalid:ring-destructive/40 aria-invalid:ring-destructive/20 aria-invalid:border-destructive/60 dark:aria-invalid:border-destructive dark:aria-invalid:ring-destructive/50 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] focus-visible:ring-4 focus-visible:outline-1 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:focus-visible:ring-[3px] aria-invalid:focus-visible:outline-none md:text-sm dark:aria-invalid:focus-visible:ring-4',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
||||
Reference in New Issue
Block a user