daisy-ui-kit 3.0.12 → 5.0.0-pre.4

package/components/RadialProgress.vue

@@ -1,41 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-const props = defineProps<{
-  value: number | string
-  size?: string
-  thickness?: string
-
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-}>()
-
-const calculatedSize = computed(() => props.size || '4rem')
-const calculatedThickness = computed(() => props.thickness || 'calc(var(--size) / 10)')
-
-const classes = computed(() => {
-  return {
-    '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'),
-  }
-})
-</script>
-
-<template>
-  <div class="radial-progress" :class="classes" :style="`--value:${value}; --size:${calculatedSize}; --thickness:${calculatedThickness};`">
-    <slot />
-  </div>
-</template>

package/components/Radio.vue

@@ -1,76 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue'
-
-const props = defineProps<{
-  modelValue?: any
-  value: any
-  disabled?: boolean
-
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  success?: boolean
-  warning?: boolean
-  info?: boolean
-  error?: boolean
-
-  size?: string
-  xs?: boolean
-  sm?: boolean
-  md?: boolean
-  lg?: boolean
-}>()
-const emit = defineEmits(['update:modelValue'])
-
-const radioGroup: any = inject('radio-group', null)
-
-const _props = computed(() => {
-  if (radioGroup)
-    return Object.assign({}, radioGroup.props, props)
-  else return props
-})
-
-const classes = computed(() => {
-  const { color, neutral, primary, secondary, accent, success, warning, info, error, size, xs, sm, md, lg } = _props.value
-  return {
-    'radio-neutral': neutral || color === 'neutral',
-    'radio-primary': primary || color === 'primary',
-    'radio-secondary': secondary || color === 'secondary',
-    'radio-accent': accent || color === 'accent',
-    'radio-success': success || color === 'success',
-    'radio-warning': warning || color === 'warning',
-    'radio-info': info || color === 'info',
-    'radio-error': error || color === 'error',
-    'radio-xs': xs || size === 'xs',
-    'radio-sm': sm || size === 'sm',
-    'radio-md': md || size === 'md',
-    'radio-lg': lg || size === 'lg',
-  }
-})
-
-const currentValue = computed({
-  get() {
-    if (radioGroup)
-      return radioGroup.currentValue
-    return props.modelValue
-  },
-  set(val: string) {
-    radioGroup && (radioGroup.currentValue = val)
-    emit('update:modelValue', val)
-  },
-})
-</script>
-
-<template>
-  <input
-    v-model="currentValue"
-    type="radio"
-    v-bind="{ ..._props, ...$attrs }"
-    class="radio"
-    :class="classes"
-    :disabled="disabled"
-    :value="props.value"
-  >
-</template>

package/components/RadioGroup.vue

@@ -1,46 +0,0 @@
-<script setup lang="ts">
-import { computed, provide, reactive } from 'vue'
-
-const props = defineProps<{
-  modelValue?: any
-  name: string
-
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  success?: boolean
-  warning?: boolean
-  info?: boolean
-  error?: boolean
-
-  size?: string
-  xs?: boolean
-  sm?: boolean
-  md?: boolean
-  lg?: boolean
-}>()
-const emit = defineEmits(['update:modelValue'])
-
-const currentValue = computed({
-  get: () => {
-    return props.modelValue
-  },
-  set: (val) => {
-    emit('update:modelValue', val)
-  },
-})
-
-const state = reactive({
-  currentValue,
-  props,
-})
-provide('radio-group', state)
-</script>
-
-<template>
-  <div class="radio-group">
-    <slot />
-  </div>
-</template>

package/components/Range.vue

@@ -1,60 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-const props = defineProps<{
-  modelValue?: number | string
-  min?: number | string
-  max?: number | string
-  step?: number | string
-  disabled?: boolean
-
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  success?: boolean
-  warning?: boolean
-  info?: boolean
-  error?: boolean
-
-  size?: 'lg' | 'md' | 'sm' | 'xs'
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>()
-defineEmits(['update:modelValue'])
-
-const classes = computed(() => {
-  const { color, neutral, primary, secondary, accent, success, info, warning, error, size, lg, md, sm, xs } = props
-  return {
-    'range-neutral': neutral || color === 'neutral',
-    'range-primary': primary || color === 'primary',
-    'range-secondary': secondary || color === 'secondary',
-    'range-accent': accent || color === 'accent',
-    'range-success': success || color === 'success',
-    'range-info': info || color === 'info',
-    'range-warning': warning || color === 'warning',
-    'range-error': error || color === 'error',
-    'range-lg': lg || size === 'lg',
-    'range-md': md || size === 'md',
-    'range-sm': sm || size === 'sm',
-    'range-xs': xs || size === 'xs',
-  }
-})
-</script>
-
-<template>
-  <input
-    type="range"
-    class="range"
-    :class="classes"
-    :min="min"
-    :max="max"
-    :step="step"
-    :disabled="disabled"
-    :value="modelValue"
-    @input="$emit('update:modelValue', ($event.target as any).value)"
-  >
-</template>

package/components/RangeMeasure.vue

@@ -1,83 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-const props = withDefaults(defineProps<{
-  modelValue?: number | string
-  min?: number | string
-  max?: number | string
-  step?: number | string
-
-  numbered?: boolean
-  asButtons?: boolean
-  disabled?: boolean
-
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  success?: boolean
-  warning?: boolean
-  info?: boolean
-  error?: boolean
-
-  size?: 'lg' | 'md' | 'sm' | 'xs'
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>(), {
-  min: 0,
-  max: 100,
-  step: 1,
-})
-defineEmits(['update:modelValue'])
-
-const classes = computed(() => {
-  const { color, neutral, primary, secondary, accent, success, info, warning, error, size, lg, md, sm, xs, disabled } = props
-  return {
-    'text-neutral': neutral || color === 'neutral',
-    'text-primary': primary || color === 'primary',
-    'text-secondary': secondary || color === 'secondary',
-    'text-accent': accent || color === 'accent',
-    'text-success': success || color === 'success',
-    'text-info': info || color === 'info',
-    'text-warning': warning || color === 'warning',
-    'text-error': error || color === 'error',
-    'text-lg': lg || size === 'lg',
-    'text-md': md || size === 'md',
-    'text-sm': sm || size === 'sm',
-    'text-xs': xs || size === 'xs',
-    'opacity-50': disabled,
-  }
-})
-const values = computed(() => {
-  const vals = []
-  for (let index = Number.parseInt(props.min as string); index < Number.parseInt(props.max as string) + 1; index++) {
-    vals.push({
-      value: index,
-      isVisible: index % Number.parseInt(props.step as string) === 0,
-    })
-  }
-  return vals
-})
-// const count = computed(() => Number.parseInt(props.max as string) - Number.parseInt(props.min as string))
-</script>
-
-<template>
-  <div class="flex justify-between select-none" :class="classes">
-    <RangeMeasureTick
-      v-for="tick in values"
-      :key="tick.value"
-      :tick="tick.value"
-      :model-value="modelValue"
-      :numbered="numbered"
-      :as-button="asButtons"
-      :is-hidden="!tick.isVisible"
-      :disabled="disabled"
-      @update:model-value="(val) => !disabled && $emit('update:modelValue', val)"
-    >
-      {{ numbered ? tick : '|' }}
-    </RangeMeasureTick>
-  </div>
-</template>

package/components/RangeMeasureTick.vue

@@ -1,74 +0,0 @@
-<script setup lang="ts">
-import { computed, watch } from 'vue'
-import { useTimeoutFn } from '@vueuse/core'
-
-const props = defineProps<{
-  tick: number
-  modelValue?: number | string
-  numbered?: boolean
-  asButton?: boolean
-  isHidden?: boolean
-  disabled?: boolean
-}>()
-defineEmits(['update:modelValue'])
-
-const hasChanged = ref(false)
-const { isPending, start, stop } = useTimeoutFn(() => {
-  hasChanged.value = false
-}, 1000)
-watch(
-  () => props.modelValue,
-  (val) => {
-    if (val) {
-      start()
-      hasChanged.value = true
-    }
-    else if (!isPending.value) {
-      stop()
-    }
-  },
-)
-
-// eslint-disable-next-line eqeqeq
-const isCurrent = computed(() => props.modelValue == props.tick)
-
-const classes = computed(() => {
-  return {
-    'font-bold': isCurrent.value,
-    'opacity-50': props.disabled,
-    'cursor-pointer': !props.disabled,
-    'cursor-not-allowed': props.disabled,
-  }
-})
-</script>
-
-<template>
-  <Button
-    v-if="asButton && !isHidden"
-    xs
-    :ghost="!isCurrent"
-    circle
-    :class="classes"
-    :disabled="disabled"
-    @click="$emit('update:modelValue', tick)"
-  >
-    {{ numbered ? tick : '|' }}
-  </Button>
-  <Tooltip
-    v-else
-    :tip="tick"
-    :open="hasChanged && isCurrent && !disabled"
-    position="bottom"
-    :class="{
-      'px-[2px]': !asButton,
-      'opacity-50': disabled,
-      'cursor-pointer': !disabled,
-      'cursor-not-allowed': disabled,
-    }"
-    @click="$emit('update:modelValue', tick)"
-  >
-    <Text v-if="!isHidden" :black="isCurrent">
-      {{ numbered ? tick : '|' }}
-    </Text>
-  </Tooltip>
-</template>

package/components/Rating.vue

@@ -1,167 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-const props = withDefaults(defineProps<{
-  modelValue?: number | string
-  count?: number | string
-  half?: boolean
-
-  disabled?: boolean
-
-  color?: string
-  neutral?: boolean
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-
-  bg?: string
-
-  shape?: 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
-
-  size?: 'lg' | 'md' | 'sm' | 'xs'
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>(), {
-  count: 5,
-})
-const emit = defineEmits(['update:modelValue'])
-
-const shapes = [
-  'squircle',
-  'heart',
-  'hexagon',
-  'hexagon2',
-  'decagon',
-  'pentagon',
-  'diamond',
-  'square',
-  'circle',
-  'parallelogram',
-  'parallelogram2',
-  'parallelogram3',
-  'parallelogram4',
-  'star',
-  'star2',
-  'triangle',
-  'triangle2',
-  'triangle3',
-  'triangle4',
-]
-
-const ratingClasses = computed(() => {
-  return {
-    'rating-half': props.half,
-    'rating-lg': props.lg || props.size === 'lg',
-    'rating-md': props.md || props.size === 'md',
-    'rating-sm': props.sm || props.size === 'sm',
-    'rating-xs': props.xs || props.size === 'xs',
-  }
-})
-
-const maskClasses = computed(() => {
-  const hasShape = shapes.reduce((acc, current) => {
-    return acc || props.shape || (props as any)[current]
-  }, false)
-  const { color, shape, disabled } = props
-  return {
-    'bg-neutral': props.neutral || color === 'neutral',
-    'bg-primary': props.primary || color === 'primary',
-    'bg-secondary': props.secondary || color === 'secondary',
-    'bg-accent': props.accent || color === 'accent',
-    'bg-info': props.info || color === 'info',
-    'bg-success': props.success || color === 'success',
-    'bg-warning': props.warning || color === 'warning',
-    'bg-error': props.error || color === 'error',
-
-    'cursor-not-allowed': disabled,
-    'opacity-50': disabled,
-
-    'mask-squircle': props.squircle || shape === 'squircle',
-    'mask-heart': props.heart || shape === 'heart',
-    'mask-hexagon': props.hexagon || shape === 'hexagon',
-    'mask-hexagon-2': props.hexagon2 || shape === 'hexagon-2',
-    'mask-decagon': props.decagon || shape === 'decagon',
-    'mask-pentagon': props.pentagon || shape === 'pentagon',
-    'mask-diamond': props.diamond || shape === 'diamond',
-    'mask-square': props.square || shape === 'square',
-    'mask-circle': props.circle || shape === 'circle',
-    'mask-parallelogram': props.parallelogram || shape === 'parallelogram',
-    'mask-parallelogram-2': props.parallelogram2 || shape === 'parallelogram-2',
-    'mask-parallelogram-3': props.parallelogram3 || shape === 'parallelogram-3',
-    'mask-parallelogram-4': props.parallelogram4 || shape === 'parallelogram-4',
-    'mask-star': props.star || shape === 'star',
-    'mask-star-2': props.star2 || shape === 'star-2' || !hasShape,
-    'mask-triangle': props.triangle || shape === 'triangle',
-    'mask-triangle-2': props.triangle2 || shape === 'triangle-2',
-    'mask-triangle-3': props.triangle3 || shape === 'triangle-3',
-    'mask-triangle-4': props.triangle4 || shape === 'triangle-4',
-  }
-})
-const max = computed(() => Number.parseInt(props.count as string))
-
-function handleValue(digit: number, half = false) {
-  if (props.disabled)
-    return
-
-  if (props.half)
-    return emit('update:modelValue', half ? digit - 0.5 : digit)
-
-  return emit('update:modelValue', digit)
-}
-</script>
-
-<template>
-  <div class="rating" :class="ratingClasses">
-    <input
-      type="radio"
-      :value="0"
-      class="rating-hidden"
-      :checked="modelValue === 0"
-      @change="$emit('update:modelValue', 0)"
-    >
-    <template v-for="digit in max" :key="digit">
-      <input
-        type="radio"
-        :value="half ? digit - 0.5 : digit"
-        class="mask"
-        :class="[maskClasses, bg, { 'mask-half-1': half }]"
-        :checked="half ? modelValue === digit - 0.5 : modelValue === digit"
-        @change="() => handleValue(digit, true)"
-      >
-      <input
-        v-if="half"
-        type="radio"
-        :value="digit"
-        class="mask mask-half-2"
-        :class="[maskClasses, bg]"
-        :checked="modelValue === digit"
-        @change="() => handleValue(digit)"
-      >
-    </template>
-  </div>
-</template>

package/components/Select.vue

@@ -1,100 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-type Color = | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error'
-
-const props = withDefaults(defineProps<{
-  modelValue: any
-  options: Record<string, any>[] | any[]
-  value?: (val: any) => any
-  label?: (val: any) => any
-  resultAsObject?: boolean
-  join?: boolean
-
-  bordered?: boolean
-  ghost?: boolean
-  disabled?: boolean
-
-  color?: Color
-  primary?: boolean
-  secondary?: boolean
-  accent?: boolean
-  info?: boolean
-  success?: boolean
-  warning?: boolean
-  error?: boolean
-
-  size?: 'lg' | 'md' | 'sm' | 'xs'
-  lg?: boolean
-  md?: boolean
-  sm?: boolean
-  xs?: boolean
-}>(), {
-  value: (val: any) => {
-    if (!val)
-      return null
-
-    return typeof val === 'string'
-      ? (val as string)
-      : (val?.value || val?.id || val?._id || val)
-  },
-  label: (val: any) =>
-    typeof val === 'string'
-      ? (val as string)
-      : (val.label || val.name || val.title),
-  resultAsObject: false,
-})
-const emit = defineEmits(['update:modelValue'])
-
-const computedVModel = computed({
-  get: () => {
-    if (props.resultAsObject && props.modelValue != null)
-      return props.value(props.modelValue)
-
-    return props.modelValue
-  },
-  set: (val) => {
-    if (val === undefined)
-      val = null
-    if (props.resultAsObject && val != null)
-      val = props.options.find(o => props.value(o) === val)
-
-    emit('update:modelValue', val)
-  },
-})
-
-const classes = computed(() => {
-  return {
-    'join-item': props.join,
-
-    'select-primary': props.primary || props.color === 'primary',
-    'select-secondary': props.secondary || props.color === 'secondary',
-    'select-accent': props.accent || props.color === 'accent',
-    'select-info': props.info || props.color === 'info',
-    'select-success': props.success || props.color === 'success',
-    'select-warning': props.warning || props.color === 'warning',
-    'select-error': props.error || props.color === 'error',
-
-    'select-lg': props.lg || props.size === 'lg',
-    'select-md': props.md || props.size === 'md',
-    'select-sm': props.sm || props.size === 'sm',
-    'select-xs': props.xs || props.size === 'xs',
-
-    'select-bordered': props.bordered,
-    'select-ghost': props.ghost,
-  }
-})
-</script>
-
-<template>
-  <select v-model="computedVModel" class="select" :class="classes" :disabled="disabled">
-    <option
-      v-for="option in options"
-      :key="value(option)"
-      :value="value(option)"
-      :disabled="option.disabled"
-    >
-      {{ label(option) }}
-    </option>
-  </select>
-</template>

package/components/Stack.vue

@@ -1,13 +0,0 @@
-<script setup lang="ts">
-withDefaults(defineProps<{
-  is?: string
-}>(), {
-  is: 'div',
-})
-</script>
-
-<template>
-  <component :is="is" class="stack">
-    <slot />
-  </component>
-</template>

package/components/Stat.vue

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

package/components/StatActions.vue

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

package/components/StatDesc.vue

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

package/components/StatFigure.vue

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

package/components/StatTitle.vue

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