Skip to content

Commit a01c6c2

Browse files
KikobeatsKikobeats
authored
fix: prevent passing dom attributes (#384)
* chore: tweaks * fix: prevent passing dom attributes * chore: remove standard-markdown * ci: lock eslint-config-next
1 parent 4627495 commit a01c6c2

File tree

7 files changed

+8029
-7048
lines changed

7 files changed

+8029
-7048
lines changed

‎package.json‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -36,14 +36,13 @@
3636
"@lerna-lite/cli": "latest",
3737
"@lerna-lite/publish": "latest",
3838
"eslint": "8",
39-
"eslint-config-next": "latest",
39+
"eslint-config-next": "14",
4040
"finepack": "latest",
4141
"git-authors-cli": "latest",
4242
"nano-staged": "latest",
4343
"next": "latest",
4444
"simple-git-hooks": "latest",
4545
"standard": "latest",
46-
"standard-markdown": "latest",
4746
"standard-version": "latest"
4847
},
4948
"engines": {
@@ -55,7 +54,7 @@
5554
"clean:build": "pnpm -r exec -- rm -rf dist",
5655
"clean:node": "pnpm -r exec -- rm -rf node_modules",
5756
"contributors": "(npx git-authors-cli && npx finepack && git add package.json && git commit -m 'build: contributors' --no-verify) || true",
58-
"lint": "eslint \"packages/*/src/**/*\" && standard-markdown README.md --fix && standard --fix",
57+
"lint": "eslint \"packages/*/src/**/*\" && standard --fix",
5958
"prepublishOnly": "pnpm run build",
6059
"pretest": "pnpm run lint",
6160
"release": "lerna publish --sort --conventional-commits -m \"chore(release): %s\" --create-release github",
@@ -84,9 +83,6 @@
8483
"prettier-standard",
8584
"standard --fix"
8685
],
87-
"*.md": [
88-
"standard-markdown"
89-
],
9086
"package.json": [
9187
"finepack"
9288
]

‎packages/hover-react/stories/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const setData = () => ({
2424
url: 'https://microlink.io',
2525
date: '2020-05-07T15:10:41.692Z',
2626
logo: {
27-
url: 'https://cdn.microlink.io/logo/trim.png',
27+
url: 'https://cdn.microlink.io/logo/logo.png',
2828
type: 'png',
2929
size: 5050,
3030
height: 500,

‎packages/hover-vanilla/docs/index.html‎

Lines changed: 6 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -11,25 +11,11 @@
1111
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;400;500;600&display=swap" rel="stylesheet">
1212

1313
<!-- Favicon -->
14-
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="https://cdn.microlink.io/logo/apple-touch-icon-57x57.png">
15-
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="https://cdn.microlink.io/logo/apple-touch-icon-114x114.png">
16-
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="https://cdn.microlink.io/logo/apple-touch-icon-72x72.png">
17-
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://cdn.microlink.io/logo/apple-touch-icon-144x144.png">
18-
<link rel="apple-touch-icon-precomposed" sizes="60x60" href="https://cdn.microlink.io/logo/apple-touch-icon-60x60.png">
19-
<link rel="apple-touch-icon-precomposed" sizes="120x120" href="https://cdn.microlink.io/logo/apple-touch-icon-120x120.png">
20-
<link rel="apple-touch-icon-precomposed" sizes="76x76" href="https://cdn.microlink.io/logo/apple-touch-icon-76x76.png">
21-
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="https://cdn.microlink.io/logo/apple-touch-icon-152x152.png">
22-
<link rel="icon" type="image/png" href="https://cdn.microlink.io/logo/favicon-196x196.png" sizes="196x196">
23-
<link rel="icon" type="image/png" href="https://cdn.microlink.io/logo/favicon-96x96.png" sizes="96x96">
24-
<link rel="icon" type="image/png" href="https://cdn.microlink.io/logo/favicon-32x32.png" sizes="32x32">
25-
<link rel="icon" type="image/png" href="https://cdn.microlink.io/logo/favicon-16x16.png" sizes="16x16">
26-
<link rel="icon" type="image/png" href="https://cdn.microlink.io/logo/favicon-128.png" sizes="128x128">
27-
<meta name="msapplication-TileColor" content="#FFFFFF">
28-
<meta name="msapplication-TileImage" content="https://cdn.microlink.io/logo/mstile-144x144.png">
29-
<meta name="msapplication-square70x70logo" content="https://cdn.microlink.io/logo/mstile-70x70.png">
30-
<meta name="msapplication-square150x150logo" content="https://cdn.microlink.io/logo/mstile-150x150.png">
31-
<meta name="msapplication-wide310x150logo" content="https://cdn.microlink.io/logo/mstile-310x150.png">
32-
<meta name="msapplication-square310x310logo" content="https://cdn.microlink.io/logo/mstile-310x310.png">
14+
<link rel="icon" type="image/png" href="https://cdn.microlink.io/logo/favicon-96x96.png" sizes="96x96" />
15+
<link rel="icon" type="image/svg+xml" href="https://cdn.microlink.io/logo/favicon.svg" />
16+
<link rel="shortcut icon" href="https://cdn.microlink.io/logo/favicon.ico" />
17+
<link rel="apple-touch-icon" sizes="180x180" href="https://cdn.microlink.io/logo/apple-touch-icon.png" />
18+
<link rel="manifest" href="https://cdn.microlink.io/site.webmanifest" />
3319

3420
<!-- Meta -->
3521
<title>@microlink/hover-vanilla</title>
@@ -53,7 +39,7 @@
5339
<meta property="og:description" content="Turns any URL into instant hover preview ✨">
5440
<meta property="og:image" content="https://cdn.microlink.io/logo/banner.png">
5541
<meta property="og:video:secure_url" content="https://hover-vanilla.microlink.io/assets/video/demo.mp4">
56-
<meta property="og:logo" content="https://cdn.microlink.io/logo/trim.png">
42+
<meta property="og:logo" content="https://cdn.microlink.io/logo/logo.png">
5743
<meta property="og:site_name" content="Microlink">
5844
<meta property="og:type" content="website">
5945

‎packages/react/src/components/Card/CardMedia/Image.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,15 +8,15 @@ import { classNames, imageProxy } from '../../../utils'
88
const ImageWrap = styled(Wrap).attrs({
99
className: `${classNames.media} ${classNames.image}`
1010
})`
11-
background-image: ${({ url }) => (url ? `url('${imageProxy(url)}')` : '')};
11+
background-image: ${({ $url }) => ($url ? `url('${imageProxy($url)}')` : '')};
1212
`
1313

1414
const ImageComponent = props => {
1515
const {
1616
state: { imageUrl }
1717
} = useContext(GlobalContext)
1818

19-
return <ImageWrap url={imageUrl} {...props} />
19+
return <ImageWrap $url={imageUrl} {...props} />
2020
}
2121

2222
export default ImageComponent

‎packages/react/src/components/Card/CardText.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,13 +29,13 @@ const StyledClamp = styled(Clamp)`
2929
}
3030
`
3131

32-
const CardText = ({ useNanoClamp = true, children, ...props }) => {
33-
const textProps = useNanoClamp
32+
const CardText = ({ $useNanoClamp = true, children, ...props }) => {
33+
const textProps = $useNanoClamp
3434
? props
3535
: { ...props, as: 'p', title: children }
3636

3737
return (
38-
<StyledClamp $useNanoClamp={useNanoClamp} {...textProps}>
38+
<StyledClamp $useNanoClamp={$useNanoClamp} {...textProps}>
3939
{children}
4040
</StyledClamp>
4141
)

‎packages/react/src/components/Card/CardWrap.js‎

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,14 @@ import { media, isLarge } from '../../utils'
77

88
const HEIGHT = '382px'
99

10-
const contrastStyle = ({ $backgroundColor, color }) => css`
10+
const contrastStyle = ({ $backgroundColor, $color }) => css`
1111
background-color: ${$backgroundColor};
12-
border-color: ${color};
12+
border-color: ${$color};
1313
transition-property: filter;
1414
will-change: filter;
1515
1616
&&& {
17-
color: ${color};
17+
color: ${$color};
1818
}
1919
2020
&:hover {
@@ -69,13 +69,13 @@ const baseStyle = css(
6969

7070
const Element = styled('a')(
7171
baseStyle,
72-
({ $isLoading, contrast }) => !$isLoading && !contrast && hoverStyle,
72+
({ $isLoading, $contrast }) => !$isLoading && !$contrast && hoverStyle,
7373
({ $cardSize }) => isLarge($cardSize) && largeStyle,
74-
({ direction }) => direction === 'rtl' && rtlStyle,
75-
({ $backgroundColor, color, contrast }) =>
76-
contrast && color && $backgroundColor && contrastStyle,
77-
({ $backgroundColor, color, contrast }) =>
78-
contrast && (!color || !$backgroundColor) && hoverStyle
74+
({ $direction }) => $direction === 'rtl' && rtlStyle,
75+
({ $backgroundColor, $color, $contrast }) =>
76+
$contrast && $color && $backgroundColor && contrastStyle,
77+
({ $backgroundColor, $color, $contrast }) =>
78+
$contrast && (!$color || !$backgroundColor) && hoverStyle
7979
)
8080

8181
const CardWrap = forwardRef(
@@ -90,16 +90,20 @@ const CardWrap = forwardRef(
9090
ref
9191
) => {
9292
const {
93-
state: { $backgroundColor, color, title },
93+
state: { $backgroundColor, color: $color, title },
9494
props: { size: $cardSize }
9595
} = useContext(GlobalContext)
9696

97+
const { contrast: $contrast, direction: $direction, ...props } = restProps
98+
9799
return createElement(Element, {
98100
...(as === 'a' ? { href, rel, target } : undefined),
99-
...restProps,
101+
...props,
100102
$backgroundColor,
101103
$cardSize,
102-
color,
104+
$color,
105+
$contrast,
106+
$direction,
103107
ref,
104108
title
105109
})

0 commit comments

Comments
 (0)