diff --git a/migrate-from-v2.md b/migrate-from-v2.md
index 19cddb0c34..2170b494f3 100644
--- a/migrate-from-v2.md
+++ b/migrate-from-v2.md
@@ -135,7 +135,7 @@ plugins: [
#### SideNavBar
-- 注意：** 该组件即将被废弃。请使用 SideBar **
+- 注意：** 该组件不符合移动端规范，已被废弃。请使用 SideBar **
[//]: # '#### Tabbar'
[//]: # '#### TabbarItem'
@@ -221,7 +221,11 @@ plugins: [
[//]: # '#### Animate'
[//]: # '#### AnimatingNumbers'
-[//]: # '#### Audio'
+
+#### Audio
+
+- 注意：** 该组件在 Taro 多端上没有计划支持。请使用 API **
+
[//]: # '#### Avatar'
[//]: # '#### AvatarGroup'
diff --git a/src/config.json b/src/config.json
index 3ad4dbd879..24c36ea1bf 100644
--- a/src/config.json
+++ b/src/config.json
@@ -281,7 +281,7 @@
"sort": 7,
"show": true,
"taro": true,
- "v15": 99,
+ "v15": 990,
"author": "hx",
"dd": false
}
@@ -353,7 +353,6 @@
"sort": 5,
"show": false,
"taro": true,
- "v15": 1,
"author": "Ymm0008",
"dd": true
},
@@ -395,42 +394,6 @@
"author": "Alex.hxy",
"dd": true
},
- {
- "version": "2.0.0",
- "name": "SideNavBar",
- "type": "component",
- "cName": "侧边栏导航",
- "desc": "用于内容选择和切换",
- "sort": 9,
- "show": true,
- "taro": true,
- "author": "hx",
- "dd": false
- },
- {
- "version": "2.0.0",
- "name": "SideNavBarItem",
- "type": "component",
- "cName": "侧边栏导航子组件",
- "exportEmpty": true,
- "desc": "用于侧边栏导航子组件",
- "sort": 11,
- "show": false,
- "author": "hx",
- "dd": false
- },
- {
- "version": "2.0.0",
- "name": "SubSideNavBar",
- "type": "component",
- "cName": "侧边栏导航子组件",
- "desc": "用于侧边栏导航的子组件",
- "exportEmpty": true,
- "sort": 10,
- "show": false,
- "author": "hx",
- "dd": false
- },
{
"version": "3.0.0",
"name": "Tabbar",
@@ -599,7 +562,7 @@
"sort": 16,
"show": true,
"taro": true,
- "v15": false,
+ "v15": -1,
"dd": false,
"author": "songsong"
},
@@ -813,7 +776,7 @@
"sort": 1,
"show": true,
"taro": true,
- "v15": 99,
+ "v15": 990,
"author": "songsong",
"dd": false
},
@@ -853,7 +816,7 @@
"sort": 1,
"show": true,
"taro": true,
- "v15": 100,
+ "v15": 1000,
"author": "swag~jun",
"dd": false
}
@@ -911,7 +874,7 @@
"sort": 1,
"show": true,
"taro": true,
- "v15": 99,
+ "v15": 990,
"author": "songsong",
"dd": false
},
@@ -1087,7 +1050,7 @@
"sort": 27,
"show": true,
"taro": true,
- "v15": 99,
+ "v15": 990,
"author": "swag~jun",
"dd": false
},
@@ -1100,7 +1063,7 @@
"sort": 7,
"show": true,
"taro": true,
- "v15": 99,
+ "v15": 990,
"author": "songsong",
"dd": true
},
@@ -1113,6 +1076,7 @@
"sort": 21,
"show": true,
"taro": false,
+ "v15": -1,
"author": "libin",
"dd": false
},
@@ -1201,7 +1165,7 @@
"sort": 27,
"show": true,
"taro": true,
- "v15": 99,
+ "v15": 990,
"author": "vickyYE",
"dd": false
},
@@ -1406,7 +1370,7 @@
"sort": 20,
"show": true,
"taro": true,
- "v15": 100,
+ "v15": 1000,
"author": "hx",
"dd": false
}
@@ -1489,7 +1453,7 @@
"sort": 25,
"show": true,
"taro": true,
- "v15": 100,
+ "v15": 1000,
"author": "songsong",
"dd": true
},
@@ -1502,7 +1466,7 @@
"sort": 25,
"show": true,
"taro": true,
- "v15": 99,
+ "v15": 990,
"author": "swag~jun",
"dd": false
}
diff --git a/src/packages/sidenavbar/__test__/sidenavbar.spec.tsx b/src/packages/sidenavbar/__test__/sidenavbar.spec.tsx
deleted file mode 100644
index 2fdd47aaf9..0000000000
--- a/src/packages/sidenavbar/__test__/sidenavbar.spec.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import React from 'react'
-
-import { render } from '@testing-library/react'
-import '@testing-library/jest-dom'
-
-import Sidenavbar from '@/packages/sidenavbar'
-
-const changeNarBar = vi.fn()
-
-test('default props', () => {
- const { container } = render(
- <>
- {
- changeNarBar(false)
- }}
- >
- 侧边栏内容
-
-
- )
- expect(container.querySelector('.nut-popup')).toHaveClass('nut-popup-left')
- expect(container.querySelector('.nut-sidenavbar-title')).toHaveAttribute(
- 'style',
- 'padding-left: 20px;'
- )
-})
-test('position should be right', () => {
- const { container } = render(
- <>
- {
- changeNarBar(false)
- }}
- >
- 侧边栏内容
-
-
- )
- expect(container.querySelector('.nut-popup')).toHaveClass('nut-popup-right')
-})
-test('indent should be 30', () => {
- const { container } = render(
- <>
- {
- changeNarBar(false)
- }}
- >
- 侧边栏内容
-
-
- )
- expect(container.querySelector('.nut-sidenavbar-title')).toHaveAttribute(
- 'style',
- 'padding-left: 30px;'
- )
-})
diff --git a/src/packages/sidenavbar/context.ts b/src/packages/sidenavbar/context.ts
deleted file mode 100644
index 975acff22f..0000000000
--- a/src/packages/sidenavbar/context.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-import { createContext } from 'react'
-
-export const OffsetContext = createContext(20)
diff --git a/src/packages/sidenavbar/demo.taro.tsx b/src/packages/sidenavbar/demo.taro.tsx
deleted file mode 100644
index ed46b557a2..0000000000
--- a/src/packages/sidenavbar/demo.taro.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import React from 'react'
-import Taro from '@tarojs/taro'
-
-import { ScrollView, View } from '@tarojs/components'
-import { useTranslate } from '@/sites/assets/locale/taro'
-import Header from '@/sites/components/header'
-import Demo1 from './demos/taro/demo1'
-import Demo2 from './demos/taro/demo2'
-
-const SideNavBarDemo = () => {
- const [translated] = useTranslate({
- 'zh-CN': {
- text1: '基础用法',
- text2: '导航嵌套（建议最多三层）',
- },
- 'zh-TW': {
- text1: '基礎用法',
- text2: '導航嵌套（建議最多三層）',
- },
- 'en-US': {
- text1: 'Basic Usage',
- text2: 'Navigation Nesting (Up To Three Levels Recommended)',
- },
- 'id-ID': {
- text1: 'Penggunaan dasar',
- text2: 'Sarang navigasi (disarankan hingga tiga tingkat)',
- },
- })
- const { text1, text2 } = translated
-
- return (
- <>
-
-
- {text1}
-
- {text2}
-
-
-
- )
-}
-
-export default SideNavBarDemo
diff --git a/src/packages/sidenavbar/demo.tsx b/src/packages/sidenavbar/demo.tsx
deleted file mode 100644
index 043cda9cb1..0000000000
--- a/src/packages/sidenavbar/demo.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import React from 'react'
-import { useTranslate } from '@/sites/assets/locale'
-import Demo1 from './demos/h5/demo1'
-import Demo2 from './demos/h5/demo2'
-
-const SideNavBarDemo = () => {
- const [translated] = useTranslate({
- 'zh-CN': {
- text1: '基础用法',
- text2: '导航嵌套（建议最多三层）',
- },
- 'zh-TW': {
- text1: '基礎用法',
- text2: '導航嵌套（建議最多三層）',
- },
- 'en-US': {
- text1: 'Basic Usage',
- text2: 'Navigation Nesting (Up To Three Levels Recommended)',
- },
- 'id-ID': {
- text1: 'Penggunaan dasar',
- text2: 'Sarang navigasi (disarankan hingga tiga tingkat)',
- },
- })
- const { text1, text2 } = translated
-
- return (
- <>
-
-
{text1}
-
- {text2}
-
-
-
- )
-}
-
-export default SideNavBarDemo
diff --git a/src/packages/sidenavbar/demos/h5/demo1.tsx b/src/packages/sidenavbar/demos/h5/demo1.tsx
deleted file mode 100644
index 9b051265f4..0000000000
--- a/src/packages/sidenavbar/demos/h5/demo1.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import React, { useState } from 'react'
-import {
- Cell,
- SideNavBar,
- SubSideNavBar,
- SideNavBarItem,
- Toast,
-} from '@nutui/nutui-react'
-
-const Demo1 = () => {
- type Position = 'left' | 'right'
- type NavBarState = {
- visible: boolean
- position: Position
- }
- const [navBarState, setNavBarState] = useState({
- visible: false,
- position: 'left',
- })
- const [showThird, setShowThird] = useState(false)
- const changeNarBar = (
- visible: boolean,
- position: Position = navBarState.position
- ) => {
- setNavBarState({
- visible,
- position,
- })
- setShowThird(false)
- }
- const clickItem = (data: any) => {
- const { title, value } = data
- showThird && Toast.show(`title=${title},value=${value}`)
- }
- const clickTitle = (data: any) => {
- const { title, value, isShow } = data
- showThird && Toast.show(`title=${title},value=${value},isShow=${isShow}`)
- }
- return (
- <>
- {
- changeNarBar(true, 'left')
- }}
- />
- {
- changeNarBar(true, 'right')
- }}
- />
- {
- changeNarBar(false)
- }}
- >
-
-
-
-
-
-
- {showThird ? (
-
-
-
-
- ) : null}
-
-
-
-
-
-
-
-
- )
-}
-export default Demo1
diff --git a/src/packages/sidenavbar/demos/h5/demo2.tsx b/src/packages/sidenavbar/demos/h5/demo2.tsx
deleted file mode 100644
index e4af11cc1b..0000000000
--- a/src/packages/sidenavbar/demos/h5/demo2.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import React, { useState } from 'react'
-import {
- Cell,
- SideNavBar,
- SubSideNavBar,
- SideNavBarItem,
- Toast,
-} from '@nutui/nutui-react'
-
-const Demo2 = () => {
- type Position = 'left' | 'right'
- type NavBarState = {
- visible: boolean
- position: Position
- }
- const [navBarState, setNavBarState] = useState({
- visible: false,
- position: 'left',
- })
- const [showThird, setShowThird] = useState(false)
- const changeNarBar = (
- visible: boolean,
- position: Position = navBarState.position
- ) => {
- setNavBarState({
- visible,
- position,
- })
- setShowThird(false)
- }
- const clickItem = (data: any) => {
- const { title, value } = data
- showThird && Toast.show(`title=${title},value=${value}`)
- }
- const clickTitle = (data: any) => {
- const { title, value, isShow } = data
- showThird && Toast.show(`title=${title},value=${value},isShow=${isShow}`)
- }
- return (
- <>
- {
- changeNarBar(true, 'right')
- setShowThird(true)
- }}
- />
- {
- changeNarBar(false)
- }}
- >
-
-
-
-
-
-
- {showThird ? (
-
-
-
-
- ) : null}
-
-
-
-
-
-
-
-
- )
-}
-export default Demo2
diff --git a/src/packages/sidenavbar/demos/taro/demo1.tsx b/src/packages/sidenavbar/demos/taro/demo1.tsx
deleted file mode 100644
index 79225a0eba..0000000000
--- a/src/packages/sidenavbar/demos/taro/demo1.tsx
+++ /dev/null
@@ -1,72 +0,0 @@
-import React, { useState } from 'react'
-import {
- Cell,
- SideNavBar,
- SubSideNavBar,
- SideNavBarItem,
-} from '@nutui/nutui-react-taro'
-
-const Demo1 = () => {
- type Position = 'left' | 'right'
- type NavBarState = {
- visible: boolean
- position: Position
- }
- const [navBarState, setNavBarState] = useState({
- visible: false,
- position: 'left',
- })
- const [showThird, setShowThird] = useState(false)
- const changeNarBar = (visible: boolean, position = navBarState.position) => {
- setNavBarState({
- visible,
- position,
- })
- setShowThird(false)
- }
-
- return (
- <>
- {
- changeNarBar(true, 'left')
- }}
- />
- {
- changeNarBar(true, 'right')
- }}
- />
- {
- changeNarBar(false)
- }}
- >
-
-
-
-
-
-
- {showThird ? (
-
-
-
-
- ) : null}
-
-
-
-
-
-
-
-
- )
-}
-export default Demo1
diff --git a/src/packages/sidenavbar/demos/taro/demo2.tsx b/src/packages/sidenavbar/demos/taro/demo2.tsx
deleted file mode 100644
index 399442079d..0000000000
--- a/src/packages/sidenavbar/demos/taro/demo2.tsx
+++ /dev/null
@@ -1,69 +0,0 @@
-import React, { useState } from 'react'
-import {
- Cell,
- SideNavBar,
- SubSideNavBar,
- SideNavBarItem,
-} from '@nutui/nutui-react-taro'
-
-const Demo2 = () => {
- type Position = 'left' | 'right'
- type NavBarState = {
- visible: boolean
- position: Position
- }
- const [navBarState, setNavBarState] = useState({
- visible: false,
- position: 'left',
- })
- const [showThird, setShowThird] = useState(false)
- const changeNarBar = (
- visible: boolean,
- position: Position = navBarState.position
- ) => {
- setNavBarState({
- visible,
- position,
- })
- setShowThird(false)
- }
- return (
- <>
- | {
- changeNarBar(true, 'right')
- setShowThird(true)
- }}
- />
- {
- changeNarBar(false)
- }}
- >
-
-
-
-
-
-
- {showThird ? (
-
-
-
-
- ) : null}
-
-
-
-
-
-
-
-
- )
-}
-export default Demo2
diff --git a/src/packages/sidenavbar/doc.en-US.md b/src/packages/sidenavbar/doc.en-US.md
deleted file mode 100644
index be9425738c..0000000000
--- a/src/packages/sidenavbar/doc.en-US.md
+++ /dev/null
@@ -1,82 +0,0 @@
-# SideNavBar组件
-
-> **⚠️ Note:** This component is deprecated and will be removed in the future. Please use [SideBar](#/en-US/component/sidebar) instead.
-
-For content selection and switching
-
-## Import
-
-```tsx
-import { SideNavBar, SubSideNavBar, SideNavBarItem } from '@nutui/nutui-react'
-```
-
-## Demo
-
-### Basic Usage
-
-:::demo
-
-
-
-:::
-
-### Navigation Nesting (Up To Three Levels Recommended)
-
-:::demo
-
-
-
-:::
-
-## SideNavBar
-
-### Props
-
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| visible | whether the component is visible | `boolean` | `false` |
-| title | overall title | `string` | `-` |
-| width | mask width in percentage | `string` | `80%` |
-| position | popup position | `left` \| `right` | `left` |
-| indent | indent width | `number` | `20` |
-| onClose | Triggered when the mask is closed | `-` | `-` |
-
-## SubSideNavBar
-
-### Props
-
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| value | unique identifier for navigation | `string` \| `number` | `-` |
-| title | overall title | `string` | `-` |
-| open | whether the navigation is expanded by default | `boolean` | `true` |
-| onClick | Navigation click | `({title: string, value: string \| number, isShow: boolean}) => void` | `-` |
-
-## SideNavBarItem
-
-### Props
-
-| Property | Description | Type | Default |
-| --- | --- | --- | --- |
-| value | unique identifier for navigation | `string` \| `number` | `-` |
-| title | overall title | `string` | `-` |
-| onClick | Navigation click | `({title: string, value: string \| number}) => void` | `-` |
-
-## Theming
-
-### CSS Variables
-
-The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/component/configprovider).
-
-| Name | Description | Default |
-| --- | --- | --- |
-| \--nutui-sidenavbar-content-bg-color | sidebar navigation background color | `$white` |
-| \--nutui-sidenavbar-item-height | The height of each item in the sidebar | `40px` |
-| \--nutui-sidenavbar-title-padding | padding for title | `10px 8px 10px 20px` |
-| \--nutui-sidenavbar-title-background | The background color of the title | `$color-background` |
-| \--nutui-sidenavbar-title-color | The font color of the title | `$color-title` |
-| \--nutui-sidenavbar-sub-title-padding | Padding of subtitle | `10px 8px 10px 35px` |
-| \--nutui-sidenavbar-sub-title-background | Subtitle background color | `$color-background-sunken` |
-| \--nutui-sidenavbar-sub-title-color | Subtitle font color | `$color-title` |
-| \--nutui-sidenavbar-sub-list-background | option list background color | `$color-background-sunken` |
-| \--nutui-sidenavbar-sub-list-color | option list font color | `$color-title` |
diff --git a/src/packages/sidenavbar/doc.md b/src/packages/sidenavbar/doc.md
deleted file mode 100644
index 9885cfed6a..0000000000
--- a/src/packages/sidenavbar/doc.md
+++ /dev/null
@@ -1,82 +0,0 @@
-# SideNavBar组件
-
-> **⚠️ 注意：** 该组件即将被废弃。请使用 [SideBar](#/zh-CN/component/sidebar) 代替。
-
-用于内容选择和切换
-
-## 引入
-
-```tsx
-import { SideNavBar, SubSideNavBar, SideNavBarItem } from '@nutui/nutui-react'
-```
-
-## 示例代码
-
-### 基础用法
-
-:::demo
-
-
-
-:::
-
-### 导航嵌套（建议最多三层）
-
-:::demo
-
-
-
-:::
-
-## SideNavBar
-
-### Props
-
-| 属性 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| visible | 组件是否显示 | `boolean` | `false` |
-| title | 整体标题 | `string` | `-` |
-| width | 遮罩宽度百分比 | `string` | `80%` |
-| position | 弹出位置 | `left` \| `right` | `left` |
-| indent | 缩进宽度 | `number` | `20` |
-| onClose | 关闭遮罩时触发 | `-` | `-` |
-
-## SubSideNavBar
-
-### Props
-
-| 属性 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| value | 导航唯一标识 | `string` \| `number` | `-` |
-| title | 整体标题 | `string` | `-` |
-| open | 导航是否默认展开 | `boolean` | `true` |
-| onClick | 导航点击 | `({title: string, value: string \| number, isShow: boolean}) => void` | `-` |
-
-## SideNavBarItem
-
-### Props
-
-| 属性 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| value | 导航唯一标识 | `string` \| `number` | `-` |
-| title | 整体标题 | `string` | `-` |
-| onClick | 导航点击 | `({title: string, value: string \| number}) => void` | `-` |
-
-## 主题定制
-
-### 样式变量
-
-组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/component/configprovider)。
-
-| 名称 | 说明 | 默认值 |
-| --- | --- | --- |
-| \--nutui-sidenavbar-content-bg-color | 侧边栏导航背景色 | `$white` |
-| \--nutui-sidenavbar-item-height | 侧边栏每项的高度 | `40px` |
-| \--nutui-sidenavbar-title-padding | 标题的内边距 | `10px 8px 10px 20px` |
-| \--nutui-sidenavbar-title-background | 标题的背景色 | `$color-background` |
-| \--nutui-sidenavbar-title-color | 标题的字体颜色 | `$color-title` |
-| \--nutui-sidenavbar-sub-title-padding | 子标题的内边距 | `10px 8px 10px 35px` |
-| \--nutui-sidenavbar-sub-title-background | 子标题背景色 | `$color-background-sunken` |
-| \--nutui-sidenavbar-sub-title-color | 子标题字体颜色 | `$color-title` |
-| \--nutui-sidenavbar-sub-list-background | 选项列表背景色 | `$color-background-sunken` |
-| \--nutui-sidenavbar-sub-list-color | 选项列表字体颜色 | `$color-title` |
diff --git a/src/packages/sidenavbar/doc.taro.md b/src/packages/sidenavbar/doc.taro.md
deleted file mode 100644
index f8ec0847b6..0000000000
--- a/src/packages/sidenavbar/doc.taro.md
+++ /dev/null
@@ -1,85 +0,0 @@
-# SideNavBar组件
-
-> **⚠️ 注意：** 该组件即将被废弃。请使用 [SideBar](#/zh-CN/component/sidebar) 代替。
-> 用于内容选择和切换
-
-## 引入
-
-```tsx
-import {
- SideNavBar,
- SubSideNavBar,
- SideNavBarItem,
-} from '@nutui/nutui-react-taro'
-```
-
-## 示例代码
-
-### 基础用法
-
-:::demo
-
-
-
-:::
-
-### 嵌套及回调
-
-:::demo
-
-
-
-:::
-
-## SideNavBar
-
-### Props
-
-| 属性 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| visible | 组件是否显示 | `boolean` | `false` |
-| title | 整体标题 | `string` | `-` |
-| width | 遮罩宽度百分比 | `string` | `80%` |
-| position | 弹出位置 | `left` \| `right` | `left` |
-| indent | 缩进宽度 | `number` | `20` |
-| onClose | 关闭遮罩时触发 | `-` | `-` |
-
-## SubSideNavBar
-
-### Props
-
-| 属性 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| key | 导航唯一标识 | `string` \| `number` | `-` |
-| title | 整体标题 | `string` | `-` |
-| open | 导航是否默认展开 | `boolean` | `true` |
-| onClick | 导航点击 | `({title: string, value: string \| number, isShow: boolean}) => void` | `-` |
-
-## SideNavBarItem
-
-### Props
-
-| 属性 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| key | 导航唯一标识 | `string` \| `number` | `-` |
-| title | 整体标题 | `string` | `-` |
-| onClick | 导航点击 | `({title: string, value: string \| number}) => void` | `-` |
-
-## 主题定制
-
-### 样式变量
-
-组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/component/configprovider)。
-
-| 名称 | 说明 | 默认值 |
-| --- | --- | --- |
-| \--nutui-sidenavbar-content-bg-color | 侧边栏导航背景色 | `$white` |
-| \--nutui-sidenavbar-item-height | 侧边栏每项的高度 | `40px` |
-| \--nutui-sidenavbar-title-padding | 标题的内边距 | `10px 8px 10px 20px` |
-| \--nutui-sidenavbar-title-background | 标题的背景色 | `$color-background` |
-| \--nutui-sidenavbar-title-color | 标题的字体颜色 | `$color-title` |
-| \--nutui-sidenavbar-sub-title-padding | 子标题的内边距 | `10px 8px 10px 35px` |
-| \--nutui-sidenavbar-sub-title-background | 子标题背景色 | `$color-background-sunken` |
-| \--nutui-sidenavbar-sub-title-color | 子标题字体颜色 | `$color-title` |
-| \--nutui-sidenavbar-sub-list-background | 选项列表背景色 | `$color-background-sunken` |
-| \--nutui-sidenavbar-sub-list-color | 选项列表字体颜色 | `$color-title` |
diff --git a/src/packages/sidenavbar/doc.zh-TW.md b/src/packages/sidenavbar/doc.zh-TW.md
deleted file mode 100644
index 6cdbfbe98e..0000000000
--- a/src/packages/sidenavbar/doc.zh-TW.md
+++ /dev/null
@@ -1,82 +0,0 @@
-# SideNavBar組件
-
-> **⚠️ 注意：** 該組件即將被廢棄。請使用 [SideBar](#/zh-CN/component/sidebar) 代替。
-
-用於內容選擇和切換
-
-## 引入
-
-```tsx
-import { SideNavBar, SubSideNavBar, SideNavBarItem } from '@nutui/nutui-react'
-```
-
-## 示例代碼
-
-### 基礎用法
-
-:::demo
-
-
-
-:::
-
-### 導航嵌套（建議最多三層）
-
-:::demo
-
-
-
-:::
-
-## SideNavBar
-
-### Props
-
-| 屬性 | 說明 | 類型 | 默認值 |
-| --- | --- | --- | --- |
-| visible | 組件是否顯示 | `boolean` | `false` |
-| title | 整體標題 | `string` | `-` |
-| width | 遮罩寬度百分比 | `string` | `80%` |
-| position | 彈出位置 | `left` \| `right` | `left` |
-| offset | 縮進寬度 | `number` | `20` |
-| onClose | 關閉遮罩時觸發 | `-` | `-` |
-
-## SubSideNavBar
-
-### Props
-
-| 屬性 | 說明 | 類型 | 默認值 |
-| --- | --- | --- | --- |
-| value | 導航唯一標識 | `string` \| `number` | `-` |
-| title | 整體標題 | `string` | `-` |
-| open | 導航是否默認展開 | `boolean` | `true` |
-| onClick | 導航點擊 | `({title: string, value: string \| number, isShow: boolean}) => void` | `-` |
-
-## SideNavBarItem
-
-### Props
-
-| 屬性 | 說明 | 類型 | 默認值 |
-| --- | --- | --- | --- |
-| value | 導航唯一標識 | `string` \| `number` | `-` |
-| title | 整體標題 | `string` | `-` |
-| onClick | 導航點擊 | `({title: string, value: string \| number}) => void` | `-` |
-
-## 主題定制
-
-### 樣式變量
-
-組件提供了下列 CSS 變量，可用於自定義樣式，使用方法請參考 [ConfigProvider 組件](#/zh-CN/component/configprovider)。
-
-| 名稱 | 說明 | 默認值 |
-| --- | --- | --- |
-| \--nutui-sidenavbar-content-bg-color | 側邊欄導航背景色 | `$white` |
-| \--nutui-sidenavbar-item-height | 側邊欄每項的高度 | `40px` |
-| \--nutui-sidenavbar-title-padding | 標題的內邊距 | `10px 8px 10px 20px` |
-| \--nutui-sidenavbar-title-background | 標題的背景色 | `$color-background` |
-| \--nutui-sidenavbar-title-color | 標題的字體顏色 | `$color-title` |
-| \--nutui-sidenavbar-sub-title-padding | 子標題的內邊距 | `10px 8px 10px 35px` |
-| \--nutui-sidenavbar-sub-title-background | 子標題背景色 | `$color-background-sunken` |
-| \--nutui-sidenavbar-sub-title-color | 子標題字體顏色 | `$color-title` |
-| \--nutui-sidenavbar-sub-list-background | 選項列表背景色 | `$color-background-sunken` |
-| \--nutui-sidenavbar-sub-list-color | 選項列表字體顏色 | `$color-title` |
diff --git a/src/packages/sidenavbar/index.taro.ts b/src/packages/sidenavbar/index.taro.ts
deleted file mode 100644
index b3cb892b74..0000000000
--- a/src/packages/sidenavbar/index.taro.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { SideNavBar } from './sidenavbar.taro'
-
-export type { SideNavBarProps } from './sidenavbar.taro'
-export default SideNavBar
diff --git a/src/packages/sidenavbar/index.ts b/src/packages/sidenavbar/index.ts
deleted file mode 100644
index ac1ef65e13..0000000000
--- a/src/packages/sidenavbar/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { SideNavBar } from './sidenavbar'
-
-export type { SideNavBarProps } from './sidenavbar'
-export default SideNavBar
diff --git a/src/packages/sidenavbar/sidenavbar.scss b/src/packages/sidenavbar/sidenavbar.scss
deleted file mode 100644
index 2be98c8f60..0000000000
--- a/src/packages/sidenavbar/sidenavbar.scss
+++ /dev/null
@@ -1,91 +0,0 @@
-@import '../popup/popup.scss';
-
-.nut-sidenavbar {
- color: #1d1d21;
- font-size: 14px;
- height: 100%;
- overflow: auto;
- display: block;
- background-color: $sidenavbar-content-bg-color;
-
- .arrow-icon {
- position: absolute;
- width: 0;
- height: 0;
- right: 16px;
- top: 18px;
- cursor: pointer;
- }
-
- .arrow-down {
- border-top: 4px solid $color-text-help;
- border-left: 4px solid transparent;
- border-right: 4px solid transparent;
- }
-
- .arrow-up {
- border-bottom: 4px solid $color-text-help;
- border-left: 4px solid transparent;
- border-right: 4px solid transparent;
- }
-
- &-title {
- height: $sidenavbar-item-height;
- padding: $sidenavbar-title-padding;
- background: $sidenavbar-title-background;
- color: $sidenavbar-title-color;
- box-sizing: border-box;
- transition: transform 0.5s;
- }
-
- &-content {
- position: relative;
- display: block;
- }
-
- &-list {
- &.sidenavbar-show {
- .nut-sidenavbar-content {
- height: auto;
- overflow: inherit;
- }
- }
-
- &.sidenavbar-hide {
- .nut-sidenavbar-content {
- height: 0;
- overflow: hidden;
- }
- }
- }
-
- .nut-subsidenavbar-border-bt {
- position: relative;
-
- &:after {
- content: '';
- position: absolute;
- width: 100%;
- height: 1px;
- background: #eeeff2;
- transform: scale(1, 0.5);
- left: 0;
- bottom: 0;
- }
- }
-}
-
-[dir='rtl'] .nut-sidenavbar,
-.nut-rtl .nut-sidenavbar {
- .arrow-icon {
- right: auto;
- left: 16px;
- }
-
- .nut-subsidenavbar-border-bt {
- &:after {
- left: auto;
- right: 0;
- }
- }
-}
diff --git a/src/packages/sidenavbar/sidenavbar.taro.tsx b/src/packages/sidenavbar/sidenavbar.taro.tsx
deleted file mode 100644
index 64cc360761..0000000000
--- a/src/packages/sidenavbar/sidenavbar.taro.tsx
+++ /dev/null
@@ -1,90 +0,0 @@
-import React, { FunctionComponent, useState, ReactNode, useEffect } from 'react'
-import classNames from 'classnames'
-import { View } from '@tarojs/components'
-import Popup from '@/packages/popup/index.taro'
-import { OffsetContext } from './context'
-import { BasicComponent, ComponentDefaults } from '@/utils/typings'
-/**
- * @deprecated Use SideBar instead.
- */
-export interface SideNavBarProps
- extends Omit, 'title'>,
- BasicComponent {
- title: ReactNode
- visible: boolean
- width: string
- indent: number
- position: 'left' | 'right'
- onClose: () => void
-}
-
-const defaultProps = {
- ...ComponentDefaults,
- position: 'left',
- width: '80%',
-} as SideNavBarProps
-export const SideNavBar: FunctionComponent> = (
- props
-) => {
- useEffect(() => {
- console.warn(
- 'Warning: SideNavBar is deprecated and will be removed in future versions. Please use NewComponent SideBar instead.'
- )
- }, [])
- const classPrefix = 'nut-sidenavbar'
- const {
- title,
- visible,
- width,
- position,
- children,
- className,
- onClose,
- indent,
- ...rest
- } = {
- ...defaultProps,
- ...props,
- }
- const innerIndent = indent ? Number(indent) : 20
- const [sidenavbarShow, setSidenavbarShow] = useState(true)
- const handleClick = () => {
- setSidenavbarShow(!sidenavbarShow)
- }
- return (
-
-
-
-
-
- {title}
-
-
-
- {children}
-
-
-
-
-
- )
-}
-
-SideNavBar.displayName = 'NutSideNavBar'
diff --git a/src/packages/sidenavbar/sidenavbar.tsx b/src/packages/sidenavbar/sidenavbar.tsx
deleted file mode 100644
index 724a298128..0000000000
--- a/src/packages/sidenavbar/sidenavbar.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import React, { FunctionComponent, ReactNode, useEffect } from 'react'
-import classNames from 'classnames'
-import Popup from '@/packages/popup'
-import { handleClick } from './utils'
-import { OffsetContext } from './context'
-import { BasicComponent, ComponentDefaults } from '@/utils/typings'
-/**
- * @deprecated Use SideBar instead.
- */
-export interface SideNavBarProps
- extends Omit, 'title'>,
- BasicComponent {
- title: ReactNode
- visible: boolean
- width: string
- indent: number
- position: 'left' | 'right'
- onClose: () => void
-}
-
-const defaultProps = {
- ...ComponentDefaults,
- position: 'left',
- width: '80%',
-} as SideNavBarProps
-
-export const SideNavBar: FunctionComponent> = (
- props
-) => {
- useEffect(() => {
- console.warn(
- 'Warning: SideNavBar is deprecated and will be removed in future versions. Please use NewComponent SideBar instead.'
- )
- }, [])
- const classPrefix = 'nut-sidenavbar'
- const {
- title,
- visible,
- width,
- position,
- children,
- className,
- onClose,
- indent,
- ...rest
- } = {
- ...defaultProps,
- ...props,
- }
- const innerIndent = indent ? Number(indent) : 20
-
- return (
-
-
-
-
-
- {title}
-
-
- {children}
-
-
-
-
- 一级内容1
-
-
-`;
diff --git a/src/packages/sidenavbaritem/__test__/sidenavbaritem.spec.tsx b/src/packages/sidenavbaritem/__test__/sidenavbaritem.spec.tsx
deleted file mode 100644
index fbd65f8d2e..0000000000
--- a/src/packages/sidenavbaritem/__test__/sidenavbaritem.spec.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import React from 'react'
-
-import { render, fireEvent } from '@testing-library/react'
-import '@testing-library/jest-dom'
-
-import SideNavBarItem from '@/packages/sidenavbaritem'
-
-test('should match snapshot', () => {
- const { asFragment } = render(
-
- )
- expect(asFragment()).toMatchSnapshot()
-})
-test('should emit click event', async () => {
- const click = vi.fn()
- const { getByTestId } = render(
- <>
-
-
- )
- fireEvent.click(getByTestId('sideNavBarItem-click'))
- expect(click).toBeCalled()
-})
diff --git a/src/packages/sidenavbaritem/index.taro.ts b/src/packages/sidenavbaritem/index.taro.ts
deleted file mode 100644
index 050a204d2c..0000000000
--- a/src/packages/sidenavbaritem/index.taro.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { SideNavBarItem } from './sidenavbaritem.taro'
-
-export type { SideNavBarItemProps } from './sidenavbaritem.taro'
-export default SideNavBarItem
diff --git a/src/packages/sidenavbaritem/index.ts b/src/packages/sidenavbaritem/index.ts
deleted file mode 100644
index e898d23def..0000000000
--- a/src/packages/sidenavbaritem/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { SideNavBarItem } from './sidenavbaritem'
-
-export type { SideNavBarItemProps } from './sidenavbaritem'
-export default SideNavBarItem
diff --git a/src/packages/sidenavbaritem/sidenavbaritem.scss b/src/packages/sidenavbaritem/sidenavbaritem.scss
deleted file mode 100644
index 3edc809620..0000000000
--- a/src/packages/sidenavbaritem/sidenavbaritem.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.nut-subsidenavbar {
- &-item {
- height: $sidenavbar-item-height;
- color: $sidenavbar-sub-item-color;
- padding: $sidenavbar-sub-item-padding;
- box-sizing: border-box;
- }
-
- &-list {
- background-color: $sidenavbar-sub-list-background;
- color: $sidenavbar-sub-list-color;
- }
-}
diff --git a/src/packages/sidenavbaritem/sidenavbaritem.taro.tsx b/src/packages/sidenavbaritem/sidenavbaritem.taro.tsx
deleted file mode 100644
index 6f5d0289fd..0000000000
--- a/src/packages/sidenavbaritem/sidenavbaritem.taro.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React, { FunctionComponent, MouseEventHandler } from 'react'
-
-export type SideNavBarItemProps = {
- title: string
- value: string | number
- onClick?: ({
- title,
- value,
- }: {
- title: string
- value: string | number
- }) => void
- children?: React.ReactNode
-}
-
-export const SideNavBarItem: FunctionComponent = (
- props
-) => {
- const classPrefix = 'nut-subsidenavbar'
- const { title, value, children, onClick, ...rest } = props
- const clickFn: MouseEventHandler = (e) => {
- e.stopPropagation()
- onClick && onClick({ title, value })
- }
- return (
-
- {title}
-
- )
-}
diff --git a/src/packages/sidenavbaritem/sidenavbaritem.tsx b/src/packages/sidenavbaritem/sidenavbaritem.tsx
deleted file mode 100644
index fc6b397c06..0000000000
--- a/src/packages/sidenavbaritem/sidenavbaritem.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import React, { FunctionComponent, MouseEventHandler } from 'react'
-
-export type SideNavBarItemProps = {
- title: string
- value: string | number
- onClick?: ({
- title,
- value,
- }: {
- title: string
- value: string | number
- }) => void
- children?: React.ReactNode
-}
-export const SideNavBarItem: FunctionComponent = (
- props
-) => {
- const classPrefix = 'nut-subsidenavbar'
- const { title, value, children, onClick, ...rest } = props
- const clickFn: MouseEventHandler = (e) => {
- e.stopPropagation()
- onClick && onClick({ title, value })
- }
- return (
-
- {title}
-
- )
-}
diff --git a/src/packages/subsidenavbar/__test__/__snapshots__/subsidenavbar.spec.tsx.snap b/src/packages/subsidenavbar/__test__/__snapshots__/subsidenavbar.spec.tsx.snap
deleted file mode 100644
index 454ac19b5a..0000000000
--- a/src/packages/subsidenavbar/__test__/__snapshots__/subsidenavbar.spec.tsx.snap
+++ /dev/null
@@ -1,30 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`should match snapshot 1`] = `
-
-
-
-`;
diff --git a/src/packages/subsidenavbar/__test__/subsidenavbar.spec.tsx b/src/packages/subsidenavbar/__test__/subsidenavbar.spec.tsx
deleted file mode 100644
index 1b1df86a59..0000000000
--- a/src/packages/subsidenavbar/__test__/subsidenavbar.spec.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import React from 'react'
-import { render, fireEvent } from '@testing-library/react'
-import '@testing-library/jest-dom'
-import SubSideNavBar from '@/packages/subsidenavbar'
-import SideNavBarItem from '@/packages/sidenavbaritem'
-
-test('should match snapshot', () => {
- const { asFragment } = render(
-
-
-
- )
- expect(asFragment()).toMatchSnapshot()
-})
-test('navigation should be hide', async () => {
- const { container } = render(
- <>
-
-
-
-
- )
-
- expect(container.querySelector('.nut-subsidenavbar-list')).toHaveClass(
- 'sidenavbar-hide'
- )
-})
-test('should emit titleClick event', async () => {
- const titleClick = vi.fn()
- const { getByTestId } = render(
- <>
-
-
-
-
- )
- fireEvent.click(getByTestId('SubSideNavBar-click'))
- expect(titleClick).toBeCalled()
-})
diff --git a/src/packages/subsidenavbar/index.taro.ts b/src/packages/subsidenavbar/index.taro.ts
deleted file mode 100644
index 0c4964cea4..0000000000
--- a/src/packages/subsidenavbar/index.taro.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { SubSideNavBar } from './subsidenavbar.taro'
-
-export type { SubSideNavBarProps } from './subsidenavbar.taro'
-export default SubSideNavBar
diff --git a/src/packages/subsidenavbar/index.ts b/src/packages/subsidenavbar/index.ts
deleted file mode 100644
index cd112b854f..0000000000
--- a/src/packages/subsidenavbar/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { SubSideNavBar } from './subsidenavbar'
-
-export type { SubSideNavBarProps } from './subsidenavbar'
-export default SubSideNavBar
diff --git a/src/packages/subsidenavbar/subsidenavbar.scss b/src/packages/subsidenavbar/subsidenavbar.scss
deleted file mode 100644
index df35074d4e..0000000000
--- a/src/packages/subsidenavbar/subsidenavbar.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-.nut-subsidenavbar {
- &-title {
- height: $sidenavbar-item-height;
- padding: $sidenavbar-sub-title-padding;
- box-sizing: border-box;
- background-color: $sidenavbar-sub-title-background;
- color: $sidenavbar-sub-title-color;
- box-sizing: border-box;
- }
-
- &-list {
- &.sidenavbar-show {
- .nut-subsidenavbar-content {
- height: auto;
- overflow: inherit;
- }
- }
-
- &.sidenavbar-hide {
- .nut-subsidenavbar-content {
- height: 0;
- overflow: hidden;
- }
- }
- }
-}
diff --git a/src/packages/subsidenavbar/subsidenavbar.taro.tsx b/src/packages/subsidenavbar/subsidenavbar.taro.tsx
deleted file mode 100644
index 6597cbcd22..0000000000
--- a/src/packages/subsidenavbar/subsidenavbar.taro.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import React, {
- FunctionComponent,
- useRef,
- useEffect,
- useCallback,
- MouseEventHandler,
- useContext,
- useState,
-} from 'react'
-import { View } from '@tarojs/components'
-import { OffsetContext } from '../sidenavbar/context'
-
-export type SubSideNavBarProps = {
- title: string
- value: string | number
- open?: boolean
- children?: React.ReactNode
- onClick?: ({
- title,
- value,
- isShow,
- }: {
- title: string
- value: string | number
- isShow: boolean
- }) => void
-}
-const defaultProps = {
- open: true,
-} as SubSideNavBarProps
-export const SubSideNavBar: FunctionComponent = (props) => {
- const classPrefix = 'nut-subsidenavbar'
- const { title, value, children, onClick, open, ...rest } = {
- ...defaultProps,
- ...props,
- }
- const [subShow, setSubShow] = useState(open)
- const offset = useContext(OffsetContext)
- const listRef = useRef(null)
-
- const setListLevel = useCallback(
- (nodeList: HTMLCollection, level = 1) => {
- const titleClass = nodeList[0].className
- if (titleClass.includes(`${classPrefix}-title`)) {
- const left = offset * (level + 1)
- // eslint-disable-next-line no-param-reassign
- ;(nodeList[0] as HTMLElement).style.paddingLeft = `${left}px`
- }
- const childNodes =
- nodeList[1] &&
- nodeList[1].children &&
- Array.from(nodeList[1].children).filter(
- (item) => item.nodeType !== 3 && item.nodeType !== 8
- )
- childNodes.forEach((item) => {
- const itemClass = item.className
-
- if (itemClass.includes(`${classPrefix}-item`)) {
- const left = offset * (level + 2)
- // eslint-disable-next-line no-param-reassign
- ;(item as HTMLElement).style.paddingLeft = `${left}px`
- }
- if (itemClass.includes(`${classPrefix}-list`)) {
- let level = item.getAttribute('level')
- ? Number(item.getAttribute('level'))
- : 1
- level += 1
- item.setAttribute('level', level.toString())
- item.children && setListLevel(item.children, level)
- }
- })
- },
- [offset]
- )
- const clickFn: MouseEventHandler = (e) => {
- e.stopPropagation()
- setSubShow(!subShow)
- const isShow = !subShow
- onClick && onClick({ title, value, isShow })
- }
- useEffect(() => {
- const childNodes = listRef.current?.children as HTMLCollection
- listRef.current?.setAttribute('level', '1')
- childNodes && setListLevel(childNodes)
- }, [setListLevel])
- const divClass = subShow
- ? `${classPrefix}-list sidenavbar-show`
- : `${classPrefix}-list sidenavbar-hide`
- const iconClass = subShow ? 'arrow-icon arrow-down' : 'arrow-icon arrow-up'
-
- return (
-
-
- {title}
-
- {children}
-
- )
-}
diff --git a/src/packages/subsidenavbar/subsidenavbar.tsx b/src/packages/subsidenavbar/subsidenavbar.tsx
deleted file mode 100644
index 2c74d8deab..0000000000
--- a/src/packages/subsidenavbar/subsidenavbar.tsx
+++ /dev/null
@@ -1,96 +0,0 @@
-import React, {
- FunctionComponent,
- useRef,
- useEffect,
- useCallback,
- MouseEventHandler,
- useContext,
-} from 'react'
-import { handleClick } from '../sidenavbar/utils'
-import { OffsetContext } from '../sidenavbar/context'
-
-export type SubSideNavBarProps = {
- title: string
- value: string | number
- open?: boolean
- children?: React.ReactNode
- onClick?: ({
- title,
- value,
- isShow,
- }: {
- title: string
- value: string | number
- isShow: boolean
- }) => void
-}
-const defaultProps = {
- open: true,
-} as SubSideNavBarProps
-export const SubSideNavBar: FunctionComponent = (props) => {
- const classPrefix = 'nut-subsidenavbar'
- const { title, value, children, onClick, open, ...rest } = {
- ...defaultProps,
- ...props,
- }
- const offset = useContext(OffsetContext)
- const listRef = useRef(null)
- const setListLevel = useCallback(
- (nodeList: HTMLCollection, level = 1) => {
- const titleClass = nodeList[0].className
- if (titleClass.includes(`${classPrefix}-title`)) {
- const left = offset * (level + 1)
- // eslint-disable-next-line no-param-reassign
- ;(nodeList[0] as HTMLElement).style.paddingLeft = `${left}px`
- }
- const childNodes =
- nodeList[1] &&
- nodeList[1].children &&
- Array.from(nodeList[1].children).filter(
- (item) => item.nodeType !== 3 && item.nodeType !== 8
- )
- childNodes.forEach((item) => {
- const itemClass = item.className
-
- if (itemClass.includes(`${classPrefix}-item`)) {
- const left = offset * (level + 2)
- // eslint-disable-next-line no-param-reassign
- ;(item as HTMLElement).style.paddingLeft = `${left}px`
- }
- if (itemClass.includes(`${classPrefix}-list`)) {
- let level = item.getAttribute('level')
- ? Number(item.getAttribute('level'))
- : 1
- level += 1
- item.setAttribute('level', level.toString())
- item.children && setListLevel(item.children, level)
- }
- })
- },
- [offset]
- )
- const clickFn: MouseEventHandler = (e) => {
- handleClick(e)
- const currentClass = e.currentTarget.className
- const isShow = currentClass.includes('sidenavbar-show')
- onClick && onClick({ title, value, isShow })
- }
- useEffect(() => {
- const childNodes = listRef.current?.children as HTMLCollection
- listRef.current?.setAttribute('level', '1')
- childNodes && setListLevel(childNodes)
- }, [setListLevel])
- const divClass = open
- ? `${classPrefix}-list sidenavbar-show`
- : `${classPrefix}-list sidenavbar-hide`
- const iconClass = open ? 'arrow-icon arrow-down' : 'arrow-icon arrow-up'
-
- return (
-
-
- {title}
-
- {children}
- | | | | | |