Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(actionsheet): harmony cpp adaption #2796

Open
wants to merge 5 commits into
base: feat_v3.x
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 12 additions & 11 deletions src/config.json
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@
"author": "hanyuxinting"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "Icon",
"type": "component",
"cName": "图标",
Expand Down Expand Up @@ -353,7 +353,7 @@
"author": "hx"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "Tabbar",
"type": "component",
"cName": "标签栏",
Expand All @@ -364,7 +364,7 @@
"author": "dsj"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "TabbarItem",
"sort": 2,
"cName": "标签栏子组件",
Expand Down Expand Up @@ -459,7 +459,7 @@
"author": "ailululu"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "Checkbox",
"type": "component",
"cName": "复选按钮",
Expand All @@ -470,7 +470,7 @@
"author": "oasis"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "CheckboxGroup",
"type": "component",
"cName": "多选按钮组",
Expand Down Expand Up @@ -621,7 +621,7 @@
"author": "vickyYe"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "Rate",
"type": "component",
"cName": "评分",
Expand Down Expand Up @@ -705,7 +705,7 @@
"enName": "feedback",
"packages": [
{
"version": "2.0.0",
"version": "3.0.0",
"name": "ActionSheet",
"type": "component",
"cName": "动作面板",
Expand All @@ -727,7 +727,7 @@
"author": "lzz"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "Dialog",
"type": "component",
"cName": "对话框",
Expand Down Expand Up @@ -902,7 +902,7 @@
"author": "swag~jun"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "AnimatingNumbers",
"type": "component",
"cName": "数字动画",
Expand Down Expand Up @@ -987,7 +987,8 @@
"sort": 17,
"show": true,
"taro": true,
"author": "songsong"
"author": "songsong",
"v14": true
},
{
"version": "2.0.0",
Expand All @@ -1001,7 +1002,7 @@
"author": "vickyYE"
},
{
"version": "2.0.0",
"version": "3.0.0",
"name": "ImagePreview",
"type": "component",
"cName": "图片预览",
Expand Down
8 changes: 6 additions & 2 deletions src/packages/actionsheet/__test__/actionsheet.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,9 @@ test('props test has value ', async () => {
'.nut-actionsheet-list .nut-actionsheet-item'
)[0]
expect(chooseTagEle).toHaveTextContent('选项一')
expect(chooseTagEle).toHaveClass('danger')
expect(chooseTagEle).toHaveClass(
'nut-actionsheet-item nut-actionsheet-item-danger'
)
})

test('props test choose item and show value', async () => {
Expand Down Expand Up @@ -101,7 +103,9 @@ test('props test disabled item has disabled classes', async () => {
'.nut-actionsheet-list .nut-actionsheet-item'
)
const disableItem = options[1]
expect(disableItem).toHaveClass('nut-actionsheet-item disabled')
expect(disableItem).toHaveClass(
'nut-actionsheet-item nut-actionsheet-item-disabled'
)
})

test('props test click disabled item and not call fn', async () => {
Expand Down
14 changes: 10 additions & 4 deletions src/packages/actionsheet/actionsheet.scss
Original file line number Diff line number Diff line change
Expand Up @@ -28,20 +28,26 @@
line-height: $actionsheet-item-line-height;
font-size: $font-size-base;
color: $actionsheet-item-color;
background-color: $color-background-overlay;
cursor: pointer;

&-name {
text-align: $actionsheet-item-text-align;
line-height: $actionsheet-item-line-height;
font-size: $font-size-base;
color: $actionsheet-item-color;
}
&-description {
display: block;
font-size: $font-size-s;
color: $color-text;
text-align: $actionsheet-item-text-align;
line-height: $actionsheet-item-line-height;
}

&.danger {
&-danger {
color: $actionsheet-item-danger;
}

&.disabled {
&-disabled {
color: $color-text-disabled !important;
cursor: not-allowed;
}
Expand Down
13 changes: 8 additions & 5 deletions src/packages/actionsheet/actionsheet.taro.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -76,16 +76,19 @@ export const ActionSheet: FunctionComponent<
{options.length ? (
<View className={`${classPrefix}-list`}>
{options.map((item, index) => {
const statusClass = `${item.disabled ? `${classPrefix}-item-disabled` : ''} ${item.danger ? `${classPrefix}-item-danger` : ''}`
return (
<View
className={`${classPrefix}-item ${
item.disabled ? 'disabled' : ''
} ${item.danger ? 'danger' : ''}`}
className={`${classPrefix}-item ${statusClass}`}
key={index}
onClick={() => chooseItem(item, index)}
>
{item[optionKey.name]}
<View className={`${classPrefix}-item-description`}>
<View className={`${classPrefix}-item-name ${statusClass}`}>
{item[optionKey.name]}
</View>
<View
className={`${classPrefix}-item-description ${statusClass}`}
>
Alex-huxiyang marked this conversation as resolved.
Show resolved Hide resolved
{item[optionKey.description]}
</View>
</View>
Expand Down
13 changes: 8 additions & 5 deletions src/packages/actionsheet/actionsheet.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -75,16 +75,19 @@ export const ActionSheet: FunctionComponent<
{options.length ? (
<div className={`${classPrefix}-list`}>
{options.map((item, index) => {
const statusClass = `${item.disabled ? `${classPrefix}-item-disabled` : ''} ${item.danger ? `${classPrefix}-item-danger` : ''}`
return (
<div
className={`${classPrefix}-item ${
item.disabled ? 'disabled' : ''
} ${item.danger ? 'danger' : ''}`}
className={`${classPrefix}-item ${statusClass}`}
key={index}
onClick={() => chooseItem(item, index)}
>
{item[optionKey.name]}
<div className={`${classPrefix}-item-description`}>
<div className={`${classPrefix}-item-name ${statusClass}`}>
{item[optionKey.name]}
</div>
<div
className={`${classPrefix}-item-description ${statusClass}`}
>
{item[optionKey.description]}
</div>
</div>
Expand Down
7 changes: 5 additions & 2 deletions src/packages/actionsheet/demos/taro/demo1.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React, { useState } from 'react'
import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
import { View } from '@tarojs/components'
import pxTransform from '@/utils/px-transform'

const Demo1 = () => {
const [val, setVal] = useState('')
Expand All @@ -25,8 +26,10 @@ const Demo1 = () => {
return (
<>
<Cell onClick={() => setIsVisible(!isVisible)}>
<span>基础用法</span>
<View style={{ marginInlineStart: '10px', color: '#999' }}>{val}</View>
<View>基础用法</View>
<View style={{ marginLeft: pxTransform(10), color: '#999' }}>
{val}
</View>
</Cell>
<ActionSheet
title="标题"
Expand Down
7 changes: 5 additions & 2 deletions src/packages/actionsheet/demos/taro/demo2.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React, { useState } from 'react'
import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
import { View } from '@tarojs/components'
import pxTransform from '@/utils/px-transform'

const Demo2 = () => {
const [isVisible, setIsVisible] = useState(false)
Expand All @@ -23,8 +24,10 @@ const Demo2 = () => {
return (
<>
<Cell onClick={() => setIsVisible(!isVisible)}>
<span>展示取消按钮</span>
<View style={{ marginInlineStart: '10px', color: '#999' }}>{val}</View>
<View>展示取消按钮</View>
<View style={{ marginLeft: pxTransform(10), color: '#999' }}>
{val}
</View>
</Cell>
<ActionSheet
visible={isVisible}
Expand Down
7 changes: 5 additions & 2 deletions src/packages/actionsheet/demos/taro/demo3.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React, { useState } from 'react'
import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
import { View } from '@tarojs/components'
import pxTransform from '@/utils/px-transform'

const Demo3 = () => {
const [isVisible, setIsVisible] = useState(false)
Expand All @@ -24,8 +25,10 @@ const Demo3 = () => {
return (
<>
<Cell onClick={() => setIsVisible(!isVisible)}>
<span>展示描述信息</span>
<View style={{ marginInlineStart: '10px', color: '#999' }}>{val}</View>
<View>展示描述信息</View>
<View style={{ marginLeft: pxTransform(10), color: '#999' }}>
{val}
</View>
</Cell>
<ActionSheet
visible={isVisible}
Expand Down
3 changes: 2 additions & 1 deletion src/packages/actionsheet/demos/taro/demo4.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import React, { useState } from 'react'
import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
import { View } from '@tarojs/components'

const Demo4 = () => {
const [isVisible, setIsVisible] = useState(false)
Expand All @@ -16,7 +17,7 @@ const Demo4 = () => {
return (
<>
<Cell onClick={() => setIsVisible(!isVisible)}>
<span>选项状态</span>
<View>选项状态</View>
</Cell>
<ActionSheet
visible={isVisible}
Expand Down
18 changes: 10 additions & 8 deletions src/packages/actionsheet/demos/taro/demo5.tsx
Original file line number Diff line number Diff line change
@@ -1,13 +1,19 @@
import React, { useState } from 'react'
import React, { CSSProperties, useState } from 'react'
import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
import { View } from '@tarojs/components'
import pxTransform from '@/utils/px-transform'

const Demo5 = () => {
const [isVisible, setIsVisible] = useState(false)
const viewStyle: CSSProperties = {
textAlign: 'left',
paddingLeft: pxTransform(20),
paddingTop: pxTransform(10),
}
return (
<>
<Cell onClick={() => setIsVisible(!isVisible)}>
<span>自定义内容</span>
<View>自定义内容</View>
</Cell>
<ActionSheet
visible={isVisible}
Expand All @@ -17,12 +23,8 @@ const Demo5 = () => {
}}
onCancel={() => setIsVisible(false)}
>
<View style={{ textAlign: 'left', padding: '10px 20px' }}>
新建表格
</View>
<View style={{ textAlign: 'left', padding: '10px 20px' }}>
新建文档
</View>
<View style={viewStyle}>新建表格</View>
<View style={viewStyle}>新建文档</View>
</ActionSheet>
</>
)
Expand Down
3 changes: 2 additions & 1 deletion src/packages/actionsheet/demos/taro/demo6.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import React, { useState } from 'react'
import { ActionSheet, Cell } from '@nutui/nutui-react-taro'
import { View } from '@tarojs/components'

const Demo6 = () => {
const [isVisible, setIsVisible] = useState(false)
Expand All @@ -21,7 +22,7 @@ const Demo6 = () => {
return (
<>
<Cell onClick={() => setIsVisible(!isVisible)}>
<span>自定义key</span>
<View>自定义key</View>
</Cell>
<ActionSheet
visible={isVisible}
Expand Down
3 changes: 0 additions & 3 deletions src/packages/popup/popup.scss
Original file line number Diff line number Diff line change
Expand Up @@ -100,9 +100,6 @@
bottom: 0;
left: 0;
width: 100%;
/* #ifdef rn */
height: 300px;
/* #endif */

&.nut-popup-round {
border-radius: $popup-border-radius $popup-border-radius 0 0;
Expand Down
Loading