@vaneui/ui 0.2.0 → 0.2.1-alpha.20250802172458.e2b9257

package/dist/components/tests/prop-filtering.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/tests/prop-omission-edge-cases.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/components/tests/prop-omission.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/components/tests/prop-types-validation.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/tests/utils/propOmissionTestUtils.d.ts

@@ -0,0 +1,27 @@
+import { ComponentCategoryKey } from '../../ui/props/keys';
+/**
+ * Get all possible boolean props for a given set of component categories
+ */
+export declare function getAllBooleanPropsForCategories(categories: readonly ComponentCategoryKey[]): string[];
+/**
+ * Create test props object with all boolean props for given categories set to true
+ */
+export declare function createTestPropsWithAllBooleans(categories: readonly ComponentCategoryKey[]): Record<string, boolean>;
+/**
+ * Check if a DOM element has any of the boolean prop attributes that should be omitted
+ */
+export declare function checkForOmittedProps(element: Element | null, categories: readonly ComponentCategoryKey[]): {
+    hasInvalidProps: boolean;
+    invalidProps: string[];
+};
+/**
+ * Check if element has the standard allowed props that should never be omitted
+ */
+export declare function checkForRequiredProps(element: Element | null): {
+    hasRequiredProps: boolean;
+    missingProps: string[];
+};
+/**
+ * Create a comprehensive test case for prop omission
+ */
+export declare function createPropOmissionTest(componentName: string, categories: readonly ComponentCategoryKey[], renderComponent: (props: any) => any, querySelector?: string): () => void;

package/dist/components/tests/visual-decoration.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/ui/props/keys.d.ts

@@ -1,4 +1,14 @@
-export declare const COMPONENT_PROPS_CATEGORY: readonly ["appearance", "border", "breakpoint", "display", "flexDirection", "fontFamily", "fontStyle", "fontWeight", "gap", "hide", "items", "justify", "link", "mode", "overflow", "padding", "position", "reverse", "ring", "shadow", "shape", "size", "textAlign", "textDecoration", "textTransform", "transparent", "variant", "wrap"];
+export declare const LAYOUT_CORE: readonly ["size", "hide", "items", "justify", "position", "display", "overflow"];
+export declare const LAYOUT_FLEX: readonly ["wrap", "gap", "flexDirection", "reverse"];
+export declare const PADDING: readonly ["padding"];
+export declare const BREAKPOINT: readonly ["breakpoint"];
+export declare const VISUAL_CORE: readonly ["appearance", "transparent"];
+export declare const VISUAL_DECORATION: readonly ["border", "shadow", "ring"];
+export declare const SHAPE: readonly ["shape"];
+export declare const TYPOGRAPHY_STYLE: readonly ["fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign"];
+export declare const LINK: readonly ["link"];
+export declare const VARIANT: readonly ["variant"];
+export declare const COMPONENT_PROPS_CATEGORY: readonly ["appearance", "transparent", "wrap", "gap", "flexDirection", "reverse", "fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "size", "hide", "items", "justify", "position", "display", "overflow", "breakpoint", "link", "padding", "border", "shadow", "ring", "shape", "variant", "mode"];
 export type ComponentCategoryKey = typeof COMPONENT_PROPS_CATEGORY[number];
 export declare const ComponentKeys: {
     readonly appearance: readonly ["default", "accent", "primary", "secondary", "tertiary", "success", "danger", "warning", "info"];
@@ -20,7 +30,6 @@ export declare const ComponentKeys: {
     readonly position: readonly ["relative", "absolute", "fixed", "sticky", "static"];
     readonly reverse: readonly ["reverse"];
     readonly ring: readonly ["ring", "noRing"];
-    readonly rounded: readonly ["rounded"];
     readonly shadow: readonly ["shadow", "noShadow"];
     readonly shape: readonly ["pill", "sharp", "rounded"];
     readonly size: readonly ["xs", "sm", "md", "lg", "xl"];
@@ -57,22 +66,23 @@ export type JustifyKey = typeof ComponentKeys.justify[number];
 export type WrapKey = typeof ComponentKeys.wrap[number];
 export type DisplayKey = typeof ComponentKeys.display[number];
 export type OverflowKey = typeof ComponentKeys.overflow[number];
-export declare const BASE_COMPONENT_CATEGORIES: ComponentCategoryKey[];
-export declare const TYPOGRAPHY_CATEGORIES: ComponentCategoryKey[];
-export declare const LIST_CATEGORIES: ComponentCategoryKey[];
-export declare const INTERACTIVE_CATEGORIES: ComponentCategoryKey[];
-export declare const BUTTON_CATEGORIES: ComponentCategoryKey[];
-export declare const BADGE_CATEGORIES: ComponentCategoryKey[];
-export declare const CHIP_CATEGORIES: ComponentCategoryKey[];
-export declare const CONTAINER_CATEGORIES: ComponentCategoryKey[];
-export declare const FLEX_CONTAINER_CATEGORIES: ComponentCategoryKey[];
-export declare const GRID_CATEGORIES: ComponentCategoryKey[];
-export declare const ROW_CATEGORIES: ComponentCategoryKey[];
-export declare const COL_CATEGORIES: ComponentCategoryKey[];
-export declare const STACK_CATEGORIES: ComponentCategoryKey[];
-export declare const CARD_CATEGORIES: ComponentCategoryKey[];
-export declare const DIVIDER_CATEGORIES: ComponentCategoryKey[];
-export declare const SECTION_CATEGORIES: ComponentCategoryKey[];
+export declare const LAYOUT_FULL: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse"];
+export declare const VISUAL_FULL: readonly ["appearance", "transparent", "border", "shadow", "ring", "shape"];
+export declare const TYPOGRAPHY_FULL: readonly ["fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "link"];
+export declare const INTERACTIVE_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "appearance", "transparent", "border", "shadow", "ring", "shape", "fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "padding", "variant"];
+export declare const BUTTON_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "appearance", "transparent", "border", "shadow", "ring", "shape", "fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "padding", "variant"];
+export declare const BADGE_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "appearance", "transparent", "border", "shadow", "ring", "shape", "fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "padding", "variant"];
+export declare const CHIP_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "appearance", "transparent", "border", "shadow", "ring", "shape", "fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "padding", "variant"];
+export declare const TYPOGRAPHY_CATEGORIES: readonly ["fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "link", "size", "hide", "items", "justify", "position", "display", "overflow", "appearance", "transparent"];
+export declare const LIST_CATEGORIES: readonly ["fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "link", "size", "hide", "items", "justify", "position", "display", "overflow", "appearance", "transparent", "padding"];
+export declare const GRID_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "appearance", "transparent"];
+export declare const CONTAINER_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "appearance", "transparent", "border", "shadow", "ring", "shape"];
+export declare const COL_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "appearance", "transparent", "border", "shadow", "ring", "shape"];
+export declare const ROW_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "breakpoint", "appearance", "transparent", "border", "shadow", "ring", "shape"];
+export declare const STACK_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "breakpoint", "padding", "appearance", "transparent", "border", "shadow", "ring", "shape"];
+export declare const CARD_CATEGORIES: readonly ["fontWeight", "fontStyle", "textDecoration", "textTransform", "fontFamily", "textAlign", "link", "size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "breakpoint", "appearance", "transparent", "border", "shadow", "ring", "shape", "padding"];
+export declare const DIVIDER_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "appearance", "transparent", "padding"];
+export declare const SECTION_CATEGORIES: readonly ["size", "hide", "items", "justify", "position", "display", "overflow", "wrap", "gap", "flexDirection", "reverse", "appearance", "transparent", "border", "shadow", "ring", "shape", "padding", "breakpoint"];
 export type CategoryProps = {
     [K in ComponentCategoryKey]?: (typeof ComponentKeys)[K][number];
 };

package/dist/components/ui/theme/appearance/genericVariantTheme.d.ts

@@ -1,7 +1,7 @@
 import { BaseTheme } from "../common/baseTheme";
 import type { CategoryProps } from "../../props";
 import { VariantKey } from "../../props";
-import { TextAppearanceTheme, UIElementTextAppearanceTheme } from "./textAppearanceTheme";
+import { TextAppearanceTheme } from "./textAppearanceTheme";
 import { ShadowAppearanceTheme } from "./shadowAppearanceTheme";
 export interface GenericVariantTheme<T extends BaseTheme> extends Record<VariantKey, T> {
 }
@@ -9,14 +9,14 @@ export declare class GenericVariantTheme<T extends BaseTheme> extends BaseTheme
     private constructor();
     private static filterToUIElementKeys;
     getClasses(extractedKeys: CategoryProps): string[];
-    static createUIElementTextTheme(): GenericVariantTheme<UIElementTextAppearanceTheme>;
+    static createUIElementTextTheme(): GenericVariantTheme<TextAppearanceTheme>;
     static createUIElementShadowTheme(): GenericVariantTheme<ShadowAppearanceTheme>;
     static createBorderAppearanceTheme(): GenericVariantTheme<TextAppearanceTheme>;
-    static createUIElementBorderTheme(): GenericVariantTheme<UIElementTextAppearanceTheme>;
+    static createUIElementBorderTheme(): GenericVariantTheme<TextAppearanceTheme>;
     static createRingAppearanceTheme(): GenericVariantTheme<TextAppearanceTheme>;
-    static createUIElementRingTheme(): GenericVariantTheme<UIElementTextAppearanceTheme>;
+    static createUIElementRingTheme(): GenericVariantTheme<TextAppearanceTheme>;
     static createBgAppearanceTheme(): GenericVariantTheme<TextAppearanceTheme>;
-    static createUIElementBgAppearanceTheme(): GenericVariantTheme<UIElementTextAppearanceTheme>;
+    static createUIElementBgAppearanceTheme(): GenericVariantTheme<TextAppearanceTheme>;
     static createSimpleBgAppearanceTheme(): GenericVariantTheme<TextAppearanceTheme>;
-    static createSimpleUIElementBgAppearanceTheme(): GenericVariantTheme<UIElementTextAppearanceTheme>;
+    static createSimpleUIElementBgAppearanceTheme(): GenericVariantTheme<TextAppearanceTheme>;
 }

package/dist/components/ui/theme/appearance/textAppearanceTheme.d.ts

@@ -3,15 +3,8 @@ import type { CategoryProps } from "../../props";
 import { ModeKey, AppearanceKey } from "../../props";
 export interface TextAppearanceTheme extends Record<AppearanceKey, Record<ModeKey, string>> {
 }
-export interface UIElementTextAppearanceTheme extends Record<AppearanceKey, Record<ModeKey, string>> {
-}
 export declare class TextAppearanceTheme extends BaseTheme {
     private constructor();
     getClasses(extractedKeys: CategoryProps): string[];
     static createTheme(src?: Partial<Record<ModeKey, Partial<Record<AppearanceKey, string>>>>): TextAppearanceTheme;
 }
-export declare class UIElementTextAppearanceTheme extends BaseTheme {
-    private constructor();
-    getClasses(extractedKeys: CategoryProps): string[];
-    static createTheme(src?: Partial<Record<ModeKey, Partial<Record<AppearanceKey, string>>>>): UIElementTextAppearanceTheme;
-}

package/dist/components/ui/theme/badgeTheme.d.ts

@@ -7,7 +7,7 @@ import { BorderTheme } from "./layout/borderTheme";
 import { RingTheme } from "./layout/ringTheme";
 import { PxTheme } from "./size/pxTheme";
 import { PyTheme } from "./size/pyTheme";
-import { UIElementTextAppearanceTheme } from "./appearance/textAppearanceTheme";
+import { TextAppearanceTheme } from "./appearance/textAppearanceTheme";
 import { GenericVariantTheme } from "./appearance/genericVariantTheme";
 import { ShadowAppearanceTheme } from "./appearance/shadowAppearanceTheme";
 export interface BadgeTheme extends BaseTypographyComponentTheme {
@@ -18,10 +18,10 @@ export interface BadgeTheme extends BaseTypographyComponentTheme {
         gap: GapTheme;
     };
     appearance: {
-        background: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        text: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        border: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        ring: GenericVariantTheme<UIElementTextAppearanceTheme>;
+        background: GenericVariantTheme<TextAppearanceTheme>;
+        text: GenericVariantTheme<TextAppearanceTheme>;
+        border: GenericVariantTheme<TextAppearanceTheme>;
+        ring: GenericVariantTheme<TextAppearanceTheme>;
         shadow: GenericVariantTheme<ShadowAppearanceTheme>;
     };
     layout: DefaultLayoutThemes & {

package/dist/components/ui/theme/buttonTheme.d.ts

@@ -8,7 +8,7 @@ import { RingTheme } from "./layout/ringTheme";
 import { PxTheme } from "./size/pxTheme";
 import { PyTheme } from "./size/pyTheme";
 import { GenericVariantTheme } from "./appearance/genericVariantTheme";
-import { UIElementTextAppearanceTheme } from "./appearance/textAppearanceTheme";
+import { TextAppearanceTheme } from "./appearance/textAppearanceTheme";
 import { ShadowAppearanceTheme } from "./appearance/shadowAppearanceTheme";
 export interface ButtonTheme extends BaseTypographyComponentTheme {
     size: {
@@ -18,10 +18,10 @@ export interface ButtonTheme extends BaseTypographyComponentTheme {
         gap: GapTheme;
     };
     appearance: {
-        background: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        text: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        border: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        ring: GenericVariantTheme<UIElementTextAppearanceTheme>;
+        background: GenericVariantTheme<TextAppearanceTheme>;
+        text: GenericVariantTheme<TextAppearanceTheme>;
+        border: GenericVariantTheme<TextAppearanceTheme>;
+        ring: GenericVariantTheme<TextAppearanceTheme>;
         shadow: GenericVariantTheme<ShadowAppearanceTheme>;
     };
     layout: DefaultLayoutThemes & {

package/dist/components/ui/theme/chipTheme.d.ts

@@ -8,7 +8,7 @@ import { RingTheme } from "./layout/ringTheme";
 import { PxTheme } from "./size/pxTheme";
 import { PyTheme } from "./size/pyTheme";
 import { GenericVariantTheme } from "./appearance/genericVariantTheme";
-import { UIElementTextAppearanceTheme } from "./appearance/textAppearanceTheme";
+import { TextAppearanceTheme } from "./appearance/textAppearanceTheme";
 import { ShadowAppearanceTheme } from "./appearance/shadowAppearanceTheme";
 export interface ChipTheme extends BaseTypographyComponentTheme {
     size: {
@@ -18,10 +18,10 @@ export interface ChipTheme extends BaseTypographyComponentTheme {
         gap: GapTheme;
     };
     appearance: {
-        background: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        text: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        border: GenericVariantTheme<UIElementTextAppearanceTheme>;
-        ring: GenericVariantTheme<UIElementTextAppearanceTheme>;
+        background: GenericVariantTheme<TextAppearanceTheme>;
+        text: GenericVariantTheme<TextAppearanceTheme>;
+        border: GenericVariantTheme<TextAppearanceTheme>;
+        ring: GenericVariantTheme<TextAppearanceTheme>;
         shadow: GenericVariantTheme<ShadowAppearanceTheme>;
     };
     layout: DefaultLayoutThemes & {

package/dist/components/ui/theme/colTheme.d.ts

@@ -4,6 +4,11 @@ import { ColProps } from "../props/props";
 import { GapTheme } from "./size/gapTheme";
 import { WrapTheme } from "./layout/wrapTheme";
 import { BgAppearanceTheme } from "./appearance/bgAppearanceTheme";
+import { BorderTheme } from "./layout/borderTheme";
+import { RingTheme } from "./layout/ringTheme";
+import { RadiusTheme } from "./layout/radiusTheme";
+import { GenericVariantTheme } from "./appearance/genericVariantTheme";
+import { TextAppearanceTheme } from "./appearance/textAppearanceTheme";
 export interface ColTheme extends BaseComponentTheme {
     size: {
         gap: GapTheme;
@@ -11,9 +16,14 @@ export interface ColTheme extends BaseComponentTheme {
     layout: DefaultLayoutThemes & {
         wrap: WrapTheme;
         direction: DirectionTheme;
+        border: BorderTheme;
+        ring: RingTheme;
+        radius: RadiusTheme;
     };
     appearance: {
         background: BgAppearanceTheme;
+        border: GenericVariantTheme<TextAppearanceTheme>;
+        ring: GenericVariantTheme<TextAppearanceTheme>;
     };
 }
 export declare const defaultColTheme: ComponentTheme<ColProps, ColTheme>;

package/dist/components/ui/theme/rowTheme.d.ts

@@ -5,6 +5,11 @@ import { RowProps } from "../props/props";
 import { BreakpointTheme } from "./size/breakpointTheme";
 import { BgAppearanceTheme } from "./appearance/bgAppearanceTheme";
 import { DirectionTheme } from "./layout/directionTheme";
+import { BorderTheme } from "./layout/borderTheme";
+import { RingTheme } from "./layout/ringTheme";
+import { RadiusTheme } from "./layout/radiusTheme";
+import { GenericVariantTheme } from "./appearance/genericVariantTheme";
+import { TextAppearanceTheme } from "./appearance/textAppearanceTheme";
 export interface RowTheme extends BaseComponentTheme {
     size: {
         gap: GapTheme;
@@ -13,9 +18,14 @@ export interface RowTheme extends BaseComponentTheme {
     layout: DefaultLayoutThemes & {
         wrap: WrapTheme;
         direction: DirectionTheme;
+        border: BorderTheme;
+        ring: RingTheme;
+        radius: RadiusTheme;
     };
     appearance: {
         background: BgAppearanceTheme;
+        border: GenericVariantTheme<TextAppearanceTheme>;
+        ring: GenericVariantTheme<TextAppearanceTheme>;
     };
 }
 export declare const defaultRowTheme: ComponentTheme<RowProps, RowTheme>;

package/dist/components/ui/theme/stackTheme.d.ts

@@ -6,6 +6,11 @@ import { GapTheme } from "./size/gapTheme";
 import { PxTheme } from "./size/pxTheme";
 import { PyTheme } from "./size/pyTheme";
 import { BgAppearanceTheme } from "./appearance/bgAppearanceTheme";
+import { BorderTheme } from "./layout/borderTheme";
+import { RingTheme } from "./layout/ringTheme";
+import { RadiusTheme } from "./layout/radiusTheme";
+import { GenericVariantTheme } from "./appearance/genericVariantTheme";
+import { TextAppearanceTheme } from "./appearance/textAppearanceTheme";
 export interface StackTheme extends BaseComponentTheme {
     size: {
         px: PxTheme;
@@ -15,9 +20,14 @@ export interface StackTheme extends BaseComponentTheme {
     layout: DefaultLayoutThemes & {
         wrap: WrapTheme;
         direction: DirectionTheme;
+        border: BorderTheme;
+        ring: RingTheme;
+        radius: RadiusTheme;
     };
     appearance: {
         background: BgAppearanceTheme;
+        border: GenericVariantTheme<TextAppearanceTheme>;
+        ring: GenericVariantTheme<TextAppearanceTheme>;
     };
 }
 export declare const defaultStackTheme: ComponentTheme<StackProps, StackTheme>;

package/dist/components/utils/componentUtils.d.ts

@@ -5,7 +5,3 @@ import { ComponentKeys, ComponentCategoryKey } from '../ui/props';
  * Returns the specific key type for the given category.
  */
 export declare function pickFirstTruthyKeyByCategory<T extends ComponentCategoryKey>(props: Record<string, any>, defaults: Record<string, any>, category: T): typeof ComponentKeys[T][number] | undefined;
-/**
- * Generic function to extract keys for any component based on its categories
- */
-export declare function extractKeysFromCategories<T extends readonly ComponentCategoryKey[]>(props: Record<string, boolean>, defaults: Record<string, boolean>, categories: T): Record<string, string | undefined>;

package/dist/index.d.ts

@@ -4,5 +4,6 @@ export { Divider } from "./components/ui/divider";
 export { Chip } from "./components/ui/chip";
 export { Section, Container, Col, Row, Stack, Grid3, Grid4, Card } from "./components/ui/layout";
 export { Text, Title, Link, List, ListItem, SectionTitle, PageTitle } from "./components/ui/typography";
+export { ComponentKeys } from "./components/ui/props/keys";
 export { ThemeProvider, useTheme, defaultTheme, COMPONENT, type ThemeProps, type ThemeDefaults, type ThemeProviderProps, type PartialTheme, type ComponentKey, } from './components/themeContext';
 export * from "./components/ui/props/index";