复制一段给 AI 编程工具的提示词，包含源码、依赖和用法
属性
IOSDeviceProps
同时支持以下类型的全部属性： React.ComponentProps<"main">
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| light | boolean | — | White status bar text, for photo and dark wallpaper screens |
| hideHomeIndicator | boolean | — | Hide the home indicator pill |
IOSPageProps
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| title* 必填 | string | — | — |
| large | boolean | true | Show the big collapsing title under the navigation bar |
| left | React.ReactNode | — | — |
| right | React.ReactNode | — | — |
| tabbed | boolean | — | Leave room for an IOSTabBar at the bottom |
| className | string | — | Background of the page, defaults to the grouped background |
| children | React.ReactNode | — | — |
IOSTabBarProps
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| items* 必填 | IOSTabItem[] | — | — |
| value* 必填 | string | — | — |
| onValueChange* 必填 | (id: string) => void | — | — |
| dark | boolean | — | Draw over a dark photographic screen |
| className | string | — | — |
IOSGroupProps
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| header | React.ReactNode | — | — |
| footer | React.ReactNode | — | — |
| className | string | — | — |
| children | React.ReactNode | — | — |
IOSRowProps
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| title* 必填 | React.ReactNode | — | — |
| subtitle | React.ReactNode | — | — |
| detail | React.ReactNode | — | Value shown on the right in secondary color |
| icon | React.ReactNode | — | An icon element, drawn white on a rounded square of `iconClassName` |
| iconClassName | string | "bg-(color:--ios-blue)" | — |
| chevron | boolean | — | Show the disclosure chevron |
| right | React.ReactNode | — | Replaces the detail and chevron, for example an IOSSwitch |
| leading | React.ReactNode | — | Leading content that replaces the icon square, for example an avatar |
| destructive | boolean | — | — |
| onClick | () => void | — | — |
| className | string | — | — |
IOSSwitchProps
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| checked* 必填 | boolean | — | — |
| onCheckedChange* 必填 | (checked: boolean) => void | — | — |
| label | string | — | — |
| tint | string | — | — |
IOSSegmentedProps
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| options* 必填 | string[] | — | — |
| value* 必填 | number | — | — |
| onValueChange* 必填 | (index: number) => void | — | — |
| className | string | — | — |
IOSButtonProps
同时支持以下类型的全部属性： React.ComponentProps<"button">
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| variant | "filled" | "tinted" | "plain" | — | — |
| tint | string | — | Any CSS color, defaults to the system blue |
IOSAppIconProps
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| icon | React.ReactNode | — | — |
| className | string | — | Tailwind background classes, for example a gradient |
| size | number | 60 | — |
| label | string | — | — |
| showLabel | boolean | — | Show the label under the icon, as on the home screen |
| labelClassName | string | — | — |
| onClick | () => void | — | — |
IOSSheetProps
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| open* 必填 | boolean | — | — |
| onClose* 必填 | () => void | — | — |
| title | string | — | — |
| left | React.ReactNode | — | — |
| right | React.ReactNode | — | — |
| height | string | "80%" | Height as a CSS length, defaults to a tall detent |
| children | React.ReactNode | — | — |
安装
$ npx shadcn@latest add https://chromotion.dev/r/ios-kit.json