daisy-ui-kit 5.0.3 → 5.0.4

package/app/components/Indicator.vue

@@ -1,20 +0,0 @@
-<script setup lang="ts">
-defineOptions({
-  inheritAttrs: false,
-})
-
-withDefaults(
-  defineProps<{
-    is?: string
-  }>(),
-  {
-    is: 'div',
-  },
-)
-</script>
-
-<template>
-  <component :is="is" v-bind="$attrs" class="indicator">
-    <slot />
-  </component>
-</template>

package/app/components/IndicatorItem.vue

@@ -1,43 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(
-  defineProps<{
-    is?: string
-
-    align?: 'start' | 'center' | 'end'
-    start?: boolean
-    center?: boolean
-    end?: boolean
-
-    vAlign?: 'top' | 'middle' | 'bottom'
-    top?: boolean
-    middle?: boolean
-    bottom?: boolean
-  }>(),
-  {
-    is: 'div',
-  },
-)
-const classes = computed(() => {
-  return {
-    'indicator-start': props.start || props.align === 'start',
-    'indicator-center': props.center || props.align === 'center',
-    'indicator-end': props.end || props.align === 'end',
-
-    'indicator-top': props.top || props.vAlign === 'top',
-    'indicator-middle': props.middle || props.vAlign === 'middle',
-    'indicator-bottom': props.bottom || props.vAlign === 'bottom',
-  }
-})
-</script>
-
-<template>
-  <component :is="is" v-bind="$attrs" class="indicator-item" :class="classes">
-    <slot />
-  </component>
-</template>

package/app/components/Input.vue

@@ -1,116 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue'
-
-// Map input type to value type
-type InputType =
-  | 'text'
-  | 'password'
-  | 'email'
-  | 'number'
-  | 'date'
-  | 'datetime-local'
-  | 'week'
-  | 'month'
-  | 'tel'
-  | 'url'
-  | 'search'
-  | 'time'
-
-const props = withDefaults(
-  defineProps<{
-    modelValue?: string | number | null
-    type?: InputType
-    placeholder?: string
-    disabled?: boolean
-    validator?: boolean
-    join?: boolean
-    color?: string
-    primary?: boolean
-    secondary?: boolean
-    accent?: boolean
-    info?: boolean
-    success?: boolean
-    warning?: boolean
-    error?: boolean
-    ghost?: boolean
-    size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-    xl?: boolean
-    lg?: boolean
-    md?: boolean
-    sm?: boolean
-    xs?: boolean
-  }>(),
-  {
-    type: 'text',
-  },
-)
-const emit = defineEmits(['update:modelValue'])
-
-// For slot context
-function setValue(val: string | number | null) {
-  emit('update:modelValue', val)
-}
-
-const labelCtx = inject('labelCtx', null)
-
-function handleInput(event: Event) {
-  let val: string | number | null
-  if (props.type === 'number') {
-    const inputVal = (event.target as HTMLInputElement).value
-    val = inputVal === '' ? null : Number(inputVal)
-  } else {
-    val = (event.target as HTMLInputElement).value
-  }
-  emit('update:modelValue', val)
-}
-
-const inputAttrs = computed(() => {
-  if (labelCtx) {
-    return {
-      type: props.type,
-      placeholder: props.placeholder,
-      disabled: props.disabled,
-    }
-  }
-  return {
-    type: props.type,
-    placeholder: props.placeholder,
-    disabled: props.disabled,
-    class: [
-      'input',
-      { validator: props.validator },
-      { 'input-primary': props.primary || props.color === 'primary' },
-      { 'input-secondary': props.secondary || props.color === 'secondary' },
-      { 'input-accent': props.accent || props.color === 'accent' },
-      { 'input-info': props.info || props.color === 'info' },
-      { 'input-success': props.success || props.color === 'success' },
-      { 'input-warning': props.warning || props.color === 'warning' },
-      { 'input-error': props.error || props.color === 'error' },
-      { 'input-ghost': props.ghost },
-      { 'input-xl': props.xl || props.size === 'xl' },
-      { 'input-lg': props.lg || props.size === 'lg' },
-      { 'input-md': props.md || props.size === 'md' },
-      { 'input-sm': props.sm || props.size === 'sm' },
-      { 'input-xs': props.xs || props.size === 'xs' },
-      { 'join-item': props.join },
-    ],
-  }
-})
-const inputModel = computed({
-  get: () => props.modelValue,
-  set: setValue,
-})
-</script>
-
-<template>
-  <div v-if="$slots.default">
-    <slot
-      :value="inputModel"
-      :set-value="setValue"
-      :input-attrs="inputAttrs"
-      :props="props"
-      :input-model="inputModel"
-    />
-  </div>
-  <input v-else v-bind="inputAttrs" :value="inputModel" @input="handleInput" />
-</template>

package/app/components/Join.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="join">
-    <slot />
-  </div>
-</template>

package/app/components/Kbd.vue

@@ -1,25 +0,0 @@
-<script setup lang="ts">
-defineProps<{
-  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-  xl?: boolean
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-</script>
-
-<template>
-  <kbd
-    class="kbd"
-    :class="{
-      'kbd-xl': xl || size === 'xl',
-      'kbd-lg': lg || size === 'lg',
-      'kbd-md': md || size === 'md',
-      'kbd-sm': sm || size === 'sm',
-      'kbd-xs': xs || size === 'xs',
-    }"
-  >
-    <slot />
-  </kbd>
-</template>

package/app/components/Label.vue

@@ -1,100 +0,0 @@
-<script setup lang="ts">
-import { provide, ref } from 'vue'
-import Text from './Text.vue'
-
-withDefaults(
-  defineProps<{
-    is?: string
-    floating?: boolean
-
-    input?: boolean
-    select?: boolean
-    toggle?: boolean
-
-    join?: boolean
-    color?: string
-    neutral?: boolean
-    primary?: boolean
-    secondary?: boolean
-    accent?: boolean
-    info?: boolean
-    success?: boolean
-    warning?: boolean
-    error?: boolean
-    ghost?: boolean
-    size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-    xl?: boolean
-    lg?: boolean
-    md?: boolean
-    sm?: boolean
-    xs?: boolean
-  }>(),
-  {
-    is: 'label',
-  },
-)
-
-// Provide label context for child inputs
-const checked = ref(false)
-provide('labelCtx', { checked })
-</script>
-
-<template>
-  <Text
-    :is="is"
-    :class="[
-      {
-        input,
-        select,
-        toggle,
-        'join-item': (input || select || toggle) && join,
-        'input-neutral': input && (neutral || color === 'neutral'),
-        'input-primary': input && (primary || color === 'primary'),
-        'input-secondary': input && (secondary || color === 'secondary'),
-        'input-accent': input && (accent || color === 'accent'),
-        'input-info': input && (info || color === 'info'),
-        'input-success': input && (success || color === 'success'),
-        'input-warning': input && (warning || color === 'warning'),
-        'input-error': input && (error || color === 'error'),
-        'input-ghost': input && ghost,
-        'input-xl': input && (size === 'xl' || xl),
-        'input-lg': input && (size === 'lg' || lg),
-        'input-md': input && (size === 'md' || md),
-        'input-sm': input && (size === 'sm' || sm),
-        'input-xs': input && (size === 'xs' || xs),
-        'select-neutral': select && (neutral || color === 'neutral'),
-        'select-primary': select && (primary || color === 'primary'),
-        'select-secondary': select && (secondary || color === 'secondary'),
-        'select-accent': select && (accent || color === 'accent'),
-        'select-info': select && (info || color === 'info'),
-        'select-success': select && (success || color === 'success'),
-        'select-warning': select && (warning || color === 'warning'),
-        'select-error': select && (error || color === 'error'),
-        'select-ghost': select && ghost,
-        'select-xl': select && (size === 'xl' || xl),
-        'select-lg': select && (size === 'lg' || lg),
-        'select-md': select && (size === 'md' || md),
-        'select-sm': select && (size === 'sm' || sm),
-        'select-xs': select && (size === 'xs' || xs),
-        'text-neutral': toggle && checked && (neutral || color === 'neutral'),
-        'text-primary': toggle && checked && (primary || color === 'primary'),
-        'text-secondary': toggle && checked && (secondary || color === 'secondary'),
-        'text-accent': toggle && checked && (accent || color === 'accent'),
-        'text-info': toggle && checked && (info || color === 'info'),
-        'text-success': toggle && checked && (success || color === 'success'),
-        'text-warning': toggle && checked && (warning || color === 'warning'),
-        'text-error': toggle && checked && (error || color === 'error'),
-        'text-ghost': toggle && ghost,
-        'toggle-xl': toggle && (size === 'xl' || xl),
-        'toggle-lg': toggle && (size === 'lg' || lg),
-        'toggle-md': toggle && (size === 'md' || md),
-        'toggle-sm': toggle && (size === 'sm' || sm),
-        'toggle-xs': toggle && (size === 'xs' || xs),
-      },
-      { label: !floating && !(input || toggle) },
-      { 'floating-label': floating },
-    ]"
-  >
-    <slot />
-  </Text>
-</template>

package/app/components/List.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="list list-none">
-    <slot />
-  </div>
-</template>

package/app/components/ListColGrow.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="list-col-grow">
-    <slot />
-  </div>
-</template>

package/app/components/ListColWrap.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="list-col-wrap">
-    <slot />
-  </div>
-</template>

package/app/components/ListRow.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="list-row">
-    <slot />
-  </div>
-</template>

package/app/components/LoadingBall.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-
-  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-  xl?: boolean
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-</script>
-
-<template>
-  <span
-    class="loading loading-ball"
-    :class="{
-      'text-primary': props.primary || props.color === 'primary',
-      'text-secondary': props.secondary || props.color === 'secondary',
-      'text-neutral': props.neutral || props.color === 'neutral',
-      'text-accent': props.accent || props.color === 'accent',
-      'text-info': props.info || props.color === 'info',
-      'text-success': props.success || props.color === 'success',
-      'text-warning': props.warning || props.color === 'warning',
-      'text-error': props.error || props.color === 'error',
-
-      'loading-xl': props.xl || props.size === 'xl',
-      'loading-lg': props.lg || props.size === 'lg',
-      'loading-md': props.md || props.size === 'md',
-      'loading-sm': props.sm || props.size === 'sm',
-      'loading-xs': props.xs || props.size === 'xs',
-    }"
-  />
-</template>

package/app/components/LoadingBars.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-
-  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-  xl?: boolean
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-</script>
-
-<template>
-  <span
-    class="loading loading-bars"
-    :class="{
-      'text-primary': props.primary || props.color === 'primary',
-      'text-secondary': props.secondary || props.color === 'secondary',
-      'text-neutral': props.neutral || props.color === 'neutral',
-      'text-accent': props.accent || props.color === 'accent',
-      'text-info': props.info || props.color === 'info',
-      'text-success': props.success || props.color === 'success',
-      'text-warning': props.warning || props.color === 'warning',
-      'text-error': props.error || props.color === 'error',
-
-      'loading-xl': props.xl || props.size === 'xl',
-      'loading-lg': props.lg || props.size === 'lg',
-      'loading-md': props.md || props.size === 'md',
-      'loading-sm': props.sm || props.size === 'sm',
-      'loading-xs': props.xs || props.size === 'xs',
-    }"
-  />
-</template>

package/app/components/LoadingDots.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-
-  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-  xl?: boolean
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-</script>
-
-<template>
-  <span
-    class="loading loading-dots"
-    :class="{
-      'text-primary': props.primary || props.color === 'primary',
-      'text-secondary': props.secondary || props.color === 'secondary',
-      'text-neutral': props.neutral || props.color === 'neutral',
-      'text-accent': props.accent || props.color === 'accent',
-      'text-info': props.info || props.color === 'info',
-      'text-success': props.success || props.color === 'success',
-      'text-warning': props.warning || props.color === 'warning',
-      'text-error': props.error || props.color === 'error',
-
-      'loading-xl': props.xl || props.size === 'xl',
-      'loading-lg': props.lg || props.size === 'lg',
-      'loading-md': props.md || props.size === 'md',
-      'loading-sm': props.sm || props.size === 'sm',
-      'loading-xs': props.xs || props.size === 'xs',
-    }"
-  />
-</template>

package/app/components/LoadingInfinity.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-
-  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-  xl?: boolean
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-</script>
-
-<template>
-  <span
-    class="loading loading-infinity"
-    :class="{
-      'text-primary': props.primary || props.color === 'primary',
-      'text-secondary': props.secondary || props.color === 'secondary',
-      'text-neutral': props.neutral || props.color === 'neutral',
-      'text-accent': props.accent || props.color === 'accent',
-      'text-info': props.info || props.color === 'info',
-      'text-success': props.success || props.color === 'success',
-      'text-warning': props.warning || props.color === 'warning',
-      'text-error': props.error || props.color === 'error',
-
-      'loading-xl': props.xl || props.size === 'xl',
-      'loading-lg': props.lg || props.size === 'lg',
-      'loading-md': props.md || props.size === 'md',
-      'loading-sm': props.sm || props.size === 'sm',
-      'loading-xs': props.xs || props.size === 'xs',
-    }"
-  />
-</template>

package/app/components/LoadingRing.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-
-  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-  xl?: boolean
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-</script>
-
-<template>
-  <span
-    class="loading loading-ring"
-    :class="{
-      'text-primary': props.primary || props.color === 'primary',
-      'text-secondary': props.secondary || props.color === 'secondary',
-      'text-neutral': props.neutral || props.color === 'neutral',
-      'text-accent': props.accent || props.color === 'accent',
-      'text-info': props.info || props.color === 'info',
-      'text-success': props.success || props.color === 'success',
-      'text-warning': props.warning || props.color === 'warning',
-      'text-error': props.error || props.color === 'error',
-
-      'loading-xl': props.xl || props.size === 'xl',
-      'loading-lg': props.lg || props.size === 'lg',
-      'loading-md': props.md || props.size === 'md',
-      'loading-sm': props.sm || props.size === 'sm',
-      'loading-xs': props.xs || props.size === 'xs',
-    }"
-  />
-</template>

package/app/components/LoadingSpinner.vue

@@ -1,42 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-
-  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-  xl?: boolean
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-</script>
-
-<template>
-  <span
-    class="loading loading-spinner"
-    :class="{
-      'text-primary': props.primary || props.color === 'primary',
-      'text-secondary': props.secondary || props.color === 'secondary',
-      'text-neutral': props.neutral || props.color === 'neutral',
-      'text-accent': props.accent || props.color === 'accent',
-      'text-info': props.info || props.color === 'info',
-      'text-success': props.success || props.color === 'success',
-      'text-warning': props.warning || props.color === 'warning',
-      'text-error': props.error || props.color === 'error',
-
-      'loading-xl': props.xl || props.size === 'xl',
-      'loading-lg': props.lg || props.size === 'lg',
-      'loading-md': props.md || props.size === 'md',
-      'loading-sm': props.sm || props.size === 'sm',
-      'loading-xs': props.xs || props.size === 'xs',
-    }"
-  />
-</template>

package/app/components/Mask.vue

@@ -1,49 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  shape?: string
-  squircle?: boolean
-  heart?: boolean
-  hexagon?: boolean
-  hexagon2?: boolean
-  decagon?: boolean
-  pentagon?: boolean
-  diamond?: boolean
-  square?: boolean
-  circle?: boolean
-  star?: boolean
-  star2?: boolean
-  triangle?: boolean
-  triangle2?: boolean
-  triangle3?: boolean
-  triangle4?: boolean
-  half1?: boolean
-  half2?: boolean
-}>()
-</script>
-
-<template>
-  <div
-    class="mask"
-    :class="{
-      '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-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',
-      'mask-half-1': props.half1 || props.shape === 'half-1',
-      'mask-half-2': props.half2 || props.shape === 'half-2',
-    }"
-  >
-    <slot />
-  </div>
-</template>

package/app/components/Menu.vue

@@ -1,30 +0,0 @@
-<script setup lang="ts">
-const props = defineProps<{
-  align?: 'vertical' | 'horizontal'
-  vertical?: boolean
-  horizontal?: boolean
-  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs'
-  xl?: boolean
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-</script>
-
-<template>
-  <ul
-    class="menu"
-    :class="{
-      'menu-vertical': props.vertical || props.align === 'vertical',
-      'menu-horizontal': props.horizontal || props.align === 'horizontal',
-      'menu-xl': props.xl || props.size === 'xl',
-      'menu-lg': props.lg || props.size === 'lg',
-      'menu-md': props.md || props.size === 'md',
-      'menu-sm': props.sm || props.size === 'sm',
-      'menu-xs': props.xs || props.size === 'xs',
-    }"
-  >
-    <slot />
-  </ul>
-</template>