@nuxt/ui 3.0.0-alpha.1 → 3.0.0-alpha.10

package/dist/runtime/components/Textarea.vue

@@ -11,6 +11,11 @@ const textarea = tv({ extend: tv(theme), ...(appConfig.ui?.textarea || {}) })
 type TextareaVariants = VariantProps<typeof textarea>
 
 export interface TextareaProps {
+  /**
+   * The element or component this component should render as.
+   * @defaultValue 'div'
+   */
+  as?: any
   id?: string
   name?: string
   /** The placeholder text when the textarea is empty. */
@@ -44,6 +49,7 @@ export interface TextareaSlots {
 
 <script setup lang="ts">
 import { ref, computed, onMounted, nextTick, watch } from 'vue'
+import { Primitive } from 'reka-ui'
 import { useFormField } from '../composables/useFormField'
 import { looseToNumber } from '../utils'
 
@@ -151,7 +157,7 @@ function autoResize() {
   }
 }
 
-watch(() => modelValue, () => {
+watch(modelValue, () => {
   nextTick(autoResize)
 })
 
@@ -167,7 +173,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <div :class="ui.root({ class: [props.class, props.ui?.root] })">
+  <Primitive :as="as" :class="ui.root({ class: [props.class, props.ui?.root] })">
     <textarea
       :id="id"
       ref="textareaRef"
@@ -185,5 +191,5 @@ onMounted(() => {
     />
 
     <slot />
-  </div>
+  </Primitive>
 </template>

package/dist/runtime/components/Toast.vue

@@ -1,9 +1,10 @@
 <script lang="ts">
 import { tv, type VariantProps } from 'tailwind-variants'
-import type { ToastRootProps, ToastRootEmits } from 'radix-vue'
+import type { ToastRootProps, ToastRootEmits } from 'reka-ui'
 import type { AppConfig } from '@nuxt/schema'
 import _appConfig from '#build/app.config'
 import theme from '#build/ui/toast'
+import { extendDevtoolsMeta } from '../composables/extendDevtoolsMeta'
 import type { AvatarProps, ButtonProps } from '../types'
 
 const appConfig = _appConfig as AppConfig & { ui: { toast: Partial<typeof theme> } }
@@ -27,11 +28,12 @@ export interface ToastProps extends Pick<ToastRootProps, 'defaultOpen' | 'open'
    * Display a list of actions:
    * - under the title and description if multiline
    * - next to the close button if not multiline
+   * `{ size: 'xs' }`{lang="ts-type"}
    */
   actions?: ButtonProps[]
   /**
    * Display a close button to dismiss the toast.
-   * `{ size: 'md', color: 'gray', variant: 'link' }`{lang="ts-type"}
+   * `{ size: 'md', color: 'neutral', variant: 'link' }`{lang="ts-type"}
    * @defaultValue true
    */
   close?: ButtonProps | boolean
@@ -53,15 +55,19 @@ export interface ToastSlots {
   actions(props?: {}): any
   close(props: { ui: any }): any
 }
+
+extendDevtoolsMeta<ToastProps>({ ignore: true })
 </script>
 
 <script setup lang="ts">
 import { ref, computed, onMounted } from 'vue'
-import { ToastRoot, ToastTitle, ToastDescription, ToastAction, ToastClose, useForwardPropsEmits } from 'radix-vue'
+import { ToastRoot, ToastTitle, ToastDescription, ToastAction, ToastClose, useForwardPropsEmits } from 'reka-ui'
 import { reactivePick } from '@vueuse/core'
 import { useAppConfig } from '#imports'
+import { useLocale } from '../composables/useLocale'
 import UIcon from './Icon.vue'
 import UAvatar from './Avatar.vue'
+import UButton from './Button.vue'
 
 const props = withDefaults(defineProps<ToastProps>(), {
   close: true
@@ -69,7 +75,9 @@ const props = withDefaults(defineProps<ToastProps>(), {
 const emits = defineEmits<ToastEmits>()
 const slots = defineSlots<ToastSlots>()
 
+const { t } = useLocale()
 const appConfig = useAppConfig()
+
 const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'defaultOpen', 'open', 'duration', 'type'), emits)
 
 const multiline = computed(() => !!props.title && !!props.description)
@@ -145,9 +153,9 @@ defineExpose({
             v-if="close"
             :icon="closeIcon || appConfig.ui.icons.close"
             size="md"
-            color="gray"
+            color="neutral"
             variant="link"
-            aria-label="Close"
+            :aria-label="t('toast.close')"
             v-bind="typeof close === 'object' ? close : undefined"
             :class="ui.close({ class: props.ui?.close })"
             @click.stop

package/dist/runtime/components/Toaster.vue

@@ -1,9 +1,10 @@
 <script lang="ts">
 import { tv, type VariantProps } from 'tailwind-variants'
-import type { ToastProviderProps } from 'radix-vue'
+import type { ToastProviderProps } from 'reka-ui'
 import type { AppConfig } from '@nuxt/schema'
 import _appConfig from '#build/app.config'
 import theme from '#build/ui/toaster'
+import { extendDevtoolsMeta } from '../composables/extendDevtoolsMeta'
 
 const appConfig = _appConfig as AppConfig & { ui: { toaster: Partial<typeof theme> } }
 
@@ -18,6 +19,11 @@ export interface ToasterProps extends Omit<ToastProviderProps, 'swipeDirection'>
    * @defaultValue true
    */
   expand?: boolean
+  /**
+   * Render the toaster in a portal.
+   * @defaultValue true
+   */
+  portal?: boolean
   class?: any
   ui?: Partial<typeof toaster.slots>
 }
@@ -25,18 +31,25 @@ export interface ToasterProps extends Omit<ToastProviderProps, 'swipeDirection'>
 export interface ToasterSlots {
   default(props?: {}): any
 }
+
+export default {
+  name: 'Toaster'
+}
+
+extendDevtoolsMeta({ example: 'ToasterExample' })
 </script>
 
 <script setup lang="ts">
 import { ref, computed } from 'vue'
-import { ToastProvider, ToastViewport, useForwardProps } from 'radix-vue'
+import { ToastProvider, ToastViewport, ToastPortal, useForwardProps } from 'reka-ui'
 import { reactivePick } from '@vueuse/core'
 import { useToast } from '../composables/useToast'
-import UToast from './Toast.vue'
 import { omit } from '../utils'
+import UToast from './Toast.vue'
 
 const props = withDefaults(defineProps<ToasterProps>(), {
   expand: true,
+  portal: true,
   duration: 5000
 })
 defineSlots<ToasterSlots>()
@@ -113,18 +126,20 @@ function getOffset(index: number) {
       @click="toast.click && toast.click(toast)"
     />
 
-    <ToastViewport
-      :data-expanded="expanded"
-      :class="ui.viewport({ class: props.class })"
-      :style="{
-        '--scale-factor': '0.05',
-        '--translate-factor': position?.startsWith('top') ? '1px' : '-1px',
-        '--gap': position?.startsWith('top') ? '16px' : '-16px',
-        '--front-height': `${frontHeight}px`,
-        '--height': `${height}px`
-      }"
-      @mouseenter="hovered = true"
-      @mouseleave="hovered = false"
-    />
+    <ToastPortal :disabled="!portal">
+      <ToastViewport
+        :data-expanded="expanded"
+        :class="ui.viewport({ class: [props.class, props.ui?.viewport] })"
+        :style="{
+          '--scale-factor': '0.05',
+          '--translate-factor': position?.startsWith('top') ? '1px' : '-1px',
+          '--gap': position?.startsWith('top') ? '16px' : '-16px',
+          '--front-height': `${frontHeight}px`,
+          '--height': `${height}px`
+        }"
+        @mouseenter="hovered = true"
+        @mouseleave="hovered = false"
+      />
+    </ToastPortal>
   </ToastProvider>
 </template>

package/dist/runtime/components/Tooltip.vue

@@ -1,9 +1,10 @@
 <script lang="ts">
 import { tv } from 'tailwind-variants'
-import type { TooltipRootProps, TooltipRootEmits, TooltipContentProps, TooltipArrowProps } from 'radix-vue'
+import type { TooltipRootProps, TooltipRootEmits, TooltipContentProps, TooltipArrowProps } from 'reka-ui'
 import type { AppConfig } from '@nuxt/schema'
 import _appConfig from '#build/app.config'
 import theme from '#build/ui/tooltip'
+import { extendDevtoolsMeta } from '../composables/extendDevtoolsMeta'
 import type { KbdProps } from '../types'
 
 const appConfig = _appConfig as AppConfig & { ui: { tooltip: Partial<typeof theme> } }
@@ -17,7 +18,7 @@ export interface TooltipProps extends TooltipRootProps {
   kbds?: KbdProps['value'][] | KbdProps[]
   /**
    * The content of the tooltip.
-   * @defaultValue { side: 'bottom', sideOffset: 8 }
+   * @defaultValue { side: 'bottom', sideOffset: 8, collisionPadding: 8 }
    */
   content?: Omit<TooltipContentProps, 'as' | 'asChild'>
   /**
@@ -40,12 +41,14 @@ export interface TooltipSlots {
   default(props: { open: boolean }): any
   content(props?: {}): any
 }
+
+extendDevtoolsMeta({ example: 'TooltipExample', defaultProps: { text: 'Hello world!' } })
 </script>
 
 <script setup lang="ts">
 import { computed, toRef } from 'vue'
 import { defu } from 'defu'
-import { TooltipRoot, TooltipTrigger, TooltipPortal, TooltipContent, TooltipArrow, useForwardPropsEmits } from 'radix-vue'
+import { TooltipRoot, TooltipTrigger, TooltipPortal, TooltipContent, TooltipArrow, useForwardPropsEmits } from 'reka-ui'
 import { reactivePick } from '@vueuse/core'
 import UKbd from './Kbd.vue'
 
@@ -56,7 +59,7 @@ const emits = defineEmits<TooltipEmits>()
 const slots = defineSlots<TooltipSlots>()
 
 const rootProps = useForwardPropsEmits(reactivePick(props, 'defaultOpen', 'open', 'delayDuration', 'disableHoverableContent', 'disableClosingTrigger', 'disabled', 'ignoreNonKeyboardFocus'), emits)
-const contentProps = toRef(() => defu(props.content, { side: 'bottom', sideOffset: 8 }) as TooltipContentProps)
+const contentProps = toRef(() => defu(props.content, { side: 'bottom', sideOffset: 8, collisionPadding: 8 }) as TooltipContentProps)
 const arrowProps = toRef(() => props.arrow as TooltipArrowProps)
 
 // eslint-disable-next-line vue/no-dupe-keys
@@ -67,12 +70,12 @@ const ui = computed(() => tooltip({
 
 <template>
   <TooltipRoot v-slot="{ open }" v-bind="rootProps">
-    <TooltipTrigger v-if="!!slots.default" as-child>
+    <TooltipTrigger v-if="!!slots.default" as-child :class="props.class">
       <slot :open="open" />
     </TooltipTrigger>
 
     <TooltipPortal :disabled="!portal">
-      <TooltipContent v-bind="contentProps" :class="ui.content({ class: [props.class, props.ui?.content] })">
+      <TooltipContent v-bind="contentProps" :class="ui.content({ class: [!slots.default && props.class, props.ui?.content] })">
         <slot name="content">
           <span v-if="text" :class="ui.text({ class: props.ui?.text })">{{ text }}</span>
 

package/dist/runtime/composables/defineLocale.d.ts

@@ -0,0 +1,9 @@
+import type { Locale, Direction, Messages } from '../types/locale';
+interface DefineLocaleOptions {
+    name: string;
+    code: string;
+    dir?: Direction;
+    messages: Messages;
+}
+export declare function defineLocale(options: DefineLocaleOptions): Locale;
+export {};

package/dist/runtime/composables/defineLocale.js

@@ -0,0 +1,4 @@
+import { defu } from "defu";
+export function defineLocale(options) {
+  return defu(options, { dir: "ltr" });
+}

package/dist/runtime/composables/defineShortcuts.d.ts

@@ -11,5 +11,5 @@ export interface ShortcutsOptions {
     chainDelay?: number;
 }
 export declare function extractShortcuts(items: any[] | any[][]): Record<string, Handler>;
-export declare function defineShortcuts(config: MaybeRef<ShortcutsConfig>, options?: ShortcutsOptions): void;
+export declare function defineShortcuts(config: MaybeRef<ShortcutsConfig>, options?: ShortcutsOptions): import("@vueuse/core").Fn;
 export {};

package/dist/runtime/composables/defineShortcuts.js

@@ -1,6 +1,5 @@
 import { ref, computed, toValue } from "vue";
 import { useEventListener, useActiveElement, useDebounceFn } from "@vueuse/core";
-import { useKbd } from "../composables/useKbd.js";
 const chainedShortcutRegex = /^[^-]+.*-.*[^-]+$/;
 const combinedShortcutRegex = /^[^_]+.*_.*[^_]+$/;
 export function extractShortcuts(items) {
@@ -9,7 +8,7 @@ export function extractShortcuts(items) {
     items2.forEach((item) => {
       if (item.kbds?.length && (item.select || item.click)) {
         const shortcutKey = item.kbds.join("_");
-        shortcuts[shortcutKey] = item.select || item.click;
+        shortcuts[shortcutKey] = item.onSelect || item.onClick;
       }
       if (item.children) {
         traverse(item.children.flat());
@@ -28,7 +27,6 @@ export function defineShortcuts(config, options = {}) {
     chainedInputs.value.splice(0, chainedInputs.value.length);
   };
   const debouncedClearChainedInput = useDebounceFn(clearChainedInput, options.chainDelay ?? 800);
-  const { macOS } = useKbd();
   const activeElement = useActiveElement();
   const onKeyDown = (e) => {
     if (!e.key) {
@@ -114,10 +112,6 @@ export function defineShortcuts(config, options = {}) {
         };
       }
       shortcut.chained = chained;
-      if (!macOS.value && shortcut.metaKey && !shortcut.ctrlKey) {
-        shortcut.metaKey = false;
-        shortcut.ctrlKey = true;
-      }
       if (typeof shortcutConfig === "function") {
         shortcut.handler = shortcutConfig;
       } else if (typeof shortcutConfig === "object") {
@@ -137,5 +131,5 @@ export function defineShortcuts(config, options = {}) {
       return shortcut;
     }).filter(Boolean);
   });
-  useEventListener("keydown", onKeyDown);
+  return useEventListener("keydown", onKeyDown);
 }

package/dist/runtime/composables/extendDevtoolsMeta.d.ts

@@ -0,0 +1,7 @@
+export type DevtoolsMeta<T> = {
+    defaultProps?: T;
+    example?: string;
+    ignore?: boolean;
+    ignoreProps?: string[];
+};
+export declare function extendDevtoolsMeta<T>(_meta: DevtoolsMeta<T>): void;

package/dist/runtime/composables/extendDevtoolsMeta.js

@@ -0,0 +1,2 @@
+export function extendDevtoolsMeta(_meta) {
+}

package/dist/runtime/composables/useAvatarGroup.d.ts

@@ -1,5 +1,5 @@
 import { type ComputedRef, type InjectionKey } from 'vue';
-import type { AvatarGroupProps } from '../types/index.js';
+import type { AvatarGroupProps } from '../types';
 export declare const avatarGroupInjectionKey: InjectionKey<ComputedRef<{
     size: AvatarGroupProps['size'];
 }>>;

package/dist/runtime/composables/useButtonGroup.d.ts

@@ -1,6 +1,6 @@
 import type { InjectionKey, ComputedRef } from 'vue';
-import type { ButtonGroupProps } from '../components/ButtonGroup.vue.js';
-import type { GetObjectField } from '../types/utils.js';
+import type { ButtonGroupProps } from '../components/ButtonGroup.vue';
+import type { GetObjectField } from '../types/utils';
 export declare const buttonGroupInjectionKey: InjectionKey<ComputedRef<{
     size: ButtonGroupProps['size'];
     orientation: ButtonGroupProps['orientation'];

package/dist/runtime/composables/useComponentIcons.d.ts

@@ -1,7 +1,10 @@
 import { type MaybeRefOrGetter } from 'vue';
+import type { AvatarProps } from '../types';
 export interface UseComponentIconsProps {
     /** Display an icon based on the `leading` and `trailing` props. */
     icon?: string;
+    /** Display an avatar on the left side. */
+    avatar?: AvatarProps;
     /** When `true`, the icon will be displayed on the left side. */
     leading?: boolean;
     /** Display an icon on the left side. */

package/dist/runtime/composables/useFormField.d.ts

@@ -1,8 +1,8 @@
 import { type InjectionKey, type Ref, type ComputedRef } from 'vue';
 import { type UseEventBusReturn } from '@vueuse/core';
-import type { FormFieldProps } from '../types/index.js';
-import type { FormEvent, FormFieldInjectedOptions, FormInjectedOptions } from '../types/form.js';
-import type { GetObjectField } from '../types/utils.js';
+import type { FormFieldProps } from '../types';
+import type { FormEvent, FormFieldInjectedOptions, FormInjectedOptions } from '../types/form';
+import type { GetObjectField } from '../types/utils';
 type Props<T> = {
     id?: string;
     name?: string;
@@ -17,7 +17,11 @@ export declare const formOptionsInjectionKey: InjectionKey<ComputedRef<FormInjec
 export declare const formBusInjectionKey: InjectionKey<UseEventBusReturn<FormEvent, string>>;
 export declare const formFieldInjectionKey: InjectionKey<ComputedRef<FormFieldInjectedOptions<FormFieldProps>>>;
 export declare const inputIdInjectionKey: InjectionKey<Ref<string | undefined>>;
-export declare const formInputsInjectionKey: InjectionKey<Ref<Record<string, string>>>;
+export declare const formInputsInjectionKey: InjectionKey<Ref<Record<string, {
+    id?: string;
+    pattern?: RegExp;
+}>>>;
+export declare const formLoadingInjectionKey: InjectionKey<Readonly<Ref<boolean>>>;
 export declare function useFormField<T>(props?: Props<T>, opts?: {
     bind?: boolean;
 }): {

package/dist/runtime/composables/useFormField.js

@@ -5,6 +5,7 @@ export const formBusInjectionKey = Symbol("nuxt-ui.form-events");
 export const formFieldInjectionKey = Symbol("nuxt-ui.form-field");
 export const inputIdInjectionKey = Symbol("nuxt-ui.input-id");
 export const formInputsInjectionKey = Symbol("nuxt-ui.form-inputs");
+export const formLoadingInjectionKey = Symbol("nuxt-ui.form-loading");
 export function useFormField(props, opts) {
   const formOptions = inject(formOptionsInjectionKey, void 0);
   const formBus = inject(formBusInjectionKey, void 0);
@@ -18,7 +19,7 @@ export function useFormField(props, opts) {
       inputId.value = props?.id;
     }
     if (formInputs && formField.value.name && inputId.value) {
-      formInputs.value[formField.value.name] = inputId.value;
+      formInputs.value[formField.value.name] = { id: inputId.value, pattern: formField.value.errorPattern };
     }
   }
   const blurred = ref(false);

package/dist/runtime/composables/useKbd.d.ts

@@ -1,10 +1,16 @@
+type KbdKeysSpecificMap = {
+    meta: string;
+    alt: string;
+    ctrl: string;
+};
 export declare const kbdKeysMap: {
     meta: string;
+    ctrl: string;
+    alt: string;
+    win: string;
     command: string;
     shift: string;
-    ctrl: string;
     option: string;
-    alt: string;
     enter: string;
     delete: string;
     backspace: string;
@@ -21,8 +27,9 @@ export declare const kbdKeysMap: {
     end: string;
 };
 export type KbdKey = keyof typeof kbdKeysMap;
+export type KbdKeySpecific = keyof KbdKeysSpecificMap;
 export declare const useKbd: () => {
     macOS: import("vue").ComputedRef<false | "" | RegExpMatchArray | null | undefined>;
-    metaSymbol: import("vue").Ref<string, string>;
     getKbdKey: (value?: KbdKey | string) => string | undefined;
 };
+export {};

package/dist/runtime/composables/useKbd.js

@@ -1,12 +1,13 @@
+import { reactive, computed, onMounted } from "vue";
 import { createSharedComposable } from "@vueuse/core";
-import { ref, computed, onMounted } from "vue";
 export const kbdKeysMap = {
   meta: "",
+  ctrl: "",
+  alt: "",
+  win: "\u229E",
   command: "\u2318",
   shift: "\u21E7",
-  ctrl: "\u2303",
   option: "\u2325",
-  alt: "\u2387",
   enter: "\u21B5",
   delete: "\u2326",
   backspace: "\u232B",
@@ -24,22 +25,27 @@ export const kbdKeysMap = {
 };
 const _useKbd = () => {
   const macOS = computed(() => import.meta.client && navigator && navigator.userAgent && navigator.userAgent.match(/Macintosh;/));
-  const metaSymbol = ref(" ");
+  const kbdKeysSpecificMap = reactive({
+    meta: " ",
+    alt: " ",
+    ctrl: " "
+  });
   onMounted(() => {
-    metaSymbol.value = macOS.value ? kbdKeysMap.command : kbdKeysMap.ctrl;
+    kbdKeysSpecificMap.meta = macOS.value ? kbdKeysMap.command : kbdKeysMap.win;
+    kbdKeysSpecificMap.alt = macOS.value ? kbdKeysMap.option : "alt";
+    kbdKeysSpecificMap.ctrl = macOS.value ? "\u2303" : "ctrl";
   });
   function getKbdKey(value) {
     if (!value) {
       return;
     }
-    if (value === "meta") {
-      return metaSymbol.value;
+    if (["meta", "alt", "ctrl"].includes(value)) {
+      return kbdKeysSpecificMap[value];
     }
     return kbdKeysMap[value] || value.toUpperCase();
   }
   return {
     macOS,
-    metaSymbol,
     getKbdKey
   };
 };

package/dist/runtime/composables/useLocale.d.ts

@@ -0,0 +1,4 @@
+import type { InjectionKey, Ref } from 'vue';
+import type { Locale } from '../types/locale';
+export declare const localeContextInjectionKey: InjectionKey<Ref<Locale | undefined>>;
+export declare const useLocale: (localeOverrides?: Ref<Locale | undefined>) => import("../utils/locale").LocaleContext;

package/dist/runtime/composables/useLocale.js

@@ -0,0 +1,10 @@
+import { computed, inject, ref } from "vue";
+import { buildLocaleContext } from "../utils/locale.js";
+import en from "../locale/en.js";
+import { createSharedComposable } from "@vueuse/core";
+export const localeContextInjectionKey = Symbol("nuxt-ui.locale-context");
+const _useLocale = (localeOverrides) => {
+  const locale = localeOverrides || inject(localeContextInjectionKey, ref());
+  return buildLocaleContext(computed(() => locale.value || en));
+};
+export const useLocale = createSharedComposable(_useLocale);

package/dist/runtime/composables/useModal.d.ts

@@ -1,6 +1,6 @@
 import type { ShallowRef, Component, InjectionKey } from 'vue';
-import type { ModalProps } from '../types/index.js';
-import type { ComponentProps } from '../types/component.js';
+import type { ComponentProps } from 'vue-component-type-helpers';
+import type { ModalProps } from '../types';
 export interface ModalState {
     component: Component | string;
     props: ModalProps;

package/dist/runtime/composables/useSlideover.d.ts

@@ -1,6 +1,6 @@
 import type { ShallowRef, Component, InjectionKey } from 'vue';
-import type { SlideoverProps } from '../types/index.js';
-import type { ComponentProps } from '../types/component.js';
+import type { ComponentProps } from 'vue-component-type-helpers';
+import type { SlideoverProps } from '../types';
 export interface SlideoverState {
     component: Component | string;
     props: SlideoverProps;

package/dist/runtime/composables/useToast.d.ts

@@ -1,4 +1,4 @@
-import type { ToastProps } from '../types/index.js';
+import type { ToastProps } from '../types';
 export interface Toast extends Omit<ToastProps, 'defaultOpen'> {
     id: string | number;
     click?: (toast: Toast) => void;
@@ -6,7 +6,7 @@ export interface Toast extends Omit<ToastProps, 'defaultOpen'> {
 export declare function useToast(): {
     toasts: import("vue").Ref<Toast[], Toast[]>;
     add: (toast: Partial<Toast>) => Toast;
-    update: (id: string | number, toast: Partial<Toast>) => void;
+    update: (id: string | number, toast: Omit<Partial<Toast>, "id">) => void;
     remove: (id: string | number) => void;
     clear: () => void;
 };

package/dist/runtime/index.css

@@ -1 +1 @@
-@theme{--color-gray-*:initial;--color-cool-50:#f9fafb;--color-cool-100:#f3f4f6;--color-cool-200:#e5e7eb;--color-cool-300:#d1d5db;--color-cool-400:#9ca3af;--color-cool-500:#6b7280;--color-cool-600:#4b5563;--color-cool-700:#374151;--color-cool-800:#1f2937;--color-cool-900:#111827;--color-cool-950:#030712;--spacing-4_5:1.125rem;--color-primary-50:var(--color-primary-50);--color-primary-100:var(--color-primary-100);--color-primary-200:var(--color-primary-200);--color-primary-300:var(--color-primary-300);--color-primary-400:var(--color-primary-400);--color-primary-500:var(--color-primary-500);--color-primary-600:var(--color-primary-600);--color-primary-700:var(--color-primary-700);--color-primary-800:var(--color-primary-800);--color-primary-900:var(--color-primary-900);--color-primary-950:var(--color-primary-950);--color-error-50:var(--color-error-50);--color-error-100:var(--color-error-100);--color-error-200:var(--color-error-200);--color-error-300:var(--color-error-300);--color-error-400:var(--color-error-400);--color-error-500:var(--color-error-500);--color-error-600:var(--color-error-600);--color-error-700:var(--color-error-700);--color-error-800:var(--color-error-800);--color-error-900:var(--color-error-900);--color-error-950:var(--color-error-950);--color-gray-50:var(--color-gray-50);--color-gray-100:var(--color-gray-100);--color-gray-200:var(--color-gray-200);--color-gray-300:var(--color-gray-300);--color-gray-400:var(--color-gray-400);--color-gray-500:var(--color-gray-500);--color-gray-600:var(--color-gray-600);--color-gray-700:var(--color-gray-700);--color-gray-800:var(--color-gray-800);--color-gray-900:var(--color-gray-900);--color-gray-950:var(--color-gray-950)}@layer base{:root{color-scheme:light dark}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}@keyframes collapsible-up{0%{height:var(--radix-collapsible-content-height)}to{height:0}}@keyframes collapsible-down{0%{height:0}to{height:var(--radix-collapsible-content-height)}}@keyframes toast-collapsed-closed{0%{transform:var(--transform)}to{transform:translateY(calc((var(--before) - var(--height))*var(--gap))) scale(var(--scale))}}@keyframes toast-closed{0%{transform:var(--transform)}to{transform:translateY(calc((var(--offset) - var(--height))*var(--translate-factor)))}}@keyframes toast-slide-left{0%{transform:translateX(0) translateY(var(--translate))}to{transform:translateX(-100%) translateY(var(--translate))}}@keyframes toast-slide-right{0%{transform:translateX(0) translateY(var(--translate))}to{transform:translateX(100%) translateY(var(--translate))}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes slide-in-from-top{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes slide-out-to-top{0%{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes slide-in-from-right{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes slide-out-to-right{0%{transform:translateX(0)}to{transform:translateX(100%)}}@keyframes slide-in-from-bottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slide-out-to-bottom{0%{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes slide-in-from-left{0%{transform:translateX(-100%)}to{transform:translateX(0)}}@keyframes slide-out-to-left{0%{transform:translateX(0)}to{transform:translateX(-100%)}}@keyframes slide-in-from-top-and-fade{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-out-to-top-and-fade{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-4px)}}@keyframes slide-in-from-right-and-fade{0%{opacity:0;transform:translateX(4px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out-to-right-and-fade{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(4px)}}@keyframes slide-in-from-bottom-and-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-out-to-bottom-and-fade{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(4px)}}@keyframes slide-in-from-left-and-fade{0%{opacity:0;transform:translateX(-4px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out-to-left-and-fade{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-4px)}}@keyframes enter-from-right{0%{opacity:0;transform:translateX(200px)}to{opacity:1;transform:translateX(0)}}@keyframes enter-from-left{0%{opacity:0;transform:translateX(-200px)}to{opacity:1;transform:translateX(0)}}@keyframes exit-to-right{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(200px)}}@keyframes exit-to-left{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-200px)}}@keyframes carousel{0%,to{width:50%}0%{transform:translateX(-100%)}to{transform:translateX(200%)}}@keyframes carousel-vertical{0%,to{height:50%}0%{transform:translateY(-100%)}to{transform:translateY(200%)}}@keyframes carousel-inverse{0%,to{width:50%}0%{transform:translateX(200%)}to{transform:translateX(-100%)}}@keyframes carousel-inverse-vertical{0%,to{height:50%}0%{transform:translateY(200%)}to{transform:translateY(-100%)}}@keyframes swing{0%,to{width:50%}0%,to{transform:translateX(-25%)}50%{transform:translateX(125%)}}@keyframes swing-vertical{0%,to{height:50%}0%,to{transform:translateY(-25%)}50%{transform:translateY(125%)}}@keyframes elastic{0%,to{margin-left:25%;width:50%}50%{margin-left:5%;width:90%}}@keyframes elastic-vertical{0%,to{height:50%;margin-top:25%}50%{height:90%;margin-top:5%}}}
+@import "./keyframes.css";@variant dark (&:where(.dark, .dark *));@layer base{body{@apply antialiased text-[var(--ui-text)] bg-[var(--ui-bg)] scheme-light dark:scheme-dark}:root{--ui-text-dimmed:var(--ui-color-neutral-400);--ui-text-muted:var(--ui-color-neutral-500);--ui-text-toned:var(--ui-color-neutral-600);--ui-text:var(--ui-color-neutral-700);--ui-text-highlighted:var(--ui-color-neutral-900);--ui-bg:var(--color-white);--ui-bg-muted:var(--ui-color-neutral-50);--ui-bg-elevated:var(--ui-color-neutral-100);--ui-bg-accented:var(--ui-color-neutral-200);--ui-bg-inverted:var(--ui-color-neutral-900);--ui-border:var(--ui-color-neutral-200);--ui-border-muted:var(--ui-color-neutral-200);--ui-border-accented:var(--ui-color-neutral-300);--ui-border-inverted:var(--ui-color-neutral-900);--ui-radius:var(--radius-sm);--ui-container:var(--container-7xl)}.dark{--ui-text-dimmed:var(--ui-color-neutral-500);--ui-text-muted:var(--ui-color-neutral-400);--ui-text-toned:var(--ui-color-neutral-300);--ui-text:var(--ui-color-neutral-200);--ui-text-highlighted:var(--color-white);--ui-bg:var(--ui-color-neutral-900);--ui-bg-muted:var(--ui-color-neutral-800);--ui-bg-elevated:var(--ui-color-neutral-800);--ui-bg-accented:var(--ui-color-neutral-700);--ui-bg-inverted:var(--color-white);--ui-border:var(--ui-color-neutral-800);--ui-border-muted:var(--ui-color-neutral-700);--ui-border-accented:var(--ui-color-neutral-700);--ui-border-inverted:var(--color-white)}}

package/dist/runtime/keyframes.css

@@ -0,0 +1 @@
+@keyframes accordion-up{0%{height:var(--reka-accordion-content-height)}to{height:0}}@keyframes accordion-down{0%{height:0}to{height:var(--reka-accordion-content-height)}}@keyframes collapsible-up{0%{height:var(--reka-collapsible-content-height)}to{height:0}}@keyframes collapsible-down{0%{height:0}to{height:var(--reka-collapsible-content-height)}}@keyframes toast-collapsed-closed{0%{transform:var(--transform)}to{transform:translateY(calc((var(--before) - var(--height))*var(--gap))) scale(var(--scale))}}@keyframes toast-closed{0%{transform:var(--transform)}to{transform:translateY(calc((var(--offset) - var(--height))*var(--translate-factor)))}}@keyframes toast-slide-left{0%{transform:translateX(0) translateY(var(--translate))}to{transform:translateX(-100%) translateY(var(--translate))}}@keyframes toast-slide-right{0%{transform:translateX(0) translateY(var(--translate))}to{transform:translateX(100%) translateY(var(--translate))}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes slide-in-from-top{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes slide-out-to-top{0%{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes slide-in-from-right{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes slide-out-to-right{0%{transform:translateX(0)}to{transform:translateX(100%)}}@keyframes slide-in-from-bottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slide-out-to-bottom{0%{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes slide-in-from-left{0%{transform:translateX(-100%)}to{transform:translateX(0)}}@keyframes slide-out-to-left{0%{transform:translateX(0)}to{transform:translateX(-100%)}}@keyframes slide-in-from-top-and-fade{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-out-to-top-and-fade{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-4px)}}@keyframes slide-in-from-right-and-fade{0%{opacity:0;transform:translateX(4px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out-to-right-and-fade{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(4px)}}@keyframes slide-in-from-bottom-and-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-out-to-bottom-and-fade{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(4px)}}@keyframes slide-in-from-left-and-fade{0%{opacity:0;transform:translateX(-4px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out-to-left-and-fade{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-4px)}}@keyframes enter-from-right{0%{opacity:0;transform:translateX(200px)}to{opacity:1;transform:translateX(0)}}@keyframes enter-from-left{0%{opacity:0;transform:translateX(-200px)}to{opacity:1;transform:translateX(0)}}@keyframes exit-to-right{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(200px)}}@keyframes exit-to-left{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-200px)}}@keyframes carousel{0%,to{width:50%}0%{transform:translateX(-100%)}to{transform:translateX(200%)}}@keyframes carousel-rtl{0%,to{width:50%}0%{transform:translateX(100%)}to{transform:translateX(-200%)}}@keyframes carousel-vertical{0%,to{height:50%}0%{transform:translateY(-100%)}to{transform:translateY(200%)}}@keyframes carousel-inverse{0%,to{width:50%}0%{transform:translateX(200%)}to{transform:translateX(-100%)}}@keyframes carousel-inverse-rtl{0%,to{width:50%}0%{transform:translateX(-200%)}to{transform:translateX(100%)}}@keyframes carousel-inverse-vertical{0%,to{height:50%}0%{transform:translateY(200%)}to{transform:translateY(-100%)}}@keyframes swing{0%,to{width:50%}0%,to{transform:translateX(-25%)}50%{transform:translateX(125%)}}@keyframes swing-vertical{0%,to{height:50%}0%,to{transform:translateY(-25%)}50%{transform:translateY(125%)}}@keyframes elastic{0%,to{margin-left:25%;width:50%}50%{margin-left:5%;width:90%}}@keyframes elastic-vertical{0%,to{height:50%;margin-top:25%}50%{height:90%;margin-top:5%}}

package/dist/runtime/locale/ar.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("../types").Locale;
+export default _default;

package/dist/runtime/locale/ar.js

@@ -0,0 +1,53 @@
+import { defineLocale } from "../composables/defineLocale.js";
+export default defineLocale({
+  name: "\u0627\u0644\u0639\u0631\u0628\u064A\u0629",
+  code: "ar",
+  dir: "rtl",
+  messages: {
+    inputMenu: {
+      noMatch: "\u0644\u0627 \u062A\u0648\u062C\u062F \u0646\u062A\u0627\u0626\u062C \u0645\u0637\u0627\u0628\u0642\u0629",
+      noData: "\u0644\u0627 \u062A\u0648\u062C\u062F \u0628\u064A\u0627\u0646\u0627\u062A",
+      create: '\u0625\u0646\u0634\u0627\u0621 "{label}"'
+    },
+    calendar: {
+      prevYear: "\u0627\u0644\u0633\u0646\u0629 \u0627\u0644\u0633\u0627\u0628\u0642\u0629",
+      nextYear: "\u0627\u0644\u0633\u0646\u0629 \u0627\u0644\u0645\u0642\u0628\u0644\u0629",
+      prevMonth: "\u0627\u0644\u0634\u0647\u0631 \u0627\u0644\u0633\u0627\u0628\u0642",
+      nextMonth: "\u0627\u0644\u0634\u0647\u0631 \u0627\u0644\u0645\u0642\u0628\u0644"
+    },
+    inputNumber: {
+      increment: "\u0632\u064A\u0627\u062F\u0629",
+      decrement: "\u062A\u0642\u0644\u064A\u0644"
+    },
+    commandPalette: {
+      noMatch: "\u0644\u0627 \u062A\u0648\u062C\u062F \u0646\u062A\u0627\u0626\u062C \u0645\u0637\u0627\u0628\u0642\u0629",
+      noData: "\u0644\u0627 \u062A\u0648\u062C\u062F \u0628\u064A\u0627\u0646\u0627\u062A",
+      close: "\u0625\u063A\u0644\u0627\u0642"
+    },
+    selectMenu: {
+      noMatch: "\u0644\u0627 \u062A\u0648\u062C\u062F \u0646\u062A\u0627\u0626\u062C \u0645\u0637\u0627\u0628\u0642\u0629",
+      noData: "\u0644\u0627 \u062A\u0648\u062C\u062F \u0628\u064A\u0627\u0646\u0627\u062A",
+      create: '\u0625\u0646\u0634\u0627\u0621 "{label}"'
+    },
+    toast: {
+      close: "\u0625\u063A\u0644\u0627\u0642"
+    },
+    carousel: {
+      prev: "\u0627\u0644\u0633\u0627\u0628\u0642",
+      next: "\u0627\u0644\u062A\u0627\u0644\u064A",
+      goto: "\u0627\u0644\u0630\u0647\u0627\u0628 \u0625\u0644\u064A \u0634\u0631\u064A\u062D\u0629 {slide}"
+    },
+    modal: {
+      close: "\u0625\u063A\u0644\u0627\u0642"
+    },
+    slideover: {
+      close: "\u0625\u063A\u0644\u0627\u0642"
+    },
+    alert: {
+      close: "\u0625\u063A\u0644\u0627\u0642"
+    },
+    table: {
+      noData: "\u0644\u0627 \u062A\u0648\u062C\u062F \u0628\u064A\u0627\u0646\u0627\u062A"
+    }
+  }
+});

package/dist/runtime/locale/cs.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("../types").Locale;
+export default _default;