daisy-ui-kit 2.1.1 → 2.1.2

package/components/Home/Hero.vue

@@ -1,53 +0,0 @@
-<template>
-  <!-- Hero section -->
-  <div class="relative">
-    <div class="absolute inset-x-0 bottom-0 bg-base-200 h-1/2" />
-    <div class="mx-auto max-w-7xl sm:px-6 lg:px-8">
-      <div class="relative shadow-xl sm:rounded-2xl sm:overflow-hidden">
-        <div class="absolute inset-0">
-          <img
-            class="object-cover w-full h-full"
-            src="/img/unsplash-devs-sm.jpg"
-            alt="People working on laptops"
-          >
-          <div
-            class="absolute inset-0 bg-gradient-to-r from-primary to-secondary mix-blend-multiply"
-          />
-        </div>
-
-        <div class="relative px-4 py-16 sm:px-6 sm:py-24 lg:py-32 lg:px-8">
-          <Text is="h1" extrabold center class="text-4xl tracking-tight sm:text-5xl lg:text-6xl">
-            <Text class="text-white" block>
-              DaisyUI Kit
-            </Text>
-            <Text secondary block class="text-3xl sm:text-4xl lg:text-5xl">
-              Build Beautiful Apps
-            </Text>
-          </Text>
-          <Text center class="block max-w-lg mx-auto mt-6 text-xl text-indigo-200 sm:max-w-3xl">
-            Bring the masterfully-crafted DaisyUI into your Vue app. <br>Built for you with ❤️ by
-            <NuxtLink to="https://www.bitovi.com">
-              Bitovi
-            </NuxtLink>.
-          </Text>
-
-          <div class="max-w-sm mx-auto mt-10 sm:max-w-none sm:flex sm:justify-center">
-            <Flex class="gap-2 sm:space-y-0 sm:mx-auto sm:inline-grid sm:grid-cols-2 items-center justify-center">
-              <NuxtLink to="/docs/button" class="block">
-                <Button class="w-full border-0 bg-base-100 text-base-content hover:bg-base-200">
-                  Learn more
-                </Button>
-              </NuxtLink>
-
-              <NuxtLink to="/docs/install" class="block">
-                <Button primary class="w-full">
-                  Start Building
-                </Button>
-              </NuxtLink>
-            </Flex>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>

package/components/Home/PremiumCTA.vue

@@ -1,28 +0,0 @@
-<template>
-  <!-- CTA Section -->
-  <div class="bg-neutral">
-    <div
-      class="max-w-4xl px-4 py-16 mx-auto sm:px-6 sm:py-24 lg:max-w-7xl lg:px-8 lg:flex lg:items-center lg:justify-between"
-    >
-      <Text is="h2" size="4xl" extrabold class="tracking-tight">
-        <Text block class="text-neutral-content">
-          Build faster with
-          <Text secondary>
-            DaisyUI Kit Premium
-          </Text>
-        </Text>
-        <Text block class="mt-4 text-2xl text-transparent lg:mt-0 xl:text-3xl bg-gradient-secondary-r bg-clip-text">
-          Templates for App Layout, Marketing and E-Commerce
-        </Text>
-      </Text>
-
-      <div class="mt-6 space-y-4 sm:space-y-0 sm:flex sm:space-x-4">
-        <Tooltip primary tip="Coming Soon">
-          <Button primary lg>
-            Learn more
-          </Button>
-        </Tooltip>
-      </div>
-    </div>
-  </div>
-</template>

package/components/Home/Testimonial.vue

@@ -1,23 +0,0 @@
-<template>
-  <blockquote>
-    <div>
-      <Text block base class="text-base-content/80">
-        &ldquo;Cras velit quis eros eget rhoncus lacus ultrices
-        sed diam. Sit orci risus aenean curabitur donec aliquet.
-        Mi venenatis in euismod ut.&rdquo;
-      </Text>
-    </div>
-    <footer class="mt-3">
-      <Flex class="space-x-3 items-center">
-        <Avatar circle class="flex-shrink-0 w-8 h-8">
-          <img
-            src="https://images.unsplash.com/photo-1509783236416-c9ad59bae472?ixlib=rb-=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=1024&h=1024&q=80"
-          >
-        </Avatar>
-        <Text base medium block class="text-base-content/80">
-          Marcia Hill, Digital Marketing Manager
-        </Text>
-      </Flex>
-    </footer>
-  </blockquote>
-</template>

package/components/Mask.config.ts

@@ -1,77 +0,0 @@
-import { computed } from 'vue'
-
-export const maskProps = {
-  shape: { type: String },
-  squircle: Boolean,
-  heart: Boolean,
-  hexagon: Boolean,
-  hexagon2: Boolean,
-  decagon: Boolean,
-  pentagon: Boolean,
-  diamond: Boolean,
-  square: Boolean,
-  circle: Boolean,
-  parallelogram: Boolean,
-  parallelogram2: Boolean,
-  parallelogram3: Boolean,
-  parallelogram4: Boolean,
-  star: Boolean,
-  star2: Boolean,
-  triangle: Boolean,
-  triangle2: Boolean,
-  triangle3: Boolean,
-  triangle4: Boolean,
-}
-
-export function makeMaskClasses(props: any) {
-  const classes = computed(() => {
-    return {
-      'mask-squircle': props.squircle || props.shape === 'squircle',
-      'mask-heart': props.heart || props.shape === 'heart',
-      'mask-hexagon': props.hexagon || props.shape === 'hexagon',
-      'mask-hexagon-2': props.hexagon2 || props.shape === 'hexagon-2',
-      'mask-decagon': props.decagon || props.shape === 'decagon',
-      'mask-pentagon': props.pentagon || props.shape === 'pentagon',
-      'mask-diamond': props.diamond || props.shape === 'diamond',
-      'mask-square': props.square || props.shape === 'square',
-      'mask-circle': props.circle || props.shape === 'circle',
-      'mask-parallelogram':
-        props.parallelogram || props.shape === 'parallelogram',
-      'mask-parallelogram-2':
-        props.parallelogram2 || props.shape === 'parallelogram-2',
-      'mask-parallelogram-3':
-        props.parallelogram3 || props.shape === 'parallelogram-3',
-      'mask-parallelogram-4':
-        props.parallelogram4 || props.shape === 'parallelogram-4',
-      'mask-star': props.star || props.shape === 'star',
-      'mask-star-2': props.star2 || props.shape === 'star-2',
-      'mask-triangle': props.triangle || props.shape === 'triangle',
-      'mask-triangle-2': props.triangle2 || props.shape === 'triangle-2',
-      'mask-triangle-3': props.triangle3 || props.shape === 'triangle-3',
-      'mask-triangle-4': props.triangle4 || props.shape === 'triangle-4',
-    }
-  })
-  return classes
-}
-
-export const shapes = [
-  'squircle',
-  'heart',
-  'hexagon',
-  'hexagon-2',
-  'decagon',
-  'pentagon',
-  'diamond',
-  'square',
-  'circle',
-  'parallelogram',
-  'parallelogram-2',
-  'parallelogram-3',
-  'parallelogram-4',
-  'star',
-  'star-2',
-  'triangle',
-  'triangle-2',
-  'triangle-3',
-  'triangle-4',
-]

package/components/content/Badge.ts

@@ -1,3 +0,0 @@
-import Badge from '../../components/Badge.vue'
-
-export default Badge

package/components/content/CodePreview.vue

@@ -1,28 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-const slotWrapper = ref(null)
-const innerHtml = computed(() => {
-  if (slotWrapper.value)
-    return slotWrapper.value.innerHtml
-  else
-    return ''
-})
-
-onMounted(() => {
-  if (!import.meta.env.SSR)
-    (window as any).innerHtml = innerHtml
-})
-</script>
-
-<template>
-  <div>
-    <div v-html="innerHtml" />
-
-    <div class="hidden">
-      <div ref="slotWrapper">
-        <slot />
-      </div>
-    </div>
-  </div>
-</template>

package/components/content/ColorBadge.vue

@@ -1,24 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  color: string
-}>()
-
-const classes = computed(() => {
-  return {
-    'bg-primary-content text-primary': props.color === 'primary-content',
-    'bg-secondary-content text-secondary': props.color === 'secondary-content',
-    'bg-neutral-content text-neutral': props.color === 'neutral-content',
-    'bg-accent-content text-accent': props.color === 'accent-content',
-    'bg-info-content text-info': props.color === 'info-content',
-    'bg-success-content text-success': props.color === 'success-content',
-    'bg-warning-content text-warning': props.color === 'warning-content',
-    'bg-error-content text-error': props.color === 'error-content',
-  }
-})
-</script>
-
-<template>
-  <Badge :color="color" class="whitespace-nowrap rounded-[0.375rem] px-1 h-[1.5rem] font-mono" :class="classes">
-    {{ color }}
-  </Badge>
-</template>

package/components/content/DemoExample.vue

@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-const props = defineProps({
-  noPadding: Boolean,
-  allowProse: Boolean,
-})
-const classes = computed(() => {
-  return {
-    'p-6 lg:p-12': !props.noPadding,
-    'not-prose': !props.allowProse,
-  }
-})
-</script>
-
-<template>
-  <div
-    class="demo-example flex flex-row items-start mt-4 border-4 rounded-t-xl border-base-200 lg:max-w-[calc(100vw-390px)]"
-    :class="classes"
-  >
-    <slot />
-  </div>
-</template>

package/components/content/DemoExampleResponsive.vue

@@ -1,59 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-const props = defineProps({
-  iframeClasses: {
-    type: String,
-    default: '',
-  },
-  allowProse: Boolean,
-})
-const { theme } = useTheme()
-
-const iframe = ref()
-const { pressed } = useMousePressed()
-const { x: mouseX } = useMouse()
-const { width } = useElementBounding(iframe)
-
-const referenceX = ref(0)
-const _width = ref('100%')
-
-watch(pressed, (val) => {
-  if (val)
-    referenceX.value = mouseX.value
-})
-watch(mouseX, (val) => {
-  if (pressed.value) {
-    const delta = val - referenceX.value
-    referenceX.value = mouseX.value
-    _width.value = `${width.value + (delta * 1.2)}px`
-  }
-})
-
-const classes = computed(() => {
-  return `${props.iframeClasses} not-prose ${pressed ? 'pointer-events-none' : ''}`
-})
-</script>
-
-<template>
-  <div
-    class="flex flex-row flex-wrap items-center mt-4 border-4 rounded-t-xl border-base-200 overflow-hidden"
-    :class="classes"
-  >
-    <div class="flex flex-row w-full bg-black/50">
-      <IframeRenderer
-        ref="iframe"
-        :style="{ width: _width }"
-        class="w-full min-h-full"
-        :classes="classes"
-        :iframe-classes="iframeClasses"
-        :theme="theme"
-      >
-        <slot />
-      </IframeRenderer>
-      <Tooltip draggable primary tip="Drag to Resize" left class="flex items-center justify-center bg-primary cursor-move">
-        <Icon name="radix-icons:drag-handle-vertical" class="text-primary-content" />
-      </Tooltip>
-    </div>
-  </div>
-</template>

package/components/content/IframeRenderer.ts

@@ -1,53 +0,0 @@
-import { createApp, h, onMounted, ref } from 'vue'
-
-export default {
-  name: 'RenderToIFrame',
-  props: {
-    classes: { type: String },
-    iframeClasses: { type: String },
-    theme: { type: String },
-  },
-  setup(props: any, { slots }: any) {
-    const iframeRef = ref()
-    const iframeBody = ref()
-    const iframeHead = ref()
-    const iframeStyle = ref()
-
-    onMounted(() => {
-      iframeBody.value = iframeRef.value.contentDocument.body
-      iframeHead.value = iframeRef.value.contentDocument.head
-      const el = document.createElement('div')
-      iframeBody.value.appendChild(el)
-      iframeStyle.value = document.createElement('style')
-      iframeStyle.value.innerHTML = props.css
-      iframeHead.value.appendChild(iframeStyle.value)
-
-      createApp({
-        name: 'IframeRender',
-        setup() {
-          const script = iframeRef.value.contentDocument.createElement('script')
-          script.type = 'text/javascript'
-          // create dynamic script
-          script.text = `const oHead = document.getElementsByTagName('head')[0]
-            const arrStyleSheets = parent.document.getElementsByTagName('style')
-            for (let i = 0; i < arrStyleSheets.length; i++)
-            oHead.appendChild(arrStyleSheets[i].cloneNode(true))
-          `
-
-          if (props.iframeClasses.length)
-            iframeRef.value.classList.add(props.iframeClasses)
-          iframeBody.value.classList.add('p-6')
-          iframeHead.value.appendChild(script)
-
-          watch(() => props.theme, (theme) => {
-            iframeBody.value.setAttribute('data-theme', theme)
-          }, { immediate: true })
-          return () => slots.default()
-        },
-      }).mount(el)
-    })
-    return () => h('iframe', {
-      ref: iframeRef,
-    })
-  },
-}

package/components/content/Indent.vue

@@ -1,3 +0,0 @@
-<template>
-  <span>&nbsp;&nbsp;&nbsp;</span>
-</template>

package/components/content/LocalLinks.vue

@@ -1,31 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  values: string
-}>()
-const links = computed(() => {
-  const values = props.values.split(',').map(name => name.trim())
-  return values.map((value) => {
-    if (value.includes('#')) {
-      const [name, url] = value.split('#')
-      return {
-        name,
-        url: `#${url}`,
-      }
-    }
-    else {
-      return {
-        name: value,
-        url: `#${value.toLowerCase()}`,
-      }
-    }
-  })
-})
-</script>
-
-<template>
-  <ul>
-    <li v-for="link in links" :key="link.name">
-      <a :href="link.url" class="link link-primary">{{ link.name }}</a>
-    </li>
-  </ul>
-</template>

package/components/content/NotFound.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-import { useFuse } from '@vueuse/integrations/useFuse'
-
-const props = defineProps({
-  error: Object,
-})
-
-const route = useRoute()
-const { allLinks } = useNav()
-
-const lastPathSegment = computed(() => {
-  const segments = route.path.split('/')
-  return segments[segments.length - 1]
-})
-
-const { results } = useFuse(lastPathSegment, allLinks, {
-  fuseOptions: { keys: ['label', 'tags'], includeScore: true, distance: 3 },
-  resultLimit: 5,
-})
-</script>
-
-<template>
-  <Hero class="not-prose h-[32rem]">
-    <HeroContent center>
-      <div class="max-w-md">
-        <Text is="h1" size="5xl" bold class="mb-5">
-          404
-        </Text>
-        <Text is="p" class="mb-5">
-          We couldn't find that page. Did you mean one of these pages?
-        </Text>
-        <Menu class="border border-base-300 rounded-xl">
-          <MenuItem v-for="result in results" :key="result.item.label">
-            <NuxtLink :to="result.item.to">
-              {{ result.item.label }}
-            </NuxtLink>
-          </MenuItem>
-        </Menu>
-      </div>
-    </HeroContent>
-  </Hero>
-</template>

package/components/content/PageNext.vue

@@ -1,24 +0,0 @@
-<script setup lang="ts">
-defineProps<{
-  url: string
-  title: string
-}>()
-</script>
-
-<template>
-  <NuxtLink
-    :to="url"
-    class="btn md:btn-lg gap-2 normal-case lg:gap-3"
-  >
-    <Flex col items-start>
-      <Text class="text-base-content/50 hidden text-xs font-normal md:block">
-        Next
-      </Text>
-      <Text>{{ title }}</Text>
-    </Flex>
-
-    <svg class="h-6 w-6 fill-current md:h-8 md:w-8" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-      <path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" />
-    </svg>
-  </NuxtLink>
-</template>

package/components/content/PagePrevious.vue

@@ -1,24 +0,0 @@
-<script setup lang="ts">
-defineProps<{
-  url: string
-  title: string
-}>()
-</script>
-
-<template>
-  <NuxtLink
-    :to="url"
-    class="btn md:btn-lg gap-2 normal-case lg:gap-3"
-  >
-    <svg class="h-6 w-6 fill-current md:h-8 md:w-8" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-      <path d="M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z" />
-    </svg>
-
-    <Flex col items-start>
-      <Text class="text-base-content/50 hidden text-xs font-normal md:block">
-        Prev
-      </Text>
-      <Text>{{ title }}</Text>
-    </Flex>
-  </NuxtLink>
-</template>

package/components/content/PrevNext.vue

@@ -1,40 +0,0 @@
-<script setup lang="ts">
-import { useNav } from '~/composables/use-nav'
-
-const props = defineProps<{
-  currentPageLabel: string
-}>()
-
-const { allLinks: links } = useNav()
-
-const current = computed(() => links.find(link => link.label === props.currentPageLabel))
-const prev = computed(() => links[links.indexOf(current.value as any) - 1])
-const next = computed(() => links[links.indexOf(current.value as any) + 1])
-
-function toTop() {
-  window.scrollTo({
-    top: 0,
-    behavior: 'smooth',
-  })
-  setTimeout(() => {
-    window.location.hash = ''
-  }, 600)
-}
-</script>
-
-<template>
-  <div>
-    <div class="flex flex-row justify-between mt-16">
-      <PagePrevious v-if="prev" :url="prev.to" :title="prev.label" />
-      <span v-else />
-
-      <PageNext v-if="next" :url="next.to" :title="next.label" />
-      <span v-else />
-    </div>
-
-    <Button ghost class="mt-6" @click="toTop">
-      to top
-      <Icon name="feather:arrow-up" class="ml-2" />
-    </Button>
-  </div>
-</template>

package/components/content/ProseA.vue

@@ -1,19 +0,0 @@
-<script setup lang="ts">
-defineProps({
-  href: {
-    type: String,
-    default: '',
-  },
-  target: {
-    type: String,
-    default: undefined,
-    required: false,
-  },
-})
-</script>
-
-<template>
-  <NuxtLink :href="href" :target="target" class="daisy-link link-primary">
-    <slot />
-  </NuxtLink>
-</template>

package/components/content/ProseAlert.vue

@@ -1,11 +0,0 @@
-<script setup lang="ts">
-defineProps<{
-  type: string
-}>()
-</script>
-
-<template>
-  <Alert class="not-prose" v-bind="$props">
-    <slot />
-  </Alert>
-</template>

package/components/content/ProseBlockquote.vue

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

package/components/content/ProseCode.vue

@@ -1,62 +0,0 @@
-<script setup lang="ts">
-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,
-  },
-})
-
-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/components/content/ProseCodeInline.vue

@@ -1,3 +0,0 @@
-<template>
-  <code class="bg-base-300 rounded-md py-1 px-1 whitespace-nowrap"><slot /></code>
-</template>

package/components/content/ProseEm.vue

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