diff --git a/src/form/_example/horizontal.tsx b/src/form/_example/horizontal.tsx
index 2f9754ee5..b7584ffd4 100644
--- a/src/form/_example/horizontal.tsx
+++ b/src/form/_example/horizontal.tsx
@@ -1,10 +1,153 @@
-import React, { useMemo, useRef } from 'react';
-import { Button, Form, Input, Radio, RadioGroup, Rate, Stepper, Textarea } from 'tdesign-mobile-react';
+import React, { useEffect, useMemo, useRef, useState } from 'react';
+import {
+  Button,
+  Cascader,
+  DateTimePicker,
+  Form,
+  Input,
+  Popup,
+  Radio,
+  RadioGroup,
+  Rate,
+  Stepper,
+  Textarea,
+  Upload,
+  type UploadFile,
+} from 'tdesign-mobile-react';
 import { BrowseOffIcon } from 'tdesign-icons-react';
 
 const RATE_GAP = 8;
-export default function HorizontalForm({ disabled }) {
-  const formRef = useRef(null);
+
+const action = 'https://service-bv448zsw-1257786608.gz.apigw.tencentcs.com/api/upload-demo';
+
+const initialPhoto: UploadFile[] = [
+  {
+    url: 'https://tdesign.gtimg.com/mobile/demos/example4.png',
+    name: 'uploaded1.png',
+    type: 'image',
+  },
+  {
+    url: 'https://tdesign.gtimg.com/mobile/demos/example6.png',
+    name: 'uploaded2.png',
+    type: 'image',
+  },
+];
+
+const initialData = {
+  name: '',
+  password: '',
+  gender: '',
+  birth: '',
+  place: '',
+  age: 3,
+  description: 2,
+  resume: '',
+  photo: initialPhoto,
+};
+
+const addressOptions = [
+  {
+    label: '北京市',
+    value: '110000',
+    children: [
+      {
+        value: '110100',
+        label: '北京市',
+        children: [
+          { value: '110101', label: '东城区' },
+          { value: '110102', label: '西城区' },
+          { value: '110105', label: '朝阳区' },
+          { value: '110106', label: '丰台区' },
+          { value: '110107', label: '石景山区' },
+          { value: '110108', label: '海淀区' },
+          { value: '110109', label: '门头沟区' },
+          { value: '110111', label: '房山区' },
+          { value: '110112', label: '通州区' },
+          { value: '110113', label: '顺义区' },
+          { value: '110114', label: '昌平区' },
+          { value: '110115', label: '大兴区' },
+          { value: '110116', label: '怀柔区' },
+          { value: '110117', label: '平谷区' },
+          { value: '110118', label: '密云区' },
+          { value: '110119', label: '延庆区' },
+        ],
+      },
+    ],
+  },
+  {
+    label: '天津市',
+    value: '120000',
+    children: [
+      {
+        value: '120100',
+        label: '天津市',
+        children: [
+          { value: '120101', label: '和平区' },
+          { value: '120102', label: '河东区' },
+          { value: '120103', label: '河西区' },
+          { value: '120104', label: '南开区' },
+          { value: '120105', label: '河北区' },
+          { value: '120106', label: '红桥区' },
+          { value: '120110', label: '东丽区' },
+          { value: '120111', label: '西青区' },
+          { value: '120112', label: '津南区' },
+          { value: '120113', label: '北辰区' },
+          { value: '120114', label: '武清区' },
+          { value: '120115', label: '宝坻区' },
+          { value: '120116', label: '滨海新区' },
+          { value: '120117', label: '宁河区' },
+          { value: '120118', label: '静海区' },
+          { value: '120119', label: '蓟州区' },
+        ],
+      },
+    ],
+  },
+];
+
+const onFail = ({ file, e }: any) => {
+  console.log('[onFail]', { file, e });
+};
+
+const onProgress = ({ file, percent, type, e }: any) => {
+  console.log('[onProgress]', { file, percent, type, e });
+};
+
+const onPreview = ({ file, e }: any) => {
+  console.log('[onPreview]', { file, e });
+};
+
+const onSuccess = ({ file, fileList, response, e }: any) => {
+  console.log('[onSuccess]', { file, fileList, e, response });
+};
+
+const onRemove = ({ index, file, e }: any) => {
+  console.log('[onRemove]', { index, file, e });
+};
+
+const onSelectChange = (files: UploadFile[]) => {
+  console.log('[onSelectChange]', files);
+};
+
+export default function HorizontalForm({ disabled }: { disabled?: boolean }) {
+  const [form] = Form.useForm();
+  const [birthVisible, setBirthVisible] = useState(false);
+  const [placeVisible, setPlaceVisible] = useState(false);
+  const [placeValue, setPlaceValue] = useState<string | number>('120119');
+  const birthInputRef = useRef<any>(null);
+  const placeInputRef = useRef<any>(null);
+
+  useEffect(() => {
+    if (!birthVisible) {
+      birthInputRef.current?.blur?.();
+    }
+  }, [birthVisible]);
+
+  useEffect(() => {
+    if (!placeVisible) {
+      placeInputRef.current?.blur?.();
+    }
+  }, [placeVisible]);
+
   const rules = useMemo(
     () => ({
       name: [{ validator: (val: any) => val?.length === 8, message: '只能输入8个字符英文' }],
@@ -18,55 +161,152 @@ export default function HorizontalForm({ disabled }) {
     [],
   );
 
+  const groupChangeFn = (value: any, context: any) => {
+    console.log(value, context);
+  };
+
+  const onBirthChange = (value: any) => {
+    console.log('[change]', value);
+  };
+
+  const onBirthPick = (value: any) => {
+    console.log('[pick]', value);
+  };
+
+  const onBirthCancel = () => {
+    console.log('[cancel]');
+    setBirthVisible(false);
+  };
+
+  const onBirthConfirm = (value: any) => {
+    console.log('[confirm]', value);
+    form.setFieldsValue({ birth: String(value) });
+    setBirthVisible(false);
+  };
+
+  const onPlaceChange = (value: string | number, selectedOptions: any) => {
+    setPlaceValue(value);
+    setPlaceVisible(false);
+    form.setFieldsValue({ place: selectedOptions?.map((item: any) => item.label).join('/') });
+  };
+
   const onReset = () => {
-    console.log('===onReset');
+    console.log('[onReset]');
   };
+
   const onSubmit = (e: any) => {
-    console.log('===onSubmit', e);
+    console.log('[onSubmit]', e);
   };
+
   return (
-    <Form
-      ref={formRef}
-      showErrorMessage
-      resetType="initial"
-      labelAlign="left"
-      scrollToFirstError="auto"
-      disabled={disabled}
-      rules={rules}
-      onReset={onReset}
-      onSubmit={onSubmit}
-      labelWidth="81px"
-    >
-      <Form.FormItem label="用户名" name="name" help="请输入用户名">
-        <Input borderless placeholder="请输入内容" />
-      </Form.FormItem>
-      <Form.FormItem label="密码" name="password" help="">
-        <Input borderless type="password" placeholder="请输入内容" suffixIcon={<BrowseOffIcon />} />
-      </Form.FormItem>
-      <Form.FormItem label="性别" name="gender">
-        <RadioGroup className="box" borderless>
-          <Radio block={false} name="radio" value="man" label="男" />
-          <Radio block={false} name="radio" value="woman" label="女" />
-          <Radio block={false} name="radio" value="secret" label="保密" />
-        </RadioGroup>
-      </Form.FormItem>
-      <Form.FormItem label="年限" name="age" contentAlign="left">
-        <Stepper theme="filled" />
-      </Form.FormItem>
-      <Form.FormItem label="自我评价" name="description" contentAlign="left">
-        <Rate allowHalf showText={false} gap={RATE_GAP} />
-      </Form.FormItem>
-      <Form.FormItem label="个人简介" name="resume">
-        <Textarea className="textarea" indicator maxlength={50} placeholder="请输入个人简介" />
-      </Form.FormItem>
-      <div className="button-group">
-        <Button theme="primary" type="submit" size="large">
-          提交
-        </Button>
-        <Button theme="default" variant="base" type="reset" size="large">
-          重置
-        </Button>
-      </div>
-    </Form>
+    <>
+      <Form
+        form={form}
+        initialData={initialData}
+        showErrorMessage
+        resetType="initial"
+        labelAlign="left"
+        labelWidth="81px"
+        scrollToFirstError="auto"
+        disabled={disabled}
+        rules={rules}
+        onReset={onReset}
+        onSubmit={onSubmit}
+      >
+        <Form.FormItem label="用户名" name="name" help="输入用户名">
+          <Input borderless placeholder="请输入内容" />
+        </Form.FormItem>
+        <Form.FormItem label="密码" name="password">
+          <Input borderless type="password" placeholder="请输入内容" suffixIcon={<BrowseOffIcon />} />
+        </Form.FormItem>
+        <Form.FormItem label="性别" name="gender">
+          <RadioGroup className="box" borderless onChange={groupChangeFn}>
+            <Radio block={false} name="radio" value="man" label="男" />
+            <Radio block={false} name="radio" value="women" label="女" />
+            <Radio block={false} name="radio" value="secret" label="保密" />
+          </RadioGroup>
+        </Form.FormItem>
+        <Form.FormItem arrow label="生日" name="birth" contentAlign="right">
+          <Input
+            ref={birthInputRef}
+            borderless
+            align="right"
+            readonly
+            placeholder="请输入内容"
+            onFocus={() => {
+              setBirthVisible(true);
+            }}
+          />
+        </Form.FormItem>
+        <Form.FormItem arrow label="籍贯" name="place" contentAlign="right">
+          <Input
+            ref={placeInputRef}
+            borderless
+            align="right"
+            readonly
+            placeholder="请输入内容"
+            onFocus={() => {
+              setPlaceVisible(true);
+            }}
+          />
+        </Form.FormItem>
+        <Form.FormItem label="年限" name="age" contentAlign="right">
+          <Stepper theme="filled" />
+        </Form.FormItem>
+        <Form.FormItem label="自我评价" name="description" contentAlign="right">
+          <Rate allowHalf showText={false} gap={RATE_GAP} />
+        </Form.FormItem>
+        <Form.FormItem label="个人简介" name="resume">
+          <Textarea className="textarea" indicator maxlength={50} placeholder="请输入个人简介" />
+        </Form.FormItem>
+        <Form.FormItem label="上传照片" name="photo">
+          <Upload
+            className="upload"
+            multiple
+            max={6}
+            action={action}
+            defaultFiles={initialPhoto}
+            onFail={onFail}
+            onProgress={onProgress}
+            onPreview={onPreview}
+            onSuccess={onSuccess}
+            onRemove={onRemove}
+            onSelectChange={onSelectChange}
+          />
+        </Form.FormItem>
+        <div className="button-group">
+          <Button theme="primary" type="submit" size="large">
+            提交
+          </Button>
+          <Button theme="default" variant="base" type="reset" size="large">
+            重置
+          </Button>
+        </div>
+      </Form>
+
+      <Popup visible={birthVisible} placement="bottom" onVisibleChange={(v) => setBirthVisible(v)}>
+        <DateTimePicker
+          mode="date"
+          title="选择日期"
+          start="2015-5-5"
+          format="YYYY-MM-DD"
+          onChange={onBirthChange}
+          onPick={onBirthPick}
+          onConfirm={onBirthConfirm}
+          onCancel={onBirthCancel}
+        />
+      </Popup>
+
+      <Cascader
+        title="选择地址"
+        value={placeValue}
+        visible={placeVisible}
+        options={addressOptions}
+        onChange={onPlaceChange}
+        onClose={() => {
+          setPlaceVisible(false);
+        }}
+      />
+    </>
   );
 }
diff --git a/src/form/_example/style/index.less b/src/form/_example/style/index.less
index 649dbd4da..6693e2ac1 100644
--- a/src/form/_example/style/index.less
+++ b/src/form/_example/style/index.less
@@ -32,3 +32,7 @@
   width: 100%;
   height: 100%;
 }
+
+.upload {
+  --td-upload-grid-columns: 3;
+}
diff --git a/src/form/_example/vertical.tsx b/src/form/_example/vertical.tsx
index 436dc2967..02dccc9b9 100644
--- a/src/form/_example/vertical.tsx
+++ b/src/form/_example/vertical.tsx
@@ -1,10 +1,153 @@
-import React, { useMemo, useRef } from 'react';
-import { Button, Form, Input, Radio, RadioGroup, Rate, Stepper, Textarea } from 'tdesign-mobile-react';
+import React, { useEffect, useMemo, useRef, useState } from 'react';
+import {
+  Button,
+  Cascader,
+  DateTimePicker,
+  Form,
+  Input,
+  Popup,
+  Radio,
+  RadioGroup,
+  Rate,
+  Stepper,
+  Textarea,
+  Upload,
+  type UploadFile,
+} from 'tdesign-mobile-react';
 import { BrowseOffIcon } from 'tdesign-icons-react';
 
 const RATE_GAP = 8;
-export default function VerticalForm({ disabled }) {
-  const formRef = useRef(null);
+
+const action = 'https://service-bv448zsw-1257786608.gz.apigw.tencentcs.com/api/upload-demo';
+
+const initialPhoto: UploadFile[] = [
+  {
+    url: 'https://tdesign.gtimg.com/mobile/demos/example4.png',
+    name: 'uploaded1.png',
+    type: 'image',
+  },
+  {
+    url: 'https://tdesign.gtimg.com/mobile/demos/example6.png',
+    name: 'uploaded2.png',
+    type: 'image',
+  },
+];
+
+const initialData = {
+  name: '',
+  password: '',
+  gender: '',
+  birth: '',
+  place: '',
+  age: 3,
+  description: 2,
+  resume: '',
+  photo: initialPhoto,
+};
+
+const addressOptions = [
+  {
+    label: '北京市',
+    value: '110000',
+    children: [
+      {
+        value: '110100',
+        label: '北京市',
+        children: [
+          { value: '110101', label: '东城区' },
+          { value: '110102', label: '西城区' },
+          { value: '110105', label: '朝阳区' },
+          { value: '110106', label: '丰台区' },
+          { value: '110107', label: '石景山区' },
+          { value: '110108', label: '海淀区' },
+          { value: '110109', label: '门头沟区' },
+          { value: '110111', label: '房山区' },
+          { value: '110112', label: '通州区' },
+          { value: '110113', label: '顺义区' },
+          { value: '110114', label: '昌平区' },
+          { value: '110115', label: '大兴区' },
+          { value: '110116', label: '怀柔区' },
+          { value: '110117', label: '平谷区' },
+          { value: '110118', label: '密云区' },
+          { value: '110119', label: '延庆区' },
+        ],
+      },
+    ],
+  },
+  {
+    label: '天津市',
+    value: '120000',
+    children: [
+      {
+        value: '120100',
+        label: '天津市',
+        children: [
+          { value: '120101', label: '和平区' },
+          { value: '120102', label: '河东区' },
+          { value: '120103', label: '河西区' },
+          { value: '120104', label: '南开区' },
+          { value: '120105', label: '河北区' },
+          { value: '120106', label: '红桥区' },
+          { value: '120110', label: '东丽区' },
+          { value: '120111', label: '西青区' },
+          { value: '120112', label: '津南区' },
+          { value: '120113', label: '北辰区' },
+          { value: '120114', label: '武清区' },
+          { value: '120115', label: '宝坻区' },
+          { value: '120116', label: '滨海新区' },
+          { value: '120117', label: '宁河区' },
+          { value: '120118', label: '静海区' },
+          { value: '120119', label: '蓟州区' },
+        ],
+      },
+    ],
+  },
+];
+
+const onFail = ({ file, e }: any) => {
+  console.log('[onFail]', { file, e });
+};
+
+const onProgress = ({ file, percent, type, e }: any) => {
+  console.log('[onProgress]', { file, percent, type, e });
+};
+
+const onPreview = ({ file, e }: any) => {
+  console.log('[onPreview]', { file, e });
+};
+
+const onSuccess = ({ file, fileList, response, e }: any) => {
+  console.log('[onSuccess]', { file, fileList, e, response });
+};
+
+const onRemove = ({ index, file, e }: any) => {
+  console.log('[onRemove]', { index, file, e });
+};
+
+const onSelectChange = (files: UploadFile[]) => {
+  console.log('[onSelectChange]', files);
+};
+
+export default function VerticalForm({ disabled }: { disabled?: boolean }) {
+  const [form] = Form.useForm();
+  const [birthVisible, setBirthVisible] = useState(false);
+  const [placeVisible, setPlaceVisible] = useState(false);
+  const [placeValue, setPlaceValue] = useState<string | number>('120119');
+  const birthInputRef = useRef<any>(null);
+  const placeInputRef = useRef<any>(null);
+
+  useEffect(() => {
+    if (!birthVisible) {
+      birthInputRef.current?.blur?.();
+    }
+  }, [birthVisible]);
+
+  useEffect(() => {
+    if (!placeVisible) {
+      placeInputRef.current?.blur?.();
+    }
+  }, [placeVisible]);
+
   const rules = useMemo(
     () => ({
       name: [{ validator: (val: any) => val?.length === 8, message: '只能输入8个字符英文' }],
@@ -18,18 +161,50 @@ export default function VerticalForm({ disabled }) {
     [],
   );
 
+  const groupChangeFn = (value: any, context: any) => {
+    console.log(value, context);
+  };
+
+  const onBirthChange = (value: any) => {
+    console.log('[change]', value);
+  };
+
+  const onBirthPick = (value: any) => {
+    console.log('[pick]', value);
+  };
+
+  const onBirthCancel = () => {
+    console.log('[cancel]');
+    setBirthVisible(false);
+  };
+
+  const onBirthConfirm = (value: any) => {
+    console.log('[confirm]', value);
+    form.setFieldsValue({ birth: String(value) });
+    setBirthVisible(false);
+  };
+
+  const onPlaceChange = (value: string | number, selectedOptions: any) => {
+    setPlaceValue(value);
+    setPlaceVisible(false);
+    form.setFieldsValue({ place: selectedOptions?.map((item: any) => item.label).join('/') });
+  };
+
   const onReset = () => {
-    console.log('===onReset');
+    console.log('[onReset]');
   };
+
   const onSubmit = (e: any) => {
-    console.log('===onSubmit', e);
+    console.log('[onSubmit]', e);
   };
+
   return (
     <>
       <Form
-        ref={formRef}
+        form={form}
+        initialData={initialData}
         showErrorMessage
-        resetType="initial"
+        resetType="empty"
         labelAlign="top"
         scrollToFirstError="auto"
         disabled={disabled}
@@ -37,28 +212,65 @@ export default function VerticalForm({ disabled }) {
         onReset={onReset}
         onSubmit={onSubmit}
       >
-        <Form.FormItem label="用户名" name="name" help="请输入用户名">
+        <Form.FormItem label="用户名" name="name" help="输入用户名">
           <Input borderless placeholder="请输入内容" />
         </Form.FormItem>
-        <Form.FormItem label="密码" name="password" help="">
+        <Form.FormItem label="密码" name="password">
           <Input borderless type="password" placeholder="请输入内容" suffixIcon={<BrowseOffIcon />} />
         </Form.FormItem>
         <Form.FormItem label="性别" name="gender">
-          <RadioGroup className="box" borderless>
+          <RadioGroup className="box" borderless onChange={groupChangeFn}>
             <Radio block={false} name="radio" value="man" label="男" />
-            <Radio block={false} name="radio" value="woman" label="女" />
+            <Radio block={false} name="radio" value="women" label="女" />
             <Radio block={false} name="radio" value="secret" label="保密" />
           </RadioGroup>
         </Form.FormItem>
-        <Form.FormItem label="年限" name="age" contentAlign="left">
+        <Form.FormItem arrow label="生日" name="birth">
+          <Input
+            ref={birthInputRef}
+            borderless
+            readonly
+            placeholder="请输入内容"
+            onFocus={() => {
+              setBirthVisible(true);
+            }}
+          />
+        </Form.FormItem>
+        <Form.FormItem arrow label="籍贯" name="place">
+          <Input
+            ref={placeInputRef}
+            borderless
+            readonly
+            placeholder="请输入内容"
+            onFocus={() => {
+              setPlaceVisible(true);
+            }}
+          />
+        </Form.FormItem>
+        <Form.FormItem label="年限" name="age">
           <Stepper theme="filled" />
         </Form.FormItem>
-        <Form.FormItem label="自我评价" name="description" contentAlign="left">
+        <Form.FormItem label="自我评价" name="description">
           <Rate allowHalf showText={false} gap={RATE_GAP} />
         </Form.FormItem>
         <Form.FormItem label="个人简介" name="resume">
           <Textarea className="textarea" indicator maxlength={50} placeholder="请输入个人简介" />
         </Form.FormItem>
+        <Form.FormItem label="上传照片" name="photo">
+          <Upload
+            className="upload"
+            multiple
+            max={8}
+            action={action}
+            defaultFiles={initialPhoto}
+            onFail={onFail}
+            onProgress={onProgress}
+            onPreview={onPreview}
+            onSuccess={onSuccess}
+            onRemove={onRemove}
+            onSelectChange={onSelectChange}
+          />
+        </Form.FormItem>
         <div className="button-group">
           <Button theme="primary" type="submit" size="large">
             提交
@@ -68,6 +280,30 @@ export default function VerticalForm({ disabled }) {
           </Button>
         </div>
       </Form>
+
+      <Popup visible={birthVisible} placement="bottom" onVisibleChange={(v) => setBirthVisible(v)}>
+        <DateTimePicker
+          mode="date"
+          title="选择日期"
+          start="2015-5-5"
+          format="YYYY-MM-DD"
+          onChange={onBirthChange}
+          onPick={onBirthPick}
+          onConfirm={onBirthConfirm}
+          onCancel={onBirthCancel}
+        />
+      </Popup>
+
+      <Cascader
+        title="选择地址"
+        value={placeValue}
+        visible={placeVisible}
+        options={addressOptions}
+        onChange={onPlaceChange}
+        onClose={() => {
+          setPlaceVisible(false);
+        }}
+      />
     </>
   );
 }
diff --git a/test/snap/__snapshots__/csr.test.jsx.snap b/test/snap/__snapshots__/csr.test.jsx.snap
index b4af96562..801550a8e 100644
--- a/test/snap/__snapshots__/csr.test.jsx.snap
+++ b/test/snap/__snapshots__/csr.test.jsx.snap
@@ -118,7 +118,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/align.tsx 1`] =
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-bookmark-instance-_r_135_-overlap-fill1"
+                        id="t-icon-bookmark-instance-_r_149_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -149,7 +149,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/align.tsx 1`] =
                         d="M5 4H19V21L12 16L5 21V4Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-bookmark-instance-_r_135_-overlap-fill1)"
+                        mask="url(#t-icon-bookmark-instance-_r_149_-overlap-fill1)"
                       />
                       <path
                         d="M5 4H19V21L12 16L5 21V4Z"
@@ -195,7 +195,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/align.tsx 1`] =
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-pin-instance-_r_136_-overlap-fill1"
+                        id="t-icon-pin-instance-_r_14a_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -226,7 +226,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/align.tsx 1`] =
                         d="M21.962 6.28235L17.7197 2.04004L9.94034 8.39867L7.81896 6.27728L3.57422 10.522L13.4737 20.4215L17.7185 16.1768L15.5972 14.0555L21.962 6.28235Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-pin-instance-_r_136_-overlap-fill1)"
+                        mask="url(#t-icon-pin-instance-_r_14a_-overlap-fill1)"
                       />
                       <path
                         d="M2.16016 21.8358L8.52412 15.4718M17.7197 2.04004L21.9621 6.28235L15.5973 14.0555L17.7185 16.1768L13.4738 20.4215L3.57431 10.522L7.81905 6.27728L9.94043 8.39867L17.7197 2.04004Z"
@@ -404,7 +404,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/align.tsx 1`] =
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-bookmark-instance-_r_139_-overlap-fill1"
+                        id="t-icon-bookmark-instance-_r_14d_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -435,7 +435,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/align.tsx 1`] =
                         d="M5 4H19V21L12 16L5 21V4Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-bookmark-instance-_r_139_-overlap-fill1)"
+                        mask="url(#t-icon-bookmark-instance-_r_14d_-overlap-fill1)"
                       />
                       <path
                         d="M5 4H19V21L12 16L5 21V4Z"
@@ -481,7 +481,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/align.tsx 1`] =
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-pin-instance-_r_13a_-overlap-fill1"
+                        id="t-icon-pin-instance-_r_14e_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -512,7 +512,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/align.tsx 1`] =
                         d="M21.962 6.28235L17.7197 2.04004L9.94034 8.39867L7.81896 6.27728L3.57422 10.522L13.4737 20.4215L17.7185 16.1768L15.5972 14.0555L21.962 6.28235Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-pin-instance-_r_13a_-overlap-fill1)"
+                        mask="url(#t-icon-pin-instance-_r_14e_-overlap-fill1)"
                       />
                       <path
                         d="M2.16016 21.8358L8.52412 15.4718M17.7197 2.04004L21.9621 6.28235L15.5973 14.0555L17.7185 16.1768L13.4738 20.4215L3.57431 10.522L7.81905 6.27728L9.94043 8.39867L17.7197 2.04004Z"
@@ -920,7 +920,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-share-instance-_r_12i_-overlap-fill1"
+                              id="t-icon-share-instance-_r_13m_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -949,7 +949,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           >
                             <g
                               id="fill1"
-                              mask="url(#t-icon-share-instance-_r_12i_-overlap-fill1)"
+                              mask="url(#t-icon-share-instance-_r_13m_-overlap-fill1)"
                             >
                               <path
                                 d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"
@@ -1009,7 +1009,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-star-instance-_r_12j_-overlap-fill1"
+                              id="t-icon-star-instance-_r_13n_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -1040,7 +1040,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                               d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-star-instance-_r_12j_-overlap-fill1)"
+                              mask="url(#t-icon-star-instance-_r_13n_-overlap-fill1)"
                             />
                             <path
                               d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -1131,7 +1131,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-edit-1-instance-_r_12l_-overlap-fill1"
+                              id="t-icon-edit-1-instance-_r_13p_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -1155,7 +1155,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                             </mask>
                             <mask
                               height="24"
-                              id="t-icon-edit-1-instance-_r_12l_-overlap-fill2"
+                              id="t-icon-edit-1-instance-_r_13p_-overlap-fill2"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -1185,13 +1185,13 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                               d="M3.0001 20.9999L7.5 20.9999L17.5 11L13 6.5L3.0001 16.5L3.0001 20.9999Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-edit-1-instance-_r_12l_-overlap-fill1)"
+                              mask="url(#t-icon-edit-1-instance-_r_13p_-overlap-fill1)"
                             />
                             <path
                               d="M21.5 7L17 2.5L13 6.5L17.5 11L21.5 7Z"
                               fill="transparent"
                               id="fill2"
-                              mask="url(#t-icon-edit-1-instance-_r_12l_-overlap-fill2)"
+                              mask="url(#t-icon-edit-1-instance-_r_13p_-overlap-fill2)"
                             />
                             <path
                               d="M12.9999 6.5L3 16.5L3 20.9999L7.4999 20.9999L17.4999 11M12.9999 6.5L17.4999 11M12.9999 6.5L16.9999 2.5L21.4999 7L17.4999 11"
@@ -1520,7 +1520,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-share-instance-_r_12m_-overlap-fill1"
+                              id="t-icon-share-instance-_r_13q_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -1549,7 +1549,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           >
                             <g
                               id="fill1"
-                              mask="url(#t-icon-share-instance-_r_12m_-overlap-fill1)"
+                              mask="url(#t-icon-share-instance-_r_13q_-overlap-fill1)"
                             >
                               <path
                                 d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"
@@ -1609,7 +1609,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-star-instance-_r_12n_-overlap-fill1"
+                              id="t-icon-star-instance-_r_13r_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -1640,7 +1640,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                               d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-star-instance-_r_12n_-overlap-fill1)"
+                              mask="url(#t-icon-star-instance-_r_13r_-overlap-fill1)"
                             />
                             <path
                               d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -1731,7 +1731,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-edit-1-instance-_r_12p_-overlap-fill1"
+                              id="t-icon-edit-1-instance-_r_13t_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -1755,7 +1755,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                             </mask>
                             <mask
                               height="24"
-                              id="t-icon-edit-1-instance-_r_12p_-overlap-fill2"
+                              id="t-icon-edit-1-instance-_r_13t_-overlap-fill2"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -1785,13 +1785,13 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                               d="M3.0001 20.9999L7.5 20.9999L17.5 11L13 6.5L3.0001 16.5L3.0001 20.9999Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-edit-1-instance-_r_12p_-overlap-fill1)"
+                              mask="url(#t-icon-edit-1-instance-_r_13t_-overlap-fill1)"
                             />
                             <path
                               d="M21.5 7L17 2.5L13 6.5L17.5 11L21.5 7Z"
                               fill="transparent"
                               id="fill2"
-                              mask="url(#t-icon-edit-1-instance-_r_12p_-overlap-fill2)"
+                              mask="url(#t-icon-edit-1-instance-_r_13t_-overlap-fill2)"
                             />
                             <path
                               d="M12.9999 6.5L3 16.5L3 20.9999L7.4999 20.9999L17.4999 11M12.9999 6.5L17.4999 11M12.9999 6.5L16.9999 2.5L21.4999 7L17.4999 11"
@@ -2182,7 +2182,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-share-instance-_r_12q_-overlap-fill1"
+                              id="t-icon-share-instance-_r_13u_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -2211,7 +2211,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           >
                             <g
                               id="fill1"
-                              mask="url(#t-icon-share-instance-_r_12q_-overlap-fill1)"
+                              mask="url(#t-icon-share-instance-_r_13u_-overlap-fill1)"
                             >
                               <path
                                 d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"
@@ -2271,7 +2271,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-star-instance-_r_12r_-overlap-fill1"
+                              id="t-icon-star-instance-_r_13v_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -2302,7 +2302,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                               d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-star-instance-_r_12r_-overlap-fill1)"
+                              mask="url(#t-icon-star-instance-_r_13v_-overlap-fill1)"
                             />
                             <path
                               d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -2393,7 +2393,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-edit-1-instance-_r_12t_-overlap-fill1"
+                              id="t-icon-edit-1-instance-_r_141_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -2417,7 +2417,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                             </mask>
                             <mask
                               height="24"
-                              id="t-icon-edit-1-instance-_r_12t_-overlap-fill2"
+                              id="t-icon-edit-1-instance-_r_141_-overlap-fill2"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -2447,13 +2447,13 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid.tsx 1`] = `
                               d="M3.0001 20.9999L7.5 20.9999L17.5 11L13 6.5L3.0001 16.5L3.0001 20.9999Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-edit-1-instance-_r_12t_-overlap-fill1)"
+                              mask="url(#t-icon-edit-1-instance-_r_141_-overlap-fill1)"
                             />
                             <path
                               d="M21.5 7L17 2.5L13 6.5L17.5 11L21.5 7Z"
                               fill="transparent"
                               id="fill2"
-                              mask="url(#t-icon-edit-1-instance-_r_12t_-overlap-fill2)"
+                              mask="url(#t-icon-edit-1-instance-_r_141_-overlap-fill2)"
                             />
                             <path
                               d="M12.9999 6.5L3 16.5L3 20.9999L7.4999 20.9999L17.4999 11M12.9999 6.5L17.4999 11M12.9999 6.5L16.9999 2.5L21.4999 7L17.4999 11"
@@ -2803,7 +2803,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-share-instance-_r_12u_-overlap-fill1"
+                              id="t-icon-share-instance-_r_142_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -2832,7 +2832,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                           >
                             <g
                               id="fill1"
-                              mask="url(#t-icon-share-instance-_r_12u_-overlap-fill1)"
+                              mask="url(#t-icon-share-instance-_r_142_-overlap-fill1)"
                             >
                               <path
                                 d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"
@@ -2892,7 +2892,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-star-instance-_r_12v_-overlap-fill1"
+                              id="t-icon-star-instance-_r_143_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -2923,7 +2923,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                               d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-star-instance-_r_12v_-overlap-fill1)"
+                              mask="url(#t-icon-star-instance-_r_143_-overlap-fill1)"
                             />
                             <path
                               d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -3014,7 +3014,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-edit-1-instance-_r_131_-overlap-fill1"
+                              id="t-icon-edit-1-instance-_r_145_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -3038,7 +3038,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                             </mask>
                             <mask
                               height="24"
-                              id="t-icon-edit-1-instance-_r_131_-overlap-fill2"
+                              id="t-icon-edit-1-instance-_r_145_-overlap-fill2"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -3068,13 +3068,13 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                               d="M3.0001 20.9999L7.5 20.9999L17.5 11L13 6.5L3.0001 16.5L3.0001 20.9999Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-edit-1-instance-_r_131_-overlap-fill1)"
+                              mask="url(#t-icon-edit-1-instance-_r_145_-overlap-fill1)"
                             />
                             <path
                               d="M21.5 7L17 2.5L13 6.5L17.5 11L21.5 7Z"
                               fill="transparent"
                               id="fill2"
-                              mask="url(#t-icon-edit-1-instance-_r_131_-overlap-fill2)"
+                              mask="url(#t-icon-edit-1-instance-_r_145_-overlap-fill2)"
                             />
                             <path
                               d="M12.9999 6.5L3 16.5L3 20.9999L7.4999 20.9999L17.4999 11M12.9999 6.5L17.4999 11M12.9999 6.5L16.9999 2.5L21.4999 7L17.4999 11"
@@ -3130,7 +3130,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-image-instance-_r_132_-overlap-fill1"
+                              id="t-icon-image-instance-_r_146_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -3154,7 +3154,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                             </mask>
                             <mask
                               height="24"
-                              id="t-icon-image-instance-_r_132_-overlap-fill2"
+                              id="t-icon-image-instance-_r_146_-overlap-fill2"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -3186,14 +3186,14 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                               d="M3 21H20L9 10L3 16V21Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-image-instance-_r_132_-overlap-fill1)"
+                              mask="url(#t-icon-image-instance-_r_146_-overlap-fill1)"
                             />
                             <circle
                               cx="15.75"
                               cy="8.25"
                               fill="transparent"
                               id="fill2"
-                              mask="url(#t-icon-image-instance-_r_132_-overlap-fill2)"
+                              mask="url(#t-icon-image-instance-_r_146_-overlap-fill2)"
                               r="2"
                             />
                             <path
@@ -3244,7 +3244,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-image-instance-_r_133_-overlap-fill1"
+                              id="t-icon-image-instance-_r_147_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -3268,7 +3268,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                             </mask>
                             <mask
                               height="24"
-                              id="t-icon-image-instance-_r_133_-overlap-fill2"
+                              id="t-icon-image-instance-_r_147_-overlap-fill2"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -3300,14 +3300,14 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/grid-multiple.ts
                               d="M3 21H20L9 10L3 16V21Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-image-instance-_r_133_-overlap-fill1)"
+                              mask="url(#t-icon-image-instance-_r_147_-overlap-fill1)"
                             />
                             <circle
                               cx="15.75"
                               cy="8.25"
                               fill="transparent"
                               id="fill2"
-                              mask="url(#t-icon-image-instance-_r_133_-overlap-fill2)"
+                              mask="url(#t-icon-image-instance-_r_147_-overlap-fill2)"
                               r="2"
                             />
                             <path
@@ -3796,7 +3796,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-bookmark-instance-_r_11h_-overlap-fill1"
+                              id="t-icon-bookmark-instance-_r_12l_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -3827,7 +3827,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                               d="M5 4H19V21L12 16L5 21V4Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-bookmark-instance-_r_11h_-overlap-fill1)"
+                              mask="url(#t-icon-bookmark-instance-_r_12l_-overlap-fill1)"
                             />
                             <path
                               d="M5 4H19V21L12 16L5 21V4Z"
@@ -3873,7 +3873,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-pin-instance-_r_11i_-overlap-fill1"
+                              id="t-icon-pin-instance-_r_12m_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -3904,7 +3904,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                               d="M21.962 6.28235L17.7197 2.04004L9.94034 8.39867L7.81896 6.27728L3.57422 10.522L13.4737 20.4215L17.7185 16.1768L15.5972 14.0555L21.962 6.28235Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-pin-instance-_r_11i_-overlap-fill1)"
+                              mask="url(#t-icon-pin-instance-_r_12m_-overlap-fill1)"
                             />
                             <path
                               d="M2.16016 21.8358L8.52412 15.4718M17.7197 2.04004L21.9621 6.28235L15.5973 14.0555L17.7185 16.1768L13.4738 20.4215L3.57431 10.522L7.81905 6.27728L9.94043 8.39867L17.7197 2.04004Z"
@@ -4510,7 +4510,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-share-instance-_r_11k_-overlap-fill1"
+                                    id="t-icon-share-instance-_r_12o_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -4539,7 +4539,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 >
                                   <g
                                     id="fill1"
-                                    mask="url(#t-icon-share-instance-_r_11k_-overlap-fill1)"
+                                    mask="url(#t-icon-share-instance-_r_12o_-overlap-fill1)"
                                   >
                                     <path
                                       d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"
@@ -4599,7 +4599,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-star-instance-_r_11l_-overlap-fill1"
+                                    id="t-icon-star-instance-_r_12p_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -4630,7 +4630,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-star-instance-_r_11l_-overlap-fill1)"
+                                    mask="url(#t-icon-star-instance-_r_12p_-overlap-fill1)"
                                   />
                                   <path
                                     d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -4721,7 +4721,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-edit-1-instance-_r_11n_-overlap-fill1"
+                                    id="t-icon-edit-1-instance-_r_12r_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -4745,7 +4745,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                   </mask>
                                   <mask
                                     height="24"
-                                    id="t-icon-edit-1-instance-_r_11n_-overlap-fill2"
+                                    id="t-icon-edit-1-instance-_r_12r_-overlap-fill2"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -4775,13 +4775,13 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M3.0001 20.9999L7.5 20.9999L17.5 11L13 6.5L3.0001 16.5L3.0001 20.9999Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-edit-1-instance-_r_11n_-overlap-fill1)"
+                                    mask="url(#t-icon-edit-1-instance-_r_12r_-overlap-fill1)"
                                   />
                                   <path
                                     d="M21.5 7L17 2.5L13 6.5L17.5 11L21.5 7Z"
                                     fill="transparent"
                                     id="fill2"
-                                    mask="url(#t-icon-edit-1-instance-_r_11n_-overlap-fill2)"
+                                    mask="url(#t-icon-edit-1-instance-_r_12r_-overlap-fill2)"
                                   />
                                   <path
                                     d="M12.9999 6.5L3 16.5L3 20.9999L7.4999 20.9999L17.4999 11M12.9999 6.5L17.4999 11M12.9999 6.5L16.9999 2.5L21.4999 7L17.4999 11"
@@ -5110,7 +5110,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-share-instance-_r_11o_-overlap-fill1"
+                                    id="t-icon-share-instance-_r_12s_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -5139,7 +5139,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 >
                                   <g
                                     id="fill1"
-                                    mask="url(#t-icon-share-instance-_r_11o_-overlap-fill1)"
+                                    mask="url(#t-icon-share-instance-_r_12s_-overlap-fill1)"
                                   >
                                     <path
                                       d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"
@@ -5199,7 +5199,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-star-instance-_r_11p_-overlap-fill1"
+                                    id="t-icon-star-instance-_r_12t_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -5230,7 +5230,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-star-instance-_r_11p_-overlap-fill1)"
+                                    mask="url(#t-icon-star-instance-_r_12t_-overlap-fill1)"
                                   />
                                   <path
                                     d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -5321,7 +5321,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-edit-1-instance-_r_11r_-overlap-fill1"
+                                    id="t-icon-edit-1-instance-_r_12v_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -5345,7 +5345,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                   </mask>
                                   <mask
                                     height="24"
-                                    id="t-icon-edit-1-instance-_r_11r_-overlap-fill2"
+                                    id="t-icon-edit-1-instance-_r_12v_-overlap-fill2"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -5375,13 +5375,13 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M3.0001 20.9999L7.5 20.9999L17.5 11L13 6.5L3.0001 16.5L3.0001 20.9999Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-edit-1-instance-_r_11r_-overlap-fill1)"
+                                    mask="url(#t-icon-edit-1-instance-_r_12v_-overlap-fill1)"
                                   />
                                   <path
                                     d="M21.5 7L17 2.5L13 6.5L17.5 11L21.5 7Z"
                                     fill="transparent"
                                     id="fill2"
-                                    mask="url(#t-icon-edit-1-instance-_r_11r_-overlap-fill2)"
+                                    mask="url(#t-icon-edit-1-instance-_r_12v_-overlap-fill2)"
                                   />
                                   <path
                                     d="M12.9999 6.5L3 16.5L3 20.9999L7.4999 20.9999L17.4999 11M12.9999 6.5L17.4999 11M12.9999 6.5L16.9999 2.5L21.4999 7L17.4999 11"
@@ -5772,7 +5772,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-share-instance-_r_11s_-overlap-fill1"
+                                    id="t-icon-share-instance-_r_130_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -5801,7 +5801,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 >
                                   <g
                                     id="fill1"
-                                    mask="url(#t-icon-share-instance-_r_11s_-overlap-fill1)"
+                                    mask="url(#t-icon-share-instance-_r_130_-overlap-fill1)"
                                   >
                                     <path
                                       d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"
@@ -5861,7 +5861,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-star-instance-_r_11t_-overlap-fill1"
+                                    id="t-icon-star-instance-_r_131_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -5892,7 +5892,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-star-instance-_r_11t_-overlap-fill1)"
+                                    mask="url(#t-icon-star-instance-_r_131_-overlap-fill1)"
                                   />
                                   <path
                                     d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -5983,7 +5983,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-edit-1-instance-_r_11v_-overlap-fill1"
+                                    id="t-icon-edit-1-instance-_r_133_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6007,7 +6007,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                   </mask>
                                   <mask
                                     height="24"
-                                    id="t-icon-edit-1-instance-_r_11v_-overlap-fill2"
+                                    id="t-icon-edit-1-instance-_r_133_-overlap-fill2"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6037,13 +6037,13 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M3.0001 20.9999L7.5 20.9999L17.5 11L13 6.5L3.0001 16.5L3.0001 20.9999Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-edit-1-instance-_r_11v_-overlap-fill1)"
+                                    mask="url(#t-icon-edit-1-instance-_r_133_-overlap-fill1)"
                                   />
                                   <path
                                     d="M21.5 7L17 2.5L13 6.5L17.5 11L21.5 7Z"
                                     fill="transparent"
                                     id="fill2"
-                                    mask="url(#t-icon-edit-1-instance-_r_11v_-overlap-fill2)"
+                                    mask="url(#t-icon-edit-1-instance-_r_133_-overlap-fill2)"
                                   />
                                   <path
                                     d="M12.9999 6.5L3 16.5L3 20.9999L7.4999 20.9999L17.4999 11M12.9999 6.5L17.4999 11M12.9999 6.5L16.9999 2.5L21.4999 7L17.4999 11"
@@ -6388,7 +6388,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-share-instance-_r_120_-overlap-fill1"
+                                    id="t-icon-share-instance-_r_134_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6417,7 +6417,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 >
                                   <g
                                     id="fill1"
-                                    mask="url(#t-icon-share-instance-_r_120_-overlap-fill1)"
+                                    mask="url(#t-icon-share-instance-_r_134_-overlap-fill1)"
                                   >
                                     <path
                                       d="M19.4907 7.09662C20.9256 6.2682 21.4172 4.43343 20.5888 2.99855C19.7604 1.56367 17.9256 1.07204 16.4907 1.90047C15.0559 2.7289 14.5642 4.56367 15.3927 5.99855C16.2211 7.43342 18.0559 7.92505 19.4907 7.09662Z"
@@ -6477,7 +6477,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-star-instance-_r_121_-overlap-fill1"
+                                    id="t-icon-star-instance-_r_135_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6508,7 +6508,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-star-instance-_r_121_-overlap-fill1)"
+                                    mask="url(#t-icon-star-instance-_r_135_-overlap-fill1)"
                                   />
                                   <path
                                     d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -6599,7 +6599,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-edit-1-instance-_r_123_-overlap-fill1"
+                                    id="t-icon-edit-1-instance-_r_137_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6623,7 +6623,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                   </mask>
                                   <mask
                                     height="24"
-                                    id="t-icon-edit-1-instance-_r_123_-overlap-fill2"
+                                    id="t-icon-edit-1-instance-_r_137_-overlap-fill2"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6653,13 +6653,13 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M3.0001 20.9999L7.5 20.9999L17.5 11L13 6.5L3.0001 16.5L3.0001 20.9999Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-edit-1-instance-_r_123_-overlap-fill1)"
+                                    mask="url(#t-icon-edit-1-instance-_r_137_-overlap-fill1)"
                                   />
                                   <path
                                     d="M21.5 7L17 2.5L13 6.5L17.5 11L21.5 7Z"
                                     fill="transparent"
                                     id="fill2"
-                                    mask="url(#t-icon-edit-1-instance-_r_123_-overlap-fill2)"
+                                    mask="url(#t-icon-edit-1-instance-_r_137_-overlap-fill2)"
                                   />
                                   <path
                                     d="M12.9999 6.5L3 16.5L3 20.9999L7.4999 20.9999L17.4999 11M12.9999 6.5L17.4999 11M12.9999 6.5L16.9999 2.5L21.4999 7L17.4999 11"
@@ -6715,7 +6715,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-image-instance-_r_124_-overlap-fill1"
+                                    id="t-icon-image-instance-_r_138_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6739,7 +6739,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                   </mask>
                                   <mask
                                     height="24"
-                                    id="t-icon-image-instance-_r_124_-overlap-fill2"
+                                    id="t-icon-image-instance-_r_138_-overlap-fill2"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6771,14 +6771,14 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M3 21H20L9 10L3 16V21Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-image-instance-_r_124_-overlap-fill1)"
+                                    mask="url(#t-icon-image-instance-_r_138_-overlap-fill1)"
                                   />
                                   <circle
                                     cx="15.75"
                                     cy="8.25"
                                     fill="transparent"
                                     id="fill2"
-                                    mask="url(#t-icon-image-instance-_r_124_-overlap-fill2)"
+                                    mask="url(#t-icon-image-instance-_r_138_-overlap-fill2)"
                                     r="2"
                                   />
                                   <path
@@ -6829,7 +6829,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                 <defs>
                                   <mask
                                     height="24"
-                                    id="t-icon-image-instance-_r_125_-overlap-fill1"
+                                    id="t-icon-image-instance-_r_139_-overlap-fill1"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6853,7 +6853,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                   </mask>
                                   <mask
                                     height="24"
-                                    id="t-icon-image-instance-_r_125_-overlap-fill2"
+                                    id="t-icon-image-instance-_r_139_-overlap-fill2"
                                     mask-type="luminance"
                                     maskContentUnits="userSpaceOnUse"
                                     maskUnits="userSpaceOnUse"
@@ -6885,14 +6885,14 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                                     d="M3 21H20L9 10L3 16V21Z"
                                     fill="transparent"
                                     id="fill1"
-                                    mask="url(#t-icon-image-instance-_r_125_-overlap-fill1)"
+                                    mask="url(#t-icon-image-instance-_r_139_-overlap-fill1)"
                                   />
                                   <circle
                                     cx="15.75"
                                     cy="8.25"
                                     fill="transparent"
                                     id="fill2"
-                                    mask="url(#t-icon-image-instance-_r_125_-overlap-fill2)"
+                                    mask="url(#t-icon-image-instance-_r_139_-overlap-fill2)"
                                     r="2"
                                   />
                                   <path
@@ -7090,7 +7090,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-bookmark-instance-_r_127_-overlap-fill1"
+                              id="t-icon-bookmark-instance-_r_13b_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -7121,7 +7121,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                               d="M5 4H19V21L12 16L5 21V4Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-bookmark-instance-_r_127_-overlap-fill1)"
+                              mask="url(#t-icon-bookmark-instance-_r_13b_-overlap-fill1)"
                             />
                             <path
                               d="M5 4H19V21L12 16L5 21V4Z"
@@ -7168,7 +7168,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-pin-instance-_r_128_-overlap-fill1"
+                              id="t-icon-pin-instance-_r_13c_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -7199,7 +7199,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                               d="M21.962 6.28235L17.7197 2.04004L9.94034 8.39867L7.81896 6.27728L3.57422 10.522L13.4737 20.4215L17.7185 16.1768L15.5972 14.0555L21.962 6.28235Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-pin-instance-_r_128_-overlap-fill1)"
+                              mask="url(#t-icon-pin-instance-_r_13c_-overlap-fill1)"
                             />
                             <path
                               d="M2.16016 21.8358L8.52412 15.4718M17.7197 2.04004L21.9621 6.28235L15.5973 14.0555L17.7185 16.1768L13.4738 20.4215L3.57431 10.522L7.81905 6.27728L9.94043 8.39867L17.7197 2.04004Z"
@@ -7431,7 +7431,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-bookmark-instance-_r_12b_-overlap-fill1"
+                              id="t-icon-bookmark-instance-_r_13f_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -7462,7 +7462,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                               d="M5 4H19V21L12 16L5 21V4Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-bookmark-instance-_r_12b_-overlap-fill1)"
+                              mask="url(#t-icon-bookmark-instance-_r_13f_-overlap-fill1)"
                             />
                             <path
                               d="M5 4H19V21L12 16L5 21V4Z"
@@ -7508,7 +7508,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-pin-instance-_r_12c_-overlap-fill1"
+                              id="t-icon-pin-instance-_r_13g_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -7539,7 +7539,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                               d="M21.962 6.28235L17.7197 2.04004L9.94034 8.39867L7.81896 6.27728L3.57422 10.522L13.4737 20.4215L17.7185 16.1768L15.5972 14.0555L21.962 6.28235Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-pin-instance-_r_12c_-overlap-fill1)"
+                              mask="url(#t-icon-pin-instance-_r_13g_-overlap-fill1)"
                             />
                             <path
                               d="M2.16016 21.8358L8.52412 15.4718M17.7197 2.04004L21.9621 6.28235L15.5973 14.0555L17.7185 16.1768L13.4738 20.4215L3.57431 10.522L7.81905 6.27728L9.94043 8.39867L17.7197 2.04004Z"
@@ -7717,7 +7717,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-bookmark-instance-_r_12f_-overlap-fill1"
+                              id="t-icon-bookmark-instance-_r_13j_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -7748,7 +7748,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                               d="M5 4H19V21L12 16L5 21V4Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-bookmark-instance-_r_12f_-overlap-fill1)"
+                              mask="url(#t-icon-bookmark-instance-_r_13j_-overlap-fill1)"
                             />
                             <path
                               d="M5 4H19V21L12 16L5 21V4Z"
@@ -7794,7 +7794,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-pin-instance-_r_12g_-overlap-fill1"
+                              id="t-icon-pin-instance-_r_13k_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -7825,7 +7825,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/index.tsx 1`] =
                               d="M21.962 6.28235L17.7197 2.04004L9.94034 8.39867L7.81896 6.27728L3.57422 10.522L13.4737 20.4215L17.7185 16.1768L15.5972 14.0555L21.962 6.28235Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-pin-instance-_r_12g_-overlap-fill1)"
+                              mask="url(#t-icon-pin-instance-_r_13k_-overlap-fill1)"
                             />
                             <path
                               d="M2.16016 21.8358L8.52412 15.4718M17.7197 2.04004L21.9621 6.28235L15.5973 14.0555L17.7185 16.1768L13.4738 20.4215L3.57431 10.522L7.81905 6.27728L9.94043 8.39867L17.7197 2.04004Z"
@@ -8303,7 +8303,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/list.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-bookmark-instance-_r_11d_-overlap-fill1"
+                        id="t-icon-bookmark-instance-_r_12h_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -8334,7 +8334,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/list.tsx 1`] = `
                         d="M5 4H19V21L12 16L5 21V4Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-bookmark-instance-_r_11d_-overlap-fill1)"
+                        mask="url(#t-icon-bookmark-instance-_r_12h_-overlap-fill1)"
                       />
                       <path
                         d="M5 4H19V21L12 16L5 21V4Z"
@@ -8380,7 +8380,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/list.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-pin-instance-_r_11e_-overlap-fill1"
+                        id="t-icon-pin-instance-_r_12i_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -8411,7 +8411,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/list.tsx 1`] = `
                         d="M21.962 6.28235L17.7197 2.04004L9.94034 8.39867L7.81896 6.27728L3.57422 10.522L13.4737 20.4215L17.7185 16.1768L15.5972 14.0555L21.962 6.28235Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-pin-instance-_r_11e_-overlap-fill1)"
+                        mask="url(#t-icon-pin-instance-_r_12i_-overlap-fill1)"
                       />
                       <path
                         d="M2.16016 21.8358L8.52412 15.4718M17.7197 2.04004L21.9621 6.28235L15.5973 14.0555L17.7185 16.1768L13.4738 20.4215L3.57431 10.522L7.81905 6.27728L9.94043 8.39867L17.7197 2.04004Z"
@@ -8801,7 +8801,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/status.tsx 1`] =
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-bookmark-instance-_r_119_-overlap-fill1"
+                        id="t-icon-bookmark-instance-_r_12d_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -8832,7 +8832,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/status.tsx 1`] =
                         d="M5 4H19V21L12 16L5 21V4Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-bookmark-instance-_r_119_-overlap-fill1)"
+                        mask="url(#t-icon-bookmark-instance-_r_12d_-overlap-fill1)"
                       />
                       <path
                         d="M5 4H19V21L12 16L5 21V4Z"
@@ -8879,7 +8879,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/status.tsx 1`] =
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-pin-instance-_r_11a_-overlap-fill1"
+                        id="t-icon-pin-instance-_r_12e_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -8910,7 +8910,7 @@ exports[`csr snapshot test > csr test src/action-sheet/_example/status.tsx 1`] =
                         d="M21.962 6.28235L17.7197 2.04004L9.94034 8.39867L7.81896 6.27728L3.57422 10.522L13.4737 20.4215L17.7185 16.1768L15.5972 14.0555L21.962 6.28235Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-pin-instance-_r_11a_-overlap-fill1)"
+                        mask="url(#t-icon-pin-instance-_r_12e_-overlap-fill1)"
                       />
                       <path
                         d="M2.16016 21.8358L8.52412 15.4718M17.7197 2.04004L21.9621 6.28235L15.5973 14.0555L17.7185 16.1768L13.4738 20.4215L3.57431 10.522L7.81905 6.27728L9.94043 8.39867L17.7197 2.04004Z"
@@ -9319,7 +9319,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/action.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-user-add-instance-_r_117_-overlap-fill1"
+                        id="t-icon-user-add-instance-_r_12b_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -9350,7 +9350,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/action.tsx 1`] = `
                         d="M16 7.5C16 9.98528 13.9853 12 11.5 12C9.01472 12 7 9.98528 7 7.5C7 5.01472 9.01472 3 11.5 3C13.9853 3 16 5.01472 16 7.5Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-user-add-instance-_r_117_-overlap-fill1)"
+                        mask="url(#t-icon-user-add-instance-_r_12b_-overlap-fill1)"
                       />
                       <path
                         d="M11 15H8C5.23858 15 3 17.2386 3 20V21H11.0508M16 7.5C16 9.98528 13.9853 12 11.5 12C9.01472 12 7 9.98528 7 7.5C7 5.01472 9.01472 3 11.5 3C13.9853 3 16 5.01472 16 7.5Z"
@@ -9507,7 +9507,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/badge-avatar.tsx 1`] =
                   <defs>
                     <mask
                       height="24"
-                      id="t-icon-user-instance-_r_116_-overlap-fill1"
+                      id="t-icon-user-instance-_r_12a_-overlap-fill1"
                       mask-type="luminance"
                       maskContentUnits="userSpaceOnUse"
                       maskUnits="userSpaceOnUse"
@@ -9538,7 +9538,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/badge-avatar.tsx 1`] =
                   >
                     <g
                       id="fill1"
-                      mask="url(#t-icon-user-instance-_r_116_-overlap-fill1)"
+                      mask="url(#t-icon-user-instance-_r_12a_-overlap-fill1)"
                     >
                       <path
                         d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -9979,7 +9979,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/icon-avatar.tsx 1`] =
                   <defs>
                     <mask
                       height="24"
-                      id="t-icon-user-instance-_r_114_-overlap-fill1"
+                      id="t-icon-user-instance-_r_128_-overlap-fill1"
                       mask-type="luminance"
                       maskContentUnits="userSpaceOnUse"
                       maskUnits="userSpaceOnUse"
@@ -10010,7 +10010,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/icon-avatar.tsx 1`] =
                   >
                     <g
                       id="fill1"
-                      mask="url(#t-icon-user-instance-_r_114_-overlap-fill1)"
+                      mask="url(#t-icon-user-instance-_r_128_-overlap-fill1)"
                     >
                       <path
                         d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -10068,7 +10068,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/icon-avatar.tsx 1`] =
                   <defs>
                     <mask
                       height="24"
-                      id="t-icon-user-instance-_r_115_-overlap-fill1"
+                      id="t-icon-user-instance-_r_129_-overlap-fill1"
                       mask-type="luminance"
                       maskContentUnits="userSpaceOnUse"
                       maskUnits="userSpaceOnUse"
@@ -10099,7 +10099,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/icon-avatar.tsx 1`] =
                   >
                     <g
                       id="fill1"
-                      mask="url(#t-icon-user-instance-_r_115_-overlap-fill1)"
+                      mask="url(#t-icon-user-instance-_r_129_-overlap-fill1)"
                     >
                       <path
                         d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -10516,7 +10516,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                         <defs>
                           <mask
                             height="24"
-                            id="t-icon-user-instance-_r_10t_-overlap-fill1"
+                            id="t-icon-user-instance-_r_121_-overlap-fill1"
                             mask-type="luminance"
                             maskContentUnits="userSpaceOnUse"
                             maskUnits="userSpaceOnUse"
@@ -10547,7 +10547,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                         >
                           <g
                             id="fill1"
-                            mask="url(#t-icon-user-instance-_r_10t_-overlap-fill1)"
+                            mask="url(#t-icon-user-instance-_r_121_-overlap-fill1)"
                           >
                             <path
                               d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -10605,7 +10605,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                         <defs>
                           <mask
                             height="24"
-                            id="t-icon-user-instance-_r_10u_-overlap-fill1"
+                            id="t-icon-user-instance-_r_122_-overlap-fill1"
                             mask-type="luminance"
                             maskContentUnits="userSpaceOnUse"
                             maskUnits="userSpaceOnUse"
@@ -10636,7 +10636,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                         >
                           <g
                             id="fill1"
-                            mask="url(#t-icon-user-instance-_r_10u_-overlap-fill1)"
+                            mask="url(#t-icon-user-instance-_r_122_-overlap-fill1)"
                           >
                             <path
                               d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -10809,7 +10809,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                         <defs>
                           <mask
                             height="24"
-                            id="t-icon-user-instance-_r_10v_-overlap-fill1"
+                            id="t-icon-user-instance-_r_123_-overlap-fill1"
                             mask-type="luminance"
                             maskContentUnits="userSpaceOnUse"
                             maskUnits="userSpaceOnUse"
@@ -10840,7 +10840,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                         >
                           <g
                             id="fill1"
-                            mask="url(#t-icon-user-instance-_r_10v_-overlap-fill1)"
+                            mask="url(#t-icon-user-instance-_r_123_-overlap-fill1)"
                           >
                             <path
                               d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -11537,7 +11537,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-user-add-instance-_r_110_-overlap-fill1"
+                              id="t-icon-user-add-instance-_r_124_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -11568,7 +11568,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                               d="M16 7.5C16 9.98528 13.9853 12 11.5 12C9.01472 12 7 9.98528 7 7.5C7 5.01472 9.01472 3 11.5 3C13.9853 3 16 5.01472 16 7.5Z"
                               fill="transparent"
                               id="fill1"
-                              mask="url(#t-icon-user-add-instance-_r_110_-overlap-fill1)"
+                              mask="url(#t-icon-user-add-instance-_r_124_-overlap-fill1)"
                             />
                             <path
                               d="M11 15H8C5.23858 15 3 17.2386 3 20V21H11.0508M16 7.5C16 9.98528 13.9853 12 11.5 12C9.01472 12 7 9.98528 7 7.5C7 5.01472 9.01472 3 11.5 3C13.9853 3 16 5.01472 16 7.5Z"
@@ -11727,7 +11727,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-user-instance-_r_111_-overlap-fill1"
+                              id="t-icon-user-instance-_r_125_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -11758,7 +11758,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                           >
                             <g
                               id="fill1"
-                              mask="url(#t-icon-user-instance-_r_111_-overlap-fill1)"
+                              mask="url(#t-icon-user-instance-_r_125_-overlap-fill1)"
                             >
                               <path
                                 d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -11896,7 +11896,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-user-instance-_r_112_-overlap-fill1"
+                              id="t-icon-user-instance-_r_126_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -11927,7 +11927,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                           >
                             <g
                               id="fill1"
-                              mask="url(#t-icon-user-instance-_r_112_-overlap-fill1)"
+                              mask="url(#t-icon-user-instance-_r_126_-overlap-fill1)"
                             >
                               <path
                                 d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -12065,7 +12065,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                           <defs>
                             <mask
                               height="24"
-                              id="t-icon-user-instance-_r_113_-overlap-fill1"
+                              id="t-icon-user-instance-_r_127_-overlap-fill1"
                               mask-type="luminance"
                               maskContentUnits="userSpaceOnUse"
                               maskUnits="userSpaceOnUse"
@@ -12096,7 +12096,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/index.tsx 1`] = `
                           >
                             <g
                               id="fill1"
-                              mask="url(#t-icon-user-instance-_r_113_-overlap-fill1)"
+                              mask="url(#t-icon-user-instance-_r_127_-overlap-fill1)"
                             >
                               <path
                                 d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -12246,7 +12246,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/size.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-user-instance-_r_10q_-overlap-fill1"
+                        id="t-icon-user-instance-_r_11u_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -12277,7 +12277,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/size.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-user-instance-_r_10q_-overlap-fill1)"
+                        mask="url(#t-icon-user-instance-_r_11u_-overlap-fill1)"
                       >
                         <path
                           d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -12415,7 +12415,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/size.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-user-instance-_r_10r_-overlap-fill1"
+                        id="t-icon-user-instance-_r_11v_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -12446,7 +12446,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/size.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-user-instance-_r_10r_-overlap-fill1)"
+                        mask="url(#t-icon-user-instance-_r_11v_-overlap-fill1)"
                       >
                         <path
                           d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -12584,7 +12584,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/size.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-user-instance-_r_10s_-overlap-fill1"
+                        id="t-icon-user-instance-_r_120_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -12615,7 +12615,7 @@ exports[`csr snapshot test > csr test src/avatar/_example/size.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-user-instance-_r_10s_-overlap-fill1)"
+                        mask="url(#t-icon-user-instance-_r_120_-overlap-fill1)"
                       >
                         <path
                           d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -13010,7 +13010,7 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
           <defs>
             <mask
               height="24"
-              id="t-icon-notification-instance-_r_10n_-overlap-fill1"
+              id="t-icon-notification-instance-_r_11r_-overlap-fill1"
               mask-type="luminance"
               maskContentUnits="userSpaceOnUse"
               maskUnits="userSpaceOnUse"
@@ -13037,7 +13037,7 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
             </mask>
             <mask
               height="24"
-              id="t-icon-notification-instance-_r_10n_-overlap-fill2"
+              id="t-icon-notification-instance-_r_11r_-overlap-fill2"
               mask-type="luminance"
               maskContentUnits="userSpaceOnUse"
               maskUnits="userSpaceOnUse"
@@ -13070,13 +13070,13 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
               d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
               fill="transparent"
               id="fill1"
-              mask="url(#t-icon-notification-instance-_r_10n_-overlap-fill1)"
+              mask="url(#t-icon-notification-instance-_r_11r_-overlap-fill1)"
             />
             <path
               d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
               fill="transparent"
               id="fill2"
-              mask="url(#t-icon-notification-instance-_r_10n_-overlap-fill2)"
+              mask="url(#t-icon-notification-instance-_r_11r_-overlap-fill2)"
             />
             <g
               id="stroke1"
@@ -13177,7 +13177,7 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
           <defs>
             <mask
               height="24"
-              id="t-icon-notification-instance-_r_10o_-overlap-fill1"
+              id="t-icon-notification-instance-_r_11s_-overlap-fill1"
               mask-type="luminance"
               maskContentUnits="userSpaceOnUse"
               maskUnits="userSpaceOnUse"
@@ -13204,7 +13204,7 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
             </mask>
             <mask
               height="24"
-              id="t-icon-notification-instance-_r_10o_-overlap-fill2"
+              id="t-icon-notification-instance-_r_11s_-overlap-fill2"
               mask-type="luminance"
               maskContentUnits="userSpaceOnUse"
               maskUnits="userSpaceOnUse"
@@ -13237,13 +13237,13 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
               d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
               fill="transparent"
               id="fill1"
-              mask="url(#t-icon-notification-instance-_r_10o_-overlap-fill1)"
+              mask="url(#t-icon-notification-instance-_r_11s_-overlap-fill1)"
             />
             <path
               d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
               fill="transparent"
               id="fill2"
-              mask="url(#t-icon-notification-instance-_r_10o_-overlap-fill2)"
+              mask="url(#t-icon-notification-instance-_r_11s_-overlap-fill2)"
             />
             <g
               id="stroke1"
@@ -13330,7 +13330,7 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
             <defs>
               <mask
                 height="24"
-                id="t-icon-notification-instance-_r_10p_-overlap-fill1"
+                id="t-icon-notification-instance-_r_11t_-overlap-fill1"
                 mask-type="luminance"
                 maskContentUnits="userSpaceOnUse"
                 maskUnits="userSpaceOnUse"
@@ -13357,7 +13357,7 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
               </mask>
               <mask
                 height="24"
-                id="t-icon-notification-instance-_r_10p_-overlap-fill2"
+                id="t-icon-notification-instance-_r_11t_-overlap-fill2"
                 mask-type="luminance"
                 maskContentUnits="userSpaceOnUse"
                 maskUnits="userSpaceOnUse"
@@ -13390,13 +13390,13 @@ exports[`csr snapshot test > csr test src/badge/_example/base.tsx 1`] = `
                 d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
                 fill="transparent"
                 id="fill1"
-                mask="url(#t-icon-notification-instance-_r_10p_-overlap-fill1)"
+                mask="url(#t-icon-notification-instance-_r_11t_-overlap-fill1)"
               />
               <path
                 d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
                 fill="transparent"
                 id="fill2"
-                mask="url(#t-icon-notification-instance-_r_10p_-overlap-fill2)"
+                mask="url(#t-icon-notification-instance-_r_11t_-overlap-fill2)"
               />
               <g
                 id="stroke1"
@@ -13506,7 +13506,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                 <defs>
                   <mask
                     height="24"
-                    id="t-icon-notification-instance-_r_10f_-overlap-fill1"
+                    id="t-icon-notification-instance-_r_11j_-overlap-fill1"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -13533,7 +13533,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                   </mask>
                   <mask
                     height="24"
-                    id="t-icon-notification-instance-_r_10f_-overlap-fill2"
+                    id="t-icon-notification-instance-_r_11j_-overlap-fill2"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -13566,13 +13566,13 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                     d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
                     fill="transparent"
                     id="fill1"
-                    mask="url(#t-icon-notification-instance-_r_10f_-overlap-fill1)"
+                    mask="url(#t-icon-notification-instance-_r_11j_-overlap-fill1)"
                   />
                   <path
                     d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
                     fill="transparent"
                     id="fill2"
-                    mask="url(#t-icon-notification-instance-_r_10f_-overlap-fill2)"
+                    mask="url(#t-icon-notification-instance-_r_11j_-overlap-fill2)"
                   />
                   <g
                     id="stroke1"
@@ -13673,7 +13673,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                 <defs>
                   <mask
                     height="24"
-                    id="t-icon-notification-instance-_r_10g_-overlap-fill1"
+                    id="t-icon-notification-instance-_r_11k_-overlap-fill1"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -13700,7 +13700,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                   </mask>
                   <mask
                     height="24"
-                    id="t-icon-notification-instance-_r_10g_-overlap-fill2"
+                    id="t-icon-notification-instance-_r_11k_-overlap-fill2"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -13733,13 +13733,13 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                     d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
                     fill="transparent"
                     id="fill1"
-                    mask="url(#t-icon-notification-instance-_r_10g_-overlap-fill1)"
+                    mask="url(#t-icon-notification-instance-_r_11k_-overlap-fill1)"
                   />
                   <path
                     d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
                     fill="transparent"
                     id="fill2"
-                    mask="url(#t-icon-notification-instance-_r_10g_-overlap-fill2)"
+                    mask="url(#t-icon-notification-instance-_r_11k_-overlap-fill2)"
                   />
                   <g
                     id="stroke1"
@@ -13826,7 +13826,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                   <defs>
                     <mask
                       height="24"
-                      id="t-icon-notification-instance-_r_10h_-overlap-fill1"
+                      id="t-icon-notification-instance-_r_11l_-overlap-fill1"
                       mask-type="luminance"
                       maskContentUnits="userSpaceOnUse"
                       maskUnits="userSpaceOnUse"
@@ -13853,7 +13853,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                     </mask>
                     <mask
                       height="24"
-                      id="t-icon-notification-instance-_r_10h_-overlap-fill2"
+                      id="t-icon-notification-instance-_r_11l_-overlap-fill2"
                       mask-type="luminance"
                       maskContentUnits="userSpaceOnUse"
                       maskUnits="userSpaceOnUse"
@@ -13886,13 +13886,13 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                       d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
                       fill="transparent"
                       id="fill1"
-                      mask="url(#t-icon-notification-instance-_r_10h_-overlap-fill1)"
+                      mask="url(#t-icon-notification-instance-_r_11l_-overlap-fill1)"
                     />
                     <path
                       d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
                       fill="transparent"
                       id="fill2"
-                      mask="url(#t-icon-notification-instance-_r_10h_-overlap-fill2)"
+                      mask="url(#t-icon-notification-instance-_r_11l_-overlap-fill2)"
                     />
                     <g
                       id="stroke1"
@@ -13962,7 +13962,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                 <defs>
                   <mask
                     height="24"
-                    id="t-icon-notification-instance-_r_10i_-overlap-fill1"
+                    id="t-icon-notification-instance-_r_11m_-overlap-fill1"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -13989,7 +13989,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                   </mask>
                   <mask
                     height="24"
-                    id="t-icon-notification-instance-_r_10i_-overlap-fill2"
+                    id="t-icon-notification-instance-_r_11m_-overlap-fill2"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -14022,13 +14022,13 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                     d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
                     fill="transparent"
                     id="fill1"
-                    mask="url(#t-icon-notification-instance-_r_10i_-overlap-fill1)"
+                    mask="url(#t-icon-notification-instance-_r_11m_-overlap-fill1)"
                   />
                   <path
                     d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
                     fill="transparent"
                     id="fill2"
-                    mask="url(#t-icon-notification-instance-_r_10i_-overlap-fill2)"
+                    mask="url(#t-icon-notification-instance-_r_11m_-overlap-fill2)"
                   />
                   <g
                     id="stroke1"
@@ -14080,7 +14080,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                 <defs>
                   <mask
                     height="24"
-                    id="t-icon-notification-instance-_r_10j_-overlap-fill1"
+                    id="t-icon-notification-instance-_r_11n_-overlap-fill1"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -14107,7 +14107,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                   </mask>
                   <mask
                     height="24"
-                    id="t-icon-notification-instance-_r_10j_-overlap-fill2"
+                    id="t-icon-notification-instance-_r_11n_-overlap-fill2"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -14140,13 +14140,13 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                     d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
                     fill="transparent"
                     id="fill1"
-                    mask="url(#t-icon-notification-instance-_r_10j_-overlap-fill1)"
+                    mask="url(#t-icon-notification-instance-_r_11n_-overlap-fill1)"
                   />
                   <path
                     d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
                     fill="transparent"
                     id="fill2"
-                    mask="url(#t-icon-notification-instance-_r_10j_-overlap-fill2)"
+                    mask="url(#t-icon-notification-instance-_r_11n_-overlap-fill2)"
                   />
                   <g
                     id="stroke1"
@@ -14203,7 +14203,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                   <defs>
                     <mask
                       height="24"
-                      id="t-icon-shop-instance-_r_10k_-overlap-fill1"
+                      id="t-icon-shop-instance-_r_11o_-overlap-fill1"
                       mask-type="luminance"
                       maskContentUnits="userSpaceOnUse"
                       maskUnits="userSpaceOnUse"
@@ -14234,7 +14234,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                       d="M4 8H20V22H4V8Z"
                       fill="transparent"
                       id="fill1"
-                      mask="url(#t-icon-shop-instance-_r_10k_-overlap-fill1)"
+                      mask="url(#t-icon-shop-instance-_r_11o_-overlap-fill1)"
                     />
                     <path
                       d="M15.5 11V5.5C15.5 3.567 13.933 2 12 2C10.067 2 8.5 3.567 8.5 5.5V11M4 8H20V22H4V8Z"
@@ -14468,7 +14468,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                         <defs>
                           <mask
                             height="24"
-                            id="t-icon-user-instance-_r_10l_-overlap-fill1"
+                            id="t-icon-user-instance-_r_11p_-overlap-fill1"
                             mask-type="luminance"
                             maskContentUnits="userSpaceOnUse"
                             maskUnits="userSpaceOnUse"
@@ -14499,7 +14499,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                         >
                           <g
                             id="fill1"
-                            mask="url(#t-icon-user-instance-_r_10l_-overlap-fill1)"
+                            mask="url(#t-icon-user-instance-_r_11p_-overlap-fill1)"
                           >
                             <path
                               d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -14576,7 +14576,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                         <defs>
                           <mask
                             height="24"
-                            id="t-icon-user-instance-_r_10m_-overlap-fill1"
+                            id="t-icon-user-instance-_r_11q_-overlap-fill1"
                             mask-type="luminance"
                             maskContentUnits="userSpaceOnUse"
                             maskUnits="userSpaceOnUse"
@@ -14607,7 +14607,7 @@ exports[`csr snapshot test > csr test src/badge/_example/index.tsx 1`] = `
                         >
                           <g
                             id="fill1"
-                            mask="url(#t-icon-user-instance-_r_10m_-overlap-fill1)"
+                            mask="url(#t-icon-user-instance-_r_11q_-overlap-fill1)"
                           >
                             <path
                               d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -14692,7 +14692,7 @@ exports[`csr snapshot test > csr test src/badge/_example/size.tsx 1`] = `
                   <defs>
                     <mask
                       height="24"
-                      id="t-icon-user-instance-_r_10d_-overlap-fill1"
+                      id="t-icon-user-instance-_r_11h_-overlap-fill1"
                       mask-type="luminance"
                       maskContentUnits="userSpaceOnUse"
                       maskUnits="userSpaceOnUse"
@@ -14723,7 +14723,7 @@ exports[`csr snapshot test > csr test src/badge/_example/size.tsx 1`] = `
                   >
                     <g
                       id="fill1"
-                      mask="url(#t-icon-user-instance-_r_10d_-overlap-fill1)"
+                      mask="url(#t-icon-user-instance-_r_11h_-overlap-fill1)"
                     >
                       <path
                         d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -14800,7 +14800,7 @@ exports[`csr snapshot test > csr test src/badge/_example/size.tsx 1`] = `
                   <defs>
                     <mask
                       height="24"
-                      id="t-icon-user-instance-_r_10e_-overlap-fill1"
+                      id="t-icon-user-instance-_r_11i_-overlap-fill1"
                       mask-type="luminance"
                       maskContentUnits="userSpaceOnUse"
                       maskUnits="userSpaceOnUse"
@@ -14831,7 +14831,7 @@ exports[`csr snapshot test > csr test src/badge/_example/size.tsx 1`] = `
                   >
                     <g
                       id="fill1"
-                      mask="url(#t-icon-user-instance-_r_10e_-overlap-fill1)"
+                      mask="url(#t-icon-user-instance-_r_11i_-overlap-fill1)"
                     >
                       <path
                         d="M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z"
@@ -14901,7 +14901,7 @@ exports[`csr snapshot test > csr test src/badge/_example/theme.tsx 1`] = `
           <defs>
             <mask
               height="24"
-              id="t-icon-notification-instance-_r_10a_-overlap-fill1"
+              id="t-icon-notification-instance-_r_11e_-overlap-fill1"
               mask-type="luminance"
               maskContentUnits="userSpaceOnUse"
               maskUnits="userSpaceOnUse"
@@ -14928,7 +14928,7 @@ exports[`csr snapshot test > csr test src/badge/_example/theme.tsx 1`] = `
             </mask>
             <mask
               height="24"
-              id="t-icon-notification-instance-_r_10a_-overlap-fill2"
+              id="t-icon-notification-instance-_r_11e_-overlap-fill2"
               mask-type="luminance"
               maskContentUnits="userSpaceOnUse"
               maskUnits="userSpaceOnUse"
@@ -14961,13 +14961,13 @@ exports[`csr snapshot test > csr test src/badge/_example/theme.tsx 1`] = `
               d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
               fill="transparent"
               id="fill1"
-              mask="url(#t-icon-notification-instance-_r_10a_-overlap-fill1)"
+              mask="url(#t-icon-notification-instance-_r_11e_-overlap-fill1)"
             />
             <path
               d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
               fill="transparent"
               id="fill2"
-              mask="url(#t-icon-notification-instance-_r_10a_-overlap-fill2)"
+              mask="url(#t-icon-notification-instance-_r_11e_-overlap-fill2)"
             />
             <g
               id="stroke1"
@@ -15019,7 +15019,7 @@ exports[`csr snapshot test > csr test src/badge/_example/theme.tsx 1`] = `
           <defs>
             <mask
               height="24"
-              id="t-icon-notification-instance-_r_10b_-overlap-fill1"
+              id="t-icon-notification-instance-_r_11f_-overlap-fill1"
               mask-type="luminance"
               maskContentUnits="userSpaceOnUse"
               maskUnits="userSpaceOnUse"
@@ -15046,7 +15046,7 @@ exports[`csr snapshot test > csr test src/badge/_example/theme.tsx 1`] = `
             </mask>
             <mask
               height="24"
-              id="t-icon-notification-instance-_r_10b_-overlap-fill2"
+              id="t-icon-notification-instance-_r_11f_-overlap-fill2"
               mask-type="luminance"
               maskContentUnits="userSpaceOnUse"
               maskUnits="userSpaceOnUse"
@@ -15079,13 +15079,13 @@ exports[`csr snapshot test > csr test src/badge/_example/theme.tsx 1`] = `
               d="M3 19H21V16L19 13V8C19 4.13401 15.866 1 12 1C8.13401 1 5 4.13401 5 8V13L3 16V19Z"
               fill="transparent"
               id="fill1"
-              mask="url(#t-icon-notification-instance-_r_10b_-overlap-fill1)"
+              mask="url(#t-icon-notification-instance-_r_11f_-overlap-fill1)"
             />
             <path
               d="M12 22.5C13.933 22.5 15.5 20.933 15.5 19H8.5C8.5 20.933 10.067 22.5 12 22.5Z"
               fill="transparent"
               id="fill2"
-              mask="url(#t-icon-notification-instance-_r_10b_-overlap-fill2)"
+              mask="url(#t-icon-notification-instance-_r_11f_-overlap-fill2)"
             />
             <g
               id="stroke1"
@@ -15142,7 +15142,7 @@ exports[`csr snapshot test > csr test src/badge/_example/theme.tsx 1`] = `
             <defs>
               <mask
                 height="24"
-                id="t-icon-shop-instance-_r_10c_-overlap-fill1"
+                id="t-icon-shop-instance-_r_11g_-overlap-fill1"
                 mask-type="luminance"
                 maskContentUnits="userSpaceOnUse"
                 maskUnits="userSpaceOnUse"
@@ -15173,7 +15173,7 @@ exports[`csr snapshot test > csr test src/badge/_example/theme.tsx 1`] = `
                 d="M4 8H20V22H4V8Z"
                 fill="transparent"
                 id="fill1"
-                mask="url(#t-icon-shop-instance-_r_10c_-overlap-fill1)"
+                mask="url(#t-icon-shop-instance-_r_11g_-overlap-fill1)"
               />
               <path
                 d="M15.5 11V5.5C15.5 3.567 13.933 2 12 2C10.067 2 8.5 3.567 8.5 5.5V11M4 8H20V22H4V8Z"
@@ -15549,7 +15549,7 @@ exports[`csr snapshot test > csr test src/button/_example/icon.tsx 1`] = `
         <defs>
           <mask
             height="24"
-            id="t-icon-app-instance-_r_108_-overlap-fill1"
+            id="t-icon-app-instance-_r_11c_-overlap-fill1"
             mask-type="luminance"
             maskContentUnits="userSpaceOnUse"
             maskUnits="userSpaceOnUse"
@@ -15575,7 +15575,7 @@ exports[`csr snapshot test > csr test src/button/_example/icon.tsx 1`] = `
           </mask>
           <mask
             height="24"
-            id="t-icon-app-instance-_r_108_-overlap-fill2"
+            id="t-icon-app-instance-_r_11c_-overlap-fill2"
             mask-type="luminance"
             maskContentUnits="userSpaceOnUse"
             maskUnits="userSpaceOnUse"
@@ -15603,7 +15603,7 @@ exports[`csr snapshot test > csr test src/button/_example/icon.tsx 1`] = `
         >
           <g
             id="fill1"
-            mask="url(#t-icon-app-instance-_r_108_-overlap-fill1)"
+            mask="url(#t-icon-app-instance-_r_11c_-overlap-fill1)"
           >
             <path
               d="M3 3H10V10H3V3Z"
@@ -15622,7 +15622,7 @@ exports[`csr snapshot test > csr test src/button/_example/icon.tsx 1`] = `
             d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
             fill="transparent"
             id="fill2"
-            mask="url(#t-icon-app-instance-_r_108_-overlap-fill2)"
+            mask="url(#t-icon-app-instance-_r_11c_-overlap-fill2)"
           />
           <g
             id="stroke1"
@@ -15664,7 +15664,7 @@ exports[`csr snapshot test > csr test src/button/_example/icon.tsx 1`] = `
         <defs>
           <mask
             height="24"
-            id="t-icon-app-instance-_r_109_-overlap-fill1"
+            id="t-icon-app-instance-_r_11d_-overlap-fill1"
             mask-type="luminance"
             maskContentUnits="userSpaceOnUse"
             maskUnits="userSpaceOnUse"
@@ -15690,7 +15690,7 @@ exports[`csr snapshot test > csr test src/button/_example/icon.tsx 1`] = `
           </mask>
           <mask
             height="24"
-            id="t-icon-app-instance-_r_109_-overlap-fill2"
+            id="t-icon-app-instance-_r_11d_-overlap-fill2"
             mask-type="luminance"
             maskContentUnits="userSpaceOnUse"
             maskUnits="userSpaceOnUse"
@@ -15718,7 +15718,7 @@ exports[`csr snapshot test > csr test src/button/_example/icon.tsx 1`] = `
         >
           <g
             id="fill1"
-            mask="url(#t-icon-app-instance-_r_109_-overlap-fill1)"
+            mask="url(#t-icon-app-instance-_r_11d_-overlap-fill1)"
           >
             <path
               d="M3 3H10V10H3V3Z"
@@ -15737,7 +15737,7 @@ exports[`csr snapshot test > csr test src/button/_example/icon.tsx 1`] = `
             d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
             fill="transparent"
             id="fill2"
-            mask="url(#t-icon-app-instance-_r_109_-overlap-fill2)"
+            mask="url(#t-icon-app-instance-_r_11d_-overlap-fill2)"
           />
           <g
             id="stroke1"
@@ -15943,7 +15943,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_104_-overlap-fill1"
+                  id="t-icon-app-instance-_r_118_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -15969,7 +15969,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_104_-overlap-fill2"
+                  id="t-icon-app-instance-_r_118_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -15997,7 +15997,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_104_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_118_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -16016,7 +16016,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_104_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_118_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -16058,7 +16058,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_105_-overlap-fill1"
+                  id="t-icon-app-instance-_r_119_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -16084,7 +16084,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_105_-overlap-fill2"
+                  id="t-icon-app-instance-_r_119_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -16112,7 +16112,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_105_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_119_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -16131,7 +16131,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_105_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_119_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -16539,7 +16539,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_106_-overlap-fill1"
+                  id="t-icon-app-instance-_r_11a_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -16565,7 +16565,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_106_-overlap-fill2"
+                  id="t-icon-app-instance-_r_11a_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -16593,7 +16593,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_106_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_11a_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -16612,7 +16612,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_106_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_11a_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -16661,7 +16661,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_107_-overlap-fill1"
+                  id="t-icon-app-instance-_r_11b_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -16687,7 +16687,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_107_-overlap-fill2"
+                  id="t-icon-app-instance-_r_11b_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -16715,7 +16715,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_107_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_11b_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -16734,7 +16734,7 @@ exports[`csr snapshot test > csr test src/button/_example/index.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_107_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_11b_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -16988,7 +16988,7 @@ exports[`csr snapshot test > csr test src/button/_example/shape.tsx 1`] = `
         <defs>
           <mask
             height="24"
-            id="t-icon-app-instance-_r_102_-overlap-fill1"
+            id="t-icon-app-instance-_r_116_-overlap-fill1"
             mask-type="luminance"
             maskContentUnits="userSpaceOnUse"
             maskUnits="userSpaceOnUse"
@@ -17014,7 +17014,7 @@ exports[`csr snapshot test > csr test src/button/_example/shape.tsx 1`] = `
           </mask>
           <mask
             height="24"
-            id="t-icon-app-instance-_r_102_-overlap-fill2"
+            id="t-icon-app-instance-_r_116_-overlap-fill2"
             mask-type="luminance"
             maskContentUnits="userSpaceOnUse"
             maskUnits="userSpaceOnUse"
@@ -17042,7 +17042,7 @@ exports[`csr snapshot test > csr test src/button/_example/shape.tsx 1`] = `
         >
           <g
             id="fill1"
-            mask="url(#t-icon-app-instance-_r_102_-overlap-fill1)"
+            mask="url(#t-icon-app-instance-_r_116_-overlap-fill1)"
           >
             <path
               d="M3 3H10V10H3V3Z"
@@ -17061,7 +17061,7 @@ exports[`csr snapshot test > csr test src/button/_example/shape.tsx 1`] = `
             d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
             fill="transparent"
             id="fill2"
-            mask="url(#t-icon-app-instance-_r_102_-overlap-fill2)"
+            mask="url(#t-icon-app-instance-_r_116_-overlap-fill2)"
           />
           <g
             id="stroke1"
@@ -17110,7 +17110,7 @@ exports[`csr snapshot test > csr test src/button/_example/shape.tsx 1`] = `
         <defs>
           <mask
             height="24"
-            id="t-icon-app-instance-_r_103_-overlap-fill1"
+            id="t-icon-app-instance-_r_117_-overlap-fill1"
             mask-type="luminance"
             maskContentUnits="userSpaceOnUse"
             maskUnits="userSpaceOnUse"
@@ -17136,7 +17136,7 @@ exports[`csr snapshot test > csr test src/button/_example/shape.tsx 1`] = `
           </mask>
           <mask
             height="24"
-            id="t-icon-app-instance-_r_103_-overlap-fill2"
+            id="t-icon-app-instance-_r_117_-overlap-fill2"
             mask-type="luminance"
             maskContentUnits="userSpaceOnUse"
             maskUnits="userSpaceOnUse"
@@ -17164,7 +17164,7 @@ exports[`csr snapshot test > csr test src/button/_example/shape.tsx 1`] = `
         >
           <g
             id="fill1"
-            mask="url(#t-icon-app-instance-_r_103_-overlap-fill1)"
+            mask="url(#t-icon-app-instance-_r_117_-overlap-fill1)"
           >
             <path
               d="M3 3H10V10H3V3Z"
@@ -17183,7 +17183,7 @@ exports[`csr snapshot test > csr test src/button/_example/shape.tsx 1`] = `
             d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
             fill="transparent"
             id="fill2"
-            mask="url(#t-icon-app-instance-_r_103_-overlap-fill2)"
+            mask="url(#t-icon-app-instance-_r_117_-overlap-fill2)"
           />
           <g
             id="stroke1"
@@ -33912,7 +33912,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_sq_-overlap-fill1"
+                  id="t-icon-app-instance-_r_tu_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -33938,7 +33938,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_sq_-overlap-fill2"
+                  id="t-icon-app-instance-_r_tu_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -33966,7 +33966,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_sq_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_tu_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -33985,7 +33985,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_sq_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_tu_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -34064,7 +34064,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-service-instance-_r_ss_-overlap-fill1"
+                  id="t-icon-service-instance-_r_u0_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -34088,7 +34088,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-service-instance-_r_ss_-overlap-fill2"
+                  id="t-icon-service-instance-_r_u0_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -34116,7 +34116,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-service-instance-_r_ss_-overlap-fill1)"
+                  mask="url(#t-icon-service-instance-_r_u0_-overlap-fill1)"
                 >
                   <path
                     d="M3 12H7V18H5C3.89543 18 3 17.1734 3 16.1538V12Z"
@@ -34131,7 +34131,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
                   d="M10.25 21.5C10.25 21.0858 10.5858 20.75 11 20.75H13C13.4142 20.75 13.75 21.0858 13.75 21.5C13.75 21.9142 13.4142 22.25 13 22.25H11C10.5858 22.25 10.25 21.9142 10.25 21.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-service-instance-_r_ss_-overlap-fill2)"
+                  mask="url(#t-icon-service-instance-_r_u0_-overlap-fill2)"
                 />
                 <path
                   d="M21 12V11C21 6.02944 16.9706 2 12 2C7.02944 2 3 6.02944 3 11V12M21 12H17V18H19C20.1046 18 21 17.1734 21 16.1538V12ZM3 12H7V18H5M3 12V16.1538C3 17.1734 3.89543 18 5 18M10.25 21.5H8C6.34315 21.5 5 20.1569 5 18.5V18M10.25 21.5C10.25 21.9142 10.5858 22.25 11 22.25H13C13.4142 22.25 13.75 21.9142 13.75 21.5C13.75 21.0858 13.4142 20.75 13 20.75H11C10.5858 20.75 10.25 21.0858 10.25 21.5Z"
@@ -34201,7 +34201,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-internet-instance-_r_su_-overlap-fill1"
+                  id="t-icon-internet-instance-_r_u2_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -34238,7 +34238,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-internet-instance-_r_su_-overlap-fill2"
+                  id="t-icon-internet-instance-_r_u2_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -34270,7 +34270,7 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-internet-instance-_r_su_-overlap-stroke1"
+                  id="t-icon-internet-instance-_r_u2_-overlap-stroke1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -34301,18 +34301,18 @@ exports[`csr snapshot test > csr test src/cell/_example/group.tsx 1`] = `
                   d="M12 2C6.47715 2 2 6.47715 2 12C2 17.5229 6.47715 22 12 22C17.5228 22 22 17.5229 22 12C22 6.47715 17.5228 2 12 2Z"
                   fill="transparent"
                   id="fill1"
-                  mask="url(#t-icon-internet-instance-_r_su_-overlap-fill1)"
+                  mask="url(#t-icon-internet-instance-_r_u2_-overlap-fill1)"
                 />
                 <path
                   d="M11.4987 21.9877C11.6646 21.9959 11.8315 22 11.9994 22C12.1673 22 12.3342 21.9959 12.5 21.9877C17.113 16.2216 17.1129 7.77835 12.4999 2.01231C12.3341 2.00414 12.1672 2 11.9994 2C11.8315 2 11.6646 2.00414 11.4988 2.01231C6.88584 7.77835 6.88581 16.2216 11.4987 21.9877Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-internet-instance-_r_su_-overlap-fill2)"
+                  mask="url(#t-icon-internet-instance-_r_u2_-overlap-fill2)"
                 />
                 <path
                   d="M3 12H21M2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5229 17.5228 22 12 22C6.47715 22 2 17.5229 2 12Z"
                   id="stroke1"
-                  mask="url(#t-icon-internet-instance-_r_su_-overlap-stroke1)"
+                  mask="url(#t-icon-internet-instance-_r_u2_-overlap-stroke1)"
                   stroke="currentColor"
                   stroke-linecap="square"
                   stroke-width="2"
@@ -34674,7 +34674,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                       <defs>
                         <mask
                           height="24"
-                          id="t-icon-app-instance-_r_sb_-overlap-fill1"
+                          id="t-icon-app-instance-_r_tf_-overlap-fill1"
                           mask-type="luminance"
                           maskContentUnits="userSpaceOnUse"
                           maskUnits="userSpaceOnUse"
@@ -34700,7 +34700,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                         </mask>
                         <mask
                           height="24"
-                          id="t-icon-app-instance-_r_sb_-overlap-fill2"
+                          id="t-icon-app-instance-_r_tf_-overlap-fill2"
                           mask-type="luminance"
                           maskContentUnits="userSpaceOnUse"
                           maskUnits="userSpaceOnUse"
@@ -34728,7 +34728,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                       >
                         <g
                           id="fill1"
-                          mask="url(#t-icon-app-instance-_r_sb_-overlap-fill1)"
+                          mask="url(#t-icon-app-instance-_r_tf_-overlap-fill1)"
                         >
                           <path
                             d="M3 3H10V10H3V3Z"
@@ -34747,7 +34747,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                           d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                           fill="transparent"
                           id="fill2"
-                          mask="url(#t-icon-app-instance-_r_sb_-overlap-fill2)"
+                          mask="url(#t-icon-app-instance-_r_tf_-overlap-fill2)"
                         />
                         <g
                           id="stroke1"
@@ -35112,7 +35112,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_sh_-overlap-fill1"
+                        id="t-icon-app-instance-_r_tl_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35138,7 +35138,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_sh_-overlap-fill2"
+                        id="t-icon-app-instance-_r_tl_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35166,7 +35166,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-app-instance-_r_sh_-overlap-fill1)"
+                        mask="url(#t-icon-app-instance-_r_tl_-overlap-fill1)"
                       >
                         <path
                           d="M3 3H10V10H3V3Z"
@@ -35185,7 +35185,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                         d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-app-instance-_r_sh_-overlap-fill2)"
+                        mask="url(#t-icon-app-instance-_r_tl_-overlap-fill2)"
                       />
                       <g
                         id="stroke1"
@@ -35474,7 +35474,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_sk_-overlap-fill1"
+                        id="t-icon-app-instance-_r_to_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35500,7 +35500,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_sk_-overlap-fill2"
+                        id="t-icon-app-instance-_r_to_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35528,7 +35528,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-app-instance-_r_sk_-overlap-fill1)"
+                        mask="url(#t-icon-app-instance-_r_to_-overlap-fill1)"
                       >
                         <path
                           d="M3 3H10V10H3V3Z"
@@ -35547,7 +35547,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                         d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-app-instance-_r_sk_-overlap-fill2)"
+                        mask="url(#t-icon-app-instance-_r_to_-overlap-fill2)"
                       />
                       <g
                         id="stroke1"
@@ -35626,7 +35626,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-service-instance-_r_sm_-overlap-fill1"
+                        id="t-icon-service-instance-_r_tq_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35650,7 +35650,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-service-instance-_r_sm_-overlap-fill2"
+                        id="t-icon-service-instance-_r_tq_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35678,7 +35678,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-service-instance-_r_sm_-overlap-fill1)"
+                        mask="url(#t-icon-service-instance-_r_tq_-overlap-fill1)"
                       >
                         <path
                           d="M3 12H7V18H5C3.89543 18 3 17.1734 3 16.1538V12Z"
@@ -35693,7 +35693,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                         d="M10.25 21.5C10.25 21.0858 10.5858 20.75 11 20.75H13C13.4142 20.75 13.75 21.0858 13.75 21.5C13.75 21.9142 13.4142 22.25 13 22.25H11C10.5858 22.25 10.25 21.9142 10.25 21.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-service-instance-_r_sm_-overlap-fill2)"
+                        mask="url(#t-icon-service-instance-_r_tq_-overlap-fill2)"
                       />
                       <path
                         d="M21 12V11C21 6.02944 16.9706 2 12 2C7.02944 2 3 6.02944 3 11V12M21 12H17V18H19C20.1046 18 21 17.1734 21 16.1538V12ZM3 12H7V18H5M3 12V16.1538C3 17.1734 3.89543 18 5 18M10.25 21.5H8C6.34315 21.5 5 20.1569 5 18.5V18M10.25 21.5C10.25 21.9142 10.5858 22.25 11 22.25H13C13.4142 22.25 13.75 21.9142 13.75 21.5C13.75 21.0858 13.4142 20.75 13 20.75H11C10.5858 20.75 10.25 21.0858 10.25 21.5Z"
@@ -35763,7 +35763,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-internet-instance-_r_so_-overlap-fill1"
+                        id="t-icon-internet-instance-_r_ts_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35800,7 +35800,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-internet-instance-_r_so_-overlap-fill2"
+                        id="t-icon-internet-instance-_r_ts_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35832,7 +35832,7 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-internet-instance-_r_so_-overlap-stroke1"
+                        id="t-icon-internet-instance-_r_ts_-overlap-stroke1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -35863,18 +35863,18 @@ exports[`csr snapshot test > csr test src/cell/_example/index.tsx 1`] = `
                         d="M12 2C6.47715 2 2 6.47715 2 12C2 17.5229 6.47715 22 12 22C17.5228 22 22 17.5229 22 12C22 6.47715 17.5228 2 12 2Z"
                         fill="transparent"
                         id="fill1"
-                        mask="url(#t-icon-internet-instance-_r_so_-overlap-fill1)"
+                        mask="url(#t-icon-internet-instance-_r_ts_-overlap-fill1)"
                       />
                       <path
                         d="M11.4987 21.9877C11.6646 21.9959 11.8315 22 11.9994 22C12.1673 22 12.3342 21.9959 12.5 21.9877C17.113 16.2216 17.1129 7.77835 12.4999 2.01231C12.3341 2.00414 12.1672 2 11.9994 2C11.8315 2 11.6646 2.00414 11.4988 2.01231C6.88584 7.77835 6.88581 16.2216 11.4987 21.9877Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-internet-instance-_r_so_-overlap-fill2)"
+                        mask="url(#t-icon-internet-instance-_r_ts_-overlap-fill2)"
                       />
                       <path
                         d="M3 12H21M2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5229 17.5228 22 12 22C6.47715 22 2 17.5229 2 12Z"
                         id="stroke1"
-                        mask="url(#t-icon-internet-instance-_r_so_-overlap-stroke1)"
+                        mask="url(#t-icon-internet-instance-_r_ts_-overlap-stroke1)"
                         stroke="currentColor"
                         stroke-linecap="square"
                         stroke-width="2"
@@ -36224,7 +36224,7 @@ exports[`csr snapshot test > csr test src/cell/_example/multiple.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_s4_-overlap-fill1"
+                  id="t-icon-app-instance-_r_t8_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -36250,7 +36250,7 @@ exports[`csr snapshot test > csr test src/cell/_example/multiple.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_s4_-overlap-fill2"
+                  id="t-icon-app-instance-_r_t8_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -36278,7 +36278,7 @@ exports[`csr snapshot test > csr test src/cell/_example/multiple.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_s4_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_t8_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -36297,7 +36297,7 @@ exports[`csr snapshot test > csr test src/cell/_example/multiple.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_s4_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_t8_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -36809,7 +36809,7 @@ exports[`csr snapshot test > csr test src/cell/_example/single.tsx 1`] = `
                 <defs>
                   <mask
                     height="24"
-                    id="t-icon-app-instance-_r_ru_-overlap-fill1"
+                    id="t-icon-app-instance-_r_t2_-overlap-fill1"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -36835,7 +36835,7 @@ exports[`csr snapshot test > csr test src/cell/_example/single.tsx 1`] = `
                   </mask>
                   <mask
                     height="24"
-                    id="t-icon-app-instance-_r_ru_-overlap-fill2"
+                    id="t-icon-app-instance-_r_t2_-overlap-fill2"
                     mask-type="luminance"
                     maskContentUnits="userSpaceOnUse"
                     maskUnits="userSpaceOnUse"
@@ -36863,7 +36863,7 @@ exports[`csr snapshot test > csr test src/cell/_example/single.tsx 1`] = `
                 >
                   <g
                     id="fill1"
-                    mask="url(#t-icon-app-instance-_r_ru_-overlap-fill1)"
+                    mask="url(#t-icon-app-instance-_r_t2_-overlap-fill1)"
                   >
                     <path
                       d="M3 3H10V10H3V3Z"
@@ -36882,7 +36882,7 @@ exports[`csr snapshot test > csr test src/cell/_example/single.tsx 1`] = `
                     d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                     fill="transparent"
                     id="fill2"
-                    mask="url(#t-icon-app-instance-_r_ru_-overlap-fill2)"
+                    mask="url(#t-icon-app-instance-_r_t2_-overlap-fill2)"
                   />
                   <g
                     id="stroke1"
@@ -43037,7 +43037,7 @@ exports[`csr snapshot test > csr test src/config-provider/_example/index.tsx 1`]
                                   <defs>
                                     <mask
                                       height="24"
-                                      id="t-icon-filter-instance-_r_pl_-overlap-fill1"
+                                      id="t-icon-filter-instance-_r_qp_-overlap-fill1"
                                       mask-type="luminance"
                                       maskContentUnits="userSpaceOnUse"
                                       maskUnits="userSpaceOnUse"
@@ -43072,7 +43072,7 @@ exports[`csr snapshot test > csr test src/config-provider/_example/index.tsx 1`]
                                       fill="transparent"
                                       fill-rule="evenodd"
                                       id="fill1"
-                                      mask="url(#t-icon-filter-instance-_r_pl_-overlap-fill1)"
+                                      mask="url(#t-icon-filter-instance-_r_qp_-overlap-fill1)"
                                     />
                                     <path
                                       clip-rule="evenodd"
@@ -46141,7 +46141,7 @@ exports[`csr snapshot test > csr test src/config-provider/_example/table-en.tsx
                             <defs>
                               <mask
                                 height="24"
-                                id="t-icon-filter-instance-_r_p5_-overlap-fill1"
+                                id="t-icon-filter-instance-_r_q9_-overlap-fill1"
                                 mask-type="luminance"
                                 maskContentUnits="userSpaceOnUse"
                                 maskUnits="userSpaceOnUse"
@@ -46176,7 +46176,7 @@ exports[`csr snapshot test > csr test src/config-provider/_example/table-en.tsx
                                 fill="transparent"
                                 fill-rule="evenodd"
                                 id="fill1"
-                                mask="url(#t-icon-filter-instance-_r_p5_-overlap-fill1)"
+                                mask="url(#t-icon-filter-instance-_r_q9_-overlap-fill1)"
                               />
                               <path
                                 clip-rule="evenodd"
@@ -56833,7 +56833,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_on_-overlap-fill1"
+                  id="t-icon-app-instance-_r_pr_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -56859,7 +56859,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_on_-overlap-fill2"
+                  id="t-icon-app-instance-_r_pr_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -56887,7 +56887,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_on_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_pr_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -56906,7 +56906,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_on_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_pr_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -56949,7 +56949,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_oo_-overlap-fill1"
+                  id="t-icon-app-instance-_r_ps_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -56975,7 +56975,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_oo_-overlap-fill2"
+                  id="t-icon-app-instance-_r_ps_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57003,7 +57003,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_oo_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_ps_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -57022,7 +57022,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_oo_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_ps_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -57065,7 +57065,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_op_-overlap-fill1"
+                  id="t-icon-app-instance-_r_pt_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57091,7 +57091,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_op_-overlap-fill2"
+                  id="t-icon-app-instance-_r_pt_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57119,7 +57119,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_op_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_pt_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -57138,7 +57138,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_op_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_pt_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -57181,7 +57181,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_oq_-overlap-fill1"
+                  id="t-icon-app-instance-_r_pu_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57207,7 +57207,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_oq_-overlap-fill2"
+                  id="t-icon-app-instance-_r_pu_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57235,7 +57235,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_oq_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_pu_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -57254,7 +57254,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_oq_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_pu_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -57297,7 +57297,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_or_-overlap-fill1"
+                  id="t-icon-app-instance-_r_pv_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57323,7 +57323,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_or_-overlap-fill2"
+                  id="t-icon-app-instance-_r_pv_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57351,7 +57351,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_or_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_pv_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -57370,7 +57370,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_or_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_pv_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -57413,7 +57413,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               <defs>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_os_-overlap-fill1"
+                  id="t-icon-app-instance-_r_q0_-overlap-fill1"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57439,7 +57439,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                 </mask>
                 <mask
                   height="24"
-                  id="t-icon-app-instance-_r_os_-overlap-fill2"
+                  id="t-icon-app-instance-_r_q0_-overlap-fill2"
                   mask-type="luminance"
                   maskContentUnits="userSpaceOnUse"
                   maskUnits="userSpaceOnUse"
@@ -57467,7 +57467,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
               >
                 <g
                   id="fill1"
-                  mask="url(#t-icon-app-instance-_r_os_-overlap-fill1)"
+                  mask="url(#t-icon-app-instance-_r_q0_-overlap-fill1)"
                 >
                   <path
                     d="M3 3H10V10H3V3Z"
@@ -57486,7 +57486,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/icon.tsx 1`] = `
                   d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                   fill="transparent"
                   id="fill2"
-                  mask="url(#t-icon-app-instance-_r_os_-overlap-fill2)"
+                  mask="url(#t-icon-app-instance-_r_q0_-overlap-fill2)"
                 />
                 <g
                   id="stroke1"
@@ -57692,7 +57692,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_oh_-overlap-fill1"
+                        id="t-icon-app-instance-_r_pl_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -57718,7 +57718,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_oh_-overlap-fill2"
+                        id="t-icon-app-instance-_r_pl_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -57746,7 +57746,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-app-instance-_r_oh_-overlap-fill1)"
+                        mask="url(#t-icon-app-instance-_r_pl_-overlap-fill1)"
                       >
                         <path
                           d="M3 3H10V10H3V3Z"
@@ -57765,7 +57765,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                         d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-app-instance-_r_oh_-overlap-fill2)"
+                        mask="url(#t-icon-app-instance-_r_pl_-overlap-fill2)"
                       />
                       <g
                         id="stroke1"
@@ -57808,7 +57808,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_oi_-overlap-fill1"
+                        id="t-icon-app-instance-_r_pm_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -57834,7 +57834,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_oi_-overlap-fill2"
+                        id="t-icon-app-instance-_r_pm_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -57862,7 +57862,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-app-instance-_r_oi_-overlap-fill1)"
+                        mask="url(#t-icon-app-instance-_r_pm_-overlap-fill1)"
                       >
                         <path
                           d="M3 3H10V10H3V3Z"
@@ -57881,7 +57881,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                         d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-app-instance-_r_oi_-overlap-fill2)"
+                        mask="url(#t-icon-app-instance-_r_pm_-overlap-fill2)"
                       />
                       <g
                         id="stroke1"
@@ -57924,7 +57924,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_oj_-overlap-fill1"
+                        id="t-icon-app-instance-_r_pn_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -57950,7 +57950,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_oj_-overlap-fill2"
+                        id="t-icon-app-instance-_r_pn_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -57978,7 +57978,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-app-instance-_r_oj_-overlap-fill1)"
+                        mask="url(#t-icon-app-instance-_r_pn_-overlap-fill1)"
                       >
                         <path
                           d="M3 3H10V10H3V3Z"
@@ -57997,7 +57997,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                         d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-app-instance-_r_oj_-overlap-fill2)"
+                        mask="url(#t-icon-app-instance-_r_pn_-overlap-fill2)"
                       />
                       <g
                         id="stroke1"
@@ -58040,7 +58040,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_ok_-overlap-fill1"
+                        id="t-icon-app-instance-_r_po_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -58066,7 +58066,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_ok_-overlap-fill2"
+                        id="t-icon-app-instance-_r_po_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -58094,7 +58094,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-app-instance-_r_ok_-overlap-fill1)"
+                        mask="url(#t-icon-app-instance-_r_po_-overlap-fill1)"
                       >
                         <path
                           d="M3 3H10V10H3V3Z"
@@ -58113,7 +58113,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                         d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-app-instance-_r_ok_-overlap-fill2)"
+                        mask="url(#t-icon-app-instance-_r_po_-overlap-fill2)"
                       />
                       <g
                         id="stroke1"
@@ -58156,7 +58156,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_ol_-overlap-fill1"
+                        id="t-icon-app-instance-_r_pp_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -58182,7 +58182,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_ol_-overlap-fill2"
+                        id="t-icon-app-instance-_r_pp_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -58210,7 +58210,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-app-instance-_r_ol_-overlap-fill1)"
+                        mask="url(#t-icon-app-instance-_r_pp_-overlap-fill1)"
                       >
                         <path
                           d="M3 3H10V10H3V3Z"
@@ -58229,7 +58229,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                         d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-app-instance-_r_ol_-overlap-fill2)"
+                        mask="url(#t-icon-app-instance-_r_pp_-overlap-fill2)"
                       />
                       <g
                         id="stroke1"
@@ -58272,7 +58272,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     <defs>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_om_-overlap-fill1"
+                        id="t-icon-app-instance-_r_pq_-overlap-fill1"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -58298,7 +58298,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                       </mask>
                       <mask
                         height="24"
-                        id="t-icon-app-instance-_r_om_-overlap-fill2"
+                        id="t-icon-app-instance-_r_pq_-overlap-fill2"
                         mask-type="luminance"
                         maskContentUnits="userSpaceOnUse"
                         maskUnits="userSpaceOnUse"
@@ -58326,7 +58326,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                     >
                       <g
                         id="fill1"
-                        mask="url(#t-icon-app-instance-_r_om_-overlap-fill1)"
+                        mask="url(#t-icon-app-instance-_r_pq_-overlap-fill1)"
                       >
                         <path
                           d="M3 3H10V10H3V3Z"
@@ -58345,7 +58345,7 @@ exports[`csr snapshot test > csr test src/drawer/_example/index.tsx 1`] = `
                         d="M21.5 6.5C21.5 8.70914 19.7091 10.5 17.5 10.5C15.2909 10.5 13.5 8.70914 13.5 6.5C13.5 4.29086 15.2909 2.5 17.5 2.5C19.7091 2.5 21.5 4.29086 21.5 6.5Z"
                         fill="transparent"
                         id="fill2"
-                        mask="url(#t-icon-app-instance-_r_om_-overlap-fill2)"
+                        mask="url(#t-icon-app-instance-_r_pq_-overlap-fill2)"
                       />
                       <g
                         id="stroke1"
@@ -60100,7 +60100,7 @@ exports[`csr snapshot test > csr test src/fab/_example/collapsible.tsx 1`] = `
             <defs>
               <mask
                 height="24"
-                id="t-icon-add-circle-instance-_r_nk_-overlap-fill1"
+                id="t-icon-add-circle-instance-_r_oo_-overlap-fill1"
                 mask-type="luminance"
                 maskContentUnits="userSpaceOnUse"
                 maskUnits="userSpaceOnUse"
@@ -60141,7 +60141,7 @@ exports[`csr snapshot test > csr test src/fab/_example/collapsible.tsx 1`] = `
                 cy="12"
                 fill="transparent"
                 id="fill1"
-                mask="url(#t-icon-add-circle-instance-_r_nk_-overlap-fill1)"
+                mask="url(#t-icon-add-circle-instance-_r_oo_-overlap-fill1)"
                 r="10"
                 transform="rotate(180 12 12)"
               />
@@ -60183,7 +60183,7 @@ exports[`csr snapshot test > csr test src/fab/_example/collapsible.tsx 1`] = `
             <defs>
               <mask
                 height="24"
-                id="t-icon-star-instance-_r_nl_-overlap-fill1"
+                id="t-icon-star-instance-_r_op_-overlap-fill1"
                 mask-type="luminance"
                 maskContentUnits="userSpaceOnUse"
                 maskUnits="userSpaceOnUse"
@@ -60214,7 +60214,7 @@ exports[`csr snapshot test > csr test src/fab/_example/collapsible.tsx 1`] = `
                 d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
                 fill="transparent"
                 id="fill1"
-                mask="url(#t-icon-star-instance-_r_nl_-overlap-fill1)"
+                mask="url(#t-icon-star-instance-_r_op_-overlap-fill1)"
               />
               <path
                 d="M12.0001 3.67603L14.1867 9.96648L20.8449 10.1022L15.538 14.1256L17.4665 20.4999L12.0001 16.696L6.5337 20.4999L8.46217 14.1256L3.15527 10.1022L9.81354 9.96648L12.0001 3.67603Z"
@@ -61084,7 +61084,7 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
           <div
             class="t-form__item-help t-form__controls--undefined"
           >
-            请输入用户名
+            输入用户名
           </div>
         </div>
       </div>
@@ -61150,7 +61150,7 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
                       <defs>
                         <mask
                           height="24"
-                          id="t-icon-browse-off-instance-_r_na_-overlap-stroke1"
+                          id="t-icon-browse-off-instance-_r_o2_-overlap-stroke1"
                           mask-type="luminance"
                           maskContentUnits="userSpaceOnUse"
                           maskUnits="userSpaceOnUse"
@@ -61180,7 +61180,7 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
                         <path
                           d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z"
                           id="stroke1"
-                          mask="url(#t-icon-browse-off-instance-_r_na_-overlap-stroke1)"
+                          mask="url(#t-icon-browse-off-instance-_r_o2_-overlap-stroke1)"
                           stroke="currentColor"
                           stroke-linecap="square"
                           stroke-width="2"
@@ -61262,7 +61262,7 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
                   class="t-radio__original"
                   name="radio"
                   type="radio"
-                  value="woman"
+                  value="women"
                 />
                 <div
                   class="t-radio__icon t-radio__icon--left"
@@ -61314,6 +61314,156 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
         </div>
       </div>
     </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--left t-form-item__birth t-form__item--bordered t-form--left t-form-item__birth"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--left"
+      >
+        <div
+          class="t-form__label t-form__label--left"
+          style="width: 81px;"
+        >
+          <label
+            for=""
+          >
+            生日
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+          style="margin-left: 81px;"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--right"
+          >
+            <div
+              class="t-input t-input--layout-horizontal"
+            >
+              <div
+                class="t-input__wrap--prefix"
+              >
+                <div
+                  class="t-input__label"
+                />
+              </div>
+              <div
+                class="t-input__wrap"
+              >
+                <div
+                  class="t-input__content t-input--default"
+                >
+                  <input
+                    class="t-input__control t-input--right t-input--default"
+                    placeholder="请输入内容"
+                    readonly=""
+                    spellcheck="false"
+                    style="--td-input-cursor-color: #0052d9;"
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <svg
+        class="t-icon t-icon-chevron-right t-form__item-arrow"
+        fill="none"
+        height="1em"
+        style="fill: none;"
+        viewBox="0 0 24 24"
+        width="1em"
+      >
+        <g
+          id="chevron-right"
+        >
+          <path
+            d="M9.5 17.5L15 12L9.5 6.5"
+            id="stroke1"
+            stroke="currentColor"
+            stroke-linecap="square"
+            stroke-width="2"
+          />
+        </g>
+      </svg>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--left t-form-item__place t-form__item--bordered t-form--left t-form-item__place"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--left"
+      >
+        <div
+          class="t-form__label t-form__label--left"
+          style="width: 81px;"
+        >
+          <label
+            for=""
+          >
+            籍贯
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+          style="margin-left: 81px;"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--right"
+          >
+            <div
+              class="t-input t-input--layout-horizontal"
+            >
+              <div
+                class="t-input__wrap--prefix"
+              >
+                <div
+                  class="t-input__label"
+                />
+              </div>
+              <div
+                class="t-input__wrap"
+              >
+                <div
+                  class="t-input__content t-input--default"
+                >
+                  <input
+                    class="t-input__control t-input--right t-input--default"
+                    placeholder="请输入内容"
+                    readonly=""
+                    spellcheck="false"
+                    style="--td-input-cursor-color: #0052d9;"
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <svg
+        class="t-icon t-icon-chevron-right t-form__item-arrow"
+        fill="none"
+        height="1em"
+        style="fill: none;"
+        viewBox="0 0 24 24"
+        width="1em"
+      >
+        <g
+          id="chevron-right"
+        >
+          <path
+            d="M9.5 17.5L15 12L9.5 6.5"
+            id="stroke1"
+            stroke="currentColor"
+            stroke-linecap="square"
+            stroke-width="2"
+          />
+        </g>
+      </svg>
+    </div>
     <div
       class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"
     >
@@ -61335,13 +61485,13 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
           style="margin-left: 81px;"
         >
           <div
-            class="t-form__controls-content t-form__controls--left"
+            class="t-form__controls-content t-form__controls--right"
           >
             <div
               class="t-stepper t-stepper--medium"
             >
               <div
-                class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"
+                class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"
               >
                 <svg
                   class="t-icon t-icon-remove t-stepper__minus-icon"
@@ -61368,7 +61518,7 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
                 class="t-stepper__input t-stepper__input--filled t-stepper__input--medium"
                 inputmode="numeric"
                 type="tel"
-                value="0"
+                value="3"
               />
               <div
                 class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"
@@ -61420,7 +61570,7 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
           style="margin-left: 81px;"
         >
           <div
-            class="t-form__controls-content t-form__controls--left"
+            class="t-form__controls-content t-form__controls--right"
           >
             <div
               class="t-rate"
@@ -61430,7 +61580,7 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
                 style="gap: 8px;"
               >
                 <div
-                  class="t-rate__icon t-rate__icon--unselected"
+                  class="t-rate__icon t-rate__icon--selected"
                   style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
                 >
                   <svg
@@ -61448,7 +61598,7 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
                   </svg>
                 </div>
                 <div
-                  class="t-rate__icon t-rate__icon--unselected"
+                  class="t-rate__icon t-rate__icon--selected"
                   style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
                 >
                   <svg
@@ -61570,6 +61720,186 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
         </div>
       </div>
     </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--left t-form-item__photo t-form__item--bordered t-form--left t-form-item__photo"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--left"
+      >
+        <div
+          class="t-form__label t-form__label--left"
+          style="width: 81px;"
+        >
+          <label
+            for=""
+          >
+            上传照片
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+          style="margin-left: 81px;"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-upload t-upload--grid upload"
+            >
+              <div
+                class="t-upload__item"
+              >
+                <div
+                  class="t-image t-image--round t-upload__image"
+                >
+                  <div
+                    class="t-image__mask"
+                  >
+                    <div
+                      class="t-loading t-loading--center"
+                      style="color: inherit; font-size: 20px;"
+                    >
+                      <div
+                        class="t-loading__dots"
+                        style="animation-duration: 800ms; width: 20px; height: 20px;"
+                      >
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0s;"
+                        />
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0.26666666666666666s;"
+                        />
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0.5333333333333333s;"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <img
+                    class="t-image__img t-image--fit-fill t-image--position-center"
+                    src="https://tdesign.gtimg.com/mobile/demos/example4.png"
+                  />
+                </div>
+                <svg
+                  class="t-icon t-icon-close t-upload__delete-btn"
+                  fill="none"
+                  height="1em"
+                  style="fill: none;"
+                  viewBox="0 0 24 24"
+                  width="1em"
+                >
+                  <g
+                    id="close"
+                  >
+                    <path
+                      d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+                      id="stroke1"
+                      stroke="currentColor"
+                      stroke-linecap="square"
+                      stroke-width="2"
+                    />
+                  </g>
+                </svg>
+              </div>
+              <div
+                class="t-upload__item"
+              >
+                <div
+                  class="t-image t-image--round t-upload__image"
+                >
+                  <div
+                    class="t-image__mask"
+                  >
+                    <div
+                      class="t-loading t-loading--center"
+                      style="color: inherit; font-size: 20px;"
+                    >
+                      <div
+                        class="t-loading__dots"
+                        style="animation-duration: 800ms; width: 20px; height: 20px;"
+                      >
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0s;"
+                        />
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0.26666666666666666s;"
+                        />
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0.5333333333333333s;"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <img
+                    class="t-image__img t-image--fit-fill t-image--position-center"
+                    src="https://tdesign.gtimg.com/mobile/demos/example6.png"
+                  />
+                </div>
+                <svg
+                  class="t-icon t-icon-close t-upload__delete-btn"
+                  fill="none"
+                  height="1em"
+                  style="fill: none;"
+                  viewBox="0 0 24 24"
+                  width="1em"
+                >
+                  <g
+                    id="close"
+                  >
+                    <path
+                      d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+                      id="stroke1"
+                      stroke="currentColor"
+                      stroke-linecap="square"
+                      stroke-width="2"
+                    />
+                  </g>
+                </svg>
+              </div>
+              <div
+                class="t-upload__item t-upload__item--add"
+              >
+                <div
+                  class="t-upload__add-icon"
+                >
+                  <svg
+                    class="t-icon t-icon-add"
+                    fill="none"
+                    height="1em"
+                    style="fill: none;"
+                    viewBox="0 0 24 24"
+                    width="1em"
+                  >
+                    <g
+                      id="add"
+                    >
+                      <path
+                        d="M12 5L12 19M19 12L5 12"
+                        id="stroke1"
+                        stroke="currentColor"
+                        stroke-linecap="square"
+                        stroke-width="2"
+                      />
+                    </g>
+                  </svg>
+                </div>
+              </div>
+              <input
+                hidden=""
+                multiple=""
+                type="file"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
     <div
       class="button-group"
     >
@@ -61599,324 +61929,1376 @@ exports[`csr snapshot test > csr test src/form/_example/horizontal.tsx 1`] = `
       </button>
     </div>
   </form>
-</div>
-`;
-
-exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
-<div>
   <div
-    class="tdesign-mobile-demo"
+    class="t-popup t-popup--bottom"
+    style="display: none; animation-fill-mode: forwards;"
   >
     <div
-      class="tdesign-mobile-demo-header"
+      class="t-picker"
     >
-      <h1
-        class="tdesign-mobile-demo-header__title"
+      <div
+        class="t-picker__toolbar"
       >
-        Form 表单
-      </h1>
-      <p
-        class="tdesign-mobile-demo-header__summary"
+        <div
+          class="t-picker__cancel"
+        >
+          取消
+        </div>
+        <div
+          class="t-picker__title"
+        >
+          选择日期
+        </div>
+        <div
+          class="t-picker__confirm"
+        >
+          确定
+        </div>
+      </div>
+      <div
+        class="t-picker__main"
       >
-        用以收集、校验和提交数据，一般由输入框、单选框、复选框、选择器等控件组成。
-      </p>
+        <div
+          class="t-picker-item__group"
+        >
+          <ul
+            class="t-picker-item"
+          >
+            <li
+              class="t-picker-item__item"
+            >
+              2015 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2016 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2017 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2018 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2019 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2020 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2021 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2022 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2023 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2024 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2025 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2026 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2027 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2028 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2029 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2030 年
+            </li>
+          </ul>
+        </div>
+        <div
+          class="t-picker-item__group"
+        >
+          <ul
+            class="t-picker-item"
+          >
+            <li
+              class="t-picker-item__item"
+            >
+              5 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              6 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              7 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              8 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              9 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              10 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              11 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              12 月
+            </li>
+          </ul>
+        </div>
+        <div
+          class="t-picker-item__group"
+        >
+          <ul
+            class="t-picker-item"
+          >
+            <li
+              class="t-picker-item__item"
+            >
+              5 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              6 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              7 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              8 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              9 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              10 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              11 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              12 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              13 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              14 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              15 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              16 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              17 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              18 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              19 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              20 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              21 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              22 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              23 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              24 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              25 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              26 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              27 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              28 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              29 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              30 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              31 日
+            </li>
+          </ul>
+        </div>
+        <div
+          class="t-picker__mask t-picker__mask--top"
+        />
+        <div
+          class="t-picker__mask t-picker__mask--bottom"
+        />
+        <div
+          class="t-picker__indicator"
+        />
+      </div>
     </div>
+  </div>
+  <div
+    class="t-popup t-popup--bottom"
+    style="display: none; animation-fill-mode: forwards;"
+  >
     <div
-      class="tdesign-mobile-demo-block"
+      class="t-cascader"
     >
       <div
-        class="tdesign-mobile-demo-block__header"
+        class="t-cascader__title"
       >
-        <h2
-          class="tdesign-mobile-demo-block__title"
-        >
-          01 组件类型
-        </h2>
-        <p
-          class="tdesign-mobile-demo-block__summary"
-        >
-          基础表单
-        </p>
+        选择地址
       </div>
       <div
-        class="tdesign-mobile-demo-block__slot"
+        class="t-cascader__close-btn"
       >
-        <div
-          class="options"
+        <svg
+          class="t-icon t-icon-close"
+          fill="none"
+          height="1em"
+          style="fill: none; font-size: 24px;"
+          viewBox="0 0 24 24"
+          width="1em"
         >
+          <g
+            id="close"
+          >
+            <path
+              d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+              id="stroke1"
+              stroke="currentColor"
+              stroke-linecap="square"
+              stroke-width="2"
+            />
+          </g>
+        </svg>
+      </div>
+      <div
+        class="t-cascader__content"
+      >
+        <div>
           <div
-            class="button-group"
+            class="t-cascader__steps"
           >
-            <button
-              class="t-button t-button--size-medium t-button--base t-button--light t-button--round"
-              tabindex="0"
-              type="button"
+            <div
+              class="t-cascader__step"
             >
-              <span
-                class="t-button__content"
+              <div
+                class="t-cascader__step-dot t-cascader__step-dot--active"
+              />
+              <div
+                class="t-cascader__step-label"
               >
-                 
-                水平排布
-              </span>
-            </button>
-            <button
-              class="t-button t-button--size-medium t-button--base t-button--default t-button--round"
-              tabindex="0"
-              type="button"
-            >
-              <span
-                class="t-button__content"
+                天津市
+              </div>
+              <svg
+                class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                fill="none"
+                height="1em"
+                style="fill: none; font-size: 22px;"
+                viewBox="0 0 24 24"
+                width="1em"
               >
-                 
-                竖直排布
-              </span>
-            </button>
-          </div>
-          <div
-            class="t-cell"
-          >
-            <div
-              class="t-cell__left"
-            />
+                <g
+                  id="chevron-right"
+                >
+                  <path
+                    d="M9.5 17.5L15 12L9.5 6.5"
+                    id="stroke1"
+                    stroke="currentColor"
+                    stroke-linecap="square"
+                    stroke-width="2"
+                  />
+                </g>
+              </svg>
+            </div>
             <div
-              class="t-cell__title"
+              class="t-cascader__step"
             >
               <div
-                class="t-cell__title-text"
+                class="t-cascader__step-dot t-cascader__step-dot--active"
+              />
+              <div
+                class="t-cascader__step-label"
               >
-                禁用态
+                天津市
               </div>
+              <svg
+                class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                fill="none"
+                height="1em"
+                style="fill: none; font-size: 22px;"
+                viewBox="0 0 24 24"
+                width="1em"
+              >
+                <g
+                  id="chevron-right"
+                >
+                  <path
+                    d="M9.5 17.5L15 12L9.5 6.5"
+                    id="stroke1"
+                    stroke="currentColor"
+                    stroke-linecap="square"
+                    stroke-width="2"
+                  />
+                </g>
+              </svg>
             </div>
             <div
-              class="t-switch t-switch--medium"
+              class="t-cascader__step"
             >
               <div
-                class="t-switch__dot t-switch__dot--medium t-switch__dot--plain"
+                class="t-cascader__step-dot t-cascader__step-dot--active t-cascader__step-dot--last"
+              />
+              <div
+                class="t-cascader__step-label t-cascader__step-label--active"
               >
-                <div
-                  class="t-switch__label t-switch__label--medium"
-                />
+                蓟州区
               </div>
+              <svg
+                class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                fill="none"
+                height="1em"
+                style="fill: none; font-size: 22px;"
+                viewBox="0 0 24 24"
+                width="1em"
+              >
+                <g
+                  id="chevron-right"
+                >
+                  <path
+                    d="M9.5 17.5L15 12L9.5 6.5"
+                    id="stroke1"
+                    stroke="currentColor"
+                    stroke-linecap="square"
+                    stroke-width="2"
+                  />
+                </g>
+              </svg>
             </div>
           </div>
         </div>
-      </div>
-    </div>
-    <div
-      class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"
-    >
-      <div
-        class="tdesign-mobile-demo-block__slot"
-      >
-        <form
-          class="t-form"
+        <div
+          class="t-cascader__options-container"
+          style="width: 300vw; transform: translateX(-200vw);"
         >
           <div
-            class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"
+            class="t-cascader__options"
           >
             <div
-              class="t-form__item-wrap t-form__item--left"
+              class="t-cascader-radio-group-0"
             >
               <div
-                class="t-form__label t-form__label--left"
-                style="width: 81px;"
-              >
-                <label
-                  for=""
-                >
-                  用户名
-                </label>
-              </div>
-              <div
-                class="t-form__controls"
-                style="margin-left: 81px;"
+                class="t-radio-group t-radio-group--vertical"
               >
                 <div
-                  class="t-form__controls-content t-form__controls--undefined"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="110000"
+                  />
                   <div
-                    class="t-input t-input--layout-horizontal"
+                    class="t-radio__icon t-radio__icon--right"
                   >
                     <div
-                      class="t-input__wrap--prefix"
-                    >
-                      <div
-                        class="t-input__label"
-                      />
-                    </div>
-                    <div
-                      class="t-input__wrap"
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
                     >
-                      <div
-                        class="t-input__content t-input--default"
-                      >
-                        <input
-                          class="t-input__control t-input--default"
-                          placeholder="请输入内容"
-                          spellcheck="false"
-                          style="--td-input-cursor-color: #0052d9;"
-                          type="text"
-                          value=""
-                        />
-                      </div>
-                    </div>
+                      北京市
+                    </span>
                   </div>
                 </div>
                 <div
-                  class="t-form__item-help t-form__controls--undefined"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  请输入用户名
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120000"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
+                  >
+                    <svg
+                      class="t-icon t-icon-check t-radio__icon-wrap"
+                      fill="none"
+                      height="1em"
+                      style="fill: none;"
+                      viewBox="0 0 24 24"
+                      width="1em"
+                    >
+                      <g
+                        id="check"
+                      >
+                        <path
+                          d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
+                          id="stroke1"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
+                        />
+                      </g>
+                    </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      天津市
+                    </span>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"
+            class="t-cascader__options"
           >
             <div
-              class="t-form__item-wrap t-form__item--left"
+              class="t-cascader-radio-group-1"
             >
               <div
-                class="t-form__label t-form__label--left"
-                style="width: 81px;"
-              >
-                <label
-                  for=""
-                >
-                  密码
-                </label>
-              </div>
-              <div
-                class="t-form__controls"
-                style="margin-left: 81px;"
+                class="t-radio-group t-radio-group--vertical"
               >
                 <div
-                  class="t-form__controls-content t-form__controls--undefined"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
+                  <input
+                    checked=""
+                    class="t-radio__original"
+                    type="radio"
+                    value="120100"
+                  />
                   <div
-                    class="t-input t-input--layout-horizontal"
+                    class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
                   >
-                    <div
-                      class="t-input__wrap--prefix"
-                    >
-                      <div
-                        class="t-input__label"
-                      />
-                    </div>
-                    <div
-                      class="t-input__wrap"
+                    <svg
+                      class="t-icon t-icon-check t-radio__icon-wrap"
+                      fill="none"
+                      height="1em"
+                      style="fill: none;"
+                      viewBox="0 0 24 24"
+                      width="1em"
                     >
-                      <div
-                        class="t-input__content t-input--default"
+                      <g
+                        id="check"
                       >
-                        <input
-                          class="t-input__control t-input--default t-input--password"
-                          placeholder="请输入内容"
-                          spellcheck="false"
-                          style="--td-input-cursor-color: #0052d9;"
-                          type="password"
-                          value=""
+                        <path
+                          d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
+                          id="stroke1"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
                         />
-                        <div
-                          class="t-input__wrap--suffix-icon"
-                        >
-                          <svg
-                            class="t-icon t-icon-browse-off"
-                            fill="none"
-                            height="1em"
-                            style="fill: none;"
-                            viewBox="0 0 24 24"
-                            width="1em"
-                          >
-                            <defs>
-                              <mask
-                                height="24"
-                                id="t-icon-browse-off-instance-_r_n2_-overlap-stroke1"
-                                mask-type="luminance"
-                                maskContentUnits="userSpaceOnUse"
-                                maskUnits="userSpaceOnUse"
-                                width="24"
-                                x="0"
-                                y="0"
-                              >
-                                <rect
-                                  fill="#fff"
-                                  height="24"
-                                  width="24"
-                                  x="0"
-                                  y="0"
-                                />
-                                <path
-                                  d="M20.9996 21L3 3"
-                                  fill="none"
-                                  stroke="#000"
-                                  stroke-linecap="square"
-                                  stroke-width="2"
-                                />
-                              </mask>
-                            </defs>
-                            <g
-                              id="browse-off"
-                            >
-                              <path
-                                d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z"
-                                id="stroke1"
-                                mask="url(#t-icon-browse-off-instance-_r_n2_-overlap-stroke1)"
-                                stroke="currentColor"
-                                stroke-linecap="square"
-                                stroke-width="2"
-                              />
-                              <path
-                                d="M20.9996 21L3 3"
-                                id="stroke2"
-                                stroke="currentColor"
-                                stroke-linecap="square"
-                                stroke-width="2"
-                              />
-                            </g>
-                          </svg>
-                        </div>
-                      </div>
-                    </div>
+                      </g>
+                    </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      天津市
+                    </span>
                   </div>
                 </div>
               </div>
             </div>
           </div>
           <div
-            class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"
+            class="t-cascader__options"
           >
             <div
-              class="t-form__item-wrap t-form__item--left"
+              class="t-cascader-radio-group-2"
             >
               <div
-                class="t-form__label t-form__label--left"
-                style="width: 81px;"
-              >
-                <label
-                  for=""
-                >
-                  性别
-                </label>
-              </div>
-              <div
-                class="t-form__controls"
-                style="margin-left: 81px;"
+                class="t-radio-group t-radio-group--vertical"
               >
                 <div
-                  class="t-form__controls-content t-form__controls--undefined"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120101"
+                  />
                   <div
-                    class="t-radio-group t-radio-group--vertical box"
+                    class="t-radio__icon t-radio__icon--right"
                   >
                     <div
-                      class="t-radio t-radio--left t-radio--vertical"
-                    >
-                      <input
-                        class="t-radio__original"
-                        name="radio"
-                        type="radio"
-                        value="man"
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      和平区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120102"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      河东区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120103"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      河西区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120104"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      南开区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120105"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      河北区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120106"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      红桥区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120110"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      东丽区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120111"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      西青区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120112"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      津南区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120113"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      北辰区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120114"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      武清区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120115"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      宝坻区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120116"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      滨海新区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120117"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      宁河区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120118"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      静海区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    checked=""
+                    class="t-radio__original"
+                    type="radio"
+                    value="120119"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
+                  >
+                    <svg
+                      class="t-icon t-icon-check t-radio__icon-wrap"
+                      fill="none"
+                      height="1em"
+                      style="fill: none;"
+                      viewBox="0 0 24 24"
+                      width="1em"
+                    >
+                      <g
+                        id="check"
+                      >
+                        <path
+                          d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
+                          id="stroke1"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
+                        />
+                      </g>
+                    </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      蓟州区
+                    </span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
+<div>
+  <div
+    class="tdesign-mobile-demo"
+  >
+    <div
+      class="tdesign-mobile-demo-header"
+    >
+      <h1
+        class="tdesign-mobile-demo-header__title"
+      >
+        Form 表单
+      </h1>
+      <p
+        class="tdesign-mobile-demo-header__summary"
+      >
+        用以收集、校验和提交数据，一般由输入框、单选框、复选框、选择器等控件组成。
+      </p>
+    </div>
+    <div
+      class="tdesign-mobile-demo-block"
+    >
+      <div
+        class="tdesign-mobile-demo-block__header"
+      >
+        <h2
+          class="tdesign-mobile-demo-block__title"
+        >
+          01 组件类型
+        </h2>
+        <p
+          class="tdesign-mobile-demo-block__summary"
+        >
+          基础表单
+        </p>
+      </div>
+      <div
+        class="tdesign-mobile-demo-block__slot"
+      >
+        <div
+          class="options"
+        >
+          <div
+            class="button-group"
+          >
+            <button
+              class="t-button t-button--size-medium t-button--base t-button--light t-button--round"
+              tabindex="0"
+              type="button"
+            >
+              <span
+                class="t-button__content"
+              >
+                 
+                水平排布
+              </span>
+            </button>
+            <button
+              class="t-button t-button--size-medium t-button--base t-button--default t-button--round"
+              tabindex="0"
+              type="button"
+            >
+              <span
+                class="t-button__content"
+              >
+                 
+                竖直排布
+              </span>
+            </button>
+          </div>
+          <div
+            class="t-cell"
+          >
+            <div
+              class="t-cell__left"
+            />
+            <div
+              class="t-cell__title"
+            >
+              <div
+                class="t-cell__title-text"
+              >
+                禁用态
+              </div>
+            </div>
+            <div
+              class="t-switch t-switch--medium"
+            >
+              <div
+                class="t-switch__dot t-switch__dot--medium t-switch__dot--plain"
+              >
+                <div
+                  class="t-switch__label t-switch__label--medium"
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"
+    >
+      <div
+        class="tdesign-mobile-demo-block__slot"
+      >
+        <form
+          class="t-form"
+        >
+          <div
+            class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"
+          >
+            <div
+              class="t-form__item-wrap t-form__item--left"
+            >
+              <div
+                class="t-form__label t-form__label--left"
+                style="width: 81px;"
+              >
+                <label
+                  for=""
+                >
+                  用户名
+                </label>
+              </div>
+              <div
+                class="t-form__controls"
+                style="margin-left: 81px;"
+              >
+                <div
+                  class="t-form__controls-content t-form__controls--undefined"
+                >
+                  <div
+                    class="t-input t-input--layout-horizontal"
+                  >
+                    <div
+                      class="t-input__wrap--prefix"
+                    >
+                      <div
+                        class="t-input__label"
+                      />
+                    </div>
+                    <div
+                      class="t-input__wrap"
+                    >
+                      <div
+                        class="t-input__content t-input--default"
+                      >
+                        <input
+                          class="t-input__control t-input--default"
+                          placeholder="请输入内容"
+                          spellcheck="false"
+                          style="--td-input-cursor-color: #0052d9;"
+                          type="text"
+                          value=""
+                        />
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="t-form__item-help t-form__controls--undefined"
+                >
+                  输入用户名
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"
+          >
+            <div
+              class="t-form__item-wrap t-form__item--left"
+            >
+              <div
+                class="t-form__label t-form__label--left"
+                style="width: 81px;"
+              >
+                <label
+                  for=""
+                >
+                  密码
+                </label>
+              </div>
+              <div
+                class="t-form__controls"
+                style="margin-left: 81px;"
+              >
+                <div
+                  class="t-form__controls-content t-form__controls--undefined"
+                >
+                  <div
+                    class="t-input t-input--layout-horizontal"
+                  >
+                    <div
+                      class="t-input__wrap--prefix"
+                    >
+                      <div
+                        class="t-input__label"
+                      />
+                    </div>
+                    <div
+                      class="t-input__wrap"
+                    >
+                      <div
+                        class="t-input__content t-input--default"
+                      >
+                        <input
+                          class="t-input__control t-input--default t-input--password"
+                          placeholder="请输入内容"
+                          spellcheck="false"
+                          style="--td-input-cursor-color: #0052d9;"
+                          type="password"
+                          value=""
+                        />
+                        <div
+                          class="t-input__wrap--suffix-icon"
+                        >
+                          <svg
+                            class="t-icon t-icon-browse-off"
+                            fill="none"
+                            height="1em"
+                            style="fill: none;"
+                            viewBox="0 0 24 24"
+                            width="1em"
+                          >
+                            <defs>
+                              <mask
+                                height="24"
+                                id="t-icon-browse-off-instance-_r_ne_-overlap-stroke1"
+                                mask-type="luminance"
+                                maskContentUnits="userSpaceOnUse"
+                                maskUnits="userSpaceOnUse"
+                                width="24"
+                                x="0"
+                                y="0"
+                              >
+                                <rect
+                                  fill="#fff"
+                                  height="24"
+                                  width="24"
+                                  x="0"
+                                  y="0"
+                                />
+                                <path
+                                  d="M20.9996 21L3 3"
+                                  fill="none"
+                                  stroke="#000"
+                                  stroke-linecap="square"
+                                  stroke-width="2"
+                                />
+                              </mask>
+                            </defs>
+                            <g
+                              id="browse-off"
+                            >
+                              <path
+                                d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z"
+                                id="stroke1"
+                                mask="url(#t-icon-browse-off-instance-_r_ne_-overlap-stroke1)"
+                                stroke="currentColor"
+                                stroke-linecap="square"
+                                stroke-width="2"
+                              />
+                              <path
+                                d="M20.9996 21L3 3"
+                                id="stroke2"
+                                stroke="currentColor"
+                                stroke-linecap="square"
+                                stroke-width="2"
+                              />
+                            </g>
+                          </svg>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"
+          >
+            <div
+              class="t-form__item-wrap t-form__item--left"
+            >
+              <div
+                class="t-form__label t-form__label--left"
+                style="width: 81px;"
+              >
+                <label
+                  for=""
+                >
+                  性别
+                </label>
+              </div>
+              <div
+                class="t-form__controls"
+                style="margin-left: 81px;"
+              >
+                <div
+                  class="t-form__controls-content t-form__controls--undefined"
+                >
+                  <div
+                    class="t-radio-group t-radio-group--vertical box"
+                  >
+                    <div
+                      class="t-radio t-radio--left t-radio--vertical"
+                    >
+                      <input
+                        class="t-radio__original"
+                        name="radio"
+                        type="radio"
+                        value="man"
                       />
                       <div
                         class="t-radio__icon t-radio__icon--left"
@@ -61943,7 +63325,7 @@ exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
                         class="t-radio__original"
                         name="radio"
                         type="radio"
-                        value="woman"
+                        value="women"
                       />
                       <div
                         class="t-radio__icon t-radio__icon--left"
@@ -61995,6 +63377,156 @@ exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
               </div>
             </div>
           </div>
+          <div
+            class="t-form__item t-form__item--bordered t-form--left t-form-item__birth t-form__item--bordered t-form--left t-form-item__birth"
+          >
+            <div
+              class="t-form__item-wrap t-form__item--left"
+            >
+              <div
+                class="t-form__label t-form__label--left"
+                style="width: 81px;"
+              >
+                <label
+                  for=""
+                >
+                  生日
+                </label>
+              </div>
+              <div
+                class="t-form__controls"
+                style="margin-left: 81px;"
+              >
+                <div
+                  class="t-form__controls-content t-form__controls--right"
+                >
+                  <div
+                    class="t-input t-input--layout-horizontal"
+                  >
+                    <div
+                      class="t-input__wrap--prefix"
+                    >
+                      <div
+                        class="t-input__label"
+                      />
+                    </div>
+                    <div
+                      class="t-input__wrap"
+                    >
+                      <div
+                        class="t-input__content t-input--default"
+                      >
+                        <input
+                          class="t-input__control t-input--right t-input--default"
+                          placeholder="请输入内容"
+                          readonly=""
+                          spellcheck="false"
+                          style="--td-input-cursor-color: #0052d9;"
+                          type="text"
+                          value=""
+                        />
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <svg
+              class="t-icon t-icon-chevron-right t-form__item-arrow"
+              fill="none"
+              height="1em"
+              style="fill: none;"
+              viewBox="0 0 24 24"
+              width="1em"
+            >
+              <g
+                id="chevron-right"
+              >
+                <path
+                  d="M9.5 17.5L15 12L9.5 6.5"
+                  id="stroke1"
+                  stroke="currentColor"
+                  stroke-linecap="square"
+                  stroke-width="2"
+                />
+              </g>
+            </svg>
+          </div>
+          <div
+            class="t-form__item t-form__item--bordered t-form--left t-form-item__place t-form__item--bordered t-form--left t-form-item__place"
+          >
+            <div
+              class="t-form__item-wrap t-form__item--left"
+            >
+              <div
+                class="t-form__label t-form__label--left"
+                style="width: 81px;"
+              >
+                <label
+                  for=""
+                >
+                  籍贯
+                </label>
+              </div>
+              <div
+                class="t-form__controls"
+                style="margin-left: 81px;"
+              >
+                <div
+                  class="t-form__controls-content t-form__controls--right"
+                >
+                  <div
+                    class="t-input t-input--layout-horizontal"
+                  >
+                    <div
+                      class="t-input__wrap--prefix"
+                    >
+                      <div
+                        class="t-input__label"
+                      />
+                    </div>
+                    <div
+                      class="t-input__wrap"
+                    >
+                      <div
+                        class="t-input__content t-input--default"
+                      >
+                        <input
+                          class="t-input__control t-input--right t-input--default"
+                          placeholder="请输入内容"
+                          readonly=""
+                          spellcheck="false"
+                          style="--td-input-cursor-color: #0052d9;"
+                          type="text"
+                          value=""
+                        />
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <svg
+              class="t-icon t-icon-chevron-right t-form__item-arrow"
+              fill="none"
+              height="1em"
+              style="fill: none;"
+              viewBox="0 0 24 24"
+              width="1em"
+            >
+              <g
+                id="chevron-right"
+              >
+                <path
+                  d="M9.5 17.5L15 12L9.5 6.5"
+                  id="stroke1"
+                  stroke="currentColor"
+                  stroke-linecap="square"
+                  stroke-width="2"
+                />
+              </g>
+            </svg>
+          </div>
           <div
             class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"
           >
@@ -62016,13 +63548,13 @@ exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
                 style="margin-left: 81px;"
               >
                 <div
-                  class="t-form__controls-content t-form__controls--left"
+                  class="t-form__controls-content t-form__controls--right"
                 >
                   <div
                     class="t-stepper t-stepper--medium"
                   >
                     <div
-                      class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"
+                      class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"
                     >
                       <svg
                         class="t-icon t-icon-remove t-stepper__minus-icon"
@@ -62049,7 +63581,7 @@ exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
                       class="t-stepper__input t-stepper__input--filled t-stepper__input--medium"
                       inputmode="numeric"
                       type="tel"
-                      value="0"
+                      value="3"
                     />
                     <div
                       class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"
@@ -62101,7 +63633,7 @@ exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
                 style="margin-left: 81px;"
               >
                 <div
-                  class="t-form__controls-content t-form__controls--left"
+                  class="t-form__controls-content t-form__controls--right"
                 >
                   <div
                     class="t-rate"
@@ -62111,7 +63643,7 @@ exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
                       style="gap: 8px;"
                     >
                       <div
-                        class="t-rate__icon t-rate__icon--unselected"
+                        class="t-rate__icon t-rate__icon--selected"
                         style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
                       >
                         <svg
@@ -62129,7 +63661,7 @@ exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
                         </svg>
                       </div>
                       <div
-                        class="t-rate__icon t-rate__icon--unselected"
+                        class="t-rate__icon t-rate__icon--selected"
                         style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
                       >
                         <svg
@@ -62252,199 +63784,2739 @@ exports[`csr snapshot test > csr test src/form/_example/index.tsx 1`] = `
             </div>
           </div>
           <div
-            class="button-group"
-          >
-            <button
-              class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"
-              tabindex="0"
-              type="submit"
-            >
-              <span
-                class="t-button__content"
-              >
-                 
-                提交
-              </span>
-            </button>
-            <button
-              class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"
-              tabindex="0"
-              type="reset"
-            >
-              <span
-                class="t-button__content"
-              >
-                 
-                重置
-              </span>
-            </button>
-          </div>
-        </form>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`csr snapshot test > csr test src/form/_example/vertical.tsx 1`] = `
-<div>
-  <form
-    class="t-form"
-  >
-    <div
-      class="t-form__item t-form__item--bordered t-form--top t-form-item__name t-form__item--bordered t-form--top t-form-item__name t-form__item-with-help"
-    >
-      <div
-        class="t-form__item-wrap t-form__item--top"
-      >
-        <div
-          class="t-form__label t-form__label--top"
-        >
-          <label
-            for=""
-          >
-            用户名
-          </label>
-        </div>
-        <div
-          class="t-form__controls"
-        >
-          <div
-            class="t-form__controls-content t-form__controls--undefined"
+            class="t-form__item t-form__item--bordered t-form--left t-form-item__photo t-form__item--bordered t-form--left t-form-item__photo"
           >
             <div
-              class="t-input t-input--layout-horizontal"
+              class="t-form__item-wrap t-form__item--left"
             >
               <div
-                class="t-input__wrap--prefix"
-              >
-                <div
-                  class="t-input__label"
-                />
-              </div>
-              <div
-                class="t-input__wrap"
+                class="t-form__label t-form__label--left"
+                style="width: 81px;"
               >
-                <div
-                  class="t-input__content t-input--default"
+                <label
+                  for=""
                 >
-                  <input
-                    class="t-input__control t-input--default"
-                    placeholder="请输入内容"
-                    spellcheck="false"
-                    style="--td-input-cursor-color: #0052d9;"
-                    type="text"
-                    value=""
-                  />
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            class="t-form__item-help t-form__controls--undefined"
-          >
-            请输入用户名
-          </div>
-        </div>
-      </div>
-    </div>
-    <div
-      class="t-form__item t-form__item--bordered t-form--top t-form-item__password t-form__item--bordered t-form--top t-form-item__password"
-    >
-      <div
-        class="t-form__item-wrap t-form__item--top"
-      >
-        <div
-          class="t-form__label t-form__label--top"
-        >
-          <label
-            for=""
-          >
-            密码
-          </label>
-        </div>
-        <div
-          class="t-form__controls"
-        >
-          <div
-            class="t-form__controls-content t-form__controls--undefined"
-          >
-            <div
-              class="t-input t-input--layout-horizontal"
-            >
-              <div
-                class="t-input__wrap--prefix"
-              >
-                <div
-                  class="t-input__label"
-                />
+                  上传照片
+                </label>
               </div>
               <div
-                class="t-input__wrap"
+                class="t-form__controls"
+                style="margin-left: 81px;"
               >
                 <div
-                  class="t-input__content t-input--default"
+                  class="t-form__controls-content t-form__controls--undefined"
                 >
-                  <input
-                    class="t-input__control t-input--default t-input--password"
-                    placeholder="请输入内容"
-                    spellcheck="false"
-                    style="--td-input-cursor-color: #0052d9;"
-                    type="password"
-                    value=""
-                  />
                   <div
-                    class="t-input__wrap--suffix-icon"
+                    class="t-upload t-upload--grid upload"
+                  >
+                    <div
+                      class="t-upload__item"
+                    >
+                      <div
+                        class="t-image t-image--round t-upload__image"
+                      >
+                        <div
+                          class="t-image__mask"
+                        >
+                          <div
+                            class="t-loading t-loading--center"
+                            style="color: inherit; font-size: 20px;"
+                          >
+                            <div
+                              class="t-loading__dots"
+                              style="animation-duration: 800ms; width: 20px; height: 20px;"
+                            >
+                              <div
+                                class="t-loading__dot"
+                                style="animation-duration: 0.8s; animation-delay: 0s;"
+                              />
+                              <div
+                                class="t-loading__dot"
+                                style="animation-duration: 0.8s; animation-delay: 0.26666666666666666s;"
+                              />
+                              <div
+                                class="t-loading__dot"
+                                style="animation-duration: 0.8s; animation-delay: 0.5333333333333333s;"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                        <img
+                          class="t-image__img t-image--fit-fill t-image--position-center"
+                          src="https://tdesign.gtimg.com/mobile/demos/example4.png"
+                        />
+                      </div>
+                      <svg
+                        class="t-icon t-icon-close t-upload__delete-btn"
+                        fill="none"
+                        height="1em"
+                        style="fill: none;"
+                        viewBox="0 0 24 24"
+                        width="1em"
+                      >
+                        <g
+                          id="close"
+                        >
+                          <path
+                            d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+                            id="stroke1"
+                            stroke="currentColor"
+                            stroke-linecap="square"
+                            stroke-width="2"
+                          />
+                        </g>
+                      </svg>
+                    </div>
+                    <div
+                      class="t-upload__item"
+                    >
+                      <div
+                        class="t-image t-image--round t-upload__image"
+                      >
+                        <div
+                          class="t-image__mask"
+                        >
+                          <div
+                            class="t-loading t-loading--center"
+                            style="color: inherit; font-size: 20px;"
+                          >
+                            <div
+                              class="t-loading__dots"
+                              style="animation-duration: 800ms; width: 20px; height: 20px;"
+                            >
+                              <div
+                                class="t-loading__dot"
+                                style="animation-duration: 0.8s; animation-delay: 0s;"
+                              />
+                              <div
+                                class="t-loading__dot"
+                                style="animation-duration: 0.8s; animation-delay: 0.26666666666666666s;"
+                              />
+                              <div
+                                class="t-loading__dot"
+                                style="animation-duration: 0.8s; animation-delay: 0.5333333333333333s;"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                        <img
+                          class="t-image__img t-image--fit-fill t-image--position-center"
+                          src="https://tdesign.gtimg.com/mobile/demos/example6.png"
+                        />
+                      </div>
+                      <svg
+                        class="t-icon t-icon-close t-upload__delete-btn"
+                        fill="none"
+                        height="1em"
+                        style="fill: none;"
+                        viewBox="0 0 24 24"
+                        width="1em"
+                      >
+                        <g
+                          id="close"
+                        >
+                          <path
+                            d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+                            id="stroke1"
+                            stroke="currentColor"
+                            stroke-linecap="square"
+                            stroke-width="2"
+                          />
+                        </g>
+                      </svg>
+                    </div>
+                    <div
+                      class="t-upload__item t-upload__item--add"
+                    >
+                      <div
+                        class="t-upload__add-icon"
+                      >
+                        <svg
+                          class="t-icon t-icon-add"
+                          fill="none"
+                          height="1em"
+                          style="fill: none;"
+                          viewBox="0 0 24 24"
+                          width="1em"
+                        >
+                          <g
+                            id="add"
+                          >
+                            <path
+                              d="M12 5L12 19M19 12L5 12"
+                              id="stroke1"
+                              stroke="currentColor"
+                              stroke-linecap="square"
+                              stroke-width="2"
+                            />
+                          </g>
+                        </svg>
+                      </div>
+                    </div>
+                    <input
+                      hidden=""
+                      multiple=""
+                      type="file"
+                    />
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="button-group"
+          >
+            <button
+              class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"
+              tabindex="0"
+              type="submit"
+            >
+              <span
+                class="t-button__content"
+              >
+                 
+                提交
+              </span>
+            </button>
+            <button
+              class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"
+              tabindex="0"
+              type="reset"
+            >
+              <span
+                class="t-button__content"
+              >
+                 
+                重置
+              </span>
+            </button>
+          </div>
+        </form>
+        <div
+          class="t-popup t-popup--bottom"
+          style="display: none; animation-fill-mode: forwards;"
+        >
+          <div
+            class="t-picker"
+          >
+            <div
+              class="t-picker__toolbar"
+            >
+              <div
+                class="t-picker__cancel"
+              >
+                取消
+              </div>
+              <div
+                class="t-picker__title"
+              >
+                选择日期
+              </div>
+              <div
+                class="t-picker__confirm"
+              >
+                确定
+              </div>
+            </div>
+            <div
+              class="t-picker__main"
+            >
+              <div
+                class="t-picker-item__group"
+              >
+                <ul
+                  class="t-picker-item"
+                >
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2015 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2016 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2017 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2018 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2019 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2020 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2021 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2022 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2023 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2024 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2025 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2026 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2027 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2028 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2029 年
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    2030 年
+                  </li>
+                </ul>
+              </div>
+              <div
+                class="t-picker-item__group"
+              >
+                <ul
+                  class="t-picker-item"
+                >
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    5 月
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    6 月
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    7 月
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    8 月
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    9 月
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    10 月
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    11 月
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    12 月
+                  </li>
+                </ul>
+              </div>
+              <div
+                class="t-picker-item__group"
+              >
+                <ul
+                  class="t-picker-item"
+                >
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    5 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    6 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    7 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    8 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    9 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    10 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    11 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    12 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    13 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    14 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    15 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    16 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    17 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    18 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    19 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    20 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    21 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    22 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    23 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    24 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    25 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    26 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    27 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    28 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    29 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    30 日
+                  </li>
+                  <li
+                    class="t-picker-item__item"
+                  >
+                    31 日
+                  </li>
+                </ul>
+              </div>
+              <div
+                class="t-picker__mask t-picker__mask--top"
+              />
+              <div
+                class="t-picker__mask t-picker__mask--bottom"
+              />
+              <div
+                class="t-picker__indicator"
+              />
+            </div>
+          </div>
+        </div>
+        <div
+          class="t-popup t-popup--bottom"
+          style="display: none; animation-fill-mode: forwards;"
+        >
+          <div
+            class="t-cascader"
+          >
+            <div
+              class="t-cascader__title"
+            >
+              选择地址
+            </div>
+            <div
+              class="t-cascader__close-btn"
+            >
+              <svg
+                class="t-icon t-icon-close"
+                fill="none"
+                height="1em"
+                style="fill: none; font-size: 24px;"
+                viewBox="0 0 24 24"
+                width="1em"
+              >
+                <g
+                  id="close"
+                >
+                  <path
+                    d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+                    id="stroke1"
+                    stroke="currentColor"
+                    stroke-linecap="square"
+                    stroke-width="2"
+                  />
+                </g>
+              </svg>
+            </div>
+            <div
+              class="t-cascader__content"
+            >
+              <div>
+                <div
+                  class="t-cascader__steps"
+                >
+                  <div
+                    class="t-cascader__step"
+                  >
+                    <div
+                      class="t-cascader__step-dot t-cascader__step-dot--active"
+                    />
+                    <div
+                      class="t-cascader__step-label"
+                    >
+                      天津市
+                    </div>
+                    <svg
+                      class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                      fill="none"
+                      height="1em"
+                      style="fill: none; font-size: 22px;"
+                      viewBox="0 0 24 24"
+                      width="1em"
+                    >
+                      <g
+                        id="chevron-right"
+                      >
+                        <path
+                          d="M9.5 17.5L15 12L9.5 6.5"
+                          id="stroke1"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
+                        />
+                      </g>
+                    </svg>
+                  </div>
+                  <div
+                    class="t-cascader__step"
+                  >
+                    <div
+                      class="t-cascader__step-dot t-cascader__step-dot--active"
+                    />
+                    <div
+                      class="t-cascader__step-label"
+                    >
+                      天津市
+                    </div>
+                    <svg
+                      class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                      fill="none"
+                      height="1em"
+                      style="fill: none; font-size: 22px;"
+                      viewBox="0 0 24 24"
+                      width="1em"
+                    >
+                      <g
+                        id="chevron-right"
+                      >
+                        <path
+                          d="M9.5 17.5L15 12L9.5 6.5"
+                          id="stroke1"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
+                        />
+                      </g>
+                    </svg>
+                  </div>
+                  <div
+                    class="t-cascader__step"
+                  >
+                    <div
+                      class="t-cascader__step-dot t-cascader__step-dot--active t-cascader__step-dot--last"
+                    />
+                    <div
+                      class="t-cascader__step-label t-cascader__step-label--active"
+                    >
+                      蓟州区
+                    </div>
+                    <svg
+                      class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                      fill="none"
+                      height="1em"
+                      style="fill: none; font-size: 22px;"
+                      viewBox="0 0 24 24"
+                      width="1em"
+                    >
+                      <g
+                        id="chevron-right"
+                      >
+                        <path
+                          d="M9.5 17.5L15 12L9.5 6.5"
+                          id="stroke1"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
+                        />
+                      </g>
+                    </svg>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="t-cascader__options-container"
+                style="width: 300vw; transform: translateX(-200vw);"
+              >
+                <div
+                  class="t-cascader__options"
+                >
+                  <div
+                    class="t-cascader-radio-group-0"
+                  >
+                    <div
+                      class="t-radio-group t-radio-group--vertical"
+                    >
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="110000"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            北京市
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120000"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
+                        >
+                          <svg
+                            class="t-icon t-icon-check t-radio__icon-wrap"
+                            fill="none"
+                            height="1em"
+                            style="fill: none;"
+                            viewBox="0 0 24 24"
+                            width="1em"
+                          >
+                            <g
+                              id="check"
+                            >
+                              <path
+                                d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
+                                id="stroke1"
+                                stroke="currentColor"
+                                stroke-linecap="square"
+                                stroke-width="2"
+                              />
+                            </g>
+                          </svg>
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            天津市
+                          </span>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="t-cascader__options"
+                >
+                  <div
+                    class="t-cascader-radio-group-1"
+                  >
+                    <div
+                      class="t-radio-group t-radio-group--vertical"
+                    >
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          checked=""
+                          class="t-radio__original"
+                          type="radio"
+                          value="120100"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
+                        >
+                          <svg
+                            class="t-icon t-icon-check t-radio__icon-wrap"
+                            fill="none"
+                            height="1em"
+                            style="fill: none;"
+                            viewBox="0 0 24 24"
+                            width="1em"
+                          >
+                            <g
+                              id="check"
+                            >
+                              <path
+                                d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
+                                id="stroke1"
+                                stroke="currentColor"
+                                stroke-linecap="square"
+                                stroke-width="2"
+                              />
+                            </g>
+                          </svg>
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            天津市
+                          </span>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="t-cascader__options"
+                >
+                  <div
+                    class="t-cascader-radio-group-2"
+                  >
+                    <div
+                      class="t-radio-group t-radio-group--vertical"
+                    >
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120101"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            和平区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120102"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            河东区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120103"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            河西区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120104"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            南开区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120105"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            河北区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120106"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            红桥区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120110"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            东丽区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120111"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            西青区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120112"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            津南区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120113"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            北辰区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120114"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            武清区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120115"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            宝坻区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120116"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            滨海新区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120117"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            宁河区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          class="t-radio__original"
+                          type="radio"
+                          value="120118"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right"
+                        >
+                          <div
+                            class="placeholder"
+                          />
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            静海区
+                          </span>
+                        </div>
+                      </div>
+                      <div
+                        class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                      >
+                        <input
+                          checked=""
+                          class="t-radio__original"
+                          type="radio"
+                          value="120119"
+                        />
+                        <div
+                          class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
+                        >
+                          <svg
+                            class="t-icon t-icon-check t-radio__icon-wrap"
+                            fill="none"
+                            height="1em"
+                            style="fill: none;"
+                            viewBox="0 0 24 24"
+                            width="1em"
+                          >
+                            <g
+                              id="check"
+                            >
+                              <path
+                                d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
+                                id="stroke1"
+                                stroke="currentColor"
+                                stroke-linecap="square"
+                                stroke-width="2"
+                              />
+                            </g>
+                          </svg>
+                        </div>
+                        <div
+                          class="t-radio__content"
+                        >
+                          <span
+                            class="t-radio__title"
+                            style="-webkit-line-clamp: 3;"
+                          >
+                            蓟州区
+                          </span>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`csr snapshot test > csr test src/form/_example/vertical.tsx 1`] = `
+<div>
+  <form
+    class="t-form"
+  >
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__name t-form__item--bordered t-form--top t-form-item__name t-form__item-with-help"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            用户名
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-input t-input--layout-horizontal"
+            >
+              <div
+                class="t-input__wrap--prefix"
+              >
+                <div
+                  class="t-input__label"
+                />
+              </div>
+              <div
+                class="t-input__wrap"
+              >
+                <div
+                  class="t-input__content t-input--default"
+                >
+                  <input
+                    class="t-input__control t-input--default"
+                    placeholder="请输入内容"
+                    spellcheck="false"
+                    style="--td-input-cursor-color: #0052d9;"
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="t-form__item-help t-form__controls--undefined"
+          >
+            输入用户名
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__password t-form__item--bordered t-form--top t-form-item__password"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            密码
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-input t-input--layout-horizontal"
+            >
+              <div
+                class="t-input__wrap--prefix"
+              >
+                <div
+                  class="t-input__label"
+                />
+              </div>
+              <div
+                class="t-input__wrap"
+              >
+                <div
+                  class="t-input__content t-input--default"
+                >
+                  <input
+                    class="t-input__control t-input--default t-input--password"
+                    placeholder="请输入内容"
+                    spellcheck="false"
+                    style="--td-input-cursor-color: #0052d9;"
+                    type="password"
+                    value=""
+                  />
+                  <div
+                    class="t-input__wrap--suffix-icon"
+                  >
+                    <svg
+                      class="t-icon t-icon-browse-off"
+                      fill="none"
+                      height="1em"
+                      style="fill: none;"
+                      viewBox="0 0 24 24"
+                      width="1em"
+                    >
+                      <defs>
+                        <mask
+                          height="24"
+                          id="t-icon-browse-off-instance-_r_mq_-overlap-stroke1"
+                          mask-type="luminance"
+                          maskContentUnits="userSpaceOnUse"
+                          maskUnits="userSpaceOnUse"
+                          width="24"
+                          x="0"
+                          y="0"
+                        >
+                          <rect
+                            fill="#fff"
+                            height="24"
+                            width="24"
+                            x="0"
+                            y="0"
+                          />
+                          <path
+                            d="M20.9996 21L3 3"
+                            fill="none"
+                            stroke="#000"
+                            stroke-linecap="square"
+                            stroke-width="2"
+                          />
+                        </mask>
+                      </defs>
+                      <g
+                        id="browse-off"
+                      >
+                        <path
+                          d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z"
+                          id="stroke1"
+                          mask="url(#t-icon-browse-off-instance-_r_mq_-overlap-stroke1)"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
+                        />
+                        <path
+                          d="M20.9996 21L3 3"
+                          id="stroke2"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
+                        />
+                      </g>
+                    </svg>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__gender t-form__item--bordered t-form--top t-form-item__gender"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            性别
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-radio-group t-radio-group--vertical box"
+            >
+              <div
+                class="t-radio t-radio--left t-radio--vertical"
+              >
+                <input
+                  class="t-radio__original"
+                  name="radio"
+                  type="radio"
+                  value="man"
+                />
+                <div
+                  class="t-radio__icon t-radio__icon--left"
+                >
+                  <div
+                    class="t-radio__icon-circle"
+                  />
+                </div>
+                <div
+                  class="t-radio__content"
+                >
+                  <span
+                    class="t-radio__title"
+                    style="-webkit-line-clamp: 3;"
+                  >
+                    男
+                  </span>
+                </div>
+              </div>
+              <div
+                class="t-radio t-radio--left t-radio--vertical"
+              >
+                <input
+                  class="t-radio__original"
+                  name="radio"
+                  type="radio"
+                  value="women"
+                />
+                <div
+                  class="t-radio__icon t-radio__icon--left"
+                >
+                  <div
+                    class="t-radio__icon-circle"
+                  />
+                </div>
+                <div
+                  class="t-radio__content"
+                >
+                  <span
+                    class="t-radio__title"
+                    style="-webkit-line-clamp: 3;"
+                  >
+                    女
+                  </span>
+                </div>
+              </div>
+              <div
+                class="t-radio t-radio--left t-radio--vertical"
+              >
+                <input
+                  class="t-radio__original"
+                  name="radio"
+                  type="radio"
+                  value="secret"
+                />
+                <div
+                  class="t-radio__icon t-radio__icon--left"
+                >
+                  <div
+                    class="t-radio__icon-circle"
+                  />
+                </div>
+                <div
+                  class="t-radio__content"
+                >
+                  <span
+                    class="t-radio__title"
+                    style="-webkit-line-clamp: 3;"
+                  >
+                    保密
+                  </span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__birth t-form__item--bordered t-form--top t-form-item__birth"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            生日
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-input t-input--layout-horizontal"
+            >
+              <div
+                class="t-input__wrap--prefix"
+              >
+                <div
+                  class="t-input__label"
+                />
+              </div>
+              <div
+                class="t-input__wrap"
+              >
+                <div
+                  class="t-input__content t-input--default"
+                >
+                  <input
+                    class="t-input__control t-input--default"
+                    placeholder="请输入内容"
+                    readonly=""
+                    spellcheck="false"
+                    style="--td-input-cursor-color: #0052d9;"
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <svg
+        class="t-icon t-icon-chevron-right t-form__item-arrow"
+        fill="none"
+        height="1em"
+        style="fill: none;"
+        viewBox="0 0 24 24"
+        width="1em"
+      >
+        <g
+          id="chevron-right"
+        >
+          <path
+            d="M9.5 17.5L15 12L9.5 6.5"
+            id="stroke1"
+            stroke="currentColor"
+            stroke-linecap="square"
+            stroke-width="2"
+          />
+        </g>
+      </svg>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__place t-form__item--bordered t-form--top t-form-item__place"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            籍贯
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-input t-input--layout-horizontal"
+            >
+              <div
+                class="t-input__wrap--prefix"
+              >
+                <div
+                  class="t-input__label"
+                />
+              </div>
+              <div
+                class="t-input__wrap"
+              >
+                <div
+                  class="t-input__content t-input--default"
+                >
+                  <input
+                    class="t-input__control t-input--default"
+                    placeholder="请输入内容"
+                    readonly=""
+                    spellcheck="false"
+                    style="--td-input-cursor-color: #0052d9;"
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <svg
+        class="t-icon t-icon-chevron-right t-form__item-arrow"
+        fill="none"
+        height="1em"
+        style="fill: none;"
+        viewBox="0 0 24 24"
+        width="1em"
+      >
+        <g
+          id="chevron-right"
+        >
+          <path
+            d="M9.5 17.5L15 12L9.5 6.5"
+            id="stroke1"
+            stroke="currentColor"
+            stroke-linecap="square"
+            stroke-width="2"
+          />
+        </g>
+      </svg>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__age t-form__item--bordered t-form--top t-form-item__age"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            年限
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-stepper t-stepper--medium"
+            >
+              <div
+                class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"
+              >
+                <svg
+                  class="t-icon t-icon-remove t-stepper__minus-icon"
+                  fill="none"
+                  height="1em"
+                  style="fill: none;"
+                  viewBox="0 0 24 24"
+                  width="1em"
+                >
+                  <g
+                    id="remove"
+                  >
+                    <path
+                      d="M19 12L5 12"
+                      id="stroke1"
+                      stroke="currentColor"
+                      stroke-linecap="square"
+                      stroke-width="2"
+                    />
+                  </g>
+                </svg>
+              </div>
+              <input
+                class="t-stepper__input t-stepper__input--filled t-stepper__input--medium"
+                inputmode="numeric"
+                type="tel"
+                value="3"
+              />
+              <div
+                class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"
+              >
+                <svg
+                  class="t-icon t-icon-add t-stepper__plus-icon"
+                  fill="none"
+                  height="1em"
+                  style="fill: none;"
+                  viewBox="0 0 24 24"
+                  width="1em"
+                >
+                  <g
+                    id="add"
+                  >
+                    <path
+                      d="M12 5L12 19M19 12L5 12"
+                      id="stroke1"
+                      stroke="currentColor"
+                      stroke-linecap="square"
+                      stroke-width="2"
+                    />
+                  </g>
+                </svg>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__description t-form__item--bordered t-form--top t-form-item__description"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            自我评价
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-rate"
+            >
+              <div
+                class="t-rate__wrapper"
+                style="gap: 8px;"
+              >
+                <div
+                  class="t-rate__icon t-rate__icon--selected"
+                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                >
+                  <svg
+                    class="t-icon t-icon-star-filled"
+                    fill="none"
+                    height="1em"
+                    style="fill: none;"
+                    viewBox="0 0 24 24"
+                    width="1em"
+                  >
+                    <path
+                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
+                      fill="currentColor"
+                    />
+                  </svg>
+                </div>
+                <div
+                  class="t-rate__icon t-rate__icon--selected"
+                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                >
+                  <svg
+                    class="t-icon t-icon-star-filled"
+                    fill="none"
+                    height="1em"
+                    style="fill: none;"
+                    viewBox="0 0 24 24"
+                    width="1em"
+                  >
+                    <path
+                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
+                      fill="currentColor"
+                    />
+                  </svg>
+                </div>
+                <div
+                  class="t-rate__icon t-rate__icon--unselected"
+                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                >
+                  <svg
+                    class="t-icon t-icon-star-filled"
+                    fill="none"
+                    height="1em"
+                    style="fill: none;"
+                    viewBox="0 0 24 24"
+                    width="1em"
+                  >
+                    <path
+                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
+                      fill="currentColor"
+                    />
+                  </svg>
+                </div>
+                <div
+                  class="t-rate__icon t-rate__icon--unselected"
+                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                >
+                  <svg
+                    class="t-icon t-icon-star-filled"
+                    fill="none"
+                    height="1em"
+                    style="fill: none;"
+                    viewBox="0 0 24 24"
+                    width="1em"
+                  >
+                    <path
+                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
+                      fill="currentColor"
+                    />
+                  </svg>
+                </div>
+                <div
+                  class="t-rate__icon t-rate__icon--unselected"
+                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                >
+                  <svg
+                    class="t-icon t-icon-star-filled"
+                    fill="none"
+                    height="1em"
+                    style="fill: none;"
+                    viewBox="0 0 24 24"
+                    width="1em"
+                  >
+                    <path
+                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
+                      fill="currentColor"
+                    />
+                  </svg>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__resume t-form__item--bordered t-form--top t-form-item__resume"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            个人简介
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-textarea t-textarea--layout-horizontal textarea"
+            >
+              <div
+                class="t-textarea__wrapper"
+              >
+                <textarea
+                  class="t-textarea__wrapper-inner t-textarea__placeholder"
+                  placeholder="请输入个人简介"
+                  style="caret-color: #0052d9; min-height: -4px;"
+                />
+                <div
+                  class="t-textarea__indicator"
+                >
+                  0/50
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="t-form__item t-form__item--bordered t-form--top t-form-item__photo t-form__item--bordered t-form--top t-form-item__photo"
+    >
+      <div
+        class="t-form__item-wrap t-form__item--top"
+      >
+        <div
+          class="t-form__label t-form__label--top"
+        >
+          <label
+            for=""
+          >
+            上传照片
+          </label>
+        </div>
+        <div
+          class="t-form__controls"
+        >
+          <div
+            class="t-form__controls-content t-form__controls--undefined"
+          >
+            <div
+              class="t-upload t-upload--grid upload"
+            >
+              <div
+                class="t-upload__item"
+              >
+                <div
+                  class="t-image t-image--round t-upload__image"
+                >
+                  <div
+                    class="t-image__mask"
+                  >
+                    <div
+                      class="t-loading t-loading--center"
+                      style="color: inherit; font-size: 20px;"
+                    >
+                      <div
+                        class="t-loading__dots"
+                        style="animation-duration: 800ms; width: 20px; height: 20px;"
+                      >
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0s;"
+                        />
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0.26666666666666666s;"
+                        />
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0.5333333333333333s;"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <img
+                    class="t-image__img t-image--fit-fill t-image--position-center"
+                    src="https://tdesign.gtimg.com/mobile/demos/example4.png"
+                  />
+                </div>
+                <svg
+                  class="t-icon t-icon-close t-upload__delete-btn"
+                  fill="none"
+                  height="1em"
+                  style="fill: none;"
+                  viewBox="0 0 24 24"
+                  width="1em"
+                >
+                  <g
+                    id="close"
+                  >
+                    <path
+                      d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+                      id="stroke1"
+                      stroke="currentColor"
+                      stroke-linecap="square"
+                      stroke-width="2"
+                    />
+                  </g>
+                </svg>
+              </div>
+              <div
+                class="t-upload__item"
+              >
+                <div
+                  class="t-image t-image--round t-upload__image"
+                >
+                  <div
+                    class="t-image__mask"
+                  >
+                    <div
+                      class="t-loading t-loading--center"
+                      style="color: inherit; font-size: 20px;"
+                    >
+                      <div
+                        class="t-loading__dots"
+                        style="animation-duration: 800ms; width: 20px; height: 20px;"
+                      >
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0s;"
+                        />
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0.26666666666666666s;"
+                        />
+                        <div
+                          class="t-loading__dot"
+                          style="animation-duration: 0.8s; animation-delay: 0.5333333333333333s;"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <img
+                    class="t-image__img t-image--fit-fill t-image--position-center"
+                    src="https://tdesign.gtimg.com/mobile/demos/example6.png"
+                  />
+                </div>
+                <svg
+                  class="t-icon t-icon-close t-upload__delete-btn"
+                  fill="none"
+                  height="1em"
+                  style="fill: none;"
+                  viewBox="0 0 24 24"
+                  width="1em"
+                >
+                  <g
+                    id="close"
+                  >
+                    <path
+                      d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+                      id="stroke1"
+                      stroke="currentColor"
+                      stroke-linecap="square"
+                      stroke-width="2"
+                    />
+                  </g>
+                </svg>
+              </div>
+              <div
+                class="t-upload__item t-upload__item--add"
+              >
+                <div
+                  class="t-upload__add-icon"
+                >
+                  <svg
+                    class="t-icon t-icon-add"
+                    fill="none"
+                    height="1em"
+                    style="fill: none;"
+                    viewBox="0 0 24 24"
+                    width="1em"
+                  >
+                    <g
+                      id="add"
+                    >
+                      <path
+                        d="M12 5L12 19M19 12L5 12"
+                        id="stroke1"
+                        stroke="currentColor"
+                        stroke-linecap="square"
+                        stroke-width="2"
+                      />
+                    </g>
+                  </svg>
+                </div>
+              </div>
+              <input
+                hidden=""
+                multiple=""
+                type="file"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="button-group"
+    >
+      <button
+        class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"
+        tabindex="0"
+        type="submit"
+      >
+        <span
+          class="t-button__content"
+        >
+           
+          提交
+        </span>
+      </button>
+      <button
+        class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"
+        tabindex="0"
+        type="reset"
+      >
+        <span
+          class="t-button__content"
+        >
+           
+          重置
+        </span>
+      </button>
+    </div>
+  </form>
+  <div
+    class="t-popup t-popup--bottom"
+    style="display: none; animation-fill-mode: forwards;"
+  >
+    <div
+      class="t-picker"
+    >
+      <div
+        class="t-picker__toolbar"
+      >
+        <div
+          class="t-picker__cancel"
+        >
+          取消
+        </div>
+        <div
+          class="t-picker__title"
+        >
+          选择日期
+        </div>
+        <div
+          class="t-picker__confirm"
+        >
+          确定
+        </div>
+      </div>
+      <div
+        class="t-picker__main"
+      >
+        <div
+          class="t-picker-item__group"
+        >
+          <ul
+            class="t-picker-item"
+          >
+            <li
+              class="t-picker-item__item"
+            >
+              2015 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2016 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2017 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2018 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2019 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2020 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2021 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2022 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2023 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2024 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2025 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2026 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2027 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2028 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2029 年
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              2030 年
+            </li>
+          </ul>
+        </div>
+        <div
+          class="t-picker-item__group"
+        >
+          <ul
+            class="t-picker-item"
+          >
+            <li
+              class="t-picker-item__item"
+            >
+              5 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              6 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              7 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              8 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              9 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              10 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              11 月
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              12 月
+            </li>
+          </ul>
+        </div>
+        <div
+          class="t-picker-item__group"
+        >
+          <ul
+            class="t-picker-item"
+          >
+            <li
+              class="t-picker-item__item"
+            >
+              5 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              6 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              7 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              8 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              9 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              10 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              11 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              12 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              13 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              14 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              15 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              16 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              17 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              18 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              19 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              20 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              21 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              22 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              23 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              24 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              25 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              26 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              27 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              28 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              29 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              30 日
+            </li>
+            <li
+              class="t-picker-item__item"
+            >
+              31 日
+            </li>
+          </ul>
+        </div>
+        <div
+          class="t-picker__mask t-picker__mask--top"
+        />
+        <div
+          class="t-picker__mask t-picker__mask--bottom"
+        />
+        <div
+          class="t-picker__indicator"
+        />
+      </div>
+    </div>
+  </div>
+  <div
+    class="t-popup t-popup--bottom"
+    style="display: none; animation-fill-mode: forwards;"
+  >
+    <div
+      class="t-cascader"
+    >
+      <div
+        class="t-cascader__title"
+      >
+        选择地址
+      </div>
+      <div
+        class="t-cascader__close-btn"
+      >
+        <svg
+          class="t-icon t-icon-close"
+          fill="none"
+          height="1em"
+          style="fill: none; font-size: 24px;"
+          viewBox="0 0 24 24"
+          width="1em"
+        >
+          <g
+            id="close"
+          >
+            <path
+              d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029"
+              id="stroke1"
+              stroke="currentColor"
+              stroke-linecap="square"
+              stroke-width="2"
+            />
+          </g>
+        </svg>
+      </div>
+      <div
+        class="t-cascader__content"
+      >
+        <div>
+          <div
+            class="t-cascader__steps"
+          >
+            <div
+              class="t-cascader__step"
+            >
+              <div
+                class="t-cascader__step-dot t-cascader__step-dot--active"
+              />
+              <div
+                class="t-cascader__step-label"
+              >
+                天津市
+              </div>
+              <svg
+                class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                fill="none"
+                height="1em"
+                style="fill: none; font-size: 22px;"
+                viewBox="0 0 24 24"
+                width="1em"
+              >
+                <g
+                  id="chevron-right"
+                >
+                  <path
+                    d="M9.5 17.5L15 12L9.5 6.5"
+                    id="stroke1"
+                    stroke="currentColor"
+                    stroke-linecap="square"
+                    stroke-width="2"
+                  />
+                </g>
+              </svg>
+            </div>
+            <div
+              class="t-cascader__step"
+            >
+              <div
+                class="t-cascader__step-dot t-cascader__step-dot--active"
+              />
+              <div
+                class="t-cascader__step-label"
+              >
+                天津市
+              </div>
+              <svg
+                class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                fill="none"
+                height="1em"
+                style="fill: none; font-size: 22px;"
+                viewBox="0 0 24 24"
+                width="1em"
+              >
+                <g
+                  id="chevron-right"
+                >
+                  <path
+                    d="M9.5 17.5L15 12L9.5 6.5"
+                    id="stroke1"
+                    stroke="currentColor"
+                    stroke-linecap="square"
+                    stroke-width="2"
+                  />
+                </g>
+              </svg>
+            </div>
+            <div
+              class="t-cascader__step"
+            >
+              <div
+                class="t-cascader__step-dot t-cascader__step-dot--active t-cascader__step-dot--last"
+              />
+              <div
+                class="t-cascader__step-label t-cascader__step-label--active"
+              >
+                蓟州区
+              </div>
+              <svg
+                class="t-icon t-icon-chevron-right t-cascader__step-arrow"
+                fill="none"
+                height="1em"
+                style="fill: none; font-size: 22px;"
+                viewBox="0 0 24 24"
+                width="1em"
+              >
+                <g
+                  id="chevron-right"
+                >
+                  <path
+                    d="M9.5 17.5L15 12L9.5 6.5"
+                    id="stroke1"
+                    stroke="currentColor"
+                    stroke-linecap="square"
+                    stroke-width="2"
+                  />
+                </g>
+              </svg>
+            </div>
+          </div>
+        </div>
+        <div
+          class="t-cascader__options-container"
+          style="width: 300vw; transform: translateX(-200vw);"
+        >
+          <div
+            class="t-cascader__options"
+          >
+            <div
+              class="t-cascader-radio-group-0"
+            >
+              <div
+                class="t-radio-group t-radio-group--vertical"
+              >
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="110000"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      北京市
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120000"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
                   >
                     <svg
-                      class="t-icon t-icon-browse-off"
+                      class="t-icon t-icon-check t-radio__icon-wrap"
                       fill="none"
                       height="1em"
                       style="fill: none;"
                       viewBox="0 0 24 24"
                       width="1em"
                     >
-                      <defs>
-                        <mask
-                          height="24"
-                          id="t-icon-browse-off-instance-_r_mq_-overlap-stroke1"
-                          mask-type="luminance"
-                          maskContentUnits="userSpaceOnUse"
-                          maskUnits="userSpaceOnUse"
-                          width="24"
-                          x="0"
-                          y="0"
-                        >
-                          <rect
-                            fill="#fff"
-                            height="24"
-                            width="24"
-                            x="0"
-                            y="0"
-                          />
-                          <path
-                            d="M20.9996 21L3 3"
-                            fill="none"
-                            stroke="#000"
-                            stroke-linecap="square"
-                            stroke-width="2"
-                          />
-                        </mask>
-                      </defs>
                       <g
-                        id="browse-off"
+                        id="check"
                       >
                         <path
-                          d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z"
+                          d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
                           id="stroke1"
-                          mask="url(#t-icon-browse-off-instance-_r_mq_-overlap-stroke1)"
                           stroke="currentColor"
                           stroke-linecap="square"
                           stroke-width="2"
                         />
+                      </g>
+                    </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      天津市
+                    </span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="t-cascader__options"
+          >
+            <div
+              class="t-cascader-radio-group-1"
+            >
+              <div
+                class="t-radio-group t-radio-group--vertical"
+              >
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    checked=""
+                    class="t-radio__original"
+                    type="radio"
+                    value="120100"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
+                  >
+                    <svg
+                      class="t-icon t-icon-check t-radio__icon-wrap"
+                      fill="none"
+                      height="1em"
+                      style="fill: none;"
+                      viewBox="0 0 24 24"
+                      width="1em"
+                    >
+                      <g
+                        id="check"
+                      >
                         <path
-                          d="M20.9996 21L3 3"
-                          id="stroke2"
+                          d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
+                          id="stroke1"
                           stroke="currentColor"
                           stroke-linecap="square"
                           stroke-width="2"
@@ -62452,366 +66524,462 @@ exports[`csr snapshot test > csr test src/form/_example/vertical.tsx 1`] = `
                       </g>
                     </svg>
                   </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      天津市
+                    </span>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-      </div>
-    </div>
-    <div
-      class="t-form__item t-form__item--bordered t-form--top t-form-item__gender t-form__item--bordered t-form--top t-form-item__gender"
-    >
-      <div
-        class="t-form__item-wrap t-form__item--top"
-      >
-        <div
-          class="t-form__label t-form__label--top"
-        >
-          <label
-            for=""
-          >
-            性别
-          </label>
-        </div>
-        <div
-          class="t-form__controls"
-        >
           <div
-            class="t-form__controls-content t-form__controls--undefined"
+            class="t-cascader__options"
           >
             <div
-              class="t-radio-group t-radio-group--vertical box"
+              class="t-cascader-radio-group-2"
             >
               <div
-                class="t-radio t-radio--left t-radio--vertical"
+                class="t-radio-group t-radio-group--vertical"
               >
-                <input
-                  class="t-radio__original"
-                  name="radio"
-                  type="radio"
-                  value="man"
-                />
                 <div
-                  class="t-radio__icon t-radio__icon--left"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <div
-                    class="t-radio__icon-circle"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120101"
                   />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      和平区
+                    </span>
+                  </div>
                 </div>
                 <div
-                  class="t-radio__content"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <span
-                    class="t-radio__title"
-                    style="-webkit-line-clamp: 3;"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120102"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    男
-                  </span>
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      河东区
+                    </span>
+                  </div>
                 </div>
-              </div>
-              <div
-                class="t-radio t-radio--left t-radio--vertical"
-              >
-                <input
-                  class="t-radio__original"
-                  name="radio"
-                  type="radio"
-                  value="woman"
-                />
                 <div
-                  class="t-radio__icon t-radio__icon--left"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120103"
+                  />
                   <div
-                    class="t-radio__icon-circle"
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      河西区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120104"
                   />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      南开区
+                    </span>
+                  </div>
                 </div>
                 <div
-                  class="t-radio__content"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <span
-                    class="t-radio__title"
-                    style="-webkit-line-clamp: 3;"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120105"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    女
-                  </span>
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      河北区
+                    </span>
+                  </div>
                 </div>
-              </div>
-              <div
-                class="t-radio t-radio--left t-radio--vertical"
-              >
-                <input
-                  class="t-radio__original"
-                  name="radio"
-                  type="radio"
-                  value="secret"
-                />
                 <div
-                  class="t-radio__icon t-radio__icon--left"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120106"
+                  />
                   <div
-                    class="t-radio__icon-circle"
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      红桥区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
+                >
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120110"
                   />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
+                  >
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      东丽区
+                    </span>
+                  </div>
                 </div>
                 <div
-                  class="t-radio__content"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <span
-                    class="t-radio__title"
-                    style="-webkit-line-clamp: 3;"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120111"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    保密
-                  </span>
+                    <div
+                      class="placeholder"
+                    />
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      西青区
+                    </span>
+                  </div>
                 </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div
-      class="t-form__item t-form__item--bordered t-form--top t-form-item__age t-form__item--bordered t-form--top t-form-item__age"
-    >
-      <div
-        class="t-form__item-wrap t-form__item--top"
-      >
-        <div
-          class="t-form__label t-form__label--top"
-        >
-          <label
-            for=""
-          >
-            年限
-          </label>
-        </div>
-        <div
-          class="t-form__controls"
-        >
-          <div
-            class="t-form__controls-content t-form__controls--left"
-          >
-            <div
-              class="t-stepper t-stepper--medium"
-            >
-              <div
-                class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"
-              >
-                <svg
-                  class="t-icon t-icon-remove t-stepper__minus-icon"
-                  fill="none"
-                  height="1em"
-                  style="fill: none;"
-                  viewBox="0 0 24 24"
-                  width="1em"
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <g
-                    id="remove"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120112"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    <path
-                      d="M19 12L5 12"
-                      id="stroke1"
-                      stroke="currentColor"
-                      stroke-linecap="square"
-                      stroke-width="2"
+                    <div
+                      class="placeholder"
                     />
-                  </g>
-                </svg>
-              </div>
-              <input
-                class="t-stepper__input t-stepper__input--filled t-stepper__input--medium"
-                inputmode="numeric"
-                type="tel"
-                value="0"
-              />
-              <div
-                class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"
-              >
-                <svg
-                  class="t-icon t-icon-add t-stepper__plus-icon"
-                  fill="none"
-                  height="1em"
-                  style="fill: none;"
-                  viewBox="0 0 24 24"
-                  width="1em"
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      津南区
+                    </span>
+                  </div>
+                </div>
+                <div
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <g
-                    id="add"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120113"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    <path
-                      d="M12 5L12 19M19 12L5 12"
-                      id="stroke1"
-                      stroke="currentColor"
-                      stroke-linecap="square"
-                      stroke-width="2"
+                    <div
+                      class="placeholder"
                     />
-                  </g>
-                </svg>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div
-      class="t-form__item t-form__item--bordered t-form--top t-form-item__description t-form__item--bordered t-form--top t-form-item__description"
-    >
-      <div
-        class="t-form__item-wrap t-form__item--top"
-      >
-        <div
-          class="t-form__label t-form__label--top"
-        >
-          <label
-            for=""
-          >
-            自我评价
-          </label>
-        </div>
-        <div
-          class="t-form__controls"
-        >
-          <div
-            class="t-form__controls-content t-form__controls--left"
-          >
-            <div
-              class="t-rate"
-            >
-              <div
-                class="t-rate__wrapper"
-                style="gap: 8px;"
-              >
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      北辰区
+                    </span>
+                  </div>
+                </div>
                 <div
-                  class="t-rate__icon t-rate__icon--unselected"
-                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <svg
-                    class="t-icon t-icon-star-filled"
-                    fill="none"
-                    height="1em"
-                    style="fill: none;"
-                    viewBox="0 0 24 24"
-                    width="1em"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120114"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    <path
-                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
-                      fill="currentColor"
+                    <div
+                      class="placeholder"
                     />
-                  </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      武清区
+                    </span>
+                  </div>
                 </div>
                 <div
-                  class="t-rate__icon t-rate__icon--unselected"
-                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <svg
-                    class="t-icon t-icon-star-filled"
-                    fill="none"
-                    height="1em"
-                    style="fill: none;"
-                    viewBox="0 0 24 24"
-                    width="1em"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120115"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    <path
-                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
-                      fill="currentColor"
+                    <div
+                      class="placeholder"
                     />
-                  </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      宝坻区
+                    </span>
+                  </div>
                 </div>
                 <div
-                  class="t-rate__icon t-rate__icon--unselected"
-                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <svg
-                    class="t-icon t-icon-star-filled"
-                    fill="none"
-                    height="1em"
-                    style="fill: none;"
-                    viewBox="0 0 24 24"
-                    width="1em"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120116"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    <path
-                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
-                      fill="currentColor"
+                    <div
+                      class="placeholder"
                     />
-                  </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      滨海新区
+                    </span>
+                  </div>
                 </div>
                 <div
-                  class="t-rate__icon t-rate__icon--unselected"
-                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <svg
-                    class="t-icon t-icon-star-filled"
-                    fill="none"
-                    height="1em"
-                    style="fill: none;"
-                    viewBox="0 0 24 24"
-                    width="1em"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120117"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    <path
-                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
-                      fill="currentColor"
+                    <div
+                      class="placeholder"
                     />
-                  </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      宁河区
+                    </span>
+                  </div>
                 </div>
                 <div
-                  class="t-rate__icon t-rate__icon--unselected"
-                  style="font-size: 24px; --td-rate-selected-color: #ED7B2F;"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  <svg
-                    class="t-icon t-icon-star-filled"
-                    fill="none"
-                    height="1em"
-                    style="fill: none;"
-                    viewBox="0 0 24 24"
-                    width="1em"
+                  <input
+                    class="t-radio__original"
+                    type="radio"
+                    value="120118"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right"
                   >
-                    <path
-                      d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"
-                      fill="currentColor"
+                    <div
+                      class="placeholder"
                     />
-                  </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      静海区
+                    </span>
+                  </div>
                 </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div
-      class="t-form__item t-form__item--bordered t-form--top t-form-item__resume t-form__item--bordered t-form--top t-form-item__resume"
-    >
-      <div
-        class="t-form__item-wrap t-form__item--top"
-      >
-        <div
-          class="t-form__label t-form__label--top"
-        >
-          <label
-            for=""
-          >
-            个人简介
-          </label>
-        </div>
-        <div
-          class="t-form__controls"
-        >
-          <div
-            class="t-form__controls-content t-form__controls--undefined"
-          >
-            <div
-              class="t-textarea t-textarea--layout-horizontal textarea"
-            >
-              <div
-                class="t-textarea__wrapper"
-              >
-                <textarea
-                  class="t-textarea__wrapper-inner t-textarea__placeholder"
-                  placeholder="请输入个人简介"
-                  style="caret-color: #0052d9; min-height: -4px;"
-                />
                 <div
-                  class="t-textarea__indicator"
+                  class="t-radio t-radio--right t-radio--block t-radio--vertical"
                 >
-                  0/50
+                  <input
+                    checked=""
+                    class="t-radio__original"
+                    type="radio"
+                    value="120119"
+                  />
+                  <div
+                    class="t-radio__icon t-radio__icon--right t-radio__icon--checked"
+                  >
+                    <svg
+                      class="t-icon t-icon-check t-radio__icon-wrap"
+                      fill="none"
+                      height="1em"
+                      style="fill: none;"
+                      viewBox="0 0 24 24"
+                      width="1em"
+                    >
+                      <g
+                        id="check"
+                      >
+                        <path
+                          d="M19.5708 7.37842L10.3785 16.5708L5.42871 11.6211"
+                          id="stroke1"
+                          stroke="currentColor"
+                          stroke-linecap="square"
+                          stroke-width="2"
+                        />
+                      </g>
+                    </svg>
+                  </div>
+                  <div
+                    class="t-radio__content"
+                  >
+                    <span
+                      class="t-radio__title"
+                      style="-webkit-line-clamp: 3;"
+                    >
+                      蓟州区
+                    </span>
+                  </div>
                 </div>
               </div>
             </div>
@@ -62819,35 +66987,7 @@ exports[`csr snapshot test > csr test src/form/_example/vertical.tsx 1`] = `
         </div>
       </div>
     </div>
-    <div
-      class="button-group"
-    >
-      <button
-        class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"
-        tabindex="0"
-        type="submit"
-      >
-        <span
-          class="t-button__content"
-        >
-           
-          提交
-        </span>
-      </button>
-      <button
-        class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"
-        tabindex="0"
-        type="reset"
-      >
-        <span
-          class="t-button__content"
-        >
-           
-          重置
-        </span>
-      </button>
-    </div>
-  </form>
+  </div>
 </div>
 `;
 
@@ -167444,11 +171584,11 @@ exports[`ssr snapshot test > ssr test src/footer/_example/links.tsx 1`] = `"<div
 
 exports[`ssr snapshot test > ssr test src/footer/_example/logo.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/logo1.png"/><div class="footer-example"><div class="t-footer "><a class="t-footer__logo"><div class="t-image t-image--square t-footer__title-url"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/logo1.png"/></div></a><div class="t-footer__text">Copyright © 2019-2023 TDesign.All Rights Reserved.</div></div></div><div class="footer-example"><div class="t-footer "><a class="t-footer__logo"><div class="t-image t-image--square t-footer__title-url"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/logo1.png"/></div></a></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/form/_example/horizontal.tsx 1`] = `"<form class="t-form"><div class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">用户名</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">请输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">密码</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_26ma_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_26ma_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">性别</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="woman"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">年限</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--left"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="0"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__description t-form__item--bordered t-form--left t-form-item__description"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">自我评价</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--left"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__resume t-form__item--bordered t-form--left t-form-item__resume"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">个人简介</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form>"`;
+exports[`ssr snapshot test > ssr test src/form/_example/horizontal.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example4.png"/><link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example6.png"/><form class="t-form"><div class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">用户名</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">密码</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_hli9_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_hli9_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">性别</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="women"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__birth t-form__item--bordered t-form--left t-form-item__birth"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">生日</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--right t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__place t-form__item--bordered t-form--left t-form-item__place"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">籍贯</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--right t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">年限</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="3"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__description t-form__item--bordered t-form--left t-form-item__description"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">自我评价</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__resume t-form__item--bordered t-form--left t-form-item__resume"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">个人简介</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__photo t-form__item--bordered t-form--left t-form-item__photo"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">上传照片</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-upload t-upload--grid upload"><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example4.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example6.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item t-upload__item--add"><div class="t-upload__add-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div><input hidden="" type="file" multiple=""/></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-picker"><div class="t-picker__toolbar"><div class="t-picker__cancel">取消</div><div class="t-picker__title">选择日期</div><div class="t-picker__confirm">确定</div></div><div class="t-picker__main"><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">2015 年</li><li class="t-picker-item__item">2016 年</li><li class="t-picker-item__item">2017 年</li><li class="t-picker-item__item">2018 年</li><li class="t-picker-item__item">2019 年</li><li class="t-picker-item__item">2020 年</li><li class="t-picker-item__item">2021 年</li><li class="t-picker-item__item">2022 年</li><li class="t-picker-item__item">2023 年</li><li class="t-picker-item__item">2024 年</li><li class="t-picker-item__item">2025 年</li><li class="t-picker-item__item">2026 年</li><li class="t-picker-item__item">2027 年</li><li class="t-picker-item__item">2028 年</li><li class="t-picker-item__item">2029 年</li><li class="t-picker-item__item">2030 年</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 月</li><li class="t-picker-item__item">6 月</li><li class="t-picker-item__item">7 月</li><li class="t-picker-item__item">8 月</li><li class="t-picker-item__item">9 月</li><li class="t-picker-item__item">10 月</li><li class="t-picker-item__item">11 月</li><li class="t-picker-item__item">12 月</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 日</li><li class="t-picker-item__item">6 日</li><li class="t-picker-item__item">7 日</li><li class="t-picker-item__item">8 日</li><li class="t-picker-item__item">9 日</li><li class="t-picker-item__item">10 日</li><li class="t-picker-item__item">11 日</li><li class="t-picker-item__item">12 日</li><li class="t-picker-item__item">13 日</li><li class="t-picker-item__item">14 日</li><li class="t-picker-item__item">15 日</li><li class="t-picker-item__item">16 日</li><li class="t-picker-item__item">17 日</li><li class="t-picker-item__item">18 日</li><li class="t-picker-item__item">19 日</li><li class="t-picker-item__item">20 日</li><li class="t-picker-item__item">21 日</li><li class="t-picker-item__item">22 日</li><li class="t-picker-item__item">23 日</li><li class="t-picker-item__item">24 日</li><li class="t-picker-item__item">25 日</li><li class="t-picker-item__item">26 日</li><li class="t-picker-item__item">27 日</li><li class="t-picker-item__item">28 日</li><li class="t-picker-item__item">29 日</li><li class="t-picker-item__item">30 日</li><li class="t-picker-item__item">31 日</li></ul></div><div class="t-picker__mask t-picker__mask--top"></div><div class="t-picker__mask t-picker__mask--bottom"></div><div class="t-picker__indicator"></div></div></div></div><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-cascader"><div class="t-cascader__title">选择地址</div><div class="t-cascader__close-btn"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close" style="fill:none;font-size:24px"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-cascader__content"><div><div class="t-cascader__steps"><div class="t-cascader__step"><div class="t-cascader__step-dot t-cascader__step-dot--last"></div><div class="t-cascader__step-label t-cascader__step-label--active">选择选项</div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-cascader__step-arrow" style="fill:none;font-size:22px"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-cascader__options-container" style="width:100vw;transform:translateX(-000vw)"><div class="t-cascader__options"><div class="t-cascader-radio-group-0"><div class="t-radio-group t-radio-group--vertical"><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="110000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">北京市</span></div></div><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="120000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">天津市</span></div></div></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/form/_example/index.tsx 1`] = `"<div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Form 表单</h1><p class="tdesign-mobile-demo-header__summary">用以收集、校验和提交数据，一般由输入框、单选框、复选框、选择器等控件组成。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2><p class="tdesign-mobile-demo-block__summary">基础表单</p></div><div class="tdesign-mobile-demo-block__slot"><div class="options"><div class="button-group"><button type="button" tabindex="0" class="t-button t-button--size-medium t-button--base t-button--light t-button--round"><span class="t-button__content"> <!-- -->水平排布</span></button><button type="button" tabindex="0" class="t-button t-button--size-medium t-button--base t-button--default t-button--round"><span class="t-button__content"> <!-- -->竖直排布</span></button></div><div class="t-cell"><div class="t-cell__left"></div><div class="t-cell__title"><div class="t-cell__title-text">禁用态</div></div><div class="t-switch t-switch--medium"><div class="t-switch__dot t-switch__dot--medium t-switch__dot--plain"><div class="t-switch__label t-switch__label--medium"></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__slot"><form class="t-form"><div class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">用户名</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">请输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">密码</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_4dckr_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_4dckr_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">性别</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="woman"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">年限</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--left"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="0"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__description t-form__item--bordered t-form--left t-form-item__description"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">自我评价</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--left"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__resume t-form__item--bordered t-form--left t-form-item__resume"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">个人简介</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/form/_example/index.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example4.png"/><link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example6.png"/><div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Form 表单</h1><p class="tdesign-mobile-demo-header__summary">用以收集、校验和提交数据，一般由输入框、单选框、复选框、选择器等控件组成。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2><p class="tdesign-mobile-demo-block__summary">基础表单</p></div><div class="tdesign-mobile-demo-block__slot"><div class="options"><div class="button-group"><button type="button" tabindex="0" class="t-button t-button--size-medium t-button--base t-button--light t-button--round"><span class="t-button__content"> <!-- -->水平排布</span></button><button type="button" tabindex="0" class="t-button t-button--size-medium t-button--base t-button--default t-button--round"><span class="t-button__content"> <!-- -->竖直排布</span></button></div><div class="t-cell"><div class="t-cell__left"></div><div class="t-cell__title"><div class="t-cell__title-text">禁用态</div></div><div class="t-switch t-switch--medium"><div class="t-switch__dot t-switch__dot--medium t-switch__dot--plain"><div class="t-switch__label t-switch__label--medium"></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__slot"><form class="t-form"><div class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">用户名</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">密码</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_13b4ir_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_13b4ir_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">性别</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="women"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__birth t-form__item--bordered t-form--left t-form-item__birth"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">生日</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--right t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__place t-form__item--bordered t-form--left t-form-item__place"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">籍贯</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--right t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">年限</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="3"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__description t-form__item--bordered t-form--left t-form-item__description"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">自我评价</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__resume t-form__item--bordered t-form--left t-form-item__resume"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">个人简介</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__photo t-form__item--bordered t-form--left t-form-item__photo"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">上传照片</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-upload t-upload--grid upload"><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example4.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example6.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item t-upload__item--add"><div class="t-upload__add-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div><input hidden="" type="file" multiple=""/></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-picker"><div class="t-picker__toolbar"><div class="t-picker__cancel">取消</div><div class="t-picker__title">选择日期</div><div class="t-picker__confirm">确定</div></div><div class="t-picker__main"><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">2015 年</li><li class="t-picker-item__item">2016 年</li><li class="t-picker-item__item">2017 年</li><li class="t-picker-item__item">2018 年</li><li class="t-picker-item__item">2019 年</li><li class="t-picker-item__item">2020 年</li><li class="t-picker-item__item">2021 年</li><li class="t-picker-item__item">2022 年</li><li class="t-picker-item__item">2023 年</li><li class="t-picker-item__item">2024 年</li><li class="t-picker-item__item">2025 年</li><li class="t-picker-item__item">2026 年</li><li class="t-picker-item__item">2027 年</li><li class="t-picker-item__item">2028 年</li><li class="t-picker-item__item">2029 年</li><li class="t-picker-item__item">2030 年</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 月</li><li class="t-picker-item__item">6 月</li><li class="t-picker-item__item">7 月</li><li class="t-picker-item__item">8 月</li><li class="t-picker-item__item">9 月</li><li class="t-picker-item__item">10 月</li><li class="t-picker-item__item">11 月</li><li class="t-picker-item__item">12 月</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 日</li><li class="t-picker-item__item">6 日</li><li class="t-picker-item__item">7 日</li><li class="t-picker-item__item">8 日</li><li class="t-picker-item__item">9 日</li><li class="t-picker-item__item">10 日</li><li class="t-picker-item__item">11 日</li><li class="t-picker-item__item">12 日</li><li class="t-picker-item__item">13 日</li><li class="t-picker-item__item">14 日</li><li class="t-picker-item__item">15 日</li><li class="t-picker-item__item">16 日</li><li class="t-picker-item__item">17 日</li><li class="t-picker-item__item">18 日</li><li class="t-picker-item__item">19 日</li><li class="t-picker-item__item">20 日</li><li class="t-picker-item__item">21 日</li><li class="t-picker-item__item">22 日</li><li class="t-picker-item__item">23 日</li><li class="t-picker-item__item">24 日</li><li class="t-picker-item__item">25 日</li><li class="t-picker-item__item">26 日</li><li class="t-picker-item__item">27 日</li><li class="t-picker-item__item">28 日</li><li class="t-picker-item__item">29 日</li><li class="t-picker-item__item">30 日</li><li class="t-picker-item__item">31 日</li></ul></div><div class="t-picker__mask t-picker__mask--top"></div><div class="t-picker__mask t-picker__mask--bottom"></div><div class="t-picker__indicator"></div></div></div></div><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-cascader"><div class="t-cascader__title">选择地址</div><div class="t-cascader__close-btn"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close" style="fill:none;font-size:24px"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-cascader__content"><div><div class="t-cascader__steps"><div class="t-cascader__step"><div class="t-cascader__step-dot t-cascader__step-dot--last"></div><div class="t-cascader__step-label t-cascader__step-label--active">选择选项</div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-cascader__step-arrow" style="fill:none;font-size:22px"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-cascader__options-container" style="width:100vw;transform:translateX(-000vw)"><div class="t-cascader__options"><div class="t-cascader-radio-group-0"><div class="t-radio-group t-radio-group--vertical"><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="110000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">北京市</span></div></div><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="120000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">天津市</span></div></div></div></div></div></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/form/_example/vertical.tsx 1`] = `"<form class="t-form"><div class="t-form__item t-form__item--bordered t-form--top t-form-item__name t-form__item--bordered t-form--top t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">用户名</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">请输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__password t-form__item--bordered t-form--top t-form-item__password"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">密码</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_26ma_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_26ma_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__gender t-form__item--bordered t-form--top t-form-item__gender"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">性别</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="woman"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__age t-form__item--bordered t-form--top t-form-item__age"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">年限</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--left"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="0"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__description t-form__item--bordered t-form--top t-form-item__description"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">自我评价</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--left"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__resume t-form__item--bordered t-form--top t-form-item__resume"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">个人简介</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form>"`;
+exports[`ssr snapshot test > ssr test src/form/_example/vertical.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example4.png"/><link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example6.png"/><form class="t-form"><div class="t-form__item t-form__item--bordered t-form--top t-form-item__name t-form__item--bordered t-form--top t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">用户名</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__password t-form__item--bordered t-form--top t-form-item__password"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">密码</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_hli9_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_hli9_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__gender t-form__item--bordered t-form--top t-form-item__gender"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">性别</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="women"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__birth t-form__item--bordered t-form--top t-form-item__birth"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">生日</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__place t-form__item--bordered t-form--top t-form-item__place"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">籍贯</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__age t-form__item--bordered t-form--top t-form-item__age"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">年限</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="3"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__description t-form__item--bordered t-form--top t-form-item__description"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">自我评价</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__resume t-form__item--bordered t-form--top t-form-item__resume"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">个人简介</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__photo t-form__item--bordered t-form--top t-form-item__photo"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">上传照片</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-upload t-upload--grid upload"><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example4.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example6.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item t-upload__item--add"><div class="t-upload__add-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div><input hidden="" type="file" multiple=""/></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-picker"><div class="t-picker__toolbar"><div class="t-picker__cancel">取消</div><div class="t-picker__title">选择日期</div><div class="t-picker__confirm">确定</div></div><div class="t-picker__main"><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">2015 年</li><li class="t-picker-item__item">2016 年</li><li class="t-picker-item__item">2017 年</li><li class="t-picker-item__item">2018 年</li><li class="t-picker-item__item">2019 年</li><li class="t-picker-item__item">2020 年</li><li class="t-picker-item__item">2021 年</li><li class="t-picker-item__item">2022 年</li><li class="t-picker-item__item">2023 年</li><li class="t-picker-item__item">2024 年</li><li class="t-picker-item__item">2025 年</li><li class="t-picker-item__item">2026 年</li><li class="t-picker-item__item">2027 年</li><li class="t-picker-item__item">2028 年</li><li class="t-picker-item__item">2029 年</li><li class="t-picker-item__item">2030 年</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 月</li><li class="t-picker-item__item">6 月</li><li class="t-picker-item__item">7 月</li><li class="t-picker-item__item">8 月</li><li class="t-picker-item__item">9 月</li><li class="t-picker-item__item">10 月</li><li class="t-picker-item__item">11 月</li><li class="t-picker-item__item">12 月</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 日</li><li class="t-picker-item__item">6 日</li><li class="t-picker-item__item">7 日</li><li class="t-picker-item__item">8 日</li><li class="t-picker-item__item">9 日</li><li class="t-picker-item__item">10 日</li><li class="t-picker-item__item">11 日</li><li class="t-picker-item__item">12 日</li><li class="t-picker-item__item">13 日</li><li class="t-picker-item__item">14 日</li><li class="t-picker-item__item">15 日</li><li class="t-picker-item__item">16 日</li><li class="t-picker-item__item">17 日</li><li class="t-picker-item__item">18 日</li><li class="t-picker-item__item">19 日</li><li class="t-picker-item__item">20 日</li><li class="t-picker-item__item">21 日</li><li class="t-picker-item__item">22 日</li><li class="t-picker-item__item">23 日</li><li class="t-picker-item__item">24 日</li><li class="t-picker-item__item">25 日</li><li class="t-picker-item__item">26 日</li><li class="t-picker-item__item">27 日</li><li class="t-picker-item__item">28 日</li><li class="t-picker-item__item">29 日</li><li class="t-picker-item__item">30 日</li><li class="t-picker-item__item">31 日</li></ul></div><div class="t-picker__mask t-picker__mask--top"></div><div class="t-picker__mask t-picker__mask--bottom"></div><div class="t-picker__indicator"></div></div></div></div><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-cascader"><div class="t-cascader__title">选择地址</div><div class="t-cascader__close-btn"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close" style="fill:none;font-size:24px"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-cascader__content"><div><div class="t-cascader__steps"><div class="t-cascader__step"><div class="t-cascader__step-dot t-cascader__step-dot--last"></div><div class="t-cascader__step-label t-cascader__step-label--active">选择选项</div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-cascader__step-arrow" style="fill:none;font-size:22px"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-cascader__options-container" style="width:100vw;transform:translateX(-000vw)"><div class="t-cascader__options"><div class="t-cascader-radio-group-0"><div class="t-radio-group t-radio-group--vertical"><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="110000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">北京市</span></div></div><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="120000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">天津市</span></div></div></div></div></div></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test src/grid/_example/badge.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--dot t-badge--medium t-badge--circle t-has-count"><div class="t-badge__count"></div></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"><div class="t-badge__count">8</div></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"><div class="t-badge__count">13</div></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"><div class="t-badge__count">NEW</div></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div>"`;
 
diff --git a/test/snap/__snapshots__/ssr.test.jsx.snap b/test/snap/__snapshots__/ssr.test.jsx.snap
index 62b3bde13..62416ccdb 100644
--- a/test/snap/__snapshots__/ssr.test.jsx.snap
+++ b/test/snap/__snapshots__/ssr.test.jsx.snap
@@ -256,11 +256,11 @@ exports[`ssr snapshot test > ssr test src/footer/_example/links.tsx 1`] = `"<div
 
 exports[`ssr snapshot test > ssr test src/footer/_example/logo.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/logo1.png"/><div class="footer-example"><div class="t-footer "><a class="t-footer__logo"><div class="t-image t-image--square t-footer__title-url"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/logo1.png"/></div></a><div class="t-footer__text">Copyright © 2019-2023 TDesign.All Rights Reserved.</div></div></div><div class="footer-example"><div class="t-footer "><a class="t-footer__logo"><div class="t-image t-image--square t-footer__title-url"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/logo1.png"/></div></a></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/form/_example/horizontal.tsx 1`] = `"<form class="t-form"><div class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">用户名</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">请输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">密码</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_26ma_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_26ma_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">性别</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="woman"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">年限</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--left"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="0"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__description t-form__item--bordered t-form--left t-form-item__description"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">自我评价</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--left"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__resume t-form__item--bordered t-form--left t-form-item__resume"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">个人简介</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form>"`;
+exports[`ssr snapshot test > ssr test src/form/_example/horizontal.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example4.png"/><link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example6.png"/><form class="t-form"><div class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">用户名</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">密码</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_hli9_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_hli9_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">性别</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="women"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__birth t-form__item--bordered t-form--left t-form-item__birth"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">生日</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--right t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__place t-form__item--bordered t-form--left t-form-item__place"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">籍贯</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--right t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">年限</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="3"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__description t-form__item--bordered t-form--left t-form-item__description"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">自我评价</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__resume t-form__item--bordered t-form--left t-form-item__resume"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">个人简介</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__photo t-form__item--bordered t-form--left t-form-item__photo"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">上传照片</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-upload t-upload--grid upload"><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example4.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example6.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item t-upload__item--add"><div class="t-upload__add-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div><input hidden="" type="file" multiple=""/></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-picker"><div class="t-picker__toolbar"><div class="t-picker__cancel">取消</div><div class="t-picker__title">选择日期</div><div class="t-picker__confirm">确定</div></div><div class="t-picker__main"><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">2015 年</li><li class="t-picker-item__item">2016 年</li><li class="t-picker-item__item">2017 年</li><li class="t-picker-item__item">2018 年</li><li class="t-picker-item__item">2019 年</li><li class="t-picker-item__item">2020 年</li><li class="t-picker-item__item">2021 年</li><li class="t-picker-item__item">2022 年</li><li class="t-picker-item__item">2023 年</li><li class="t-picker-item__item">2024 年</li><li class="t-picker-item__item">2025 年</li><li class="t-picker-item__item">2026 年</li><li class="t-picker-item__item">2027 年</li><li class="t-picker-item__item">2028 年</li><li class="t-picker-item__item">2029 年</li><li class="t-picker-item__item">2030 年</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 月</li><li class="t-picker-item__item">6 月</li><li class="t-picker-item__item">7 月</li><li class="t-picker-item__item">8 月</li><li class="t-picker-item__item">9 月</li><li class="t-picker-item__item">10 月</li><li class="t-picker-item__item">11 月</li><li class="t-picker-item__item">12 月</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 日</li><li class="t-picker-item__item">6 日</li><li class="t-picker-item__item">7 日</li><li class="t-picker-item__item">8 日</li><li class="t-picker-item__item">9 日</li><li class="t-picker-item__item">10 日</li><li class="t-picker-item__item">11 日</li><li class="t-picker-item__item">12 日</li><li class="t-picker-item__item">13 日</li><li class="t-picker-item__item">14 日</li><li class="t-picker-item__item">15 日</li><li class="t-picker-item__item">16 日</li><li class="t-picker-item__item">17 日</li><li class="t-picker-item__item">18 日</li><li class="t-picker-item__item">19 日</li><li class="t-picker-item__item">20 日</li><li class="t-picker-item__item">21 日</li><li class="t-picker-item__item">22 日</li><li class="t-picker-item__item">23 日</li><li class="t-picker-item__item">24 日</li><li class="t-picker-item__item">25 日</li><li class="t-picker-item__item">26 日</li><li class="t-picker-item__item">27 日</li><li class="t-picker-item__item">28 日</li><li class="t-picker-item__item">29 日</li><li class="t-picker-item__item">30 日</li><li class="t-picker-item__item">31 日</li></ul></div><div class="t-picker__mask t-picker__mask--top"></div><div class="t-picker__mask t-picker__mask--bottom"></div><div class="t-picker__indicator"></div></div></div></div><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-cascader"><div class="t-cascader__title">选择地址</div><div class="t-cascader__close-btn"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close" style="fill:none;font-size:24px"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-cascader__content"><div><div class="t-cascader__steps"><div class="t-cascader__step"><div class="t-cascader__step-dot t-cascader__step-dot--last"></div><div class="t-cascader__step-label t-cascader__step-label--active">选择选项</div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-cascader__step-arrow" style="fill:none;font-size:22px"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-cascader__options-container" style="width:100vw;transform:translateX(-000vw)"><div class="t-cascader__options"><div class="t-cascader-radio-group-0"><div class="t-radio-group t-radio-group--vertical"><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="110000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">北京市</span></div></div><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="120000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">天津市</span></div></div></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/form/_example/index.tsx 1`] = `"<div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Form 表单</h1><p class="tdesign-mobile-demo-header__summary">用以收集、校验和提交数据，一般由输入框、单选框、复选框、选择器等控件组成。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2><p class="tdesign-mobile-demo-block__summary">基础表单</p></div><div class="tdesign-mobile-demo-block__slot"><div class="options"><div class="button-group"><button type="button" tabindex="0" class="t-button t-button--size-medium t-button--base t-button--light t-button--round"><span class="t-button__content"> <!-- -->水平排布</span></button><button type="button" tabindex="0" class="t-button t-button--size-medium t-button--base t-button--default t-button--round"><span class="t-button__content"> <!-- -->竖直排布</span></button></div><div class="t-cell"><div class="t-cell__left"></div><div class="t-cell__title"><div class="t-cell__title-text">禁用态</div></div><div class="t-switch t-switch--medium"><div class="t-switch__dot t-switch__dot--medium t-switch__dot--plain"><div class="t-switch__label t-switch__label--medium"></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__slot"><form class="t-form"><div class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">用户名</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">请输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">密码</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_4dckr_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_4dckr_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">性别</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="woman"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">年限</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--left"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="0"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__description t-form__item--bordered t-form--left t-form-item__description"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">自我评价</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--left"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__resume t-form__item--bordered t-form--left t-form-item__resume"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">个人简介</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form></div></div></div>"`;
+exports[`ssr snapshot test > ssr test src/form/_example/index.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example4.png"/><link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example6.png"/><div class="tdesign-mobile-demo"><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Form 表单</h1><p class="tdesign-mobile-demo-header__summary">用以收集、校验和提交数据，一般由输入框、单选框、复选框、选择器等控件组成。</p></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">01 组件类型</h2><p class="tdesign-mobile-demo-block__summary">基础表单</p></div><div class="tdesign-mobile-demo-block__slot"><div class="options"><div class="button-group"><button type="button" tabindex="0" class="t-button t-button--size-medium t-button--base t-button--light t-button--round"><span class="t-button__content"> <!-- -->水平排布</span></button><button type="button" tabindex="0" class="t-button t-button--size-medium t-button--base t-button--default t-button--round"><span class="t-button__content"> <!-- -->竖直排布</span></button></div><div class="t-cell"><div class="t-cell__left"></div><div class="t-cell__title"><div class="t-cell__title-text">禁用态</div></div><div class="t-switch t-switch--medium"><div class="t-switch__dot t-switch__dot--medium t-switch__dot--plain"><div class="t-switch__label t-switch__label--medium"></div></div></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__slot"><form class="t-form"><div class="t-form__item t-form__item--bordered t-form--left t-form-item__name t-form__item--bordered t-form--left t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">用户名</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__password t-form__item--bordered t-form--left t-form-item__password"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">密码</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_13b4ir_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_13b4ir_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__gender t-form__item--bordered t-form--left t-form-item__gender"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">性别</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="women"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__birth t-form__item--bordered t-form--left t-form-item__birth"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">生日</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--right t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__place t-form__item--bordered t-form--left t-form-item__place"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">籍贯</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--right t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__age t-form__item--bordered t-form--left t-form-item__age"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">年限</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="3"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__description t-form__item--bordered t-form--left t-form-item__description"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">自我评价</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--right"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__resume t-form__item--bordered t-form--left t-form-item__resume"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">个人简介</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--left t-form-item__photo t-form__item--bordered t-form--left t-form-item__photo"><div class="t-form__item-wrap t-form__item--left"><div class="t-form__label t-form__label--left" style="width:81px"><label for="">上传照片</label></div><div class="t-form__controls" style="margin-left:81px"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-upload t-upload--grid upload"><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example4.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example6.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item t-upload__item--add"><div class="t-upload__add-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div><input hidden="" type="file" multiple=""/></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-picker"><div class="t-picker__toolbar"><div class="t-picker__cancel">取消</div><div class="t-picker__title">选择日期</div><div class="t-picker__confirm">确定</div></div><div class="t-picker__main"><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">2015 年</li><li class="t-picker-item__item">2016 年</li><li class="t-picker-item__item">2017 年</li><li class="t-picker-item__item">2018 年</li><li class="t-picker-item__item">2019 年</li><li class="t-picker-item__item">2020 年</li><li class="t-picker-item__item">2021 年</li><li class="t-picker-item__item">2022 年</li><li class="t-picker-item__item">2023 年</li><li class="t-picker-item__item">2024 年</li><li class="t-picker-item__item">2025 年</li><li class="t-picker-item__item">2026 年</li><li class="t-picker-item__item">2027 年</li><li class="t-picker-item__item">2028 年</li><li class="t-picker-item__item">2029 年</li><li class="t-picker-item__item">2030 年</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 月</li><li class="t-picker-item__item">6 月</li><li class="t-picker-item__item">7 月</li><li class="t-picker-item__item">8 月</li><li class="t-picker-item__item">9 月</li><li class="t-picker-item__item">10 月</li><li class="t-picker-item__item">11 月</li><li class="t-picker-item__item">12 月</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 日</li><li class="t-picker-item__item">6 日</li><li class="t-picker-item__item">7 日</li><li class="t-picker-item__item">8 日</li><li class="t-picker-item__item">9 日</li><li class="t-picker-item__item">10 日</li><li class="t-picker-item__item">11 日</li><li class="t-picker-item__item">12 日</li><li class="t-picker-item__item">13 日</li><li class="t-picker-item__item">14 日</li><li class="t-picker-item__item">15 日</li><li class="t-picker-item__item">16 日</li><li class="t-picker-item__item">17 日</li><li class="t-picker-item__item">18 日</li><li class="t-picker-item__item">19 日</li><li class="t-picker-item__item">20 日</li><li class="t-picker-item__item">21 日</li><li class="t-picker-item__item">22 日</li><li class="t-picker-item__item">23 日</li><li class="t-picker-item__item">24 日</li><li class="t-picker-item__item">25 日</li><li class="t-picker-item__item">26 日</li><li class="t-picker-item__item">27 日</li><li class="t-picker-item__item">28 日</li><li class="t-picker-item__item">29 日</li><li class="t-picker-item__item">30 日</li><li class="t-picker-item__item">31 日</li></ul></div><div class="t-picker__mask t-picker__mask--top"></div><div class="t-picker__mask t-picker__mask--bottom"></div><div class="t-picker__indicator"></div></div></div></div><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-cascader"><div class="t-cascader__title">选择地址</div><div class="t-cascader__close-btn"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close" style="fill:none;font-size:24px"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-cascader__content"><div><div class="t-cascader__steps"><div class="t-cascader__step"><div class="t-cascader__step-dot t-cascader__step-dot--last"></div><div class="t-cascader__step-label t-cascader__step-label--active">选择选项</div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-cascader__step-arrow" style="fill:none;font-size:22px"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-cascader__options-container" style="width:100vw;transform:translateX(-000vw)"><div class="t-cascader__options"><div class="t-cascader-radio-group-0"><div class="t-radio-group t-radio-group--vertical"><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="110000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">北京市</span></div></div><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="120000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">天津市</span></div></div></div></div></div></div></div></div></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test src/form/_example/vertical.tsx 1`] = `"<form class="t-form"><div class="t-form__item t-form__item--bordered t-form--top t-form-item__name t-form__item--bordered t-form--top t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">用户名</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">请输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__password t-form__item--bordered t-form--top t-form-item__password"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">密码</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_26ma_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_26ma_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__gender t-form__item--bordered t-form--top t-form-item__gender"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">性别</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="woman"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__age t-form__item--bordered t-form--top t-form-item__age"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">年限</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--left"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium t-stepper--filled-disabled"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="0"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__description t-form__item--bordered t-form--top t-form-item__description"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">自我评价</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--left"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__resume t-form__item--bordered t-form--top t-form-item__resume"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">个人简介</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form>"`;
+exports[`ssr snapshot test > ssr test src/form/_example/vertical.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example4.png"/><link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example6.png"/><form class="t-form"><div class="t-form__item t-form__item--bordered t-form--top t-form-item__name t-form__item--bordered t-form--top t-form-item__name t-form__item-with-help"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">用户名</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div><div class="t-form__item-help t-form__controls--undefined">输入用户名</div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__password t-form__item--bordered t-form--top t-form-item__password"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">密码</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default t-input--password" type="password" placeholder="请输入内容" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/><div class="t-input__wrap--suffix-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-browse-off" style="fill:none"><defs><mask id="t-icon-browse-off-instance-_R_hli9_-overlap-stroke1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" mask-type="luminance" x="0" y="0" width="24" height="24"><rect x="0" y="0" width="24" height="24" fill="#fff"></rect><path stroke="#000" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2" fill="none"></path></mask></defs><g id="browse-off"><path id="stroke1" stroke="currentColor" d="M13.1758 8.17578C14.4396 8.56376 15.4368 9.56096 15.8247 10.8247M21.2858 15.2856C22.0085 14.2983 22.5776 13.1913 22.9578 12C21.4771 7.36017 17.131 4 12.0001 4C11.3698 4 10.7513 4.05072 10.1484 4.1483M5.80747 5.80786C3.57225 7.23888 1.86478 9.42193 1.04199 12.0001C2.52275 16.6399 6.86881 20.0001 11.9997 20.0001C14.2796 20.0001 16.4045 19.3367 18.1919 18.1923L5.80747 5.80786ZM8 12.0003C8 10.8957 8.44771 9.89573 9.17157 9.17188L14.8284 14.8287C14.1046 15.5526 13.1046 16.0003 12 16.0003C9.79086 16.0003 8 14.2094 8 12.0003Z" stroke-linecap="square" stroke-width="2" mask="url(#t-icon-browse-off-instance-_R_hli9_-overlap-stroke1)"></path><path id="stroke2" stroke="currentColor" d="M20.9996 21L3 3" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__gender t-form__item--bordered t-form--top t-form-item__gender"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">性别</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-radio-group t-radio-group--vertical box"><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="man"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">男</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="women"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">女</span></div></div><div class="t-radio t-radio--left t-radio--vertical"><input type="radio" class="t-radio__original" name="radio" value="secret"/><div class="t-radio__icon t-radio__icon--left"><div class="t-radio__icon-circle"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">保密</span></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__birth t-form__item--bordered t-form--top t-form-item__birth"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">生日</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__place t-form__item--bordered t-form--top t-form-item__place"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">籍贯</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-input t-input--layout-horizontal"><div class="t-input__wrap--prefix"><div class="t-input__label"></div></div><div class="t-input__wrap"><div class="t-input__content t-input--default"><input class="t-input__control t-input--default" type="text" placeholder="请输入内容" readOnly="" spellCheck="false" style="--td-input-cursor-color:#0052d9" value=""/></div></div></div></div></div></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-form__item-arrow" style="fill:none"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__age t-form__item--bordered t-form--top t-form-item__age"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">年限</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-stepper t-stepper--medium"><div class="t-stepper__minus t-stepper__minus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-remove t-stepper__minus-icon" style="fill:none"><g id="remove"><path id="stroke1" stroke="currentColor" d="M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div><input class="t-stepper__input t-stepper__input--filled t-stepper__input--medium" type="tel" inputMode="numeric" value="3"/><div class="t-stepper__plus t-stepper__plus--filled t-stepper__icon--medium"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add t-stepper__plus-icon" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__description t-form__item--bordered t-form--top t-form-item__description"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">自我评价</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-rate"><div class="t-rate__wrapper" style="gap:8px"><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--selected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div><div style="font-size:24px;--td-rate-selected-color:#ED7B2F" class="t-rate__icon t-rate__icon--unselected"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-star-filled" style="fill:none"><path fill="currentColor" d="M12.0012 0.63031L14.9039 8.98087L23.7427 9.16099L16.6978 14.502L19.2579 22.9639L12.0012 17.9143L4.74461 22.9639L7.30465 14.502L0.259766 9.16099L9.09859 8.98087L12.0012 0.63031Z"></path></svg></div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__resume t-form__item--bordered t-form--top t-form-item__resume"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">个人简介</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-textarea t-textarea--layout-horizontal textarea"><div class="t-textarea__wrapper"><textarea placeholder="请输入个人简介" class="t-textarea__wrapper-inner t-textarea__placeholder" style="caret-color:#0052d9"></textarea><div class="t-textarea__indicator">0/50</div></div></div></div></div></div></div><div class="t-form__item t-form__item--bordered t-form--top t-form-item__photo t-form__item--bordered t-form--top t-form-item__photo"><div class="t-form__item-wrap t-form__item--top"><div class="t-form__label t-form__label--top"><label for="">上传照片</label></div><div class="t-form__controls"><div class="t-form__controls-content t-form__controls--undefined"><div class="t-upload t-upload--grid upload"><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example4.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item"><div class="t-image t-image--round t-upload__image"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example6.png"/></div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close t-upload__delete-btn" style="fill:none"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-upload__item t-upload__item--add"><div class="t-upload__add-icon"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-add" style="fill:none"><g id="add"><path id="stroke1" stroke="currentColor" d="M12 5L12 19M19 12L5 12" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div><input hidden="" type="file" multiple=""/></div></div></div></div></div><div class="button-group"><button type="submit" tabindex="0" class="t-button t-button--size-large t-button--base t-button--primary t-button--rectangle"><span class="t-button__content"> <!-- -->提交</span></button><button type="reset" tabindex="0" class="t-button t-button--size-large t-button--base t-button--default t-button--rectangle"><span class="t-button__content"> <!-- -->重置</span></button></div></form><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-picker"><div class="t-picker__toolbar"><div class="t-picker__cancel">取消</div><div class="t-picker__title">选择日期</div><div class="t-picker__confirm">确定</div></div><div class="t-picker__main"><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">2015 年</li><li class="t-picker-item__item">2016 年</li><li class="t-picker-item__item">2017 年</li><li class="t-picker-item__item">2018 年</li><li class="t-picker-item__item">2019 年</li><li class="t-picker-item__item">2020 年</li><li class="t-picker-item__item">2021 年</li><li class="t-picker-item__item">2022 年</li><li class="t-picker-item__item">2023 年</li><li class="t-picker-item__item">2024 年</li><li class="t-picker-item__item">2025 年</li><li class="t-picker-item__item">2026 年</li><li class="t-picker-item__item">2027 年</li><li class="t-picker-item__item">2028 年</li><li class="t-picker-item__item">2029 年</li><li class="t-picker-item__item">2030 年</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 月</li><li class="t-picker-item__item">6 月</li><li class="t-picker-item__item">7 月</li><li class="t-picker-item__item">8 月</li><li class="t-picker-item__item">9 月</li><li class="t-picker-item__item">10 月</li><li class="t-picker-item__item">11 月</li><li class="t-picker-item__item">12 月</li></ul></div><div class="t-picker-item__group"><ul class="t-picker-item"><li class="t-picker-item__item">5 日</li><li class="t-picker-item__item">6 日</li><li class="t-picker-item__item">7 日</li><li class="t-picker-item__item">8 日</li><li class="t-picker-item__item">9 日</li><li class="t-picker-item__item">10 日</li><li class="t-picker-item__item">11 日</li><li class="t-picker-item__item">12 日</li><li class="t-picker-item__item">13 日</li><li class="t-picker-item__item">14 日</li><li class="t-picker-item__item">15 日</li><li class="t-picker-item__item">16 日</li><li class="t-picker-item__item">17 日</li><li class="t-picker-item__item">18 日</li><li class="t-picker-item__item">19 日</li><li class="t-picker-item__item">20 日</li><li class="t-picker-item__item">21 日</li><li class="t-picker-item__item">22 日</li><li class="t-picker-item__item">23 日</li><li class="t-picker-item__item">24 日</li><li class="t-picker-item__item">25 日</li><li class="t-picker-item__item">26 日</li><li class="t-picker-item__item">27 日</li><li class="t-picker-item__item">28 日</li><li class="t-picker-item__item">29 日</li><li class="t-picker-item__item">30 日</li><li class="t-picker-item__item">31 日</li></ul></div><div class="t-picker__mask t-picker__mask--top"></div><div class="t-picker__mask t-picker__mask--bottom"></div><div class="t-picker__indicator"></div></div></div></div><div class="t-popup t-popup--bottom" style="display:none;animation-fill-mode:forwards"><div class="t-cascader"><div class="t-cascader__title">选择地址</div><div class="t-cascader__close-btn"><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-close" style="fill:none;font-size:24px"><g id="close"><path id="stroke1" stroke="currentColor" d="M16.9503 7.05029L12.0005 12M12.0005 12L7.05078 16.9498M12.0005 12L16.9503 16.9498M12.0005 12L7.05078 7.05029" stroke-linecap="square" stroke-width="2"></path></g></svg></div><div class="t-cascader__content"><div><div class="t-cascader__steps"><div class="t-cascader__step"><div class="t-cascader__step-dot t-cascader__step-dot--last"></div><div class="t-cascader__step-label t-cascader__step-label--active">选择选项</div><svg fill="none" viewBox="0 0 24 24" width="1em" height="1em" class="t-icon t-icon-chevron-right t-cascader__step-arrow" style="fill:none;font-size:22px"><g id="chevron-right"><path id="stroke1" stroke="currentColor" d="M9.5 17.5L15 12L9.5 6.5" stroke-linecap="square" stroke-width="2"></path></g></svg></div></div></div><div class="t-cascader__options-container" style="width:100vw;transform:translateX(-000vw)"><div class="t-cascader__options"><div class="t-cascader-radio-group-0"><div class="t-radio-group t-radio-group--vertical"><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="110000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">北京市</span></div></div><div class="t-radio t-radio--right t-radio--block t-radio--vertical"><input type="radio" class="t-radio__original" value="120000"/><div class="t-radio__icon t-radio__icon--right"><div class="placeholder"></div></div><div class="t-radio__content"><span class="t-radio__title" style="-webkit-line-clamp:3">天津市</span></div></div></div></div></div></div></div></div></div>"`;
 
 exports[`ssr snapshot test > ssr test src/grid/_example/badge.tsx 1`] = `"<link rel="preload" as="image" href="https://tdesign.gtimg.com/mobile/demos/example1.png"/><div class="t-grid grid-demo" style="padding:undefinedpx;grid-template-columns:repeat(4, 1fr);grid-gap:undefinedpx"><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--dot t-badge--medium t-badge--circle t-has-count"><div class="t-badge__count"></div></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"><div class="t-badge__count">8</div></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题文字</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"><div class="t-badge__count">13</div></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div><div class="t-grid-item t-grid-item--vertical" style="text-align:center;flex-basis:25%"><div class="t-grid-item__image t-grid-item__image--middle"><div class="t-badge"><div class="t-badge__content"><div class="t-image t-image--round"><div class="t-image__mask"><div class="t-loading t-loading--center" style="color:inherit;font-size:20px"><div class="t-loading__dots" style="animation-duration:800ms;width:20px;height:20px"><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.26666666666666666s"></div><div class="t-loading__dot" style="animation-duration:0.8s;animation-delay:0.5333333333333333s"></div></div></div></div><img class="t-image__img t-image--fit-fill t-image--position-center" src="https://tdesign.gtimg.com/mobile/demos/example1.png"/></div></div><div class="t-badge--basic t-badge--medium t-badge--circle t-badge--count t-has-count"><div class="t-badge__count">NEW</div></div></div></div><div class="t-grid-item__content t-grid-item__content--vertical"><div class="t-grid-item__title t-grid-item__title--middle">标题五字内</div><div class="t-grid-item__description t-grid-item__description--vertical"></div></div></div></div>"`;