1.0.37

Readme.md

@@ -10,92 +10,7 @@ yarn duxapp app add duxui
 
 此模块需要在 [duxapp 框架](https://app.docs.dux.plus) 中运行
 
-## 组件库
-
-### 基础组件
-- Button 按钮
-- Cell 单元格
-- LinearGradient 渐变
-- BoxShadow 阴影
-- Loading 加载动画
-- Icon 图标
-
-### 布局组件
-- Column flex竖向
-- Row flex横向
-- Space 间距
-- BoxShadow 阴影
-- Divider 分割线
-- Grid 宫格
-- Card 卡片
-
-### 导航组件
-- Header 头部导航
-- Tab 选项卡切换
-- TabBar 底部导航
-- BoxShadow 阴影
-- Elevator 电梯楼层
-- Menu 下拉菜单
-
-### 表单组件
-- Form 表单
-- Input 输入框
-- Textarea 多行文本
-- Picker 选择器
-- Date 日期时间
-- Radio 单选
-- Checkbox 多选
-- Radio 单选
-- Switch 开关
-- Radio 单选
-- Calendar 日历
-- Grade 评分
-- Cascade 级联选择
-- CardSelect 卡片选择器
-- Upload 上传
-- ModalForm 弹出表单
-- ModalForms 弹出复杂表单(对象数组)
-- NumberKeyboard 数字键盘
-- InputCode 验证码密码输入
-- LicensePlate 车牌号输入
-
-### 展示组件
-- Text 文本
-- Image 图片
-- Badge 徽标
-- Tag 标签
-- Avatar 头像
-- HtmlView 富文本
-- Step 步骤条
-- Empty 空数据
-- Status 角标状态
-
-### 操作反馈
-- LongPress 长按
-- TouchableOpacity 触摸反馈
-- Layout 布局计算
-- TopView 顶层容器
-- Absolute 绝对定位
-- PullView 弹出层
-- Modal 弹框
-- DropDown 下拉菜单
-- loding 显示加载动画
-- message 消息通知
-- confirm 确认弹框
-
-### 内容优化
-- List 分页列表
-- Detail 内容详情
-
-### 高级
-- Share 分享系统
-- Chart echarts图表
-- Map 地图
-- Sign 签名
-- HorseLanternLottery 跑马灯抽奖
-- UploadManage 大文件上传及管理
-
-## 在线示例
+## 示例
 
 - 小程序 （小程序搜索 duxui）
 - APP https://app.share.dux.plus/com.duxapp.duxui

app.json

@@ -1,15 +1,15 @@
 {
   "name": "duxui",
   "description": "DUXUI库",
-  "version": "1.0.34",
+  "version": "1.0.37",
   "dependencies": [
     "duxapp"
   ],
   "npm": {
     "dependencies": {
       "b-validate": "^1.5.2",
       "react-native-view-shot": "^3.8.0",
-      "react-native-fast-shadow": "^0.1.0",
+      "react-native-fast-shadow": "0.1.0",
       "array-tree-filter": "^2.1.0"
     }
   }

changelog.md

@@ -1,3 +1,31 @@
+# 1.0.37
+## LinearGradient
+修复RN设置rgba不显示透明度的问题
+
+## Cell
+Cell.Group 添加样式属性支持
+
+## Checkbox Radio
+新增 disabled 用于禁用选项
+
+## FormItem
+- label属性如果为传入，则和原来逻辑一致，label传入空字符串则会按照传入的逻辑，但是不显示label内容，即可以显示desc，可以显示验证错误等
+- 修复 rules 在组件卸载之后不清除的问题
+- 新增 itemPadding 属性，boolean类型，可以设置开启或者关闭当前项目的内边距，默认开启
+- 将 direction 属性更改为 vertical，用于指定是否竖向布局
+- 新增两个主题配置，用于配置项目内边距和label的宽度
+
+## Form
+- 新增 itemPadding 属性，boolean类型，可以设置开启或者关闭项目的内边距，默认开启
+- 将 direction 属性更改为 vertical，用于指定是否竖向布局
+
+## UploadImages UploadImage
+新增 option 属性，将会传入到上传函数的参数属性
+
+## 其他修复
+- 修复Input值可能不正确的问题
+- Status type 属性新增 default
+
 # 1.0.34
 ## Calendar
 - 新增onDayClick属性，点击某一天的事件，可以返回 true 阻止默认操作，如选中日历

components/Cell/index.jsx

@@ -1,6 +1,7 @@
 import { Text, View } from '@tarojs/components'
 import React, { createContext, useContext } from 'react'
 import { duxappTheme } from '@/duxui/utils'
+import classNames from 'classnames'
 import { Divider } from '../Divider'
 import { BoxShadow } from '../BoxShadow'
 import './index.scss'
@@ -28,10 +29,12 @@ const Root = ({
 const Group = ({
   line = true,
   radius = duxappTheme.common.radiusValue,
-  children
+  children,
+  className,
+  style
 }) => {
   return <>
-    <BoxShadow className='CellGroup' radius={radius}>
+    <BoxShadow className={classNames('CellGroup', className)} style={style} radius={radius}>
       <context.Provider value={{ group: true }}>
         {
           line

components/Form/Checkbox.d.ts

@@ -16,9 +16,9 @@ interface CheckboxGroupProps {
    */
   onChange?: (value: any[]) => void
   /**
-   * 复选框的布局方向
+   * 是否垂直布局
    */
-  direction?: Direction
+  vertical?: boolean
   /**
    * 附加在复选框组容器上的 CSS 类名
    */
@@ -31,6 +31,10 @@ interface CheckboxGroupProps {
    * 附加在复选框组容器上的样式
    */
   style?: CSSProperties
+  /**
+   * 禁用选项
+   */
+  disabled?: boolean
   /**
    * 其他属性
    */

components/Form/Checkbox.jsx

@@ -13,13 +13,14 @@ const CheckboxGroup = ({
   onChange,
   disabled,
   direction = 'horizontal',
+  vertical,
   style,
   className,
   virtual,
   ...props
 }) => {
 
-  const horizontal = direction === 'horizontal'
+  const horizontal = direction === 'horizontal' && !vertical
 
   const check = useCallback(val => {
     if (disabled) {
@@ -60,7 +61,7 @@ CheckboxGroup.defaultProps = {
 //   console.log('12323',value, props)
 // }
 
-export const Checkbox = ({ value, label, checked, children: Child, className, style, ...props }) => {
+export const Checkbox = ({ value, label, checked, disabled, children: Child, className, style, ...props }) => {
   const { check, currentValue } = useContext(context)
 
   const isCheck = checked || currentValue?.includes(value)
@@ -71,11 +72,11 @@ export const Checkbox = ({ value, label, checked, children: Child, className, st
       value={value}
       label={label}
       checked={isCheck}
-      onCheck={() => check(value)}
+      onCheck={() => !disabled && check(value)}
     />
   }
 
-  return <Space row items='center' size={8} onClick={() => check(value)} className={className} style={style}  {...props}>
+  return <Space row items='center' size={8} onClick={() => !disabled && check(value)} className={className} style={style}  {...props}>
     <Text size={32} type={isCheck ? 'primary' : void 0} color={isCheck ? void 0 : 3}>
       <DuxuiIcon name={isCheck ? 'xuanzhong' : 'xuanzekuang'} />
     </Text>

components/Form/Form.d.ts

@@ -39,8 +39,8 @@ interface FormChildProps extends FormRef {
   labelProps?: TextProps
   /** 全局传递给项目容器的属性 */
   containerProps?: SpaceProps
-  /** 表单方向 */
-  direction?: keyof Direction
+  /** 是否垂直布局 */
+  vertical?: boolean
   /** 是否禁用表单 */
   disabled?: boolean
   /** 验证错误信息 */
@@ -58,12 +58,14 @@ interface FormProps {
   onSubmit?: (values: Values) => void
   /** 是否禁用表单 */
   disabled?: boolean
-  /** 方向 */
-  direction?: keyof Direction
+  /** 是否垂直布局 */
+  vertical?: boolean
   /** 全局传递给标签的属性 */
   labelProps?: TextProps
   /** 全局传递给项目容器的属性 */
   containerProps?: SpaceProps
+  /** 是否使用项目的内边距 默认为开启 */
+  itemPadding?: boolean
   /** 子元素 */
   children?: ReactNode | FormChild
   /** 表单操作 */
@@ -86,7 +88,10 @@ interface FormItemProps {
    * 开启之后 子表单 value将是整个表单的值 onChange 相当于 setValues
    */
   fields?: boolean
-  /** 标题 */
+  /** 标题
+   * 如果未传入属性则只会显示子元素
+   * 如果传入一个空字符串怎不会显示label 但是会显示 错误提示 desc 项目内边距
+   */
   label?: string
   /** 标题属性 */
   labelProps?: TextProps
@@ -98,8 +103,8 @@ interface FormItemProps {
   renderLabelRight?: ReactNode
   /** 简介 渲染在表单下面 */
   desc?: string
-  /** 排列方向 默认为 horizontal */
-  direction?: keyof Direction
+  /** 是否垂直布局 */
+  vertical?: boolean
   /** 是否显示红色星号 不作为验证规则 */
   required?: boolean
   /** 表单默认值 */
@@ -235,5 +240,9 @@ export const Form: React.FC<FormProps> & {
    * @param props
    * @returns
    */
-  useFormItemProxy: (props: { value?: any, onChange: (val: any) => void }) => [any, (val: any) => void]
+  useFormItemProxy: (props: {
+    value?: string
+    onChange: (val: string) => void,
+    defaultValue?: string
+  }) => [any, (val: any) => void]
 }