Skip to content

Commit 2f16394

Browse files
codebender828codebender828
committed
fix: linting problems
1 parent fa89686 commit 2f16394

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+459
-480
lines changed

‎.eslintrc.js

+8-7
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
module.exports = {
22
env: {
3-
node: true,
3+
node: true
44
},
55
extends: [
6-
"eslint:recommended",
7-
"plugin:vue/vue3-recommended",
8-
"prettier",
9-
"@nuxtjs/eslint-config-typescript",
6+
'eslint:recommended',
7+
'plugin:vue/vue3-recommended',
8+
'prettier',
9+
'@nuxtjs/eslint-config-typescript'
1010
],
1111
rules: {
1212
// override/add rules settings here, such as:
1313
// 'vue/no-unused-vars': 'error'
14-
},
15-
};
14+
'vue/multi-word-component-names': 'off'
15+
}
16+
}

‎app.vue

+3-3
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,6 @@
77
</template>
88

99
<script>
10-
import "@fontsource/ibm-plex-mono"
11-
import "@fontsource/dm-sans"
12-
</script>
10+
import '@fontsource/ibm-plex-mono'
11+
import '@fontsource/dm-sans'
12+
</script>

‎components/ChakraLogo.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script setup lang="ts">
2-
import { chakra, useColorModeValue } from "@chakra-ui/vue-next"
2+
import { chakra, useColorModeValue } from '@chakra-ui/vue-next'
33
4-
const fill = useColorModeValue("#2D3748", "#fff")
4+
const fill = useColorModeValue('#2D3748', '#fff')
55
// todo: AppHeader causes re-rendering of this logo, why?
66
// console.log({ fill })
77
</script>

‎components/SponsorButton.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script setup lang="ts">
2-
import { CBox, CIcon } from "@chakra-ui/vue-next"
3-
import siteConfig from "@/config/site-config"
2+
import { CBox, CIcon } from '@chakra-ui/vue-next'
3+
import siteConfig from '@/config/site-config'
44
</script>
55

66
<template>

‎components/TheNavbar.vue

+15-18
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,4 @@
11
<script setup lang="ts">
2-
import ChakraLogo from "./ChakraLogo.vue"
3-
import ChakraLogoIcon from "./ChakraLogo.vue"
4-
import SponsorButton from "./SponsorButton.vue"
5-
// import { SearchButton } from "./AlgoliaSearch.vue"
6-
// import { MobileNavButton } from "./MobileNav.vue"
7-
import { VersionSwitcher } from "./VersionSwitcher.vue"
82
import {
93
chakra,
104
useColorMode,
@@ -14,18 +8,21 @@ import {
148
CFlex,
159
CIcon,
1610
CIconButton,
17-
CLink,
18-
} from "@chakra-ui/vue-next"
19-
import { useWindowScroll } from "@vueuse/core"
20-
import { computed, onMounted, ref } from "vue"
21-
import siteConfig from "@/config/site-config"
11+
CLink
12+
} from '@chakra-ui/vue-next'
13+
import { useWindowScroll } from '@vueuse/core'
14+
import { computed, onMounted, ref } from 'vue'
15+
import ChakraLogoIcon from './ChakraLogo.vue'
16+
import SponsorButton from './SponsorButton.vue'
17+
// import { SearchButton } from "./AlgoliaSearch.vue"
18+
// import { MobileNavButton } from "./MobileNav.vue"
19+
import { VersionSwitcher } from './VersionSwitcher.vue'
20+
import siteConfig from '@/config/site-config'
2221
2322
const { toggleColorMode } = useColorMode()
24-
const text = useColorModeValue("dark", "light")
25-
const switchIcon = useColorModeValue("moon", "sun")
26-
const bg = useColorModeValue("white", "gray.800")
27-
28-
const isOpen = ref(false)
23+
const text = useColorModeValue('dark', 'light')
24+
const switchIcon = useColorModeValue('moon', 'sun')
25+
const bg = useColorModeValue('white', 'gray.800')
2926
3027
const headerRef = ref<{ $el: HTMLDivElement } | undefined>(undefined)
3128
@@ -38,7 +35,7 @@ onMounted(() => {
3835
})
3936
4037
const headerShadow = computed(() => {
41-
return y.value > height.value ? "sm" : undefined
38+
return y.value > height.value ? 'sm' : undefined
4239
})
4340
</script>
4441

@@ -84,7 +81,7 @@ const headerShadow = computed(() => {
8481
color="gray.400"
8582
>
8683
<!-- <SearchButton></SearchButton> -->
87-
<VersionSwitcher></VersionSwitcher>
84+
<VersionSwitcher />
8885
<CHStack spacing="5" :display="{ base: 'none', md: 'flex' }">
8986
<CLink
9087
is-external

‎components/VersionSwitcher.vue

+30-36
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,37 @@
1-
<script lang="tsx">
2-
import { defineComponent } from "vue"
3-
import { chakra, useColorModeValue, CBox } from "@chakra-ui/vue-next"
4-
import pkgJSON from "../package.json"
5-
export default {}
1+
<script lang="tsx" setup>
2+
import { chakra, useColorModeValue } from '@chakra-ui/vue-next'
3+
import pkgJSON from '../package.json'
64
75
const versions = [
8-
{ label: `v${pkgJSON.version}`, url: "https://next.vue.chakra-ui.com/" },
9-
{ label: "v0.8.x", url: "https://vue.chakra-ui.com" },
6+
{ label: `v${pkgJSON.version}`, url: 'https://next.vue.chakra-ui.com/' },
7+
{ label: 'v0.8.x', url: 'https://vue.chakra-ui.com' }
108
]
119
1210
const v1Url = versions[0].url
1311
14-
export const VersionSwitcher = defineComponent({
15-
setup() {
16-
return () => {
17-
return (
18-
<chakra.select
19-
margin-end="1rem"
20-
variant="unstyled"
21-
fontWeight="semibold"
22-
color={useColorModeValue("gray.600", "whiteAlpha.600").value}
23-
bg="transparent"
24-
value={v1Url}
25-
fontSize="sm"
26-
flexShrink="0"
27-
display={{ base: "none", md: "flex" }}
28-
aria-label="Select the Chakra UI Docs version. You're currently viewing the version 1.0 docs"
29-
onChange={(e: any) => {
30-
document.location = e.target.value
31-
}}
32-
>
33-
{versions.map(({ label, url }) => (
34-
<option key={url} value={url}>
35-
{label}
36-
</option>
37-
))}
38-
</chakra.select>
39-
)
40-
}
41-
},
42-
})
12+
return () => {
13+
return (
14+
<chakra.select
15+
margin-end="1rem"
16+
variant="unstyled"
17+
fontWeight="semibold"
18+
color={useColorModeValue('gray.600', 'whiteAlpha.600').value}
19+
bg="transparent"
20+
value={v1Url}
21+
fontSize="sm"
22+
flexShrink="0"
23+
display={{ base: 'none', md: 'flex' }}
24+
aria-label="Select the Chakra UI Docs version. You're currently viewing the version 1.0 docs"
25+
onChange={(e: any) => {
26+
document.location = e.target.value
27+
}}
28+
>
29+
{versions.map(({ label, url }) => (
30+
<option key={url} value={url}>
31+
{label}
32+
</option>
33+
))}
34+
</chakra.select>
35+
)
36+
}
4337
</script>

‎components/content/CarbonAd.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script setup lang="ts">
2-
import { chakra, CBox, CFlex, useColorModeValue } from "@chakra-ui/vue-next"
3-
const bg = useColorModeValue("gray.50", "rgba(36, 70, 93, 0.32)")
2+
import { chakra, CBox, CFlex, useColorModeValue } from '@chakra-ui/vue-next'
3+
const bg = useColorModeValue('gray.50', 'rgba(36, 70, 93, 0.32)')
44
</script>
55

66
<template>

‎components/content/CodeEditor.vue

+4-5
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,10 @@
33
</template>
44

55
<script setup lang="ts">
6-
import { VueLive } from "vue-live"
7-
import CodeEditorLayout from "./Editor/CodeEditorLayout.vue"
6+
import { VueLive } from 'vue-live'
7+
import * as Chakra from '@chakra-ui/vue-next'
8+
import CodeEditorLayout from './Editor/CodeEditorLayout.vue'
89
// import "prismjs/themes/prism-twilight.min.css"
910
10-
import * as Chakra from "@chakra-ui/vue-next"
11-
12-
const props = defineProps<{ code: string }>()
11+
defineProps<{ code: string }>()
1312
</script>

‎components/content/Editor/CodeEditorLayout.vue

+9-7
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script setup lang="ts">
2-
import { computed } from "vue"
3-
import { CBox, useClipboard } from "@chakra-ui/vue-next"
4-
import { CopyButton, CodeContainer, EditableNotice } from "./CodeEditorParts"
2+
import { computed } from 'vue'
3+
import { CBox, useClipboard } from '@chakra-ui/vue-next'
4+
import { CopyButton, CodeContainer, EditableNotice } from './CodeEditorParts'
55
66
const props = defineProps<{
77
code: string
@@ -29,15 +29,17 @@ if (process.client) {
2929
:border-width="1"
3030
border-radius="12px"
3131
>
32-
<slot name="preview"></slot>
32+
<slot name="preview" />
3333
</CBox>
3434
<CBox pos="relative">
3535
<CodeContainer>
3636
<CBox font-size="14" overflow-x="auto" font-family="IBM Plex Mono">
37-
<slot name="editor"></slot>
37+
<slot name="editor" />
3838
</CBox>
39-
<CopyButton top="4" @click="copy()">copy</CopyButton>
40-
<EditableNotice></EditableNotice>
39+
<CopyButton top="4" @click="copy()">
40+
copy
41+
</CopyButton>
42+
<EditableNotice />
4143
</CodeContainer>
4244
</CBox>
4345
</template>

‎components/content/Editor/CodeHighlight.vue

+14-13
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,30 @@
11
<script setup lang="ts">
2-
import { computed } from "vue"
2+
import { computed } from 'vue'
33
4-
import { PrismEditor } from "vue-prism-editor"
5-
import "vue-prism-editor/dist/prismeditor.min.css"
4+
import { PrismEditor } from 'vue-prism-editor'
5+
import 'vue-prism-editor/dist/prismeditor.min.css'
66
7-
import Prism from "prismjs"
8-
import "prismjs/components/prism-clike"
9-
import "prismjs/components/prism-javascript"
10-
import "prismjs/components/prism-bash"
11-
import "prismjs/components/prism-jsx"
7+
import * as Prism from 'prismjs'
8+
import 'prismjs/components/prism-clike'
9+
import 'prismjs/components/prism-javascript'
10+
import 'prismjs/components/prism-bash'
11+
import 'prismjs/components/prism-jsx'
1212
1313
const { highlight, languages } = Prism
1414
const props = defineProps<{
15-
code: string
16-
language: string
15+
code: string;
16+
language: string;
1717
}>()
1818
1919
const lang = computed(() => {
20-
if (props.language === "vue") {
21-
return "html"
20+
if (props.language === 'vue') {
21+
return 'html'
2222
}
2323
return props.language
2424
})
2525
2626
const highlighter = (code: string) => {
27+
// @ts-ignore
2728
return highlight(code.trim(), languages?.[lang.value]) // languages.<insert language> to return html with markup
2829
}
2930
</script>
@@ -34,5 +35,5 @@ const highlighter = (code: string) => {
3435
:model-value="code"
3536
:highlight="highlighter"
3637
readonly
37-
></prism-editor>
38+
/>
3839
</template>

‎components/content/prose/ProseBlockquote.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup>
2-
import { CAlert } from "@chakra-ui/c-alert"
2+
import { CAlert } from '@chakra-ui/c-alert'
33
</script>
44

55
<template>

‎components/content/prose/ProseCodeInline.vue

+5-3
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
<script setup lang="ts">
2-
import { CCode, useColorModeValue } from "@chakra-ui/vue-next"
2+
import { CCode, useColorModeValue } from '@chakra-ui/vue-next'
33
4-
const color = useColorModeValue("purple.500", "purple.200")
4+
const color = useColorModeValue('purple.500', 'purple.200')
55
</script>
66

77
<template>
8-
<CCode :color="color"><slot /></CCode>
8+
<CCode :color="color">
9+
<slot />
10+
</CCode>
911
</template>

‎components/content/prose/ProseH1.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ defineProps<{ id: string }>()
77
id="skip-nav"
88
text-style="display.lg"
99
mb="5"
10-
maxW="85ch"
11-
tabIndex="-1"
10+
max-w="85ch"
11+
tab-index="-1"
1212
>
1313
<slot />
1414
</chakra.h1>

‎components/content/prose/ProseH5.vue

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,21 @@
11
<script setup lang="ts">
2-
import { CHeading, CLink } from "@chakra-ui/vue-next"
2+
import { CHeading, CLink } from '@chakra-ui/vue-next'
33
44
defineProps<{ id: string }>()
55
</script>
66

77
<template>
88
<CHeading
9+
:id="id"
910
as="h5"
1011
data-group=""
1112
:css="{ scrollMarginBlock: '6.875rem' }"
12-
:id="id"
1313
>
1414
<span className="content"><slot /></span>
1515
<CLink
1616
aria-label="anchor"
1717
color="green.500"
18-
fontWeight="normal"
18+
font-weight="normal"
1919
outline="none"
2020
:_focus="{ opacity: 1, boxShadow: 'outline' }"
2121
opacity="0"

‎components/content/prose/ProseLi.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import { CListItem } from "@chakra-ui/vue-next"
2+
import { CListItem } from '@chakra-ui/vue-next'
33
</script>
44

55
<template>

‎components/content/prose/ProseOl.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import { COrderedList } from "@chakra-ui/vue-next"
2+
import { COrderedList } from '@chakra-ui/vue-next'
33
</script>
44

55
<template>

‎components/content/prose/ProseP.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import { CText } from "@chakra-ui/vue-next"
2+
import { CText } from '@chakra-ui/vue-next'
33
</script>
44

55
<template>

‎components/content/prose/ProseTable.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import { chakra, CBox } from "@chakra-ui/vue-next"
2+
import { chakra, CBox } from '@chakra-ui/vue-next'
33
</script>
44

55
<template>

‎components/content/prose/ProseTd.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import { chakra } from "@chakra-ui/vue-next"
2+
import { chakra } from '@chakra-ui/vue-next'
33
</script>
44

55
<template>

‎components/content/prose/ProseTh.vue

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script setup lang="ts">
2-
import { chakra, useColorModeValue } from "@chakra-ui/vue-next"
2+
import { chakra, useColorModeValue } from '@chakra-ui/vue-next'
33
4-
const bg = useColorModeValue("gray.50", "whiteAlpha.100")
4+
const bg = useColorModeValue('gray.50', 'whiteAlpha.100')
55
</script>
66

77
<template>

0 commit comments

Comments
 (0)