@carefrees/form-utils-react-taro 0.0.14 → 0.0.16

package/lib/layout/layout.formItem.js

@@ -22,7 +22,7 @@ var __webpack_require__ = {};
 })();
 (()=>{
     __webpack_require__.r = (exports1)=>{
-        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
             value: 'Module'
         });
         Object.defineProperty(exports1, '__esModule', {
@@ -149,9 +149,9 @@ const LayoutFormItem = /*#__PURE__*/ (0, external_react_namespaceObject.memo)((p
     });
 });
 exports.LayoutFormItem = __webpack_exports__.LayoutFormItem;
-for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+for(var __rspack_i in __webpack_exports__)if (-1 === [
     "LayoutFormItem"
-].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true
 });

package/package.json

@@ -3,7 +3,7 @@
   "author": "SunLxy <1011771396@qq.com>",
   "description": "taro react 表单组件",
   "homepage": "https://github.com/SunLxy/carefrees-form-utils",
-  "version": "0.0.14",
+  "version": "0.0.16",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "module": "esm/index.js",
@@ -15,6 +15,10 @@
   "publishConfig": {
     "access": "public"
   },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/SunLxy/carefrees-form-utils.git"
+  },
   "files": [
     "src",
     "lib",
@@ -22,8 +26,8 @@
     "assets"
   ],
   "dependencies": {
-    "@carefrees/form-utils": "^0.0.14",
-    "@carefrees/form-utils-react-hooks": "^0.0.14",
+    "@carefrees/form-utils": "^0.0.16",
+    "@carefrees/form-utils-react-hooks": "^0.0.16",
     "classnames": "2.5.1"
   },
   "devDependencies": {

package/src/index.tsx

@@ -5,7 +5,6 @@ import { FormLayout, FormLayoutProps } from './layout';
 import { useRegisterForm, useForm, FormInstanceContext } from '@carefrees/form-utils-react-hooks';
 import { Form as TaroForm } from '@tarojs/components';
 import type { CommonEventFunction, FormProps as TaroFormProps } from '@tarojs/components';
-import './styles/index.css';
 export * from './formItem';
 export * from './formList';
 export * from './layout';

package/src/layout/index.tsx

@@ -30,6 +30,8 @@ export interface FormLayoutProps extends AttrsOptions {
    * @description gap 属性是用来设置网格行与列之间的间隙，该属性是row-gap and column-gap的简写形式。
    */
   gap?: string | number;
+  /**是否添加输入框边框*/
+  inputBordered?: boolean;
 }
 
 const preCls = 'carefrees-form-layout';
@@ -45,6 +47,7 @@ export const FormLayout = memo((props: FormLayoutProps) => {
     formItemStyle: p_formItemStyle,
     formItemLabelClassName: p_formItemLabelClassName,
     formItemLabelStyle: p_formItemLabelStyle,
+    inputBordered: p_inputBordered,
   } = useAttrs();
   const {
     colCount = p_colCount,
@@ -66,6 +69,7 @@ export const FormLayout = memo((props: FormLayoutProps) => {
     formItemLabelClassName = p_formItemLabelClassName,
     formItemLabelStyle = p_formItemLabelStyle,
     bordered = false,
+    inputBordered = p_inputBordered,
     gap,
   } = props;
   const propsRef = useRef(props);
@@ -95,6 +99,7 @@ export const FormLayout = memo((props: FormLayoutProps) => {
       formItemStyle,
       formItemLabelClassName,
       formItemLabelStyle,
+      inputBordered,
     };
   }, [
     colCount,
@@ -105,6 +110,7 @@ export const FormLayout = memo((props: FormLayoutProps) => {
     formItemStyle,
     formItemLabelClassName,
     formItemLabelStyle,
+    inputBordered,
   ]);
   const styleBase = useMemo(() => {
     const css: React.CSSProperties = {};

package/esm/styles/index.css

@@ -1,199 +0,0 @@
-.carefrees-form {
-  box-sizing: border-box;
-  background-color: #fff;
-  font-size: 14px;
-}
-
-.carefrees-form-layout {
-  box-sizing: border-box;
-  border-radius: 4px;
-  width: 100%;
-  padding-bottom: 8px;
-  position: relative;
-}
-
-.carefrees-form-layout.all-colspan {
-  grid-column: 1 / -1;
-}
-
-.carefrees-form-layout.bordered {
-  border: 1px solid #e0e0e0;
-}
-
-.carefrees-form-layout.bordered .carefrees-form-layout-header {
-  padding-inline: 8px;
-}
-
-.carefrees-form-layout-header {
-  padding-top: 5px;
-  padding-bottom: 5px;
-  box-sizing: border-box;
-  border-bottom: 1px solid #e0e0e0;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  margin-block-end: 4px;
-  padding-inline: 2px;
-  display: flex;
-}
-
-.carefrees-form-layout-header-title {
-  color: #1d2129;
-  box-sizing: border-box;
-  font-size: 14px;
-  font-weight: 600;
-}
-
-.carefrees-form-layout-header-extra {
-  color: #1d2129;
-  box-sizing: border-box;
-  font-size: 14px;
-  font-weight: 500;
-}
-
-.carefrees-form-layout-body {
-  box-sizing: border-box;
-  grid-template-columns: repeat(1, auto);
-  gap: 2px;
-  width: 100%;
-  padding-left: 2px;
-  padding-right: 2px;
-  display: grid;
-}
-
-.carefrees-form-item {
-  box-sizing: border-box;
-  color: #000000e0;
-  flex-direction: row;
-  align-items: flex-start;
-  padding: 8px;
-  font-size: 14px;
-  display: flex;
-}
-
-.carefrees-form-item-container {
-  box-sizing: border-box;
-  flex-direction: column;
-  flex: 1;
-  gap: 4px;
-  height: 100%;
-  display: flex;
-}
-
-.carefrees-form-item-container.left {
-  flex-direction: row;
-  gap: 8px;
-}
-
-.carefrees-form-item-container.left .carefrees-form-item-label-warp {
-  text-align: right;
-}
-
-.carefrees-form-item-container.between {
-  text-align: left;
-  flex-direction: row;
-  justify-content: space-between;
-  gap: 8px;
-}
-
-.carefrees-form-item-container.between .carefrees-form-item-body, .carefrees-form-item-container.between .carefrees-form-item-body-input {
-  text-align: right;
-  justify-content: flex-end;
-}
-
-.carefrees-form-item-label-warp {
-  box-sizing: border-box;
-}
-
-.carefrees-form-item-label {
-  box-sizing: border-box;
-  color: #000000e0;
-  justify-content: flex-start;
-  align-items: center;
-  min-height: 1.4rem;
-  font-size: 14px;
-  display: flex;
-  position: relative;
-}
-
-.carefrees-form-item-label.show-colon:after {
-  content: ":";
-  text-align: center;
-  box-sizing: border-box;
-  margin: 0;
-  margin-inline: 2px;
-  display: inline-block;
-}
-
-.carefrees-form-item-label.required:before {
-  content: "*";
-  color: red;
-  box-sizing: border-box;
-  margin-inline-end: 4px;
-  display: inline-block;
-}
-
-.carefrees-form-item-body {
-  box-sizing: border-box;
-  flex-direction: column;
-  flex: 1;
-  justify-content: flex-start;
-  align-items: flex-start;
-  gap: 4px;
-  display: flex;
-  position: relative;
-}
-
-.carefrees-form-item-body-input {
-  box-sizing: border-box;
-  flex-direction: row;
-  flex: 1;
-  justify-content: flex-start;
-  align-items: center;
-  width: 100%;
-  display: flex;
-}
-
-.carefrees-form-item-body-input.input-bordered {
-  border-bottom: 1px solid #e0e0e0;
-}
-
-.carefrees-form-item-body-help {
-  box-sizing: border-box;
-  width: 100%;
-}
-
-.carefrees-form-item-body-error {
-  color: red;
-  box-sizing: border-box;
-  z-index: 10;
-  pointer-events: none;
-  flex-direction: row;
-  justify-content: start;
-  width: 100%;
-  padding-top: 2px;
-  font-size: 12px;
-  display: flex;
-  position: absolute;
-  inset: auto 0 -16px;
-}
-
-.carefrees-form-item-body-error.right-bottom {
-  justify-content: flex-end;
-  inset: auto 0 -16px;
-}
-
-.carefrees-form-item-body-error.top-left {
-  justify-content: start;
-  inset: -16px 0 auto;
-}
-
-.carefrees-form-item-body-error.top-right {
-  justify-content: flex-end;
-  inset: -16px 0 auto;
-}
-
-.carefrees-form-item-extra {
-  box-sizing: border-box;
-}
-

package/lib/styles/index.css

@@ -1,199 +0,0 @@
-.carefrees-form {
-  box-sizing: border-box;
-  background-color: #fff;
-  font-size: 14px;
-}
-
-.carefrees-form-layout {
-  box-sizing: border-box;
-  border-radius: 4px;
-  width: 100%;
-  padding-bottom: 8px;
-  position: relative;
-}
-
-.carefrees-form-layout.all-colspan {
-  grid-column: 1 / -1;
-}
-
-.carefrees-form-layout.bordered {
-  border: 1px solid #e0e0e0;
-}
-
-.carefrees-form-layout.bordered .carefrees-form-layout-header {
-  padding-inline: 8px;
-}
-
-.carefrees-form-layout-header {
-  padding-top: 5px;
-  padding-bottom: 5px;
-  box-sizing: border-box;
-  border-bottom: 1px solid #e0e0e0;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  margin-block-end: 4px;
-  padding-inline: 2px;
-  display: flex;
-}
-
-.carefrees-form-layout-header-title {
-  color: #1d2129;
-  box-sizing: border-box;
-  font-size: 14px;
-  font-weight: 600;
-}
-
-.carefrees-form-layout-header-extra {
-  color: #1d2129;
-  box-sizing: border-box;
-  font-size: 14px;
-  font-weight: 500;
-}
-
-.carefrees-form-layout-body {
-  box-sizing: border-box;
-  grid-template-columns: repeat(1, auto);
-  gap: 2px;
-  width: 100%;
-  padding-left: 2px;
-  padding-right: 2px;
-  display: grid;
-}
-
-.carefrees-form-item {
-  box-sizing: border-box;
-  color: #000000e0;
-  flex-direction: row;
-  align-items: flex-start;
-  padding: 8px;
-  font-size: 14px;
-  display: flex;
-}
-
-.carefrees-form-item-container {
-  box-sizing: border-box;
-  flex-direction: column;
-  flex: 1;
-  gap: 4px;
-  height: 100%;
-  display: flex;
-}
-
-.carefrees-form-item-container.left {
-  flex-direction: row;
-  gap: 8px;
-}
-
-.carefrees-form-item-container.left .carefrees-form-item-label-warp {
-  text-align: right;
-}
-
-.carefrees-form-item-container.between {
-  text-align: left;
-  flex-direction: row;
-  justify-content: space-between;
-  gap: 8px;
-}
-
-.carefrees-form-item-container.between .carefrees-form-item-body, .carefrees-form-item-container.between .carefrees-form-item-body-input {
-  text-align: right;
-  justify-content: flex-end;
-}
-
-.carefrees-form-item-label-warp {
-  box-sizing: border-box;
-}
-
-.carefrees-form-item-label {
-  box-sizing: border-box;
-  color: #000000e0;
-  justify-content: flex-start;
-  align-items: center;
-  min-height: 1.4rem;
-  font-size: 14px;
-  display: flex;
-  position: relative;
-}
-
-.carefrees-form-item-label.show-colon:after {
-  content: ":";
-  text-align: center;
-  box-sizing: border-box;
-  margin: 0;
-  margin-inline: 2px;
-  display: inline-block;
-}
-
-.carefrees-form-item-label.required:before {
-  content: "*";
-  color: red;
-  box-sizing: border-box;
-  margin-inline-end: 4px;
-  display: inline-block;
-}
-
-.carefrees-form-item-body {
-  box-sizing: border-box;
-  flex-direction: column;
-  flex: 1;
-  justify-content: flex-start;
-  align-items: flex-start;
-  gap: 4px;
-  display: flex;
-  position: relative;
-}
-
-.carefrees-form-item-body-input {
-  box-sizing: border-box;
-  flex-direction: row;
-  flex: 1;
-  justify-content: flex-start;
-  align-items: center;
-  width: 100%;
-  display: flex;
-}
-
-.carefrees-form-item-body-input.input-bordered {
-  border-bottom: 1px solid #e0e0e0;
-}
-
-.carefrees-form-item-body-help {
-  box-sizing: border-box;
-  width: 100%;
-}
-
-.carefrees-form-item-body-error {
-  color: red;
-  box-sizing: border-box;
-  z-index: 10;
-  pointer-events: none;
-  flex-direction: row;
-  justify-content: start;
-  width: 100%;
-  padding-top: 2px;
-  font-size: 12px;
-  display: flex;
-  position: absolute;
-  inset: auto 0 -16px;
-}
-
-.carefrees-form-item-body-error.right-bottom {
-  justify-content: flex-end;
-  inset: auto 0 -16px;
-}
-
-.carefrees-form-item-body-error.top-left {
-  justify-content: start;
-  inset: -16px 0 auto;
-}
-
-.carefrees-form-item-body-error.top-right {
-  justify-content: flex-end;
-  inset: -16px 0 auto;
-}
-
-.carefrees-form-item-extra {
-  box-sizing: border-box;
-}
-

package/src/styles/index.css

@@ -1,207 +0,0 @@
-/* 表单 */
-.carefrees-form {
-  box-sizing: border-box;
-  background-color: #fff;
-  font-size: 14px;
-}
-
-/* 布局 */
-.carefrees-form-layout {
-  width: 100%;
-  box-sizing: border-box;
-  border-radius: 4px;
-  padding-bottom: 8px;
-  position: relative;
-}
-
-.carefrees-form-layout.all-colspan {
-  grid-column: 1 / -1;
-}
-
-.carefrees-form-layout.bordered {
-  border: 1px solid #e0e0e0;
-}
-.carefrees-form-layout.bordered .carefrees-form-layout-header {
-  padding-inline-start: 8px;
-  padding-inline-end: 8px;
-}
-
-.carefrees-form-layout-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  flex-direction: row;
-  border-bottom: 1px solid #e0e0e0;
-  padding-top: 5px;
-  padding-bottom: 5px;
-  margin-block-end: 4px;
-  padding-inline-start: 2px;
-  padding-inline-end: 2px;
-  box-sizing: border-box;
-}
-
-.carefrees-form-layout-header-title {
-  font-size: 14px;
-  font-weight: 600;
-  color: #1d2129;
-  box-sizing: border-box;
-}
-.carefrees-form-layout-header-extra {
-  font-size: 14px;
-  font-weight: 500;
-  color: #1d2129;
-  box-sizing: border-box;
-}
-
-.carefrees-form-layout-body {
-  width: 100%;
-  display: grid;
-  grid-template-columns: repeat(1, auto);
-  gap: 2px;
-  padding-left: 2px;
-  padding-right: 2px;
-  box-sizing: border-box;
-}
-
-/* 表单项 */
-.carefrees-form-item {
-  font-size: 14px;
-  display: flex;
-  flex-direction: row;
-  align-items: flex-start;
-  padding: 8px;
-  box-sizing: border-box;
-  color: rgba(0, 0, 0, 0.88);
-}
-
-.carefrees-form-item-container {
-  flex: 1;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  box-sizing: border-box;
-}
-.carefrees-form-item-container.left {
-  flex-direction: row;
-  gap: 8px;
-}
-.carefrees-form-item-container.left .carefrees-form-item-label-warp {
-  text-align: right;
-}
-.carefrees-form-item-container.between {
-  gap: 8px;
-  text-align: left;
-  flex-direction: row;
-  justify-content: space-between;
-}
-
-.carefrees-form-item-container.between .carefrees-form-item-body,
-.carefrees-form-item-container.between .carefrees-form-item-body-input {
-  justify-content: flex-end;
-  text-align: right;
-}
-
-.carefrees-form-item-label-warp {
-  box-sizing: border-box;
-}
-
-.carefrees-form-item-label {
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  position: relative;
-  font-size: 14px;
-  color: rgba(0, 0, 0, 0.88);
-  min-height: 1.4rem;
-}
-
-.carefrees-form-item-label.show-colon::after {
-  content: ':';
-  display: inline-block;
-  text-align: center;
-  margin: 0;
-  margin-inline-end: 2px;
-  margin-inline-start: 2px;
-  box-sizing: border-box;
-}
-
-.carefrees-form-item-label.required::before {
-  content: '*';
-  color: red;
-  display: inline-block;
-  margin-inline-end: 4px;
-  box-sizing: border-box;
-}
-
-.carefrees-form-item-body {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  justify-content: flex-start;
-  box-sizing: border-box;
-  gap: 4px;
-  flex: 1;
-}
-.carefrees-form-item-body-input {
-  box-sizing: border-box;
-  width: 100%;
-  flex: 1;
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  flex-direction: row;
-}
-
-.carefrees-form-item-body-input.input-bordered {
-  border-bottom: 1px solid #e0e0e0;
-}
-
-.carefrees-form-item-body-help {
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.carefrees-form-item-body-error {
-  position: absolute;
-  width: 100%;
-  color: red;
-  top: auto;
-  left: 0;
-  right: 0;
-  bottom: -16px;
-  padding-top: 2px;
-  font-size: 12px;
-  box-sizing: border-box;
-  z-index: 10;
-  pointer-events: none;
-  display: flex;
-  flex-direction: row;
-  justify-content: start;
-}
-.carefrees-form-item-body-error.right-bottom {
-  justify-content: flex-end;
-  top: auto;
-  left: 0;
-  right: 0;
-  bottom: -16px;
-}
-.carefrees-form-item-body-error.top-left {
-  justify-content: start;
-  top: -16px;
-  left: 0px;
-  right: 0px;
-  bottom: auto;
-}
-.carefrees-form-item-body-error.top-right {
-  justify-content: flex-end;
-  top: -16px;
-  left: 0px;
-  right: 0px;
-  bottom: auto;
-}
-.carefrees-form-item-extra {
-  box-sizing: border-box;
-}