@simplysm/solid 13.0.74 → 13.0.76

package/tests/components/form-control/field/TimePicker.spec.tsx

@@ -3,7 +3,7 @@ import { describe, it, expect, vi, beforeEach } from "vitest";
 import { createSignal } from "solid-js";
 import { Time } from "@simplysm/core-common";
 import { TimePicker } from "../../../../src/components/form-control/field/TimePicker";
-import { I18nProvider } from "../../../../src/providers/i18n/I18nContext";
+import { I18nProvider } from "../../../../src/providers/i18n/I18nProvider";
 import { ConfigProvider } from "../../../../src/providers/ConfigContext";
 
 describe("TimePicker component", () => {
@@ -12,32 +12,6 @@ describe("TimePicker component", () => {
   });
 
   describe("basic rendering", () => {
-    it("renders input type=time when unit=minute", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker unit="minute" /></I18nProvider></ConfigProvider>);
-      const input = container.querySelector("input") as HTMLInputElement;
-      expect(input).toBeTruthy();
-      expect(input.type).toBe("time");
-    });
-
-    it("renders input type=time when unit=second", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker unit="second" /></I18nProvider></ConfigProvider>);
-      const input = container.querySelector("input") as HTMLInputElement;
-      expect(input).toBeTruthy();
-      expect(input.type).toBe("time");
-    });
-
-    it("defaults unit to minute", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker /></I18nProvider></ConfigProvider>);
-      const input = container.querySelector("input") as HTMLInputElement;
-      expect(input.type).toBe("time");
-    });
-
-    it("defaults autocomplete to one-time-code", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker /></I18nProvider></ConfigProvider>);
-      const input = container.querySelector("input") as HTMLInputElement;
-      expect(input.autocomplete).toBe("one-time-code");
-    });
-
     it("sets step=1 when unit=second", () => {
       const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker unit="second" /></I18nProvider></ConfigProvider>);
       const input = container.querySelector("input") as HTMLInputElement;
@@ -152,16 +126,11 @@ describe("TimePicker component", () => {
       expect(getByText("10:30")).toBeTruthy();
     });
 
-    it("applies disabled style", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker disabled value={new Time(10, 30, 0)} /></I18nProvider></ConfigProvider>);
-      const div = container.querySelector("div.sd-time-field") as HTMLElement;
-      expect(div.classList.contains("bg-base-100")).toBe(true);
-    });
   });
 
   describe("readonly state", () => {
     it("renders as div when readonly=true", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker readonly value={new Time(10, 30, 0)} /></I18nProvider></ConfigProvider>);
+      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker readOnly value={new Time(10, 30, 0)} /></I18nProvider></ConfigProvider>);
       const input = container.querySelector("input:not([aria-hidden])");
       const div = container.querySelector("div.sd-time-field");
 
@@ -171,40 +140,15 @@ describe("TimePicker component", () => {
 
     it("displays value when readonly", () => {
       const { getByText } = render(() => (
-        <ConfigProvider clientName="test"><I18nProvider><TimePicker unit="minute" readonly value={new Time(10, 30, 0)} /></I18nProvider></ConfigProvider>
+        <ConfigProvider clientName="test"><I18nProvider><TimePicker unit="minute" readOnly value={new Time(10, 30, 0)} /></I18nProvider></ConfigProvider>
       ));
       expect(getByText("10:30")).toBeTruthy();
     });
   });
 
-  describe("size option", () => {
-    it("applies small padding when size=sm", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker size="sm" /></I18nProvider></ConfigProvider>);
-      const wrapper = container.firstChild as HTMLElement;
-      expect(wrapper.classList.contains("py-0.5")).toBe(true);
-    });
-
-    it("applies large padding when size=lg", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker size="lg" /></I18nProvider></ConfigProvider>);
-      const wrapper = container.firstChild as HTMLElement;
-      expect(wrapper.classList.contains("py-2")).toBe(true);
-    });
-  });
-
   describe("inset style", () => {
-    it("applies relative to outer and inset style to content when inset=true", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker inset /></I18nProvider></ConfigProvider>);
-      const outer = container.firstChild as HTMLElement;
-      expect(outer.classList.contains("relative")).toBe(true);
-      expect(outer.classList.contains("border-none")).toBe(false);
-
-      const contentDiv = outer.querySelector("[data-time-field-content]") as HTMLElement;
-      expect(contentDiv.classList.contains("border-none")).toBe(true);
-      expect(contentDiv.classList.contains("bg-primary-50")).toBe(true);
-    });
-
     it("shows content div and no input when inset + readonly", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker inset readonly value={new Time(14, 30, 0)} /></I18nProvider></ConfigProvider>);
+      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker inset readOnly value={new Time(14, 30, 0)} /></I18nProvider></ConfigProvider>);
       const outer = container.firstChild as HTMLElement;
       expect(outer.classList.contains("relative")).toBe(true);
 
@@ -227,36 +171,13 @@ describe("TimePicker component", () => {
     });
 
     it("shows NBSP in content div when inset + empty value", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker inset readonly /></I18nProvider></ConfigProvider>);
+      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker inset readOnly /></I18nProvider></ConfigProvider>);
       const outer = container.firstChild as HTMLElement;
       const contentDiv = outer.querySelector("[data-time-field-content]") as HTMLElement;
       expect(contentDiv.textContent).toBe("\u00A0");
     });
   });
 
-  describe("dark mode style", () => {
-    it("applies dark mode border style", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker /></I18nProvider></ConfigProvider>);
-      const wrapper = container.firstChild as HTMLElement;
-      expect(wrapper.classList.contains("dark:border-base-700")).toBe(true);
-    });
-
-    it("applies dark mode background style", () => {
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker /></I18nProvider></ConfigProvider>);
-      const wrapper = container.firstChild as HTMLElement;
-      expect(wrapper.classList.contains("dark:bg-primary-950/30")).toBe(true);
-    });
-  });
-
-  describe("class merging", () => {
-    it("merges custom class with existing styles", () => {
-      // eslint-disable-next-line tailwindcss/no-custom-classname
-      const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker class="my-custom-class" /></I18nProvider></ConfigProvider>);
-      const wrapper = container.firstChild as HTMLElement;
-      expect(wrapper.classList.contains("my-custom-class")).toBe(true);
-    });
-  });
-
   describe("validation", () => {
     it("sets error message when required and value is empty", () => {
       const { container } = render(() => <ConfigProvider clientName="test"><I18nProvider><TimePicker required value={undefined} /></I18nProvider></ConfigProvider>);

package/tests/components/form-control/numpad/Numpad.spec.tsx

@@ -2,7 +2,7 @@ import { describe, it, expect, vi, beforeEach } from "vitest";
 import { render, fireEvent, screen } from "@solidjs/testing-library";
 import { createSignal } from "solid-js";
 import { Numpad } from "../../../../src/components/form-control/numpad/Numpad";
-import { I18nProvider } from "../../../../src/providers/i18n/I18nContext";
+import { I18nProvider } from "../../../../src/providers/i18n/I18nProvider";
 import { ConfigProvider } from "../../../../src/providers/ConfigContext";
 
 describe("Numpad", () => {
@@ -11,83 +11,6 @@ describe("Numpad", () => {
   });
 
   describe("basic rendering", () => {
-    it("renders root element with data-numpad attribute", () => {
-      const { container } = render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Numpad />
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-      const root = container.querySelector("[data-numpad]");
-      expect(root).toBeTruthy();
-    });
-
-    it("renders digit buttons 0-9", () => {
-      render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Numpad />
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-
-      for (let i = 0; i <= 9; i++) {
-        expect(screen.getByText(String(i))).toBeInTheDocument();
-      }
-    });
-
-    it("renders decimal point button", () => {
-      render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Numpad />
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-      expect(screen.getByText(".")).toBeInTheDocument();
-    });
-
-    it("renders NumberInput (input)", () => {
-      render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Numpad />
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-      const input = screen.getByRole("textbox");
-      expect(input).toBeInTheDocument();
-    });
-
-    it("renders C button with text-danger-500 class", () => {
-      render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Numpad />
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-      const cButton = screen
-        .getAllByRole("button")
-        .find((btn) => btn.className.includes("text-danger-500"));
-      expect(cButton).toBeTruthy();
-    });
-
-    it("renders BS button with text-warning-500 class", () => {
-      render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Numpad />
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-      const bsButton = screen
-        .getAllByRole("button")
-        .find((btn) => btn.className.includes("text-warning-500"));
-      expect(bsButton).toBeTruthy();
-    });
-
     it("does not render ENT button by default", () => {
       render(() => (
         <ConfigProvider clientName="test">

package/tests/components/form-control/select/Select.spec.tsx

@@ -2,7 +2,7 @@ import { render, fireEvent, waitFor } from "@solidjs/testing-library";
 import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
 import { createSignal } from "solid-js";
 import { Select } from "../../../../src/components/form-control/select/Select";
-import { I18nProvider } from "../../../../src/providers/i18n/I18nContext";
+import { I18nProvider } from "../../../../src/providers/i18n/I18nProvider";
 import { ConfigProvider } from "../../../../src/providers/ConfigContext";
 
 describe("Select component", () => {
@@ -14,32 +14,6 @@ describe("Select component", () => {
     localStorage.removeItem("test.i18n-locale");
   });
 
-  describe("basic rendering", () => {
-    it("renders trigger", () => {
-      const { getByRole } = render(() => (
-        <ConfigProvider clientName="test"><I18nProvider>
-          <Select renderValue={(v) => <>{v}</>}>
-          <Select.Item value="apple">사과</Select.Item>
-        </Select>
-        </I18nProvider></ConfigProvider>
-      ));
-
-      expect(getByRole("combobox")).not.toBeNull();
-    });
-
-    it("displays placeholder", () => {
-      const { getByText } = render(() => (
-        <ConfigProvider clientName="test"><I18nProvider>
-          <Select placeholder="Please select" renderValue={(v) => <>{v}</>}>
-          <Select.Item value="apple">사과</Select.Item>
-        </Select>
-        </I18nProvider></ConfigProvider>
-      ));
-
-      expect(getByText("Please select")).not.toBeNull();
-    });
-  });
-
   describe("dropdown opening/closing", () => {
     it("opens dropdown on trigger click", async () => {
       const { getByRole } = render(() => (
@@ -237,33 +211,9 @@ describe("Select component", () => {
 
       expect(document.querySelector("[data-dropdown]")).toBeNull();
     });
-
-    it("sets aria-disabled when disabled", () => {
-      const { getByRole } = render(() => (
-        <ConfigProvider clientName="test"><I18nProvider>
-          <Select disabled renderValue={(v) => <>{v}</>}>
-          <Select.Item value="apple">사과</Select.Item>
-        </Select>
-        </I18nProvider></ConfigProvider>
-      ));
-
-      expect(getByRole("combobox").getAttribute("aria-disabled")).toBe("true");
-    });
   });
 
   describe("accessibility", () => {
-    it("sets role=combobox", () => {
-      const { getByRole } = render(() => (
-        <ConfigProvider clientName="test"><I18nProvider>
-          <Select renderValue={(v) => <>{v}</>}>
-          <Select.Item value="apple">사과</Select.Item>
-        </Select>
-        </I18nProvider></ConfigProvider>
-      ));
-
-      expect(getByRole("combobox")).not.toBeNull();
-    });
-
     it("sets aria-expanded=true when open", async () => {
       const { getByRole } = render(() => (
         <ConfigProvider clientName="test"><I18nProvider>
@@ -285,12 +235,12 @@ describe("Select component", () => {
   });
 
   describe("search functionality", () => {
-    it("displays search input when getSearchText is provided", async () => {
+    it("displays search input when itemSearchText is provided", async () => {
       const { getByRole } = render(() => (
         <ConfigProvider clientName="test"><I18nProvider>
           <Select
           items={["apple", "banana", "cherry"]}
-          getSearchText={(item) => item}
+          itemSearchText={(item) => item}
           renderValue={(v) => <>{v}</>}
         >
           <Select.ItemTemplate>{(item) => <>{item}</>}</Select.ItemTemplate>
@@ -311,7 +261,7 @@ describe("Select component", () => {
         <ConfigProvider clientName="test"><I18nProvider>
           <Select
           items={["apple", "banana", "cherry"]}
-          getSearchText={(item) => item}
+          itemSearchText={(item) => item}
           renderValue={(v) => <>{v}</>}
         >
           <Select.ItemTemplate>{(item) => <>{item}</>}</Select.ItemTemplate>
@@ -342,7 +292,7 @@ describe("Select component", () => {
         <ConfigProvider clientName="test"><I18nProvider>
           <Select
           items={["red apple", "green apple", "banana"]}
-          getSearchText={(item) => item}
+          itemSearchText={(item) => item}
           renderValue={(v) => <>{v}</>}
         >
           <Select.ItemTemplate>{(item) => <>{item}</>}</Select.ItemTemplate>
@@ -368,7 +318,7 @@ describe("Select component", () => {
       });
     });
 
-    it("does not display search input when getSearchText is not provided", async () => {
+    it("does not display search input when itemSearchText is not provided", async () => {
       const { getByRole } = render(() => (
         <ConfigProvider clientName="test"><I18nProvider>
           <Select items={["apple", "banana"]} renderValue={(v) => <>{v}</>}>
@@ -565,12 +515,12 @@ describe("Select component", () => {
   });
 
   describe("hiding handling", () => {
-    it("hides items where getIsHidden is true", async () => {
+    it("hides items where isItemHidden is true", async () => {
       const { getByRole } = render(() => (
         <ConfigProvider clientName="test"><I18nProvider>
           <Select
           items={["apple", "banana", "cherry"]}
-          getIsHidden={(item) => item === "banana"}
+          isItemHidden={(item) => item === "banana"}
           renderValue={(v) => <>{v}</>}
         >
           <Select.ItemTemplate>{(item) => <>{item}</>}</Select.ItemTemplate>
@@ -598,7 +548,7 @@ describe("Select component", () => {
         <ConfigProvider clientName="test"><I18nProvider>
           <Select
           items={["apple", "banana", "cherry"]}
-          getIsHidden={(item) => item === "banana"}
+          isItemHidden={(item) => item === "banana"}
           value="banana"
           renderValue={(v) => <>{v}</>}
         >

package/tests/components/form-control/select/SelectItem.spec.tsx

@@ -1,61 +1,19 @@
 import type { JSX } from "solid-js";
 import { render, fireEvent } from "@solidjs/testing-library";
 import { describe, it, expect, vi } from "vitest";
-import { SelectItem } from "../../../../src/components/form-control/select/SelectItem";
 import {
+  Select,
   SelectContext,
   type SelectContextValue,
-} from "../../../../src/components/form-control/select/SelectContext";
+} from "../../../../src/components/form-control/select/Select";
 
 // Test provider
 function TestProvider(props: { children: JSX.Element; value: SelectContextValue }) {
-   
+
   return <SelectContext.Provider value={props.value}>{props.children}</SelectContext.Provider>;
 }
 
 describe("SelectItem component", () => {
-  describe("basic rendering", () => {
-    it("renders children", () => {
-      const mockContext: SelectContextValue = {
-        multiple: () => false,
-        isSelected: () => false,
-        toggleValue: vi.fn(),
-        closeDropdown: vi.fn(),
-        setHeader: vi.fn(),
-        setAction: vi.fn(),
-        setItemTemplate: vi.fn(),
-      };
-
-      const { getByText } = render(() => (
-        <TestProvider value={mockContext}>
-          <SelectItem value="apple">사과</SelectItem>
-        </TestProvider>
-      ));
-
-      expect(getByText("사과")).not.toBeNull();
-    });
-
-    it("sets data-select-item attribute", () => {
-      const mockContext: SelectContextValue = {
-        multiple: () => false,
-        isSelected: () => false,
-        toggleValue: vi.fn(),
-        closeDropdown: vi.fn(),
-        setHeader: vi.fn(),
-        setAction: vi.fn(),
-        setItemTemplate: vi.fn(),
-      };
-
-      render(() => (
-        <TestProvider value={mockContext}>
-          <SelectItem value="apple">사과</SelectItem>
-        </TestProvider>
-      ));
-
-      expect(document.querySelector("[data-select-item]")).not.toBeNull();
-    });
-  });
-
   describe("selection behavior", () => {
     it("calls toggleValue on click", () => {
       const toggleValue = vi.fn();
@@ -64,14 +22,12 @@ describe("SelectItem component", () => {
         isSelected: () => false,
         toggleValue,
         closeDropdown: vi.fn(),
-        setHeader: vi.fn(),
-        setAction: vi.fn(),
         setItemTemplate: vi.fn(),
       };
 
       const { getByText } = render(() => (
         <TestProvider value={mockContext}>
-          <SelectItem value="apple">사과</SelectItem>
+          <Select.Item value="apple">사과</Select.Item>
         </TestProvider>
       ));
 
@@ -86,14 +42,12 @@ describe("SelectItem component", () => {
         isSelected: () => false,
         toggleValue: vi.fn(),
         closeDropdown,
-        setHeader: vi.fn(),
-        setAction: vi.fn(),
         setItemTemplate: vi.fn(),
       };
 
       const { getByText } = render(() => (
         <TestProvider value={mockContext}>
-          <SelectItem value="apple">사과</SelectItem>
+          <Select.Item value="apple">사과</Select.Item>
         </TestProvider>
       ));
 
@@ -108,14 +62,12 @@ describe("SelectItem component", () => {
         isSelected: () => false,
         toggleValue: vi.fn(),
         closeDropdown,
-        setHeader: vi.fn(),
-        setAction: vi.fn(),
         setItemTemplate: vi.fn(),
       };
 
       const { getByText } = render(() => (
         <TestProvider value={mockContext}>
-          <SelectItem value="apple">사과</SelectItem>
+          <Select.Item value="apple">사과</Select.Item>
         </TestProvider>
       ));
 
@@ -128,17 +80,15 @@ describe("SelectItem component", () => {
     it("sets aria-selected=true on selected item", () => {
       const mockContext: SelectContextValue = {
         multiple: () => false,
-        isSelected: (v) => v === "apple",
+        isSelected: (v: unknown) => v === "apple",
         toggleValue: vi.fn(),
         closeDropdown: vi.fn(),
-        setHeader: vi.fn(),
-        setAction: vi.fn(),
         setItemTemplate: vi.fn(),
       };
 
       render(() => (
         <TestProvider value={mockContext}>
-          <SelectItem value="apple">사과</SelectItem>
+          <Select.Item value="apple">사과</Select.Item>
         </TestProvider>
       ));
 
@@ -155,16 +105,14 @@ describe("SelectItem component", () => {
         isSelected: () => false,
         toggleValue,
         closeDropdown: vi.fn(),
-        setHeader: vi.fn(),
-        setAction: vi.fn(),
         setItemTemplate: vi.fn(),
       };
 
       const { getByText } = render(() => (
         <TestProvider value={mockContext}>
-          <SelectItem value="apple" disabled>
+          <Select.Item value="apple" disabled>
             사과
-          </SelectItem>
+          </Select.Item>
         </TestProvider>
       ));
 

package/tests/components/layout/sidebar/Sidebar.spec.tsx

@@ -15,13 +15,13 @@ vi.mock("@solidjs/router", () => ({
   useNavigate: vi.fn(() => vi.fn()),
 }));
 
-import { Sidebar, useSidebarContext } from "../../../../src";
-import { I18nProvider } from "../../../../src/providers/i18n/I18nContext";
+import { Sidebar, useSidebar } from "../../../../src";
+import { I18nProvider } from "../../../../src/providers/i18n/I18nProvider";
 import { ConfigProvider } from "../../../../src/providers/ConfigContext";
 
 // ToggleCapture helper - Extract setToggle from Context for external control
 const ToggleCapture: Component<{ onCapture: (setToggle: Setter<boolean>) => void }> = (props) => {
-  const { setToggle } = useSidebarContext();
+  const { setToggle } = useSidebar();
    
   props.onCapture(setToggle);
   return null;
@@ -37,38 +37,6 @@ describe("Sidebar component", () => {
     vi.clearAllMocks();
   });
 
-  describe("basic rendering", () => {
-    it("displays children inside sidebar", () => {
-      const { getByText } = render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Sidebar.Container>
-              <Sidebar>
-                <span>Sidebar content</span>
-              </Sidebar>
-            </Sidebar.Container>
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-
-      expect(getByText("Sidebar content")).toBeTruthy();
-    });
-
-    it("renders as aside element", () => {
-      const { container } = render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Sidebar.Container>
-              <Sidebar>Content</Sidebar>
-            </Sidebar.Container>
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-
-      expect(container.querySelector("aside")).toBeTruthy();
-    });
-  });
-
   describe("open/closed state", () => {
     it("on desktop with toggle=false shows open state (translateX(0))", () => {
       mockCreateMediaQuery.mockReturnValue(() => true); // Desktop
@@ -146,91 +114,4 @@ describe("Sidebar component", () => {
       expect(sidebar.style.transform).toBe("translateX(0px)");
     });
   });
-
-  describe("aria attributes", () => {
-    it("has aria-hidden=false when open", () => {
-      mockCreateMediaQuery.mockReturnValue(() => true); // Desktop
-
-      const { container } = render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Sidebar.Container>
-              <Sidebar>Content</Sidebar>
-            </Sidebar.Container>
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-
-      // toggle=false (initial) → open on desktop
-      const sidebar = container.querySelector("aside");
-      expect(sidebar?.getAttribute("aria-hidden")).toBe("false");
-    });
-
-    it("has aria-hidden=true when closed", () => {
-      mockCreateMediaQuery.mockReturnValue(() => false); // Mobile
-
-      const { container } = render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Sidebar.Container>
-              <Sidebar>Content</Sidebar>
-            </Sidebar.Container>
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-
-      // toggle=false (initial) → closed on mobile
-      const sidebar = container.querySelector("aside");
-      expect(sidebar?.getAttribute("aria-hidden")).toBe("true");
-    });
-
-    it("sets inert attribute when closed", () => {
-      mockCreateMediaQuery.mockReturnValue(() => false); // Mobile
-
-      const { container } = render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Sidebar.Container>
-              <Sidebar>Content</Sidebar>
-            </Sidebar.Container>
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-
-      // toggle=false (initial) → closed on mobile
-      const sidebar = container.querySelector("aside");
-      expect(sidebar?.hasAttribute("inert")).toBe(true);
-    });
-  });
-
-  describe("style merging", () => {
-    it("merges custom classes", () => {
-      const { container } = render(() => (
-        <ConfigProvider clientName="test">
-          <I18nProvider>
-            <Sidebar.Container>
-              {/* eslint-disable-next-line tailwindcss/no-custom-classname */}
-              <Sidebar class="my-custom-class">Content</Sidebar>
-            </Sidebar.Container>
-          </I18nProvider>
-        </ConfigProvider>
-      ));
-
-      const sidebar = container.querySelector("aside");
-      expect(sidebar?.classList.contains("my-custom-class")).toBe(true);
-    });
-  });
-
-  describe("Context usage", () => {
-    it("throws error when useSidebarContext is used outside SidebarContainer", () => {
-      const TestComponent = () => {
-        useSidebarContext();
-        return <div>Test</div>;
-      };
-
-      expect(() => render(() => <TestComponent />)).toThrow(
-        "useSidebarContext can only be used inside SidebarContainer",
-      );
-    });
-  });
 });