nuance-ui 0.2.10 → 0.2.11

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

@@ -2,5 +2,5 @@ export * from './create-strict-injection.js';
 export * from './use-active-link.js';
 export * from './use-date-config.js';
 export * from './use-selectable-group.js';
-export * from './use-style-resolver.js';
 export * from './use-theme.js';
+export * from './use-vars-resolver.js';

package/dist/runtime/composables/index.js

@@ -2,5 +2,5 @@ export * from "./create-strict-injection.js";
 export * from "./use-active-link.js";
 export * from "./use-date-config.js";
 export * from "./use-selectable-group.js";
-export * from "./use-style-resolver.js";
 export * from "./use-theme.js";
+export * from "./use-vars-resolver.js";

package/dist/runtime/composables/use-vars-resolver.d.ts

@@ -0,0 +1,4 @@
+import type { CssVariable, NuanceTheme, TransformVars } from '@nui/types';
+import type { ComputedRef } from 'vue';
+/** Reactive style object builder. */
+export declare function useVarsResolver<T extends Record<never, CssVariable>>(factory: (theme: NuanceTheme) => TransformVars<T>): ComputedRef<TransformVars<T>>;

package/dist/runtime/composables/use-vars-resolver.js

@@ -0,0 +1,6 @@
+import { computed } from "vue";
+import { useTheme } from "./use-theme.js";
+export function useVarsResolver(factory) {
+  const theme = useTheme();
+  return computed(() => factory(theme.value));
+}

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

@@ -1,6 +1,5 @@
 export type * from './styling';
 export type * from './theme';
-/** Map of component part names to user-provided class names. */
-export type Classes<Key extends string, Value = string | string[]> = Partial<Record<Key, Value>>;
 /** Value that may be synchronous or wrapped in a promise. */
 export type MaybePromise<T = unknown> = T | Promise<T>;
+export type AnyString = string & {};

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

@@ -1,4 +1,6 @@
 export type CssVariable = `--${string}`;
 export type TransformVars<V> = {
-    [Key in keyof V]: V[Key] extends CssVariable ? Record<V[Key], string | undefined> : never;
+    [Key in keyof V]: V[Key] extends CssVariable ? Record<V[Key], string | number | undefined> : never;
 };
+/** Map of component part names to user-provided class names. */
+export type Classes<Key extends string, Value = string | string[]> = Partial<Record<Key, Value>>;

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

@@ -1,17 +1,12 @@
+import type { AnyString } from '.';
 /** Standard Nuance size token. */
 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 NuanceBreakpoint = NuanceSize | 'base';
+export type NuanceFontSize = NuanceSize;
+export type NuanceRadius = NuanceSize | 'full' | number;
+export type NuanceSpacing = NuanceSize | number;
+export type NuanceShadow = NuanceSize;
+export type NuanceLineHeight = NuanceSize;
 /** Numeric shade index within a color palette, from lightest (0) to darkest (9). */
 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}` | `primary.${NuanceColorShade}`;
@@ -23,11 +18,11 @@ export type NuanceTheme = 'light' | 'dark';
 /** Linear gradient definition. */
 export interface NuanceGradient {
     /** Fallback background color rendered behind the gradient. */
-    bg?: NuanceColor | string;
+    bg?: NuanceColor | AnyString;
     /** Start color. */
-    from: NuanceColor | string;
+    from: NuanceColor | AnyString;
     /** End color. */
-    to: NuanceColor | string;
+    to: NuanceColor | AnyString;
     /** Gradient angle in degrees. */
     deg?: number;
 }

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

@@ -1,4 +1,4 @@
-import type { NuanceColor, NuanceGradient, NuanceTheme } from '@nui/types';
+import type { AnyString, NuanceColor, NuanceGradient, NuanceTheme } from '@nui/types';
 interface VariantColorResolverResult {
     /** Base background CSS value. */
     background: string;
@@ -18,7 +18,7 @@ interface VariantColorResolverResult {
  * default `--color-*` tokens when no explicit shade is provided.
  */
 export declare function createVariantColorResolver({ color, variant, gradient, theme, }: {
-    color: NuanceColor | string | undefined;
+    color: NuanceColor | AnyString | undefined;
     variant: 'filled' | 'light' | 'outline' | 'subtle' | 'default' | 'gradient' | 'gradient-outline' | 'dot';
     gradient?: NuanceGradient;
     theme: NuanceTheme;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "nuance-ui",
-	"version": "0.2.10",
+	"version": "0.2.11",
 	"description": "A modern Vue UI library inspired by the best of the React ecosystem.",
 	"repository": {
 		"type": "git",
@@ -77,7 +77,7 @@
 		}
 	},
 	"devDependencies": {
-		"@antfu/eslint-config": "^7.2.0",
+		"@antfu/eslint-config": "^8.2.0",
 		"@nuxt/devtools": "^3.1.1",
 		"@nuxt/eslint": "1.10.0",
 		"@nuxt/eslint-config": "^1.13.0",

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

@@ -1,5 +0,0 @@
-import type { NuanceTheme, TransformVars } from '@nui/types';
-/**
- * Builds a style object from a factory that receives the current theme.
- */
-export declare function useStyleResolver<T extends object>(factory: (theme: NuanceTheme) => TransformVars<T>): TransformVars<T>;

package/dist/runtime/composables/use-style-resolver.js

@@ -1,5 +0,0 @@
-import { useTheme } from "./use-theme.js";
-export function useStyleResolver(factory) {
-  const theme = useTheme();
-  return factory(theme.value);
-}