ux4g-components-web 1.4.0 → 1.5.0

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

@@ -0,0 +1,106 @@
+import { buildPaginationClasses, buildTableClasses, buildPopoverClasses, buildTooltipClasses, buildTabClasses, buildIconButtonClasses, } from '../../src/types';
+// ── buildPaginationClasses ────────────────────────────────────────────────────
+// Requirements: 4.3
+describe('buildPaginationClasses', () => {
+    it("variant='default' → base only", () => {
+        expect(buildPaginationClasses('default')).toBe('ux4g-pagination');
+    });
+    it("variant='dotted' → base + dotted", () => {
+        expect(buildPaginationClasses('dotted')).toBe('ux4g-pagination ux4g-pagination-dotted');
+    });
+    it("variant='dotted' paginationStyle='solid' → base + dotted + solid", () => {
+        expect(buildPaginationClasses('dotted', 'solid')).toBe('ux4g-pagination ux4g-pagination-dotted ux4g-pagination-solid');
+    });
+    it("variant='dotted' paginationStyle='translucent' → base + dotted + translucent", () => {
+        expect(buildPaginationClasses('dotted', 'translucent')).toBe('ux4g-pagination ux4g-pagination-dotted ux4g-pagination-translucent');
+    });
+    it("variant='default' paginationStyle='solid' → base only (paginationStyle ignored)", () => {
+        expect(buildPaginationClasses('default', 'solid')).toBe('ux4g-pagination');
+    });
+    it("variant='dotted' paginationStyle='solid' extra='my-pager' → base + dotted + solid + extra", () => {
+        expect(buildPaginationClasses('dotted', 'solid', 'my-pager')).toBe('ux4g-pagination ux4g-pagination-dotted ux4g-pagination-solid my-pager');
+    });
+});
+// ── buildTableClasses ─────────────────────────────────────────────────────────
+// Requirements: 4.7
+describe('buildTableClasses', () => {
+    it("size='m' → base + size", () => {
+        expect(buildTableClasses('m')).toBe('ux4g-table ux4g-table-m');
+    });
+    it("size='s' divider='column' → base + size + column-dividers", () => {
+        expect(buildTableClasses('s', 'column')).toBe('ux4g-table ux4g-table-s ux4g-table-column-dividers');
+    });
+    it("size='lg' divider='none' zebra='rows' → base + size + no-row-dividers + zebra-rows", () => {
+        expect(buildTableClasses('lg', 'none', 'rows')).toBe('ux4g-table ux4g-table-lg ux4g-table-no-row-dividers ux4g-table-zebra-rows');
+    });
+    it("size='m' divider='row' zebra='none' interactive sortable headerBrand → no divider/zebra modifiers, interactive + sortable + header-brand", () => {
+        expect(buildTableClasses('m', 'row', 'none', true, true, false, true)).toBe('ux4g-table ux4g-table-m ux4g-table-interactive ux4g-table-sortable ux4g-table-header-brand');
+    });
+    it("size='m' divider='column' zebra='cols' all booleans true extra='my-table' → full class string", () => {
+        expect(buildTableClasses('m', 'column', 'cols', true, true, true, true, 'my-table')).toBe('ux4g-table ux4g-table-m ux4g-table-column-dividers ux4g-table-zebra-cols ux4g-table-interactive ux4g-table-sortable ux4g-table-resizable ux4g-table-header-brand my-table');
+    });
+});
+// ── buildPopoverClasses ───────────────────────────────────────────────────────
+// Requirements: 4.9
+describe('buildPopoverClasses', () => {
+    it("placement='bottom' → base + placement", () => {
+        expect(buildPopoverClasses('bottom')).toBe('ux4g-popover ux4g-popover-bottom');
+    });
+    it("placement='top-start' → base + placement", () => {
+        expect(buildPopoverClasses('top-start')).toBe('ux4g-popover ux4g-popover-top-start');
+    });
+    it("placement='right-end' show=true → base + placement + show", () => {
+        expect(buildPopoverClasses('right-end', true)).toBe('ux4g-popover ux4g-popover-right-end show');
+    });
+    it("placement='left' show=false → base + placement, no show", () => {
+        expect(buildPopoverClasses('left', false)).toBe('ux4g-popover ux4g-popover-left');
+    });
+    it("placement='bottom' show=true extra='my' → base + placement + show + extra", () => {
+        expect(buildPopoverClasses('bottom', true, 'my')).toBe('ux4g-popover ux4g-popover-bottom show my');
+    });
+});
+// ── buildTooltipClasses ───────────────────────────────────────────────────────
+// Requirements: 4.12
+describe('buildTooltipClasses', () => {
+    it("placement='top-center' size='s' → base + placement + size", () => {
+        expect(buildTooltipClasses('top-center', 's')).toBe('ux4g-tooltip ux4g-tooltip-top-center ux4g-tooltip-s');
+    });
+    it("placement='bottom-right' size='xs' → base + placement + size", () => {
+        expect(buildTooltipClasses('bottom-right', 'xs')).toBe('ux4g-tooltip ux4g-tooltip-bottom-right ux4g-tooltip-xs');
+    });
+    it("placement='left-center' size='s' extra='my-tip' → base + placement + size + extra", () => {
+        expect(buildTooltipClasses('left-center', 's', 'my-tip')).toBe('ux4g-tooltip ux4g-tooltip-left-center ux4g-tooltip-s my-tip');
+    });
+});
+// ── buildTabClasses ───────────────────────────────────────────────────────────
+// Requirements: 4.15
+describe('buildTabClasses', () => {
+    it("variant='underline' size='md' → base + variant + size", () => {
+        expect(buildTabClasses('underline', 'md')).toBe('ux4g-tab ux4g-tab-underline ux4g-tab-md');
+    });
+    it("variant='pill' size='lg' → base + variant + size", () => {
+        expect(buildTabClasses('pill', 'lg')).toBe('ux4g-tab ux4g-tab-pill ux4g-tab-lg');
+    });
+    it("variant='underline' size='sm' vertical=true → base + variant + size + vertical", () => {
+        expect(buildTabClasses('underline', 'sm', true)).toBe('ux4g-tab ux4g-tab-underline ux4g-tab-sm ux4g-tab-vertical');
+    });
+    it("variant='pill' size='md' vertical=false extra='my-tabs' → base + variant + size + extra, no vertical", () => {
+        expect(buildTabClasses('pill', 'md', false, 'my-tabs')).toBe('ux4g-tab ux4g-tab-pill ux4g-tab-md my-tabs');
+    });
+});
+// ── buildIconButtonClasses ────────────────────────────────────────────────────
+// Requirements: 4.18
+describe('buildIconButtonClasses', () => {
+    it("variant='primary' size='md' → base + variant + size", () => {
+        expect(buildIconButtonClasses('primary', 'md')).toBe('ux4g-icon-btn ux4g-icon-btn-primary ux4g-icon-btn-md');
+    });
+    it("variant='outline-primary' size='sm' → base + variant + size", () => {
+        expect(buildIconButtonClasses('outline-primary', 'sm')).toBe('ux4g-icon-btn ux4g-icon-btn-outline-primary ux4g-icon-btn-sm');
+    });
+    it("variant='text-primary' size='lg' pill=true → base + variant + size + pill", () => {
+        expect(buildIconButtonClasses('text-primary', 'lg', true)).toBe('ux4g-icon-btn ux4g-icon-btn-text-primary ux4g-icon-btn-lg ux4g-icon-btn-pill');
+    });
+    it("variant='tonal-primary' size='xs' pill=false extra='my' → base + variant + size + extra, no pill", () => {
+        expect(buildIconButtonClasses('tonal-primary', 'xs', false, 'my')).toBe('ux4g-icon-btn ux4g-icon-btn-tonal-primary ux4g-icon-btn-xs my');
+    });
+});

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

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

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

@@ -0,0 +1,224 @@
+/**
+ * Property-based tests for Phase 8 build functions
+ *
+ * Property 1: AccessibilityBar class string always contains ux4g-topbar as the sole base token
+ * Property 2: Accordion class string contains required tokens and correctly applies arrow position and variant modifiers
+ * Property 3: Stepper class string contains required tokens and correctly applies orientation, alignment, variant, and size modifiers
+ * Property 4: SliderField class string contains ux4g-slider-field and correctly toggles ux4g-slider-md for md size
+ * Property 5: Drawer class string always contains ux4g-drawer and a placement class, and correctly toggles ux4g-drawer-open
+ * Property 6: Extra param is always appended as a space-separated token and never duplicates existing tokens for all Phase 8 build functions
+ */
+import * as fc from 'fast-check';
+import { buildAccessibilityBarClasses, buildAccordionClasses, buildStepperClasses, buildSliderFieldClasses, buildDrawerClasses, } from '../../src/types';
+/**
+ * Property 1: AccessibilityBar class string always contains ux4g-topbar as the sole base token
+ * Tag: Feature: ux4g-phase8-components, Property 1
+ * Validates: Requirements 4.1
+ */
+describe('Property 1: AccessibilityBar class always returns ux4g-topbar with optional extra', () => {
+    it('Feature: ux4g-phase8-components, Property 1', () => {
+        fc.assert(fc.property(fc.option(fc.stringOf(fc.char().filter((c) => c !== ' '), { minLength: 1 })), (extra) => {
+            const result = extra !== null
+                ? buildAccessibilityBarClasses(extra)
+                : buildAccessibilityBarClasses();
+            const tokens = result.split(' ');
+            // Always contains 'ux4g-topbar'
+            const hasBase = tokens.includes('ux4g-topbar');
+            // When extra is provided, result contains the extra token
+            const extraCorrect = extra !== null
+                ? tokens.includes(extra)
+                : true;
+            // No duplicates
+            const noDuplicates = tokens.length === new Set(tokens).size;
+            return hasBase && extraCorrect && noDuplicates;
+        }), { numRuns: 100 });
+    });
+});
+/**
+ * Property 2: Accordion class string contains required tokens and correctly applies arrow position and variant modifiers
+ * Tag: Feature: ux4g-phase8-components, Property 2
+ * Validates: Requirements 4.2, 4.3, 4.4
+ */
+describe('Property 2: Accordion class correctly toggles arrow-left and bordered modifiers', () => {
+    it('Feature: ux4g-phase8-components, Property 2', () => {
+        fc.assert(fc.property(fc.constantFrom('right', 'left'), fc.constantFrom('default', 'bordered'), (arrowPosition, variant) => {
+            const result = buildAccordionClasses(arrowPosition, variant);
+            const tokens = result.split(' ');
+            // Always contains base class
+            const hasBase = tokens.includes('ux4g-accordion');
+            // Arrow position toggles correctly
+            const arrowCorrect = arrowPosition === 'left'
+                ? tokens.includes('ux4g-accordion-arrow-left')
+                : !tokens.includes('ux4g-accordion-arrow-left');
+            // Variant toggles correctly
+            const variantCorrect = variant === 'bordered'
+                ? tokens.includes('ux4g-accordion-bordered')
+                : !tokens.includes('ux4g-accordion-bordered');
+            // No duplicates
+            const noDuplicates = tokens.length === new Set(tokens).size;
+            return hasBase && arrowCorrect && variantCorrect && noDuplicates;
+        }), { numRuns: 100 });
+    });
+});
+/**
+ * Property 3: Stepper class string contains required tokens and correctly applies orientation, alignment, variant, and size modifiers
+ * Tag: Feature: ux4g-phase8-components, Property 3
+ * Validates: Requirements 4.5, 4.6, 4.7, 4.8, 4.9
+ */
+describe('Property 3: Stepper class correctly applies orientation, alignment, variant, and size modifiers', () => {
+    it('Feature: ux4g-phase8-components, Property 3', () => {
+        fc.assert(fc.property(fc.constantFrom('horizontal', 'vertical'), fc.constantFrom('default', 'center', 'left'), fc.constantFrom('default', 'bottom-line', 'mobile', 'progress'), fc.constantFrom('default', 's'), (orientation, alignment, variant, size) => {
+            const result = buildStepperClasses(orientation, alignment, variant, size);
+            const tokens = result.split(' ');
+            // Always contains base class
+            const hasBase = tokens.includes('ux4g-stepper');
+            // Orientation and alignment logic
+            let orientationCorrect;
+            if (orientation === 'vertical') {
+                // vertical: contains ux4g-stepper-vertical, does NOT contain horizontal/center/left (alignment ignored)
+                orientationCorrect =
+                    tokens.includes('ux4g-stepper-vertical') &&
+                        !tokens.includes('ux4g-stepper-horizontal') &&
+                        !tokens.includes('ux4g-stepper-center') &&
+                        !tokens.includes('ux4g-stepper-left');
+            }
+            else {
+                // horizontal
+                if (alignment === 'center') {
+                    orientationCorrect =
+                        tokens.includes('ux4g-stepper-horizontal') &&
+                            tokens.includes('ux4g-stepper-center') &&
+                            !tokens.includes('ux4g-stepper-vertical');
+                }
+                else if (alignment === 'left') {
+                    orientationCorrect =
+                        tokens.includes('ux4g-stepper-horizontal') &&
+                            tokens.includes('ux4g-stepper-left') &&
+                            !tokens.includes('ux4g-stepper-vertical');
+                }
+                else {
+                    // alignment === 'default': no horizontal class added
+                    orientationCorrect =
+                        !tokens.includes('ux4g-stepper-horizontal') &&
+                            !tokens.includes('ux4g-stepper-center') &&
+                            !tokens.includes('ux4g-stepper-left') &&
+                            !tokens.includes('ux4g-stepper-vertical');
+                }
+            }
+            // Variant modifiers are mutually exclusive
+            let variantCorrect;
+            if (variant === 'bottom-line') {
+                variantCorrect =
+                    tokens.includes('ux4g-stepper-bottom-line') &&
+                        !tokens.includes('ux4g-stepper-mobile') &&
+                        !tokens.includes('ux4g-stepper-progress');
+            }
+            else if (variant === 'mobile') {
+                variantCorrect =
+                    tokens.includes('ux4g-stepper-mobile') &&
+                        !tokens.includes('ux4g-stepper-bottom-line') &&
+                        !tokens.includes('ux4g-stepper-progress');
+            }
+            else if (variant === 'progress') {
+                variantCorrect =
+                    tokens.includes('ux4g-stepper-progress') &&
+                        !tokens.includes('ux4g-stepper-bottom-line') &&
+                        !tokens.includes('ux4g-stepper-mobile');
+            }
+            else {
+                // variant === 'default': no variant modifier
+                variantCorrect =
+                    !tokens.includes('ux4g-stepper-bottom-line') &&
+                        !tokens.includes('ux4g-stepper-mobile') &&
+                        !tokens.includes('ux4g-stepper-progress');
+            }
+            // Size toggles correctly
+            const sizeCorrect = size === 's'
+                ? tokens.includes('ux4g-stepper-s')
+                : !tokens.includes('ux4g-stepper-s');
+            // No duplicates
+            const noDuplicates = tokens.length === new Set(tokens).size;
+            return hasBase && orientationCorrect && variantCorrect && sizeCorrect && noDuplicates;
+        }), { numRuns: 100 });
+    });
+});
+/**
+ * Property 4: SliderField class string contains ux4g-slider-field and correctly toggles ux4g-slider-md for md size
+ * Tag: Feature: ux4g-phase8-components, Property 4
+ * Validates: Requirements 4.10, 4.11
+ */
+describe('Property 4: SliderField class correctly toggles md size modifier', () => {
+    it('Feature: ux4g-phase8-components, Property 4', () => {
+        fc.assert(fc.property(fc.constantFrom('sm', 'md'), (size) => {
+            const result = buildSliderFieldClasses(size);
+            const tokens = result.split(' ');
+            // Always contains base class
+            const hasBase = tokens.includes('ux4g-slider-field');
+            // Size toggles correctly
+            const sizeCorrect = size === 'md'
+                ? tokens.includes('ux4g-slider-md')
+                : !tokens.includes('ux4g-slider-md');
+            // No duplicates
+            const noDuplicates = tokens.length === new Set(tokens).size;
+            return hasBase && sizeCorrect && noDuplicates;
+        }), { numRuns: 100 });
+    });
+});
+/**
+ * Property 5: Drawer class string always contains ux4g-drawer and a placement class, and correctly toggles ux4g-drawer-open
+ * Tag: Feature: ux4g-phase8-components, Property 5
+ * Validates: Requirements 4.12, 4.13
+ */
+describe('Property 5: Drawer class always emits placement class and correctly toggles open', () => {
+    it('Feature: ux4g-phase8-components, Property 5', () => {
+        const allPlacements = ['right', 'left', 'top', 'bottom'];
+        fc.assert(fc.property(fc.constantFrom('right', 'left', 'top', 'bottom'), fc.boolean(), (placement, open) => {
+            const result = buildDrawerClasses(placement, open);
+            const tokens = result.split(' ');
+            // Always contains base class
+            const hasBase = tokens.includes('ux4g-drawer');
+            // Always contains the correct placement class
+            const hasPlacement = tokens.includes(`ux4g-drawer-${placement}`);
+            // Exactly one placement class is present (no other placement classes)
+            const otherPlacements = allPlacements.filter((p) => p !== placement);
+            const noOtherPlacements = otherPlacements.every((p) => !tokens.includes(`ux4g-drawer-${p}`));
+            // open toggles correctly
+            const openCorrect = open
+                ? tokens.includes('ux4g-drawer-open')
+                : !tokens.includes('ux4g-drawer-open');
+            // No duplicates
+            const noDuplicates = tokens.length === new Set(tokens).size;
+            return hasBase && hasPlacement && noOtherPlacements && openCorrect && noDuplicates;
+        }), { numRuns: 100 });
+    });
+});
+/**
+ * Property 6: Extra param is always appended as a space-separated token and never duplicates existing tokens for all Phase 8 build functions
+ * Tag: Feature: ux4g-phase8-components, Property 6
+ * Validates: Requirements 4.1, 4.4, 4.9, 4.11, 4.13
+ */
+describe('Property 6: Extra param is always appended and never duplicated across all Phase 8 build functions', () => {
+    it('Feature: ux4g-phase8-components, Property 6', () => {
+        // Generator for a non-empty extra token with no spaces (valid CSS class name)
+        const extraArb = fc.stringOf(fc.char().filter((c) => c !== ' '), { minLength: 1 });
+        fc.assert(fc.property(extraArb, (extra) => {
+            const results = [
+                buildAccessibilityBarClasses(extra),
+                buildAccordionClasses('left', 'bordered', extra),
+                buildStepperClasses('horizontal', 'center', 'progress', 's', extra),
+                buildSliderFieldClasses('md', extra),
+                buildDrawerClasses('right', true, extra),
+            ];
+            return results.every((result) => {
+                const tokens = result.split(' ');
+                // Extra token appears in result
+                const hasExtra = tokens.includes(extra);
+                // No duplicates
+                const noDuplicates = tokens.length === new Set(tokens).size;
+                // Extra token appears exactly once
+                const exactlyOnce = tokens.filter((t) => t === extra).length === 1;
+                return hasExtra && noDuplicates && exactlyOnce;
+            });
+        }), { numRuns: 100 });
+    });
+});

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

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

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

@@ -0,0 +1,114 @@
+import { buildAccessibilityBarClasses, buildAccordionClasses, buildStepperClasses, buildSliderFieldClasses, buildDrawerClasses, } from '../../src/types';
+// ── buildAccessibilityBarClasses ──────────────────────────────────────────────
+// Requirements: 4.1
+describe('buildAccessibilityBarClasses', () => {
+    it('no args → ux4g-topbar', () => {
+        expect(buildAccessibilityBarClasses()).toBe('ux4g-topbar');
+    });
+    it("extra='my-topbar' → ux4g-topbar my-topbar", () => {
+        expect(buildAccessibilityBarClasses('my-topbar')).toBe('ux4g-topbar my-topbar');
+    });
+});
+// ── buildAccordionClasses ─────────────────────────────────────────────────────
+// Requirements: 4.4
+describe('buildAccordionClasses', () => {
+    it('no args → ux4g-accordion', () => {
+        expect(buildAccordionClasses()).toBe('ux4g-accordion');
+    });
+    it("arrowPosition='right' → ux4g-accordion ux4g-accordion-arrow-right", () => {
+        expect(buildAccordionClasses('right')).toBe('ux4g-accordion ux4g-accordion-arrow-right');
+    });
+    it("arrowPosition='left' → ux4g-accordion ux4g-accordion-arrow-left", () => {
+        expect(buildAccordionClasses('left')).toBe('ux4g-accordion ux4g-accordion-arrow-left');
+    });
+    it("arrowPosition='right' variant='bordered' → ux4g-accordion ux4g-accordion-arrow-right ux4g-accordion-bordered", () => {
+        expect(buildAccordionClasses('right', 'bordered')).toBe('ux4g-accordion ux4g-accordion-arrow-right ux4g-accordion-bordered');
+    });
+    it("arrowPosition='left' variant='bordered' → ux4g-accordion ux4g-accordion-arrow-left ux4g-accordion-bordered", () => {
+        expect(buildAccordionClasses('left', 'bordered')).toBe('ux4g-accordion ux4g-accordion-arrow-left ux4g-accordion-bordered');
+    });
+    it("arrowPosition='left' variant='bordered' extra='my-acc' → full class string", () => {
+        expect(buildAccordionClasses('left', 'bordered', 'my-acc')).toBe('ux4g-accordion ux4g-accordion-arrow-left ux4g-accordion-bordered my-acc');
+    });
+});
+// ── buildStepperClasses ───────────────────────────────────────────────────────
+// Requirements: 4.9
+describe('buildStepperClasses', () => {
+    it('no args → ux4g-stepper', () => {
+        expect(buildStepperClasses()).toBe('ux4g-stepper');
+    });
+    it("orientation='horizontal' → ux4g-stepper (no modifier for default alignment)", () => {
+        expect(buildStepperClasses('horizontal')).toBe('ux4g-stepper');
+    });
+    it("orientation='horizontal' alignment='center' → ux4g-stepper ux4g-stepper-horizontal ux4g-stepper-center", () => {
+        expect(buildStepperClasses('horizontal', 'center')).toBe('ux4g-stepper ux4g-stepper-horizontal ux4g-stepper-center');
+    });
+    it("orientation='horizontal' alignment='left' → ux4g-stepper ux4g-stepper-horizontal ux4g-stepper-left", () => {
+        expect(buildStepperClasses('horizontal', 'left')).toBe('ux4g-stepper ux4g-stepper-horizontal ux4g-stepper-left');
+    });
+    it("orientation='vertical' → ux4g-stepper ux4g-stepper-vertical", () => {
+        expect(buildStepperClasses('vertical')).toBe('ux4g-stepper ux4g-stepper-vertical');
+    });
+    it("orientation='vertical' alignment='center' → ux4g-stepper ux4g-stepper-vertical (alignment ignored when vertical)", () => {
+        expect(buildStepperClasses('vertical', 'center')).toBe('ux4g-stepper ux4g-stepper-vertical');
+    });
+    it("orientation='vertical' alignment='left' → ux4g-stepper ux4g-stepper-vertical (alignment ignored when vertical)", () => {
+        expect(buildStepperClasses('vertical', 'left')).toBe('ux4g-stepper ux4g-stepper-vertical');
+    });
+    it("orientation='horizontal' alignment='default' variant='bottom-line' → ux4g-stepper ux4g-stepper-bottom-line", () => {
+        expect(buildStepperClasses('horizontal', 'default', 'bottom-line')).toBe('ux4g-stepper ux4g-stepper-bottom-line');
+    });
+    it("orientation='horizontal' alignment='default' variant='mobile' → ux4g-stepper ux4g-stepper-mobile", () => {
+        expect(buildStepperClasses('horizontal', 'default', 'mobile')).toBe('ux4g-stepper ux4g-stepper-mobile');
+    });
+    it("orientation='horizontal' alignment='default' variant='progress' → ux4g-stepper ux4g-stepper-progress", () => {
+        expect(buildStepperClasses('horizontal', 'default', 'progress')).toBe('ux4g-stepper ux4g-stepper-progress');
+    });
+    it("orientation='horizontal' alignment='default' variant='default' size='s' → ux4g-stepper ux4g-stepper-s", () => {
+        expect(buildStepperClasses('horizontal', 'default', 'default', 's')).toBe('ux4g-stepper ux4g-stepper-s');
+    });
+    it("orientation='horizontal' alignment='center' variant='progress' size='s' → full class string", () => {
+        expect(buildStepperClasses('horizontal', 'center', 'progress', 's')).toBe('ux4g-stepper ux4g-stepper-horizontal ux4g-stepper-center ux4g-stepper-progress ux4g-stepper-s');
+    });
+});
+// ── buildSliderFieldClasses ───────────────────────────────────────────────────
+// Requirements: 4.11
+describe('buildSliderFieldClasses', () => {
+    it('no args → ux4g-slider-field', () => {
+        expect(buildSliderFieldClasses()).toBe('ux4g-slider-field');
+    });
+    it("size='sm' → ux4g-slider-field (no size modifier)", () => {
+        expect(buildSliderFieldClasses('sm')).toBe('ux4g-slider-field');
+    });
+    it("size='md' → ux4g-slider-field ux4g-slider-md", () => {
+        expect(buildSliderFieldClasses('md')).toBe('ux4g-slider-field ux4g-slider-md');
+    });
+    it("size='md' extra='x' → ux4g-slider-field ux4g-slider-md x", () => {
+        expect(buildSliderFieldClasses('md', 'x')).toBe('ux4g-slider-field ux4g-slider-md x');
+    });
+});
+// ── buildDrawerClasses ────────────────────────────────────────────────────────
+// Requirements: 4.13
+describe('buildDrawerClasses', () => {
+    it("placement='right' → ux4g-drawer ux4g-drawer-right", () => {
+        expect(buildDrawerClasses('right')).toBe('ux4g-drawer ux4g-drawer-right');
+    });
+    it("placement='left' → ux4g-drawer ux4g-drawer-left", () => {
+        expect(buildDrawerClasses('left')).toBe('ux4g-drawer ux4g-drawer-left');
+    });
+    it("placement='top' → ux4g-drawer ux4g-drawer-top", () => {
+        expect(buildDrawerClasses('top')).toBe('ux4g-drawer ux4g-drawer-top');
+    });
+    it("placement='bottom' → ux4g-drawer ux4g-drawer-bottom", () => {
+        expect(buildDrawerClasses('bottom')).toBe('ux4g-drawer ux4g-drawer-bottom');
+    });
+    it("placement='right' open=true → ux4g-drawer ux4g-drawer-right ux4g-drawer-open", () => {
+        expect(buildDrawerClasses('right', true)).toBe('ux4g-drawer ux4g-drawer-right ux4g-drawer-open');
+    });
+    it("placement='left' open=false → ux4g-drawer ux4g-drawer-left (no open modifier)", () => {
+        expect(buildDrawerClasses('left', false)).toBe('ux4g-drawer ux4g-drawer-left');
+    });
+    it("placement='right' open=true extra='my' → ux4g-drawer ux4g-drawer-right ux4g-drawer-open my", () => {
+        expect(buildDrawerClasses('right', true, 'my')).toBe('ux4g-drawer ux4g-drawer-right ux4g-drawer-open my');
+    });
+});

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

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