daisy-ui-kit 5.2.4 → 5.2.7

package/app/components/content/ProseH1.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { computed, useRuntimeConfig } from '#imports'
-
-const props = defineProps<{ id?: string }>()
-
-const { headings } = useRuntimeConfig().public.mdc
-const generate = computed(
-  () =>
-    props.id &&
-    ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) ||
-      (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h1)),
-)
-</script>
-
-<template>
-  <h1 :id="props.id">
-    <a v-if="id || generate" :href="`#${props.id}`">
-      <slot />
-    </a>
-    <slot v-else />
-  </h1>
-</template>

package/app/components/content/ProseH2.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { computed, useRuntimeConfig } from '#imports'
-
-const props = defineProps<{ id?: string }>()
-
-const { headings } = useRuntimeConfig().public.mdc
-const generate = computed(
-  () =>
-    props.id &&
-    ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) ||
-      (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h2)),
-)
-</script>
-
-<template>
-  <h2 :id="props.id">
-    <a v-if="id || generate" :href="`#${props.id}`">
-      <slot />
-    </a>
-    <slot v-else />
-  </h2>
-</template>

package/app/components/content/ProseH3.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { computed, useRuntimeConfig } from '#imports'
-
-const props = defineProps<{ id?: string }>()
-
-const { headings } = useRuntimeConfig().public.mdc
-const generate = computed(
-  () =>
-    props.id &&
-    ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) ||
-      (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h3)),
-)
-</script>
-
-<template>
-  <h3 :id="props.id">
-    <a v-if="id || generate" :href="`#${props.id}`">
-      <slot />
-    </a>
-    <slot v-else />
-  </h3>
-</template>

package/app/components/content/ProseH4.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { computed, useRuntimeConfig } from '#imports'
-
-const props = defineProps<{ id?: string }>()
-
-const { headings } = useRuntimeConfig().public.mdc
-const generate = computed(
-  () =>
-    props.id &&
-    ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) ||
-      (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h4)),
-)
-</script>
-
-<template>
-  <h4 :id="props.id">
-    <a v-if="id || generate" :href="`#${props.id}`">
-      <slot />
-    </a>
-    <slot v-else />
-  </h4>
-</template>

package/app/components/content/ProseH5.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { computed, useRuntimeConfig } from '#imports'
-
-const props = defineProps<{ id?: string }>()
-
-const { headings } = useRuntimeConfig().public.mdc
-const generate = computed(
-  () =>
-    props.id &&
-    ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) ||
-      (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h5)),
-)
-</script>
-
-<template>
-  <h5 :id="props.id">
-    <a v-if="id || generate" :href="`#${props.id}`">
-      <slot />
-    </a>
-    <slot v-else />
-  </h5>
-</template>

package/app/components/content/ProseH6.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { computed, useRuntimeConfig } from '#imports'
-
-const props = defineProps<{ id?: string }>()
-
-const { headings } = useRuntimeConfig().public.mdc
-const generate = computed(
-  () =>
-    props.id &&
-    ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) ||
-      (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h6)),
-)
-</script>
-
-<template>
-  <h6 :id="props.id">
-    <a v-if="id || generate" :href="`#${props.id}`">
-      <slot />
-    </a>
-    <slot v-else />
-  </h6>
-</template>

package/app/components/content/ProseHr.vue

@@ -1,3 +0,0 @@
-<template>
-  <hr />
-</template>

package/app/components/content/ProseImg.vue

@@ -1,40 +0,0 @@
-<script setup lang="ts">
-import { computed, useRuntimeConfig } from '#imports'
-
-const props = defineProps({
-  src: {
-    type: String,
-    default: '',
-  },
-  alt: {
-    type: String,
-    default: '',
-  },
-  width: {
-    type: [String, Number],
-    default: undefined,
-  },
-  height: {
-    type: [String, Number],
-    default: undefined,
-  },
-})
-
-function withBase(input: string, base: string): string {
-  if (!base || base === '/') return input
-  const normalizedBase = base.endsWith('/') ? base.slice(0, -1) : base
-  const normalizedInput = input.startsWith('/') ? input : `/${input}`
-  return normalizedBase + normalizedInput
-}
-
-const refinedSrc = computed(() => {
-  if (props.src?.startsWith('/') && !props.src.startsWith('//'))
-    return withBase(props.src, useRuntimeConfig().app.baseURL)
-
-  return props.src
-})
-</script>
-
-<template>
-  <img :src="refinedSrc" :alt="alt" :width="width" :height="height" />
-</template>

package/app/components/content/ProseLi.vue

@@ -1,3 +0,0 @@
-<template>
-  <li><slot /></li>
-</template>

package/app/components/content/ProseOl.vue

@@ -1,5 +0,0 @@
-<template>
-  <ol>
-    <slot />
-  </ol>
-</template>

package/app/components/content/ProseP.vue

@@ -1,3 +0,0 @@
-<template>
-  <p><slot /></p>
-</template>

package/app/components/content/ProsePre.vue

@@ -1,38 +0,0 @@
-<script setup lang="ts">
-defineProps({
-  code: {
-    type: String,
-    default: '',
-  },
-  language: {
-    type: String,
-    default: null,
-  },
-  filename: {
-    type: String,
-    default: null,
-  },
-  highlights: {
-    type: Array as () => number[],
-    default: () => [],
-  },
-  meta: {
-    type: String,
-    default: null,
-  },
-  class: {
-    type: String,
-    default: null,
-  },
-})
-</script>
-
-<template>
-  <pre :class="$props.class"><slot /></pre>
-</template>
-
-<style>
-pre code .line {
-  display: block;
-}
-</style>

package/app/components/content/ProsePre2.vue

@@ -1,68 +0,0 @@
-<script setup lang="ts">
-import { useClipboard } from '@vueuse/core'
-import Button from '../Button.vue'
-
-const props = defineProps({
-  code: {
-    type: String,
-    default: '',
-  },
-  language: {
-    type: String,
-    default: null,
-  },
-  filename: {
-    type: String,
-    default: null,
-  },
-  highlights: {
-    type: Array as () => number[],
-    default: () => [],
-  },
-  meta: {
-    type: String,
-    default: null,
-  },
-  class: {
-    type: String,
-    default: null,
-  },
-})
-
-const { copy, copied } = useClipboard({ source: computed(() => props.code) })
-</script>
-
-<template>
-  <div>
-    <CodeWrapper v-if="meta?.includes('collapse=true')" class="code-wrapper">
-      <div class="relative -my-6">
-        <div class="absolute flex flex-row items-center top-0 right-0">
-          <div v-if="copied" class="pr-2 text-sm text-neutral-content">copied</div>
-          <Button
-            ghost
-            sm
-            class="text-neutral-content hover:bg-secondary hover:text-secondary-content rounded-tl-none rounded-br-none rounded-tr-md rounded-bl-md"
-            @click="() => copy(code)"
-          >
-            copy
-          </Button>
-        </div>
-        <div class="lg:max-w-[calc(100vw-380px)]">
-          <slot />
-        </div>
-      </div>
-    </CodeWrapper>
-    <slot v-else />
-  </div>
-</template>
-
-<style>
-.code-wrapper pre code .line {
-  display: block;
-  min-height: 1rem;
-}
-
-.code-wrapper pre {
-  max-width: calc(100vw - 3.5rem);
-}
-</style>

package/app/components/content/ProseStrong.vue

@@ -1,5 +0,0 @@
-<template>
-  <strong>
-    <slot />
-  </strong>
-</template>

package/app/components/content/ProseTable.vue

@@ -1,7 +0,0 @@
-<template>
-  <div class="not-prose relative mb-10 mt-6 overflow-x-auto">
-    <table class="table table-sm">
-      <slot />
-    </table>
-  </div>
-</template>

package/app/components/content/ProseTbody.vue

@@ -1,5 +0,0 @@
-<template>
-  <tbody>
-    <slot />
-  </tbody>
-</template>

package/app/components/content/ProseTd.vue

@@ -1,5 +0,0 @@
-<template>
-  <td>
-    <slot />
-  </td>
-</template>

package/app/components/content/ProseTh.vue

@@ -1,5 +0,0 @@
-<template>
-  <th>
-    <slot />
-  </th>
-</template>

package/app/components/content/ProseThead.vue

@@ -1,5 +0,0 @@
-<template>
-  <thead>
-    <slot />
-  </thead>
-</template>

package/app/components/content/ProseTr.vue

@@ -1,5 +0,0 @@
-<template>
-  <tr class="hover">
-    <slot />
-  </tr>
-</template>

package/app/components/content/ProseUl.vue

@@ -1,5 +0,0 @@
-<template>
-  <ul>
-    <slot />
-  </ul>
-</template>

package/app/components/content/Search.vue

@@ -1,171 +0,0 @@
-<script setup lang="ts">
-import { onKeyStroke, useFocus, useMagicKeys } from '@vueuse/core'
-import { useFuse } from '@vueuse/integrations/useFuse'
-import { computed, ref, watch } from 'vue'
-
-const search = ref('')
-const { allLinks } = useNav()
-const tags = allLinks.flatMap(item => item.tags)
-const matchingTag = computed(() => {
-  if (search.value.length < 2) {
-    return null
-  }
-  return tags.find(tag => tag.toLowerCase().startsWith(search.value.toLowerCase()))
-})
-
-// search results and popular results
-const { results } = useFuse(search, allLinks, {
-  fuseOptions: { keys: ['label', 'tags'], includeScore: true, distance: 3 },
-  resultLimit: 12,
-})
-const defaultResults = ['Button', 'Menu', 'Drawer', 'Tabs', 'Dropdown']
-  .map(label => allLinks.find(item => item.label === label)!)
-  .map(item => ({ item }))
-const eitherResults = computed(() => {
-  if (results.value.length === 0) {
-    return defaultResults
-  }
-  return results.value
-})
-
-// Open menu when searchbox is focused
-const isMenuOpen = ref(false)
-const searchbox = ref()
-const { focused } = useFocus(searchbox)
-watch(focused, val => {
-  if (val) {
-    isMenuOpen.value = val
-  } else {
-    setTimeout(() => {
-      isMenuOpen.value = val
-    }, 100)
-  }
-})
-
-// track the highlighted index in the list
-const highlightedIndex = ref(0)
-const highlightedItem = computed(() => {
-  return eitherResults.value[highlightedIndex.value]?.item
-})
-// when results change, reset the highlighted index
-watch(eitherResults, () => {
-  highlightedIndex.value = 0
-})
-
-// meta|ctrl+k --> focus the searchbox
-const { meta, control } = useMagicKeys()
-onKeyStroke('k', () => {
-  if (meta?.value || control?.value) {
-    focused.value = !focused.value
-  }
-})
-
-// escape --> close the list
-onKeyStroke('Escape', () => {
-  if (focused.value) {
-    if (search.value === '') {
-      focused.value = false
-    } else {
-      search.value = ''
-      highlightedIndex.value = 0
-    }
-  }
-})
-
-// menu click --> close the list
-function handleMenuClick() {
-  focused.value = false
-}
-
-// enter --> navigate to highlighted item
-function handleEnter() {
-  if (highlightedItem.value) {
-    navigateTo(highlightedItem.value.to)
-    focused.value = false
-    isMenuOpen.value = false
-  }
-}
-
-// arrow up --> highlighted previous item
-function handleArrowUp() {
-  highlightedIndex.value = Math.max(highlightedIndex.value - 1, 0)
-}
-// arrow down --> highlight next item
-function handleArrowDown() {
-  highlightedIndex.value = Math.min(highlightedIndex.value + 1, eitherResults.value.length - 1)
-}
-</script>
-
-<template>
-  <Dropdown v-model:open="isMenuOpen" :auto-focus="false">
-    <DropdownTarget class="relative inline-block">
-      <Flex class="absolute z-10 top-0 bottom-0 pointer-events-none items-center pl-2">
-        <Icon name="heroicons-solid:search" class="w-5 h-5 opacity-60" aria-hidden="true" />
-      </Flex>
-      <Input
-        id="searchbox"
-        ref="searchbox"
-        v-model="search"
-        placeholder="Search"
-        name="search"
-        bordered
-        class="join-item max-w-[150px] md:max-w-none rounded-xl pl-8"
-        onfocus="this.select()"
-        @keypress.enter="handleEnter"
-        @keydown.arrow-up="handleArrowUp"
-        @keydown.arrow-down="handleArrowDown"
-      />
-      <Flex
-        v-if="!focused"
-        row
-        class="hidden lg:flex items-center flex-nowrap absolute top-0 bottom-0 right-0 pr-2 pointer-events-none opacity-60"
-      >
-        <Kbd xs>cmd</Kbd>
-        <Text xs class="relative bottom-px"> + </Text>
-        <Kbd xs>k</Kbd>
-      </Flex>
-    </DropdownTarget>
-    <DropdownContent
-      class="bg-base-100 shadow-xl rounded-xl border border-base-300 mt-2 w-full overflow-y-auto max-h-[75vh]"
-      @click="handleMenuClick"
-    >
-      <template #default="{ close }">
-        <Menu>
-          <MenuTitle v-if="!search.length"> Popular Components </MenuTitle>
-          <MenuTitle v-if="search.length && results.length"> Search Results </MenuTitle>
-
-          <MenuItem v-if="search.length && !results.length">
-            <span>No Results Found</span>
-          </MenuItem>
-          <template v-else-if="search.length">
-            <MenuItem v-for="(result, index) in results" :key="result.item.label" :active="index === highlightedIndex">
-              <NuxtLink :to="result.item.to" @click="close">
-                <Icon
-                  v-if="(result.item as any).icon"
-                  :name="(result.item as any).icon"
-                  class="w-5 h-5"
-                  aria-hidden="true"
-                />
-                {{ result.item.label }}
-                <Badge v-if="matchingTag && result.item.tags.includes(matchingTag)" warning sm>
-                  {{ matchingTag }}
-                </Badge>
-              </NuxtLink>
-            </MenuItem>
-          </template>
-          <template v-else>
-            <MenuItem
-              v-for="(result, index) in defaultResults"
-              :key="result.item.label"
-              :active="index === highlightedIndex"
-            >
-              <NuxtLink :to="result.item.to" @click="close">
-                {{ result.item.label }}
-              </NuxtLink>
-            </MenuItem>
-          </template>
-        </Menu>
-      </template>
-    </DropdownContent>
-  </Dropdown>
-</template>

package/app/components/content/SearchButton.vue

@@ -1,14 +0,0 @@
-<script setup lang="ts">
-const { openSearch } = useSearch()
-</script>
-
-<template>
-  <button
-    class="input input-ghost hover:bg-base-200 focus-visible:bg-base-200 cursor-pointer transition-colors focus:outline-none flex items-center gap-2"
-    @click="openSearch"
-  >
-    <Icon name="heroicons-solid:search" class="size-4 shrink-0 opacity-60" />
-    <span class="grow text-left hidden sm:inline">Search...</span>
-    <Kbd sm class="hidden lg:inline-flex opacity-50"> <span class="me-1 text-sm">⌘</span>K </Kbd>
-  </button>
-</template>