@nuxt/ui 2.18.4 → 3.0.0-alpha.1

package/dist/runtime/components/forms/Range.vue

@@ -1,173 +0,0 @@
-<template>
-  <div :class="wrapperClass">
-    <input
-      :id="inputId"
-      ref="input"
-      v-model.number="value"
-      :name="name"
-      :min="min"
-      :max="max"
-      :disabled="disabled"
-      :step="step"
-      type="range"
-      :class="[inputClass, thumbClass, trackClass]"
-      v-bind="attrs"
-      @change="onChange"
-    >
-
-    <span :class="progressClass" :style="progressStyle" />
-  </div>
-</template>
-
-<script>
-import { computed, toRef, defineComponent } from "vue";
-import { twMerge, twJoin } from "tailwind-merge";
-import { useUI } from "../../composables/useUI";
-import { useFormGroup } from "../../composables/useFormGroup";
-import { mergeConfig } from "../../utils";
-import appConfig from "#build/app.config";
-import { range } from "#ui/ui.config";
-const config = mergeConfig(appConfig.ui.strategy, appConfig.ui.range, range);
-export default defineComponent({
-  inheritAttrs: false,
-  props: {
-    modelValue: {
-      type: Number,
-      default: 0
-    },
-    id: {
-      type: String,
-      default: null
-    },
-    name: {
-      type: String,
-      default: null
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    min: {
-      type: Number,
-      default: 0
-    },
-    max: {
-      type: Number,
-      default: 100
-    },
-    step: {
-      type: Number,
-      default: 1
-    },
-    size: {
-      type: String,
-      default: null,
-      validator(value) {
-        return Object.keys(config.size).includes(value);
-      }
-    },
-    color: {
-      type: String,
-      default: () => config.default.color,
-      validator(value) {
-        return appConfig.ui.colors.includes(value);
-      }
-    },
-    inputClass: {
-      type: String,
-      default: null
-    },
-    class: {
-      type: [String, Object, Array],
-      default: () => ""
-    },
-    ui: {
-      type: Object,
-      default: () => ({})
-    }
-  },
-  emits: ["update:modelValue", "change"],
-  setup(props, { emit }) {
-    const { ui, attrs } = useUI("range", toRef(props, "ui"), config);
-    const { emitFormChange, inputId, color, size, name } = useFormGroup(props, config);
-    const value = computed({
-      get() {
-        return props.modelValue;
-      },
-      set(value2) {
-        emit("update:modelValue", value2);
-      }
-    });
-    const onChange = (event) => {
-      emit("change", event.target.value);
-      emitFormChange();
-    };
-    const wrapperClass = computed(() => {
-      return twMerge(twJoin(
-        ui.value.wrapper,
-        ui.value.size[size.value]
-      ), props.class);
-    });
-    const inputClass = computed(() => {
-      return twMerge(twJoin(
-        ui.value.base,
-        ui.value.background,
-        ui.value.rounded,
-        color.value && ui.value.ring.replaceAll("{color}", color.value),
-        ui.value.size[size.value]
-      ), props.inputClass);
-    });
-    const thumbClass = computed(() => {
-      return twJoin(
-        ui.value.thumb.base,
-        // Intermediate class to allow thumb ring or background color (set to `current`) as it's impossible to safelist with arbitrary values
-        color.value && ui.value.thumb.color.replaceAll("{color}", color.value),
-        ui.value.thumb.ring,
-        ui.value.thumb.background,
-        ui.value.thumb.size[size.value]
-      );
-    });
-    const trackClass = computed(() => {
-      return twJoin(
-        ui.value.track.base,
-        ui.value.track.background,
-        ui.value.track.rounded,
-        ui.value.track.size[size.value]
-      );
-    });
-    const progressClass = computed(() => {
-      return twJoin(
-        ui.value.progress.base,
-        ui.value.progress.rounded,
-        color.value && ui.value.progress.background.replaceAll("{color}", color.value),
-        ui.value.progress.size[size.value]
-      );
-    });
-    const progressStyle = computed(() => {
-      const { modelValue, min, max } = props;
-      const clampedValue = Math.max(min, Math.min(modelValue, max));
-      const relativeValue = (clampedValue - min) / (max - min);
-      return {
-        width: `${relativeValue * 100}%`
-      };
-    });
-    return {
-      // eslint-disable-next-line vue/no-dupe-keys
-      ui,
-      attrs,
-      // eslint-disable-next-line vue/no-dupe-keys
-      name,
-      inputId,
-      value,
-      wrapperClass,
-      // eslint-disable-next-line vue/no-dupe-keys
-      inputClass,
-      thumbClass,
-      trackClass,
-      progressClass,
-      progressStyle,
-      onChange
-    };
-  }
-});
-</script>

package/dist/runtime/components/forms/Range.vue.d.ts

@@ -1,268 +0,0 @@
-import type { PropType } from 'vue';
-import type { RangeSize, RangeColor, Strategy } from '../../types/index.js';
-declare const config: {
-    wrapper: string;
-    base: string;
-    rounded: string;
-    background: string;
-    ring: string;
-    progress: {
-        base: string;
-        rounded: string;
-        background: string;
-        size: {
-            '2xs': string;
-            xs: string;
-            sm: string;
-            md: string;
-            lg: string;
-            xl: string;
-            '2xl': string;
-        };
-    };
-    thumb: {
-        base: string;
-        color: string;
-        background: string;
-        ring: string;
-        size: {
-            '2xs': string;
-            xs: string;
-            sm: string;
-            md: string;
-            lg: string;
-            xl: string;
-            '2xl': string;
-        };
-    };
-    track: {
-        base: string;
-        background: string;
-        rounded: string;
-        size: {
-            '2xs': string;
-            xs: string;
-            sm: string;
-            md: string;
-            lg: string;
-            xl: string;
-            '2xl': string;
-        };
-    };
-    size: {
-        '2xs': string;
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-        '2xl': string;
-    };
-    default: {
-        size: string;
-        color: string;
-    };
-};
-declare const _default: import("vue").DefineComponent<{
-    modelValue: {
-        type: NumberConstructor;
-        default: number;
-    };
-    id: {
-        type: StringConstructor;
-        default: any;
-    };
-    name: {
-        type: StringConstructor;
-        default: any;
-    };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    min: {
-        type: NumberConstructor;
-        default: number;
-    };
-    max: {
-        type: NumberConstructor;
-        default: number;
-    };
-    step: {
-        type: NumberConstructor;
-        default: number;
-    };
-    size: {
-        type: PropType<RangeSize>;
-        default: any;
-        validator(value: string): boolean;
-    };
-    color: {
-        type: PropType<RangeColor>;
-        default: () => string;
-        validator(value: string): any;
-    };
-    inputClass: {
-        type: StringConstructor;
-        default: any;
-    };
-    class: {
-        type: PropType<any>;
-        default: () => "";
-    };
-    ui: {
-        type: PropType<Partial<typeof config> & {
-            strategy?: Strategy;
-        }>;
-        default: () => {};
-    };
-}, {
-    ui: import("vue").ComputedRef<{
-        wrapper: string;
-        base: string;
-        rounded: string;
-        background: string;
-        ring: string;
-        progress: {
-            base: string;
-            rounded: string;
-            background: string;
-            size: {
-                '2xs': string;
-                xs: string;
-                sm: string;
-                md: string;
-                lg: string;
-                xl: string;
-                '2xl': string;
-            };
-        };
-        thumb: {
-            base: string;
-            color: string;
-            background: string;
-            ring: string;
-            size: {
-                '2xs': string;
-                xs: string;
-                sm: string;
-                md: string;
-                lg: string;
-                xl: string;
-                '2xl': string;
-            };
-        };
-        track: {
-            base: string;
-            background: string;
-            rounded: string;
-            size: {
-                '2xs': string;
-                xs: string;
-                sm: string;
-                md: string;
-                lg: string;
-                xl: string;
-                '2xl': string;
-            };
-        };
-        size: {
-            '2xs': string;
-            xs: string;
-            sm: string;
-            md: string;
-            lg: string;
-            xl: string;
-            '2xl': string;
-        };
-        default: {
-            size: string;
-            color: string;
-        };
-    }>;
-    attrs: import("vue").ComputedRef<Pick<{
-        [x: string]: unknown;
-    }, string>>;
-    name: import("vue").ComputedRef<string>;
-    inputId: import("vue").ComputedRef<string>;
-    value: import("vue").WritableComputedRef<number>;
-    wrapperClass: import("vue").ComputedRef<string>;
-    inputClass: import("vue").ComputedRef<string>;
-    thumbClass: import("vue").ComputedRef<string>;
-    trackClass: import("vue").ComputedRef<string>;
-    progressClass: import("vue").ComputedRef<string>;
-    progressStyle: import("vue").ComputedRef<{
-        width: string;
-    }>;
-    onChange: (event: Event) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    modelValue: {
-        type: NumberConstructor;
-        default: number;
-    };
-    id: {
-        type: StringConstructor;
-        default: any;
-    };
-    name: {
-        type: StringConstructor;
-        default: any;
-    };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    min: {
-        type: NumberConstructor;
-        default: number;
-    };
-    max: {
-        type: NumberConstructor;
-        default: number;
-    };
-    step: {
-        type: NumberConstructor;
-        default: number;
-    };
-    size: {
-        type: PropType<RangeSize>;
-        default: any;
-        validator(value: string): boolean;
-    };
-    color: {
-        type: PropType<RangeColor>;
-        default: () => string;
-        validator(value: string): any;
-    };
-    inputClass: {
-        type: StringConstructor;
-        default: any;
-    };
-    class: {
-        type: PropType<any>;
-        default: () => "";
-    };
-    ui: {
-        type: PropType<Partial<typeof config> & {
-            strategy?: Strategy;
-        }>;
-        default: () => {};
-    };
-}>> & {
-    onChange?: (...args: any[]) => any;
-    "onUpdate:modelValue"?: (...args: any[]) => any;
-}, {
-    name: string;
-    size: RangeSize;
-    class: any;
-    step: number;
-    color: "primary" | "red" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "pink" | "rose";
-    disabled: boolean;
-    ui: {};
-    id: string;
-    modelValue: number;
-    max: number;
-    inputClass: string;
-    min: number;
-}, {}>;
-export default _default;