Skip to content

Commit

Permalink
docs(sticky): jsx示例文件换tsx
Browse files Browse the repository at this point in the history 
fix #415
  • Loading branch information
@byq1213
byq1213 committed Aug 8, 2024
1 parent 1888f75 commit c48fdd8
Show file tree
Hide file tree
Showing 7 changed files with 262 additions and 1 deletion.
2 changes: 1 addition & 1 deletion site/mobile/mobile.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@ export default {
{
title: 'Sticky 吸顶',
name: 'sticky',
component: () => import('tdesign-mobile-react/sticky/_example/index.jsx'),
component: () => import('tdesign-mobile-react/sticky/_example/index.tsx'),
},
{
title: 'BackTop 返回顶部',
Expand Down
0 src/sticky/_example/base.jsx → src/sticky/_example/base.tsx
View file
File renamed without changes.
0 src/sticky/_example/container.jsx → src/sticky/_example/container.tsx
View file
File renamed without changes.
0 src/sticky/_example/index.jsx → src/sticky/_example/index.tsx
View file
File renamed without changes.
0 src/sticky/_example/offset.jsx → src/sticky/_example/offset.tsx
View file
File renamed without changes.
253 changes: 253 additions & 0 deletions test/snap/__snapshots__/csr.test.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -474,10 +474,263 @@ exports[`csr snapshot test > csr test src/grid/_example/badge.tsx 1`] = `
</div>
`;

exports[`csr snapshot test > csr test src/sticky/_example/base.tsx 1`] = `
<div>
<div
class="tdesign-demo-block-1"
>
<div
class="t-sticky"
style="height: 0px;"
>
<div
class="t-sticky__content"
style="z-index: 99;"
>
<button
class="t-button t-button--base t-button--primary custom-common-button t-size-default t-button--shape-rectangle"
type="button"
>
<span
class="t-button__text"
>
基础吸顶
</span>
</button>
</div>
</div>
</div>
</div>
`;

exports[`csr snapshot test > csr test src/sticky/_example/container.tsx 1`] = `
<div>
<div
class="tdesign-demo-block-3"
id="container"
>
<div
class="t-sticky"
style="height: 0px;"
>
<div
class="t-sticky__content"
style="z-index: 99;"
>
<button
class="t-button t-button--base t-button--default custom-button custom-common-button t-size-default t-button--shape-rectangle"
type="button"
>
<span
class="t-button__text"
>
指定容器
</span>
</button>
</div>
</div>
</div>
</div>
`;

exports[`csr snapshot test > csr test src/sticky/_example/index.tsx 1`] = `
<div>
<div
class="tdesign-mobile-demo"
>
<div
class="tdesign-mobile-demo-header"
>
<h1
class="tdesign-mobile-demo-header__title"
>
Sticky 吸顶
</h1>
<p
class="tdesign-mobile-demo-header__summary"
>
用于常驻页面顶部的信息，操作展示
</p>
</div>
<div
class="tdesign-demo-block-wrap"
>
<div
class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"
>
<div
class="tdesign-mobile-demo-block__header"
>
<p
class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle"
>
基础吸顶
</p>
</div>
<div
class="tdesign-mobile-demo-block__slot"
>
<div
class="tdesign-demo-block-1"
>
<div
class="t-sticky"
style="height: 0px;"
>
<div
class="t-sticky__content"
style="z-index: 99;"
>
<button
class="t-button t-button--base t-button--primary custom-common-button t-size-default t-button--shape-rectangle"
type="button"
>
<span
class="t-button__text"
>
基础吸顶
</span>
</button>
</div>
</div>
</div>
</div>
</div>
<div
class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"
>
<div
class="tdesign-mobile-demo-block__header"
>
<p
class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle"
>
吸顶距离
</p>
</div>
<div
class="tdesign-mobile-demo-block__slot"
>
<div
class="tdesign-demo-block-2"
>
<div
class="t-sticky"
style="height: 0px;"
>
<div
class="t-sticky__content"
style="z-index: 99;"
>
<button
class="t-button t-button--base t-button--danger custom-common-button t-size-default t-button--shape-rectangle"
type="button"
>
<span
class="t-button__text"
>
吸顶距离
</span>
</button>
</div>
</div>
</div>
</div>
</div>
<div
class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"
>
<div
class="tdesign-mobile-demo-block__header"
>
<p
class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle"
>
指定容器
</p>
</div>
<div
class="tdesign-mobile-demo-block__slot"
>
<div
class="tdesign-demo-block-3"
id="container"
>
<div
class="t-sticky"
style="height: 0px;"
>
<div
class="t-sticky__content"
style="z-index: 99;"
>
<button
class="t-button t-button--base t-button--default custom-button custom-common-button t-size-default t-button--shape-rectangle"
type="button"
>
<span
class="t-button__text"
>
指定容器
</span>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
`;

exports[`csr snapshot test > csr test src/sticky/_example/offset.tsx 1`] = `
<div>
<div
class="tdesign-demo-block-2"
>
<div
class="t-sticky"
style="height: 0px;"
>
<div
class="t-sticky__content"
style="z-index: 99;"
>
<button
class="t-button t-button--base t-button--danger custom-common-button t-size-default t-button--shape-rectangle"
type="button"
>
<span
class="t-button__text"
>
吸顶距离
</span>
</button>
</div>
</div>
</div>
</div>
`;

exports[`ssr snapshot test > ssr test src/divider/_example/base.tsx 1`] = `"<div class="divider-demo__title">水平分割线</div><div class="t-divider t-divider--horizontal t-divider--center" role="separator"><div class="t-divider__content"></div></div><div class="divider-demo__title">带文字水平分割线</div><div class="t-divider t-divider--horizontal t-divider--left" role="separator"><div class="t-divider__content">文字信息</div></div><div class="t-divider t-divider--horizontal t-divider--center" role="separator"><div class="t-divider__content">文字信息</div></div><div class="t-divider t-divider--horizontal t-divider--right" role="separator"><div class="t-divider__content">文字信息</div></div><div class="divider-demo__title" style="margin-bottom:10px">垂直分割线</div><div class="divider-wrapper"><span>文字信息</span><div class="t-divider t-divider--vertical t-divider--center" role="separator"><div class="t-divider__content"></div></div><span>文字信息</span><div class="t-divider t-divider--vertical t-divider--center" role="separator"><div class="t-divider__content"></div></div><span>文字信息</span></div>"`;

exports[`ssr snapshot test > ssr test src/divider/_example/index.tsx 1`] = `"<div class="tdesign-mobile-demo" data-reactroot=""><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Divider 分割符</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></div><div class="tdesign-mobile-demo-block__slot with-padding"><div class="divider-demo__title">水平分割线</div><div class="t-divider t-divider--horizontal t-divider--center" role="separator"><div class="t-divider__content"></div></div><div class="divider-demo__title">带文字水平分割线</div><div class="t-divider t-divider--horizontal t-divider--left" role="separator"><div class="t-divider__content">文字信息</div></div><div class="t-divider t-divider--horizontal t-divider--center" role="separator"><div class="t-divider__content">文字信息</div></div><div class="t-divider t-divider--horizontal t-divider--right" role="separator"><div class="t-divider__content">文字信息</div></div><div class="divider-demo__title" style="margin-bottom:10px">垂直分割线</div><div class="divider-wrapper"><span>文字信息</span><div class="t-divider t-divider--vertical t-divider--center" role="separator"><div class="t-divider__content"></div></div><span>文字信息</span><div class="t-divider t-divider--vertical t-divider--center" role="separator"><div class="t-divider__content"></div></div><span>文字信息</span></div></div></div><div class="tdesign-mobile-demo-block"><div class="tdesign-mobile-demo-block__header"><h2 class="tdesign-mobile-demo-block__title">02 组件状态</h2></div><div class="tdesign-mobile-demo-block__slot with-padding"><div><div class="divider-demo__title">虚线样式</div><div class="t-divider t-divider--horizontal t-divider--center t-divider--dashed" role="separator"><div class="t-divider__content"></div></div><div class="t-divider t-divider--horizontal t-divider--left t-divider--dashed" role="separator"><div class="t-divider__content">文字信息</div></div><div class="t-divider t-divider--horizontal t-divider--center t-divider--dashed" role="separator"><div class="t-divider__content">文字信息</div></div><div class="t-divider t-divider--horizontal t-divider--right t-divider--dashed" role="separator"><div class="t-divider__content">文字信息</div></div></div></div></div></div>"`;

exports[`ssr snapshot test > ssr test src/divider/_example/theme.tsx 1`] = `"<div data-reactroot=""><div class="divider-demo__title">虚线样式</div><div class="t-divider t-divider--horizontal t-divider--center t-divider--dashed" role="separator"><div class="t-divider__content"></div></div><div class="t-divider t-divider--horizontal t-divider--left t-divider--dashed" role="separator"><div class="t-divider__content">文字信息</div></div><div class="t-divider t-divider--horizontal t-divider--center t-divider--dashed" role="separator"><div class="t-divider__content">文字信息</div></div><div class="t-divider t-divider--horizontal t-divider--right t-divider--dashed" role="separator"><div class="t-divider__content">文字信息</div></div></div>"`;

exports[`ssr snapshot test > ssr test src/grid/_example/badge.tsx 1`] = `"<div class="t-grid"><div class="t-grid-item" style="flex-basis:25%;flex-direction:column;padding-left:0;padding-right:0;align-items:center;justify-content:center;text-align:center"><div class="t-badge"><div class="t-badge__inner t-badge--dot t-badge--has-children t-badge--medium"></div><img class="img-4 img-vertical" src="https://tdesign.gtimg.com/mobile/%E5%9B%BE%E7%89%87.png"/></div><div class="t-grid-item__text" style="padding-left:0"><div class="t-grid-item__title" style="padding-top:8px;margin-bottom:4px"><div class="text-4">标题文字</div></div><div class="t-grid-item__description"></div></div></div><div class="t-grid-item" style="flex-basis:25%;flex-direction:column;padding-left:0;padding-right:0;align-items:center;justify-content:center;text-align:center"><div class="t-badge"><div class="t-badge__inner t-badge--circle t-badge--has-children t-badge--medium">8</div><img class="img-4 img-vertical" src="https://tdesign.gtimg.com/mobile/%E5%9B%BE%E7%89%87.png"/></div><div class="t-grid-item__text" style="padding-left:0"><div class="t-grid-item__title" style="padding-top:8px;margin-bottom:4px"><div class="text-4">标题文字</div></div><div class="t-grid-item__description"></div></div></div><div class="t-grid-item" style="flex-basis:25%;flex-direction:column;padding-left:0;padding-right:0;align-items:center;justify-content:center;text-align:center"><div class="t-badge"><div class="t-badge__inner t-badge--circle t-badge--has-children t-badge--medium">new</div><img class="img-4 img-vertical" src="https://tdesign.gtimg.com/mobile/%E5%9B%BE%E7%89%87.png"/></div><div class="t-grid-item__text" style="padding-left:0"><div class="t-grid-item__title" style="padding-top:8px;margin-bottom:4px"><div class="text-4">标题文字</div></div><div class="t-grid-item__description"></div></div></div><div class="t-grid-item" style="flex-basis:25%;flex-direction:column;padding-left:0;padding-right:0;align-items:center;justify-content:center;text-align:center"><div class="t-badge"><div class="t-badge__inner t-badge--circle t-badge--has-children t-badge--medium">···</div><img class="img-4 img-vertical" src="https://tdesign.gtimg.com/mobile/%E5%9B%BE%E7%89%87.png"/></div><div class="t-grid-item__text" style="padding-left:0"><div class="t-grid-item__title" style="padding-top:8px;margin-bottom:4px"><div class="text-4">标题文字</div></div><div class="t-grid-item__description"></div></div></div></div>"`;

exports[`ssr snapshot test > ssr test src/sticky/_example/base.tsx 1`] = `"<div class="tdesign-demo-block-1" data-reactroot=""><div class="t-sticky"><div class="t-sticky__content"><button type="button" class="t-button t-button--base t-button--primary custom-common-button t-size-default t-button--shape-rectangle"><span class="t-button__text"> <!-- -->基础吸顶</span></button></div></div></div>"`;

exports[`ssr snapshot test > ssr test src/sticky/_example/container.tsx 1`] = `"<div class="tdesign-demo-block-3" id="container" data-reactroot=""><div class="t-sticky"><div class="t-sticky__content"><button type="button" class="t-button t-button--base t-button--default custom-button custom-common-button t-size-default t-button--shape-rectangle"><span class="t-button__text"> <!-- -->指定容器</span></button></div></div></div>"`;

exports[`ssr snapshot test > ssr test src/sticky/_example/index.tsx 1`] = `"<div class="tdesign-mobile-demo" data-reactroot=""><div class="tdesign-mobile-demo-header"><h1 class="tdesign-mobile-demo-header__title">Sticky 吸顶</h1><p class="tdesign-mobile-demo-header__summary">用于常驻页面顶部的信息，操作展示</p></div><div class="tdesign-demo-block-wrap"><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">基础吸顶</p></div><div class="tdesign-mobile-demo-block__slot"><div class="tdesign-demo-block-1"><div class="t-sticky"><div class="t-sticky__content"><button type="button" class="t-button t-button--base t-button--primary custom-common-button t-size-default t-button--shape-rectangle"><span class="t-button__text"> <!-- -->基础吸顶</span></button></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">吸顶距离</p></div><div class="tdesign-mobile-demo-block__slot"><div class="tdesign-demo-block-2"><div class="t-sticky"><div class="t-sticky__content"><button type="button" class="t-button t-button--base t-button--danger custom-common-button t-size-default t-button--shape-rectangle"><span class="t-button__text"> <!-- -->吸顶距离</span></button></div></div></div></div></div><div class="tdesign-mobile-demo-block tdesign-mobile-demo-block_subtitle"><div class="tdesign-mobile-demo-block__header"><p class="tdesign-mobile-demo-block__summary tdesign-mobile-demo-block_subtitle">指定容器</p></div><div class="tdesign-mobile-demo-block__slot"><div class="tdesign-demo-block-3" id="container"><div class="t-sticky"><div class="t-sticky__content"><button type="button" class="t-button t-button--base t-button--default custom-button custom-common-button t-size-default t-button--shape-rectangle"><span class="t-button__text"> <!-- -->指定容器</span></button></div></div></div></div></div></div></div>"`;

exports[`ssr snapshot test > ssr test src/sticky/_example/offset.tsx 1`] = `"<div class="tdesign-demo-block-2" data-reactroot=""><div class="t-sticky"><div class="t-sticky__content"><button type="button" class="t-button t-button--base t-button--danger custom-common-button t-size-default t-button--shape-rectangle"><span class="t-button__text"> <!-- -->吸顶距离</span></button></div></div></div>"`;
Loading

0 comments on commit c48fdd8

Please sign in to comment.