xmlui 0.10.13 → 0.10.15

package/dist/scripts/src/components/Redirect/Redirect.spec.js

@@ -0,0 +1,527 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const fixtures_1 = require("../../testing/fixtures");
+// =============================================================================
+// BASIC FUNCTIONALITY TESTS
+// =============================================================================
+fixtures_1.test.describe("Basic Functionality", () => {
+    (0, fixtures_1.test)("redirects immediately when visible with 'to' property", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/target" label="Target" />
+          <NavLink to="/redirect" label="Redirect" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/target">Target Page</Page>
+          <Page url="/redirect">
+            <Redirect to="/target" />
+            <Text>This should not be visible</Text>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to the redirect page
+        yield page.getByRole("link", { name: "Redirect" }).click();
+        // Should be redirected to target page immediately
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/target$/);
+        yield (0, fixtures_1.expect)(page.getByText("Target Page")).toBeVisible();
+        yield (0, fixtures_1.expect)(page.getByText("This should not be visible")).not.toBeVisible();
+    }));
+    (0, fixtures_1.test)("redirects when 'when' property becomes true", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/target" label="Target" />
+          <NavLink to="/conditional" label="Conditional" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/target">Target Page</Page>
+          <Page url="/conditional">
+            <Fragment var.shouldRedirect="{false}">
+              <Button label="Redirect Now" onClick="shouldRedirect = true" />
+              <Redirect when="{shouldRedirect}" to="/target" />
+              <Text>Click button to redirect</Text>
+            </Fragment>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to conditional page
+        yield page.getByRole("link", { name: "Conditional" }).click();
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/conditional$/);
+        yield (0, fixtures_1.expect)(page.getByText("Click button to redirect")).toBeVisible();
+        // Click button to trigger redirect
+        yield page.getByRole("button", { name: "Redirect Now" }).click();
+        // Should be redirected to target page
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/target$/);
+        yield (0, fixtures_1.expect)(page.getByText("Target Page")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("does not redirect when 'when' property is false", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/target" label="Target" />
+          <NavLink to="/no-redirect" label="No Redirect" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/target">Target Page</Page>
+          <Page url="/no-redirect">
+            <Redirect when="{false}" to="/target" />
+            <Text>This should be visible</Text>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to no-redirect page
+        yield page.getByRole("link", { name: "No Redirect" }).click();
+        // Should stay on current page (not redirect)
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/no-redirect$/);
+        yield (0, fixtures_1.expect)(page.getByText("This should be visible")).toBeVisible();
+        yield (0, fixtures_1.expect)(page.getByText("Target Page")).not.toBeVisible();
+    }));
+    (0, fixtures_1.test)("redirects to absolute URLs", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/redirect" label="Redirect" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/redirect">
+            <Redirect to="/accounts/123" />
+            <Text>Redirecting...</Text>
+          </Page>
+          <Page url="/accounts/123">Account 123 Page</Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to redirect page
+        yield page.getByRole("link", { name: "Redirect" }).click();
+        // Should be redirected to absolute URL
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/accounts\/123$/);
+        yield (0, fixtures_1.expect)(page.getByText("Account 123 Page")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("redirects to relative URLs", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/redirect" label="Redirect" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/redirect">
+            <Redirect to="/relative-target" />
+            <Text>Redirecting...</Text>
+          </Page>
+          <Page url="/relative-target">Relative Target Page</Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to redirect page
+        yield page.getByRole("link", { name: "Redirect" }).click();
+        // Should be redirected to relative URL (using absolute path for reliability)
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/relative-target$/);
+        yield (0, fixtures_1.expect)(page.getByText("Relative Target Page")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("redirects with query parameters", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/redirect" label="Redirect" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/redirect">
+            <Redirect to="/target?param=value&count=42" />
+            <Text>Redirecting...</Text>
+          </Page>
+          <Page url="/target">
+            <Text>Target with params: {$queryParams.param} - {$queryParams.count}</Text>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to redirect page
+        yield page.getByRole("link", { name: "Redirect" }).click();
+        // Should be redirected with query parameters
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/target\?param=value&count=42$/);
+        yield (0, fixtures_1.expect)(page.getByText("Target with params: value - 42")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("redirects with route parameters", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/redirect" label="Redirect" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/redirect">
+            <Redirect to="/user/john/profile" />
+            <Text>Redirecting...</Text>
+          </Page>
+          <Page url="/user/:userId/profile">
+            <Text>User Profile: {$routeParams.userId}</Text>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to redirect page
+        yield page.getByRole("link", { name: "Redirect" }).click();
+        // Should be redirected with route parameters
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/user\/john\/profile$/);
+        yield (0, fixtures_1.expect)(page.getByText("User Profile: john")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("works with dynamic 'to' property", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/dynamic" label="Dynamic" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/dynamic">
+            <Fragment var.destination="{'/page1'}">
+              <Button label="Go to Page 1" onClick="destination = '/page1'" />
+              <Button label="Go to Page 2" onClick="destination = '/page2'" />
+              <Button label="Redirect Now" onClick="destination = destination + '?from=dynamic'" />
+              <Redirect when="{destination.endsWith('?from=dynamic')}" to="{destination}" />
+              <Text>Choose destination and click redirect</Text>
+            </Fragment>
+          </Page>
+          <Page url="/page1">Page 1: {$queryParams.from}</Page>
+          <Page url="/page2">Page 2: {$queryParams.from}</Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to dynamic page
+        yield page.getByRole("link", { name: "Dynamic" }).click();
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/dynamic$/);
+        // Set destination to page2
+        yield page.getByRole("button", { name: "Go to Page 2" }).click();
+        // Trigger redirect
+        yield page.getByRole("button", { name: "Redirect Now" }).click();
+        // Should be redirected to page2 with query parameter
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/page2\?from=dynamic$/);
+        yield (0, fixtures_1.expect)(page.getByText("Page 2: dynamic")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("handles empty 'to' property gracefully", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/empty-redirect" label="Empty Redirect" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/empty-redirect">
+            <Redirect to="" />
+            <Text>This should be visible since redirect is empty</Text>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to empty redirect page
+        yield page.getByRole("link", { name: "Empty Redirect" }).click();
+        // Should stay on current page since 'to' is empty
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/empty-redirect$/);
+        yield (0, fixtures_1.expect)(page.getByText("This should be visible since redirect is empty")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("can coexist with other content on the page", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/mixed" label="Mixed Content" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/mixed">
+            <VStack>
+              <Text>Before redirect</Text>
+              <Redirect when="{false}" to="/target" />
+              <Text>After redirect</Text>
+            </VStack>
+          </Page>
+          <Page url="/target">Target Page</Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to mixed content page
+        yield page.getByRole("link", { name: "Mixed Content" }).click();
+        // Should stay on current page and show all content
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/mixed$/);
+        yield (0, fixtures_1.expect)(page.getByText("Before redirect")).toBeVisible();
+        yield (0, fixtures_1.expect)(page.getByText("After redirect")).toBeVisible();
+    }));
+});
+// =============================================================================
+// ACCESSIBILITY TESTS
+// =============================================================================
+fixtures_1.test.describe("Accessibility", () => {
+    (0, fixtures_1.test)("is a non-visual component that doesn't affect screen readers", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/accessible" label="Accessible" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/accessible">
+            <VStack>
+              <Text>Visible content before</Text>
+              <Redirect when="{false}" to="/target" />
+              <Text>Visible content after</Text>
+            </VStack>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to page with redirect
+        yield page.getByRole("link", { name: "Accessible" }).click();
+        // Check that visible content is accessible
+        yield (0, fixtures_1.expect)(page.getByText("Visible content before")).toBeVisible();
+        yield (0, fixtures_1.expect)(page.getByText("Visible content after")).toBeVisible();
+        // The redirect component itself should not be visible or interact with accessibility tools
+        yield (0, fixtures_1.expect)(page.getByText("Redirect")).not.toBeVisible();
+    }));
+    (0, fixtures_1.test)("preserves navigation context for screen readers", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/redirect" label="Redirect to Target" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/redirect">
+            <Redirect to="/target" />
+            <Text>Loading...</Text>
+          </Page>
+          <Page url="/target">
+            <Heading level="h1">Target Page</Heading>
+            <Text>You have been redirected here</Text>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate via the navigation link
+        yield page.getByRole("link", { name: "Redirect to Target" }).click();
+        // Should be redirected and have proper heading structure
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/target$/);
+        yield (0, fixtures_1.expect)(page.getByRole("heading", { level: 1, name: "Target Page" })).toBeVisible();
+        yield (0, fixtures_1.expect)(page.getByText("You have been redirected here")).toBeVisible();
+    }));
+});
+// =============================================================================
+// OTHER EDGE CASES
+// =============================================================================
+fixtures_1.test.describe("Other Edge Cases", () => {
+    (0, fixtures_1.test)("handles multiple redirects on the same page", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/multiple" label="Multiple" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/multiple">
+            <Fragment var.condition="{1}">
+              <Button label="Set to 1" onClick="condition = 1" />
+              <Button label="Set to 2" onClick="condition = 2" />
+              <Redirect when="{condition === 1}" to="/target1" />
+              <Redirect when="{condition === 2}" to="/target2" />
+              <Text>Multiple redirects: {condition}</Text>
+            </Fragment>
+          </Page>
+          <Page url="/target1">Target 1 Page</Page>
+          <Page url="/target2">Target 2 Page</Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to multiple redirects page
+        yield page.getByRole("link", { name: "Multiple" }).click();
+        // Should redirect to target1 immediately (condition starts as 1)
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/target1$/);
+        yield (0, fixtures_1.expect)(page.getByText("Target 1 Page")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("works with complex conditional logic", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/complex" label="Complex" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/complex">
+            <Fragment var.user="{{name: 'john', role: 'admin'}}">
+              <Button label="Make User" onClick="user.role = 'user'" />
+              <Button label="Make Admin" onClick="user.role = 'admin'" />
+              <Redirect when="{user.role === 'admin'}" to="/admin-dashboard" />
+              <Redirect when="{user.role === 'user'}" to="/user-dashboard" />
+              <Text>User: {user.name} ({user.role})</Text>
+            </Fragment>
+          </Page>
+          <Page url="/admin-dashboard">Admin Dashboard</Page>
+          <Page url="/user-dashboard">User Dashboard</Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to complex page
+        yield page.getByRole("link", { name: "Complex" }).click();
+        // Should redirect to admin dashboard (user starts as admin)
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/admin-dashboard$/);
+        yield (0, fixtures_1.expect)(page.getByText("Admin Dashboard")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("handles special characters in URLs", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/special" label="Special" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/special">
+            <Redirect to="/target-with-dashes-and-underscores_test" />
+            <Text>Redirecting...</Text>
+          </Page>
+          <Page url="/target-with-dashes-and-underscores_test">
+            <Text>Special URL Target</Text>
+          </Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to special characters page
+        yield page.getByRole("link", { name: "Special" }).click();
+        // Should handle dashes and underscores in URL
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/target-with-dashes-and-underscores_test$/);
+        yield (0, fixtures_1.expect)(page.getByText("Special URL Target")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("works within nested components", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/nested" label="Nested" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/nested">
+            <VStack>
+              <Card title="Card with Redirect">
+                <VStack>
+                  <Text>Inside a card</Text>
+                  <Fragment var.shouldRedirect="{false}">
+                    <Button label="Redirect from Card" onClick="shouldRedirect = true" />
+                    <Redirect when="{shouldRedirect}" to="/target" />
+                  </Fragment>
+                </VStack>
+              </Card>
+            </VStack>
+          </Page>
+          <Page url="/target">Target from Nested</Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to nested page
+        yield page.getByRole("link", { name: "Nested" }).click();
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/nested$/);
+        // Click button inside nested component
+        yield page.getByRole("button", { name: "Redirect from Card" }).click();
+        // Should redirect from nested context
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/target$/);
+        yield (0, fixtures_1.expect)(page.getByText("Target from Nested")).toBeVisible();
+    }));
+    (0, fixtures_1.test)("maintains browser history properly", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/step1" label="Step 1" />
+          <NavLink to="/redirect-test" label="Redirect Test" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/step1">Step 1 Page</Page>
+          <Page url="/redirect-test">
+            <Redirect to="/final" />
+            <Text>Redirecting...</Text>
+          </Page>
+          <Page url="/final">Final Page</Page>
+        </Pages>
+      </App>
+    `);
+        // Start at home
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/$|#\/$/);
+        // Navigate to step1 first to establish history
+        yield page.getByRole("link", { name: "Step 1" }).click();
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/step1$/);
+        // Then navigate to redirect test (which redirects to final)
+        yield page.getByRole("link", { name: "Redirect Test" }).click();
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/final$/);
+        yield (0, fixtures_1.expect)(page.getByText("Final Page")).toBeVisible();
+        // Test that browser navigation history exists and functions
+        // The exact behavior may vary, but history should be maintained
+        yield page.goBack();
+        // We should be able to navigate in history (exact destination may vary due to redirects)
+        // The key is that history navigation works and doesn't break the app
+        const currentUrl = page.url();
+        (0, fixtures_1.expect)(currentUrl).toMatch(/(step1|final|redirect-test)/);
+    }));
+    (0, fixtures_1.test)("handles null/undefined 'to' values gracefully", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <App>
+        <NavPanel>
+          <NavLink to="/" label="Home" />
+          <NavLink to="/null-redirect" label="Null Redirect" />
+        </NavPanel>
+        <Pages>
+          <Page url="/">Home Page</Page>
+          <Page url="/null-redirect">
+            <Fragment var.destination="{null}">
+              <Button label="Set Null" onClick="destination = null" />
+              <Button label="Set Undefined" onClick="destination = undefined" />
+              <Button label="Set Valid" onClick="destination = '/target'" />
+              <Redirect when="{destination}" to="{destination}" />
+              <Text>Destination: {destination || 'none'}</Text>
+            </Fragment>
+          </Page>
+          <Page url="/target">Target Page</Page>
+        </Pages>
+      </App>
+    `);
+        // Navigate to null redirect page
+        yield page.getByRole("link", { name: "Null Redirect" }).click();
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/null-redirect$/);
+        // Should show content without redirecting
+        yield (0, fixtures_1.expect)(page.getByText("Destination: none")).toBeVisible();
+        // Set valid destination and redirect should work
+        yield page.getByRole("button", { name: "Set Valid" }).click();
+        yield (0, fixtures_1.expect)(page).toHaveURL(/\/target$/);
+        yield (0, fixtures_1.expect)(page.getByText("Target Page")).toBeVisible();
+    }));
+});

package/dist/scripts/src/components/ResponsiveBar/ResponsiveBar.spec.js

@@ -0,0 +1,76 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const fixtures_1 = require("../../testing/fixtures");
+fixtures_1.test.describe("ResponsiveBar", () => {
+    (0, fixtures_1.test)("renders children in horizontal layout", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <ResponsiveBar testId="responsive-bar">
+        <Button testId="btn1" label="Button 1" />
+        <Button testId="btn2" label="Button 2" />
+        <Button testId="btn3" label="Button 3" />
+      </ResponsiveBar>
+      `);
+        const responsiveBar = page.getByTestId("responsive-bar");
+        yield (0, fixtures_1.expect)(responsiveBar).toBeVisible();
+        // All buttons should be visible initially
+        yield (0, fixtures_1.expect)(responsiveBar.locator('[data-testid="btn1"]').first()).toBeVisible();
+        yield (0, fixtures_1.expect)(responsiveBar.locator('[data-testid="btn2"]').first()).toBeVisible();
+        yield (0, fixtures_1.expect)(responsiveBar.locator('[data-testid="btn3"]').first()).toBeVisible();
+    }));
+    (0, fixtures_1.test)("moves overflowing items to dropdown when container is too narrow", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <ResponsiveBar testId="responsive-bar" style="width: 200px;">
+        <Button testId="btn1" label="Very Long Button 1" />
+        <Button testId="btn2" label="Very Long Button 2" />
+        <Button testId="btn3" label="Very Long Button 3" />
+        <Button testId="btn4" label="Very Long Button 4" />
+      </ResponsiveBar>
+      `);
+        const responsiveBar = page.getByTestId("responsive-bar");
+        yield (0, fixtures_1.expect)(responsiveBar).toBeVisible();
+        // Wait for the component to finish measuring and laying out
+        yield page.waitForTimeout(100);
+        // Check if overflow dropdown is present
+        const overflowDropdown = responsiveBar.locator(".overflowDropdown").first();
+        // If there's an overflow dropdown, some items should be moved there
+        if (yield overflowDropdown.isVisible()) {
+            // Click the overflow button to see the dropdown menu
+            const overflowTrigger = overflowDropdown.locator("svg, button").first();
+            yield overflowTrigger.click();
+            // Wait for dropdown to appear
+            yield page.waitForTimeout(100);
+            // There should be some menu items in the dropdown
+            const menuItems = page.locator('[role="menuitem"]');
+            const menuItemCount = yield menuItems.count();
+            (0, fixtures_1.expect)(menuItemCount).toBeGreaterThan(0);
+        }
+    }));
+    (0, fixtures_1.test)("responds to container resize", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`
+      <ResponsiveBar testId="responsive-bar" style="width: 400px; border: 1px solid red;">
+        <Button testId="btn1" label="Button 1" />
+        <Button testId="btn2" label="Button 2" />
+        <Button testId="btn3" label="Button 3" />
+        <Button testId="btn4" label="Button 4" />
+      </ResponsiveBar>
+      `);
+        const responsiveBar = page.getByTestId("responsive-bar");
+        yield (0, fixtures_1.expect)(responsiveBar).toBeVisible();
+        // Initially, check if all buttons are visible or some are in overflow
+        yield page.waitForTimeout(100);
+        // Check the current state
+        const btn1Visible = yield responsiveBar.locator('[data-testid="btn1"]').first().isVisible();
+        const btn4Visible = yield responsiveBar.locator('[data-testid="btn4"]').first().isVisible();
+        // Verify the component is working - at least the first button should be visible
+        (0, fixtures_1.expect)(btn1Visible).toBe(true);
+    }));
+});