@yup/taro-ui 0.0.7 → 0.0.8

package/es/components/button/index.d.ts

@@ -2,17 +2,20 @@ import { ButtonProps as TaroButtonProps } from '@tarojs/components';
 import React from 'react';
 export interface ButtonProps extends Omit<TaroButtonProps, 'type'> {
     /**
-     * 按钮样式类型
+     * 按钮样式类型 primary 主题色样式按钮 default 默认样式 secondary 次级样式
      */
     styleType?: 'primary' | 'default' | 'secondary';
     /**
-     * 是否启用禁用样式(启用禁用样式按钮依然可以点击和disabled有区别 只是样式支持)
+     * 是否启用禁用样式(启用禁用样式按钮依然可以点击和disabled有区别 只是样式支持),如果想要按钮有禁用样式 但是依然可点击可以用这个属性
      */
     disabledStyle?: boolean;
     /**
-     * 是否块级标签
+     * 是否块级标签默认是
      */
     block?: boolean;
+    /**
+     * icon的支持
+     */
     icon?: React.ReactNode;
 }
 declare const Button: React.FC<ButtonProps>;

package/es/components/button/index.js

@@ -1 +1 @@
-import{objectWithoutProperties as t,objectSpread2 as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{j as o}from"../../node_modules/react/jsx-runtime.js";import{Button as e,Text as i}from"@tarojs/components";import r from"../../node_modules/classnames/index.js";var n=["children","styleType","className","block","disabled","disabledStyle","icon"],s=function(s){var l=s.children,d=s.styleType,m=void 0===d?"default":d,c=s.className,p=s.block,u=s.disabled,b=s.disabledStyle,y=s.icon,j=t(s,n);return o.jsx(e,a(a({className:r("ypmini-taro-button",{"ypmini-taro-button-primary":"primary"===m,"ypmini-taro-button-primary-disabled":"primary"===m&&(u||b),"ypmini-taro-button-secondary":"secondary"===m,"ypmini-taro-button-secondary-disabled":"secondary"===m&&(u||b),"ypmini-taro-button-default":"default"===m,"ypmini-taro-button-default-disabled":"default"===m&&(u||b),"ypmini-taro-button-block":p},c),disabled:u},j),{},{children:y?o.jsxs(i,{className:"ypmini-taro-button-icon-wrapper",children:[o.jsx(i,{className:"ypmini-taro-button-icon",children:y}),o.jsx(i,{className:"ypmini-taro-button-icon-content",children:l})]}):l}))};export{s as default};
+import{objectWithoutProperties as t,objectSpread2 as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{j as o}from"../../node_modules/react/jsx-runtime.js";import{Button as i,Text as e}from"@tarojs/components";import r from"../../node_modules/classnames/index.js";var n=["children","styleType","className","block","disabled","disabledStyle","icon"],s=function(s){var l=s.children,d=s.styleType,m=void 0===d?"default":d,c=s.className,p=s.block,u=void 0===p||p,b=s.disabled,y=s.disabledStyle,j=s.icon,f=t(s,n);return o.jsx(i,a(a({className:r("ypmini-taro-button",{"ypmini-taro-button-primary":"primary"===m,"ypmini-taro-button-primary-disabled":"primary"===m&&(b||y),"ypmini-taro-button-secondary":"secondary"===m,"ypmini-taro-button-secondary-disabled":"secondary"===m&&(b||y),"ypmini-taro-button-default":"default"===m,"ypmini-taro-button-default-disabled":"default"===m&&(b||y),"ypmini-taro-button-block":u},c),disabled:b},f),{},{children:j?o.jsxs(e,{className:"ypmini-taro-button-icon-wrapper",children:[o.jsx(e,{className:"ypmini-taro-button-icon",children:j}),o.jsx(e,{className:"ypmini-taro-button-icon-content",children:l})]}):l}))};export{s as default};

package/es/components/button/style/index.css

@@ -1,9 +1,6 @@
 :root,
 page {
   --ypmini-hd: 2;
-}
-:root,
-page {
   --yp-color-primary: #0092ff;
   --yp-color-text: rgba(0, 0, 0, 0.85);
   --yp-color-text-light: #0092ff;
@@ -20,6 +17,7 @@ page {
   --yp-checkbox-circle-checked-color: var(--yp-color-primary);
   --yp-checkbox-button-checked-color: var(--yp-color-primary);
   --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
   --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
 }
 :root,
@@ -46,6 +44,7 @@ page {
   color: var(--yp-color-text);
   border-radius: var(--border-radius);
   display: inline-block;
+  white-space: nowrap;
 }
 .ypmini-taro-button:after {
   display: none;
@@ -90,3 +89,6 @@ page {
   align-items: center;
   margin-right: 8px;
 }
+taro-button-core + taro-button-core {
+  margin-top: 0;
+}

package/es/components/checkbox/index.d.ts

@@ -3,7 +3,7 @@ import { CheckboxProps as YpCheckboxProps } from '@yup/taro-checkbox/dist/types/
 import CheckboxGroup from './checkbox-group';
 export interface CheckboxProps extends YpCheckboxProps {
     /**
-     * 多选类型
+     * 多选内置样式类型 button按钮样式，default 原始样式，默认button样式，如果需要自定义覆盖复选框样式可以通过icon props函数属性覆盖
      */
     type?: 'button' | 'default';
 }

package/es/components/checkbox/style/index.css

@@ -1,9 +1,6 @@
 :root,
 page {
   --ypmini-hd: 2;
-}
-:root,
-page {
   --yp-color-primary: #0092ff;
   --yp-color-text: rgba(0, 0, 0, 0.85);
   --yp-color-text-light: #0092ff;
@@ -20,6 +17,7 @@ page {
   --yp-checkbox-circle-checked-color: var(--yp-color-primary);
   --yp-checkbox-button-checked-color: var(--yp-color-primary);
   --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
   --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
 }
 :root,

package/es/components/form/form-item.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { FormItemProps as YpFormItemProps } from '@yup/taro-form';
 export interface FormItemProps extends YpFormItemProps {
     /**
-     * 带有必填星号的label
+     * 带有必填星号的样式（并不代表表单有必填校验规则，如果要添加必填校验规则 需要通过rules传递）
      */
     required?: boolean;
 }

package/es/components/form/style/index.css

@@ -1,9 +1,6 @@
 :root,
 page {
   --ypmini-hd: 2;
-}
-:root,
-page {
   --yp-color-primary: #0092ff;
   --yp-color-text: rgba(0, 0, 0, 0.85);
   --yp-color-text-light: #0092ff;
@@ -20,6 +17,7 @@ page {
   --yp-checkbox-circle-checked-color: var(--yp-color-primary);
   --yp-checkbox-button-checked-color: var(--yp-color-primary);
   --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
   --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
 }
 :root,

package/es/components/input/index.d.ts

@@ -10,11 +10,11 @@ export interface InputProps extends TaroInputProps {
      */
     clearIcon?: React.ReactNode;
     /**
-     * 是否显示字数统计
+     * 是否显示尾部字数统计
      */
     showCount?: boolean;
     /**
-     * 边框样式 outlined 边框 borderless 无边框
+     * 边框样式 outlined 边框 borderless 无边框样式
      */
     variant?: 'outlined' | 'borderless';
 }

package/es/components/input/index.js

@@ -1 +1 @@
-import{objectWithoutProperties as e,slicedToArray as l,objectSpread2 as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{j as t}from"../../node_modules/react/jsx-runtime.js";import n from"react";import o from"../../node_modules/classnames/index.js";import{View as r,Input as s,Text as i}from"@tarojs/components";var u=["variant","allowClear","showCount","clearIcon","className","style","onClick","onInput","maxlength","placeholderStyle","defaultValue"],c=function(c){c.variant,c.allowClear;var p=c.showCount;c.clearIcon;var m=c.className,d=c.style,h=c.onClick,j=c.onInput,x=c.maxlength;c.placeholderStyle;var f=c.defaultValue,y=e(c,u),v=n.useState(f||""),g=l(v,2),C=g[0],N=g[1];return n.useEffect(function(){"value"in y&&N(y.value||"")},[y]),t.jsxs(r,{className:o("ypmini-taro-input-wrapper",m),style:d,onClick:h,children:[t.jsx(s,a({placeholderStyle:"font-size: 17px;color: #00000040;",placeholderTextColor:"#00000040",value:C,onInput:function(e){N(e.detail.value),j&&j(e)},maxlength:x,className:"ypmini-taro-input"},y)),t.jsx(r,{className:"ypmini-taro-input-clear"}),p?t.jsxs(r,{className:"ypmini-taro-input-count",children:[t.jsx(i,{className:o("ypmini-taro-input-count-current",{"ypmini-taro-input-count-current-light":(null==C?void 0:C.length)>0}),children:null==C?void 0:C.length}),x?t.jsxs(t.Fragment,{children:["/",t.jsx(i,{className:"ypmini-taro-input-count-total",children:x||0})]}):null]}):null]})};export{c as default};
+import{objectWithoutProperties as e,slicedToArray as l,objectSpread2 as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{j as t}from"../../node_modules/react/jsx-runtime.js";import n from"react";import o from"../../node_modules/classnames/index.js";import{View as r,Input as s,Text as i}from"@tarojs/components";var u=["variant","allowClear","showCount","clearIcon","className","style","onClick","onInput","maxlength","placeholderStyle","defaultValue"],c=function(c){var p=c.variant,m=void 0===p?"outlined":p;c.allowClear;var d=c.showCount;c.clearIcon;var h=c.className,j=c.style,v=c.onClick,x=c.onInput,y=c.maxlength;c.placeholderStyle;var f=c.defaultValue,g=e(c,u),C=n.useState(f||""),N=l(C,2),w=N[0],I=N[1];return n.useEffect(function(){"value"in g&&I(g.value||"")},[g]),t.jsxs(r,{className:o("ypmini-taro-input-wrapper",{"ypmini-taro-input-borderless-wrapper":"borderless"===m},h),style:j,onClick:v,children:[t.jsx(s,a({placeholderStyle:"font-size: 17px;color: #00000040;",placeholderTextColor:"#00000040",value:w,onInput:function(e){I(e.detail.value),x&&x(e)},maxlength:y,className:"ypmini-taro-input"},g)),t.jsx(r,{className:"ypmini-taro-input-clear"}),d?t.jsxs(r,{className:"ypmini-taro-input-count",children:[t.jsx(i,{className:o("ypmini-taro-input-count-current",{"ypmini-taro-input-count-current-light":(null==w?void 0:w.length)>0}),children:null==w?void 0:w.length}),y?t.jsxs(t.Fragment,{children:["/",t.jsx(i,{className:"ypmini-taro-input-count-total",children:y||0})]}):null]}):null]})};export{c as default};

package/es/components/input/style/index.css

@@ -1,9 +1,6 @@
 :root,
 page {
   --ypmini-hd: 2;
-}
-:root,
-page {
   --yp-color-primary: #0092ff;
   --yp-color-text: rgba(0, 0, 0, 0.85);
   --yp-color-text-light: #0092ff;
@@ -20,6 +17,7 @@ page {
   --yp-checkbox-circle-checked-color: var(--yp-color-primary);
   --yp-checkbox-button-checked-color: var(--yp-color-primary);
   --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
   --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
 }
 :root,
@@ -36,11 +34,17 @@ page {
   border: 2px solid #e9edf3;
   box-sizing: border-box;
 }
+.ypmini-taro-input-borderless-wrapper {
+  border: unset;
+}
 .ypmini-taro-input {
   color: var(--input-text-color);
   flex: 1;
   border: none;
 }
+.ypmini-taro-input input::placeholder {
+  color: var(--input-placeholder-color);
+}
 .ypmini-input-placeholder {
   color: var(--input-placeholder-color);
 }
@@ -49,6 +53,7 @@ page {
   font-size: 30px;
   display: flex;
   align-items: center;
+  margin-left: 8px;
 }
 .ypmini-taro-input-count .ypmini-taro-input-count-current-light {
   color: var(--yp-color-text-light);

package/es/components/radio/index.d.ts

@@ -3,7 +3,7 @@ import { RadioProps as YpRadioProps } from '@yup/taro-radio';
 import RadioGroup from './radio-group';
 export interface RadioProps extends YpRadioProps {
     /**
-     * button按钮样式，auto默认选中样式
+     * 单选内置样式类型 button按钮样式，default 原始样式，默认button样式，如果需要自定义覆盖复选框样式可以通过icon props函数属性覆盖
      */
     type?: 'button' | 'default';
 }

package/es/components/radio/index.js

@@ -1 +1 @@
-import{objectWithoutProperties as r,objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{j as t}from"../../node_modules/react/jsx-runtime.js";import{View as e}from"@tarojs/components";import i from"../../node_modules/classnames/index.js";import a from"@yup/taro-radio";import s from"./radio-group.js";var n=["children","type"],m=function(s){var m=s.children;s.type;var p=r(s,n);return t.jsx(a,o({className:"ypmini-taro-radio",icon:function(r){return t.jsx(e,{className:i("ypmini-taro-radio-button",{"ypmini-taro-radio-button-checked":r}),children:m})}},p))};m.Group=s;export{m as default};
+import{objectWithoutProperties as o,objectSpread2 as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{j as t}from"../../node_modules/react/jsx-runtime.js";import{View as i}from"@tarojs/components";import e from"../../node_modules/classnames/index.js";import n from"@yup/taro-radio";import a from"./radio-group.js";var s=["children","type"],m=function(a){var m=a.children,p=a.type,u=void 0===p?"button":p,d=o(a,s);return t.jsx(n,r({className:e("ypmini-taro-radio",{"ypmini-taro-radio-button":"button"===u}),icon:function(o){return t.jsx(i,{className:e("ypmini-taro-radio-button-inner",{"ypmini-taro-radio-button-inner-checked":o}),children:m})}},d))};m.Group=a;export{m as default};

package/es/components/radio/radio-group.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { RadioGroupProps as YpRadioGroupProps } from '@yup/taro-radio/dist/types/type';
 export interface RadioGroupProps extends YpRadioGroupProps {
     /**
-     * button按钮样式，auto默认选中样式
+     * 单选组内置样式类型 button按钮样式，default 原始样式，默认button样式，如果需要自定义覆盖复选框样式可以通过icon props函数属性覆盖
      */
     type?: 'button' | 'default';
 }

package/es/components/radio/radio-group.js

@@ -1 +1 @@
-import{objectWithoutProperties as o,objectSpread2 as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{j as e}from"../../node_modules/react/jsx-runtime.js";import i from"../../node_modules/classnames/index.js";import t from"@yup/taro-radio";var a=["children","type","block"],p=function(p){var s=p.children,l=p.type,n=p.block,u=void 0!==n&&n,m=o(p,a);return e.jsx(t.Group,r(r({className:i("ypmini-radio-group",{"ypmini-radio-group--button":"button"===l,"ypmini-radio-group--block":u})},m),{},{children:s}))};export{p as default};
+import{objectWithoutProperties as o,objectSpread2 as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{j as e}from"../../node_modules/react/jsx-runtime.js";import i from"../../node_modules/classnames/index.js";import t from"@yup/taro-radio";var a=["children","type","block"],p=function(p){var s=p.children,l=p.type,n=p.block,u=void 0!==n&&n,m=o(p,a);return e.jsx(t.Group,r(r({className:i("ypmini-radio-group",{"ypmini-radio-group-button":"button"===l,"ypmini-radio-group-block":u})},m),{},{children:s}))};export{p as default};

package/es/components/radio/style/group.css

@@ -1,9 +1,6 @@
 :root,
 page {
   --ypmini-hd: 2;
-}
-:root,
-page {
   --yp-color-primary: #0092ff;
   --yp-color-text: rgba(0, 0, 0, 0.85);
   --yp-color-text-light: #0092ff;
@@ -20,15 +17,20 @@ page {
   --yp-checkbox-circle-checked-color: var(--yp-color-primary);
   --yp-checkbox-button-checked-color: var(--yp-color-primary);
   --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
   --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
 }
 .ypmini-radio-group {
   display: flex;
+  width: 100%;
 }
 .ypmini-radio-group-block {
   display: block;
 }
-.ypmini-radio-group .ypmini-taro-radio {
+.ypmini-radio-group-button {
+  display: flex;
+}
+.ypmini-radio-group .ypmini-taro-radio-button {
   flex: 1;
 }
 .ypmini-radio-group .ypmini-taro-radio:not(:first-child) {

package/es/components/radio/style/radio.css

@@ -1,9 +1,6 @@
 :root,
 page {
   --ypmini-hd: 2;
-}
-:root,
-page {
   --yp-color-primary: #0092ff;
   --yp-color-text: rgba(0, 0, 0, 0.85);
   --yp-color-text-light: #0092ff;
@@ -20,6 +17,7 @@ page {
   --yp-checkbox-circle-checked-color: var(--yp-color-primary);
   --yp-checkbox-button-checked-color: var(--yp-color-primary);
   --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
   --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
 }
 :root,
@@ -33,7 +31,7 @@ page {
   --radio-button-checked-border-color: var(--yp-color-primary);
   --radio-button-height: calc(52px * var(--ypmini-hd));
 }
-.ypmini-taro-radio-button {
+.ypmini-taro-radio-button-inner {
   background-color: var(--radio-button-background-color);
   color: var(--radio-button-text-color);
   font-size: var(--radio-button-font-size);
@@ -44,7 +42,7 @@ page {
   box-sizing: border-box;
   border-radius: var(--radio-button-border-radius);
 }
-.ypmini-taro-radio-button-checked {
+.ypmini-taro-radio-button-inner-checked {
   background-color: var(--radio-button-checked-background-color);
   color: var(--radio-button-checked-text-color);
   border-color: var(--radio-button-checked-border-color);

package/es/components/toast/style/index.css

@@ -1,9 +1,6 @@
 :root,
 page {
   --ypmini-hd: 2;
-}
-:root,
-page {
   --yp-color-primary: #0092ff;
   --yp-color-text: rgba(0, 0, 0, 0.85);
   --yp-color-text-light: #0092ff;
@@ -20,6 +17,7 @@ page {
   --yp-checkbox-circle-checked-color: var(--yp-color-primary);
   --yp-checkbox-button-checked-color: var(--yp-color-primary);
   --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
   --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
 }
 :root,

package/es/components/toast/toast.d.ts

@@ -1,8 +1,17 @@
 import React from 'react';
 import { ViewProps } from '@tarojs/components';
 export interface ToastProps extends ViewProps {
+    /**
+     * 轻提示内容
+     */
     content?: React.ReactNode;
+    /**
+     * 轻提示持续显示时间，单位毫秒 默认2000
+     */
     duration?: number;
+    /**
+     * 样式类名
+     */
     className?: string;
 }
 export interface ToastRefType {

package/es/global.css

@@ -1,9 +1,6 @@
 :root,
 page {
   --ypmini-hd: 2;
-}
-:root,
-page {
   --yp-color-primary: #0092ff;
   --yp-color-text: rgba(0, 0, 0, 0.85);
   --yp-color-text-light: #0092ff;
@@ -20,5 +17,6 @@ page {
   --yp-checkbox-circle-checked-color: var(--yp-color-primary);
   --yp-checkbox-button-checked-color: var(--yp-color-primary);
   --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
   --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
 }

package/es/index.d.ts

@@ -1,4 +1,3 @@
-import './global';
 export { default as Button } from './components/button';
 export { default as Checkbox } from './components/checkbox';
 export { default as Input } from './components/input';

package/es/style/index.css

@@ -0,0 +1,441 @@
+:root,
+page {
+  --ypmini-hd: 2;
+  --yp-color-primary: #0092ff;
+  --yp-color-text: rgba(0, 0, 0, 0.85);
+  --yp-color-text-light: #0092ff;
+  --yp-color-text-weak: rgba(0, 0, 0, 0.45);
+  --yp-border-color: #e9edf3;
+  --yp-color-text-primary: #333;
+  --yp-color-text-link: var(--yp-color-primary);
+  --yp-color-text-secondary: #666;
+  --yp-color-text-disabled: #ccc;
+  --yp-color-text-placeholder: #999;
+  --yp-font-size-default: calc(17px * var(--ypmini-hd));
+  --yp-radio-circle-checked-color: var(--yp-color-primary);
+  --yp-radio-button-checked-color: var(--yp-color-primary);
+  --yp-checkbox-circle-checked-color: var(--yp-color-primary);
+  --yp-checkbox-button-checked-color: var(--yp-color-primary);
+  --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
+  --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
+}
+
+:root,
+page {
+  --ypmini-hd: 2;
+  --yp-color-primary: #0092ff;
+  --yp-color-text: rgba(0, 0, 0, 0.85);
+  --yp-color-text-light: #0092ff;
+  --yp-color-text-weak: rgba(0, 0, 0, 0.45);
+  --yp-border-color: #e9edf3;
+  --yp-color-text-primary: #333;
+  --yp-color-text-link: var(--yp-color-primary);
+  --yp-color-text-secondary: #666;
+  --yp-color-text-disabled: #ccc;
+  --yp-color-text-placeholder: #999;
+  --yp-font-size-default: calc(17px * var(--ypmini-hd));
+  --yp-radio-circle-checked-color: var(--yp-color-primary);
+  --yp-radio-button-checked-color: var(--yp-color-primary);
+  --yp-checkbox-circle-checked-color: var(--yp-color-primary);
+  --yp-checkbox-button-checked-color: var(--yp-color-primary);
+  --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
+  --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
+}
+:root,
+page {
+  --border-radius: calc(8px * var(--ypmini-hd));
+  --button-height: calc(48px * var(--ypmini-hd));
+  --default-button-background: #f5f7fc;
+  --default-button-text-color: rgba(0, 0, 0, 0.65);
+  --primary-button-background: var(--yp-color-primary);
+  --primary-button-disabled-background: #99d3ff;
+  --primary-button-disabled-text-color: rgba(255, 255, 255, 0.45);
+  --primary-button-text-color: #fff;
+  --secondary-button-background: #00cbff;
+  --secondary-button-text-color: #ffffff;
+}
+.ypmini-taro-button {
+  padding: 0 48px;
+  border: unset;
+  font-weight: bold;
+  font-size: 34px;
+  width: auto;
+  height: var(--button-height);
+  line-height: var(--button-height);
+  color: var(--yp-color-text);
+  border-radius: var(--border-radius);
+  display: inline-block;
+  white-space: nowrap;
+}
+.ypmini-taro-button:after {
+  display: none;
+}
+.ypmini-taro-button-primary {
+  background: var(--primary-button-background);
+  color: var(--primary-button-text-color);
+}
+.ypmini-taro-button-primary.ypmini-taro-button-primary-disabled {
+  color: var(--primary-button-disabled-text-color);
+  background: var(--primary-button-disabled-background);
+}
+.ypmini-taro-button-default {
+  background: var(--default-button-background);
+  color: var(--default-button-text-color);
+}
+.ypmini-taro-button-default.ypmini-taro-button-default-disabled {
+  opacity: 0.6;
+}
+.ypmini-taro-button-default.ypmini-taro-button-default-disabled.ypmini-taro-button-default.ypmini-taro-button-default-disabled[disabled] {
+  color: var(--default-button-text-color);
+}
+.ypmini-taro-button-secondary {
+  background: var(--secondary-button-background);
+  color: var(--secondary-button-text-color);
+}
+.ypmini-taro-button-secondary.ypmini-taro-button-secondary-disabled {
+  opacity: 0.6;
+}
+.ypmini-taro-button-secondary.ypmini-taro-button-secondary-disabled.ypmini-taro-button-secondary.ypmini-taro-button-secondary-disabled[disabled] {
+  color: var(--secondary-button-text-color);
+}
+.ypmini-taro-button-block {
+  display: block;
+}
+.ypmini-taro-button-icon-wrapper {
+  display: flex;
+  align-items: center;
+}
+.ypmini-taro-button-icon {
+  display: flex;
+  align-items: center;
+  margin-right: 8px;
+}
+taro-button-core + taro-button-core {
+  margin-top: 0;
+}
+
+:root,
+page {
+  --ypmini-hd: 2;
+  --yp-color-primary: #0092ff;
+  --yp-color-text: rgba(0, 0, 0, 0.85);
+  --yp-color-text-light: #0092ff;
+  --yp-color-text-weak: rgba(0, 0, 0, 0.45);
+  --yp-border-color: #e9edf3;
+  --yp-color-text-primary: #333;
+  --yp-color-text-link: var(--yp-color-primary);
+  --yp-color-text-secondary: #666;
+  --yp-color-text-disabled: #ccc;
+  --yp-color-text-placeholder: #999;
+  --yp-font-size-default: calc(17px * var(--ypmini-hd));
+  --yp-radio-circle-checked-color: var(--yp-color-primary);
+  --yp-radio-button-checked-color: var(--yp-color-primary);
+  --yp-checkbox-circle-checked-color: var(--yp-color-primary);
+  --yp-checkbox-button-checked-color: var(--yp-color-primary);
+  --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
+  --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
+}
+:root,
+page {
+  --checkbox-button-font-size: calc(17px * var(--ypmini-hd));
+  --checkbox-button-border-radius: calc(8px * var(--ypmini-hd));
+  --checkbox-button-background-color: #f5f7fc;
+  --checkbox-button-text-color: #000000d9;
+  --checkbox-button-checked-background-color: #e0f3ff;
+  --checkbox-button-checked-text-color: var(--yp-color-primary);
+  --checkbox-button-checked-border-color: var(--yp-color-primary);
+  --checkbox-button-height: calc(52px * var(--ypmini-hd));
+}
+.ypmini-checkbox-button {
+  background-color: var(--checkbox-button-background-color);
+  color: var(--checkbox-button-text-color);
+  font-size: var(--checkbox-button-font-size);
+  text-align: center;
+  padding: 0px 32px;
+  height: var(--checkbox-button-height);
+  line-height: var(--checkbox-button-height);
+  box-sizing: border-box;
+  border-radius: var(--checkbox-button-border-radius);
+}
+.ypmini-checkbox-button-checked {
+  background-color: var(--checkbox-button-checked-background-color);
+  color: var(--checkbox-button-checked-text-color);
+  border-color: var(--checkbox-button-checked-border-color);
+  border-width: 2px;
+  border-style: solid;
+}
+.ypmini-checkbox-group {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.ypmini-checkbox-group.ypmini-checkbox-group-block {
+  display: block;
+  margin-top: 0px;
+}
+.ypmini-checkbox-group.ypmini-checkbox-group-block .ypmini-checkbox:not(:first-child) {
+  margin-top: 24px;
+  margin-left: 0px;
+}
+.ypmini-checkbox-group .ypmini-checkbox:not(:first-child) {
+  margin-left: 24px;
+  margin-top: 0px;
+}
+
+:root,
+page {
+  --ypmini-hd: 2;
+  --yp-color-primary: #0092ff;
+  --yp-color-text: rgba(0, 0, 0, 0.85);
+  --yp-color-text-light: #0092ff;
+  --yp-color-text-weak: rgba(0, 0, 0, 0.45);
+  --yp-border-color: #e9edf3;
+  --yp-color-text-primary: #333;
+  --yp-color-text-link: var(--yp-color-primary);
+  --yp-color-text-secondary: #666;
+  --yp-color-text-disabled: #ccc;
+  --yp-color-text-placeholder: #999;
+  --yp-font-size-default: calc(17px * var(--ypmini-hd));
+  --yp-radio-circle-checked-color: var(--yp-color-primary);
+  --yp-radio-button-checked-color: var(--yp-color-primary);
+  --yp-checkbox-circle-checked-color: var(--yp-color-primary);
+  --yp-checkbox-button-checked-color: var(--yp-color-primary);
+  --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
+  --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
+}
+:root,
+page {
+  --form-item-label-width: calc(60px * var(--ypmini-hd));
+}
+.ypmini-form.ypmini-form-vertical .ypmini-form-item .yp-form-item-label {
+  margin-bottom: 24px;
+  padding-top: 32px;
+}
+.ypmini-form.ypmini-form-vertical .ypmini-form-item:not(:first-child) {
+  margin-top: 32px;
+}
+.ypmini-form.ypmini-form-horizontal .ypmini-form-item {
+  display: flex;
+  align-items: center;
+}
+.ypmini-form.ypmini-form-horizontal .ypmini-form-item .yp-form-item-label {
+  width: var(--form-item-label-width);
+  text-align: left;
+}
+.ypmini-form.ypmini-form-horizontal .ypmini-form-item .yp-form-item-children {
+  flex: 1;
+}
+.ypmini-form.ypmini-form-horizontal .ypmini-form-item:not(:first-child) {
+  margin-top: 32px;
+}
+.ypmini-form-item-required .yp-form-item-label::before {
+  content: '*';
+  color: red;
+}
+.ypmini-form-item .yp-form-item-label {
+  color: #000000d9;
+  font-weight: bold;
+  font-size: 38px;
+}
+
+:root,
+page {
+  --ypmini-hd: 2;
+  --yp-color-primary: #0092ff;
+  --yp-color-text: rgba(0, 0, 0, 0.85);
+  --yp-color-text-light: #0092ff;
+  --yp-color-text-weak: rgba(0, 0, 0, 0.45);
+  --yp-border-color: #e9edf3;
+  --yp-color-text-primary: #333;
+  --yp-color-text-link: var(--yp-color-primary);
+  --yp-color-text-secondary: #666;
+  --yp-color-text-disabled: #ccc;
+  --yp-color-text-placeholder: #999;
+  --yp-font-size-default: calc(17px * var(--ypmini-hd));
+  --yp-radio-circle-checked-color: var(--yp-color-primary);
+  --yp-radio-button-checked-color: var(--yp-color-primary);
+  --yp-checkbox-circle-checked-color: var(--yp-color-primary);
+  --yp-checkbox-button-checked-color: var(--yp-color-primary);
+  --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
+  --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
+}
+:root,
+page {
+  --input-placeholder-color: rgba(0, 0, 0, 0.25);
+  --input-text-color: var(--yp-color-text);
+  --input-font-size: var(--yp-font-size-default);
+}
+.ypmini-taro-input-wrapper {
+  display: flex;
+  font-size: var(--input-font-size);
+  padding: 32px 24px;
+  border-radius: 16px;
+  border: 2px solid #e9edf3;
+  box-sizing: border-box;
+}
+.ypmini-taro-input-borderless-wrapper {
+  border: unset;
+}
+.ypmini-taro-input {
+  color: var(--input-text-color);
+  flex: 1;
+  border: none;
+}
+.ypmini-taro-input input::placeholder {
+  color: var(--input-placeholder-color);
+}
+.ypmini-input-placeholder {
+  color: var(--input-placeholder-color);
+}
+.ypmini-taro-input-count {
+  color: rgba(0, 0, 0, 0.45);
+  font-size: 30px;
+  display: flex;
+  align-items: center;
+  margin-left: 8px;
+}
+.ypmini-taro-input-count .ypmini-taro-input-count-current-light {
+  color: var(--yp-color-text-light);
+}
+
+:root,
+page {
+  --ypmini-hd: 2;
+  --yp-color-primary: #0092ff;
+  --yp-color-text: rgba(0, 0, 0, 0.85);
+  --yp-color-text-light: #0092ff;
+  --yp-color-text-weak: rgba(0, 0, 0, 0.45);
+  --yp-border-color: #e9edf3;
+  --yp-color-text-primary: #333;
+  --yp-color-text-link: var(--yp-color-primary);
+  --yp-color-text-secondary: #666;
+  --yp-color-text-disabled: #ccc;
+  --yp-color-text-placeholder: #999;
+  --yp-font-size-default: calc(17px * var(--ypmini-hd));
+  --yp-radio-circle-checked-color: var(--yp-color-primary);
+  --yp-radio-button-checked-color: var(--yp-color-primary);
+  --yp-checkbox-circle-checked-color: var(--yp-color-primary);
+  --yp-checkbox-button-checked-color: var(--yp-color-primary);
+  --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
+  --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
+}
+.ypmini-radio-group {
+  display: flex;
+  width: 100%;
+}
+.ypmini-radio-group-block {
+  display: block;
+}
+.ypmini-radio-group-button {
+  display: flex;
+}
+.ypmini-radio-group .ypmini-taro-radio-button {
+  flex: 1;
+}
+.ypmini-radio-group .ypmini-taro-radio:not(:first-child) {
+  margin-left: 24px;
+}
+
+:root,
+page {
+  --ypmini-hd: 2;
+  --yp-color-primary: #0092ff;
+  --yp-color-text: rgba(0, 0, 0, 0.85);
+  --yp-color-text-light: #0092ff;
+  --yp-color-text-weak: rgba(0, 0, 0, 0.45);
+  --yp-border-color: #e9edf3;
+  --yp-color-text-primary: #333;
+  --yp-color-text-link: var(--yp-color-primary);
+  --yp-color-text-secondary: #666;
+  --yp-color-text-disabled: #ccc;
+  --yp-color-text-placeholder: #999;
+  --yp-font-size-default: calc(17px * var(--ypmini-hd));
+  --yp-radio-circle-checked-color: var(--yp-color-primary);
+  --yp-radio-button-checked-color: var(--yp-color-primary);
+  --yp-checkbox-circle-checked-color: var(--yp-color-primary);
+  --yp-checkbox-button-checked-color: var(--yp-color-primary);
+  --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
+  --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
+}
+:root,
+page {
+  --radio-button-font-size: calc(17px * var(--ypmini-hd));
+  --radio-button-border-radius: calc(8px * var(--ypmini-hd));
+  --radio-button-background-color: #f5f7fc;
+  --radio-button-text-color: #000000d9;
+  --radio-button-checked-background-color: #e0f3ff;
+  --radio-button-checked-text-color: var(--yp-color-primary);
+  --radio-button-checked-border-color: var(--yp-color-primary);
+  --radio-button-height: calc(52px * var(--ypmini-hd));
+}
+.ypmini-taro-radio-button-inner {
+  background-color: var(--radio-button-background-color);
+  color: var(--radio-button-text-color);
+  font-size: var(--radio-button-font-size);
+  text-align: center;
+  padding: 0px 32px;
+  height: var(--radio-button-height);
+  line-height: var(--radio-button-height);
+  box-sizing: border-box;
+  border-radius: var(--radio-button-border-radius);
+}
+.ypmini-taro-radio-button-inner-checked {
+  background-color: var(--radio-button-checked-background-color);
+  color: var(--radio-button-checked-text-color);
+  border-color: var(--radio-button-checked-border-color);
+  border-width: 2px;
+  border-style: solid;
+}
+
+:root,
+page {
+  --ypmini-hd: 2;
+  --yp-color-primary: #0092ff;
+  --yp-color-text: rgba(0, 0, 0, 0.85);
+  --yp-color-text-light: #0092ff;
+  --yp-color-text-weak: rgba(0, 0, 0, 0.45);
+  --yp-border-color: #e9edf3;
+  --yp-color-text-primary: #333;
+  --yp-color-text-link: var(--yp-color-primary);
+  --yp-color-text-secondary: #666;
+  --yp-color-text-disabled: #ccc;
+  --yp-color-text-placeholder: #999;
+  --yp-font-size-default: calc(17px * var(--ypmini-hd));
+  --yp-radio-circle-checked-color: var(--yp-color-primary);
+  --yp-radio-button-checked-color: var(--yp-color-primary);
+  --yp-checkbox-circle-checked-color: var(--yp-color-primary);
+  --yp-checkbox-button-checked-color: var(--yp-color-primary);
+  --yp-border-radius-base: calc(4px * var(--ypmini-hd));
+  --yp-border-radius-button: calc(8px * var(--ypmini-hd));
+  --yp-space-horizontal-base: calc(12px * var(--ypmini-hd));
+}
+:root,
+page {
+  --toast-z-index: 9999;
+}
+.ypmini-toast-container {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  background: rgba(0, 0, 0, 0.7);
+  color: #fff;
+  padding: 24px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  z-index: var(--toast-z-index);
+  max-width: 80%;
+  height: auto;
+  word-break: break-word;
+}
+.ypmini-toast-content {
+  font-size: 28px;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yup/taro-ui",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "description": "鱼泡 Taro UI组件库",
   "type": "module",
   "main": "es/index.js",
@@ -81,6 +81,7 @@
     "eslint-webpack-plugin": "^5.0.2",
     "globals": "^15.9.0",
     "gulp": "^5.0.0",
+    "gulp-clean-css": "^4.3.0",
     "gulp-concat": "^2.6.1",
     "gulp-copy": "^4.0.1",
     "gulp-less": "^5.0.0",
@@ -116,9 +117,9 @@
     "react-dom": "^18.2.0"
   },
   "dependencies": {
-    "@yup/taro-checkbox": "^0.9.1",
-    "@yup/taro-form": "^0.9.1",
-    "@yup/taro-radio": "^0.9.1"
+    "@yup/taro-checkbox": "^0.13.7",
+    "@yup/taro-form": "^0.13.7",
+    "@yup/taro-radio": "^0.13.7"
   },
   "overrides": {
     "minimatch": "^5.1.0"