I am fine!
25%
chart
NotionMemo
基本情報
コンポーネント
TOGGLE
siteMap
Pagination
Mobile
Chart
Doughnout
StackBar
Compound Chart
Form Field
BlockNote Plain Value
BlockNote Json Value
Form Field
dummy
メールアドレス
0/20
年齢
備考
0/100
試用期間
<Button />
<Loading />
Loading...
Loading...
Loading...
<Skeleton />
<TagSelect />
<Cascader />
<UploadImgPro />
Overview:
Used to select and upload files or drag and drop files.
Import:
Source:
When To Use:
- Upload images with previews.
- Upload multiple images with a limit and a set of extensions.
- Select images from Cloud Medias (uploaded images), and Local Medias (from devices).
Common Props:
| Property | Type | Default | Description |
|---|---|---|---|
| useModal | boolean | false | Indicating that should select images though Media Modal or System Dialog. |
| customerId | number | -1 | Indicating whose images should retrieve in Cloud Tab. |
| countLimit | number | MAX_SAFE_INTEGER | Indicating the maximum images that can be chosen. |
| sizeLimit | number | MAX_SAFE_INTEGER | Indicating the maximum size per image (in MB). |
| extension | string | '.jpg, .jpeg, .png' | Indicating the file types that can be accepted. |
| tray | IDefaultTrayProps | Allow to revise the message, label of button, description for default Upload UI. | |
| children | React.Node | - | Use it in case you want to custom Upload UI. |
| isShowPreview | boolean | true | Indicating if showing image preview (to custom Image Preview, ex: Upload Avatar...) |
| prioritizeNewImg | boolean | true | Should set it to true to prioritize new selected images in case countLimit = 1 to force the limit logic. |
| fileList | TImagePro[] | - | List of current images (can be cloud images, local images or uploaded images), should be assign to field.value (React Hook Form) |
| onFileListChange | callback | - | The callback action if fileList is changed, should be assign to field.onChange (React Hook Form) |
React Hook Form & useUploadImgPro()
Usage:
Read more:
Media Manager:
Media Constant:
Examples:
画像をアップロードする
Heading with underline
企業詳細
Hightlight Blacklist (type some texts that include fuck or shit to see highlight)
ToolTip
Select Multiple with suggestion
Select Multiple with second level
Breadcrumb
Divider
modal
Date Time Picker
期限日
期限時間
期限時間2
Title with left tag
キャンペーン
掲載不可（ポリシー違反）
Label Tags
Indeed
求人ボックス
スタンバイ
スタンバイ
Tags
固定タグ
固定タグ
固定タグ
掲載中
固定タグ
固定タグ
固定タグ
掲載中
Tags Input
Tags Dropdown
Input With Tags
abc
abcs
Checkox usage
Radios
checkbox groups
checkbox groups inline
radio groups
checkbox groups inline
Drag & Drop sotable Alert List
1
メッセージ1
2
メッセージ2
3
メッセージ3
4
メッセージ4
5
メッセージ5
6
メッセージ6
7
メッセージ7
8
メッセージ8
共有項目
Toggle Content
共有項目
Toggle Content
ブロックトグル
Children