Skip to content

Commit

Permalink
feat(docs): rewrite CodepenEdit in TS (#394)
Browse files Browse the repository at this point in the history
Rewrites `src/components/CodepenEdit.vue` in TypeScript:
- Makes `code` required so that null checks are unnecessary

A tip for TypeScript migration:
- Explicitly import and register Buefy components so that they are
  type-checked. Note that no type-checking is performed for globally
  registered components.
  • Loading branch information
kikuomax authored Jan 16, 2025
1 parent 7477469 commit 18e17dc
Showing 1 changed file with 13 additions and 6 deletions.
19 changes: 13 additions & 6 deletions packages/docs/src/components/CodepenEdit.vue
Original file line number Diff line number Diff line change
Expand Up @@ -22,14 +22,21 @@
</form>
</template>

<script>
<script lang="ts">
import { defineComponent } from 'vue'
import { BButton } from '@ntohq/buefy-next'
// https://vitejs.dev/guide/assets.html#importing-asset-as-string
import dataTest from '@/data/sample.json?raw'
import { preformat } from '@/utils'
export default {
export default defineComponent({
components: { BButton },
props: {
code: String,
code: {
type: String,
required: true
},
title: String
},
data() {
Expand Down Expand Up @@ -152,9 +159,9 @@ export default {
const end = this.code.lastIndexOf('</style>')
if (start < 0 || end < 0) return
return this.code.substring(start + match[0].length, end)
return this.code.substring(start + match![0].length, end)
},
hasContent(startTag, endTag) {
hasContent(startTag: string, endTag: string) {
const start = this.code.indexOf(startTag)
const end = this.code.lastIndexOf(endTag)
return !(start < 0 || end < 0)
Expand All @@ -163,5 +170,5 @@ export default {
mounted() {
this.hasHtml = this.hasContent('<template>', '</template>')
}
}
})
</script>

0 comments on commit 18e17dc

Please sign in to comment.