Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

style: format code with Prettier and StandardJS #529

Closed
wants to merge 1 commit into from
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 19 additions & 22 deletions src/pages/motion/index.jsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useEffect, useState, useRef } from 'react'

Check warning on line 1 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unused import

Unused import specifier useEffect

Check failure on line 1 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

ESLint

ESLint: Install the 'eslint' package
import { motion, useAnimationControls, LayoutGroup, useScroll } from 'motion/react'
import FixTabPanel from '@stateless/FixTabPanel'
import { is } from '@react-spring/shared'

Check warning on line 4 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unused import

Unused import { is } from '@react-spring/shared'
Expand Down Expand Up @@ -59,7 +59,7 @@
]

const randomSort = (arr) => {
let newArr = []
const newArr = []
const len = arr.length
for (let i = 0; i < len; i++) {
const random = Math.floor(Math.random() * arr.length)
Expand Down Expand Up @@ -99,7 +99,7 @@
return (
<FixTabPanel ref={scrollRef}>
<h2>Hi, Motion</h2>
<motion.div

Check notice on line 102 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
position: 'fixed',
top: 0,
Expand All @@ -108,10 +108,10 @@
height: 3,
backgroundColor: '#aaa',
borderRadius: '3px',
scaleX: scrollYProgress,

Check warning on line 111 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Suspicious variable/parameter name combination

'scrollYProgress' should probably not be assigned to 'scaleX'
}}
></motion.div>
/>
<motion.div

Check notice on line 114 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 100,
height: 100,
Expand All @@ -134,8 +134,8 @@
rotate: 45, // 旋转45度
opacity: 0.5, // 不透明度设置为0.5
}}
></motion.div>
/>
<motion.div

Check notice on line 138 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
transformTemplate={template}
animate={{ rotate: 360 }}
style={{
Expand All @@ -146,9 +146,9 @@
rotate: 0,
x: '200px',
}}
></motion.div>
/>

<motion.div

Check notice on line 151 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 100,
height: 100,
Expand All @@ -159,10 +159,10 @@
duration: 2,
}}
variants={animations}
initial={'hidden'}
animate={'show'}
></motion.div>
initial="hidden"
animate="show"
/>
<motion.ul

Check notice on line 165 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.ul
initial="hidden"
animate="visible"
variants={list}
Expand All @@ -173,12 +173,12 @@
}}
style={{ fontSize: 20 }}
>
<motion.li variants={item}>item1</motion.li>

Check notice on line 176 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.li
<motion.li variants={item}>item2</motion.li>

Check notice on line 177 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.li
<motion.li variants={item}>item3</motion.li>

Check notice on line 178 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.li
</motion.ul>
{['vue', 'react', 'angular'].map((item, i) => (
<motion.p style={{ fontSize: 20 }} key={i} custom={i + 0.3} animate="visible" variants={variantsText}>

Check notice on line 181 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.p
{item}
</motion.p>
))}
Expand All @@ -190,7 +190,7 @@
gap: 30,
}}
>
<motion.div

Check notice on line 193 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 100,
height: 100,
Expand All @@ -212,7 +212,7 @@
onClick={() => {
setRotate(!isRotated)
}}
></motion.div>
/>
<div
style={{
display: 'flex',
Expand All @@ -235,7 +235,7 @@
</div>
</div>

<motion.div

Check notice on line 238 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
display: 'flex',
flexDirection: 'column',
Expand All @@ -249,7 +249,7 @@
}}
ref={constraintsRef}
>
<motion.div

Check notice on line 252 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 100,
height: 100,
Expand All @@ -266,20 +266,17 @@
onDragStart={(event, info) => console.log(info.point.x, info.point.y)}
onDragEnd={(event, info) => console.log(info.point.x, info.point.y)}
onDirectionLock={(axis) => console.log('axis', axis)}
dragSnapToOrigin={true}
dragSnapToOrigin
// dragConstraints={{ left: 0, right: 300 }}
dragConstraints={constraintsRef}
// dragElastic={false}
// dragElastic={0.8}
// dragPropagation={false}
></motion.div>
/>
<div
style={{
display: 'flex',
gap: 20,
}}
>
<motion.div

Check notice on line 279 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={btnStyle}
onTap={() => {
controller.start({ scale: 1.2 })
Expand All @@ -287,7 +284,7 @@
>
</motion.div>
<motion.div

Check notice on line 287 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={btnStyle}
onTap={() => {
controller.start({ rotate: 45 })
Expand All @@ -295,7 +292,7 @@
>
旋转
</motion.div>
<motion.div

Check notice on line 295 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={btnStyle}
onClick={() => {
controller.start({ opacity: 0.2 })
Expand All @@ -303,7 +300,7 @@
>
透明度
</motion.div>
<motion.div

Check notice on line 303 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={btnStyle}
onTap={() => {
controller.start({ opacity: 1, rotate: 0, scale: 1.0 })
Expand All @@ -323,7 +320,7 @@
gap: 52,
}}
>
<motion.div

Check notice on line 323 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 100,
height: 100,
Expand All @@ -349,14 +346,14 @@
setIsAnimation(false)
console.log('Completed animating', definition)
}}
></motion.div>
/>
<div
style={{
display: 'flex',
gap: 20,
}}
>
<motion.div

Check notice on line 356 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
...btnStyle,
pointerEvents: isAnimation ? 'none' : 'auto',
Expand Down Expand Up @@ -408,7 +405,7 @@
}}
key={i}
>
<motion.div

Check notice on line 408 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 100,
height: 100,
Expand Down Expand Up @@ -468,7 +465,7 @@
marginTop: 30,
}}
>
<motion.div

Check notice on line 468 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 100,
height: 100,
Expand All @@ -482,10 +479,10 @@
duration: 1,
repeat: Infinity,
}}
></motion.div>
/>
</div>

<motion.div

Check notice on line 485 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 180,
backgroundColor: '#333',
Expand All @@ -499,7 +496,7 @@
setButtonState(!buttonRight)
}}
>
<motion.div

Check notice on line 499 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
layout // 设置在白色圆球元素上,即子元素上 <-
style={{
width: 60,
Expand All @@ -507,7 +504,7 @@
backgroundColor: 'white',
borderRadius: 60,
}}
></motion.div>
/>
</motion.div>

<div
Expand All @@ -521,7 +518,7 @@
fontWeight: 'bold',
}}
>
<motion.div

Check notice on line 521 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
display: 'flex',
flexDirection: 'column',
Expand All @@ -531,7 +528,7 @@
>
{listLabel.map((item) => {
return (
<motion.div

Check notice on line 531 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
layout
style={{
width: 200,
Expand All @@ -548,7 +545,7 @@
</motion.div>
)
})}
<motion.div

Check notice on line 548 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 160,
height: 50,
Expand Down Expand Up @@ -583,7 +580,7 @@
fontSize: 16,
}}
>
<motion.div

Check notice on line 583 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: buttonRight ? 160 : 200,
height: 40,
Expand All @@ -598,9 +595,9 @@
onTap={() => {
setButtonState(!buttonRight)
}}
></motion.div>
/>

<motion.div

Check notice on line 600 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 120,
height: 40,
Expand All @@ -618,7 +615,7 @@
onTap={() => {
setButtonState(!buttonRight)
}}
></motion.div>
/>
<span
style={{
color: '#aaa',
Expand All @@ -636,7 +633,7 @@
alignItems: 'center',
}}
>
<motion.div

Check notice on line 636 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
backgroundColor: '#333',
borderRadius: '10px',
Expand All @@ -649,7 +646,7 @@
layout
>
<LayoutGroup>
<motion.div

Check notice on line 649 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
layout
style={{
width: isBig ? 200 : 60,
Expand All @@ -667,9 +664,9 @@
setBigState(!isBig)
}}
>
<motion.span layout>click</motion.span>

Check notice on line 667 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.span
</motion.div>
<motion.div

Check notice on line 669 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
layout
style={{
width: 60,
Expand All @@ -677,8 +674,8 @@
backgroundColor: '#fff',
borderRadius: 10,
}}
></motion.div>
/>
<motion.div

Check notice on line 678 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
layout
style={{
width: 60,
Expand All @@ -686,7 +683,7 @@
backgroundColor: '#fff',
borderRadius: 10,
}}
></motion.div>
/>
</LayoutGroup>
</motion.div>
</div>
Expand All @@ -710,7 +707,7 @@
letterSpacing: 2,
}}
>
<motion.div

Check notice on line 710 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
layout
style={{
width: leftState ? 200 : 100,
Expand All @@ -726,7 +723,7 @@
setLeftState(!leftState)
}}
>
<motion.div

Check notice on line 726 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
layout
style={{
width: 30,
Expand All @@ -734,9 +731,9 @@
backgroundColor: 'black',
borderRadius: 60,
}}
></motion.div>
/>
</motion.div>
<motion.span layout>黑点和文字都设置了layout</motion.span>

Check notice on line 736 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.span
</div>
<div
style={{
Expand All @@ -749,7 +746,7 @@
color: '#333',
}}
>
<motion.div

Check notice on line 749 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
layout
style={{
width: leftState ? 200 : 100,
Expand All @@ -765,16 +762,16 @@
setLeftState(!leftState)
}}
>
<motion.div

Check notice on line 765 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.div
style={{
width: 30,
height: 30,
backgroundColor: 'black',
borderRadius: 60,
}}
></motion.div>
/>
</motion.div>
<motion.span>黑点和文字都未设置layout</motion.span>

Check notice on line 774 in src/pages/motion/index.jsx

View workflow job for this annotation

GitHub Actions / Qodana for JS

Unresolved JSX component

Unresolved component motion.span
</div>
</div>
</FixTabPanel>
Expand Down
Loading