gib/convex-monorepo-payload
Template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update AGENTS.md. Start fixing old weird errors

Browse Source
This commit is contained in:
Gabriel Brown
2026-03-26 12:05:12 -05:00
parent 0bc04dbf6b
commit d16f4287ce
96 changed files with 18195 additions and 9182 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
packages/ui/src/native-select.tsx
View File

@@ -3,51 +3,49 @@ import { ChevronDownIcon } from 'lucide-react';
import { cn } from '@gib/ui';
function NativeSelect({
const NativeSelect = ({
className,
size = 'default',
...props
}: Omit<React.ComponentProps<'select'>, 'size'> & { size?: 'sm' | 'default' }) {
return (
<div
className='group/native-select relative w-fit has-[select:disabled]:opacity-50'
data-slot='native-select-wrapper'
>
<select
data-slot='native-select'
data-size={size}
className={cn(
'border-input selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 h-9 w-full min-w-0 appearance-none rounded-md border bg-transparent px-3 py-2 pr-9 text-sm shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed data-[size=sm]:h-8 data-[size=sm]:py-1',
'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
'aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40',
className,
)}
{...props}
/>
<ChevronDownIcon
className='text-muted-foreground pointer-events-none absolute top-1/2 right-3.5 size-4 -translate-y-1/2 opacity-50 select-none'
aria-hidden='true'
data-slot='native-select-icon'
/>
</div>
);
}
function NativeSelectOption({ ...props }: React.ComponentProps<'option'>) {
return <option data-slot='native-select-option' {...props} />;
}
function NativeSelectOptGroup({
className,
...props
}: React.ComponentProps<'optgroup'>) {
return (
<optgroup
data-slot='native-select-optgroup'
className={cn(className)}
}: Omit<React.ComponentProps<'select'>, 'size'> & {
size?: 'sm' | 'default';
}) => (
<div
className='group/native-select relative w-fit has-[select:disabled]:opacity-50'
data-slot='native-select-wrapper'
>
<select
data-slot='native-select'
data-size={size}
className={cn(
'border-input selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 h-9 w-full min-w-0 appearance-none rounded-md border bg-transparent px-3 py-2 pr-9 text-sm shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed data-[size=sm]:h-8 data-[size=sm]:py-1',
'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
'aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40',
className,
)}
{...props}
/>
);
}
<ChevronDownIcon
className='text-muted-foreground pointer-events-none absolute top-1/2 right-3.5 size-4 -translate-y-1/2 opacity-50 select-none'
aria-hidden='true'
data-slot='native-select-icon'
/>
</div>
);
const NativeSelectOption = ({ ...props }: React.ComponentProps<'option'>) => (
<option data-slot='native-select-option' {...props} />
);
const NativeSelectOptGroup = ({
className,
...props
}: React.ComponentProps<'optgroup'>) => (
<optgroup
data-slot='native-select-optgroup'
className={cn(className)}
{...props}
/>
);
export { NativeSelect, NativeSelectOptGroup, NativeSelectOption };