| | |
| | | <PortalToFollowElemTrigger onClick={() => setOpen(v => !v)} asChild> |
| | | {trigger(open)} |
| | | </PortalToFollowElemTrigger> |
| | | <PortalToFollowElemContent className='z-[1001]'> |
| | | <div className='w-[280px] rounded-xl border-[0.5px] border-components-panel-border bg-components-panel-bg-blur p-3 shadow-lg'> |
| | | <PortalToFollowElemContent className='z-10'> |
| | | <div className='p-3 w-[280px] bg-components-panel-bg-blur border-[0.5px] border-components-panel-border rounded-xl shadow-lg'> |
| | | { |
| | | showFromLink && ( |
| | | <> |
| | | <div className={cn( |
| | | 'flex h-8 items-center rounded-lg border border-components-input-border-active bg-components-input-bg-active p-1 shadow-xs', |
| | | 'flex items-center p-1 h-8 bg-components-input-bg-active border border-components-input-border-active rounded-lg shadow-xs', |
| | | showError && 'border-components-input-border-destructive', |
| | | )}> |
| | | <input |
| | | className='system-sm-regular mr-0.5 block grow appearance-none bg-transparent px-1 outline-none' |
| | | className='grow block mr-0.5 px-1 bg-transparent system-sm-regular outline-none appearance-none' |
| | | placeholder={t('common.fileUploader.pasteFileLinkInputPlaceholder') || ''} |
| | | value={url} |
| | | onChange={(e) => { |
| | | setShowError(false) |
| | | setUrl(e.target.value.trim()) |
| | | setUrl(e.target.value) |
| | | }} |
| | | disabled={disabled} |
| | | /> |
| | |
| | | </div> |
| | | { |
| | | showError && ( |
| | | <div className='body-xs-regular mt-0.5 text-text-destructive'> |
| | | <div className='mt-0.5 body-xs-regular text-text-destructive'> |
| | | {t('common.fileUploader.pasteFileLinkInvalid')} |
| | | </div> |
| | | ) |
| | |
| | | } |
| | | { |
| | | showFromLink && showFromLocal && ( |
| | | <div className='system-2xs-medium-uppercase flex h-7 items-center p-2 text-text-quaternary'> |
| | | <div className='mr-2 h-[1px] w-[93px] bg-gradient-to-l from-[rgba(16,24,40,0.08)]' /> |
| | | <div className='flex items-center p-2 h-7 system-2xs-medium-uppercase text-text-quaternary'> |
| | | <div className='mr-2 w-[93px] h-[1px] bg-gradient-to-l from-[rgba(16,24,40,0.08)]' /> |
| | | OR |
| | | <div className='ml-2 h-[1px] w-[93px] bg-gradient-to-r from-[rgba(16,24,40,0.08)]' /> |
| | | <div className='ml-2 w-[93px] h-[1px] bg-gradient-to-r from-[rgba(16,24,40,0.08)]' /> |
| | | </div> |
| | | ) |
| | | } |
| | |
| | | variant='secondary-accent' |
| | | disabled={disabled} |
| | | > |
| | | <RiUploadCloud2Line className='mr-1 h-4 w-4' /> |
| | | <RiUploadCloud2Line className='mr-1 w-4 h-4' /> |
| | | {t('common.fileUploader.uploadFromComputer')} |
| | | <FileInput fileConfig={fileConfig} /> |
| | | </Button> |