@una-ui/nuxt 0.61.0 → 1.0.0-alpha.2

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

@@ -1,4 +1,8 @@
+import type { HTMLAttributes } from 'vue';
+import type { NButtonProps } from './button.js';
 export interface NAlertProps {
+    size?: HTMLAttributes['class'];
+    class?: HTMLAttributes['class'];
     /**
      * Allows you to add `UnaUI` alert preset properties,
      * Think of it as a shortcut for adding options or variants to the preset if available.
@@ -7,7 +11,7 @@ export interface NAlertProps {
      * @example
      * alert="outline-pink"
      */
-    alert?: string;
+    alert?: HTMLAttributes['class'];
     /**
      * Add icon to the alert,
      * If this is true, the icon will be automatically generated based on the color.
@@ -33,23 +37,34 @@ export interface NAlertProps {
      * Add a description to the alert.
      */
     description?: string;
+    _alertTitle?: NAlertTitleProps;
+    _alertDescription?: NAlertDescriptionProps;
+    _alertClose?: NAlertCloseProps;
     /**
      * `UnaUI` preset configuration
      *
      * @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/alert.ts
      */
-    una?: {
-        alert?: string;
-        alertTitle?: string;
-        alertDescription?: string;
-        alertIconBase?: string;
-        alertClose?: string;
-        alertCloseIconBase?: string;
-        alertInnerWrapper?: string;
-        alertContentWrapper?: string;
-        alertIconWrapper?: string;
-        alertCloseWrapper?: string;
-        alertCloseInnerWrapper?: string;
-        alertCloseIcon?: string;
-    };
+    una?: NAlertUnaProps;
+}
+export interface NAlertTitleProps {
+    size?: HTMLAttributes['class'];
+    class?: HTMLAttributes['class'];
+    una?: Pick<NAlertUnaProps, 'alertTitle'>;
+}
+export interface NAlertDescriptionProps {
+    size?: HTMLAttributes['class'];
+    class?: HTMLAttributes['class'];
+    una?: Pick<NAlertUnaProps, 'alertDescription'>;
+}
+export interface NAlertCloseProps extends Omit<NButtonProps, 'una'> {
+    size?: HTMLAttributes['class'];
+    class?: HTMLAttributes['class'];
+    una?: Pick<NAlertUnaProps, 'alertCloseWrapper'> & NButtonProps['una'];
+}
+export interface NAlertUnaProps {
+    alert?: HTMLAttributes['class'];
+    alertTitle?: HTMLAttributes['class'];
+    alertDescription?: HTMLAttributes['class'];
+    alertCloseWrapper?: HTMLAttributes['class'];
 }

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

@@ -25,6 +25,7 @@ export interface NCardProps extends BaseExtensions {
     _cardDescription?: Partial<NCardDescriptionProps>;
     _cardHeader?: Partial<NCardHeaderProps>;
     _cardFooter?: Partial<NCardFooterProps>;
+    _cardAction?: Partial<NCardActionProps>;
     /**
      * `UnaUI` preset configuration
      *
@@ -47,6 +48,9 @@ export interface NCardHeaderProps extends BaseExtensions {
 export interface NCardFooterProps extends BaseExtensions {
     una?: Pick<NCardUnaProps, 'cardFooter'>;
 }
+export interface NCardActionProps extends BaseExtensions {
+    una?: Pick<NCardUnaProps, 'cardAction'>;
+}
 export interface NCardUnaProps {
     cardDefaultVariant?: HTMLAttributes['class'];
     cardTitle?: HTMLAttributes['class'];
@@ -54,5 +58,6 @@ export interface NCardUnaProps {
     cardContent?: HTMLAttributes['class'];
     cardHeader?: HTMLAttributes['class'];
     cardFooter?: HTMLAttributes['class'];
+    cardAction?: HTMLAttributes['class'];
 }
 export {};

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

@@ -1,7 +1,7 @@
-import type { DialogCloseProps, DialogContentProps, DialogDescriptionProps, DialogRootProps, DialogTitleProps } from 'reka-ui';
+import type { DialogCloseProps, DialogContentProps, DialogDescriptionProps, DialogRootProps, DialogTitleProps, DialogTriggerProps } from 'reka-ui';
 import type { HTMLAttributes } from 'vue';
 import type { NButtonProps } from './button.js';
-export interface NDialogProps extends DialogRootProps, Pick<NDialogContentProps, 'preventClose' | 'showClose' | 'overlay' | '_dialogClose' | '_dialogOverlay'> {
+export interface NDialogProps extends DialogRootProps, Pick<NDialogContentProps, 'dismissible' | 'showClose' | 'overlay' | '_dialogClose' | '_dialogOverlay'> {
     /**
      * The title of the dialog.
      */
@@ -11,7 +11,9 @@ export interface NDialogProps extends DialogRootProps, Pick<NDialogContentProps,
      */
     description?: string;
     /**
+     * If `true`, the dialog will have a scrollable body.
      *
+     * @default false
      */
     scrollable?: boolean;
     _dialogTitle?: NDialogTitleProps;
@@ -19,6 +21,7 @@ export interface NDialogProps extends DialogRootProps, Pick<NDialogContentProps,
     _dialogHeader?: NDialogHeaderProps;
     _dialogFooter?: NDialogFooterProps;
     _dialogContent?: NDialogContentProps;
+    _dialogTrigger?: NDialogTriggerProps;
     /**
      * `UnaUI` preset configuration
      *
@@ -39,7 +42,7 @@ export interface NDialogContentProps extends DialogContentProps, BaseExtensions
     /**
      * Prevent close.
      */
-    preventClose?: boolean;
+    dismissible?: boolean;
     /**
      * Show close button.
      *
@@ -78,6 +81,8 @@ export interface NDialogFooterProps extends BaseExtensions {
 }
 export interface NDialogCloseProps extends DialogCloseProps, NButtonProps {
 }
+export interface NDialogTriggerProps extends DialogTriggerProps {
+}
 export interface NDialogUnaProps {
     dialogTitle?: HTMLAttributes['class'];
     dialogDescription?: HTMLAttributes['class'];

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

@@ -63,10 +63,18 @@ export interface ColorPalette {
 export interface UnaSettings {
     primaryColors: Colors;
     grayColors: Colors;
-    primary: string;
-    gray: string;
+    theme: string | false;
+    primary: string | false;
+    gray: string | false;
     fontSize: number;
     radius: number;
+    themes: {
+        name: string;
+        cssVars: {
+            light: Colors;
+            dark: Colors;
+        };
+    }[];
 }
 export type OutsideEvent<T extends Event> = CustomEvent<{
     originalEvent: T;

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

@@ -1,7 +1,7 @@
 import type { DialogCloseProps, DialogContentProps, DialogDescriptionProps, DialogOverlayProps, DialogPortalProps, DialogRootProps, DialogTitleProps, DialogTriggerProps } from 'reka-ui';
 import type { HTMLAttributes } from 'vue';
 import type { NButtonProps } from './button.js';
-export interface NSheetProps extends DialogRootProps, Pick<NSheetContentProps, 'sheet' | 'preventClose' | 'showClose' | 'overlay'> {
+export interface NSheetProps extends DialogRootProps, Pick<NSheetContentProps, 'sheet' | 'dismissible' | 'showClose' | 'overlay'> {
     /**
      * The title of the sheet.
      */
@@ -47,7 +47,7 @@ export interface NSheetContentProps extends DialogContentProps {
     /**
      * Prevent close.
      */
-    preventClose?: boolean;
+    dismissible?: boolean;
     /**
      * Show close button.
      *

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@una-ui/nuxt",
   "type": "module",
-  "version": "0.61.0",
+  "version": "1.0.0-alpha.2",
   "description": "Nuxt module for @una-ui",
   "author": "Phojie Rengel <phojrengel@gmail.com>",
   "license": "MIT",
@@ -41,10 +41,10 @@
     "@nuxt/kit": "^3.17.5",
     "@nuxtjs/color-mode": "^3.5.2",
     "@tanstack/vue-table": "^8.21.3",
-    "@unocss/core": "^66.0.0",
-    "@unocss/nuxt": "^66.0.0",
-    "@unocss/preset-attributify": "^66.0.0",
-    "@unocss/preset-icons": "^66.0.0",
+    "@unocss/core": "^66.2.0",
+    "@unocss/nuxt": "^66.2.0",
+    "@unocss/preset-attributify": "^66.2.0",
+    "@unocss/preset-icons": "^66.2.0",
     "@vee-validate/nuxt": "^4.15.1",
     "@vee-validate/zod": "^4.15.1",
     "@vueuse/core": "^12.8.2",
@@ -55,11 +55,11 @@
     "ohash": "^1.1.6",
     "reka-ui": "^2.3.1",
     "tailwind-merge": "^3.3.1",
-    "unocss": "^66.0.0",
+    "unocss": "^66.2.0",
     "unocss-preset-animations": "^1.2.1",
     "vaul-vue": "^0.4.1",
-    "@una-ui/preset": "^0.61.0",
-    "@una-ui/extractor-vue-script": "^0.61.0"
+    "@una-ui/extractor-vue-script": "^1.0.0-alpha.2",
+    "@una-ui/preset": "^1.0.0-alpha.2"
   },
   "devDependencies": {
     "@iconify-json/lucide": "^1.2.51",
@@ -77,7 +77,7 @@
     "build": "nuxt-build-module build",
     "stub": "nuxt-build-module build --stub && pnpm nuxt-module-build prepare",
     "dev": "nuxi dev playground",
-    "playground:build": "nuxi generate playground",
+    "playground:build": "nuxi build playground",
     "playground:preview": "nuxi preview playground"
   }
 }

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

@@ -1,127 +0,0 @@
-<script setup>
-import { computed } from "vue";
-import NButton from "../elements/Button.vue";
-import NIcon from "../elements/Icon.vue";
-defineOptions({
-  inheritAttrs: false
-});
-const props = defineProps({
-  alert: { type: String, required: false },
-  icon: { type: [String, Boolean], required: false, default: false },
-  closable: { type: Boolean, required: false },
-  title: { type: String, required: false },
-  description: { type: String, required: false },
-  una: { type: Object, required: false }
-});
-const emit = defineEmits(["close"]);
-const slots = defineSlots();
-const alertVariants = ["soft", "outline", "border"];
-const hasVariant = computed(() => alertVariants.some((alertVariants2) => props.alert?.includes(alertVariants2)));
-const isBaseVariant = computed(() => props.alert?.includes("~"));
-const alertClassVariants = computed(() => {
-  const icon2 = {
-    info: "alert-info-icon",
-    success: "alert-success-icon",
-    warning: "alert-warning-icon",
-    error: "alert-error-icon",
-    default: ""
-  };
-  const alertType = props.alert ? props.alert.includes("info") ? "info" : props.alert.includes("success") ? "success" : props.alert.includes("warning") ? "warning" : props.alert.includes("error") ? "error" : "default" : "default";
-  return {
-    icon: icon2[alertType]
-  };
-});
-const icon = computed(() => {
-  if (props.icon === "" || props.icon === void 0 || props.icon === true)
-    return alertClassVariants.value.icon;
-  return props.icon.toString();
-});
-</script>
-
-<template>
-  <div
-    v-bind="$attrs"
-    :alert="alert"
-    class="alert"
-    :class="[
-  { 'alert-default-variant': !hasVariant && !isBaseVariant },
-  una?.alert
-]"
-  >
-    <div
-      alert="inner-wrapper"
-      :class="una?.alertInnerWrapper"
-    >
-      <div
-        v-if="props.icon !== false"
-        alert="icon-wrapper"
-        :class="una?.alertIconWrapper"
-      >
-        <slot name="icon">
-          <NIcon
-            alert="icon-base"
-            :name="icon"
-            aria-hidden="true"
-          />
-        </slot>
-      </div>
-
-      <slot>
-        <div
-          alert="content-wrapper"
-          :class="una?.alertContentWrapper"
-        >
-          <div
-            v-if="slots.title || title"
-            alert="title"
-            :class="una?.alertTitle"
-          >
-            <slot name="title">
-              <div>
-                {{ title }}
-              </div>
-            </slot>
-          </div>
-          <div
-            v-if="slots.description || description"
-            alert="description"
-            :class="una?.alertDescription"
-          >
-            <slot name="description">
-              <p>
-                {{ description }}
-              </p>
-            </slot>
-          </div>
-        </div>
-      </slot>
-
-      <div
-        v-if="slots.closeIcon || closable"
-        alert="close-wrapper"
-        :class="una?.alertCloseWrapper"
-      >
-        <div
-          alert="close-inner-wrapper"
-          :class="una?.alertCloseInnerWrapper"
-        >
-          <NButton
-            alert="close"
-            :class="una?.alertClose"
-            btn="~"
-            square
-            @click="emit('close')"
-          >
-            <slot name="closeIcon">
-              <NIcon
-                :class="`${una?.alertCloseIconBase} alert-close-icon-base`"
-                :name="una?.alertCloseIcon ?? 'alert-close-icon'"
-                aria-hidden="true"
-              />
-            </slot>
-          </NButton>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>

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

@@ -1,22 +0,0 @@
-import type { NAlertProps } from '../../types/index.js';
-type __VLS_Slots = {
-    default?: any;
-    title?: any;
-    description?: any;
-    icon?: any;
-    closeIcon?: any;
-};
-declare const __VLS_component: import("vue").DefineComponent<NAlertProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    close: (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<NAlertProps> & Readonly<{
-    onClose?: ((...args: any[]) => any) | undefined;
-}>, {
-    icon: string | boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};