taro-react-uilib 1.4.35 → 1.4.36

package/dist/components/AmountKeyboard/index.js

@@ -1,2 +1,2 @@
-import{__read as e}from"../node_modules/tslib/tslib.es6.js";import t,{useState as n,useEffect as a,useCallback as o}from"react";import r from"classnames";import{View as l}from"@tarojs/components";import{pxTransform as u}from"../src/utils/index.js";import m from"../Badge/index.js";import c from"../Space/index.js";import p from"../node_modules/react-transition-group/esm/CSSTransition.js";var i=[{text:1,value:1,type:"number"},{text:2,value:2,type:"number"},{text:3,value:3,type:"number"},{text:"",value:"",type:"delete"},{text:4,value:4,type:"number"},{text:5,value:5,type:"number"},{text:6,value:6,type:"number"},{text:"",value:"",type:"none"},{text:7,value:7,type:"number"},{text:8,value:8,type:"number"},{text:9,value:9,type:"number"},{text:"",value:"",type:"none"},{text:"00",value:"00",type:"number"},{text:0,value:0,type:"number"},{text:"",value:"",type:"close"},{text:"",value:"",type:"none"}],s=[{text:1,value:1,type:"number"},{text:2,value:2,type:"number"},{text:3,value:3,type:"number"},{text:"",value:"",type:"delete"},{text:4,value:4,type:"number"},{text:5,value:5,type:"number"},{text:6,value:6,type:"number"},{text:"",value:"",type:"none"},{text:7,value:7,type:"number"},{text:8,value:8,type:"number"},{text:9,value:9,type:"number"},{text:"",value:"",type:"none"},{text:"·",value:".",type:"number"},{text:0,value:0,type:"number"},{text:"",value:"",type:"close"},{text:"",value:"",type:"none"}],d=function(d){var y=d.onBlur,x=d.show,v=d.maxLength,b=void 0===v?Number.MAX_SAFE_INTEGER:v,f=d.closeOnClickSpace,k=void 0===f||f,h=d.onClose,E=d.onChange,g=d.value,N=d.className,C=d.onConfirm,T=d.recommend,j=void 0===T?[]:T,I=d.header,O=d.disabled,S=void 0!==O&&O,_=d.tip,L=d.decimal,w=d.dataTrackId,A=e(n(g),2),P=A[0],B=A[1];function R(e){h&&h(e),y&&y(e)}a((function(){return k&&document.addEventListener("click",R),function(){document.removeEventListener("click",R)}}),[]),a((function(){B(g)}),[g]);var F=o((function(e,t){var n=t.type,a=t.value;if("h5"===process.env.TARO_ENV&&e.stopImmediatePropagation(),!S&&"none"!==n&&("."!==a||""!==P))if("close"!==n){var o=P;"delete"===n?o=P.slice(0,P.length-1):o.replace(/^0+/g,"").length<b&&(o=P+a),L&&0===a&&""===P&&(o=a+"."),"."===a&&P.includes(".")||"number"===n&&P.indexOf(".")>-1&&P.length-P.indexOf(".")==3||o!==P&&(B(o),null==E||E(o))}else R(e)}),[P,S]),G=L?s:i,M=r("xh-amount-keyboard",N);return t.createElement(p,{classNames:"slide-up",in:x,unmountOnExit:!0,timeout:200},t.createElement(l,{className:M},t.createElement(l,{className:"xh-amount-keyboard-header"},t.createElement(l,{className:"xh-amount-keyboard-header-wrapper"},I||j.length>0&&t.createElement(l,{className:"xh-amount-keyboard-header-wrapper-text"},"猜您想借"," ",t.createElement(c,{style:{marginLeft:u(24)}},null==j?void 0:j.map((function(e,n){return t.createElement(l,{dataTrackId:"".concat(w,"-recommend-").concat(n),key:n,onClick:function(t){return function(e,t){e.stopPropagation(),null==C||C("".concat(t),!0)}(t,e)}},t.createElement(m,{content:"¥".concat(e),key:n}))})))),_)),t.createElement(l,{className:"xh-amount-keyboard-body"},G.map((function(e,n){return t.createElement(l,{key:n,dataTrackId:"".concat(w,"-key-").concat(n),className:r("xh-amount-keyboard-body-key",{none:"none"===e.type,delete:"delete"===e.type,close:"close"===e.type}),onClick:function(t){F(t,e)}},e.text)})),t.createElement(l,{dataTrackId:"".concat(w,"-confirm-fake"),className:"xh-amount-keyboard-body-key confirm-fake",onClick:function(e){e.stopPropagation(),null==C||C(P)}},"确定"))))};export{d as default};
+import{__read as e}from"../node_modules/tslib/tslib.es6.js";import t,{useState as n,useEffect as a,useCallback as o}from"react";import r from"classnames";import{View as l}from"@tarojs/components";import{pxTransform as u}from"../src/utils/index.js";import m from"../Badge/index.js";import c from"../Space/index.js";import i from"../node_modules/react-transition-group/esm/CSSTransition.js";var p=[{text:1,value:1,type:"number"},{text:2,value:2,type:"number"},{text:3,value:3,type:"number"},{text:"",value:"",type:"delete"},{text:4,value:4,type:"number"},{text:5,value:5,type:"number"},{text:6,value:6,type:"number"},{text:"",value:"",type:"none"},{text:7,value:7,type:"number"},{text:8,value:8,type:"number"},{text:9,value:9,type:"number"},{text:"",value:"",type:"none"},{text:"00",value:"00",type:"number"},{text:0,value:0,type:"number"},{text:"",value:"",type:"close"},{text:"",value:"",type:"none"}],s=[{text:1,value:1,type:"number"},{text:2,value:2,type:"number"},{text:3,value:3,type:"number"},{text:"",value:"",type:"delete"},{text:4,value:4,type:"number"},{text:5,value:5,type:"number"},{text:6,value:6,type:"number"},{text:"",value:"",type:"none"},{text:7,value:7,type:"number"},{text:8,value:8,type:"number"},{text:9,value:9,type:"number"},{text:"",value:"",type:"none"},{text:"·",value:".",type:"number"},{text:0,value:0,type:"number"},{text:"",value:"",type:"close"},{text:"",value:"",type:"none"}],d=function(d){var y=d.onBlur,v=d.show,x=d.maxLength,b=void 0===x?Number.MAX_SAFE_INTEGER:x,f=d.closeOnClickSpace,k=void 0===f||f,h=d.onClose,E=d.onChange,g=d.value,N=d.className,C=d.onConfirm,T=d.recommend,j=void 0===T?[]:T,I=d.header,_=d.disabled,O=void 0!==_&&_,S=d.tip,A=d.decimal,L=d.dataTrackId,w=void 0===L?"Amount_Keyboard":L,P=e(n(g),2),B=P[0],R=P[1];function F(e){h&&h(e),y&&y(e)}a((function(){return k&&document.addEventListener("click",F),function(){document.removeEventListener("click",F)}}),[]),a((function(){R(g)}),[g]);var G=o((function(e,t){var n=t.type,a=t.value;if("h5"===process.env.TARO_ENV&&e.stopImmediatePropagation(),!O&&"none"!==n&&("."!==a||""!==B))if("close"!==n){var o=B;"delete"===n?o=B.slice(0,B.length-1):o.replace(/^0+/g,"").length<b&&(o=B+a),A&&0===a&&""===B&&(o=a+"."),"."===a&&B.includes(".")||"number"===n&&B.indexOf(".")>-1&&B.length-B.indexOf(".")==3||o!==B&&(R(o),null==E||E(o))}else F(e)}),[B,O]),K=A?s:p,M=r("xh-amount-keyboard",N);return t.createElement(i,{classNames:"slide-up",in:v,unmountOnExit:!0,timeout:200},t.createElement(l,{className:M},t.createElement(l,{className:"xh-amount-keyboard-header"},t.createElement(l,{className:"xh-amount-keyboard-header-wrapper"},I||j.length>0&&t.createElement(l,{className:"xh-amount-keyboard-header-wrapper-text"},"猜您想借"," ",t.createElement(c,{style:{marginLeft:u(24)}},null==j?void 0:j.map((function(e,n){return t.createElement(l,{dataTrackId:"".concat(w,"-recommend-").concat(n),key:n,onClick:function(t){return function(e,t){e.stopPropagation(),null==C||C("".concat(t),!0)}(t,e)}},t.createElement(m,{content:"¥".concat(e),key:n}))})))),S)),t.createElement(l,{className:"xh-amount-keyboard-body"},K.map((function(e,n){return t.createElement(l,{key:n,dataTrackId:"".concat(w,"-key-").concat(n),className:r("xh-amount-keyboard-body-key",{none:"none"===e.type,delete:"delete"===e.type,close:"close"===e.type}),onClick:function(t){G(t,e)}},e.text)})),t.createElement(l,{dataTrackId:"".concat(w,"-confirm-fake"),className:"xh-amount-keyboard-body-key confirm-fake",onClick:function(e){e.stopPropagation(),null==C||C(B)}},"确定"))))};export{d as default};
 //# sourceMappingURL=index.js.map

package/dist/components/AmountKeyboard/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/AmountKeyboard/index.tsx"],"sourcesContent":["import React, {\n  FC,\n  useState,\n  useEffect,\n  MouseEvent,\n  ReactNode,\n  useCallback,\n} from \"react\";\nimport classNames from \"classnames\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { ITouchEvent, View } from \"@tarojs/components\";\nimport { pxTransform } from \"@/utils\";\n\nimport Badge from \"../Badge\";\nimport \"./index.scss\";\nimport { XHComponentCommonProps } from \"../../types\";\nimport Space from \"../Space\";\n\nexport type NumberKeyboardProps = {\n  show: boolean;\n  /**\n   * 是否支持小数，小数保留小数点后两位，默认不支持\n   */\n  decimal?: boolean;\n  showClose?: boolean;\n  closeOnClickSpace?: boolean;\n  maxLength?: number;\n  onBlur?: (e: MouseEvent | Event) => void;\n  onClose?: (e: MouseEvent | Event) => void;\n  onChange?: (value: string) => void;\n  value: string;\n  header?: ReactNode;\n  /**\n   *\n   * @param value 输入值\n   * @param recommend 是否是点击推荐金额触发\n   * @returns void\n   */\n  onConfirm?: (value: string, recommend?: boolean) => void;\n  recommend?: Array<number | string>;\n  tip?: ReactNode;\n  disabled?: boolean;\n  dataTrackId?: string;\n} & XHComponentCommonProps;\n\nexport type KeyType = \"number\" | \"delete\" | \"string\" | \"none\" | \"close\";\n\nexport interface IKey {\n  text: number | string;\n  value: number | string;\n  type: KeyType;\n}\n\nconst XHAmountKeys: IKey[] = [\n  { text: 1, value: 1, type: \"number\" },\n  { text: 2, value: 2, type: \"number\" },\n  { text: 3, value: 3, type: \"number\" },\n  { text: \"\", value: \"\", type: \"delete\" },\n  { text: 4, value: 4, type: \"number\" },\n  { text: 5, value: 5, type: \"number\" },\n  { text: 6, value: 6, type: \"number\" },\n  { text: \"\", value: \"\", type: \"none\" },\n  { text: 7, value: 7, type: \"number\" },\n  { text: 8, value: 8, type: \"number\" },\n  { text: 9, value: 9, type: \"number\" },\n  { text: \"\", value: \"\", type: \"none\" },\n  { text: \"00\", value: \"00\", type: \"number\" },\n  { text: 0, value: 0, type: \"number\" },\n  { text: \"\", value: \"\", type: \"close\" },\n  { text: \"\", value: \"\", type: \"none\" },\n];\n\nconst XHAmountKeysWithDot: IKey[] = [\n  { text: 1, value: 1, type: \"number\" },\n  { text: 2, value: 2, type: \"number\" },\n  { text: 3, value: 3, type: \"number\" },\n  { text: \"\", value: \"\", type: \"delete\" },\n  { text: 4, value: 4, type: \"number\" },\n  { text: 5, value: 5, type: \"number\" },\n  { text: 6, value: 6, type: \"number\" },\n  { text: \"\", value: \"\", type: \"none\" },\n  { text: 7, value: 7, type: \"number\" },\n  { text: 8, value: 8, type: \"number\" },\n  { text: 9, value: 9, type: \"number\" },\n  { text: \"\", value: \"\", type: \"none\" },\n  { text: \"·\", value: \".\", type: \"number\" },\n  { text: 0, value: 0, type: \"number\" },\n  { text: \"\", value: \"\", type: \"close\" },\n  { text: \"\", value: \"\", type: \"none\" },\n];\n\nconst AmountKeyboard: FC<NumberKeyboardProps> = props => {\n  const {\n    onBlur,\n    show,\n    maxLength = Number.MAX_SAFE_INTEGER,\n    closeOnClickSpace = true,\n    onClose,\n    onChange,\n    value,\n    className,\n    onConfirm,\n    recommend = [],\n    header,\n    disabled = false,\n    tip,\n    decimal,\n    dataTrackId,\n  } = props;\n  const [input, setInput] = useState(value);\n\n  useEffect(() => {\n    if (closeOnClickSpace) {\n      document.addEventListener(\"click\", handleClose);\n    }\n\n    return () => {\n      document.removeEventListener(\"click\", handleClose);\n    };\n  }, []);\n\n  useEffect(() => {\n    setInput(value);\n  }, [value]);\n\n  function handleClose(e): void {\n    onClose && onClose(e);\n    onBlur && onBlur(e);\n  }\n\n  const handleOnRecommand = (e: ITouchEvent, amount: number | string) => {\n    e.stopPropagation();\n    onConfirm?.(`${amount}`, true);\n  };\n\n  const handleKeyPress = useCallback(\n    (e, { type, value }: IKey): void => {\n      if (process.env.TARO_ENV === \"h5\") {\n        e.stopImmediatePropagation();\n      }\n      if (disabled) return;\n      if (type === \"none\") return;\n      // 第一个字符不能是.\n      if (value === \".\" && input === \"\") return;\n      if (type === \"close\") {\n        handleClose(e);\n        return;\n      }\n      let newInput = input;\n      if (type === \"delete\") {\n        newInput = input.slice(0, input.length - 1);\n      } else if (newInput.replace(/^0+/g, \"\").length < maxLength) {\n        newInput = input + value;\n      }\n      // 支持小数点的情况下，如果第一个是0，自动填充.\n      if (decimal && value === 0 && input === \"\") newInput = value + \".\";\n\n      // 不能包含多个小数点\n      if (value === \".\" && input.includes(\".\")) return;\n      // 保留两位小数\n      if (\n        type === \"number\" &&\n        input.indexOf(\".\") > -1 &&\n        input.length - input.indexOf(\".\") === 3\n      )\n        return;\n\n      // 前后两个值相等就不触发onchange\n      if (newInput === input) return;\n      setInput(newInput);\n      onChange?.(newInput);\n    },\n    [input, disabled]\n  );\n\n  const renderKeys = decimal ? XHAmountKeysWithDot : XHAmountKeys;\n\n  const handleConfirm = (e: ITouchEvent) => {\n    e.stopPropagation();\n    onConfirm?.(input);\n  };\n  const keyboardcls = classNames(\"xh-amount-keyboard\", className);\n\n  return (\n    <CSSTransition classNames=\"slide-up\" in={show} unmountOnExit timeout={200}>\n      <View className={keyboardcls}>\n        <View className=\"xh-amount-keyboard-header\">\n          <View className=\"xh-amount-keyboard-header-wrapper\">\n            {header ||\n              (recommend.length > 0 && (\n                <View className=\"xh-amount-keyboard-header-wrapper-text\">\n                  猜您想借{\" \"}\n                  <Space style={{ marginLeft: pxTransform(24) }}>\n                    {recommend?.map((amount, index) => (\n                      <View\n                        // @ts-ignore\n                        dataTrackId={`${dataTrackId}-recommend-${index}`}\n                        key={index}\n                        onClick={e => handleOnRecommand(e, amount)}\n                      >\n                        <Badge content={`¥${amount}`} key={index} />\n                      </View>\n                    ))}\n                  </Space>\n                </View>\n              ))}\n            {tip}\n          </View>\n        </View>\n        <View className=\"xh-amount-keyboard-body\">\n          {renderKeys.map((key, index) => (\n            <View\n              key={index}\n              // @ts-ignore\n              dataTrackId={`${dataTrackId}-key-${index}`}\n              className={classNames(\"xh-amount-keyboard-body-key\", {\n                none: key.type === \"none\",\n                delete: key.type === \"delete\",\n                close: key.type === \"close\",\n              })}\n              onClick={e => {\n                handleKeyPress(e, key);\n              }}\n            >\n              {key.text}\n            </View>\n          ))}\n          <View\n            // @ts-ignore\n            dataTrackId={`${dataTrackId}-confirm-fake`}\n            className=\"xh-amount-keyboard-body-key confirm-fake\"\n            onClick={handleConfirm}\n          >\n            确定\n          </View>\n        </View>\n      </View>\n    </CSSTransition>\n  );\n};\n\nexport default AmountKeyboard;\n"],"names":["XHAmountKeys","text","value","type","XHAmountKeysWithDot","AmountKeyboard","props","onBlur","show","_a","maxLength","Number","MAX_SAFE_INTEGER","_b","closeOnClickSpace","onClose","onChange","className","onConfirm","_c","recommend","header","_d","disabled","tip","decimal","dataTrackId","_e","__read","useState","input","setInput","handleClose","e","useEffect","document","addEventListener","removeEventListener","handleKeyPress","useCallback","process","env","TARO_ENV","stopImmediatePropagation","newInput","slice","length","replace","includes","indexOf","renderKeys","keyboardcls","classNames","React","createElement","CSSTransition","in","unmountOnExit","timeout","View","Space","style","marginLeft","pxTransform","map","amount","index","concat","key","onClick","stopPropagation","handleOnRecommand","Badge","content","none","delete","close"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/AmountKeyboard/index.tsx"],"sourcesContent":["import React, {\n  FC,\n  useState,\n  useEffect,\n  MouseEvent,\n  ReactNode,\n  useCallback,\n} from \"react\";\nimport classNames from \"classnames\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { ITouchEvent, View } from \"@tarojs/components\";\nimport { pxTransform } from \"@/utils\";\n\nimport Badge from \"../Badge\";\nimport \"./index.scss\";\nimport { XHComponentCommonProps } from \"../../types\";\nimport Space from \"../Space\";\n\nexport type NumberKeyboardProps = {\n  show: boolean;\n  /**\n   * 是否支持小数，小数保留小数点后两位，默认不支持\n   */\n  decimal?: boolean;\n  showClose?: boolean;\n  closeOnClickSpace?: boolean;\n  maxLength?: number;\n  onBlur?: (e: MouseEvent | Event) => void;\n  onClose?: (e: MouseEvent | Event) => void;\n  onChange?: (value: string) => void;\n  value: string;\n  header?: ReactNode;\n  /**\n   *\n   * @param value 输入值\n   * @param recommend 是否是点击推荐金额触发\n   * @returns void\n   */\n  onConfirm?: (value: string, recommend?: boolean) => void;\n  recommend?: Array<number | string>;\n  tip?: ReactNode;\n  disabled?: boolean;\n  dataTrackId?: string;\n} & XHComponentCommonProps;\n\nexport type KeyType = \"number\" | \"delete\" | \"string\" | \"none\" | \"close\";\n\nexport interface IKey {\n  text: number | string;\n  value: number | string;\n  type: KeyType;\n}\n\nconst XHAmountKeys: IKey[] = [\n  { text: 1, value: 1, type: \"number\" },\n  { text: 2, value: 2, type: \"number\" },\n  { text: 3, value: 3, type: \"number\" },\n  { text: \"\", value: \"\", type: \"delete\" },\n  { text: 4, value: 4, type: \"number\" },\n  { text: 5, value: 5, type: \"number\" },\n  { text: 6, value: 6, type: \"number\" },\n  { text: \"\", value: \"\", type: \"none\" },\n  { text: 7, value: 7, type: \"number\" },\n  { text: 8, value: 8, type: \"number\" },\n  { text: 9, value: 9, type: \"number\" },\n  { text: \"\", value: \"\", type: \"none\" },\n  { text: \"00\", value: \"00\", type: \"number\" },\n  { text: 0, value: 0, type: \"number\" },\n  { text: \"\", value: \"\", type: \"close\" },\n  { text: \"\", value: \"\", type: \"none\" },\n];\n\nconst XHAmountKeysWithDot: IKey[] = [\n  { text: 1, value: 1, type: \"number\" },\n  { text: 2, value: 2, type: \"number\" },\n  { text: 3, value: 3, type: \"number\" },\n  { text: \"\", value: \"\", type: \"delete\" },\n  { text: 4, value: 4, type: \"number\" },\n  { text: 5, value: 5, type: \"number\" },\n  { text: 6, value: 6, type: \"number\" },\n  { text: \"\", value: \"\", type: \"none\" },\n  { text: 7, value: 7, type: \"number\" },\n  { text: 8, value: 8, type: \"number\" },\n  { text: 9, value: 9, type: \"number\" },\n  { text: \"\", value: \"\", type: \"none\" },\n  { text: \"·\", value: \".\", type: \"number\" },\n  { text: 0, value: 0, type: \"number\" },\n  { text: \"\", value: \"\", type: \"close\" },\n  { text: \"\", value: \"\", type: \"none\" },\n];\n\nconst AmountKeyboard: FC<NumberKeyboardProps> = props => {\n  const {\n    onBlur,\n    show,\n    maxLength = Number.MAX_SAFE_INTEGER,\n    closeOnClickSpace = true,\n    onClose,\n    onChange,\n    value,\n    className,\n    onConfirm,\n    recommend = [],\n    header,\n    disabled = false,\n    tip,\n    decimal,\n    dataTrackId = \"Amount_Keyboard\",\n  } = props;\n  const [input, setInput] = useState(value);\n\n  useEffect(() => {\n    if (closeOnClickSpace) {\n      document.addEventListener(\"click\", handleClose);\n    }\n\n    return () => {\n      document.removeEventListener(\"click\", handleClose);\n    };\n  }, []);\n\n  useEffect(() => {\n    setInput(value);\n  }, [value]);\n\n  function handleClose(e): void {\n    onClose && onClose(e);\n    onBlur && onBlur(e);\n  }\n\n  const handleOnRecommand = (e: ITouchEvent, amount: number | string) => {\n    e.stopPropagation();\n    onConfirm?.(`${amount}`, true);\n  };\n\n  const handleKeyPress = useCallback(\n    (e, { type, value }: IKey): void => {\n      if (process.env.TARO_ENV === \"h5\") {\n        e.stopImmediatePropagation();\n      }\n      if (disabled) return;\n      if (type === \"none\") return;\n      // 第一个字符不能是.\n      if (value === \".\" && input === \"\") return;\n      if (type === \"close\") {\n        handleClose(e);\n        return;\n      }\n      let newInput = input;\n      if (type === \"delete\") {\n        newInput = input.slice(0, input.length - 1);\n      } else if (newInput.replace(/^0+/g, \"\").length < maxLength) {\n        newInput = input + value;\n      }\n      // 支持小数点的情况下，如果第一个是0，自动填充.\n      if (decimal && value === 0 && input === \"\") newInput = value + \".\";\n\n      // 不能包含多个小数点\n      if (value === \".\" && input.includes(\".\")) return;\n      // 保留两位小数\n      if (\n        type === \"number\" &&\n        input.indexOf(\".\") > -1 &&\n        input.length - input.indexOf(\".\") === 3\n      )\n        return;\n\n      // 前后两个值相等就不触发onchange\n      if (newInput === input) return;\n      setInput(newInput);\n      onChange?.(newInput);\n    },\n    [input, disabled]\n  );\n\n  const renderKeys = decimal ? XHAmountKeysWithDot : XHAmountKeys;\n\n  const handleConfirm = (e: ITouchEvent) => {\n    e.stopPropagation();\n    onConfirm?.(input);\n  };\n  const keyboardcls = classNames(\"xh-amount-keyboard\", className);\n\n  return (\n    <CSSTransition classNames=\"slide-up\" in={show} unmountOnExit timeout={200}>\n      <View className={keyboardcls}>\n        <View className=\"xh-amount-keyboard-header\">\n          <View className=\"xh-amount-keyboard-header-wrapper\">\n            {header ||\n              (recommend.length > 0 && (\n                <View className=\"xh-amount-keyboard-header-wrapper-text\">\n                  猜您想借{\" \"}\n                  <Space style={{ marginLeft: pxTransform(24) }}>\n                    {recommend?.map((amount, index) => (\n                      <View\n                        // @ts-ignore\n                        dataTrackId={`${dataTrackId}-recommend-${index}`}\n                        key={index}\n                        onClick={e => handleOnRecommand(e, amount)}\n                      >\n                        <Badge content={`¥${amount}`} key={index} />\n                      </View>\n                    ))}\n                  </Space>\n                </View>\n              ))}\n            {tip}\n          </View>\n        </View>\n        <View className=\"xh-amount-keyboard-body\">\n          {renderKeys.map((key, index) => (\n            <View\n              key={index}\n              // @ts-ignore\n              dataTrackId={`${dataTrackId}-key-${index}`}\n              className={classNames(\"xh-amount-keyboard-body-key\", {\n                none: key.type === \"none\",\n                delete: key.type === \"delete\",\n                close: key.type === \"close\",\n              })}\n              onClick={e => {\n                handleKeyPress(e, key);\n              }}\n            >\n              {key.text}\n            </View>\n          ))}\n          <View\n            // @ts-ignore\n            dataTrackId={`${dataTrackId}-confirm-fake`}\n            className=\"xh-amount-keyboard-body-key confirm-fake\"\n            onClick={handleConfirm}\n          >\n            确定\n          </View>\n        </View>\n      </View>\n    </CSSTransition>\n  );\n};\n\nexport default AmountKeyboard;\n"],"names":["XHAmountKeys","text","value","type","XHAmountKeysWithDot","AmountKeyboard","props","onBlur","show","_a","maxLength","Number","MAX_SAFE_INTEGER","_b","closeOnClickSpace","onClose","onChange","className","onConfirm","_c","recommend","header","_d","disabled","tip","decimal","_e","dataTrackId","_f","__read","useState","input","setInput","handleClose","e","useEffect","document","addEventListener","removeEventListener","handleKeyPress","useCallback","process","env","TARO_ENV","stopImmediatePropagation","newInput","slice","length","replace","includes","indexOf","renderKeys","keyboardcls","classNames","React","createElement","CSSTransition","in","unmountOnExit","timeout","View","Space","style","marginLeft","pxTransform","map","amount","index","concat","key","onClick","stopPropagation","handleOnRecommand","Badge","content","none","delete","close"],"mappings":"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"}

package/dist/components/Collapse/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/Collapse/index.tsx"],"sourcesContent":["import React, { ReactNode, useMemo, useRef, useState } from \"react\";\nimport List from \"@/components/List\";\nimport { View } from \"@tarojs/components\";\nimport classNames from \"classnames\";\nimport type { XHListProps } from \"../List\";\n\nimport \"./index.scss\";\n\nexport type CollapseProps = {\n  summary?: string | ReactNode;\n  open?: boolean;\n  style?: React.CSSProperties;\n  onToggle?: (open: boolean) => void;\n  dataTrackId?: string;\n} & XHListProps;\n\nconst Collapse: React.FC<CollapseProps> = props => {\n  const {\n    summary = \"\",\n    children,\n    open = false,\n    arrow,\n    className,\n    style,\n    onToggle,\n    dataTrackId = \"collapse\",\n    ...rest\n  } = props;\n  const detailRef = useRef<HTMLDivElement>(null);\n  const [innerOpen, setInneropen] = useState(open);\n  const handleOnchange = () => {\n    setInneropen(old => !old);\n  };\n\n  const detailStyle = useMemo(() => {\n    const style: React.CSSProperties = { height: 0 };\n    if (innerOpen)\n      style.height =\n        process.env.TARO_ENV === \"h5\"\n          ? `${detailRef.current?.scrollHeight}px`\n          : \"auto\";\n    process.env.TARO_ENV === \"h5\" &&\n      innerOpen &&\n      detailRef.current?.scrollIntoView({\n        behavior: \"smooth\",\n        block: \"end\",\n        inline: \"nearest\",\n      });\n    onToggle?.(innerOpen);\n    return style;\n  }, [innerOpen]);\n\n  return (\n    <View\n      className={classNames(\"xh-collapse\", className)}\n      style={style}\n      // @ts-ignore\n      dataTrackId={dataTrackId}\n    >\n      <View\n        // @ts-ignore\n        dataTrackId={`${dataTrackId}_summary`}\n        className={classNames(\"xh-collapse-summary\", { open: innerOpen })}\n        onClick={handleOnchange}\n      >\n        {summary || (\n          <List {...rest} arrow dataTrackId={`${dataTrackId}_summary_list`} />\n        )}\n      </View>\n      <View\n        className={classNames(\"xh-collapse-detail\")}\n        ref={detailRef}\n        style={detailStyle}\n      >\n        {children}\n      </View>\n    </View>\n  );\n};\n\nexport default Collapse;\n"],"names":["Collapse","props","_a","summary","children","_b","open","arrow","className","style","onToggle","_c","dataTrackId","rest","__rest","detailRef","useRef","_d","__read","useState","innerOpen","setInneropen","detailStyle","useMemo","height","process","env","TARO_ENV","current","scrollHeight","scrollIntoView","behavior","block","inline","React","createElement","View","classNames","concat","onClick","old","List","ref"],"mappings":"uPAgBM,IAAAA,EAAoC,SAAAC,GAEtC,IAAAC,EASED,EAAKE,QATPA,OAAU,IAAAD,EAAA,GAAEA,EACZE,EAQEH,EAAKG,SAPPC,EAOEJ,EAAKK,KAPPA,OAAO,IAAAD,GAAKA,EAOVJ,EAAKM,MALP,IAAAC,EAKEP,EAAKO,UAJPC,EAIER,EAJGQ,MACLC,EAGET,EAAKS,SAFPC,EAEEV,EAAKW,YAFPA,OAAc,IAAAD,EAAA,WAAUA,EACrBE,EAAIC,EACLb,EAVE,CAUL,UAAA,WAAA,OAAA,QAAA,YAAA,QAAA,WAAA,gBACKc,EAAYC,EAAuB,MACnCC,EAAAC,EAA4BC,EAASb,GAAK,GAAzCc,EAASH,EAAA,GAAEI,OAKZC,EAAcC,GAAQ,mBACpBd,EAA6B,CAAEe,OAAQ,GAc7C,OAbIJ,IACFX,EAAMe,OACqB,OAAzBC,QAAQC,IAAIC,SACR,UAAoB,QAAjBzB,EAAAa,EAAUa,eAAO,IAAA1B,OAAA,EAAAA,EAAE2B,aAAgB,MACtC,QACiB,OAAzBJ,QAAQC,IAAIC,UACVP,IACiB,QAAjBf,EAAAU,EAAUa,eAAO,IAAAvB,GAAAA,EAAEyB,eAAe,CAChCC,SAAU,SACVC,MAAO,MACPC,OAAQ,aAEZvB,SAAAA,EAAWU,GACJX,CACT,GAAG,CAACW,IAEJ,OACEc,EAAAC,cAACC,EAAI,CACH5B,UAAW6B,EAAW,cAAe7B,GACrCC,MAAOA,EAEPG,YAAaA,GAEbsB,EAAAC,cAACC,GAECxB,YAAa,GAAG0B,OAAA1B,EAAqB,YACrCJ,UAAW6B,EAAW,sBAAuB,CAAE/B,KAAMc,IACrDmB,QAjCiB,WACrBlB,GAAa,SAAAmB,GAAO,OAACA,CAAG,GAC1B,GAiCOrC,GACC+B,EAACC,cAAAM,OAAS5B,EAAI,CAAEN,OAAK,EAACK,YAAa,GAAA0B,OAAG1B,EAA0B,qBAGpEsB,EAACC,cAAAC,GACC5B,UAAW6B,EAAW,sBACtBK,IAAK3B,EACLN,MAAOa,GAENlB,GAIT"}
+{"version":3,"file":"index.js","sources":["../../../src/components/Collapse/index.tsx"],"sourcesContent":["import React, { ReactNode, useMemo, useRef, useState } from \"react\";\nimport List from \"@/components/List\";\nimport { View } from \"@tarojs/components\";\nimport classNames from \"classnames\";\nimport type { XHListProps } from \"../List\";\n\nimport \"./index.scss\";\n\nexport type CollapseProps = {\n  summary?: string | ReactNode;\n  open?: boolean;\n  style?: React.CSSProperties;\n  onToggle?: (open: boolean) => void;\n  dataTrackId?: string;\n} & XHListProps;\n\nconst Collapse: React.FC<CollapseProps> = props => {\n  const {\n    summary = \"\",\n    children,\n    open = false,\n    arrow,\n    className,\n    style,\n    onToggle,\n    dataTrackId = \"collapse\",\n    ...rest\n  } = props;\n  const detailRef = useRef<HTMLDivElement>(null);\n  const [innerOpen, setInneropen] = useState(open);\n  const handleOnchange = () => {\n    setInneropen(old => !old);\n  };\n\n  const detailStyle = useMemo(() => {\n    const style: React.CSSProperties = { height: 0 };\n    if (innerOpen)\n      style.height =\n        process.env.TARO_ENV === \"h5\"\n          ? `${detailRef.current?.scrollHeight}px`\n          : \"auto\";\n    process.env.TARO_ENV === \"h5\" &&\n      innerOpen &&\n      detailRef.current?.scrollIntoView({\n        behavior: \"smooth\",\n        block: \"end\",\n        inline: \"nearest\",\n      });\n    onToggle?.(innerOpen);\n    return style;\n  }, [innerOpen]);\n\n  return (\n    <View\n      className={classNames(\"xh-collapse\", className)}\n      style={style}\n      // @ts-ignore\n      dataTrackId={dataTrackId}\n    >\n      <View\n        // @ts-ignore\n        dataTrackId={`${dataTrackId}_summary`}\n        className={classNames(\"xh-collapse-summary\", { open: innerOpen })}\n        onClick={handleOnchange}\n      >\n        {summary || <List {...rest} arrow dataTrackId={`${dataTrackId}_summary_list`} />}\n      </View>\n      <View\n        className={classNames(\"xh-collapse-detail\")}\n        ref={detailRef}\n        style={detailStyle}\n      >\n        {children}\n      </View>\n    </View>\n  );\n};\n\nexport default Collapse;\n"],"names":["Collapse","props","_a","summary","children","_b","open","arrow","className","style","onToggle","_c","dataTrackId","rest","__rest","detailRef","useRef","_d","__read","useState","innerOpen","setInneropen","detailStyle","useMemo","height","process","env","TARO_ENV","current","scrollHeight","scrollIntoView","behavior","block","inline","React","createElement","View","classNames","concat","onClick","old","List","__assign","ref"],"mappings":"uPAgBM,IAAAA,EAAoC,SAAAC,GAEtC,IAAAC,EASED,EAAKE,QATPA,OAAU,IAAAD,EAAA,GAAEA,EACZE,EAQEH,EAAKG,SAPPC,EAOEJ,EAAKK,KAPPA,OAAO,IAAAD,GAAKA,EAOVJ,EAAKM,MALP,IAAAC,EAKEP,EAAKO,UAJPC,EAIER,EAJGQ,MACLC,EAGET,EAAKS,SAFPC,EAEEV,EAAKW,YAFPA,OAAc,IAAAD,EAAA,WAAUA,EACrBE,EAAIC,EACLb,EAVE,CAUL,UAAA,WAAA,OAAA,QAAA,YAAA,QAAA,WAAA,gBACKc,EAAYC,EAAuB,MACnCC,EAAAC,EAA4BC,EAASb,GAAK,GAAzCc,EAASH,EAAA,GAAEI,OAKZC,EAAcC,GAAQ,mBACpBd,EAA6B,CAAEe,OAAQ,GAc7C,OAbIJ,IACFX,EAAMe,OACqB,OAAzBC,QAAQC,IAAIC,SACR,UAAoB,QAAjBzB,EAAAa,EAAUa,eAAO,IAAA1B,OAAA,EAAAA,EAAE2B,aAAgB,MACtC,QACiB,OAAzBJ,QAAQC,IAAIC,UACVP,IACiB,QAAjBf,EAAAU,EAAUa,eAAO,IAAAvB,GAAAA,EAAEyB,eAAe,CAChCC,SAAU,SACVC,MAAO,MACPC,OAAQ,aAEZvB,SAAAA,EAAWU,GACJX,CACT,GAAG,CAACW,IAEJ,OACEc,EAAAC,cAACC,EAAI,CACH5B,UAAW6B,EAAW,cAAe7B,GACrCC,MAAOA,EAEPG,YAAaA,GAEbsB,EAAAC,cAACC,GAECxB,YAAa,GAAG0B,OAAA1B,EAAqB,YACrCJ,UAAW6B,EAAW,sBAAuB,CAAE/B,KAAMc,IACrDmB,QAjCiB,WACrBlB,GAAa,SAAAmB,GAAO,OAACA,CAAG,GAC1B,GAiCOrC,GAAW+B,EAAAC,cAACM,EAASC,EAAA,CAAA,EAAA7B,EAAM,CAAAN,SAAMK,YAAa,UAAGA,EAAW,qBAE/DsB,EAACC,cAAAC,GACC5B,UAAW6B,EAAW,sBACtBM,IAAK5B,EACLN,MAAOa,GAENlB,GAIT"}

package/dist/components/Tabbar/tabbar/Tabbar.js

@@ -1,2 +1,2 @@
-import{__read as t}from"../../node_modules/tslib/tslib.es6.js";import e,{useState as n,useRef as a,useCallback as r,useEffect as i}from"react";import{createSelectorQuery as o}from"@tarojs/taro";import{View as l,ScrollView as c}from"@tarojs/components";import s from"classnames";import m from"./TabItem.js";var u=function(m){var u=m.children,f=void 0===u?[]:u,h=m.lineColor,b=void 0===h?"#FE5E00":h,d=m.titleActiveColor,v=void 0===d?"#333":d,g=m.titleInctiveColor,x=void 0===g?"#999":g,p=m.onChange,C=m.content,R=m.selectIndex,E=void 0===R?0:R,N=m.isOverflowNav,A=void 0!==N&&N,w=t(n(0),2),T=w[0],k=w[1],y=t(n(0),2),I=y[0],B=y[1],j=t(n(0),2),M=j[0],O=j[1],W=t(n(0),2),X=W[0],_=W[1],V=a([]),F=a([]),L=a([]),q=a(null),z=a(null),D=a(null),G=function(t,e,n,a){if(!e||!A)return 0;var r=t.left-n-(e.width-t.width)/2,i=Math.max(0,a-e.width);return Math.max(0,Math.min(r,i))},H=r((function(e){var n=f.filter(Boolean);if(!(e<0||e>=n.length))if("h5"!==process.env.TARO_ENV)D.current=setTimeout((function(){var n=o();n.selectAll(".xh-tabbar-nav-item").boundingClientRect(),n.select(".xh-tabbar-nav").boundingClientRect(),n.selectAll(".xh-tabbar-content-item").boundingClientRect(),n.selectAll(".xh-tabbar-content-slot").boundingClientRect(),n.select(".xh-tabbar-nav-scroll").boundingClientRect(),n.exec((function(n){var a=t(n,5),r=a[0],i=a[1],o=a[2],l=a[3],c=a[4],s=(null==i?void 0:i.node)||i;if(r[e]&&s&&c){var m=r[e],u=i,f=m.left+m.width/2-u.left;if(O(f),A){var h=G(m,c,i.left,i.width);_(h)}}o[e]&&k(o[e].height),l[0]&&B(l[0].height)}))}),50);else{var a=V.current[e],r=L.current[0],i=F.current[e],l=null==a?void 0:a.parentElement,c=q.current;if(a&&l&&c){var s=a.getBoundingClientRect(),m=l.getBoundingClientRect(),u=c.getBoundingClientRect(),h=s.left+s.width/2-m.left;if(O(h),A){var b=G(s,u,m.left,l.offsetWidth);_(b)}}if(r){var d=r.getBoundingClientRect();B(d.height)}if(i){var v=i.getBoundingClientRect();k(v.height)}}}),[f,A]);i((function(){return H(E),function(){D.current&&clearTimeout(D.current)}}),[E,H]);return e.createElement(l,{className:"xh-tabbar"},e.createElement(c,{scrollX:!0,scrollLeft:X,className:"xh-tabbar-nav-scroll",ref:q,scrollWithAnimation:A,scrollAnchoring:A},e.createElement(l,{className:"xh-tabbar-nav",ref:z,style:{width:A?"fit-content":"100%"}},f.map((function(t,n){return e.createElement(l,{key:n,"data-index":n,dataTrackId:t.props.dataTrackId||"xh-tabbar-nav-item-".concat(n),ref:function(t){return V.current[n]=t},className:s("xh-tabbar-nav-item",{"more-item":A}),style:{color:E===n?v:x,flex:A?"none":"1"},onClick:function(){return function(t){if(t!==E&&(H(t),p&&p(t),"h5"===process.env.TARO_ENV)){var e=o();e.selectAll(".xh-tabbar-content-item").boundingClientRect(),e.selectAll(".xh-tabbar-content-slot").boundingClientRect(),e.exec((function(e){if(e[0][t]){var n=e[0][t].height;k(n),e[1][t]&&B(e[1][t].height)}}))}}(n)}},t.props.TabItemComponent||t.props.title)})),e.createElement("div",{className:"xh-tabbar-nav-line",style:{background:"".concat(b),transform:"translateX(".concat(M,"px) translate(-50%, -50%)"),WebkitTransform:"translateX(".concat(M,"px) translate(-50%, -50%)"),transition:"transform 0.3s ease"}}))),e.createElement(l,{className:"xh-tabbar-content",style:{width:"".concat(100*f.length,"%"),height:T+I?"".concat(T+I,"px"):"auto"}},C&&e.createElement(l,{className:"xh-tabbar-content-slot",ref:L},C),f.map((function(t,n){return e.createElement(l,{key:n,ref:function(t){return F.current[n]=t},className:s("xh-tabbar-content-item",{"xh-tabbar-content-item-dispaly":E!==n,"xh-tabbar-content-item-active":E===n})},t.props.children)}))))};u.Item=m;export{u as default};
+import{__read as t}from"../../node_modules/tslib/tslib.es6.js";import e,{useState as n,useRef as a,useEffect as r}from"react";import{createSelectorQuery as o}from"@tarojs/taro";import{View as c}from"@tarojs/components";import i from"classnames";import l from"./TabItem.js";var s=function(l){var s=l.children,m=void 0===s?[]:s,b=l.animated,h=void 0!==b&&b,u=l.lineColor,d=void 0===u?"#F6AB00":u,f=l.titleActiveColor,v=void 0===f?"#333":f,p=l.titleInctiveColor,x=void 0===p?"#999":p,g=l.onChange,C=l.content,T=l.selectIndex,R=void 0===T?0:T,A=t(n(0),2),E=A[0],I=A[1],N=t(n(0),2),k=N[0],y=N[1],j=t(n(0),2),B=j[0],w=j[1],X=a([]),_=a([]),F=a([]);r((function(){var t=setTimeout((function(){if("h5"!==process.env.TARO_ENV){var e=o();e.selectAll(".xh-tabbar-nav-item").boundingClientRect(),e.selectAll(".xh-tabbar-content-item").boundingClientRect(),e.selectAll(".xh-tabbar-content-slot").boundingClientRect(),e.exec((function(e){if(e[0][R]){var n=e[0][R].width;I(n),e[1][R]&&(y(e[1][R].height),e[2][R]&&(w(e[2][R].height),clearTimeout(t)))}}))}else{var n=X.current[R];if(n){var a=n.getBoundingClientRect();I(a.width)}var r=F.current[0];if(r){a=r.getBoundingClientRect();w(a.height)}var c=_.current[R];if(c){a=c.getBoundingClientRect();y(a.height)}clearTimeout(t)}}),300)}),[R,m]);var O;return e.createElement(c,{className:"xh-tabbar"},e.createElement(c,{className:"xh-tabbar-nav"},m.map((function(t,n){return e.createElement(c,{key:n,dataTrackId:t.props.dataTrackId||"xh-tabbar-nav-item-".concat(n),ref:function(t){return X.current[n]=t},className:"xh-tabbar-nav-item",style:{color:R===n?v:x},onClick:function(){return function(t){var e=o();e.selectAll(".xh-tabbar-content-item").boundingClientRect(),e.selectAll(".xh-tabbar-content-slot").boundingClientRect(),e.exec((function(e){if(e[0][t]){var n=e[0][t].height;y(n),e[1][t]&&w(e[1][t].height)}})),g&&g(t)}(n)}},t.props.TabItemComponent?t.props.TabItemComponent:t.props.title)})),(O=E/2+R*E,e.createElement("div",{className:i("xh-tabbar-nav-line",{"xh-tabbar-nav-line-active":h}),style:{background:"".concat(d),transform:"translateX(".concat(O,"px) translate(-50%, -50%)"),WebkitTransform:"translateX(".concat(O,"px) translate(-50%, -50%)")}}))),e.createElement(c,{className:"xh-tabbar-content",style:{width:"".concat(100*m.length,"%"),height:k+B?"".concat(k+B,"px"):"auto"}},C&&e.createElement(c,{className:"xh-tabbar-content-slot",ref:F},C),m.map((function(t,n){return e.createElement(c,{key:n,ref:function(t){return _.current[n]=t},className:i("xh-tabbar-content-item",{"xh-tabbar-content-item-dispaly":R!==n&&!h,"xh-tabbar-content-item-active":R===n}),style:{transform:h?"translateX(-".concat(100*R,"%)"):""}},t.props.children)}))))};s.Item=l;export{s as default};
 //# sourceMappingURL=Tabbar.js.map

package/dist/components/Tabbar/tabbar/Tabbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabbar.js","sources":["../../../../src/components/Tabbar/tabbar/Tabbar.tsx"],"sourcesContent":["import React, {\n  FC,\n  ReactElement,\n  useEffect,\n  useState,\n  ReactNode,\n  useRef,\n  useCallback,\n} from \"react\";\nimport { createSelectorQuery } from \"@tarojs/taro\";\nimport { View, ScrollView } from \"@tarojs/components\";\nimport classNames from \"classnames\";\nimport Item from \"./TabItem\";\n\n/**\n * Tab切换\n *\n * @param children  //子组件\n * @param animated  //是否开启转场动画\n * @param selectIndex  //默认选中第几个\n * @param lineColor   //下划线颜色\n * @param titleActiveColor   //标题选中态颜色\n * @param titleInctiveColor   //标题默认态颜色\n * @param onChange   //切换回调事件\n * @param content   //item公共节点\n * @param isOverflowNav   //是否超宽导航（超过屏幕宽度，自动滚动）\n *\n */\n\nexport interface TabProps {\n  children: ReactElement[];\n  animated?: boolean;\n  lineColor?: string;\n  titleActiveColor?: string;\n  titleInctiveColor?: string;\n  onChange?: (index: number) => void;\n  content?: string | ReactNode;\n  selectIndex: number;\n  isOverflowNav?: boolean;\n}\n\nexport interface TabsComponent<P = {}> extends FC<P> {\n  Item: typeof Item;\n}\n\nconst XHTabs: TabsComponent<TabProps> = props => {\n  const {\n    children = [],\n    // animated = false,\n    lineColor = \"#FE5E00\",\n    titleActiveColor = \"#333\",\n    titleInctiveColor = \"#999\",\n    onChange,\n    content,\n    selectIndex = 0,\n    isOverflowNav = false,\n  } = props;\n\n  const [tabContentHeight, setTabContentHeight] = useState(0);\n  const [tabSlotHeight, setTabSlotHeight] = useState(0);\n  const [lineLeft, setLineLeft] = useState(0); // 下划线左偏移，核心：通过状态控制下划线位置，确保同步更新和动画过渡\n  const [navLeft, setNavLeft] = useState(0); // 导航滚动位置，核心：通过状态控制滚动位置，适配超宽导航\n  // Ref定义\n  const itemNavRef = useRef<(HTMLDivElement | null)[]>([]);\n  const itemContentRef = useRef<(HTMLDivElement | null)[]>([]);\n  const itemSlotRef = useRef<(HTMLDivElement | null)[]>([]);\n  const navScrollRef = useRef<HTMLDivElement | null>(null); // 滚动容器ref\n  const navContainerRef = useRef<HTMLDivElement | null>(null);\n  const timerRef = useRef<NodeJS.Timeout | null>(null); // 定时器ref，避免闭包丢失\n\n  // 统一滚动计算逻辑：H5/小程序通用\n  const computeScroll = (\n    itemRect: any,\n    scrollRect: any,\n    containerLeft: number,\n    containerWidth: number\n  ) => {\n    if (!scrollRect || !isOverflowNav) return 0;\n    // 元素在导航容器内的绝对偏移（视口坐标转容器坐标）\n    const itemOffsetInNav = itemRect.left - containerLeft;\n    // 居中滚动值：让选中项尽量居中显示\n    let targetScroll =\n      itemOffsetInNav - (scrollRect.width - itemRect.width) / 2;\n    // 最大可滚动距离：总导航宽度 - 可视区域宽度\n    const maxScroll = Math.max(0, containerWidth - scrollRect.width);\n    // 边界处理：不小于0，不大于最大可滚动距离\n    return Math.max(0, Math.min(targetScroll, maxScroll));\n  };\n\n  // 抽离位置/尺寸计算逻辑，复用（初始化+切换都调用）\n  const calculateTabInfo = useCallback(\n    (targetIndex: number) => {\n      // 过滤空children，避免索引越界\n      const validChildren = children.filter(Boolean);\n      if (targetIndex < 0 || targetIndex >= validChildren.length) return;\n\n      // H5端：直接通过ref获取元素信息，核心：同步更新，无需等待DOM渲染\n      if (process.env.TARO_ENV === \"h5\") {\n        const navItem = itemNavRef.current[targetIndex];\n        const slotItem = itemSlotRef.current[0];\n        const contentItem = itemContentRef.current[targetIndex];\n        const navContainer = navItem?.parentElement as HTMLDivElement;\n        const scrollContainer = navScrollRef.current;\n\n        // 计算下划线位置\n        if (navItem && navContainer && scrollContainer) {\n          const itemRect = navItem.getBoundingClientRect();\n          const containerRect = navContainer.getBoundingClientRect();\n          const scrollRect = scrollContainer.getBoundingClientRect();\n          const centerX =\n            itemRect.left + itemRect.width / 2 - containerRect.left;\n          setLineLeft(centerX);\n\n          if (isOverflowNav) {\n            const targetScroll = computeScroll(\n              itemRect,\n              scrollRect,\n              containerRect.left,\n              navContainer.offsetWidth\n            );\n            setNavLeft(targetScroll);\n            // console.log(\"scrollContainer\", scrollContainer.scrollTo);\n\n            // scrollContainer.scrollTo({\n            //   left: targetScroll,\n            //   // behavior: \"instant\",\n            // });\n          }\n        }\n\n        if (slotItem) {\n          const slotRect = slotItem.getBoundingClientRect();\n          setTabSlotHeight(slotRect.height);\n        }\n        if (contentItem) {\n          const contentRect = contentItem.getBoundingClientRect();\n          setTabContentHeight(contentRect.height);\n        }\n        return;\n      }\n\n      // 小程序端：必须用createSelectorQuery，保留极短延迟（50ms），适配小程序DOM渲染时机\n      timerRef.current = setTimeout(() => {\n        const query = createSelectorQuery();\n        query.selectAll(\".xh-tabbar-nav-item\").boundingClientRect();\n        query.select(\".xh-tabbar-nav\").boundingClientRect(); // 导航容器（下划线定位基准）\n        query.selectAll(\".xh-tabbar-content-item\").boundingClientRect();\n        query.selectAll(\".xh-tabbar-content-slot\").boundingClientRect();\n        query.select(\".xh-tabbar-nav-scroll\").boundingClientRect(); // 滚动容器\n        query.exec(res => {\n          const [\n            navRects,\n            navContainerRect,\n            contentRects,\n            slotRects,\n            scrollRect,\n          ] = res;\n          const navContainer = navContainerRect?.node || navContainerRect;\n          // 下划线宽度+内容高度\n          if (navRects[targetIndex] && navContainer && scrollRect) {\n            const itemRect = navRects[targetIndex];\n            const containerRect = navContainerRect;\n            const centerX =\n              itemRect.left + itemRect.width / 2 - containerRect.left;\n            setLineLeft(centerX);\n\n            // 计算ScrollView滚动距离（选中项居中）\n            if (isOverflowNav) {\n              const targetScroll = computeScroll(\n                itemRect,\n                scrollRect,\n                navContainerRect.left,\n                navContainerRect.width\n              );\n              setNavLeft(targetScroll);\n            }\n          }\n          // 内容高度计算（保持不变）\n          if (contentRects[targetIndex]) {\n            setTabContentHeight(contentRects[targetIndex].height);\n          }\n          // Slot高度查询取[0]，因为Slot只有一个节点\n          if (slotRects[0]) {\n            setTabSlotHeight(slotRects[0].height);\n          }\n        });\n      }, 50);\n    },\n    [children, isOverflowNav]\n  );\n\n  useEffect(() => {\n    calculateTabInfo(selectIndex);\n    // 清理定时器，防止内存泄漏\n    return () => {\n      if (timerRef.current) clearTimeout(timerRef.current);\n    };\n  }, [selectIndex, calculateTabInfo]);\n\n  // 点击导航项\n  const handleClick = (index: number): void => {\n    if (index === selectIndex) return; // 点击当前选中项，不做处理\n    // 同步计算目标项位置，下划线立即更新\n    calculateTabInfo(index);\n    // 触发切换回调\n    onChange && onChange(index);\n\n    // 小程序端单独处理内容高度（H5已在calculateTabInfo中处理）\n    if (process.env.TARO_ENV === \"h5\") {\n      // 点击导航获取内容高度和slot高度\n      const query = createSelectorQuery();\n      query.selectAll(\".xh-tabbar-content-item\").boundingClientRect();\n      query.selectAll(\".xh-tabbar-content-slot\").boundingClientRect();\n      query.exec(res => {\n        if (!res[0][index]) return;\n        const height: number = res[0][index].height;\n\n        setTabContentHeight(height);\n        if (!res[1][index]) return;\n        setTabSlotHeight(res[1][index].height);\n      });\n    }\n  };\n\n  // 下划线\n  function renderLine(): ReactElement | null {\n    return (\n      <div\n        className=\"xh-tabbar-nav-line\"\n        style={{\n          background: `${lineColor}`,\n          transform: `translateX(${lineLeft}px) translate(-50%, -50%)`,\n          WebkitTransform: `translateX(${lineLeft}px) translate(-50%, -50%)`,\n          transition: \"transform 0.3s ease\", // 小程序端动画过渡\n        }}\n      />\n    );\n  }\n\n  // 导航栏\n  function renderNav() {\n    return (\n      <ScrollView\n        scrollX\n        scrollLeft={navLeft}\n        className=\"xh-tabbar-nav-scroll\"\n        ref={navScrollRef}\n        scrollWithAnimation={isOverflowNav}\n        scrollAnchoring={isOverflowNav}\n      >\n        <View\n          className=\"xh-tabbar-nav\"\n          ref={navContainerRef}\n          style={{ width: isOverflowNav ? \"fit-content\" : \"100%\" }}\n        >\n          {children.map((child, index) => (\n            <View\n              key={index}\n              data-index={index}\n              // @ts-ignore\n              dataTrackId={\n                child.props.dataTrackId || `xh-tabbar-nav-item-${index}`\n              }\n              ref={el => (itemNavRef.current[index] = el)}\n              className={classNames(\"xh-tabbar-nav-item\", {\n                \"more-item\": isOverflowNav,\n              })}\n              style={{\n                color:\n                  selectIndex === index ? titleActiveColor : titleInctiveColor,\n                flex: isOverflowNav ? \"none\" : \"1\",\n              }}\n              onClick={() => handleClick(index)}\n            >\n              {child.props.TabItemComponent || child.props.title}\n            </View>\n          ))}\n          {renderLine()}\n        </View>\n      </ScrollView>\n    );\n  }\n\n  return (\n    <View className=\"xh-tabbar\">\n      {renderNav()}\n      <View\n        className=\"xh-tabbar-content\"\n        style={{\n          width: `${children.length * 100}%`,\n          height:\n            tabContentHeight + tabSlotHeight\n              ? `${tabContentHeight + tabSlotHeight}px`\n              : \"auto\",\n        }}\n      >\n        {content && (\n          <View className=\"xh-tabbar-content-slot\" ref={itemSlotRef}>\n            {content}\n          </View>\n        )}\n        {children.map((child, index) => (\n          <View\n            key={index}\n            ref={el => (itemContentRef.current[index] = el)}\n            className={classNames(\"xh-tabbar-content-item\", {\n              \"xh-tabbar-content-item-dispaly\": selectIndex !== index,\n              \"xh-tabbar-content-item-active\": selectIndex === index,\n            })}\n          >\n            {child.props.children}\n          </View>\n        ))}\n      </View>\n    </View>\n  );\n};\n\nXHTabs.Item = Item;\n\nexport default XHTabs;\nexport const TabItem = Item;\n"],"names":["XHTabs","props","_a","children","_b","lineColor","_c","titleActiveColor","_d","titleInctiveColor","onChange","content","_e","selectIndex","_f","isOverflowNav","_g","__read","useState","tabContentHeight","setTabContentHeight","_h","tabSlotHeight","setTabSlotHeight","_j","lineLeft","setLineLeft","_k","navLeft","setNavLeft","itemNavRef","useRef","itemContentRef","itemSlotRef","navScrollRef","navContainerRef","timerRef","computeScroll","itemRect","scrollRect","containerLeft","containerWidth","targetScroll","left","width","maxScroll","Math","max","min","calculateTabInfo","useCallback","targetIndex","validChildren","filter","Boolean","length","process","env","TARO_ENV","current","setTimeout","query","createSelectorQuery","selectAll","boundingClientRect","select","exec","res","navRects","navContainerRect","contentRects","slotRects","navContainer","node","containerRect","centerX","height","navItem","slotItem","contentItem","parentElement","scrollContainer","getBoundingClientRect","offsetWidth","slotRect","contentRect","useEffect","clearTimeout","React","createElement","View","className","ScrollView","scrollX","scrollLeft","ref","scrollWithAnimation","scrollAnchoring","style","map","child","index","key","dataTrackId","concat","el","classNames","color","flex","onClick","handleClick","TabItemComponent","title","background","transform","WebkitTransform","transition","Item"],"mappings":"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"}
+{"version":3,"file":"Tabbar.js","sources":["../../../../src/components/Tabbar/tabbar/Tabbar.tsx"],"sourcesContent":["import React, {\n  FC,\n  ReactElement,\n  useEffect,\n  useState,\n  ReactNode,\n  useRef,\n} from \"react\";\nimport { createSelectorQuery } from \"@tarojs/taro\";\nimport { View } from \"@tarojs/components\";\nimport classNames from \"classnames\";\nimport Item from \"./TabItem\";\n\n/**\n * Tab切换\n *\n * @param children  //子组件\n * @param animated  //是否开启转场动画\n * @param selectIndex  //默认选中第几个\n * @param lineColor   //下划线颜色\n * @param titleActiveColor   //标题选中态颜色\n * @param titleInctiveColor   //标题默认态颜色\n * @param onChange   //切换回调事件\n * @param content   //item公共节点\n *\n */\n\nexport interface TabProps {\n  children: ReactElement[];\n  animated?: boolean;\n  // initIndex?: number;\n  lineColor?: string;\n  titleActiveColor?: string;\n  titleInctiveColor?: string;\n  onChange?: (index: number) => void;\n  content?: string | ReactNode;\n  selectIndex: number;\n}\n\nexport interface TabsComponent<P = {}> extends FC<P> {\n  Item: typeof Item;\n}\n\nconst XHTabs: TabsComponent<TabProps> = props => {\n  const {\n    children = [],\n    animated = false,\n    // initIndex = 0,\n    lineColor = \"#F6AB00\",\n    titleActiveColor = \"#333\",\n    titleInctiveColor = \"#999\",\n    onChange,\n    content,\n    selectIndex = 0,\n  } = props;\n\n  // const [selectIndex, setSelectIndex] = useState(initIndex);\n  const [tabWdith, setTabWdith] = useState(0);\n  const [tabContentHeight, setTabContentHeight] = useState(0);\n  const [tabSlotHeight, setTabSlotHeight] = useState(0);\n\n  const itemNavRef = useRef<(HTMLLIElement | null)[]>([]);\n  const itemContentRef = useRef<(HTMLDivElement | null)[]>([]);\n  const itemSlotRef = useRef<(HTMLDivElement | null)[]>([]);\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      if (process.env.TARO_ENV === \"h5\") {\n        const el = itemNavRef.current[selectIndex];\n        if (el) {\n          const rect = el.getBoundingClientRect();\n          console.log(\"el\", rect);\n          setTabWdith(rect.width);\n        }\n        const elSlot = itemSlotRef.current[0];\n        if (elSlot) {\n          const rect = elSlot.getBoundingClientRect();\n          console.log(\"elSlot\", rect);\n          setTabSlotHeight(rect.height);\n        }\n\n        const elitem = itemContentRef.current[selectIndex];\n        if (elitem) {\n          const rect = elitem.getBoundingClientRect();\n          console.log(\"elitem\", rect);\n          setTabContentHeight(rect.height);\n        }\n        clearTimeout(timer);\n        return;\n      }\n\n      const query = createSelectorQuery();\n      query.selectAll(\".xh-tabbar-nav-item\").boundingClientRect();\n      query.selectAll(\".xh-tabbar-content-item\").boundingClientRect();\n      query.selectAll(\".xh-tabbar-content-slot\").boundingClientRect();\n\n      query.exec(res => {\n        if (!res[0][selectIndex]) return;\n        const width: number = res[0][selectIndex].width;\n        setTabWdith(width);\n\n        if (!res[1][selectIndex]) return;\n        setTabContentHeight(res[1][selectIndex].height);\n\n        if (!res[2][selectIndex]) return;\n        setTabSlotHeight(res[2][selectIndex].height);\n        clearTimeout(timer);\n      });\n    }, 300);\n    console.log(children.length);\n  }, [selectIndex, children]);\n\n  const handleClick = (index: number): void => {\n    // setSelectIndex(index);\n    const query = createSelectorQuery();\n    query.selectAll(\".xh-tabbar-content-item\").boundingClientRect();\n    query.selectAll(\".xh-tabbar-content-slot\").boundingClientRect();\n    query.exec(res => {\n      if (!res[0][index]) return;\n      const height: number = res[0][index].height;\n      setTabContentHeight(height);\n      if (!res[1][index]) return;\n      setTabSlotHeight(res[1][index].height);\n    });\n\n    onChange && onChange(index);\n  };\n\n  function renderLine(): ReactElement | null {\n    const left: number = tabWdith / 2 + selectIndex * tabWdith;\n    return (\n      <div\n        className={classNames(\"xh-tabbar-nav-line\", {\n          \"xh-tabbar-nav-line-active\": animated,\n        })}\n        style={{\n          background: `${lineColor}`,\n          transform: `translateX(${left}px) translate(-50%, -50%)`,\n          WebkitTransform: `translateX(${left}px) translate(-50%, -50%)`,\n        }}\n      />\n    );\n  }\n\n  return (\n    <View className=\"xh-tabbar\">\n      <View className=\"xh-tabbar-nav\">\n        {children.map((child, index) => (\n          <View\n            key={index}\n            // @ts-ignore\n            dataTrackId={\n              child.props.dataTrackId || `xh-tabbar-nav-item-${index}`\n            }\n            ref={el => (itemNavRef.current[index] = el)}\n            className=\"xh-tabbar-nav-item\"\n            style={{\n              color:\n                selectIndex === index ? titleActiveColor : titleInctiveColor,\n            }}\n            onClick={() => handleClick(index)}\n          >\n            {child.props.TabItemComponent\n              ? child.props.TabItemComponent\n              : child.props.title}\n          </View>\n        ))}\n        {renderLine()}\n      </View>\n      <View\n        className=\"xh-tabbar-content\"\n        style={{\n          width: `${children.length * 100}%`,\n          height:\n            tabContentHeight + tabSlotHeight\n              ? `${tabContentHeight + tabSlotHeight}px`\n              : \"auto\",\n        }}\n      >\n        {content && (\n          <View className=\"xh-tabbar-content-slot\" ref={itemSlotRef}>\n            {content}\n          </View>\n        )}\n        {children.map((child, index) => (\n          <View\n            key={index}\n            ref={el => (itemContentRef.current[index] = el)}\n            className={classNames(\"xh-tabbar-content-item\", {\n              \"xh-tabbar-content-item-dispaly\":\n                selectIndex !== index && !animated,\n              \"xh-tabbar-content-item-active\": selectIndex === index,\n            })}\n            style={{\n              transform: animated ? `translateX(-${selectIndex * 100}%)` : \"\",\n            }}\n          >\n            {child.props.children}\n          </View>\n        ))}\n      </View>\n    </View>\n  );\n};\n\nXHTabs.Item = Item;\n\nexport default XHTabs;\nexport const TabItem = Item;\n"],"names":["XHTabs","props","_a","children","_b","animated","_c","lineColor","_d","titleActiveColor","_e","titleInctiveColor","onChange","content","_f","selectIndex","_g","__read","useState","tabWdith","setTabWdith","_h","tabContentHeight","setTabContentHeight","_j","tabSlotHeight","setTabSlotHeight","itemNavRef","useRef","itemContentRef","itemSlotRef","useEffect","timer","setTimeout","process","env","TARO_ENV","query","createSelectorQuery","selectAll","boundingClientRect","exec","res","width","height","clearTimeout","el","current","rect","getBoundingClientRect","elSlot","elitem","left","React","createElement","View","className","map","child","index","key","dataTrackId","concat","ref","style","color","onClick","handleClick","TabItemComponent","title","classNames","background","transform","WebkitTransform","length","Item"],"mappings":"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"}