fix: fix spelling errors

Tencent · Jul 17, 2024 · e82595e · e82595e
1 parent 30556f6
commit e82595e
Show file tree

Hide file tree

Showing 13 changed files with 71 additions and 52 deletions.
diff --git a/site/plugin-tdoc/md-to-react.js b/site/plugin-tdoc/md-to-react.js
@@ -79,13 +79,14 @@ export default function mdToReact(options) {
       return (
         <>
           ${
-            mdSegment.tdDocHeader ?
-              `<td-doc-header
+            mdSegment.tdDocHeader
+              ? `<td-doc-header
                 slot="doc-header"
                 ref={tdDocHeader}
                 spline="${mdSegment.spline}"
                 platform="mobile"
-              ></td-doc-header>` : ''
+              ></td-doc-header>`
+              : ''
           }
           {
             isComponent ? (
@@ -95,15 +96,26 @@ export default function mdToReact(options) {
                   ${mdSegment.demoMd.replace(/class=/g, 'className=')}
 
                   <td-doc-phone ref={tdDocPhone}>
-                    <iframe src="${mdSegment.mobileUrl}" frameBorder="0" width="100%" height="100%" style={{ borderRadius: '0 0 6px 6px' }}></iframe>
+                    <iframe src="${
+                      mdSegment.mobileUrl
+                    }" frameBorder="0" width="100%" height="100%" style={{ borderRadius: '0 0 6px 6px' }}></iframe>
                   </td-doc-phone>
 
-                  <td-contributors platform="mobile" framework="react" component-name="${mdSegment.componentName}" ></td-contributors>
+                  <td-contributors platform="mobile" framework="react" component-name="${
+                    mdSegment.componentName
+                  }" ></td-contributors>
                 </div>
-                <div style={isShow('api')} name="API" dangerouslySetInnerHTML={{ __html: \`${mdSegment.apiMd}\` }}></div>
-                <div style={isShow('design')} name="DESIGN" dangerouslySetInnerHTML={{ __html: \`${mdSegment.designMd}\` }}></div>
+                <div style={isShow('api')} name="API" dangerouslySetInnerHTML={{ __html: \`${
+                  mdSegment.apiMd
+                }\` }}></div>
+                <div style={isShow('design')} name="DESIGN" dangerouslySetInnerHTML={{ __html: \`${
+                  mdSegment.designMd
+                }\` }}></div>
               </>
-            ) : <div name="DOC" className="${mdSegment.docClass}">${mdSegment.docMd.replace(/class=/g, 'className=')}</div>
+            ) : <div name="DOC" className="${mdSegment.docClass}">${mdSegment.docMd.replace(
+    /class=/g,
+    'className=',
+  )}</div>
           }
           <div style={{ marginTop: 48 }}>
             <td-doc-history time="${mdSegment.lastUpdated}"></td-doc-history>
@@ -126,7 +138,7 @@ export default function mdToReact(options) {
   return { code: result.code, map: result.map };
 }
 
-const DEAULT_TABS = [
+const DEFAULT_TABS = [
   { tab: 'demo', name: '示例' },
   { tab: 'api', name: 'API' },
   { tab: 'design', name: '指南' },
@@ -145,7 +157,7 @@ function customRender({ source, file, md }) {
     description: '',
     isComponent: false,
     tdDocHeader: true,
-    tdDocTabs: DEAULT_TABS,
+    tdDocTabs: DEFAULT_TABS,
     apiFlag: /#+\s*API/i,
     docClass: '',
     lastUpdated: Math.round(fs.statSync(file).mtimeMs),
@@ -161,7 +173,7 @@ function customRender({ source, file, md }) {
 
   // fix table | render error
   demoMd = demoMd.replace(/`([^`]+)`/g, (str, codeStr) => {
-    codeStr = codeStr.replace(/"/g, '\'');
+    codeStr = codeStr.replace(/"/g, "'");
     return `<td-code text="${codeStr}"></td-code>`;
   });
 
@@ -181,10 +193,19 @@ function customRender({ source, file, md }) {
   };
 
   if (pageData.isComponent) {
-    mdSegment.demoMd = md.render.call(md, `${pageData.toc ? '[toc]\n' : ''}${demoMd.replace(/<!--[\s\S]+?-->/g, '')}`).html;
-    mdSegment.apiMd = md.render.call(md, `${pageData.toc ? '[toc]\n' : ''}${apiMd.replace(/<!--[\s\S]+?-->/g, '')}`).html;
+    mdSegment.demoMd = md.render.call(
+      md,
+      `${pageData.toc ? '[toc]\n' : ''}${demoMd.replace(/<!--[\s\S]+?-->/g, '')}`,
+    ).html;
+    mdSegment.apiMd = md.render.call(
+      md,
+      `${pageData.toc ? '[toc]\n' : ''}${apiMd.replace(/<!--[\s\S]+?-->/g, '')}`,
+    ).html;
   } else {
-    mdSegment.docMd = md.render.call(md, `${pageData.toc ? '[toc]\n' : ''}${content.replace(/<!--[\s\S]+?-->/g, '')}`).html;
+    mdSegment.docMd = md.render.call(
+      md,
+      `${pageData.toc ? '[toc]\n' : ''}${content.replace(/<!--[\s\S]+?-->/g, '')}`,
+    ).html;
   }
 
   // 移动端路由地址

diff --git a/site/plugin-tdoc/transforms.js b/site/plugin-tdoc/transforms.js
@@ -8,7 +8,7 @@ let demoCodesImports = {};
 
 export default {
   before({ source, file }) {
-    const resouceDir = path.dirname(file);
+    const resourceDir = path.dirname(file);
     const reg = file.match(/src\/([\w-]+)\/([\w-]+)\.md/);
     const name = reg && reg[1];
     demoCodesImports = {};
@@ -26,7 +26,7 @@ export default {
 
     // 替换成对应 demo 文件
     source = source.replace(/\{\{\s+(.+)\s+\}\}/g, (demoStr, demoFileName) => {
-      const demoPath = path.resolve(resouceDir, `./_example/${demoFileName}.jsx`);
+      const demoPath = path.resolve(resourceDir, `./_example/${demoFileName}.jsx`);
       if (!fs.existsSync(demoPath)) {
         console.log('\x1B[36m%s\x1B[0m', `${name} 组件需要实现 _example/${demoFileName}.jsx 示例!`);
         return '\n<h3>DEMO (🚧建设中）...</h3>';

diff --git a/site/style/vars.less b/site/style/vars.less
@@ -6,14 +6,14 @@
 @primary-color-darken-3: darken(@primary-color, (43 - 19) * 1%);
 @primary-color-darken-4: darken(@primary-color, (43 - 11) * 1%);
 
-@primary-color-ligher-1: lighten(@primary-color, (51 - 43) * 1%);
-@primary-color-ligher-2: lighten(@primary-color, (59 - 43) * 1%);
-@primary-color-ligher-3: lighten(@primary-color, (67 - 43) * 1%);
-@primary-color-ligher-4: lighten(@primary-color, (75 - 43) * 1%);
-@primary-color-ligher-5: lighten(@primary-color, (83 - 43) * 1%);
-@primary-color-ligher-6: lighten(@primary-color, (91 - 43) * 1%);
-@primary-color-ligher-7: lighten(@primary-color, (96 - 43) * 1%);
-// @primary-color-ligher-6: hsl(217, 100, 91);
+@primary-color-lighter-1: lighten(@primary-color, (51 - 43) * 1%);
+@primary-color-lighter-2: lighten(@primary-color, (59 - 43) * 1%);
+@primary-color-lighter-3: lighten(@primary-color, (67 - 43) * 1%);
+@primary-color-lighter-4: lighten(@primary-color, (75 - 43) * 1%);
+@primary-color-lighter-5: lighten(@primary-color, (83 - 43) * 1%);
+@primary-color-lighter-6: lighten(@primary-color, (91 - 43) * 1%);
+@primary-color-lighter-7: lighten(@primary-color, (96 - 43) * 1%);
+// @primary-color-lighter-6: hsl(217, 100, 91);
 
 // 状态色
 @success-color: #3ecc36;
@@ -39,10 +39,11 @@
 
 @font-size-base: 14px;
 @line-height-base: 1.5;
-@font-family:  "PingFang SC", -apple-system, "Helvetica Neue", Helvetica, BlinkMacSystemFont, "Microsoft YaHei", tahoma, Arial, "Open Sans", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;
+@font-family: 'PingFang SC', -apple-system, 'Helvetica Neue', Helvetica, BlinkMacSystemFont, 'Microsoft YaHei', tahoma,
+  Arial, 'Open Sans', 'Hiragino Sans GB', 'Heiti SC', 'WenQuanYi Micro Hei', sans-serif;
 
 /**
- * 文字部分 
+ * 文字部分
  * size 大小，line 行高， color 颜色
  */
 // 字体大小
@@ -99,7 +100,6 @@
 @shadow-level-1: 3px 3px 8px 2px rgba(0, 0, 0, 0.06);
 @shadow-level-2: 6px 6px 12px 6px rgba(0, 0, 0, 0.08);
 
-
 // border
 @border-color: #d9d9d9;
 @border-main: 1px solid @border-color;
@@ -118,7 +118,7 @@
 // layout
 @layoutMargin: 10px;
 
-// header 
+// header
 @headerHeight: 81px;
 
 // footer

diff --git a/src/input/_example/special.jsx b/src/input/_example/special.jsx
@@ -52,27 +52,25 @@ export default function Base() {
           label={'价格'}
           placeholder="0.00"
           suffix="元"
-          suffixSeperate={false}
           align="right"
           value={value4}
           onChange={(value) => {
             setValue4(value);
           }}
-          className="t-input-suffix-noseperate"
+          className="t-input-suffix-noseparate"
         />
       </CellGroup>
       <CellGroup>
         <Input
           label={'个数'}
           placeholder="请输入个数"
           suffix="个"
-          suffixSeperate={false}
           align="right"
           value={value5}
           onChange={(value) => {
             setValue5(value);
           }}
-          className="t-input-suffix-noseperate"
+          className="t-input-suffix-noseparate"
         />
       </CellGroup>
     </>

diff --git a/src/input/_example/style/index.less b/src/input/_example/style/index.less
@@ -1,4 +1,4 @@
-.t-input-suffix-noseperate {
+.t-input-suffix-noseparate {
   .t-input__wrap--suffix {
     &::after {
       border: none;

diff --git a/src/picker/PickerItem.tsx b/src/picker/PickerItem.tsx
@@ -73,7 +73,7 @@ const PickerItem: FC<PickerItemProps> = memo((props) => {
     [api, getOffsetYList],
   );
 
-  const hanldeChange = (value: number | string) => {
+  const handleChange = (value: number | string) => {
     const pickerValue = pickerContext.value?.slice(0) || [];
     pickerValue[itemIndex] = value;
     pickerContext.onChange?.(pickerValue, itemIndex);
@@ -111,12 +111,12 @@ const PickerItem: FC<PickerItemProps> = memo((props) => {
           api.start({
             to: async (next) => {
               await next({ y: nextOffsetY });
-              hanldeChange(options[nextIndex].value);
+              handleChange(options[nextIndex].value);
             },
           });
         } else {
           // 受控模式,onChange回调后等待value更新，如果不更新回退到原处
-          hanldeChange(options[nextIndex].value);
+          handleChange(options[nextIndex].value);
           setTimeout(() => {
             if (lastIndex === lastIndexRef.current) {
               api.start({ y: offsetYList[lastIndex] || 0 });

diff --git a/src/radio/_example/base.jsx b/src/radio/_example/base.jsx
@@ -2,9 +2,9 @@ import React, { useState } from 'react';
 import { Radio, RadioGroup } from 'tdesign-mobile-react';
 
 export default function Base() {
-  const [defaultVaule, setDefaultValue] = useState('idx0');
+  const [defaultValue, setDefaultValue] = useState('idx0');
   return (
-    <RadioGroup value={defaultVaule} onChange={(value) => setDefaultValue(value)}>
+    <RadioGroup value={defaultValue} onChange={(value) => setDefaultValue(value)}>
       <Radio label="单选" value="idx0"></Radio>
       <Radio label="单选" value="idx1"></Radio>
       <Radio label="单选单选单选单选单选单选单选单选单选单选单选单选单选单选单选单选单选单选" value="idx2"></Radio>

diff --git a/src/radio/_example/leftStrokeLine.jsx b/src/radio/_example/leftStrokeLine.jsx
@@ -3,11 +3,11 @@ import { Radio, RadioGroup } from 'tdesign-mobile-react';
 import { CheckIcon } from 'tdesign-icons-react';
 
 export default function Base() {
-  const [defaultVaule, setDefaultValue] = useState('idx0');
+  const [defaultValue, setDefaultValue] = useState('idx0');
   const CheckedIcon = <CheckIcon key="1" color="#0052d9" />;
   return (
     <>
-      <RadioGroup value={defaultVaule} onChange={(value) => setDefaultValue(value)}>
+      <RadioGroup value={defaultValue} onChange={(value) => setDefaultValue(value)}>
         <Radio value="idx0" label="单选" icon={[CheckedIcon]}></Radio>
         <Radio value="idx1" label="单选" icon={[CheckedIcon]}></Radio>
         <Radio

diff --git a/src/radio/_example/right.jsx b/src/radio/_example/right.jsx
@@ -2,9 +2,9 @@ import React, { useState } from 'react';
 import { Radio, RadioGroup } from 'tdesign-mobile-react';
 
 export default function () {
-  const [defaultVaule, setDefaultValue] = useState('idx0');
+  const [defaultValue, setDefaultValue] = useState('idx0');
   return (
-    <RadioGroup value={defaultVaule} onChange={setDefaultValue}>
+    <RadioGroup value={defaultValue} onChange={setDefaultValue}>
       <Radio label="单选" align="right" value="idx0"></Radio>
       <Radio label="单选" align="right" value="idx1"></Radio>
       <Radio label="单选" align="right" value="idx2"></Radio>

diff --git a/src/radio/_example/rightStrokeLine.jsx b/src/radio/_example/rightStrokeLine.jsx
@@ -3,11 +3,11 @@ import { Radio, RadioGroup } from 'tdesign-mobile-react';
 import { CheckIcon } from 'tdesign-icons-react';
 
 export default function () {
-  const [defaultVaule, setDefaultValue] = useState('idx1');
+  const [defaultValue, setDefaultValue] = useState('idx1');
   const CheckedIcon = <CheckIcon key="1" color="#0052d9" />;
 
   return (
-    <RadioGroup value={defaultVaule} onChange={setDefaultValue}>
+    <RadioGroup value={defaultValue} onChange={setDefaultValue}>
       <Radio label="单选" align="right" icon={[CheckedIcon]} value="idx1"></Radio>
       <Radio
         label="单选单选单选单选单选单选单选单选单选单选单选单选单选单选单选单选单选单选"

diff --git a/src/radio/_example/status.jsx b/src/radio/_example/status.jsx
@@ -4,38 +4,38 @@ import { Radio, RadioGroup } from 'tdesign-mobile-react';
 import TDemoBlock from '../../../site/mobile/components/DemoBlock';
 
 export default function () {
-  const defaultVaule = 'idx2';
+  const defaultValue = 'idx2';
   const icon = <CheckIcon key="1" />;
 
   return (
     <>
       <div style={{ marginTop: '10px' }}>
         <TDemoBlock>
-          <RadioGroup disabled value={defaultVaule}>
+          <RadioGroup disabled value={defaultValue}>
             <Radio label="单选" value="idx1"></Radio>
             <Radio label="单选" value="idx2"></Radio>
           </RadioGroup>
         </TDemoBlock>
       </div>
       <div style={{ marginTop: '10px' }}>
         <TDemoBlock>
-          <RadioGroup disabled value={defaultVaule}>
+          <RadioGroup disabled value={defaultValue}>
             <Radio label="单选" value="idx1" icon={[icon]}></Radio>
             <Radio label="单选" value="idx2" icon={[icon]}></Radio>
           </RadioGroup>
         </TDemoBlock>
       </div>
       <div style={{ marginTop: '10px' }}>
         <TDemoBlock>
-          <RadioGroup disabled value={defaultVaule}>
+          <RadioGroup disabled value={defaultValue}>
             <Radio label="单选" value="idx1" align="right"></Radio>
             <Radio label="单选" value="idx2" align="right"></Radio>
           </RadioGroup>
         </TDemoBlock>
       </div>
       <div style={{ marginTop: '10px' }}>
         <TDemoBlock>
-          <RadioGroup disabled value={defaultVaule}>
+          <RadioGroup disabled value={defaultValue}>
             <Radio label="单选" value="idx1" icon={[icon]} align="right"></Radio>
             <Radio label="单选" value="idx2" icon={[icon]} align="right"></Radio>
           </RadioGroup>

diff --git a/src/toast/methods.tsx b/src/toast/methods.tsx
@@ -9,10 +9,10 @@ const createToast = (props, theme?: ToastThemeListEnum) => {
   const el = document.createElement('div');
   document.body.appendChild(el);
   ReactDOM.render(<Toast {...{ ...config, theme, el }} />, el);
-  const destory = () => {
+  const destroy = () => {
     document.body.removeChild(el);
   };
-  return { destory };
+  return { destroy };
 };
 
 export default {

diff --git a/src/toast/toast.md b/src/toast/toast.md
@@ -18,4 +18,4 @@ theme | String | -- | 提示类型, 可选值：loading \| success \| fail。 |
 
 名称 | 描述
 -- | --
-destory | 主动销毁toast,需要获取toast实例
+destroy | 主动销毁toast,需要获取toast实例