Skip to content
This repository was archived by the owner on Mar 27, 2025. It is now read-only.

Commit 02a9118

Browse files
committed
refactor: use PascalCase over kebab for components
1 parent 381eb50 commit 02a9118

File tree

147 files changed

+7326
-7356
lines changed

Some content is hidden

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

147 files changed

+7326
-7356
lines changed

apps/docs/.vitepress/theme/Layout.vue

+55-55
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
2-
<b-navbar variant="primary" sticky="top" toggleable="lg">
3-
<b-navbar-toggle @click="toggler" />
4-
<b-navbar-brand :to="withBase('/')" class="p-0 me-0 me-lg-2">
2+
<BNavbar variant="primary" sticky="top" toggleable="lg">
3+
<BNavbarToggle @click="toggler" />
4+
<BNavbarBrand :to="withBase('/')" class="p-0 me-0 me-lg-2">
55
<svg
66
xmlns="http://www.w3.org/2000/svg"
77
viewBox="0 0 953 953"
@@ -21,98 +21,98 @@
2121
d="M92 0h769c50 0 92 42 92 92v769c0 50-42 92-92 92H92c-50 0-92-42-92-92V92C0 42 42 0 92 0zm216 710c100 0 160-50 160-133 0-62-44-107-108-113v-3c48-8 86-52 86-102 0-71-55-117-140-117H111v468h197zM195 307h90c50 0 78 23 78 64 0 44-33 68-91 68h-77V307zm0 338V499h90c64 0 98 25 98 73s-33 73-94 73h-94zm503 65l163-468h-90L652 621h-2L531 242h-92l163 468h96z"
2222
/>
2323
</svg>
24-
</b-navbar-brand>
25-
<b-collapse is-nav>
26-
<b-navbar-nav>
27-
<b-nav>
28-
<b-nav-item :to="withBase('/docs')">Getting Started</b-nav-item>
29-
<b-nav-item :to="withBase('/docs/icons')">Icons</b-nav-item>
30-
<b-nav-item :to="withBase('/docs/types')">Types</b-nav-item>
31-
<b-nav-item :to="withBase('/docs/reference')">Reference</b-nav-item>
32-
<b-nav-item :to="withBase('/docs/migration-guide')">Migrate</b-nav-item>
33-
</b-nav>
34-
</b-navbar-nav>
35-
</b-collapse>
36-
<b-nav>
37-
<b-button
24+
</BNavbarBrand>
25+
<BCollapse is-nav>
26+
<BNavbarNav>
27+
<BNav>
28+
<BNavItem :to="withBase('/docs')">Getting Started</BNavItem>
29+
<BNavItem :to="withBase('/docs/icons')">Icons</BNavItem>
30+
<BNavItem :to="withBase('/docs/types')">Types</BNavItem>
31+
<BNavItem :to="withBase('/docs/reference')">Reference</BNavItem>
32+
<BNavItem :to="withBase('/docs/migration-guide')">Migrate</BNavItem>
33+
</BNav>
34+
</BNavbarNav>
35+
</BCollapse>
36+
<BNav>
37+
<BButton
3838
:variant="null"
3939
:href="globalData.githubUrl"
4040
aria-label="Open Github"
4141
target="_blank"
4242
rel="noopener"
4343
>
44-
<github-icon aria-hidden />
45-
</b-button>
46-
<b-button
44+
<GithubIcon aria-hidden />
45+
</BButton>
46+
<BButton
4747
:variant="null"
4848
:href="globalData.opencollectiveUrl"
4949
aria-label="Open Github"
5050
target="_blank"
5151
rel="noopener"
5252
>
53-
<opencollective-icon />
54-
</b-button>
55-
<b-button
53+
<OpencollectiveIcon />
54+
</BButton>
55+
<BButton
5656
:variant="null"
5757
:href="globalData.discordUrl"
5858
aria-label="Open Discord Server"
5959
target="_blank"
6060
rel="noopener"
6161
>
62-
<discord-icon aria-hidden />
63-
</b-button>
64-
<client-only>
65-
<b-dropdown :variant="null">
62+
<DiscordIcon aria-hidden />
63+
</BButton>
64+
<ClientOnly>
65+
<BDropdown :variant="null">
6666
<!-- TODO there's no way to adjust these options, say if you wanted to remove the padding -->
6767
<template #button-content>
6868
<component :is="currentIcon" :aria-label="`Toggle theme (${dark})`" />
6969
</template>
70-
<b-dropdown-item v-for="el in options" :key="el" :active="dark === el" @click="set(el)">
70+
<BDropdownItem v-for="el in options" :key="el" :active="dark === el" @click="set(el)">
7171
<component :is="map[el]" /> {{ el }}
72-
</b-dropdown-item>
73-
</b-dropdown>
74-
</client-only>
75-
</b-nav>
76-
</b-navbar>
77-
<b-container fluid class="container-lg mt-3 my-md-4 bd-layout">
72+
</BDropdownItem>
73+
</BDropdown>
74+
</ClientOnly>
75+
</BNav>
76+
</BNavbar>
77+
<BContainer fluid class="container-lg mt-3 my-md-4 bd-layout">
7878
<aside class="bd-sidebar">
79-
<client-only>
80-
<b-offcanvas
79+
<ClientOnly>
80+
<BOffcanvas
8181
v-model="sidebar"
8282
teleport-disabled="true"
8383
backdrop="false"
8484
title="Browse docs"
8585
class="h-100"
8686
>
8787
<TableOfContentsNav />
88-
</b-offcanvas>
89-
</client-only>
88+
</BOffcanvas>
89+
</ClientOnly>
9090
</aside>
9191
<main class="bd-main">
92-
<b-row v-if="page.isNotFound">
93-
<b-col>
94-
<b-container class="text-center my-auto p-5">
95-
<b-row>
96-
<b-col>
92+
<BRow v-if="page.isNotFound">
93+
<BCol>
94+
<BContainer class="text-center my-auto p-5">
95+
<BRow>
96+
<BCol>
9797
<h1>Oh No!</h1>
98-
</b-col>
99-
</b-row>
100-
<b-row>
101-
<b-col>
98+
</BCol>
99+
</BRow>
100+
<BRow>
101+
<BCol>
102102
<h2>File Not Found</h2>
103-
</b-col>
104-
</b-row>
105-
</b-container>
106-
</b-col>
107-
</b-row>
108-
<b-row v-else>
103+
</BCol>
104+
</BRow>
105+
</BContainer>
106+
</BCol>
107+
</BRow>
108+
<BRow v-else>
109109
<div class="bd-content">
110110
<div class="bd-toc" />
111111
<Content class="doc-content" />
112112
</div>
113-
</b-row>
113+
</BRow>
114114
</main>
115-
</b-container>
115+
</BContainer>
116116
</template>
117117

118118
<script setup lang="ts">

apps/docs/README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ The documentation requires a specific style guide for consistency purposes. You
88
4. Code _examples_ -- ie those that use code highlighting, should never contain a wrapper div, card, or other element. The _only_ exception is #5
99
5. Code examples should always contain a `<template>` if they require a `<script>` tag.
1010
6. `<script>` tags should always be `<script setup lang="ts">` in that exact format
11-
7. Rendered Vue code must be directly _before_ the code example from above. This code example must always be wrapped in a `<b-card>`
11+
7. Rendered Vue code must be directly _before_ the code example from above. This code example must always be wrapped in a `<BCard>`
1212
8. Use kebab-case for components. In Vue code or example code
1313
9. Headers should be APA Title Case <https://capitalizemytitle.com/style/APA/>
1414
10. Props should always be kebab case, ex modelValue => model-value

apps/docs/src/components/ComponentReference.vue

+39-39
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,64 @@
11
<template>
2-
<b-container fluid class="p-0 component-reference">
3-
<b-row>
4-
<b-col>
2+
<BContainer fluid class="p-0 component-reference">
3+
<BRow>
4+
<BCol>
55
<h2>Component Reference</h2>
6-
</b-col>
7-
</b-row>
8-
<b-row>
9-
<b-col>
10-
<b-container v-for="component in sortData" :key="component.component" fluid class="p-0">
11-
<b-row>
12-
<b-col>
6+
</BCol>
7+
</BRow>
8+
<BRow>
9+
<BCol>
10+
<BContainer v-for="component in sortData" :key="component.component" fluid class="p-0">
11+
<BRow>
12+
<BCol>
1313
<code class="display-6">{{ `<` + component.component + `>` }}</code>
14-
</b-col>
15-
</b-row>
16-
<b-row>
17-
<b-col>
14+
</BCol>
15+
</BRow>
16+
<BRow>
17+
<BCol>
1818
<ul>
1919
<li v-for="section in sections" :key="section">
20-
<b-link :to="buildCompReferenceLink(`${component.component}-${section}`)">
20+
<BLink :to="buildCompReferenceLink(`${component.component}-${section}`)">
2121
&lt;{{ component.component }}&gt; {{ section }}
22-
</b-link>
22+
</BLink>
2323
</li>
2424
</ul>
25-
</b-col>
26-
</b-row>
27-
<b-row v-for="section in sections" :key="section" class="my-3">
28-
<b-col>
29-
<b-container fluid>
30-
<b-row>
31-
<b-col>
25+
</BCol>
26+
</BRow>
27+
<BRow v-for="section in sections" :key="section" class="my-3">
28+
<BCol>
29+
<BContainer fluid>
30+
<BRow>
31+
<BCol>
3232
<h5>
33-
<b-link
33+
<BLink
3434
:id="buildCompReferenceLink(`${component.component}-${section}`).slice(1)"
3535
variant="info"
3636
:href="buildCompReferenceLink(`${component.component}-${section}`)"
3737
>
3838
{{ section }}
39-
</b-link>
39+
</BLink>
4040
</h5>
41-
</b-col>
42-
</b-row>
43-
<b-row>
44-
<b-col>
45-
<b-table
41+
</BCol>
42+
</BRow>
43+
<BRow>
44+
<BCol>
45+
<BTable
4646
:items="component[sectionToComponentItem(section)]"
4747
hover
4848
small
4949
responsive
5050
bordered
5151
striped
5252
/>
53-
</b-col>
54-
</b-row>
55-
</b-container>
56-
</b-col>
57-
</b-row>
58-
</b-container>
59-
</b-col>
60-
</b-row>
61-
</b-container>
53+
</BCol>
54+
</BRow>
55+
</BContainer>
56+
</BCol>
57+
</BRow>
58+
</BContainer>
59+
</BCol>
60+
</BRow>
61+
</BContainer>
6262
</template>
6363

6464
<script setup lang="ts">

apps/docs/src/components/HighlightCard.vue

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
<template>
2-
<b-card no-body class="mb-5">
3-
<b-card-body>
2+
<BCard no-body class="mb-5">
3+
<BCardBody>
44
<slot />
5-
</b-card-body>
5+
</BCardBody>
66
<div class="html">HTML</div>
7-
<b-card-body class="bg-body-tertiary">
7+
<BCardBody class="bg-body-tertiary">
88
<slot name="html" />
9-
</b-card-body>
10-
</b-card>
9+
</BCardBody>
10+
</BCard>
1111
</template>
1212

1313
<script setup lang="ts">

apps/docs/src/components/MigrationWrapper.vue

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
<template>
2-
<b-card>
2+
<BCard>
33
<template #header>
44
<h3>{{ component }} - {{ change }}</h3>
5-
<b-badge :variant="difficultyVariant">{{ difficulty }}</b-badge>
5+
<BBadge :variant="difficultyVariant">{{ difficulty }}</BBadge>
66
</template>
77
<h4>Rationale:</h4>
88
{{ rationale }}
99
<h4>Fix:</h4>
1010
{{ fix }}
11-
</b-card>
11+
</BCard>
1212
</template>
1313

1414
<script setup lang="ts">

apps/docs/src/components/TableOfContentsCard.vue

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
<template>
2-
<b-card :body-text="description">
2+
<BCard :body-text="description">
33
<template #header>
4-
<b-link :to="route">
4+
<BLink :to="route">
55
<h3 class="m-0">
66
{{ name }}
77
</h3>
8-
</b-link>
8+
</BLink>
99
</template>
10-
</b-card>
10+
</BCard>
1111
</template>
1212

1313
<script setup lang="ts">

0 commit comments

Comments
 (0)