Joururi/leim-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changed quote styles

Browse Source
This commit is contained in:
Alexis
2024-08-25 14:14:40 +02:00
parent 07e97873ef
commit 5a47cb3563
180 changed files with 949 additions and 948 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
app.vue
View File

@@ -1,12 +1,12 @@
<script setup lang="ts">
import { ConfigProvider } from 'radix-vue'
import { ConfigProvider } from "radix-vue"
useHead({
titleTemplate: (titleChunk) => {
return titleChunk ? `${titleChunk} — TTTools` : 'TTTools';
return titleChunk ? `${titleChunk} — TTTools` : "TTTools";
},
htmlAttrs: {
lang: 'fr'
lang: "fr"
},
meta: [
{ name: "charset", content: "UTF-8" },
@@ -18,14 +18,14 @@ useHead({
{ name: "theme-color", content: "00aba9" },
{ name: "og:type", content: "tabletop-tools" },
{ name: "og:url", content: "ttt.alexcreates.fr" },
{ name: 'robots', content: 'noindex, nofollow'}
{ name: "robots", content: "noindex, nofollow"}
],
link: [
{ rel: 'apple-touch-icon', sizes: "76x76", href: '/apple-touch-icon.png' },
{ rel: 'icon', sizes: "32x32", type: 'image/png', href: '/favicon-32x32.png' },
{ rel: 'icon', sizes: "16x16", type: 'image/png', href: '/favicon-16x16.png' },
{ rel: 'manifest', href: '/site.webmanifest' },
{ rel: 'mask-icon', href: '/safari-pinned-tab.svg', color: '#6595b4' },
{ rel: "apple-touch-icon", sizes: "76x76", href: "/apple-touch-icon.png" },
{ rel: "icon", sizes: "32x32", type: "image/png", href: "/favicon-32x32.png" },
{ rel: "icon", sizes: "16x16", type: "image/png", href: "/favicon-16x16.png" },
{ rel: "manifest", href: "/site.webmanifest" },
{ rel: "mask-icon", href: "/safari-pinned-tab.svg", color: "#6595b4" },
]
})

24
components/calendar/Calendar.vue
View File

@@ -1,15 +1,15 @@
<script lang="ts" setup>
import { useCalendar } from '@/stores/CalendarStore'
import { computed, type Component, type ComputedRef } from 'vue'
import { useCalendar } from "@/stores/CalendarStore"
import { computed, type Component, type ComputedRef } from "vue"
// import { PhMagnifyingGlass } from '@phosphor-icons/vue'
import MonthlyLayout from './state/monthly/Layout.vue'
import CenturyLayout from './state/centennially/Layout.vue'
import DecadeLayout from './state/decennially/Layout.vue'
import YearLayout from './state/yearly/Layout.vue'
import MonthlyLayout from "./state/monthly/Layout.vue"
import CenturyLayout from "./state/centennially/Layout.vue"
import DecadeLayout from "./state/decennially/Layout.vue"
import YearLayout from "./state/yearly/Layout.vue"
import type { Calendar } from '~/models/CalendarConfig'
import type { Category } from '~/models/Category'
import type { Calendar } from "~/models/CalendarConfig"
import type { Category } from "~/models/Category"
const props = defineProps<{
calendarData: Calendar,
@@ -25,16 +25,16 @@ const { currentConfig, jumpToDate, selectedDate } = useCalendar()
const currentViewComponent: ComputedRef<Component> = computed<Component>(() => {
switch (currentConfig.viewType) {
case 'month':
case "month":
return MonthlyLayout
case 'year':
case "year":
return YearLayout
case 'decade':
case "decade":
return DecadeLayout
case 'century':
case "century":
default:
return CenturyLayout
}

6
components/calendar/CalendarCurrentDate.vue
View File

@@ -1,8 +1,8 @@
<script lang="ts" setup>
import { storeToRefs } from 'pinia'
import { computed } from 'vue'
import { storeToRefs } from "pinia"
import { computed } from "vue"
import { PhMapPin } from '@phosphor-icons/vue'
import { PhMapPin } from "@phosphor-icons/vue"
const { defaultDate, getFormattedDateTitle, getRelativeString } = useCalendar()
const { selectedDate } = storeToRefs(useCalendar())

10
components/calendar/CalendarEvent.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils'
import type { RPGDate } from '@/models/Date'
import type { CalendarEvent } from '~/models/CalendarEvent'
import { cn } from "@/lib/utils"
import type { RPGDate } from "@/models/Date"
import type { CalendarEvent } from "~/models/CalendarEvent"
const props = defineProps<{
event: CalendarEvent
@@ -39,12 +39,12 @@ function handleClosePopover() {
onMounted(() => {
// Listen for keydown events
window.addEventListener('keydown', (e: KeyboardEvent) => {
window.addEventListener("keydown", (e: KeyboardEvent) => {
// If the popover isn't opened, this is not the event we're trying to delete, so return
if (!isPopoverDetailsOpen.value) return
// If the key isn't the delete one, return
if (e.key !== 'Delete') return
if (e.key !== "Delete") return
handleDelete()
})

16
components/calendar/CalendarEventDetails.vue
View File

@@ -1,8 +1,8 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils'
import type { RPGDate } from '@/models/Date'
import type { CalendarEvent } from '@/models/CalendarEvent'
import { useCalendar } from '@/stores/CalendarStore'
import { cn } from "@/lib/utils"
import type { RPGDate } from "@/models/Date"
import type { CalendarEvent } from "@/models/CalendarEvent"
import { useCalendar } from "@/stores/CalendarStore"
import {
PhHourglassMedium,
@@ -12,7 +12,7 @@ import {
PhMapPinArea,
PhDotsThreeOutlineVertical,
PhEye
} from '@phosphor-icons/vue'
} from "@phosphor-icons/vue"
const { defaultDate, getFormattedDateTitle, jumpToDate, getRelativeString, revealEditEventModal, revealDeleteEventModal } = useCalendar()
const { lastActiveEvent } = storeToRefs(useCalendar())
@@ -27,16 +27,16 @@ const props = defineProps<{
// Ref for the popover
const eventDetails = ref<HTMLElement>()
const emit = defineEmits(['query:close-popover'])
const emit = defineEmits(["query:close-popover"])
const dateDifference: string = getRelativeString(defaultDate, props.event.startDate)
const dateDuration: string | null = props.event.endDate
? getRelativeString(props.event.startDate, props.event.endDate, 'compact')
? getRelativeString(props.event.startDate, props.event.endDate, "compact")
: null
function handleJumpToDate(date: RPGDate) {
jumpToDate(date)
emit('query:close-popover')
emit("query:close-popover")
}
/**

4
components/calendar/CalendarMenu.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { useCalendar } from '@/stores/CalendarStore'
import { useCalendar } from "@/stores/CalendarStore"
import { PhMagnifyingGlass } from '@phosphor-icons/vue'
import { PhMagnifyingGlass } from "@phosphor-icons/vue"
const { revealAdvancedSearch } = useCalendar()
</script>

78
components/calendar/CalendarMenuNav.vue
View File

@@ -1,13 +1,13 @@
<script lang="ts" setup>
import { computed, type ComputedRef } from 'vue'
import { useCalendar } from '@/stores/CalendarStore'
import { computed, type ComputedRef } from "vue"
import { useCalendar } from "@/stores/CalendarStore"
import {
PhCaretDoubleLeft,
PhCaretDoubleRight,
PhCaretLeft,
PhCaretRight
} from '@phosphor-icons/vue'
} from "@phosphor-icons/vue"
interface DirectionLabels {
pastFar: string
@@ -21,56 +21,56 @@ const { currentConfig, decrementViewMonth, incrementViewMonth, decrementViewYear
const activeDirectionLabels: ComputedRef<DirectionLabels> = computed(() => {
switch (currentConfig.viewType) {
case 'month':
case "month":
return {
pastFar: 'Année précédente',
pastNear: 'Mois précédent',
futureNear: 'Mois suivant',
futureFar: 'Année suivante'
pastFar: "Année précédente",
pastNear: "Mois précédent",
futureNear: "Mois suivant",
futureFar: "Année suivante"
}
case 'year':
case "year":
return {
pastFar: 'Décennie précédente',
pastNear: 'Année précédente',
futureNear: 'Année suivante',
futureFar: 'Décennie suivante'
pastFar: "Décennie précédente",
pastNear: "Année précédente",
futureNear: "Année suivante",
futureFar: "Décennie suivante"
}
case 'decade':
case "decade":
return {
pastFar: 'Siècle précédent',
pastNear: 'Décennie précédente',
futureNear: 'Décennie suivante',
futureFar: 'Siècle suivant'
pastFar: "Siècle précédent",
pastNear: "Décennie précédente",
futureNear: "Décennie suivante",
futureFar: "Siècle suivant"
}
case 'century':
case "century":
default:
return {
pastFar: 'Millénaire précédent',
pastNear: 'Siècle précédent',
futureNear: 'Siècle suivant',
futureFar: 'Millénaire suivant'
pastFar: "Millénaire précédent",
pastNear: "Siècle précédent",
futureNear: "Siècle suivant",
futureFar: "Millénaire suivant"
}
}
})
function toPastFar(): void {
switch (currentConfig.viewType) {
case 'month':
case "month":
decrementViewYear()
break
case 'year':
case "year":
decrementViewYear(10)
break
case 'decade':
case "decade":
decrementViewYear(100)
break
case 'century':
case "century":
default:
decrementViewYear(1000)
break
@@ -79,19 +79,19 @@ function toPastFar(): void {
function toPastNear(): void {
switch (currentConfig.viewType) {
case 'month':
case "month":
decrementViewMonth()
break
case 'year':
case "year":
decrementViewYear()
break
case 'decade':
case "decade":
decrementViewYear(10)
break
case 'century':
case "century":
default:
decrementViewYear(100)
break
@@ -100,19 +100,19 @@ function toPastNear(): void {
function toFutureNear(): void {
switch (currentConfig.viewType) {
case 'month':
case "month":
incrementViewMonth()
break
case 'year':
case "year":
incrementViewYear()
break
case 'decade':
case "decade":
incrementViewYear(10)
break
case 'century':
case "century":
default:
incrementViewYear(100)
break
@@ -121,19 +121,19 @@ function toFutureNear(): void {
function toFutureFar(): void {
switch (currentConfig.viewType) {
case 'month':
case "month":
incrementViewYear()
break
case 'year':
case "year":
incrementViewYear(10)
break
case 'decade':
case "decade":
incrementViewYear(100)
break
case 'century':
case "century":
default:
incrementViewYear(1000)
break

18
components/calendar/CalendarMenuSubnav.vue
View File

@@ -1,22 +1,22 @@
<script lang="ts" setup>
import { type RPGDate } from '@/models/Date'
import { type RPGDate } from "@/models/Date"
import { PhArrowLineLeft, PhArrowLineRight } from '@phosphor-icons/vue'
import { PhArrowLineLeft, PhArrowLineRight } from "@phosphor-icons/vue"
const { currentDate, currentConfig, jumpToDate, getRelativeEventFromDate } = useCalendar()
function handleGotoPreviousEventPage(position: 'next' | 'prev' = 'next') {
function handleGotoPreviousEventPage(position: "next" | "prev" = "next") {
let fromDate: RPGDate
// To modify, obviously
const daysPerMonth = 32
const monthsPerYear = 10
const toDay = position === 'next' ? daysPerMonth : 1
const toMonth = position === 'next' ? monthsPerYear : 0
const toDay = position === "next" ? daysPerMonth : 1
const toMonth = position === "next" ? monthsPerYear : 0
switch (currentConfig.viewType) {
case 'month':
case "month":
fromDate = {
day: toDay,
month: currentDate.currentMonth,
@@ -24,7 +24,7 @@ function handleGotoPreviousEventPage(position: 'next' | 'prev' = 'next') {
}
break
case 'year':
case "year":
fromDate = {
day: toDay,
month: toMonth,
@@ -32,7 +32,7 @@ function handleGotoPreviousEventPage(position: 'next' | 'prev' = 'next') {
}
break
case 'decade':
case "decade":
fromDate = {
day: toDay,
month: currentDate.currentMonth,
@@ -40,7 +40,7 @@ function handleGotoPreviousEventPage(position: 'next' | 'prev' = 'next') {
}
break
case 'century':
case "century":
default:
fromDate = {
day: toDay,

4
components/calendar/CalendarMenuToday.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { storeToRefs } from 'pinia'
import { computed } from 'vue'
import { storeToRefs } from "pinia"
import { computed } from "vue"
const { defaultDate, areDatesIdentical, jumpToDefaultDate, getFormattedDateTitle } = useCalendar()
const { selectedDate } = storeToRefs(useCalendar())

6
components/calendar/CalendarSwitch.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import { useCalendar } from '@/stores/CalendarStore'
import { PhCalendarBlank } from '@phosphor-icons/vue'
import { computed } from 'vue'
import { useCalendar } from "@/stores/CalendarStore"
import { PhCalendarBlank } from "@phosphor-icons/vue"
import { computed } from "vue"
const { currentConfig, viewTypeOptions, getViewTypeTitle, setViewType } = useCalendar()

2
components/calendar/SearchMode.ts
View File

@@ -1,3 +1,3 @@
export const searchUnifier = new RegExp(/[^a-zA-Z0-9\-'']/g)
export type SearchMode = 'characters' | 'events' | undefined
export type SearchMode = "characters" | "events" | undefined

10
components/calendar/dialog/Create.vue
View File

@@ -1,22 +1,22 @@
<script lang="ts" setup>
import { PhX } from '@phosphor-icons/vue';
import type { World } from '~/models/World';
import { PhX } from "@phosphor-icons/vue";
import type { World } from "~/models/World";
defineProps<{
world: World,
modalState?: boolean
}>()
const calendarSkeletonName = ref<string>('')
const calendarSkeletonName = ref<string>("")
function onChangedName(newName: string) {
calendarSkeletonName.value = newName
}
const emit = defineEmits(['on-close'])
const emit = defineEmits(["on-close"])
function handleClose() {
emit('on-close')
emit("on-close")
}
</script>

10
components/calendar/dialog/Delete.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { PhCircleNotch } from '@phosphor-icons/vue';
import type { Calendar } from '~/models/CalendarConfig';
import { PhCircleNotch } from "@phosphor-icons/vue";
import type { Calendar } from "~/models/CalendarConfig";
const props = defineProps<{
modalState: boolean,
@@ -9,7 +9,7 @@ const props = defineProps<{
const isLoading = ref<boolean>(false)
const emit = defineEmits(['on-close'])
const emit = defineEmits(["on-close"])
async function handleAction(): Promise<void> {
if (isLoading.value) return
@@ -18,7 +18,7 @@ async function handleAction(): Promise<void> {
isLoading.value = true
try {
await $fetch(`/api/calendars/${props.calendar.id}`, { method: 'DELETE' })
await $fetch(`/api/calendars/${props.calendar.id}`, { method: "DELETE" })
// isDeleteEventModalOpen.value = false
} catch (err) {
@@ -37,7 +37,7 @@ async function handleAction(): Promise<void> {
*/
function handleClosing() {
if (!isLoading.value) {
emit('on-close')
emit("on-close")
}
}
</script>

22
components/calendar/form/Create.vue
View File

@@ -1,16 +1,16 @@
<script lang="ts" setup>
import type { Calendar } from '~/models/CalendarConfig';
import { PhAlarm, PhCalendarDots, PhCircleNotch, PhWrench } from '@phosphor-icons/vue';
import type { Calendar } from "~/models/CalendarConfig";
import { PhAlarm, PhCalendarDots, PhCircleNotch, PhWrench } from "@phosphor-icons/vue";
const defaultSkeleton: Calendar = { name: '', today: { day: 1, month: 0, year: 0 }, months: [], events: []}
const defaultSkeleton: Calendar = { name: "", today: { day: 1, month: 0, year: 0 }, months: [], events: []}
const calendarSkeleton = ref<Calendar>({ ...defaultSkeleton })
onMounted(() => {
calendarSkeleton.value = { ...defaultSkeleton }
})
type FormTabs = 'global' | 'months' | 'today'
const activeTab = ref<FormTabs>('global')
type FormTabs = "global" | "months" | "today"
const activeTab = ref<FormTabs>("global")
/**
* === Current date ===
@@ -40,9 +40,9 @@ const isCreatingCalendar = ref<boolean>(false)
async function handleSubmit() {
try {
isCreatingCalendar.value = true
await $fetch(`/api/calendars/create`, { method: 'POST', body: {...calendarSkeleton.value, worldId: 1 } })
await $fetch("/api/calendars/create", { method: "POST", body: {...calendarSkeleton.value, worldId: 1 } })
emit('on-close')
emit("on-close")
} catch (err) {
console.log(err)
} finally {
@@ -55,18 +55,18 @@ async function handleSubmit() {
*/
const emit = defineEmits<{
// eslint-disable-next-line no-unused-vars
(e: 'on-changed-name', calendarName: string): void
(e: "on-changed-name", calendarName: string): void
// eslint-disable-next-line no-unused-vars
(e: 'on-close'): void
(e: "on-close"): void
}>()
/** Hook to emit a debounced event for the changed skeleton name */
const handleNameChange = useDebounceFn(() => {
emit('on-changed-name', calendarSkeleton.value.name)
emit("on-changed-name", calendarSkeleton.value.name)
}, 400)
function handleFormCancel() {
emit('on-close')
emit("on-close")
}
</script>

4
components/calendar/form/CreateEvent.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import type { RPGDate } from '~/models/Date';
import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhTag } from '@phosphor-icons/vue'
import type { RPGDate } from "~/models/Date";
import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhTag } from "@phosphor-icons/vue"
const { eventSkeleton, operationInProgress } = storeToRefs(useCalendar())
const { resetSkeleton, submitSkeleton, cancelLatestRequest } = useCalendar()

2
components/calendar/form/DeleteEvent.vue
View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { PhCircleNotch } from '@phosphor-icons/vue';
import { PhCircleNotch } from "@phosphor-icons/vue";
const { resetSkeleton, deleteEventFromSkeleton, cancelLatestRequest } = useCalendar()
const { isDeleteEventModalOpen, eventSkeleton, lastActiveEvent } = storeToRefs(useCalendar())

4
components/calendar/form/UpdateEvent.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhPencilSimpleLine, PhTag } from '@phosphor-icons/vue'
import { VisuallyHidden } from 'radix-vue'
import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhPencilSimpleLine, PhTag } from "@phosphor-icons/vue"
import { VisuallyHidden } from "radix-vue"
const { resetSkeleton, updateEventFromSkeleton, cancelLatestRequest } = useCalendar()
const { eventSkeleton, lastActiveEvent, isEditEventModalOpen } = storeToRefs(useCalendar())

8
components/calendar/input/EventCategories.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { Category } from '~/models/Category';
import type { Category } from "~/models/Category";
import { PhCaretDown, PhCheck } from '@phosphor-icons/vue';
import { PhCaretDown, PhCheck } from "@phosphor-icons/vue";
const isPopoverOpen = ref<boolean>(false)
@@ -18,10 +18,10 @@ watch(modelBuffer.value, () => {
const { categories: availableCategories } = useCalendar()
const searchTerm = ref<string>('')
const searchTerm = ref<string>("")
const filteredCategories = computed(() =>
searchTerm.value === ''
searchTerm.value === ""
? availableCategories
: availableCategories.filter((category) => {
return category.name.toLowerCase().includes(searchTerm.value.toLowerCase())

8
components/calendar/input/EventCategory.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { PhCaretDown } from '@phosphor-icons/vue';
import type { Category } from '~/models/Category';
import { PhCaretDown } from "@phosphor-icons/vue";
import type { Category } from "~/models/Category";
const isPopoverOpen = ref<boolean>(false)
@@ -12,14 +12,14 @@ const model = defineModel<Category>()
const { categories: availableCategories } = useCalendar()
const searchTerm = ref<string>('')
const searchTerm = ref<string>("")
function handleCatSelect() {
isPopoverOpen.value = false
}
const filteredCategories = computed(() =>
searchTerm.value === ''
searchTerm.value === ""
? availableCategories
: availableCategories.filter((category) => {
return category.name.toLowerCase().includes(searchTerm.value.toLowerCase())

14
components/calendar/input/MonthList.vue
View File

@@ -1,10 +1,10 @@
<script lang="ts" setup>
import { cn } from '~/lib/utils';
import { cn } from "~/lib/utils";
import { useSortable } from '@vueuse/integrations/useSortable';
import type { CalendarMonth } from '~/models/CalendarMonth';
import { useSortable } from "@vueuse/integrations/useSortable";
import type { CalendarMonth } from "~/models/CalendarMonth";
import { PhList, PhPlus, PhTrash } from '@phosphor-icons/vue';
import { PhList, PhPlus, PhTrash } from "@phosphor-icons/vue";
const model = defineModel<CalendarMonth[]>({ required: true })
@@ -14,7 +14,7 @@ const model = defineModel<CalendarMonth[]>({ required: true })
const monthName: Ref<string | undefined> = ref<string>()
const monthNameRef = ref<HTMLInputElement>()
const { focused: monthNameFocused } = useFocus(monthNameRef)
const validMonthNameDatatypes = ['string']
const validMonthNameDatatypes = ["string"]
const monthNameIsTaken = computed(() => model.value.find(m => m.name === monthName.value))
const validMonthName = computed(() => validMonthNameDatatypes.includes(typeof monthName.value) && !monthNameIsTaken.value)
@@ -23,7 +23,7 @@ const validMonthName = computed(() => validMonthNameDatatypes.includes(typeof mo
*/
const monthDays: Ref<number | undefined> = ref<number>()
const monthDaysRef = ref<HTMLInputElement>()
const validMonthDaysDatatypes = ['number']
const validMonthDaysDatatypes = ["number"]
const validMonthDays = computed(() => validMonthDaysDatatypes.includes(typeof monthDays.value) && monthDays.value && monthDays.value >= 12)
const validNewMonth = computed(() => validMonthDays.value && validMonthName.value)
@@ -44,7 +44,7 @@ function addMonthToModel(): void {
model.value.push(monthToInsert)
// Reset form state
monthName.value = ''
monthName.value = ""
monthNameFocused.value = true
}

8
components/calendar/input/RPGDate.vue
View File

@@ -1,9 +1,9 @@
<script lang="ts" setup>
import type { RPGDate } from '~/models/Date';
import type { RPGDate } from "~/models/Date";
import {
PhXCircle
} from '@phosphor-icons/vue'
} from "@phosphor-icons/vue"
const model = defineModel<RPGDate | null>()
@@ -27,7 +27,7 @@ const inputPlaceholder = computed<string>(() => {
return props.placeholder
}
return ''
return ""
})
const initialDateValue = props.initialDate ? { ...props.initialDate } : null
@@ -37,7 +37,7 @@ const monthTitle = computed<string>(() => {
return getMonthName(model.value.month)
}
return ''
return ""
})
const hasValue = computed<boolean>(() => !!model.value)

6
components/calendar/input/TodaySelect.vue
View File

@@ -1,8 +1,8 @@
<script lang="ts" setup>
import type { CalendarMonth } from '~/models/CalendarMonth';
import type { RPGDate } from '~/models/Date';
import type { CalendarMonth } from "~/models/CalendarMonth";
import type { RPGDate } from "~/models/Date";
import { PhCalendarBlank } from '@phosphor-icons/vue';
import { PhCalendarBlank } from "@phosphor-icons/vue";
const model = defineModel<RPGDate>({ required: true })

54
components/calendar/search/CalendarSearch.vue
View File

@@ -2,46 +2,46 @@
import {
isCharacter,
type Character,
} from '@/models/Characters'
import type { RPGDateOrder } from '@/models/Date'
} from "@/models/Characters"
import type { RPGDateOrder } from "@/models/Date"
import {
isCalendarEvent,
type CalendarEvent,
} from '~/models/CalendarEvent'
import { capitalize } from '@/utils/Strings'
import { useMagicKeys, useScroll, useStorage, whenever } from '@vueuse/core'
import { computed, ref, watch } from 'vue'
import { searchUnifier, type SearchMode } from '../SearchMode'
} from "~/models/CalendarEvent"
import { capitalize } from "@/utils/Strings"
import { useMagicKeys, useScroll, useStorage, whenever } from "@vueuse/core"
import { computed, ref, watch } from "vue"
import { searchUnifier, type SearchMode } from "../SearchMode"
import { PhClockClockwise, PhClockCounterClockwise, PhMagnifyingGlass } from '@phosphor-icons/vue'
import { PhClockClockwise, PhClockCounterClockwise, PhMagnifyingGlass } from "@phosphor-icons/vue"
import {
ComboboxAnchor,
ComboboxInput,
ComboboxPortal,
ComboboxRoot,
VisuallyHidden
} from 'radix-vue'
} from "radix-vue"
import SearchList from './lists/SearchList.vue'
import type { Category } from '~/models/Category'
import SearchList from "./lists/SearchList.vue"
import type { Category } from "~/models/Category"
const { isAdvancedSearchOpen, allEvents } = storeToRefs(useCalendar())
const { characters } = storeToRefs(useCharacters())
const searchQuery = ref<string>('')
const searchQuery = ref<string>("")
// const searchEnough = computed<boolean>(() => searchQuery.value.length >= 2)
const selectedEntity = useStorage('se', 'events' as SearchMode)
const selectedEntity = useStorage("se", "events" as SearchMode)
// Order
const selectedOrder = ref<RPGDateOrder>('asc')
const selectedOrder = ref<RPGDateOrder>("asc")
function setOrderAsc() {
selectedOrder.value = 'asc'
selectedOrder.value = "asc"
resetPage()
}
function setOrderDesc() {
selectedOrder.value = 'desc'
selectedOrder.value = "desc"
resetPage()
}
@@ -65,9 +65,9 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
// Assign data to loop over and filter
// They are assigned this way for readability
if (selectedEntity.value === 'events') {
if (selectedEntity.value === "events") {
dataToFilter = allEvents.value
} else if (selectedEntity.value === 'characters') {
} else if (selectedEntity.value === "characters") {
dataToFilter = characters.value
} else {
dataToFilter = [...allEvents.value, ...characters.value]
@@ -80,15 +80,15 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
// Filter calendar events
if (isCalendarEvent(item)) {
const queryString = new String(searchQuery.value)
.replace(searchUnifier, '')
.replace(searchUnifier, "")
.toLocaleLowerCase()
const hitTitle = item.title
.replace(searchUnifier, '')
.replace(searchUnifier, "")
.toLocaleLowerCase()
.includes(queryString)
const hitDesc = item.description
?.replace(searchUnifier, '')
?.replace(searchUnifier, "")
.toLocaleLowerCase()
.includes(queryString)
@@ -118,11 +118,11 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
// Filter characters
if (isCharacter(item)) {
const queryString = new String(searchQuery.value)
.replace(searchUnifier, '')
.replace(searchUnifier, "")
.toLocaleLowerCase()
const hitTitle = item.name
.replace(searchUnifier, '')
.replace(searchUnifier, "")
.toLocaleLowerCase()
.includes(queryString)
@@ -157,7 +157,7 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
* Removes the search query, resets the pagination and removes all selected categories
*/
function resetSearch() {
searchQuery.value = ''
searchQuery.value = ""
resetPage()
selectedCategories.value = []
}
@@ -205,7 +205,7 @@ const currentCategories = computed(() => {
const selectedCategories = ref<(Category)[]>([])
const categoryFilterOpened = ref<boolean>(false)
const searchCategory = ref<string>('')
const searchCategory = ref<string>("")
const filteredCategories = computed(() =>
currentCategories.value.filter((i) => !selectedCategories.value.includes(i))
@@ -217,8 +217,8 @@ const filteredCategories = computed(() =>
* @param e Radix Change Event
*/
function handleCategorySelect(e: (Category)) {
if (typeof e === 'string') {
searchCategory.value = ''
if (typeof e === "string") {
searchCategory.value = ""
selectedCategories.value.push(e)
}

14
components/calendar/search/lists/CharacterCallout.vue
View File

@@ -1,18 +1,18 @@
<script lang="ts" setup>
import type { Character } from '@/models/Characters'
import type { RPGDate } from '@/models/Date'
import { useCalendar } from '@/stores/CalendarStore'
import type { Character } from "@/models/Characters"
import type { RPGDate } from "@/models/Date"
import { useCalendar } from "@/stores/CalendarStore"
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'
import { Button } from '@/components/ui/button'
import { PhArrowSquareOut, PhPlant, PhSkull } from '@phosphor-icons/vue'
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
import { Button } from "@/components/ui/button"
import { PhArrowSquareOut, PhPlant, PhSkull } from "@phosphor-icons/vue"
const props = defineProps<{
character: Character
}>()
defineEmits<{
(e: 'query:date-jump', payload: RPGDate): void
(e: "query:date-jump", payload: RPGDate): void
}>()
const { getFormattedDateTitle } = useCalendar()

12
components/calendar/search/lists/EventCallout.vue
View File

@@ -1,23 +1,23 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils'
import type { RPGDate } from '@/models/Date'
import type { CalendarEvent } from '@/models/CalendarEvent'
import { cn } from "@/lib/utils"
import type { RPGDate } from "@/models/Date"
import type { CalendarEvent } from "@/models/CalendarEvent"
import { PhArrowSquareOut, PhHourglassMedium, PhAlarm, PhMapPinArea, PhEye } from '@phosphor-icons/vue'
import { PhArrowSquareOut, PhHourglassMedium, PhAlarm, PhMapPinArea, PhEye } from "@phosphor-icons/vue"
const props = defineProps<{
event: CalendarEvent
}>()
defineEmits<{
(e: 'query:date-jump', payload: RPGDate): void
(e: "query:date-jump", payload: RPGDate): void
}>()
const { getRelativeString, defaultDate, getFormattedDateTitle } = useCalendar()
const dateDifference: string = getRelativeString(defaultDate, props.event.startDate)
const dateDuration: string | null = props.event.endDate
? getRelativeString(props.event.startDate, props.event.endDate, 'compact')
? getRelativeString(props.event.startDate, props.event.endDate, "compact")
: null
</script>

20
components/calendar/search/lists/SearchList.vue
View File

@@ -1,13 +1,13 @@
<script lang="ts" setup>
import { isCharacter, type Character } from '@/models/Characters'
import type { RPGDate, RPGDateOrder } from '@/models/Date'
import { useCalendar } from '@/stores/CalendarStore'
import { computed } from 'vue'
import { isCalendarEvent, type CalendarEvent } from '~/models/CalendarEvent'
import type { SearchMode } from '../../SearchMode'
import { isCharacter, type Character } from "@/models/Characters"
import type { RPGDate, RPGDateOrder } from "@/models/Date"
import { useCalendar } from "@/stores/CalendarStore"
import { computed } from "vue"
import { isCalendarEvent, type CalendarEvent } from "~/models/CalendarEvent"
import type { SearchMode } from "../../SearchMode"
import CharacterCallout from './CharacterCallout.vue'
import EventCallout from './EventCallout.vue'
import CharacterCallout from "./CharacterCallout.vue"
import EventCallout from "./EventCallout.vue"
const props = defineProps<{
results: (Character | CalendarEvent)[]
@@ -18,7 +18,7 @@ const props = defineProps<{
limit?: number
}>()
const emit = defineEmits(['jumpedToDate'])
const emit = defineEmits(["jumpedToDate"])
const { jumpToDate, compareDates } = useCalendar()
@@ -26,7 +26,7 @@ function handleJumpToDate(date?: RPGDate) {
if (!date) return
jumpToDate(date)
emit('jumpedToDate')
emit("jumpedToDate")
}
// Initial sorting of the results

12
components/calendar/state/monthly/DayTile.vue
View File

@@ -1,11 +1,11 @@
<script lang="ts" setup>
import type { RPGDate } from '@/models/Date'
import type { CalendarEvent } from '@/models/CalendarEvent'
import { useElementBounding } from '@vueuse/core'
import { storeToRefs } from 'pinia'
import { computed, ref, type ComputedRef } from 'vue'
import type { RPGDate } from "@/models/Date"
import type { CalendarEvent } from "@/models/CalendarEvent"
import { useElementBounding } from "@vueuse/core"
import { storeToRefs } from "pinia"
import { computed, ref, type ComputedRef } from "vue"
import CalendarEventButton from '../../CalendarEvent.vue'
import CalendarEventButton from "../../CalendarEvent.vue"
const props = defineProps<{
date: RPGDate

4
components/calendar/state/monthly/Layout.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { useCalendar } from '@/stores/CalendarStore'
import { useThrottleFn } from '@vueuse/core'
import { useCalendar } from "@/stores/CalendarStore"
import { useThrottleFn } from "@vueuse/core"
const { currentDate, decrementViewMonth, incrementViewMonth } = useCalendar()
const { currentMonthData } = storeToRefs(useCalendar())

6
components/calendar/state/yearly/DayTile.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { RPGDate } from '@/models/Date'
import { storeToRefs } from 'pinia'
import { computed, type ComputedRef } from 'vue'
import type { RPGDate } from "@/models/Date"
import { storeToRefs } from "pinia"
import { computed, type ComputedRef } from "vue"
const { currentDate, defaultDate, selectDate, areDatesIdentical } = useCalendar()
const { selectedDate, currentEvents } = storeToRefs(useCalendar())

4
components/calendar/state/yearly/Layout.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { useCalendar } from '@/stores/CalendarStore'
import { useThrottleFn } from '@vueuse/core'
import { useCalendar } from "@/stores/CalendarStore"
import { useThrottleFn } from "@vueuse/core"
const { decrementViewYear, incrementViewYear } = useCalendar()
const { sortedMonths: months } = storeToRefs(useCalendar())

2
components/calendar/state/yearly/MonthTile.vue
View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import type { CalendarMonth } from '~/models/CalendarMonth';
import type { CalendarMonth } from "~/models/CalendarMonth";
defineProps<{
month: CalendarMonth

8
components/global/Spacing.vue
View File

@@ -1,8 +1,8 @@
<script lang="ts" setup>
import { cn } from '~/lib/utils';
import { cn } from "~/lib/utils";
interface SpacingProps {
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xlg' | '2xl' | '3xl'
size?: "xs" | "sm" | "md" | "lg" | "xlg" | "2xl" | "3xl"
}
const props = defineProps<SpacingProps>()
@@ -10,11 +10,11 @@ const props = defineProps<SpacingProps>()
let spacingClass: string
switch (props.size) {
case 'lg':
case "lg":
spacingClass = "space-y-4"
break;
case 'md':
case "md":
default:
spacingClass = "space-y-2"
break;

6
components/global/sidebar/Sidebar.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { PhHouse, PhList } from '@phosphor-icons/vue'
import type { SidebarMenuActionType } from './SidebarProps';
import { PhHouse, PhList } from "@phosphor-icons/vue"
import type { SidebarMenuActionType } from "./SidebarProps";
const { revealAdvancedSearch } = useCalendar()
const { currentMenu } = storeToRefs(useUiStore())
@@ -8,7 +8,7 @@ const { currentMenu } = storeToRefs(useUiStore())
const user = useSupabaseUser()
function handleMenuItemAction(actionType: SidebarMenuActionType) {
if (actionType === 'event-search') {
if (actionType === "event-search") {
revealAdvancedSearch()
}
}

12
components/global/user/CTA.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { computed } from 'vue'
import { computed } from "vue"
import { PhUserCircle } from '@phosphor-icons/vue'
import { PhUserCircle } from "@phosphor-icons/vue"
const router = useRouter()
@@ -19,11 +19,11 @@ watch(user, closeMenu)
async function handleGoogleLogin() {
try {
auth.signInWithOAuth({
provider: 'google',
provider: "google",
options: {
queryParams: {
access_type: 'offline',
prompt: 'consent'
access_type: "offline",
prompt: "consent"
}
}
})
@@ -43,7 +43,7 @@ async function handleLogout() {
}
function gotoProfilePage() {
router.push({ path: '/i' })
router.push({ path: "/i" })
closeMenu()
}

2
components/ui/alert-dialog/AlertDialog.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot, useForwardPropsEmits } from 'radix-vue'
import { type AlertDialogEmits, type AlertDialogProps, AlertDialogRoot, useForwardPropsEmits } from "radix-vue"
const props = defineProps<AlertDialogProps>()
const emits = defineEmits<AlertDialogEmits>()

10
components/ui/alert-dialog/AlertDialogAction.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { AlertDialogAction, type AlertDialogActionProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { buttonVariants } from '@/components/ui/button/index'
import { type HTMLAttributes, computed } from "vue"
import { AlertDialogAction, type AlertDialogActionProps } from "radix-vue"
import { cn } from "@/lib/utils"
import { buttonVariants } from "@/components/ui/button/index"
const props = defineProps<AlertDialogActionProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<AlertDialogActionProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

10
components/ui/alert-dialog/AlertDialogCancel.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { AlertDialogCancel, type AlertDialogCancelProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { buttonVariants } from '@/components/ui/button/index'
import { type HTMLAttributes, computed } from "vue"
import { AlertDialogCancel, type AlertDialogCancelProps } from "radix-vue"
import { cn } from "@/lib/utils"
import { buttonVariants } from "@/components/ui/button/index"
const props = defineProps<AlertDialogCancelProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<AlertDialogCancelProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

8
components/ui/alert-dialog/AlertDialogContent.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
AlertDialogContent,
type AlertDialogContentEmits,
@@ -7,10 +7,10 @@ import {
AlertDialogOverlay,
AlertDialogPortal,
useForwardPropsEmits,
} from 'radix-vue'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<AlertDialogContentProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<AlertDialogContentProps & { class?: HTMLAttributes["class"] }>()
const emits = defineEmits<AlertDialogContentEmits>()
const delegatedProps = computed(() => {

8
components/ui/alert-dialog/AlertDialogDescription.vue
View File

@@ -1,12 +1,12 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
AlertDialogDescription,
type AlertDialogDescriptionProps,
} from 'radix-vue'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<AlertDialogDescriptionProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<AlertDialogDescriptionProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

6
components/ui/alert-dialog/AlertDialogFooter.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

6
components/ui/alert-dialog/AlertDialogHeader.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

8
components/ui/alert-dialog/AlertDialogTitle.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { AlertDialogTitle, type AlertDialogTitleProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import { AlertDialogTitle, type AlertDialogTitleProps } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<AlertDialogTitleProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<AlertDialogTitleProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

2
components/ui/alert-dialog/AlertDialogTrigger.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { AlertDialogTrigger, type AlertDialogTriggerProps } from 'radix-vue'
import { AlertDialogTrigger, type AlertDialogTriggerProps } from "radix-vue"
const props = defineProps<AlertDialogTriggerProps>()
</script>

18
components/ui/alert-dialog/index.ts
View File

@@ -1,9 +1,9 @@
export { default as AlertDialog } from './AlertDialog.vue'
export { default as AlertDialogTrigger } from './AlertDialogTrigger.vue'
export { default as AlertDialogContent } from './AlertDialogContent.vue'
export { default as AlertDialogHeader } from './AlertDialogHeader.vue'
export { default as AlertDialogTitle } from './AlertDialogTitle.vue'
export { default as AlertDialogDescription } from './AlertDialogDescription.vue'
export { default as AlertDialogFooter } from './AlertDialogFooter.vue'
export { default as AlertDialogAction } from './AlertDialogAction.vue'
export { default as AlertDialogCancel } from './AlertDialogCancel.vue'
export { default as AlertDialog } from "./AlertDialog.vue"
export { default as AlertDialogTrigger } from "./AlertDialogTrigger.vue"
export { default as AlertDialogContent } from "./AlertDialogContent.vue"
export { default as AlertDialogHeader } from "./AlertDialogHeader.vue"
export { default as AlertDialogTitle } from "./AlertDialogTitle.vue"
export { default as AlertDialogDescription } from "./AlertDialogDescription.vue"
export { default as AlertDialogFooter } from "./AlertDialogFooter.vue"
export { default as AlertDialogAction } from "./AlertDialogAction.vue"
export { default as AlertDialogCancel } from "./AlertDialogCancel.vue"

18
components/ui/avatar/Avatar.vue
View File

@@ -1,16 +1,16 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { AvatarRoot } from 'radix-vue'
import { type AvatarVariants, avatarVariant } from '.'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { AvatarRoot } from "radix-vue"
import { type AvatarVariants, avatarVariant } from "."
import { cn } from "@/lib/utils"
const props = withDefaults(defineProps<{
class?: HTMLAttributes['class']
size?: AvatarVariants['size']
shape?: AvatarVariants['shape']
class?: HTMLAttributes["class"]
size?: AvatarVariants["size"]
shape?: AvatarVariants["shape"]
}>(), {
size: 'sm',
shape: 'circle',
size: "sm",
shape: "circle",
})
</script>

2
components/ui/avatar/AvatarFallback.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { AvatarFallback, type AvatarFallbackProps } from 'radix-vue'
import { AvatarFallback, type AvatarFallbackProps } from "radix-vue"
const props = defineProps<AvatarFallbackProps>()
</script>

2
components/ui/avatar/AvatarImage.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { AvatarImage, type AvatarImageProps } from 'radix-vue'
import { AvatarImage, type AvatarImageProps } from "radix-vue"
const props = defineProps<AvatarImageProps>()
</script>

20
components/ui/avatar/index.ts
View File

@@ -1,21 +1,21 @@
import { type VariantProps, cva } from 'class-variance-authority'
import { type VariantProps, cva } from "class-variance-authority"
export { default as Avatar } from './Avatar.vue'
export { default as AvatarImage } from './AvatarImage.vue'
export { default as AvatarFallback } from './AvatarFallback.vue'
export { default as Avatar } from "./Avatar.vue"
export { default as AvatarImage } from "./AvatarImage.vue"
export { default as AvatarFallback } from "./AvatarFallback.vue"
export const avatarVariant = cva(
'inline-flex items-center justify-center font-normal text-foreground select-none shrink-0 bg-secondary overflow-hidden',
"inline-flex items-center justify-center font-normal text-foreground select-none shrink-0 bg-secondary overflow-hidden",
{
variants: {
size: {
sm: 'h-10 w-10 text-xs',
base: 'h-16 w-16 text-2xl',
lg: 'h-32 w-32 text-5xl',
sm: "h-10 w-10 text-xs",
base: "h-16 w-16 text-2xl",
lg: "h-32 w-32 text-5xl",
},
shape: {
circle: 'rounded-full',
square: 'rounded-md',
circle: "rounded-full",
square: "rounded-md",
},
},
},

10
components/ui/badge/Badge.vue
View File

@@ -1,11 +1,11 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { type BadgeVariants, badgeVariants } from '.'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { type BadgeVariants, badgeVariants } from "."
import { cn } from "@/lib/utils"
const props = defineProps<{
variant?: BadgeVariants['variant']
class?: HTMLAttributes['class']
variant?: BadgeVariants["variant"]
class?: HTMLAttributes["class"]
}>()
</script>

16
components/ui/badge/index.ts
View File

@@ -1,23 +1,23 @@
import { type VariantProps, cva } from 'class-variance-authority'
import { type VariantProps, cva } from "class-variance-authority"
export { default as Badge } from './Badge.vue'
export { default as Badge } from "./Badge.vue"
export const badgeVariants = cva(
'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
"inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
{
variants: {
variant: {
default:
'border-transparent bg-primary text-primary-foreground hover:bg-primary/80',
"border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
secondary:
'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
"border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
destructive:
'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80',
outline: 'text-foreground',
"border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
outline: "text-foreground",
},
},
defaultVariants: {
variant: 'default',
variant: "default",
},
},
)

16
components/ui/button/Button.vue
View File

@@ -1,18 +1,18 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { Primitive, type PrimitiveProps } from 'radix-vue'
import { type ButtonVariants, buttonVariants } from '.'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { Primitive, type PrimitiveProps } from "radix-vue"
import { type ButtonVariants, buttonVariants } from "."
import { cn } from "@/lib/utils"
interface Props extends PrimitiveProps {
variant?: ButtonVariants['variant']
size?: ButtonVariants['size']
class?: HTMLAttributes['class']
variant?: ButtonVariants["variant"]
size?: ButtonVariants["size"]
class?: HTMLAttributes["class"]
searchSlash?: boolean
}
const props = withDefaults(defineProps<Props>(), {
as: 'button'
as: "button"
})
</script>

32
components/ui/button/index.ts
View File

@@ -1,30 +1,30 @@
import { type VariantProps, cva } from 'class-variance-authority'
import { type VariantProps, cva } from "class-variance-authority"
export { default as Button } from './Button.vue'
export { default as Button } from "./Button.vue"
export const buttonVariants = cva(
'inline-flex items-center justify-center gap-1 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
"inline-flex items-center justify-center gap-1 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
{
variants: {
variant: {
default: 'bg-primary text-primary-foreground hover:bg-primary/90',
destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
ghost: 'hover:bg-accent hover:text-accent-foreground',
link: 'text-primary underline-offset-4 hover:underline'
default: "bg-primary text-primary-foreground hover:bg-primary/90",
destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
ghost: "hover:bg-accent hover:text-accent-foreground",
link: "text-primary underline-offset-4 hover:underline"
},
size: {
default: 'h-10 px-4 py-2',
xs: 'h-7 rounded-sm px-2 text-xs',
sm: 'h-9 rounded-md px-3 text-sm',
lg: 'h-11 rounded-md px-8',
icon: 'h-10 w-10'
default: "h-10 px-4 py-2",
xs: "h-7 rounded-sm px-2 text-xs",
sm: "h-9 rounded-md px-3 text-sm",
lg: "h-11 rounded-md px-8",
icon: "h-10 w-10"
}
},
defaultVariants: {
variant: 'default',
size: 'default'
variant: "default",
size: "default"
}
}
)

6
components/ui/card/Card.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
link?: string
}>()
</script>

6
components/ui/card/CardContent.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

6
components/ui/card/CardDescription.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

6
components/ui/card/CardFooter.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

6
components/ui/card/CardHeader.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

6
components/ui/card/CardTitle.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

12
components/ui/card/index.ts
View File

@@ -1,6 +1,6 @@
export { default as Card } from './Card.vue'
export { default as CardHeader } from './CardHeader.vue'
export { default as CardTitle } from './CardTitle.vue'
export { default as CardDescription } from './CardDescription.vue'
export { default as CardContent } from './CardContent.vue'
export { default as CardFooter } from './CardFooter.vue'
export { default as Card } from "./Card.vue"
export { default as CardHeader } from "./CardHeader.vue"
export { default as CardTitle } from "./CardTitle.vue"
export { default as CardDescription } from "./CardDescription.vue"
export { default as CardContent } from "./CardContent.vue"
export { default as CardFooter } from "./CardFooter.vue"

12
components/ui/checkbox/Checkbox.vue
View File

@@ -1,11 +1,11 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import type { CheckboxRootEmits, CheckboxRootProps } from 'radix-vue'
import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from 'radix-vue'
import { Check } from 'lucide-vue-next'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import type { CheckboxRootEmits, CheckboxRootProps } from "radix-vue"
import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from "radix-vue"
import { Check } from "lucide-vue-next"
import { cn } from "@/lib/utils"
const props = defineProps<CheckboxRootProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<CheckboxRootProps & { class?: HTMLAttributes["class"] }>()
const emits = defineEmits<CheckboxRootEmits>()
const delegatedProps = computed(() => {

2
components/ui/checkbox/index.ts
View File

@@ -1 +1 @@
export { default as Checkbox } from './Checkbox.vue'
export { default as Checkbox } from "./Checkbox.vue"

12
components/ui/command/Command.vue
View File

@@ -1,12 +1,12 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import type { ComboboxRootEmits, ComboboxRootProps } from 'radix-vue'
import { ComboboxRoot, useForwardPropsEmits } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import type { ComboboxRootEmits, ComboboxRootProps } from "radix-vue"
import { ComboboxRoot, useForwardPropsEmits } from "radix-vue"
import { cn } from "@/lib/utils"
const props = withDefaults(defineProps<ComboboxRootProps & { class?: HTMLAttributes['class'] }>(), {
const props = withDefaults(defineProps<ComboboxRootProps & { class?: HTMLAttributes["class"] }>(), {
open: true,
modelValue: ''
modelValue: ""
})
const emits = defineEmits<ComboboxRootEmits>()

8
components/ui/command/CommandDialog.vue
View File

@@ -1,8 +1,8 @@
<script setup lang="ts">
import { useForwardPropsEmits } from 'radix-vue'
import type { DialogRootEmits, DialogRootProps } from 'radix-vue'
import Command from './Command.vue'
import { Dialog, DialogContent } from '@/components/ui/dialog'
import { useForwardPropsEmits } from "radix-vue"
import type { DialogRootEmits, DialogRootProps } from "radix-vue"
import Command from "./Command.vue"
import { Dialog, DialogContent } from "@/components/ui/dialog"
const props = defineProps<DialogRootProps>()
const emits = defineEmits<DialogRootEmits>()

10
components/ui/command/CommandEmpty.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import type { ComboboxEmptyProps } from 'radix-vue'
import { ComboboxEmpty } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import type { ComboboxEmptyProps } from "radix-vue"
import { ComboboxEmpty } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<ComboboxEmptyProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<ComboboxEmptyProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

10
components/ui/command/CommandGroup.vue
View File

@@ -1,12 +1,12 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import type { ComboboxGroupProps } from 'radix-vue'
import { ComboboxGroup, ComboboxLabel } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import type { ComboboxGroupProps } from "radix-vue"
import { ComboboxGroup, ComboboxLabel } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<
ComboboxGroupProps & {
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
heading?: string
}
>()

10
components/ui/command/CommandInput.vue
View File

@@ -1,8 +1,8 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { Search } from 'lucide-vue-next'
import { ComboboxInput, type ComboboxInputProps, useForwardProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import { Search } from "lucide-vue-next"
import { ComboboxInput, type ComboboxInputProps, useForwardProps } from "radix-vue"
import { cn } from "@/lib/utils"
defineOptions({
inheritAttrs: false
@@ -10,7 +10,7 @@ defineOptions({
const props = defineProps<
ComboboxInputProps & {
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}
>()

10
components/ui/command/CommandItem.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import type { ComboboxItemEmits, ComboboxItemProps } from 'radix-vue'
import { ComboboxItem, useForwardPropsEmits } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import type { ComboboxItemEmits, ComboboxItemProps } from "radix-vue"
import { ComboboxItem, useForwardPropsEmits } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<ComboboxItemProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<ComboboxItemProps & { class?: HTMLAttributes["class"] }>()
const emits = defineEmits<ComboboxItemEmits>()
const delegatedProps = computed(() => {

10
components/ui/command/CommandList.vue
View File

@@ -1,11 +1,11 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import type { ComboboxContentEmits, ComboboxContentProps } from 'radix-vue'
import { ComboboxContent, useForwardPropsEmits } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import type { ComboboxContentEmits, ComboboxContentProps } from "radix-vue"
import { ComboboxContent, useForwardPropsEmits } from "radix-vue"
import { cn } from "@/lib/utils"
const props = withDefaults(
defineProps<ComboboxContentProps & { class?: HTMLAttributes['class'] }>(),
defineProps<ComboboxContentProps & { class?: HTMLAttributes["class"] }>(),
{
dismissable: false
}

10
components/ui/command/CommandSeparator.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import type { ComboboxSeparatorProps } from 'radix-vue'
import { ComboboxSeparator } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import type { ComboboxSeparatorProps } from "radix-vue"
import { ComboboxSeparator } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<ComboboxSeparatorProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<ComboboxSeparatorProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

6
components/ui/command/CommandShortcut.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

20
components/ui/command/index.ts
View File

@@ -1,11 +1,11 @@
export { ComboboxPortal } from 'radix-vue'
export { ComboboxPortal } from "radix-vue"
export { default as Command } from './Command.vue'
export { default as CommandDialog } from './CommandDialog.vue'
export { default as CommandEmpty } from './CommandEmpty.vue'
export { default as CommandGroup } from './CommandGroup.vue'
export { default as CommandInput } from './CommandInput.vue'
export { default as CommandItem } from './CommandItem.vue'
export { default as CommandList } from './CommandList.vue'
export { default as CommandSeparator } from './CommandSeparator.vue'
export { default as CommandShortcut } from './CommandShortcut.vue'
export { default as Command } from "./Command.vue"
export { default as CommandDialog } from "./CommandDialog.vue"
export { default as CommandEmpty } from "./CommandEmpty.vue"
export { default as CommandGroup } from "./CommandGroup.vue"
export { default as CommandInput } from "./CommandInput.vue"
export { default as CommandItem } from "./CommandItem.vue"
export { default as CommandList } from "./CommandList.vue"
export { default as CommandSeparator } from "./CommandSeparator.vue"
export { default as CommandShortcut } from "./CommandShortcut.vue"

2
components/ui/dialog/Dialog.vue
View File

@@ -4,7 +4,7 @@ import {
type DialogRootEmits,
type DialogRootProps,
useForwardPropsEmits
} from 'radix-vue'
} from "radix-vue"
const props = defineProps<DialogRootProps>()
const emits = defineEmits<DialogRootEmits>()

2
components/ui/dialog/DialogClose.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { DialogClose, type DialogCloseProps } from 'radix-vue'
import { DialogClose, type DialogCloseProps } from "radix-vue"
const props = defineProps<DialogCloseProps>()
</script>

10
components/ui/dialog/DialogContent.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
DialogClose,
DialogContent,
@@ -8,11 +8,11 @@ import {
DialogOverlay,
DialogPortal,
useForwardPropsEmits
} from 'radix-vue'
import { X } from 'lucide-vue-next'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { X } from "lucide-vue-next"
import { cn } from "@/lib/utils"
const props = defineProps<DialogContentProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<DialogContentProps & { class?: HTMLAttributes["class"] }>()
const emits = defineEmits<DialogContentEmits>()
const delegatedProps = computed(() => {

8
components/ui/dialog/DialogDescription.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { DialogDescription, type DialogDescriptionProps, useForwardProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import { DialogDescription, type DialogDescriptionProps, useForwardProps } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<DialogDescriptionProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<DialogDescriptionProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

6
components/ui/dialog/DialogFooter.vue
View File

@@ -1,8 +1,8 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{ class?: HTMLAttributes['class'] }>()
const props = defineProps<{ class?: HTMLAttributes["class"] }>()
</script>
<template>

6
components/ui/dialog/DialogHeader.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

10
components/ui/dialog/DialogScrollContent.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
DialogClose,
DialogContent,
@@ -8,11 +8,11 @@ import {
DialogOverlay,
DialogPortal,
useForwardPropsEmits
} from 'radix-vue'
import { X } from 'lucide-vue-next'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { X } from "lucide-vue-next"
import { cn } from "@/lib/utils"
const props = defineProps<DialogContentProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<DialogContentProps & { class?: HTMLAttributes["class"] }>()
const emits = defineEmits<DialogContentEmits>()
const delegatedProps = computed(() => {

8
components/ui/dialog/DialogTitle.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { DialogTitle, type DialogTitleProps, useForwardProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import { DialogTitle, type DialogTitleProps, useForwardProps } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<DialogTitleProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<DialogTitleProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

2
components/ui/dialog/DialogTrigger.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { DialogTrigger, type DialogTriggerProps } from 'radix-vue'
import { DialogTrigger, type DialogTriggerProps } from "radix-vue"
const props = defineProps<DialogTriggerProps>()
</script>

18
components/ui/dialog/index.ts
View File

@@ -1,9 +1,9 @@
export { default as Dialog } from './Dialog.vue'
export { default as DialogClose } from './DialogClose.vue'
export { default as DialogTrigger } from './DialogTrigger.vue'
export { default as DialogHeader } from './DialogHeader.vue'
export { default as DialogTitle } from './DialogTitle.vue'
export { default as DialogDescription } from './DialogDescription.vue'
export { default as DialogContent } from './DialogContent.vue'
export { default as DialogScrollContent } from './DialogScrollContent.vue'
export { default as DialogFooter } from './DialogFooter.vue'
export { default as Dialog } from "./Dialog.vue"
export { default as DialogClose } from "./DialogClose.vue"
export { default as DialogTrigger } from "./DialogTrigger.vue"
export { default as DialogHeader } from "./DialogHeader.vue"
export { default as DialogTitle } from "./DialogTitle.vue"
export { default as DialogDescription } from "./DialogDescription.vue"
export { default as DialogContent } from "./DialogContent.vue"
export { default as DialogScrollContent } from "./DialogScrollContent.vue"
export { default as DialogFooter } from "./DialogFooter.vue"

2
components/ui/dropdown-menu/DropdownMenu.vue
View File

@@ -4,7 +4,7 @@ import {
type DropdownMenuRootEmits,
type DropdownMenuRootProps,
useForwardPropsEmits
} from 'radix-vue'
} from "radix-vue"
const props = defineProps<DropdownMenuRootProps>()
const emits = defineEmits<DropdownMenuRootEmits>()

10
components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue
View File

@@ -1,16 +1,16 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
DropdownMenuCheckboxItem,
type DropdownMenuCheckboxItemEmits,
type DropdownMenuCheckboxItemProps,
DropdownMenuItemIndicator,
useForwardPropsEmits
} from 'radix-vue'
import { Check } from 'lucide-vue-next'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { Check } from "lucide-vue-next"
import { cn } from "@/lib/utils"
const props = defineProps<DropdownMenuCheckboxItemProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<DropdownMenuCheckboxItemProps & { class?: HTMLAttributes["class"] }>()
const emits = defineEmits<DropdownMenuCheckboxItemEmits>()
const delegatedProps = computed(() => {

8
components/ui/dropdown-menu/DropdownMenuContent.vue
View File

@@ -1,16 +1,16 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
DropdownMenuContent,
type DropdownMenuContentEmits,
type DropdownMenuContentProps,
DropdownMenuPortal,
useForwardPropsEmits
} from 'radix-vue'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { cn } from "@/lib/utils"
const props = withDefaults(
defineProps<DropdownMenuContentProps & { class?: HTMLAttributes['class'] }>(),
defineProps<DropdownMenuContentProps & { class?: HTMLAttributes["class"] }>(),
{
sideOffset: 4
}

2
components/ui/dropdown-menu/DropdownMenuGroup.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { DropdownMenuGroup, type DropdownMenuGroupProps } from 'radix-vue'
import { DropdownMenuGroup, type DropdownMenuGroupProps } from "radix-vue"
const props = defineProps<DropdownMenuGroupProps>()
</script>

8
components/ui/dropdown-menu/DropdownMenuItem.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { DropdownMenuItem, type DropdownMenuItemProps, useForwardProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import { DropdownMenuItem, type DropdownMenuItemProps, useForwardProps } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<
DropdownMenuItemProps & { class?: HTMLAttributes['class']; inset?: boolean }
DropdownMenuItemProps & { class?: HTMLAttributes["class"]; inset?: boolean }
>()
const delegatedProps = computed(() => {

8
components/ui/dropdown-menu/DropdownMenuLabel.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { DropdownMenuLabel, type DropdownMenuLabelProps, useForwardProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import { DropdownMenuLabel, type DropdownMenuLabelProps, useForwardProps } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<
DropdownMenuLabelProps & { class?: HTMLAttributes['class']; inset?: boolean }
DropdownMenuLabelProps & { class?: HTMLAttributes["class"]; inset?: boolean }
>()
const delegatedProps = computed(() => {

2
components/ui/dropdown-menu/DropdownMenuRadioGroup.vue
View File

@@ -4,7 +4,7 @@ import {
type DropdownMenuRadioGroupEmits,
type DropdownMenuRadioGroupProps,
useForwardPropsEmits
} from 'radix-vue'
} from "radix-vue"
const props = defineProps<DropdownMenuRadioGroupProps>()
const emits = defineEmits<DropdownMenuRadioGroupEmits>()

10
components/ui/dropdown-menu/DropdownMenuRadioItem.vue
View File

@@ -1,16 +1,16 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
DropdownMenuItemIndicator,
DropdownMenuRadioItem,
type DropdownMenuRadioItemEmits,
type DropdownMenuRadioItemProps,
useForwardPropsEmits
} from 'radix-vue'
import { Circle } from 'lucide-vue-next'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { Circle } from "lucide-vue-next"
import { cn } from "@/lib/utils"
const props = defineProps<DropdownMenuRadioItemProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<DropdownMenuRadioItemProps & { class?: HTMLAttributes["class"] }>()
const emits = defineEmits<DropdownMenuRadioItemEmits>()

8
components/ui/dropdown-menu/DropdownMenuSeparator.vue
View File

@@ -1,11 +1,11 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { DropdownMenuSeparator, type DropdownMenuSeparatorProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import { DropdownMenuSeparator, type DropdownMenuSeparatorProps } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<
DropdownMenuSeparatorProps & {
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}
>()

6
components/ui/dropdown-menu/DropdownMenuShortcut.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { cn } from "@/lib/utils"
const props = defineProps<{
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
</script>

2
components/ui/dropdown-menu/DropdownMenuSub.vue
View File

@@ -4,7 +4,7 @@ import {
type DropdownMenuSubEmits,
type DropdownMenuSubProps,
useForwardPropsEmits
} from 'radix-vue'
} from "radix-vue"
const props = defineProps<DropdownMenuSubProps>()
const emits = defineEmits<DropdownMenuSubEmits>()

8
components/ui/dropdown-menu/DropdownMenuSubContent.vue
View File

@@ -1,14 +1,14 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
DropdownMenuSubContent,
type DropdownMenuSubContentEmits,
type DropdownMenuSubContentProps,
useForwardPropsEmits
} from 'radix-vue'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<DropdownMenuSubContentProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<DropdownMenuSubContentProps & { class?: HTMLAttributes["class"] }>()
const emits = defineEmits<DropdownMenuSubContentEmits>()
const delegatedProps = computed(() => {

10
components/ui/dropdown-menu/DropdownMenuSubTrigger.vue
View File

@@ -1,14 +1,14 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { type HTMLAttributes, computed } from "vue"
import {
DropdownMenuSubTrigger,
type DropdownMenuSubTriggerProps,
useForwardProps
} from 'radix-vue'
import { ChevronRight } from 'lucide-vue-next'
import { cn } from '@/lib/utils'
} from "radix-vue"
import { ChevronRight } from "lucide-vue-next"
import { cn } from "@/lib/utils"
const props = defineProps<DropdownMenuSubTriggerProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<DropdownMenuSubTriggerProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

2
components/ui/dropdown-menu/DropdownMenuTrigger.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { DropdownMenuTrigger, type DropdownMenuTriggerProps, useForwardProps } from 'radix-vue'
import { DropdownMenuTrigger, type DropdownMenuTriggerProps, useForwardProps } from "radix-vue"
const props = defineProps<DropdownMenuTriggerProps>()

30
components/ui/dropdown-menu/index.ts
View File

@@ -1,16 +1,16 @@
export { DropdownMenuPortal } from 'radix-vue'
export { DropdownMenuPortal } from "radix-vue"
export { default as DropdownMenu } from './DropdownMenu.vue'
export { default as DropdownMenuTrigger } from './DropdownMenuTrigger.vue'
export { default as DropdownMenuContent } from './DropdownMenuContent.vue'
export { default as DropdownMenuGroup } from './DropdownMenuGroup.vue'
export { default as DropdownMenuRadioGroup } from './DropdownMenuRadioGroup.vue'
export { default as DropdownMenuItem } from './DropdownMenuItem.vue'
export { default as DropdownMenuCheckboxItem } from './DropdownMenuCheckboxItem.vue'
export { default as DropdownMenuRadioItem } from './DropdownMenuRadioItem.vue'
export { default as DropdownMenuShortcut } from './DropdownMenuShortcut.vue'
export { default as DropdownMenuSeparator } from './DropdownMenuSeparator.vue'
export { default as DropdownMenuLabel } from './DropdownMenuLabel.vue'
export { default as DropdownMenuSub } from './DropdownMenuSub.vue'
export { default as DropdownMenuSubTrigger } from './DropdownMenuSubTrigger.vue'
export { default as DropdownMenuSubContent } from './DropdownMenuSubContent.vue'
export { default as DropdownMenu } from "./DropdownMenu.vue"
export { default as DropdownMenuTrigger } from "./DropdownMenuTrigger.vue"
export { default as DropdownMenuContent } from "./DropdownMenuContent.vue"
export { default as DropdownMenuGroup } from "./DropdownMenuGroup.vue"
export { default as DropdownMenuRadioGroup } from "./DropdownMenuRadioGroup.vue"
export { default as DropdownMenuItem } from "./DropdownMenuItem.vue"
export { default as DropdownMenuCheckboxItem } from "./DropdownMenuCheckboxItem.vue"
export { default as DropdownMenuRadioItem } from "./DropdownMenuRadioItem.vue"
export { default as DropdownMenuShortcut } from "./DropdownMenuShortcut.vue"
export { default as DropdownMenuSeparator } from "./DropdownMenuSeparator.vue"
export { default as DropdownMenuLabel } from "./DropdownMenuLabel.vue"
export { default as DropdownMenuSub } from "./DropdownMenuSub.vue"
export { default as DropdownMenuSubTrigger } from "./DropdownMenuSubTrigger.vue"
export { default as DropdownMenuSubContent } from "./DropdownMenuSubContent.vue"

14
components/ui/input/Input.vue
View File

@@ -1,19 +1,19 @@
<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { useVModel } from '@vueuse/core'
import { cn } from '@/lib/utils'
import type { HTMLAttributes } from "vue"
import { useVModel } from "@vueuse/core"
import { cn } from "@/lib/utils"
const props = defineProps<{
defaultValue?: string | number
modelValue?: string | number
class?: HTMLAttributes['class']
class?: HTMLAttributes["class"]
}>()
const emits = defineEmits<{
(e: 'update:modelValue', payload: string | number): void
(e: "update:modelValue", payload: string | number): void
}>()
const modelValue = useVModel(props, 'modelValue', emits, {
const modelValue = useVModel(props, "modelValue", emits, {
passive: true,
defaultValue: props.defaultValue
})
@@ -28,5 +28,5 @@ const modelValue = useVModel(props, 'modelValue', emits, {
props.class
)
"
/>
>
</template>

2
components/ui/input/index.ts
View File

@@ -1 +1 @@
export { default as Input } from './Input.vue'
export { default as Input } from "./Input.vue"

8
components/ui/label/Label.vue
View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import { type HTMLAttributes, computed } from 'vue'
import { Label, type LabelProps } from 'radix-vue'
import { cn } from '@/lib/utils'
import { type HTMLAttributes, computed } from "vue"
import { Label, type LabelProps } from "radix-vue"
import { cn } from "@/lib/utils"
const props = defineProps<LabelProps & { class?: HTMLAttributes['class'] }>()
const props = defineProps<LabelProps & { class?: HTMLAttributes["class"] }>()
const delegatedProps = computed(() => {
const { class: _, ...delegated } = props

2
components/ui/label/index.ts
View File

@@ -1 +1 @@
export { default as Label } from './Label.vue'
export { default as Label } from "./Label.vue"

Some files were not shown because too many files have changed in this diff Show More