@una-ui/nuxt 0.29.0-beta.1 → 0.31.0-beta.1

package/README.md

@@ -5,10 +5,10 @@
 
 ## 🏗️ Release Status
 
-| Branch | Version | Status | Downloads |
-| --- | --- | --- | --- |
-| Main (Edge) | [![npm-edge][npm-edge-src]][npm-edge-href] | [![github-status][github-status-src-main]][github-status-href-main] | [![npm-edge-downloads][npm-edge-downloads-src]][npm-edge-downloads-href] |
-| Release | [![npm-version][npm-version-src]][npm-version-href] | [![github-status][github-status-src-release]][github-status-href-release] | [![npm-downloads][npm-downloads-src]][npm-downloads-href] |
+| Branch      | Version                                             | Status                                                                    | Downloads                                                                |
+| ----------- | --------------------------------------------------- | ------------------------------------------------------------------------- | ------------------------------------------------------------------------ |
+| Main (Edge) | [![npm-edge][npm-edge-src]][npm-edge-href]          | [![github-status][github-status-src-main]][github-status-href-main]       | [![npm-edge-downloads][npm-edge-downloads-src]][npm-edge-downloads-href] |
+| Release     | [![npm-version][npm-version-src]][npm-version-href] | [![github-status][github-status-src-release]][github-status-href-release] | [![npm-downloads][npm-downloads-src]][npm-downloads-href]                |
 
 ## 📙 Documentation
 
@@ -32,7 +32,7 @@ Visit https://www.unaui.com for full documentation.
 
 ## 🪴 Project Activity
 
-![Alt](https://repobeats.axiom.co/api/embed/49dee6a65be83113d1241c7bd38f23e211a0f189.svg "Repobeats analytics image")
+![Alt](https://repobeats.axiom.co/api/embed/49dee6a65be83113d1241c7bd38f23e211a0f189.svg 'Repobeats analytics image')
 
 ## 👨‍💻 Contributors
 

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@una-ui/nuxt",
   "configKey": "una",
-  "version": "0.29.0-beta.1",
+  "version": "0.31.0-beta.1",
   "compatibility": {
     "nuxt": ">=3.0.0"
   },

package/dist/module.mjs

@@ -7,7 +7,7 @@ import 'unocss';
 import 'unocss-preset-animations';
 
 const name = "@una-ui/nuxt";
-const version = "0.29.0-beta.1";
+const version = "0.31.0-beta.1";
 
 const module = defineNuxtModule({
   meta: {
@@ -113,6 +113,13 @@ const module = defineNuxtModule({
       watch: nuxt.options.dev,
       priority: 10
     });
+    addComponentsDir({
+      path: resolve(runtimeDir, "components/forms", "radio-group"),
+      prefix: options.prefix,
+      global: options.global,
+      watch: nuxt.options.dev,
+      priority: 10
+    });
     addComponentsDir({
       path: resolve(runtimeDir, "components", "misc"),
       prefix: options.prefix,

package/dist/runtime/components/data/table/Table.vue

@@ -422,4 +422,4 @@ defineExpose({
       </slot>
     </TableFooter>
   </TableRoot>
-</template>.
+</template>

package/dist/runtime/components/elements/AvatarGroup.vue

@@ -2,10 +2,6 @@
 import type { NAvatarGroupProps } from '../../types'
 import NAvatarGroupDefaultSlot from '../slots/AvatarGroupDefault'
 
-defineOptions({
-  inheritAttrs: false,
-})
-
 const props = withDefaults(defineProps<NAvatarGroupProps>(), {
   max: 3,
 })
@@ -14,11 +10,11 @@ const props = withDefaults(defineProps<NAvatarGroupProps>(), {
 <template>
   <div
     avatar-group
-    v-bind="{ ...$attrs, size }"
+    :size
     :class="una?.avatarGroup"
   >
     <NAvatarGroupDefaultSlot
-      :max="max"
+      :max
       :avatar="props"
     >
       <slot />

package/dist/runtime/components/elements/Label.vue

@@ -1,21 +1,17 @@
 <script setup lang="ts">
 import type { NLabelProps } from '../../types'
+import { reactiveOmit } from '@vueuse/core'
 import { Label } from 'radix-vue'
-import { computed } from 'vue'
 import { cn } from '../../utils'
 
 const props = defineProps<NLabelProps>()
 
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
+const rootProps = reactiveOmit(props, ['label', 'class'])
 </script>
 
 <template>
   <Label
-    v-bind="delegatedProps"
+    v-bind="rootProps"
     :class="
       cn(
         'label-base',
@@ -23,6 +19,8 @@ const delegatedProps = computed(() => {
       )
     "
   >
-    <slot />
+    <slot>
+      {{ label }}
+    </slot>
   </Label>
 </template>

package/dist/runtime/components/elements/Link.vue.d.ts

@@ -245,6 +245,10 @@ declare global {
     type __VLS_PrettifyGlobal<T> = {
         [K in keyof T]: T[K];
     } & {};
+    type __VLS_PickFunctionalComponentCtx<T, K> = NonNullable<__VLS_PickNotAny<'__ctx' extends keyof __VLS_PickNotAny<K, {}> ? K extends {
+        __ctx?: infer Ctx;
+    } ? Ctx : never : any, T extends (props: any, ctx: infer Ctx) => any ? Ctx : any>>;
+    type __VLS_UseTemplateRef<T> = Readonly<import('vue').ShallowRef<T | null>>;
     function __VLS_getVForSourceType(source: number): [number, number, number][];
     function __VLS_getVForSourceType(source: string): [string, number, number][];
     function __VLS_getVForSourceType<T extends any[]>(source: T): [
@@ -277,7 +281,7 @@ declare global {
     ][];
     function __VLS_getSlotParams<T>(slot: T): Parameters<__VLS_PickNotAny<NonNullable<T>, (...args: any[]) => any>>;
     function __VLS_getSlotParam<T>(slot: T): Parameters<__VLS_PickNotAny<NonNullable<T>, (...args: any[]) => any>>[0];
-    function __VLS_directiveAsFunction<T extends import('vue').Directive>(dir: T): T extends (...args: any) => any ? T | __VLS_unknownDirective : NonNullable<(T & Record<string, __VLS_unknownDirective>)['created' | 'beforeMount' | 'mounted' | 'beforeUpdate' | 'updated' | 'beforeUnmount' | 'unmounted']>;
+    function __VLS_asFunctionalDirective<T>(dir: T): T extends import('vue').ObjectDirective ? NonNullable<T['created' | 'beforeMount' | 'mounted' | 'beforeUpdate' | 'updated' | 'beforeUnmount' | 'unmounted']> : T extends (...args: any) => any ? T : __VLS_unknownDirective;
     function __VLS_withScope<T, K>(ctx: T, scope: K): ctx is T & K;
     function __VLS_makeOptional<T>(t: T): {
         [K in keyof T]?: T[K];
@@ -311,9 +315,6 @@ declare global {
     };
     function __VLS_elementAsFunction<T>(tag: T, endTag?: T): (_: T & Record<string, unknown>) => void;
     function __VLS_functionalComponentArgsRest<T extends (...args: any) => any>(t: T): 2 extends Parameters<T>['length'] ? [any] : [];
-    function __VLS_pickFunctionalComponentCtx<T, K>(comp: T, compInstance: K): NonNullable<__VLS_PickNotAny<'__ctx' extends keyof __VLS_PickNotAny<K, {}> ? K extends {
-        __ctx?: infer Ctx;
-    } ? Ctx : never : any, T extends (props: any, ctx: infer Ctx) => any ? Ctx : any>>;
     function __VLS_normalizeSlot<S>(s: S): S extends () => infer R ? (props: {}) => R : S;
     function __VLS_tryAsConstant<const T>(t: T): T;
 }

package/dist/runtime/components/elements/avatar/AvatarFallback.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { NAvatarAvatarFallbackProps } from '../../../types'
 import { AvatarFallback } from 'radix-vue'
-import { cn } from '../../../utils'
+import { cn, omitProps } from '../../../utils'
 import Icon from '../Icon.vue'
 
 const props = withDefaults(defineProps<NAvatarAvatarFallbackProps>(), {
@@ -15,7 +15,7 @@ const props = withDefaults(defineProps<NAvatarAvatarFallbackProps>(), {
   >
     <component
       :is="as"
-      v-bind="props"
+      v-bind="omitProps(props, ['label', 'una', 'icon'])"
       :class="cn(
         'avatar-fallback',
         una?.avatarFallback,

package/dist/runtime/components/elements/avatar/AvatarImage.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
 import type { NAvatarImageProps } from '../../../types'
 import { AvatarImage } from 'radix-vue'
-import { cn } from '../../../utils'
+import { cn, omitProps } from '../../../utils'
 
 const props = defineProps<NAvatarImageProps>()
 </script>
 
 <template>
   <AvatarImage
-    v-bind="props"
+    v-bind="omitProps(props, ['class', 'una'])"
     :src="src!"
     :class="cn(
       'avatar-image',

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

@@ -45,6 +45,7 @@ const id = computed(() => props.id ?? randomId('checkbox'))
           'peer checkbox',
           props.class,
         )"
+      :checkbox
     >
       <CheckboxIndicator
         :force-mount

package/dist/runtime/components/forms/radio-group/RadioGroup.vue

@@ -0,0 +1,50 @@
+<script setup lang="ts">
+import type { NRadioGroupProps } from '../../../types'
+import { reactivePick } from '@vueuse/core'
+import { RadioGroupRoot, type RadioGroupRootEmits, useForwardPropsEmits } from 'radix-vue'
+import { cn } from '../../../utils'
+import RadioGroupItem from './RadioGroupItem.vue'
+
+const props = withDefaults(defineProps<NRadioGroupProps>(), {
+  radioGroup: 'primary',
+  size: 'md',
+  square: '1em',
+})
+const emits = defineEmits<RadioGroupRootEmits>()
+
+const rootProps = reactivePick(props, [
+  'as',
+  'asChild',
+  'defaultValue',
+  'dir',
+  'disabled',
+  'loop',
+  'modelValue',
+  'name',
+  'orientation',
+  'required',
+])
+
+const forwarded = useForwardPropsEmits(rootProps, emits)
+</script>
+
+<template>
+  <RadioGroupRoot
+    :class="cn(
+      'radio-group',
+      orientation === 'horizontal' ? 'radio-group-orientation-horizontal' : 'radio-group-orientation-vertical',
+      una?.radioGroup,
+      props.class,
+    )"
+    v-bind="forwarded"
+  >
+    <slot>
+      <RadioGroupItem
+        v-for="item in items"
+        :key="item.value"
+        v-bind="{ rounded, icon, size, square, radioGroup, ...item }"
+        :una="{ ...una, ...item.una }"
+      />
+    </slot>
+  </RadioGroupRoot>
+</template>

package/dist/runtime/components/forms/radio-group/RadioGroupItem.vue

@@ -0,0 +1,95 @@
+<script setup lang="ts">
+import type { NRadioGroupItemProps } from '../../../types'
+import { reactivePick } from '@vueuse/core'
+import {
+  RadioGroupIndicator,
+  RadioGroupItem,
+  useForwardProps,
+} from 'radix-vue'
+import { cn, randomId } from '../../../utils'
+import Icon from '../../elements/Icon.vue'
+import Label from '../../elements/Label.vue'
+
+defineOptions({
+  inheritAttrs: false,
+})
+
+const props = withDefaults(defineProps<NRadioGroupItemProps>(), {
+  icon: 'radio-group-indicator-icon',
+  radioGroup: 'primary',
+  size: 'md',
+  square: '1em',
+})
+
+const id = props.id || randomId('radio-group')
+
+const delegatedProps = reactivePick(props, [
+  'as',
+  'disabled',
+  'id',
+  'name',
+  'required',
+  'value',
+])
+
+const forwardedProps = useForwardProps(delegatedProps)
+</script>
+
+<template>
+  <div
+    :class="cn(
+      'radio-group-item-wrapper',
+      una?.radioGroupItemWrapper,
+    )"
+    :radio-group="radioGroup"
+  >
+    <RadioGroupItem
+      as-child
+      v-bind="forwardedProps"
+    >
+      <button
+        :id
+        :class="
+          cn(
+            'radio-group-item',
+            una?.radioGroupItem,
+            props.class,
+          )
+        "
+        :square
+        :size
+        :rounded
+      >
+        <RadioGroupIndicator
+          :class="cn(
+            'radio-group-indicator',
+            una?.radioGroupIndicator,
+          )"
+        >
+          <slot name="icon">
+            <Icon
+              :name="icon"
+              :class="cn(
+                'radio-group-indicator-icon-base',
+                una?.radioGroupIndicatorIcon,
+              )"
+            />
+          </slot>
+        </RadioGroupIndicator>
+      </button>
+    </RadioGroupItem>
+
+    <slot name="label">
+      <Label
+        v-if="props.label"
+        :for="props.id ?? id"
+        :class="cn(
+          'radio-group-item-label',
+          una?.radioGroupItemLabel,
+        )"
+      >
+        {{ label }}
+      </Label>
+    </slot>
+  </div>
+</template>

package/dist/runtime/components/misc/ThemeSwitcher.vue

@@ -178,7 +178,6 @@ function shuffleTheme(): void {
         <div class="flex space-x-3">
           <Button
             btn="solid-gray block"
-            size="xs"
             label="Reset"
             leading="i-radix-icons-reload"
             @click="reset"

package/dist/runtime/components/slots/AvatarGroupDefault.js

@@ -32,8 +32,9 @@ export default defineComponent({
       return h(Avatar, {
         // TODO: add `more` configuration
         class: "avatar-(soft group-margin)",
+        size: props.avatar?.size,
         label: `+${countChildren.value - props.max}`,
-        una: { avatarLabel: `${props.avatar?.una?.avatarGroupLabel} avatar-group-label` }
+        una: { avatarLabel: `${props.avatar?.una?.avatarGroupLabel ?? ""} avatar-group-label` }
       });
     });
     return () => [

package/dist/runtime/types/index.d.ts

@@ -23,6 +23,7 @@ export * from './pagination.js';
 export * from './popover.js';
 export * from './progress.js';
 export * from './radio.js';
+export * from './radio-group.js';
 export * from './select.js';
 export * from './separator.js';
 export * from './skeleton.js';

package/dist/runtime/types/index.js

@@ -23,6 +23,7 @@ export * from "./pagination.js";
 export * from "./popover.js";
 export * from "./progress.js";
 export * from "./radio.js";
+export * from "./radio-group.js";
 export * from "./select.js";
 export * from "./separator.js";
 export * from "./skeleton.js";

package/dist/runtime/types/label.d.ts

@@ -4,5 +4,6 @@ interface BaseExtensions {
     class?: HTMLAttributes['class'];
 }
 export interface NLabelProps extends BaseExtensions, LabelProps {
+    label?: string;
 }
 export {};

package/dist/runtime/types/radio-group.d.ts

@@ -0,0 +1,67 @@
+import type { RadioGroupItemProps, RadioGroupRootProps } from 'radix-vue';
+import type { HTMLAttributes } from 'vue';
+interface BaseProps {
+    class?: HTMLAttributes['class'];
+    /**
+     * Set the size of the avatar.
+     */
+    size?: HTMLAttributes['class'];
+    /**
+     * Set the height and width of the avatar.
+     */
+    square?: HTMLAttributes['class'];
+    /**
+     * Set the border radius of the avatar.
+     */
+    rounded?: HTMLAttributes['class'];
+    /**
+     * Update the icon of the radio.
+     */
+    icon?: HTMLAttributes['class'];
+}
+export interface NRadioGroupProps extends BaseProps, RadioGroupRootProps {
+    items?: NRadioGroupItemProps[];
+    /**
+     * Switch the position of label and radio.
+     *
+     * @default false
+     */
+    reverse?: boolean;
+    /**
+     * Allows you to add `UnaUI` radio preset properties,
+     * Think of it as a shortcut for adding options or variants to the preset if available.
+     *
+     * @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/radio-group.ts
+     * @example
+     * radio-group="green"
+     */
+    radioGroup?: HTMLAttributes['class'];
+    /**
+     * `UnaUI` preset configuration
+     *
+     * @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/radio.ts
+     */
+    una?: NRadioGroupUnaProps;
+}
+export interface NRadioGroupItemProps extends BaseProps, RadioGroupItemProps {
+    label?: string;
+    /**
+     * Allows you to add `UnaUI` radio preset properties,
+     * Think of it as a shortcut for adding options or variants to the preset if available.
+     *
+     * @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/radio-group.ts
+     * @example
+     * radio-group="green"
+     */
+    radioGroup?: HTMLAttributes['class'];
+    una?: NRadioGroupUnaProps;
+}
+export interface NRadioGroupUnaProps {
+    radioGroup?: HTMLAttributes['class'];
+    radioGroupItemWrapper?: HTMLAttributes['class'];
+    radioGroupItem?: HTMLAttributes['class'];
+    radioGroupItemLabel?: HTMLAttributes['class'];
+    radioGroupIndicator?: HTMLAttributes['class'];
+    radioGroupIndicatorIcon?: HTMLAttributes['class'];
+}
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@una-ui/nuxt",
   "type": "module",
-  "version": "0.29.0-beta.1",
+  "version": "0.31.0-beta.1",
   "description": "Nuxt module for @una-ui",
   "author": "Phojie Rengel <phojrengel@gmail.com>",
   "license": "MIT",
@@ -27,34 +27,33 @@
   ],
   "dependencies": {
     "@headlessui/vue": "^1.7.23",
-    "@iconify-json/heroicons": "^1.2.1",
-    "@iconify-json/lucide": "^1.2.15",
+    "@iconify-json/lucide": "^1.2.16",
     "@iconify-json/radix-icons": "^1.2.1",
     "@iconify-json/tabler": "^1.2.8",
-    "@nuxt/kit": "^3.14.159",
+    "@nuxt/kit": "^3.14.1592",
     "@nuxtjs/color-mode": "^3.5.2",
     "@tanstack/vue-table": "^8.20.5",
-    "@unocss/core": "^0.63.6",
-    "@unocss/nuxt": "^0.63.6",
-    "@unocss/preset-attributify": "^0.63.6",
-    "@unocss/preset-icons": "^0.63.6",
-    "@vueuse/core": "^11.3.0",
-    "@vueuse/integrations": "^11.3.0",
-    "@vueuse/nuxt": "^11.3.0",
+    "@unocss/core": "^0.64.1",
+    "@unocss/nuxt": "^0.64.1",
+    "@unocss/preset-attributify": "^0.64.1",
+    "@unocss/preset-icons": "^0.64.1",
+    "@vueuse/core": "^12.0.0",
+    "@vueuse/integrations": "^12.0.0",
+    "@vueuse/nuxt": "^12.0.0",
     "clsx": "^2.1.1",
     "ohash": "^1.1.4",
-    "radix-vue": "^1.9.7",
-    "tailwind-merge": "^2.5.4",
-    "typescript": "^5.6.3",
-    "unocss": "^0.63.6",
+    "radix-vue": "^1.9.10",
+    "tailwind-merge": "^2.5.5",
+    "typescript": "5.6.3",
+    "unocss": "^0.64.1",
     "unocss-preset-animations": "^1.1.0",
-    "@una-ui/extractor-vue-script": "^0.29.0-beta.1",
-    "@una-ui/preset": "^0.29.0-beta.1"
+    "@una-ui/extractor-vue-script": "^0.31.0-beta.1",
+    "@una-ui/preset": "^0.31.0-beta.1"
   },
   "devDependencies": {
     "@nuxt/module-builder": "^0.8.4",
-    "@nuxt/schema": "^3.14.159",
-    "nuxt": "^3.14.159"
+    "@nuxt/schema": "^3.14.1592",
+    "nuxt": "^3.14.1592"
   },
   "publishConfig": {
     "access": "public"