@una-ui/nuxt 0.53.0 → 0.54.0

package/dist/runtime/components/combobox/ComboboxItem.vue

@@ -1,23 +1,22 @@
-<script setup>
-import { ComboboxItem, useForwardPropsEmits } from "reka-ui";
-import { computed } from "vue";
-import { cn } from "../../utils";
-const props = defineProps({
-  una: { type: Object, required: false },
-  textValue: { type: String, required: false },
-  value: { type: null, required: true },
-  disabled: { type: Boolean, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false },
-  size: { type: null, required: false, default: "sm" }
-});
-const emits = defineEmits(["select"]);
+<script setup lang="ts" generic="T">
+import type { ComboboxItemEmits } from 'reka-ui'
+import type { NComboboxItemProps } from '../../types'
+import { ComboboxItem, useForwardPropsEmits } from 'reka-ui'
+import { computed } from 'vue'
+import { cn } from '../../utils'
+
+const props = withDefaults(defineProps<NComboboxItemProps<T>>(), {
+  size: 'sm',
+})
+const emits = defineEmits<ComboboxItemEmits>()
+
 const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
-const forwarded = useForwardPropsEmits(delegatedProps, emits);
+  const { class: _, ...delegated } = props
+
+  return delegated
+})
+
+const forwarded = useForwardPropsEmits(delegatedProps, emits)
 </script>
 
 <template>
@@ -25,10 +24,10 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
     data-slot="combobox-item"
     v-bind="forwarded"
     :class="cn(
-  `combobox-item`,
-  props.una?.comboboxItem,
-  props.class
-)"
+      `combobox-item`,
+      props.una?.comboboxItem,
+      props.class,
+    )"
   >
     <slot />
   </ComboboxItem>

package/dist/runtime/components/combobox/ComboboxItemIndicator.vue

@@ -1,20 +1,20 @@
-<script setup>
-import { ComboboxItemIndicator, useForwardProps } from "reka-ui";
-import { computed } from "vue";
-import { cn } from "../../utils";
-const props = defineProps({
-  icon: { type: null, required: false, default: "combobox-item-indicator-icon-name" },
-  una: { type: Object, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false },
-  size: { type: null, required: false }
-});
+<script setup lang="ts">
+import type { NComboboxItemIndicatorProps } from '../../types'
+import { ComboboxItemIndicator, useForwardProps } from 'reka-ui'
+import { computed } from 'vue'
+import { cn } from '../../utils'
+
+const props = withDefaults(defineProps<NComboboxItemIndicatorProps>(), {
+  icon: 'combobox-item-indicator-icon-name',
+})
+
 const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
-const forwarded = useForwardProps(delegatedProps);
+  const { class: _, ...delegated } = props
+
+  return delegated
+})
+
+const forwarded = useForwardProps(delegatedProps)
 </script>
 
 <template>
@@ -22,18 +22,18 @@ const forwarded = useForwardProps(delegatedProps);
     data-slot="combobox-item-indicator"
     v-bind="forwarded"
     :class="cn(
-  'combobox-item-indicator',
-  props.una?.comboboxItemIndicator,
-  props.class
-)"
+      'combobox-item-indicator',
+      props.una?.comboboxItemIndicator,
+      props.class,
+    )"
   >
     <slot>
       <NIcon
         :name="props.icon"
         :class="cn(
-  'combobox-item-indicator-icon',
-  props.una?.comboboxItemIndicatorIcon
-)"
+          'combobox-item-indicator-icon',
+          props.una?.comboboxItemIndicatorIcon,
+        )"
       />
     </slot>
   </ComboboxItemIndicator>

package/dist/runtime/components/combobox/ComboboxLabel.vue

@@ -1,24 +1,18 @@
-<script setup>
-import { ComboboxLabel } from "reka-ui";
-import { cn } from "../../utils";
-const props = defineProps({
-  label: { type: String, required: false },
-  una: { type: Object, required: false },
-  for: { type: String, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false },
-  size: { type: null, required: false }
-});
+<script setup lang="ts">
+import type { NComboboxLabelProps } from '../../types'
+import { ComboboxLabel } from 'reka-ui'
+import { cn } from '../../utils'
+
+const props = defineProps<NComboboxLabelProps>()
 </script>
 
 <template>
   <ComboboxLabel
     :class="cn(
-  'combobox-label',
-  props.una?.comboboxLabel,
-  props.class
-)"
+      'combobox-label',
+      props.una?.comboboxLabel,
+      props.class,
+    )"
   >
     <slot>
       {{ props.label }}

package/dist/runtime/components/combobox/ComboboxList.vue

@@ -1,41 +1,23 @@
-<script setup>
-import { reactiveOmit } from "@vueuse/core";
-import { ComboboxContent, ComboboxPortal, useForwardPropsEmits } from "reka-ui";
-import { provide } from "vue";
-import { cn } from "../../utils";
-import { isInComboboxListKey } from "../../utils/injectionKeys";
-const props = defineProps({
-  viewportClass: { type: null, required: false },
-  una: { type: Object, required: false },
-  _comboboxPortal: { type: Object, required: false },
-  forceMount: { type: Boolean, required: false },
-  position: { type: String, required: false, default: "popper" },
-  bodyLock: { type: Boolean, required: false },
-  side: { type: null, required: false },
-  sideOffset: { type: Number, required: false, default: 4 },
-  align: { type: null, required: false, default: "center" },
-  alignOffset: { type: Number, required: false },
-  avoidCollisions: { type: Boolean, required: false },
-  collisionBoundary: { type: null, required: false },
-  collisionPadding: { type: [Number, Object], required: false },
-  arrowPadding: { type: Number, required: false },
-  sticky: { type: String, required: false },
-  hideWhenDetached: { type: Boolean, required: false },
-  positionStrategy: { type: String, required: false },
-  updatePositionStrategy: { type: String, required: false },
-  disableUpdateOnLayoutShift: { type: Boolean, required: false },
-  prioritizePosition: { type: Boolean, required: false },
-  reference: { type: null, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  disableOutsidePointerEvents: { type: Boolean, required: false },
-  class: { type: null, required: false },
-  size: { type: null, required: false }
-});
-const emits = defineEmits(["escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside"]);
-provide(isInComboboxListKey, true);
-const delegatedProps = reactiveOmit(props, "class", "viewportClass");
-const forwarded = useForwardPropsEmits(delegatedProps, emits);
+<script setup lang="ts">
+import type { ComboboxContentEmits } from 'reka-ui'
+import type { NComboboxListProps } from '../../types'
+import { reactiveOmit } from '@vueuse/core'
+import { ComboboxContent, ComboboxPortal, useForwardPropsEmits } from 'reka-ui'
+import { provide } from 'vue'
+import { cn } from '../../utils'
+import { isInComboboxListKey } from '../../utils/injectionKeys'
+
+const props = withDefaults(defineProps<NComboboxListProps>(), {
+  position: 'popper',
+  align: 'center',
+  sideOffset: 4,
+})
+const emits = defineEmits<ComboboxContentEmits>()
+
+provide(isInComboboxListKey, true)
+
+const delegatedProps = reactiveOmit(props, 'class', 'viewportClass')
+const forwarded = useForwardPropsEmits(delegatedProps, emits)
 </script>
 
 <template>
@@ -46,11 +28,11 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
       data-slot="combobox-list"
       v-bind="forwarded"
       :class="cn(
-  'origin-(--reka-combobox-content-transform-origin)',
-  'combobox-list',
-  props.una?.comboboxList,
-  props.class
-)"
+        'origin-(--reka-combobox-content-transform-origin)',
+        'combobox-list',
+        props.una?.comboboxList,
+        props.class,
+      )"
     >
       <slot />
     </ComboboxContent>

package/dist/runtime/components/combobox/ComboboxSeparator.vue

@@ -1,18 +1,16 @@
-<script setup>
-import { ComboboxSeparator } from "reka-ui";
-import { computed } from "vue";
-import { cn } from "../../utils";
-const props = defineProps({
-  una: { type: Object, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false },
-  size: { type: null, required: false }
-});
+<script setup lang="ts">
+import type { NComboboxSeparatorProps } from '../../types'
+import { ComboboxSeparator } from 'reka-ui'
+import { computed } from 'vue'
+import { cn } from '../../utils'
+
+const props = defineProps<NComboboxSeparatorProps>()
+
 const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
+  const { class: _, ...delegated } = props
+
+  return delegated
+})
 </script>
 
 <template>
@@ -20,10 +18,10 @@ const delegatedProps = computed(() => {
     data-slot="combobox-separator"
     v-bind="delegatedProps"
     :class="cn(
-  'combobox-separator',
-  props.una?.comboboxSeparator,
-  props.class
-)"
+      'combobox-separator',
+      props.una?.comboboxSeparator,
+      props.class,
+    )"
   >
     <slot />
   </ComboboxSeparator>

package/dist/runtime/components/combobox/ComboboxTrigger.vue

@@ -1,66 +1,43 @@
-<script setup>
-import { reactiveOmit } from "@vueuse/core";
-import { ComboboxTrigger, useForwardProps } from "reka-ui";
-import { computed } from "vue";
-import { cn, randomId } from "../../utils";
-import Button from "../elements/Button.vue";
-import Icon from "../elements/Icon.vue";
-const props = defineProps({
-  id: { type: String, required: false },
-  status: { type: String, required: false },
-  una: { type: Object, required: false },
-  disabled: { type: Boolean, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  type: { type: String, required: false },
-  loadingPlacement: { type: String, required: false },
-  icon: { type: Boolean, required: false },
-  reverse: { type: Boolean, required: false },
-  loading: { type: Boolean, required: false },
-  block: { type: Boolean, required: false },
-  to: { type: null, required: false },
-  label: { type: String, required: false },
-  btn: { type: String, required: false, default: "solid-white" },
-  leading: { type: String, required: false },
-  trailing: { type: String, required: false },
-  size: { type: String, required: false },
-  square: { type: null, required: false },
-  rounded: { type: null, required: false },
-  class: { type: null, required: false },
-  breadcrumbActive: { type: String, required: false },
-  breadcrumbInactive: { type: String, required: false },
-  paginationSelected: { type: String, required: false },
-  paginationUnselected: { type: String, required: false },
-  dropdownMenu: { type: String, required: false },
-  toggleOn: { type: String, required: false },
-  toggleOff: { type: String, required: false },
-  navigationMenu: { type: String, required: false },
-  navigationMenuLink: { type: String, required: false },
-  ariaLabel: { type: String, required: false }
-});
-const forwardedProps = useForwardProps(reactiveOmit(props, "class", "status", "una", "btn"));
+<script setup lang="ts">
+import type { NComboboxTriggerProps } from '../../types'
+import { reactiveOmit } from '@vueuse/core'
+import { ComboboxTrigger, useForwardProps } from 'reka-ui'
+import { computed } from 'vue'
+import { cn, randomId } from '../../utils'
+import Button from '../elements/Button.vue'
+import Icon from '../elements/Icon.vue'
+
+const props = withDefaults(defineProps<NComboboxTriggerProps>(), {
+  btn: 'solid-white',
+})
+
+const forwardedProps = useForwardProps(reactiveOmit(props, 'class', 'status', 'una', 'btn'))
+
 const statusClassVariants = computed(() => {
   const btn = {
-    info: "btn-outline-info",
-    success: "btn-outline-success",
-    warning: "btn-outline-warning",
-    error: "btn-outline-error",
-    default: void 0
-  };
+    info: 'btn-outline-info',
+    success: 'btn-outline-success',
+    warning: 'btn-outline-warning',
+    error: 'btn-outline-error',
+    default: undefined,
+  }
+
   const icon = {
-    info: props.una?.comboboxTriggerInfoIcon ?? "combobox-trigger-info-icon",
-    success: props.una?.comboboxTriggerSuccessIcon ?? "combobox-trigger-success-icon",
-    warning: props.una?.comboboxTriggerWarningIcon ?? "combobox-trigger-warning-icon",
-    error: props.una?.comboboxTriggerErrorIcon ?? "combobox-trigger-error-icon",
-    default: props?.trailing ?? "combobox-trigger-trailing-icon"
-  };
+    info: props.una?.comboboxTriggerInfoIcon ?? 'combobox-trigger-info-icon',
+    success: props.una?.comboboxTriggerSuccessIcon ?? 'combobox-trigger-success-icon',
+    warning: props.una?.comboboxTriggerWarningIcon ?? 'combobox-trigger-warning-icon',
+    error: props.una?.comboboxTriggerErrorIcon ?? 'combobox-trigger-error-icon',
+    default: props?.trailing ?? 'combobox-trigger-trailing-icon',
+  }
+
   return {
-    btn: btn[props.status ?? "default"],
-    icon: icon[props.status ?? "default"]
-  };
-});
-const id = computed(() => props.id ?? randomId("combobox-trigger"));
-const status = computed(() => props.status ?? "default");
+    btn: btn[props.status ?? 'default'],
+    icon: icon[props.status ?? 'default'],
+  }
+})
+
+const id = computed(() => props.id ?? randomId('combobox-trigger'))
+const status = computed(() => props.status ?? 'default')
 </script>
 
 <template>
@@ -71,25 +48,25 @@ const status = computed(() => props.status ?? "default");
     <slot name="wrapper">
       <Button
         :id
-        :btn="statusClassVariants.btn ? void 0 : props.btn"
+        :btn="statusClassVariants.btn ? undefined : props.btn"
         :data-status="status"
         data-slot="combobox-trigger"
         :class="cn(
-  'combobox-trigger',
-  props.class
-)"
+          'combobox-trigger',
+          props.class,
+        )"
         tabindex="0"
         :size
         :una="{
-  ...props.una,
-  btn: props.una?.comboboxTrigger,
-  btnLeading: cn(
-    'combobox-trigger-leading',
-    props.una?.btnLeading,
-    props.una?.comboboxTriggerLeading
-  ),
-  btnDefaultVariant: statusClassVariants.btn
-}"
+          ...props.una,
+          btn: props.una?.comboboxTrigger,
+          btnLeading: cn(
+            'combobox-trigger-leading',
+            props.una?.btnLeading,
+            props.una?.comboboxTriggerLeading,
+          ),
+          btnDefaultVariant: statusClassVariants.btn,
+        }"
       >
         <template v-for="(_, name) in $slots" #[name]="slotData">
           <slot :name="name" v-bind="slotData" />
@@ -100,9 +77,9 @@ const status = computed(() => props.status ?? "default");
             :data-status="status"
             :name="statusClassVariants.icon"
             :class="cn(
-  'combobox-trigger-trailing',
-  props.una?.btnTrailing
-)"
+              'combobox-trigger-trailing',
+              props.una?.btnTrailing,
+            )"
           />
         </template>
       </Button>

package/dist/runtime/components/combobox/ComboboxViewport.vue

@@ -1,20 +1,18 @@
-<script setup>
-import { ComboboxViewport, useForwardProps } from "reka-ui";
-import { computed } from "vue";
-import { cn } from "../../utils";
-const props = defineProps({
-  una: { type: Object, required: false },
-  nonce: { type: String, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false },
-  size: { type: null, required: false }
-});
+<script setup lang="ts">
+import type { NComboboxViewportProps } from '../../types'
+import { ComboboxViewport, useForwardProps } from 'reka-ui'
+import { computed } from 'vue'
+import { cn } from '../../utils'
+
+const props = defineProps<NComboboxViewportProps>()
+
 const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props;
-  return delegated;
-});
-const forwarded = useForwardProps(delegatedProps);
+  const { class: _, ...delegated } = props
+
+  return delegated
+})
+
+const forwarded = useForwardProps(delegatedProps)
 </script>
 
 <template>
@@ -22,10 +20,10 @@ const forwarded = useForwardProps(delegatedProps);
     data-slot="combobox-viewport"
     v-bind="forwarded"
     :class="cn(
-  'combobox-viewport',
-  props.una?.comboboxViewport,
-  props.class
-)"
+      'combobox-viewport',
+      props.una?.comboboxViewport,
+      props.class,
+    )"
   >
     <slot />
   </ComboboxViewport>