nuance-ui 0.1.2 → 0.1.3

package/LICENSE.md

@@ -0,0 +1,9 @@
+MIT License
+
+Copyright (c) 2023 NuxtLabs
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -53,19 +53,17 @@ We welcome contributions! Please:
 
 ## Links
 
-- [Documentation](https://nuance-ui.dev)
-- [GitHub](https://github.com/yourusername/nuance-ui)
+- Documentation **WIP**
+- [GitHub](https://github.com/Igor-Iugin/nuance-ui)
 - [NPM](https://www.npmjs.com/package/nuance-ui)
-- [Examples](https://nuance-ui.dev/examples)
 
 ## Support
 
 If you have questions or issues:
 
-- [Create an Issue](https://github.com/yourusername/nuance-ui/issues)
-- [Discussions](https://github.com/yourusername/nuance-ui/discussions)
-- Email: support@nuance-ui.dev
+- [Create an Issue](https://github.com/Igor-Iugin/nuance-ui/issues)
+- [Discussions](https://github.com/Igor-Iugin/nuance-ui/discussions)
 
 ## License
 
-Licensed under the MIT license.
+Licensed under the [MIT license](https://github.com/Igor-Iugin/nuance-ui/blob/main/LICENSE.md).

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": "^4.0.0"
   },
-  "version": "0.1.2",
+  "version": "0.1.3",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/action-icon/action-icon-section.d.vue.ts

@@ -1,12 +1,12 @@
-import type { UiKitColor, UiKitGradient, UiKitRadius, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceRadius, NuanceSize, UiKitGradient } from '@nui/types';
 import type { BoxProps } from '../box.vue.js';
 export interface ActionIconSectionProps extends /* @vue-ignore */ BoxProps {
-    size?: UiKitSize | `compact-${UiKitSize}`;
+    size?: NuanceSize | `compact-${NuanceSize}`;
     variant?: 'filled' | 'light' | 'outline' | 'subtle' | 'default' | 'gradient';
     gradient?: UiKitGradient;
     loading?: boolean;
-    color?: UiKitColor;
-    radius?: UiKitRadius;
+    color?: NuanceColor;
+    radius?: NuanceRadius;
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/action-icon/action-icon-section.vue.d.ts

@@ -1,12 +1,12 @@
-import type { UiKitColor, UiKitGradient, UiKitRadius, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceRadius, NuanceSize, UiKitGradient } from '@nui/types';
 import type { BoxProps } from '../box.vue.js';
 export interface ActionIconSectionProps extends /* @vue-ignore */ BoxProps {
-    size?: UiKitSize | `compact-${UiKitSize}`;
+    size?: NuanceSize | `compact-${NuanceSize}`;
     variant?: 'filled' | 'light' | 'outline' | 'subtle' | 'default' | 'gradient';
     gradient?: UiKitGradient;
     loading?: boolean;
-    color?: UiKitColor;
-    radius?: UiKitRadius;
+    color?: NuanceColor;
+    radius?: NuanceRadius;
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/action-icon/action-icon.d.vue.ts

@@ -1,12 +1,12 @@
-import type { UiKitColor, UiKitGradient, UiKitRadius, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceRadius, NuanceSize, UiKitGradient } from '@nui/types';
 import type { BoxProps } from '../box.vue.js';
 export interface ActionIconProps {
-    size?: UiKitSize | `compact-${UiKitSize}` | string;
+    size?: NuanceSize | `compact-${NuanceSize}` | string;
     variant?: 'filled' | 'light' | 'outline' | 'subtle' | 'default' | 'gradient';
     gradient?: UiKitGradient;
     loading?: boolean;
-    color?: UiKitColor;
-    radius?: UiKitRadius;
+    color?: NuanceColor;
+    radius?: NuanceRadius;
     classes?: {
         root?: string;
         icon?: string;

package/dist/runtime/components/action-icon/action-icon.vue

@@ -23,7 +23,7 @@ const {
   color: { type: null, required: false },
   radius: { type: [String, Number], required: false },
   classes: { type: Object, required: false },
-  mod: { type: null, required: false },
+  mod: { type: [Object, Array, null], required: false },
   icon: { type: String, required: false }
 });
 const style = computed(() => useStyleResolver((theme) => {

package/dist/runtime/components/action-icon/action-icon.vue.d.ts

@@ -1,12 +1,12 @@
-import type { UiKitColor, UiKitGradient, UiKitRadius, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceRadius, NuanceSize, UiKitGradient } from '@nui/types';
 import type { BoxProps } from '../box.vue.js';
 export interface ActionIconProps {
-    size?: UiKitSize | `compact-${UiKitSize}` | string;
+    size?: NuanceSize | `compact-${NuanceSize}` | string;
     variant?: 'filled' | 'light' | 'outline' | 'subtle' | 'default' | 'gradient';
     gradient?: UiKitGradient;
     loading?: boolean;
-    color?: UiKitColor;
-    radius?: UiKitRadius;
+    color?: NuanceColor;
+    radius?: NuanceRadius;
     classes?: {
         root?: string;
         icon?: string;

package/dist/runtime/components/background-image.d.vue.ts

@@ -1,7 +1,7 @@
-import type { UiKitRadius } from '@nui/types';
+import type { NuanceRadius } from '@nui/types';
 import type { BoxProps } from './box.vue.js';
 export interface BackgroundImageProps extends /* @vue-ignore */ BoxProps {
-    radius?: UiKitRadius | string;
+    radius?: NuanceRadius | string;
     /** Image url */
     src: string;
 }

package/dist/runtime/components/background-image.vue.d.ts

@@ -1,7 +1,7 @@
-import type { UiKitRadius } from '@nui/types';
+import type { NuanceRadius } from '@nui/types';
 import type { BoxProps } from './box.vue.js';
 export interface BackgroundImageProps extends /* @vue-ignore */ BoxProps {
-    radius?: UiKitRadius | string;
+    radius?: NuanceRadius | string;
     /** Image url */
     src: string;
 }

package/dist/runtime/components/button/button.d.vue.ts

@@ -1,13 +1,13 @@
-import type { UiKitColor, UiKitGradient, UiKitRadius, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceRadius, NuanceSize, UiKitGradient } from '@nui/types';
 import type { HTMLAttributes } from 'vue';
 import type { BoxProps } from '../box.vue.js';
 export interface ButtonProps extends /* @vue-ignore */ BoxProps {
-    size?: UiKitSize | `compact-${UiKitSize}`;
+    size?: NuanceSize | `compact-${NuanceSize}`;
     variant?: 'filled' | 'light' | 'outline' | 'subtle' | 'default' | 'gradient' | 'gradient-outline';
     gradient?: UiKitGradient;
     loading?: boolean;
-    color?: UiKitColor;
-    radius?: UiKitRadius;
+    color?: NuanceColor;
+    radius?: NuanceRadius;
     classes?: {
         root?: string;
         inner?: string;

package/dist/runtime/components/button/button.vue.d.ts

@@ -1,13 +1,13 @@
-import type { UiKitColor, UiKitGradient, UiKitRadius, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceRadius, NuanceSize, UiKitGradient } from '@nui/types';
 import type { HTMLAttributes } from 'vue';
 import type { BoxProps } from '../box.vue.js';
 export interface ButtonProps extends /* @vue-ignore */ BoxProps {
-    size?: UiKitSize | `compact-${UiKitSize}`;
+    size?: NuanceSize | `compact-${NuanceSize}`;
     variant?: 'filled' | 'light' | 'outline' | 'subtle' | 'default' | 'gradient' | 'gradient-outline';
     gradient?: UiKitGradient;
     loading?: boolean;
-    color?: UiKitColor;
-    radius?: UiKitRadius;
+    color?: NuanceColor;
+    radius?: NuanceRadius;
     classes?: {
         root?: string;
         inner?: string;

package/dist/runtime/components/card/card.d.vue.ts

@@ -1,7 +1,7 @@
-import type { UiKitSpacing } from '@nui/types';
+import type { NuanceSpacing } from '@nui/types';
 import type { PaperProps } from '../paper.vue.js';
 export interface CardProps extends /* @vue-ignore */ PaperProps {
-    padding?: UiKitSpacing;
+    padding?: NuanceSpacing;
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/card/card.vue.d.ts

@@ -1,7 +1,7 @@
-import type { UiKitSpacing } from '@nui/types';
+import type { NuanceSpacing } from '@nui/types';
 import type { PaperProps } from '../paper.vue.js';
 export interface CardProps extends /* @vue-ignore */ PaperProps {
-    padding?: UiKitSpacing;
+    padding?: NuanceSpacing;
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/checkbox/checkbox-card.d.vue.ts

@@ -1,9 +1,9 @@
 import type { Mod } from '@nui/composals';
-import type { UiKitRadius } from '@nui/types';
+import type { NuanceRadius } from '@nui/types';
 export interface CheckboxCardProps {
     mod?: Mod | Mod[];
     withBorder?: boolean;
-    radius?: UiKitRadius;
+    radius?: NuanceRadius;
     value?: string;
 }
 type __VLS_Props = CheckboxCardProps;

package/dist/runtime/components/checkbox/checkbox-card.vue.d.ts

@@ -1,9 +1,9 @@
 import type { Mod } from '@nui/composals';
-import type { UiKitRadius } from '@nui/types';
+import type { NuanceRadius } from '@nui/types';
 export interface CheckboxCardProps {
     mod?: Mod | Mod[];
     withBorder?: boolean;
-    radius?: UiKitRadius;
+    radius?: NuanceRadius;
     value?: string;
 }
 type __VLS_Props = CheckboxCardProps;

package/dist/runtime/components/checkbox/checkbox-group.d.vue.ts

@@ -1,8 +1,8 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { InputWrapperProps } from '../input/index.js';
 export interface CheckboxGroupProps extends /* @vue-ignore */ Omit<InputWrapperProps, 'resize' | 'multiline' | 'id'> {
     name: string;
-    size?: UiKitSize;
+    size?: NuanceSize;
 }
 type __VLS_Props = CheckboxGroupProps;
 type __VLS_ModelProps = {

package/dist/runtime/components/checkbox/checkbox-group.vue.d.ts

@@ -1,8 +1,8 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { InputWrapperProps } from '../input/index.js';
 export interface CheckboxGroupProps extends /* @vue-ignore */ Omit<InputWrapperProps, 'resize' | 'multiline' | 'id'> {
     name: string;
-    size?: UiKitSize;
+    size?: NuanceSize;
 }
 type __VLS_Props = CheckboxGroupProps;
 type __VLS_ModelProps = {

package/dist/runtime/components/checkbox/checkbox-indicator.d.vue.ts

@@ -1,10 +1,10 @@
-import type { UiKitColor, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceSize } from '@nui/types';
 export interface CheckboxIndicatorProps {
-    color?: UiKitColor;
-    iconColor?: UiKitColor;
+    color?: NuanceColor;
+    iconColor?: NuanceColor;
     variant?: 'filled' | 'outline';
-    radius?: UiKitSize;
-    size?: UiKitSize;
+    radius?: NuanceSize;
+    size?: NuanceSize;
     indeterminate?: boolean;
 }
 type __VLS_Props = CheckboxIndicatorProps;

package/dist/runtime/components/checkbox/checkbox-indicator.vue.d.ts

@@ -1,10 +1,10 @@
-import type { UiKitColor, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceSize } from '@nui/types';
 export interface CheckboxIndicatorProps {
-    color?: UiKitColor;
-    iconColor?: UiKitColor;
+    color?: NuanceColor;
+    iconColor?: NuanceColor;
     variant?: 'filled' | 'outline';
-    radius?: UiKitSize;
-    size?: UiKitSize;
+    radius?: NuanceSize;
+    size?: NuanceSize;
     indeterminate?: boolean;
 }
 type __VLS_Props = CheckboxIndicatorProps;

package/dist/runtime/components/checkbox/checkbox.d.vue.ts

@@ -1,11 +1,11 @@
-import type { UiKitColor, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceSize } from '@nui/types';
 import type { InlineInputProps } from '../input/index.js';
 export interface CheckboxProps extends /* @vue-ignore */ Omit<InlineInputProps, 'id'> {
-    color?: UiKitColor;
-    iconColor?: UiKitColor;
+    color?: NuanceColor;
+    iconColor?: NuanceColor;
     variant?: 'filled' | 'outline';
-    radius?: UiKitSize;
-    size?: UiKitSize;
+    radius?: NuanceSize;
+    size?: NuanceSize;
     indeterminate?: boolean;
     value?: string;
 }

package/dist/runtime/components/checkbox/checkbox.vue.d.ts

@@ -1,11 +1,11 @@
-import type { UiKitColor, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceSize } from '@nui/types';
 import type { InlineInputProps } from '../input/index.js';
 export interface CheckboxProps extends /* @vue-ignore */ Omit<InlineInputProps, 'id'> {
-    color?: UiKitColor;
-    iconColor?: UiKitColor;
+    color?: NuanceColor;
+    iconColor?: NuanceColor;
     variant?: 'filled' | 'outline';
-    radius?: UiKitSize;
-    size?: UiKitSize;
+    radius?: NuanceSize;
+    size?: NuanceSize;
     indeterminate?: boolean;
     value?: string;
 }

package/dist/runtime/components/checkbox/lib/group.context.d.ts

@@ -1,16 +1,16 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { ModelRef } from 'vue';
 export interface CheckboxGroupState {
     value: ModelRef<string[]>;
-    size?: UiKitSize;
+    size?: NuanceSize;
 }
 export declare const useProvideCheckboxGroup: (args_0: CheckboxGroupState) => {
     value: ModelRef<string[]>;
-    size: UiKitSize | undefined;
+    size: NuanceSize | undefined;
     onUpdate: (newValue: string) => number | string[];
 };
 export declare const useCheckboxGroupState: () => {
     value: ModelRef<string[]>;
-    size: UiKitSize | undefined;
+    size: NuanceSize | undefined;
     onUpdate: (newValue: string) => number | string[];
 };

package/dist/runtime/components/chip/chip.d.vue.ts

@@ -1,9 +1,9 @@
-import type { UiKitColor, UiKitRadius, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceRadius, NuanceSize } from '@nui/types';
 export interface ChipProps {
-    radius?: UiKitRadius;
-    size?: UiKitSize;
+    radius?: NuanceRadius;
+    size?: NuanceSize;
     type?: 'radio' | 'checkbox';
-    color?: UiKitColor;
+    color?: NuanceColor;
     id?: string;
     variant?: 'filled' | 'outline' | 'light';
     value?: string;

package/dist/runtime/components/chip/chip.vue.d.ts

@@ -1,9 +1,9 @@
-import type { UiKitColor, UiKitRadius, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceRadius, NuanceSize } from '@nui/types';
 export interface ChipProps {
-    radius?: UiKitRadius;
-    size?: UiKitSize;
+    radius?: NuanceRadius;
+    size?: NuanceSize;
     type?: 'radio' | 'checkbox';
-    color?: UiKitColor;
+    color?: NuanceColor;
     id?: string;
     variant?: 'filled' | 'outline' | 'light';
     value?: string;

package/dist/runtime/components/combobox/combobox-root.d.vue.ts

@@ -1,4 +1,4 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { CSSProperties } from 'vue';
 import type { PopoverProps } from '../popover/index.js';
 import type { ComboboxStore } from './lib/use-combobox/index.js';
@@ -9,9 +9,9 @@ export interface ComboboxProps extends /* @vue-ignore */ PopoverProps {
     /** `behavior` passed down to `element.scrollIntoView`, `'instant'` by default */
     scrollBehavior?: ScrollBehavior;
     /** Controls items `font-size` and `padding` @default `'sm'` */
-    size?: UiKitSize;
+    size?: NuanceSize;
     /** Controls `padding` of the dropdown @default `4` */
-    dropdownPadding?: UiKitSize | CSSProperties['padding'];
+    dropdownPadding?: NuanceSize | CSSProperties['padding'];
     /** Determines whether the `Combobox` value can be changed */
     readOnly?: boolean;
 }

package/dist/runtime/components/combobox/combobox-root.vue.d.ts

@@ -1,4 +1,4 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { CSSProperties } from 'vue';
 import type { PopoverProps } from '../popover/index.js';
 import type { ComboboxStore } from './lib/use-combobox/index.js';
@@ -9,9 +9,9 @@ export interface ComboboxProps extends /* @vue-ignore */ PopoverProps {
     /** `behavior` passed down to `element.scrollIntoView`, `'instant'` by default */
     scrollBehavior?: ScrollBehavior;
     /** Controls items `font-size` and `padding` @default `'sm'` */
-    size?: UiKitSize;
+    size?: NuanceSize;
     /** Controls `padding` of the dropdown @default `4` */
-    dropdownPadding?: UiKitSize | CSSProperties['padding'];
+    dropdownPadding?: NuanceSize | CSSProperties['padding'];
     /** Determines whether the `Combobox` value can be changed */
     readOnly?: boolean;
 }

package/dist/runtime/components/combobox/lib/context.d.ts

@@ -1,14 +1,14 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { CSSProperties, ModelRef } from 'vue';
 import type { ComboboxItem } from '../types/index.js';
 import type { ComboboxStore } from './use-combobox/use-combobox.js';
 interface ComboboxState {
     opened: ModelRef<boolean>;
     onOptionSubmit?: (value: string, option: ComboboxItem) => void;
-    size: UiKitSize;
+    size: NuanceSize;
     readOnly: boolean;
     store: ComboboxStore;
-    dropdownPadding?: UiKitSize | CSSProperties['padding'];
+    dropdownPadding?: NuanceSize | CSSProperties['padding'];
 }
 export declare const useProvide: (args_0: ComboboxState) => ComboboxState, useState: () => ComboboxState;
 export declare const useProvideComboboxState: (args_0: ComboboxState) => ComboboxState;

package/dist/runtime/components/container.d.vue.ts

@@ -1,7 +1,7 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { BoxProps } from './box.vue.js';
 export interface ContainerProps extends /* @vue-ignore */ BoxProps {
-    size?: UiKitSize | string | number;
+    size?: NuanceSize | string | number;
     fluid?: boolean;
 }
 declare var __VLS_6: {};

package/dist/runtime/components/container.vue.d.ts

@@ -1,7 +1,7 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { BoxProps } from './box.vue.js';
 export interface ContainerProps extends /* @vue-ignore */ BoxProps {
-    size?: UiKitSize | string | number;
+    size?: NuanceSize | string | number;
     fluid?: boolean;
 }
 declare var __VLS_6: {};

package/dist/runtime/components/dialog/dialog-root.d.vue.ts

@@ -1,4 +1,4 @@
-import type { UiKitRadius, UiKitShadow, UiKitSize, UiKitSpacing } from '@nui/types';
+import type { NuanceRadius, NuanceShadow, NuanceSize, NuanceSpacing } from '@nui/types';
 import type { CSSProperties } from 'vue';
 import type { BoxProps } from '../box.vue.js';
 import type { TransitionName } from '../transition/index.js';
@@ -15,13 +15,13 @@ export interface DialogRootProps extends /* @vue-ignore */ Omit<BoxProps, 'is'>
     /** Left/right modal offset @default `5vw` */
     xOffset?: CSSProperties['marginLeft'];
     /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default `theme.defaultRadius` */
-    radius?: UiKitRadius;
+    radius?: NuanceRadius;
     /** Controls width of the content area @default `'md'` */
-    size?: UiKitSize;
+    size?: NuanceSize;
     /** Key of `theme.shadows` or any valid CSS box-shadow value @default `'xl'` */
-    shadow?: UiKitShadow;
+    shadow?: NuanceShadow;
     /** Key of `theme.spacing` or any valid CSS value to set content, header and footer padding @default `'md'` */
-    padding?: UiKitSpacing;
+    padding?: NuanceSpacing;
     /** Passes a class to root element */
     rootClass?: string;
     transition?: TransitionName;

package/dist/runtime/components/dialog/dialog-root.vue.d.ts

@@ -1,4 +1,4 @@
-import type { UiKitRadius, UiKitShadow, UiKitSize, UiKitSpacing } from '@nui/types';
+import type { NuanceRadius, NuanceShadow, NuanceSize, NuanceSpacing } from '@nui/types';
 import type { CSSProperties } from 'vue';
 import type { BoxProps } from '../box.vue.js';
 import type { TransitionName } from '../transition/index.js';
@@ -15,13 +15,13 @@ export interface DialogRootProps extends /* @vue-ignore */ Omit<BoxProps, 'is'>
     /** Left/right modal offset @default `5vw` */
     xOffset?: CSSProperties['marginLeft'];
     /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default `theme.defaultRadius` */
-    radius?: UiKitRadius;
+    radius?: NuanceRadius;
     /** Controls width of the content area @default `'md'` */
-    size?: UiKitSize;
+    size?: NuanceSize;
     /** Key of `theme.shadows` or any valid CSS box-shadow value @default `'xl'` */
-    shadow?: UiKitShadow;
+    shadow?: NuanceShadow;
     /** Key of `theme.spacing` or any valid CSS value to set content, header and footer padding @default `'md'` */
-    padding?: UiKitSpacing;
+    padding?: NuanceSpacing;
     /** Passes a class to root element */
     rootClass?: string;
     transition?: TransitionName;

package/dist/runtime/components/input/lib/input-wrapper.context.d.ts

@@ -1,11 +1,11 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { CSSProperties } from 'vue';
 import type { InputVariant } from '../types/index.js';
 export interface WrapperContext {
     id?: string | null;
     required?: boolean;
-    radius?: UiKitSize | string;
-    size?: UiKitSize | string;
+    radius?: NuanceSize | string;
+    size?: NuanceSize | string;
     variant?: InputVariant;
     multiline?: boolean;
     resize?: CSSProperties['resize'];

package/dist/runtime/components/input/ui/input-inline.d.vue.ts

@@ -1,4 +1,4 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { BoxProps } from '../../box.vue.js';
 export interface InlineInputProps extends /* @vue-ignore */ Omit<BoxProps, 'is'> {
     id: string;
@@ -6,7 +6,7 @@ export interface InlineInputProps extends /* @vue-ignore */ Omit<BoxProps, 'is'>
     description?: string;
     error?: string;
     disabled?: boolean | undefined;
-    size?: UiKitSize | string;
+    size?: NuanceSize | string;
     labelPosition?: 'left' | 'right';
 }
 declare var __VLS_6: {}, __VLS_12: {}, __VLS_18: {}, __VLS_24: {};

package/dist/runtime/components/input/ui/input-inline.vue.d.ts

@@ -1,4 +1,4 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 import type { BoxProps } from '../../box.vue.js';
 export interface InlineInputProps extends /* @vue-ignore */ Omit<BoxProps, 'is'> {
     id: string;
@@ -6,7 +6,7 @@ export interface InlineInputProps extends /* @vue-ignore */ Omit<BoxProps, 'is'>
     description?: string;
     error?: string;
     disabled?: boolean | undefined;
-    size?: UiKitSize | string;
+    size?: NuanceSize | string;
     labelPosition?: 'left' | 'right';
 }
 declare var __VLS_6: {}, __VLS_12: {}, __VLS_18: {}, __VLS_24: {};

package/dist/runtime/components/input/ui/input-label.d.vue.ts

@@ -1,7 +1,7 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 export interface InputLabelProps {
     required?: boolean;
-    size?: UiKitSize | string;
+    size?: NuanceSize | string;
 }
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/input/ui/input-label.vue.d.ts

@@ -1,7 +1,7 @@
-import type { UiKitSize } from '@nui/types';
+import type { NuanceSize } from '@nui/types';
 export interface InputLabelProps {
     required?: boolean;
-    size?: UiKitSize | string;
+    size?: NuanceSize | string;
 }
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/loader/loader.d.vue.ts

@@ -1,8 +1,8 @@
-import type { UiKitColor, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceSize } from '@nui/types';
 export type LoaderType = 'bars' | 'dots' | 'oval';
 export interface LoaderProps {
-    size?: UiKitSize | string;
-    color?: UiKitColor | string;
+    size?: NuanceSize | string;
+    color?: NuanceColor | string;
     type?: LoaderType;
 }
 declare const __VLS_export: import("vue").DefineComponent<LoaderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LoaderProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/loader/loader.vue.d.ts

@@ -1,8 +1,8 @@
-import type { UiKitColor, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceSize } from '@nui/types';
 export type LoaderType = 'bars' | 'dots' | 'oval';
 export interface LoaderProps {
-    size?: UiKitSize | string;
-    color?: UiKitColor | string;
+    size?: NuanceSize | string;
+    color?: NuanceColor | string;
     type?: LoaderType;
 }
 declare const __VLS_export: import("vue").DefineComponent<LoaderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LoaderProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/nav-link/nav-link.d.vue.ts

@@ -1,4 +1,4 @@
-import type { UiKitColor } from '@nui/types';
+import type { NuanceColor } from '@nui/types';
 import type { NuxtLinkProps } from 'nuxt/app';
 import type { BoxProps } from '../box.vue.js';
 export interface NavLinkProps extends /* @vue-ignore */ BoxProps, Omit<NuxtLinkProps, 'href' | 'custom'> {
@@ -7,7 +7,7 @@ export interface NavLinkProps extends /* @vue-ignore */ BoxProps, Omit<NuxtLinkP
     /** Determines whether the link should have active styles @default `false` */
     active?: boolean;
     /** Key of `theme.colors` of any valid CSS color to control active styles @default `theme.primaryColor` */
-    color?: UiKitColor;
+    color?: NuanceColor;
     /** If set, label and description do not wrap to the next line @default `false` */
     noWrap?: boolean;
     /** If set, disabled styles will be added to the root element @default `false` */

package/dist/runtime/components/nav-link/nav-link.vue.d.ts

@@ -1,4 +1,4 @@
-import type { UiKitColor } from '@nui/types';
+import type { NuanceColor } from '@nui/types';
 import type { NuxtLinkProps } from 'nuxt/app';
 import type { BoxProps } from '../box.vue.js';
 export interface NavLinkProps extends /* @vue-ignore */ BoxProps, Omit<NuxtLinkProps, 'href' | 'custom'> {
@@ -7,7 +7,7 @@ export interface NavLinkProps extends /* @vue-ignore */ BoxProps, Omit<NuxtLinkP
     /** Determines whether the link should have active styles @default `false` */
     active?: boolean;
     /** Key of `theme.colors` of any valid CSS color to control active styles @default `theme.primaryColor` */
-    color?: UiKitColor;
+    color?: NuanceColor;
     /** If set, label and description do not wrap to the next line @default `false` */
     noWrap?: boolean;
     /** If set, disabled styles will be added to the root element @default `false` */

package/dist/runtime/components/paper.d.vue.ts

@@ -1,8 +1,8 @@
-import type { UiKitRadius, UiKitShadow } from '@nui/types';
+import type { NuanceRadius, NuanceShadow } from '@nui/types';
 import type { BoxProps } from './box.vue.js';
 export interface PaperProps extends /* @vue-ignore */ BoxProps {
-    shadow?: UiKitShadow;
-    radius?: UiKitRadius;
+    shadow?: NuanceShadow;
+    radius?: NuanceRadius;
     withBorder?: boolean;
 }
 declare var __VLS_6: {};

package/dist/runtime/components/paper.vue.d.ts

@@ -1,8 +1,8 @@
-import type { UiKitRadius, UiKitShadow } from '@nui/types';
+import type { NuanceRadius, NuanceShadow } from '@nui/types';
 import type { BoxProps } from './box.vue.js';
 export interface PaperProps extends /* @vue-ignore */ BoxProps {
-    shadow?: UiKitShadow;
-    radius?: UiKitRadius;
+    shadow?: NuanceShadow;
+    radius?: NuanceRadius;
     withBorder?: boolean;
 }
 declare var __VLS_6: {};

package/dist/runtime/components/popover/lib/context.d.ts

@@ -1,4 +1,4 @@
-import type { UiKitRadius, UiKitShadow } from '@nui/types';
+import type { NuanceRadius, NuanceShadow } from '@nui/types';
 import type { UsePopoverReturn } from './use-popover.js';
 interface PopoverState {
     disabled?: boolean;
@@ -6,8 +6,8 @@ interface PopoverState {
     withArrow: boolean;
     id: string;
     onToggle: (event: ToggleEvent) => void;
-    radius?: UiKitRadius;
-    shadow?: UiKitShadow;
+    radius?: NuanceRadius;
+    shadow?: NuanceShadow;
 }
 export declare const useProvidePopoverState: (args_0: PopoverState) => PopoverState;
 export declare const usePopoverState: () => PopoverState;

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

@@ -1,6 +1,6 @@
 import type { AlignedPlacement, OffsetOptions, Side, Strategy } from '@floating-ui/vue';
 import type { CSSProperties } from 'vue';
-import type { UiKitRadius, UiKitShadow } from '~/src/runtime/types/theme';
+import type { NuanceRadius, NuanceShadow } from '~/src/runtime/types/theme';
 export type ArrowPosition = 'center' | 'side';
 export type PopoverWidth = 'target' | CSSProperties['width'] | null;
 export interface PopoverProps {
@@ -23,9 +23,9 @@ export interface PopoverProps {
     /** Arrow position */
     arrowPosition?: ArrowPosition;
     /** Key of `theme.radius` or any valid CSS value to set border-radius @default `theme.defaultRadius` */
-    radius?: UiKitRadius;
+    radius?: NuanceRadius;
     /** Key of `theme.shadows` or any other valid CSS `box-shadow` value */
-    shadow?: UiKitShadow;
+    shadow?: NuanceShadow;
     /** If set, popover dropdown will not be rendered */
     disabled?: boolean;
     /** Changes floating ui [position strategy](https://floating-ui.com/docs/usefloating#strategy) @default `'absolute'` */

package/dist/runtime/components/tabs/tabs-root.d.vue.ts

@@ -1,4 +1,4 @@
-import type { UiKitColor, UiKitRadius } from '@nui/types';
+import type { NuanceColor, NuanceRadius } from '@nui/types';
 import type { BoxProps } from '../box.vue.js';
 export interface TabsRootProps extends /* @vue-ignore */ BoxProps {
     defaultTab?: string;
@@ -14,9 +14,9 @@ export interface TabsRootProps extends /* @vue-ignore */ BoxProps {
     /** Determines whether tab can be deactivated, `false` by default */
     allowTabDeactivation?: boolean;
     /** Changes colors of `TabsTab` components when variant is `pills` or `default`, does nothing for other variants */
-    color?: UiKitColor;
+    color?: NuanceColor;
     /** Key of `theme.radius` or any valid CSS value to set `border-radius`, `theme.defaultRadius` by default */
-    radius?: UiKitRadius;
+    radius?: NuanceRadius;
     /** Determines whether tabs should have inverted styles, `false` by default */
     inverted?: boolean;
     /** If set to `false`, `TabsPanel` content will be unmounted when the associated tab is not active, `true` by default */

package/dist/runtime/components/tabs/tabs-root.vue.d.ts

@@ -1,4 +1,4 @@
-import type { UiKitColor, UiKitRadius } from '@nui/types';
+import type { NuanceColor, NuanceRadius } from '@nui/types';
 import type { BoxProps } from '../box.vue.js';
 export interface TabsRootProps extends /* @vue-ignore */ BoxProps {
     defaultTab?: string;
@@ -14,9 +14,9 @@ export interface TabsRootProps extends /* @vue-ignore */ BoxProps {
     /** Determines whether tab can be deactivated, `false` by default */
     allowTabDeactivation?: boolean;
     /** Changes colors of `TabsTab` components when variant is `pills` or `default`, does nothing for other variants */
-    color?: UiKitColor;
+    color?: NuanceColor;
     /** Key of `theme.radius` or any valid CSS value to set `border-radius`, `theme.defaultRadius` by default */
-    radius?: UiKitRadius;
+    radius?: NuanceRadius;
     /** Determines whether tabs should have inverted styles, `false` by default */
     inverted?: boolean;
     /** If set to `false`, `TabsPanel` content will be unmounted when the associated tab is not active, `true` by default */

package/dist/runtime/components/text.d.vue.ts

@@ -1,11 +1,11 @@
-import type { UiKitColor, UiKitGradient, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceSize, UiKitGradient } from '@nui/types';
 import type { CSSProperties } from 'vue';
 import type { BoxProps } from './box.vue.js';
 type TitleOrder = 1 | 2 | 3 | 4 | 5 | 6;
 type TextTruncate = 'end' | 'start' | boolean;
 export interface TextProps extends /* @vue-ignore */ BoxProps {
     /** Controls `font-size` and `line-height`, `'md'` by default */
-    size?: UiKitSize | `h${TitleOrder}` | string;
+    size?: NuanceSize | `h${TitleOrder}` | string;
     /** Number of lines after which Text will be truncated */
     lineClamp?: number;
     /** Side on which Text must be truncated, if `true`, text is truncated from the start */
@@ -17,10 +17,10 @@ export interface TextProps extends /* @vue-ignore */ BoxProps {
     /** Gradient configuration, ignored when `variant` is not `gradient`, `theme.defaultGradient` by default */
     gradient?: UiKitGradient;
     variant?: 'text' | 'gradient';
-    fz?: UiKitSize | `h${TitleOrder}` | string;
-    lh?: UiKitSize | string;
+    fz?: NuanceSize | `h${TitleOrder}` | string;
+    lh?: NuanceSize | string;
     fw?: CSSProperties['font-weight'];
-    c?: UiKitColor;
+    c?: NuanceColor;
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/text.vue.d.ts

@@ -1,11 +1,11 @@
-import type { UiKitColor, UiKitGradient, UiKitSize } from '@nui/types';
+import type { NuanceColor, NuanceSize, UiKitGradient } from '@nui/types';
 import type { CSSProperties } from 'vue';
 import type { BoxProps } from './box.vue.js';
 type TitleOrder = 1 | 2 | 3 | 4 | 5 | 6;
 type TextTruncate = 'end' | 'start' | boolean;
 export interface TextProps extends /* @vue-ignore */ BoxProps {
     /** Controls `font-size` and `line-height`, `'md'` by default */
-    size?: UiKitSize | `h${TitleOrder}` | string;
+    size?: NuanceSize | `h${TitleOrder}` | string;
     /** Number of lines after which Text will be truncated */
     lineClamp?: number;
     /** Side on which Text must be truncated, if `true`, text is truncated from the start */
@@ -17,10 +17,10 @@ export interface TextProps extends /* @vue-ignore */ BoxProps {
     /** Gradient configuration, ignored when `variant` is not `gradient`, `theme.defaultGradient` by default */
     gradient?: UiKitGradient;
     variant?: 'text' | 'gradient';
-    fz?: UiKitSize | `h${TitleOrder}` | string;
-    lh?: UiKitSize | string;
+    fz?: NuanceSize | `h${TitleOrder}` | string;
+    lh?: NuanceSize | string;
     fw?: CSSProperties['font-weight'];
-    c?: UiKitColor;
+    c?: NuanceColor;
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/runtime/composals/use-style-resolver.d.ts

@@ -1,3 +1,3 @@
-import type { UiKitTheme } from '@nui/types';
+import type { NuanceTheme } from '@nui/types';
 import type { CSSProperties } from 'vue';
-export declare function useStyleResolver<T extends CSSProperties>(factory: (theme: UiKitTheme) => T): T;
+export declare function useStyleResolver<T extends CSSProperties>(factory: (theme: NuanceTheme) => T): T;

package/dist/runtime/composals/use-theme.d.ts

@@ -1,7 +1,7 @@
-import type { UiKitTheme } from '@nui/types';
+import type { NuanceTheme } from '@nui/types';
 interface ThemeInstance {
-    preference: UiKitTheme;
-    readonly value: UiKitTheme;
+    preference: NuanceTheme;
+    readonly value: NuanceTheme;
     unknown: boolean;
     forced: boolean;
 }

package/dist/runtime/composals/use-theme.js

@@ -1,4 +1,4 @@
-import { useState } from "#imports";
+import { useColorMode } from "#build/imports";
 export function useTheme() {
-  return useState("color-mode").value;
+  return useColorMode();
 }

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

@@ -1,25 +1,25 @@
-export type UiKitSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-export type UiKitBreakpointsValues = Record<UiKitSize | 'base', string>;
-export type UiKitFontSizesValues = Record<UiKitSize, string>;
-export type UiKitRadiusValues = Record<UiKitSize | 'full', string>;
-export type UiKitSpacingValues = Record<UiKitSize, string>;
-export type UiKitShadowsValues = Record<UiKitSize, string>;
-export type UiKitLineHeightValues = Record<UiKitSize, string>;
-export type UiKitBreakpoint = keyof UiKitBreakpointsValues;
-export type UiKitFontSize = keyof UiKitFontSizesValues;
-export type UiKitRadius = keyof UiKitRadiusValues | number;
-export type UiKitSpacing = keyof UiKitSpacingValues | number;
-export type UiKitShadow = keyof UiKitShadowsValues;
-export type UiKitLineHeight = keyof UiKitLineHeightValues;
-export type UiKitColorShade = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
-type ShadedColor = `dark.${UiKitColorShade}` | `slate.${UiKitColorShade}` | `gray.${UiKitColorShade}` | `red.${UiKitColorShade}` | `pink.${UiKitColorShade}` | `grape.${UiKitColorShade}` | `violet.${UiKitColorShade}` | `indigo.${UiKitColorShade}` | `blue.${UiKitColorShade}` | `cyan.${UiKitColorShade}` | `green.${UiKitColorShade}` | `lime.${UiKitColorShade}` | `yellow.${UiKitColorShade}` | `orange.${UiKitColorShade}` | `teal.${UiKitColorShade}`;
-export type UiKitDefaultThemeColor = 'dark' | 'slate' | 'gray' | 'red' | 'pink' | 'grape' | 'violet' | 'indigo' | 'blue' | 'cyan' | 'green' | 'lime' | 'yellow' | 'orange' | 'teal' | 'black' | 'white';
-export type UiKitColor = UiKitDefaultThemeColor | ShadedColor;
-export type UiKitTheme = 'light' | 'dark';
+export type NuanceSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type NuanceBreakpointsValues = Record<NuanceSize | 'base', string>;
+export type NuanceFontSizesValues = Record<NuanceSize, string>;
+export type NuanceRadiusValues = Record<NuanceSize | 'full', string>;
+export type NuanceSpacingValues = Record<NuanceSize, string>;
+export type NuanceShadowsValues = Record<NuanceSize, string>;
+export type NuanceLineHeightValues = Record<NuanceSize, string>;
+export type NuanceBreakpoint = keyof NuanceBreakpointsValues;
+export type NuanceFontSize = keyof NuanceFontSizesValues;
+export type NuanceRadius = keyof NuanceRadiusValues | number;
+export type NuanceSpacing = keyof NuanceSpacingValues | number;
+export type NuanceShadow = keyof NuanceShadowsValues;
+export type NuanceLineHeight = keyof NuanceLineHeightValues;
+export type NuanceColorShade = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
+type ShadedColor = `dark.${NuanceColorShade}` | `slate.${NuanceColorShade}` | `gray.${NuanceColorShade}` | `red.${NuanceColorShade}` | `pink.${NuanceColorShade}` | `grape.${NuanceColorShade}` | `violet.${NuanceColorShade}` | `indigo.${NuanceColorShade}` | `blue.${NuanceColorShade}` | `cyan.${NuanceColorShade}` | `green.${NuanceColorShade}` | `lime.${NuanceColorShade}` | `yellow.${NuanceColorShade}` | `orange.${NuanceColorShade}` | `teal.${NuanceColorShade}`;
+export type NuanceDefaultThemeColor = 'dark' | 'slate' | 'gray' | 'red' | 'pink' | 'grape' | 'violet' | 'indigo' | 'blue' | 'cyan' | 'green' | 'lime' | 'yellow' | 'orange' | 'teal' | 'black' | 'white';
+export type NuanceColor = NuanceDefaultThemeColor | ShadedColor;
+export type NuanceTheme = 'light' | 'dark';
 export interface UiKitGradient {
-    bg?: UiKitColor | string;
-    from: UiKitColor | string;
-    to: UiKitColor | string;
+    bg?: NuanceColor | string;
+    from: NuanceColor | string;
+    to: NuanceColor | string;
     deg?: number;
 }
 export {};

package/dist/runtime/utils/color-functions/get-gradient.d.ts

@@ -1,3 +1,3 @@
-import type { UiKitGradient, UiKitTheme } from '@nui/types';
-export declare function getGradient(gradient: UiKitGradient | undefined, theme: UiKitTheme): string;
-export declare function getGradientOutline(gradient: UiKitGradient | undefined, theme: UiKitTheme): string;
+import type { NuanceTheme, UiKitGradient } from '@nui/types';
+export declare function getGradient(gradient: UiKitGradient | undefined, theme: NuanceTheme): string;
+export declare function getGradientOutline(gradient: UiKitGradient | undefined, theme: NuanceTheme): string;

package/dist/runtime/utils/get-color-var.d.ts

@@ -1,2 +1,2 @@
-import type { UiKitColor, UiKitColorShade } from '@nui/types';
-export declare function getColorVar(color: UiKitColor, shade?: UiKitColorShade): string;
+import type { NuanceColor, NuanceColorShade } from '@nui/types';
+export declare function getColorVar(color: NuanceColor, shade?: NuanceColorShade): string;

package/dist/runtime/utils/parse-theme-color/parse-theme-color.d.ts

@@ -1,14 +1,14 @@
-import type { UiKitColorShade, UiKitTheme } from '@nui/types';
+import type { NuanceColorShade, NuanceTheme } from '@nui/types';
 interface ParseThemeColorResult {
     color: string;
     value: string;
-    shade: UiKitColorShade | undefined;
+    shade: NuanceColorShade | undefined;
     variable: `--${string}` | undefined;
     isThemeColor: boolean;
 }
 export declare function parseThemeColor({ color, theme, }: {
     color: unknown;
-    theme: UiKitTheme;
+    theme: NuanceTheme;
 }): ParseThemeColorResult;
-export declare function getThemeColor(color: string | undefined, theme: UiKitTheme): string;
+export declare function getThemeColor(color: string | undefined, theme: NuanceTheme): string;
 export {};

package/dist/runtime/utils/vars-resolver/create-variant-color-resolver.d.ts

@@ -1,4 +1,4 @@
-import type { UiKitColor, UiKitGradient, UiKitTheme } from '@nui/types';
+import type { NuanceColor, NuanceTheme, UiKitGradient } from '@nui/types';
 interface VariantColorResolverResult {
     background: string;
     hover: string;
@@ -6,9 +6,9 @@ interface VariantColorResolverResult {
     border: string;
 }
 export declare function createVariantColorResolver({ color, variant, gradient, theme, }: {
-    color: UiKitColor | string | undefined;
+    color: NuanceColor | string | undefined;
     variant: 'filled' | 'light' | 'outline' | 'subtle' | 'default' | 'gradient' | 'gradient-outline';
     gradient?: UiKitGradient;
-    theme: UiKitTheme;
+    theme: NuanceTheme;
 }): VariantColorResolverResult;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "nuance-ui",
-	"version": "0.1.2",
+	"version": "0.1.3",
 	"description": "A UI Library for Modern Web Apps, powered by Vue.",
 	"repository": {
 		"type": "git",