ux4g-components-web 1.4.0 → 1.5.0

package/dist/__tests__/types.phase10.test.js

@@ -0,0 +1,76 @@
+// src/__tests__/types.phase10.test.ts
+// Unit tests for all Phase 10 build functions
+// Requirements: 6.10, 6.11, 6.12, 6.13, 6.14, 6.15, 6.16, 6.17, 6.18, 6.19
+import { buildSlotGridClasses, buildFooterClasses, buildResultListRowClasses, } from '../../src/types';
+// ── SlotGrid ──────────────────────────────────────────────────────────────────
+describe('buildSlotGridClasses', () => {
+    it("no args -> 'ux4g-time-slot-weekly-container'", () => {
+        expect(buildSlotGridClasses()).toBe('ux4g-time-slot-weekly-container');
+    });
+    it("variant='weekly' -> 'ux4g-time-slot-weekly-container'", () => {
+        expect(buildSlotGridClasses('weekly')).toBe('ux4g-time-slot-weekly-container');
+    });
+    it("variant='compact' -> 'ux4g-time-slot-compact-container'", () => {
+        expect(buildSlotGridClasses('compact')).toBe('ux4g-time-slot-compact-container');
+    });
+    it("variant='weekly' with extra -> 'ux4g-time-slot-weekly-container my'", () => {
+        expect(buildSlotGridClasses('weekly', 'my')).toBe('ux4g-time-slot-weekly-container my');
+    });
+    it("variant='compact' with extra -> 'ux4g-time-slot-compact-container my'", () => {
+        expect(buildSlotGridClasses('compact', 'my')).toBe('ux4g-time-slot-compact-container my');
+    });
+});
+// ── Footer ────────────────────────────────────────────────────────────────────
+describe('buildFooterClasses', () => {
+    it("no args -> ''", () => {
+        expect(buildFooterClasses()).toBe('');
+    });
+    it("theme='default' -> ''", () => {
+        expect(buildFooterClasses('default')).toBe('');
+    });
+    it("theme='primary' -> 'ux4g-footer-primary'", () => {
+        expect(buildFooterClasses('primary')).toBe('ux4g-footer-primary');
+    });
+    it("theme='dark' -> 'ux4g-footer-dark'", () => {
+        expect(buildFooterClasses('dark')).toBe('ux4g-footer-dark');
+    });
+    it("theme='primary' with extra -> 'ux4g-footer-primary extra'", () => {
+        expect(buildFooterClasses('primary', 'extra')).toBe('ux4g-footer-primary extra');
+    });
+    it("theme='dark' with extra -> 'ux4g-footer-dark extra'", () => {
+        expect(buildFooterClasses('dark', 'extra')).toBe('ux4g-footer-dark extra');
+    });
+    it("theme='default' with extra -> 'extra'", () => {
+        expect(buildFooterClasses('default', 'extra')).toBe('extra');
+    });
+});
+// ── ResultListRow ─────────────────────────────────────────────────────────────
+describe('buildResultListRowClasses', () => {
+    it("no args -> 'ux4g-result-list'", () => {
+        expect(buildResultListRowClasses()).toBe('ux4g-result-list');
+    });
+    it("variation='default' -> 'ux4g-result-list'", () => {
+        expect(buildResultListRowClasses('default')).toBe('ux4g-result-list');
+    });
+    it("variation='v1' -> 'ux4g-result-list ux4g-result-list-v1'", () => {
+        expect(buildResultListRowClasses('v1')).toBe('ux4g-result-list ux4g-result-list-v1');
+    });
+    it("variation='v2' -> 'ux4g-result-list ux4g-result-list-v2'", () => {
+        expect(buildResultListRowClasses('v2')).toBe('ux4g-result-list ux4g-result-list-v2');
+    });
+    it("variation='v3' -> 'ux4g-result-list ux4g-result-list-v3'", () => {
+        expect(buildResultListRowClasses('v3')).toBe('ux4g-result-list ux4g-result-list-v3');
+    });
+    it("variation='v4' -> 'ux4g-result-list ux4g-result-list-v4'", () => {
+        expect(buildResultListRowClasses('v4')).toBe('ux4g-result-list ux4g-result-list-v4');
+    });
+    it("variation='v5' -> 'ux4g-result-list ux4g-result-list-v5'", () => {
+        expect(buildResultListRowClasses('v5')).toBe('ux4g-result-list ux4g-result-list-v5');
+    });
+    it("variation='v3' with extra -> 'ux4g-result-list ux4g-result-list-v3 extra'", () => {
+        expect(buildResultListRowClasses('v3', 'extra')).toBe('ux4g-result-list ux4g-result-list-v3 extra');
+    });
+    it("variation='v5' with extra -> 'ux4g-result-list ux4g-result-list-v5 extra'", () => {
+        expect(buildResultListRowClasses('v5', 'extra')).toBe('ux4g-result-list ux4g-result-list-v5 extra');
+    });
+});

package/dist/__tests__/types.phase3.property.test.d.ts

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

package/dist/__tests__/types.phase3.property.test.js

@@ -0,0 +1,83 @@
+/**
+ * Property-based tests for Phase 3 build functions
+ * Properties 1-6
+ * Tag: Feature: ux4g-phase3-components
+ */
+import * as fc from 'fast-check';
+import { buildLinkClasses, buildBadgeClasses, buildAvatarClasses, buildImageContainerClasses, } from '../../src/types';
+const allLinkVariants = ['default', 'neutral'];
+const allLinkSizes = ['sm', 'md'];
+const allBadgeTypes = ['dot', 'icon', 'digit'];
+const allBadgeColors = ['primary', 'success', 'warning', 'danger', 'info', 'secondary', 'tertiary', 'neutral'];
+const allBadgeSizes = ['s', 'm', 'l', 'profile-l', 'profile-xl', 'profile-2xl', 'profile-3xl'];
+const allAvatarTypes = ['status', 'profile', 'group'];
+const allAvatarSizes = ['xs', 's', 'm', 'l', 'xl', '2xl', '3xl'];
+const allImageRatios = ['1-1', '4-3', '3-2', '16-10', '16-9', '2-1', '5-2', '3-1', '1-16', '2-3', '3-4'];
+/**
+ * Property 1: Link class matches variant × size
+ * Tag: Feature: ux4g-phase3-components, Property 1
+ */
+describe('Property 1: Link class matches variant × size', () => {
+    it('Feature: ux4g-phase3-components, Property 1', () => {
+        fc.assert(fc.property(fc.constantFrom(...allLinkVariants), fc.constantFrom(...allLinkSizes), (variant, size) => {
+            const result = buildLinkClasses(variant, size);
+            if (variant === 'neutral') {
+                return result.includes('neutral');
+            }
+            else {
+                return !result.includes('neutral');
+            }
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 2: Badge class contains type and color substrings
+ * Property 3: Badge size class appended when provided
+ * Tag: Feature: ux4g-phase3-components, Property 2 & 3
+ */
+describe('Property 2: Badge class contains type and color substrings', () => {
+    it('Feature: ux4g-phase3-components, Property 2', () => {
+        fc.assert(fc.property(fc.constantFrom(...allBadgeTypes), fc.constantFrom(...allBadgeColors), (type, color) => {
+            const result = buildBadgeClasses(type, color);
+            return result.includes(`ux4g-badge-${type}-${color}`);
+        }), { numRuns: 20 });
+    });
+});
+describe('Property 3: Badge size class appended when provided', () => {
+    it('Feature: ux4g-phase3-components, Property 3', () => {
+        fc.assert(fc.property(fc.constantFrom(...allBadgeTypes), fc.constantFrom(...allBadgeColors), fc.constantFrom(...allBadgeSizes), (type, color, size) => {
+            const result = buildBadgeClasses(type, color, size);
+            return result.includes(`ux4g-badge-${size}`);
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 4: Avatar group class is standalone
+ * Property 5: Avatar status/profile always includes base class
+ * Tag: Feature: ux4g-phase3-components, Property 4 & 5
+ */
+describe('Property 4: Avatar group class is standalone', () => {
+    it('Feature: ux4g-phase3-components, Property 4', () => {
+        expect(buildAvatarClasses('group')).toBe('ux4g-avatar-group');
+    });
+});
+describe('Property 5: Avatar status/profile always includes base class', () => {
+    it('Feature: ux4g-phase3-components, Property 5', () => {
+        fc.assert(fc.property(fc.constantFrom('status', 'profile'), fc.option(fc.constantFrom(...allAvatarSizes), { nil: undefined }), (avatarType, size) => {
+            const result = buildAvatarClasses(avatarType, size);
+            return result.startsWith('ux4g-avatar ');
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 6: Image container class contains ratio when provided
+ * Tag: Feature: ux4g-phase3-components, Property 6
+ */
+describe('Property 6: Image container class contains ratio when provided', () => {
+    it('Feature: ux4g-phase3-components, Property 6', () => {
+        fc.assert(fc.property(fc.constantFrom(...allImageRatios), (ratio) => {
+            const result = buildImageContainerClasses(ratio);
+            return result.includes(`ux4g-ratio-${ratio}`);
+        }), { numRuns: 20 });
+    });
+});

package/dist/__tests__/types.phase3.test.d.ts

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

package/dist/__tests__/types.phase3.test.js

@@ -0,0 +1,76 @@
+/**
+ * Unit tests for Phase 3 build functions
+ * Validates: Requirements 4.3, 4.7, 4.10, 4.12
+ */
+import { buildLinkClasses, buildBadgeClasses, buildAvatarClasses, buildImageContainerClasses, } from '../../src/types';
+describe('buildLinkClasses', () => {
+    it('default variant + sm → ux4g-text-link-sm', () => {
+        expect(buildLinkClasses('default', 'sm')).toBe('ux4g-text-link-sm');
+    });
+    it('default variant + md → ux4g-text-link-md', () => {
+        expect(buildLinkClasses('default', 'md')).toBe('ux4g-text-link-md');
+    });
+    it('neutral variant + sm → ux4g-text-link-neutral-sm', () => {
+        expect(buildLinkClasses('neutral', 'sm')).toBe('ux4g-text-link-neutral-sm');
+    });
+    it('neutral variant + md → ux4g-text-link-neutral-md', () => {
+        expect(buildLinkClasses('neutral', 'md')).toBe('ux4g-text-link-neutral-md');
+    });
+    it('appends extra class when provided', () => {
+        expect(buildLinkClasses('default', 'sm', 'my-class')).toBe('ux4g-text-link-sm my-class');
+    });
+});
+describe('buildBadgeClasses', () => {
+    it('dot + primary → ux4g-badge-dot-primary', () => {
+        expect(buildBadgeClasses('dot', 'primary')).toBe('ux4g-badge-dot-primary');
+    });
+    it('icon + success + m → ux4g-badge-icon-success ux4g-badge-m', () => {
+        expect(buildBadgeClasses('icon', 'success', 'm')).toBe('ux4g-badge-icon-success ux4g-badge-m');
+    });
+    it('digit + danger + profile-xl → ux4g-badge-digit-danger ux4g-badge-profile-xl', () => {
+        expect(buildBadgeClasses('digit', 'danger', 'profile-xl')).toBe('ux4g-badge-digit-danger ux4g-badge-profile-xl');
+    });
+    it('no size → no size class appended', () => {
+        expect(buildBadgeClasses('dot', 'neutral')).toBe('ux4g-badge-dot-neutral');
+    });
+    it('appends extra class when provided', () => {
+        expect(buildBadgeClasses('dot', 'primary', undefined, 'extra')).toBe('ux4g-badge-dot-primary extra');
+    });
+});
+describe('buildAvatarClasses', () => {
+    it('group → ux4g-avatar-group (no base class)', () => {
+        expect(buildAvatarClasses('group')).toBe('ux4g-avatar-group');
+    });
+    it('status + s → ux4g-avatar ux4g-avatar-status ux4g-avatar-s', () => {
+        expect(buildAvatarClasses('status', 's')).toBe('ux4g-avatar ux4g-avatar-status ux4g-avatar-s');
+    });
+    it('profile + xl → ux4g-avatar ux4g-avatar-profile ux4g-avatar-xl', () => {
+        expect(buildAvatarClasses('profile', 'xl')).toBe('ux4g-avatar ux4g-avatar-profile ux4g-avatar-xl');
+    });
+    it('status without size → ux4g-avatar ux4g-avatar-status', () => {
+        expect(buildAvatarClasses('status')).toBe('ux4g-avatar ux4g-avatar-status');
+    });
+    it('group with extra → ux4g-avatar-group extra', () => {
+        expect(buildAvatarClasses('group', undefined, 'extra')).toBe('ux4g-avatar-group extra');
+    });
+});
+describe('buildImageContainerClasses', () => {
+    it('no args → empty string', () => {
+        expect(buildImageContainerClasses()).toBe('');
+    });
+    it('ratio only → ux4g-ratio-16-9', () => {
+        expect(buildImageContainerClasses('16-9')).toBe('ux4g-ratio-16-9');
+    });
+    it('ratio + rounded + overlay → ux4g-img-overlay ux4g-img-rounded ux4g-ratio-16-9', () => {
+        expect(buildImageContainerClasses('16-9', true, true)).toBe('ux4g-img-overlay ux4g-img-rounded ux4g-ratio-16-9');
+    });
+    it('rounded only → ux4g-img-rounded', () => {
+        expect(buildImageContainerClasses(undefined, true)).toBe('ux4g-img-rounded');
+    });
+    it('overlay only → ux4g-img-overlay', () => {
+        expect(buildImageContainerClasses(undefined, false, true)).toBe('ux4g-img-overlay');
+    });
+    it('appends extra class when provided', () => {
+        expect(buildImageContainerClasses('4-3', false, false, 'extra')).toBe('ux4g-ratio-4-3 extra');
+    });
+});

package/dist/__tests__/types.phase4.property.test.d.ts

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

package/dist/__tests__/types.phase4.property.test.js

@@ -0,0 +1,119 @@
+/**
+ * Property-based tests for Phase 4 build functions
+ *
+ * Property 1: Chip class contains chipType and size substrings
+ * Property 2: Chip active class appended when active=true
+ * Property 3: Chip xs size clamped to sm for filter/choice types
+ * Property 4: Tag class contains variant and color substrings
+ * Property 5: Tag small class appended when small=true
+ * Property 6: Divider class matches orientation
+ * Property 7: Breadcrumb class contains separator substring
+ */
+import * as fc from 'fast-check';
+import { buildChipClasses, buildTagClasses, buildDividerClasses, buildBreadcrumbClasses, } from '../../src/types';
+const allChipTypes = ['filter', 'choice', 'input'];
+const allChipSizes = ['md', 'sm', 'xs'];
+const allTagVariants = ['tonal', 'filled', 'outline', 'text'];
+const allTagColors = ['neutral', 'brand', 'success', 'warning', 'error', 'info'];
+/**
+ * Property 1: Chip class contains chipType and size substrings
+ * Tag: Feature: ux4g-phase4-components, Property 1
+ * Validates: Requirements 3.6, 4.3
+ */
+describe('Property 1: Chip class contains chipType and size substrings', () => {
+    it('Feature: ux4g-phase4-components, Property 1', () => {
+        fc.assert(fc.property(fc.constantFrom(...allChipTypes), fc.constantFrom(...allChipSizes), (chipType, size) => {
+            const result = buildChipClasses(chipType, size);
+            const effectiveSize = (chipType !== 'input' && size === 'xs') ? 'sm' : size;
+            return result.includes(chipType) && result.includes(effectiveSize);
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 2: Chip active class appended when active=true
+ * Tag: Feature: ux4g-phase4-components, Property 2
+ * Validates: Requirements 3.7, 5.5
+ */
+describe('Property 2: Chip active class appended when active=true', () => {
+    it('Feature: ux4g-phase4-components, Property 2', () => {
+        fc.assert(fc.property(fc.constantFrom(...allChipTypes), fc.constantFrom(...allChipSizes), fc.boolean(), (chipType, size, active) => {
+            const result = buildChipClasses(chipType, size, active);
+            if (active) {
+                return result.includes('active');
+            }
+            else {
+                return !result.includes('active');
+            }
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 3: Chip xs size clamped to sm for filter/choice types
+ * Tag: Feature: ux4g-phase4-components, Property 3
+ * Validates: Requirements 4.3, 10.8
+ */
+describe('Property 3: Chip xs size clamped to sm for filter/choice types', () => {
+    it('Feature: ux4g-phase4-components, Property 3', () => {
+        fc.assert(fc.property(fc.constantFrom('filter', 'choice'), (chipType) => {
+            const result = buildChipClasses(chipType, 'xs');
+            return result.includes('chip-sm') && !result.includes('chip-xs');
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 4: Tag class contains variant and color substrings
+ * Tag: Feature: ux4g-phase4-components, Property 4
+ * Validates: Requirements 3.8, 4.6
+ */
+describe('Property 4: Tag class contains variant and color substrings', () => {
+    it('Feature: ux4g-phase4-components, Property 4', () => {
+        fc.assert(fc.property(fc.constantFrom(...allTagVariants), fc.constantFrom(...allTagColors), (variant, color) => {
+            const result = buildTagClasses(variant, color);
+            return result.includes(variant) && result.includes(color);
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 5: Tag small class appended when small=true
+ * Tag: Feature: ux4g-phase4-components, Property 5
+ * Validates: Requirements 3.9, 6.5
+ */
+describe('Property 5: Tag small class appended when small=true', () => {
+    it('Feature: ux4g-phase4-components, Property 5', () => {
+        fc.assert(fc.property(fc.constantFrom(...allTagVariants), fc.constantFrom(...allTagColors), fc.boolean(), (variant, color, small) => {
+            const result = buildTagClasses(variant, color, small);
+            if (small) {
+                return result.includes('ux4g-tag-s');
+            }
+            else {
+                return !result.includes('ux4g-tag-s');
+            }
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 6: Divider class matches orientation
+ * Tag: Feature: ux4g-phase4-components, Property 6
+ * Validates: Requirements 3.10, 4.8
+ */
+describe('Property 6: Divider class matches orientation', () => {
+    it('Feature: ux4g-phase4-components, Property 6', () => {
+        fc.assert(fc.property(fc.constantFrom('horizontal', 'vertical'), (orientation) => {
+            const result = buildDividerClasses(orientation);
+            return result === `ux4g-divider-${orientation}`;
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 7: Breadcrumb class contains separator substring
+ * Tag: Feature: ux4g-phase4-components, Property 7
+ * Validates: Requirements 3.11, 4.10
+ */
+describe('Property 7: Breadcrumb class contains separator substring', () => {
+    it('Feature: ux4g-phase4-components, Property 7', () => {
+        fc.assert(fc.property(fc.constantFrom('divider', 'icon'), (separator) => {
+            const result = buildBreadcrumbClasses(separator);
+            return result.includes('ux4g-breadcrumb') && result.includes(`ux4g-breadcrumb-${separator}`);
+        }), { numRuns: 20 });
+    });
+});

package/dist/__tests__/types.phase4.test.d.ts

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

package/dist/__tests__/types.phase4.test.js

@@ -0,0 +1,70 @@
+/**
+ * Unit tests for Phase 4 build functions
+ * Validates: Requirements 4.3, 4.6, 4.8, 4.10
+ */
+import { buildChipClasses, buildTagClasses, buildDividerClasses, buildBreadcrumbClasses, } from '../../src/types';
+describe('buildChipClasses', () => {
+    it('filter xs clamped to sm', () => {
+        expect(buildChipClasses('filter', 'xs')).toBe('ux4g-filter-chip-sm');
+    });
+    it('choice xs clamped to sm with active', () => {
+        expect(buildChipClasses('choice', 'xs', true)).toBe('ux4g-choice-chip-sm active');
+    });
+    it('input xs is valid (not clamped)', () => {
+        expect(buildChipClasses('input', 'xs')).toBe('ux4g-input-chip-xs');
+    });
+    it('filter md', () => {
+        expect(buildChipClasses('filter', 'md')).toBe('ux4g-filter-chip-md');
+    });
+    it('choice sm with active', () => {
+        expect(buildChipClasses('choice', 'sm', true)).toBe('ux4g-choice-chip-sm active');
+    });
+    it('active=false does not append active', () => {
+        expect(buildChipClasses('filter', 'md', false)).toBe('ux4g-filter-chip-md');
+    });
+    it('extra class appended', () => {
+        expect(buildChipClasses('input', 'sm', false, 'my-class')).toBe('ux4g-input-chip-sm my-class');
+    });
+});
+describe('buildTagClasses', () => {
+    it('tonal brand', () => {
+        expect(buildTagClasses('tonal', 'brand')).toBe('ux4g-tag-tonal-brand');
+    });
+    it('filled error with small', () => {
+        expect(buildTagClasses('filled', 'error', true)).toBe('ux4g-tag-filled-error ux4g-tag-s');
+    });
+    it('outline success with small', () => {
+        expect(buildTagClasses('outline', 'success', true)).toBe('ux4g-tag-outline-success ux4g-tag-s');
+    });
+    it('text neutral', () => {
+        expect(buildTagClasses('text', 'neutral')).toBe('ux4g-tag-text-neutral');
+    });
+    it('small=false does not append ux4g-tag-s', () => {
+        expect(buildTagClasses('tonal', 'brand', false)).toBe('ux4g-tag-tonal-brand');
+    });
+    it('extra class appended', () => {
+        expect(buildTagClasses('filled', 'info', false, 'my-class')).toBe('ux4g-tag-filled-info my-class');
+    });
+});
+describe('buildDividerClasses', () => {
+    it('horizontal', () => {
+        expect(buildDividerClasses('horizontal')).toBe('ux4g-divider-horizontal');
+    });
+    it('vertical', () => {
+        expect(buildDividerClasses('vertical')).toBe('ux4g-divider-vertical');
+    });
+    it('extra class appended', () => {
+        expect(buildDividerClasses('horizontal', 'my-class')).toBe('ux4g-divider-horizontal my-class');
+    });
+});
+describe('buildBreadcrumbClasses', () => {
+    it('divider separator', () => {
+        expect(buildBreadcrumbClasses('divider')).toBe('ux4g-breadcrumb ux4g-breadcrumb-divider');
+    });
+    it('icon separator', () => {
+        expect(buildBreadcrumbClasses('icon')).toBe('ux4g-breadcrumb ux4g-breadcrumb-icon');
+    });
+    it('extra class appended', () => {
+        expect(buildBreadcrumbClasses('divider', 'my-class')).toBe('ux4g-breadcrumb ux4g-breadcrumb-divider my-class');
+    });
+});

package/dist/__tests__/types.phase5.property.test.d.ts

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

package/dist/__tests__/types.phase5.property.test.js

@@ -0,0 +1,120 @@
+/**
+ * Property-based tests for Phase 5 build functions
+ *
+ * Property 1: Checkbox class contains size substring
+ * Property 2: Checkbox error class appended when error=true
+ * Property 3: Radio class contains size substring
+ * Property 4: Radio error class appended when error=true
+ * Property 5: Switch class contains size substring and never contains error class
+ * Property 6: Card class contains variant and layout substrings
+ * Property 7: Input container class contains size and state substrings
+ */
+import * as fc from 'fast-check';
+import { buildCheckboxClasses, buildRadioClasses, buildSwitchClasses, buildCardClasses, buildInputContainerClasses, } from '../../src/types';
+/**
+ * Property 1: Checkbox class contains size substring
+ * Tag: Feature: ux4g-phase5-components, Property 1
+ * Validates: Requirements 3.7, 4.2
+ */
+describe('Property 1: Checkbox class contains size substring', () => {
+    it('Feature: ux4g-phase5-components, Property 1', () => {
+        fc.assert(fc.property(fc.constantFrom('sm', 'md', 'lg'), (size) => {
+            const result = buildCheckboxClasses(size);
+            return result.includes('ux4g-checkbox') && result.includes(`ux4g-checkbox-${size}`);
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 2: Checkbox error class appended when error=true
+ * Tag: Feature: ux4g-phase5-components, Property 2
+ * Validates: Requirements 3.8, 4.2
+ */
+describe('Property 2: Checkbox error class appended when error=true', () => {
+    it('Feature: ux4g-phase5-components, Property 2', () => {
+        fc.assert(fc.property(fc.constantFrom('sm', 'md', 'lg'), fc.boolean(), (size, error) => {
+            const result = buildCheckboxClasses(size, error);
+            if (error) {
+                return result.includes('ux4g-checkbox-error');
+            }
+            else {
+                return !result.includes('ux4g-checkbox-error');
+            }
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 3: Radio class contains size substring
+ * Tag: Feature: ux4g-phase5-components, Property 3
+ * Validates: Requirements 3.9, 4.4
+ */
+describe('Property 3: Radio class contains size substring', () => {
+    it('Feature: ux4g-phase5-components, Property 3', () => {
+        fc.assert(fc.property(fc.constantFrom('sm', 'md', 'lg'), (size) => {
+            const result = buildRadioClasses(size);
+            return result.includes('ux4g-radio') && result.includes(`ux4g-radio-${size}`);
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 4: Radio error class appended when error=true
+ * Tag: Feature: ux4g-phase5-components, Property 4
+ * Validates: Requirements 3.10, 4.4
+ */
+describe('Property 4: Radio error class appended when error=true', () => {
+    it('Feature: ux4g-phase5-components, Property 4', () => {
+        fc.assert(fc.property(fc.constantFrom('sm', 'md', 'lg'), fc.boolean(), (size, error) => {
+            const result = buildRadioClasses(size, error);
+            if (error) {
+                return result.includes('ux4g-radio-error');
+            }
+            else {
+                return !result.includes('ux4g-radio-error');
+            }
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 5: Switch class contains size substring and never contains error class
+ * Tag: Feature: ux4g-phase5-components, Property 5
+ * Validates: Requirements 3.11, 4.6
+ */
+describe('Property 5: Switch class contains size substring and never contains error class', () => {
+    it('Feature: ux4g-phase5-components, Property 5', () => {
+        fc.assert(fc.property(fc.constantFrom('sm', 'md', 'lg'), (size) => {
+            const result = buildSwitchClasses(size);
+            return (result.includes('ux4g-switch') &&
+                result.includes(`ux4g-switch-${size}`) &&
+                !result.includes('ux4g-switch-error'));
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 6: Card class contains variant and layout substrings
+ * Tag: Feature: ux4g-phase5-components, Property 6
+ * Validates: Requirements 3.12, 4.9
+ */
+describe('Property 6: Card class contains variant and layout substrings', () => {
+    it('Feature: ux4g-phase5-components, Property 6', () => {
+        fc.assert(fc.property(fc.constantFrom('solid', 'outline', 'no-fill'), fc.constantFrom('vertical', 'horizontal'), (variant, layout) => {
+            const result = buildCardClasses(variant, layout);
+            return (result.includes('ux4g-card') &&
+                result.includes(`ux4g-card-${variant}`) &&
+                result.includes(`ux4g-card-${layout}`));
+        }), { numRuns: 20 });
+    });
+});
+/**
+ * Property 7: Input container class contains size and state substrings
+ * Tag: Feature: ux4g-phase5-components, Property 7
+ * Validates: Requirements 3.13, 4.12
+ */
+describe('Property 7: Input container class contains size and state substrings', () => {
+    it('Feature: ux4g-phase5-components, Property 7', () => {
+        fc.assert(fc.property(fc.constantFrom('sm', 'md', 'lg', 'xl'), fc.constantFrom('default', 'error', 'success', 'warning'), (size, state) => {
+            const result = buildInputContainerClasses(size, state);
+            return (result.includes('ux4g-input-container') &&
+                result.includes(`ux4g-input-${size}`) &&
+                result.includes(`ux4g-input-${state}`));
+        }), { numRuns: 20 });
+    });
+});

package/dist/__tests__/types.phase5.test.d.ts

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

package/dist/__tests__/types.phase5.test.js

@@ -0,0 +1,64 @@
+import { buildCheckboxClasses, buildRadioClasses, buildSwitchClasses, buildCardClasses, buildInputContainerClasses, } from '../../src/types';
+// ── buildCheckboxClasses ──────────────────────────────────────────────────────
+describe('buildCheckboxClasses', () => {
+    it('md with no error → base + size classes only', () => {
+        expect(buildCheckboxClasses('md')).toBe('ux4g-checkbox ux4g-checkbox-md');
+    });
+    it('sm with error=true → includes error class', () => {
+        expect(buildCheckboxClasses('sm', true)).toBe('ux4g-checkbox ux4g-checkbox-sm ux4g-checkbox-error');
+    });
+    it('lg with error=false → no error class', () => {
+        expect(buildCheckboxClasses('lg', false)).toBe('ux4g-checkbox ux4g-checkbox-lg');
+    });
+});
+// ── buildRadioClasses ─────────────────────────────────────────────────────────
+describe('buildRadioClasses', () => {
+    it('md with no error → base + size classes only', () => {
+        expect(buildRadioClasses('md')).toBe('ux4g-radio ux4g-radio-md');
+    });
+    it('lg with error=true → includes error class', () => {
+        expect(buildRadioClasses('lg', true)).toBe('ux4g-radio ux4g-radio-lg ux4g-radio-error');
+    });
+    it('sm with error=false → no error class', () => {
+        expect(buildRadioClasses('sm', false)).toBe('ux4g-radio ux4g-radio-sm');
+    });
+});
+// ── buildSwitchClasses ────────────────────────────────────────────────────────
+describe('buildSwitchClasses', () => {
+    it('md → ux4g-switch ux4g-switch-md', () => {
+        expect(buildSwitchClasses('md')).toBe('ux4g-switch ux4g-switch-md');
+    });
+    it('sm → ux4g-switch ux4g-switch-sm', () => {
+        expect(buildSwitchClasses('sm')).toBe('ux4g-switch ux4g-switch-sm');
+    });
+    it('lg → ux4g-switch ux4g-switch-lg', () => {
+        expect(buildSwitchClasses('lg')).toBe('ux4g-switch ux4g-switch-lg');
+    });
+});
+// ── buildCardClasses ──────────────────────────────────────────────────────────
+describe('buildCardClasses', () => {
+    it('solid + vertical → base + variant + layout classes', () => {
+        expect(buildCardClasses('solid', 'vertical')).toBe('ux4g-card ux4g-card-solid ux4g-card-vertical');
+    });
+    it('outline + horizontal → base + variant + layout classes', () => {
+        expect(buildCardClasses('outline', 'horizontal')).toBe('ux4g-card ux4g-card-outline ux4g-card-horizontal');
+    });
+    it('no-fill + vertical → base + variant + layout classes', () => {
+        expect(buildCardClasses('no-fill', 'vertical')).toBe('ux4g-card ux4g-card-no-fill ux4g-card-vertical');
+    });
+});
+// ── buildInputContainerClasses ────────────────────────────────────────────────
+describe('buildInputContainerClasses', () => {
+    it('md + default → base + size + state classes', () => {
+        expect(buildInputContainerClasses('md', 'default')).toBe('ux4g-input-container ux4g-input-md ux4g-input-default');
+    });
+    it('lg + error → base + size + state classes', () => {
+        expect(buildInputContainerClasses('lg', 'error')).toBe('ux4g-input-container ux4g-input-lg ux4g-input-error');
+    });
+    it('sm + success → base + size + state classes', () => {
+        expect(buildInputContainerClasses('sm', 'success')).toBe('ux4g-input-container ux4g-input-sm ux4g-input-success');
+    });
+    it('xl + warning → base + size + state classes', () => {
+        expect(buildInputContainerClasses('xl', 'warning')).toBe('ux4g-input-container ux4g-input-xl ux4g-input-warning');
+    });
+});

package/dist/__tests__/types.phase6.property.test.d.ts

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