@nuxt/ui 2.17.0 → 2.18.1

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

@@ -16,11 +16,13 @@
     </div>
     <div v-if="label || $slots.label" :class="ui.inner">
       <label :for="inputId" :class="ui.label">
-        <slot name="label">{{ label }}</slot>
+        <slot name="label" :label="label">{{ label }}</slot>
         <span v-if="required" :class="ui.required">*</span>
       </label>
-      <p v-if="help" :class="ui.help">
-        {{ help }}
+      <p v-if="help || $slots.help" :class="ui.help">
+        <slot name="help" :help="help">
+          {{ help }}
+        </slot>
       </p>
     </div>
   </div>

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

@@ -1,20 +1,39 @@
 import type { PropType } from 'vue';
+import type { Strategy } from '../../types.js';
+import colors from '#ui-colors';
+declare const config: {
+    wrapper: string;
+    container: string;
+    base: string;
+    form: string;
+    color: string;
+    background: string;
+    border: string;
+    ring: string;
+    inner: string;
+    label: string;
+    required: string;
+    help: string;
+    default: {
+        color: string;
+    };
+};
 declare const _default: import("vue").DefineComponent<{
     id: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     value: {
-        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
-        default: null;
+        type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
+        default: any;
     };
     modelValue: {
-        type: (StringConstructor | BooleanConstructor | ObjectConstructor | NumberConstructor)[];
-        default: null;
+        type: (StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor)[];
+        default: any;
     };
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     disabled: {
         type: BooleanConstructor;
@@ -22,59 +41,77 @@ declare const _default: import("vue").DefineComponent<{
     };
     help: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     label: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     required: {
         type: BooleanConstructor;
         default: boolean;
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<(typeof colors)[number]>;
+        default: () => string;
         validator(value: string): any;
     };
     inputClass: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }, {
     inputId: string;
-    ui: import("vue").ComputedRef<any>;
+    ui: import("vue").ComputedRef<{
+        wrapper: string;
+        container: string;
+        base: string;
+        form: string;
+        color: string;
+        background: string;
+        border: string;
+        ring: string;
+        inner: string;
+        label: string;
+        required: string;
+        help: string;
+        default: {
+            color: string;
+        };
+    }>;
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
     pick: import("vue").WritableComputedRef<string | number | boolean | Record<string, any>>;
-    name: import("vue").ComputedRef<string | undefined>;
+    name: any;
     inputClass: import("vue").ComputedRef<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<{
     id: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     value: {
-        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
-        default: null;
+        type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
+        default: any;
     };
     modelValue: {
-        type: (StringConstructor | BooleanConstructor | ObjectConstructor | NumberConstructor)[];
-        default: null;
+        type: (StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor)[];
+        default: any;
     };
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     disabled: {
         type: BooleanConstructor;
@@ -82,47 +119,49 @@ declare const _default: import("vue").DefineComponent<{
     };
     help: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     label: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     required: {
         type: BooleanConstructor;
         default: boolean;
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<(typeof colors)[number]>;
+        default: () => string;
         validator(value: string): any;
     };
     inputClass: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }>> & {
-    onChange?: ((...args: any[]) => any) | undefined;
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onChange?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: (...args: any[]) => any;
 }, {
-    value: string | number | boolean;
     name: string;
     required: boolean;
-    label: string;
     class: any;
-    color: any;
     disabled: boolean;
-    ui: any;
+    ui: {};
+    color: "primary" | "red" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "pink" | "rose";
+    label: string;
     id: string;
     modelValue: string | number | boolean | Record<string, any>;
+    value: string | number | boolean;
     help: string;
     inputClass: string;
 }, {}>;

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

@@ -18,7 +18,11 @@
         @change="onUpdate(option.value)"
       >
         <template #label>
-          <slot name="label" v-bind="{ option }" />
+          <slot name="label" v-bind="{ option, selected: option.selected }" />
+        </template>
+
+        <template #help>
+          <slot name="help" v-bind="{ option, selected: option.selected }" />
         </template>
       </URadio>
     </fieldset>
@@ -42,7 +46,7 @@ export default defineComponent({
   inheritAttrs: false,
   props: {
     modelValue: {
-      type: [String, Number, Object],
+      type: [String, Number, Object, Boolean],
       default: ""
     },
     name: {
@@ -106,6 +110,9 @@ export default defineComponent({
     const guessOptionText = (option) => {
       return get(option, props.optionAttribute, get(option, props.valueAttribute));
     };
+    const guessOptionSelected = (option) => {
+      return props.modelValue === guessOptionValue(option);
+    };
     const normalizeOption = (option) => {
       if (["string", "number", "boolean"].includes(typeof option)) {
         return {
@@ -116,7 +123,8 @@ export default defineComponent({
       return {
         ...option,
         value: guessOptionValue(option),
-        label: guessOptionText(option)
+        label: guessOptionText(option),
+        selected: guessOptionSelected(option)
       };
     };
     const normalizedOptions = computed(() => {

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

@@ -1,20 +1,47 @@
 import type { PropType } from 'vue';
+import type { Strategy } from '../../types.js';
+import colors from '#ui-colors';
+declare const config: {
+    wrapper: string;
+    fieldset: string;
+    legend: string;
+    default: {
+        color: string;
+    };
+};
+declare const configRadio: {
+    wrapper: string;
+    container: string;
+    base: string;
+    form: string;
+    color: string;
+    background: string;
+    border: string;
+    ring: string;
+    inner: string;
+    label: string;
+    required: string;
+    help: string;
+    default: {
+        color: string;
+    };
+};
 declare const _default: import("vue").DefineComponent<{
     modelValue: {
-        type: (StringConstructor | ObjectConstructor | NumberConstructor)[];
+        type: (StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor)[];
         default: string;
     };
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     legend: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     options: {
         type: ArrayConstructor;
-        default: () => never[];
+        default: () => any[];
     };
     optionAttribute: {
         type: StringConstructor;
@@ -29,8 +56,8 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<(typeof colors)[number]>;
+        default: () => string;
         validator(value: string): any;
     };
     class: {
@@ -38,16 +65,43 @@ declare const _default: import("vue").DefineComponent<{
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
     uiRadio: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof configRadio> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }, {
-    ui: import("vue").ComputedRef<any>;
-    uiRadio: import("vue").ComputedRef<any>;
+    ui: import("vue").ComputedRef<{
+        wrapper: string;
+        fieldset: string;
+        legend: string;
+        default: {
+            color: string;
+        };
+    }>;
+    uiRadio: import("vue").ComputedRef<{
+        wrapper: string;
+        container: string;
+        base: string;
+        form: string;
+        color: string;
+        background: string;
+        border: string;
+        ring: string;
+        inner: string;
+        label: string;
+        required: string;
+        help: string;
+        default: {
+            color: string;
+        };
+    }>;
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
@@ -55,20 +109,20 @@ declare const _default: import("vue").DefineComponent<{
     onUpdate: (value: any) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
-        type: (StringConstructor | ObjectConstructor | NumberConstructor)[];
+        type: (StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor)[];
         default: string;
     };
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     legend: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     options: {
         type: ArrayConstructor;
-        default: () => never[];
+        default: () => any[];
     };
     optionAttribute: {
         type: StringConstructor;
@@ -83,8 +137,8 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<(typeof colors)[number]>;
+        default: () => string;
         validator(value: string): any;
     };
     class: {
@@ -92,27 +146,31 @@ declare const _default: import("vue").DefineComponent<{
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
     uiRadio: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof configRadio> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }>> & {
-    onChange?: ((...args: any[]) => any) | undefined;
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onChange?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: (...args: any[]) => any;
 }, {
     name: string;
-    legend: string;
     class: any;
-    color: any;
     disabled: boolean;
-    ui: any;
-    modelValue: string | number | Record<string, any>;
+    ui: {};
+    color: "primary" | "red" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "pink" | "rose";
+    legend: string;
     options: unknown[];
+    modelValue: string | number | boolean | Record<string, any>;
     optionAttribute: string;
     valueAttribute: string;
-    uiRadio: any;
+    uiRadio: {};
 }, {}>;
 export default _default;

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

@@ -1,5 +1,68 @@
 import type { PropType } from 'vue';
-import type { RangeSize } from '../../types';
+import type { RangeSize, RangeColor, Strategy } from '../../types.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;
@@ -7,11 +70,11 @@ declare const _default: import("vue").DefineComponent<{
     };
     id: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     disabled: {
         type: BooleanConstructor;
@@ -31,33 +94,97 @@ declare const _default: import("vue").DefineComponent<{
     };
     size: {
         type: PropType<RangeSize>;
-        default: null;
+        default: any;
         validator(value: string): boolean;
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<RangeColor>;
+        default: () => string;
         validator(value: string): any;
     };
     inputClass: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }, {
-    ui: import("vue").ComputedRef<any>;
+    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 | undefined>;
-    inputId: import("vue").ComputedRef<string | undefined>;
+    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>;
@@ -75,11 +202,11 @@ declare const _default: import("vue").DefineComponent<{
     };
     id: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     name: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     disabled: {
         type: BooleanConstructor;
@@ -99,40 +226,42 @@ declare const _default: import("vue").DefineComponent<{
     };
     size: {
         type: PropType<RangeSize>;
-        default: null;
+        default: any;
         validator(value: string): boolean;
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<RangeColor>;
+        default: () => string;
         validator(value: string): any;
     };
     inputClass: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }>> & {
-    onChange?: ((...args: any[]) => any) | undefined;
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onChange?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: (...args: any[]) => any;
 }, {
-    size: RangeSize;
     name: string;
+    size: RangeSize;
     class: any;
-    color: any;
     disabled: boolean;
-    ui: any;
-    max: number;
+    ui: {};
+    color: "primary" | "red" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "pink" | "rose";
     step: number;
     id: string;
     modelValue: number;
+    max: number;
     inputClass: string;
     min: number;
 }, {}>;