@torpor/ui 0.1.6 → 0.2.0

package/test/Menu/basic.test.ts

@@ -0,0 +1,57 @@
+import { fireEvent, getByText, queryByText } from "@testing-library/dom";
+import "@testing-library/jest-dom/vitest";
+import { mount } from "@torpor/view";
+import { describe, expect, it } from "vitest";
+import MenuBasic from "./components/MenuBasic.torp";
+
+describe("Menu", () => {
+	it("Basic operation", async () => {
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		mount(container, MenuBasic);
+
+		// By default, the top-level buttons should be displayed
+		expect(queryByText(container, "Menu button")).toBeInTheDocument();
+		expect(queryByText(container, "Check popout button")).toBeInTheDocument();
+		expect(queryByText(container, "Radio popout button")).toBeInTheDocument();
+
+		// Submenus should not be displayed
+		expect(queryByText(container, "Checked 1")).not.toBeInTheDocument();
+		expect(queryByText(container, "Radio 1")).not.toBeInTheDocument();
+
+		// Clicking a popout button should show the appropriate menu
+		fireEvent.click(getByText(container, "Check popout button"));
+		expect(queryByText(container, "Checked 1")).toBeInTheDocument();
+		expect(queryByText(container, "Radio 1")).not.toBeInTheDocument();
+
+		// Clicking another popout button should show that menu instead
+		fireEvent.click(getByText(container, "Radio popout button"));
+		//expect(queryByText(container, 'Checked 1')).not.toBeInTheDocument();
+		expect(queryByText(container, "Radio 1")).toBeInTheDocument();
+
+		// Checking a box should show or hide the indicator
+		fireEvent.click(getByText(container, "Check popout button"));
+		expect(queryByText(container, "Tick 1")).not.toBeInTheDocument();
+		expect(queryByText(container, "Tick 2")).not.toBeInTheDocument();
+		fireEvent.click(getByText(container, "Checked 1"));
+		expect(queryByText(container, "Tick 1")).toBeInTheDocument();
+		expect(queryByText(container, "Tick 2")).not.toBeInTheDocument();
+		fireEvent.click(getByText(container, "Checked 2"));
+		expect(queryByText(container, "Tick 1")).toBeInTheDocument();
+		expect(queryByText(container, "Tick 2")).toBeInTheDocument();
+		fireEvent.click(getByText(container, "Checked 1"));
+		expect(queryByText(container, "Tick 1")).not.toBeInTheDocument();
+		expect(queryByText(container, "Tick 2")).toBeInTheDocument();
+
+		// Checking a radio should show the indicator, and hide another indicator if already selected
+		fireEvent.click(getByText(container, "Radio popout button"));
+		expect(queryByText(container, "Circle 1")).not.toBeInTheDocument();
+		expect(queryByText(container, "Circle 2")).not.toBeInTheDocument();
+		fireEvent.click(getByText(container, "Radio 1"));
+		expect(queryByText(container, "Circle 1")).toBeInTheDocument();
+		expect(queryByText(container, "Circle 2")).not.toBeInTheDocument();
+		fireEvent.click(getByText(container, "Radio 2"));
+		expect(queryByText(container, "Circle 1")).not.toBeInTheDocument();
+		expect(queryByText(container, "Circle 2")).toBeInTheDocument();
+	});
+});

package/test/Menu/components/MenuAccessibility.torp

@@ -0,0 +1,59 @@
+import { Popover, PopoverContent } from "../../../src/Popover";
+import {
+	Menu,
+	MenuButton,
+	MenuRadioGroup,
+	MenuCheck,
+	MenuRadio,
+	MenuIndicator,
+	MenuPopout,
+	MenuPopoutTrigger,
+	MenuPopoutContent,
+	MenuSeparator
+} from "../../../src/Menu";
+
+export default function MenuAccessibility() {
+	@render {
+		<Popover visible>
+			<PopoverContent>
+				<Menu ariaLabel="A menu">
+					<MenuButton>Menu button</MenuButton>
+					<MenuButton disabled>Disabled button</MenuButton>
+					<MenuSeparator>---</MenuSeparator>
+					<MenuPopout>
+						<MenuPopoutTrigger>Check popout button</MenuPopoutTrigger>
+						<MenuPopoutContent>
+							<Menu ariaLabel="A checked menu">
+								<MenuCheck>
+									<MenuIndicator>✔</MenuIndicator>
+									Checked 1
+								</MenuCheck>
+								<MenuCheck>
+									<MenuIndicator>✔</MenuIndicator>
+									Checked 2
+								</MenuCheck>
+							</Menu>
+						</MenuPopoutContent>
+					</MenuPopout>
+					<MenuPopout>
+						<MenuPopoutTrigger>Radio popout button</MenuPopoutTrigger>
+						<MenuPopoutContent>
+							<Menu ariaLabel="A radio menu">
+								<MenuRadioGroup ariaLabel="Options">
+									<MenuRadio value="radio1">
+										<MenuIndicator>•</MenuIndicator>
+										Radio 1
+									</MenuRadio>
+									<MenuRadio value="radio2">
+										<MenuIndicator>•</MenuIndicator>
+										Radio 2
+									</MenuRadio>
+								</MenuRadioGroup>
+							</Menu>
+						</MenuPopoutContent>
+					</MenuPopout>
+				</Menu>
+			</PopoverContent>
+		</Popover>
+	}
+}

package/test/Menu/components/MenuBasic.torp

@@ -0,0 +1,58 @@
+import { Popover, PopoverContent } from "../../../src/Popover";
+import {
+	Menu,
+	MenuButton,
+	MenuRadioGroup,
+	MenuCheck,
+	MenuRadio,
+	MenuIndicator,
+	MenuPopout,
+	MenuPopoutTrigger,
+	MenuPopoutContent,
+	MenuSeparator
+} from "../../../src/Menu";
+
+export default function MenuBasic() {
+	@render {
+		<Popover visible>
+			<PopoverContent>
+				<Menu ariaLabel="A menu">
+					<MenuButton>Menu button</MenuButton>
+					<MenuSeparator>---</MenuSeparator>
+					<MenuPopout>
+						<MenuPopoutTrigger>Check popout button</MenuPopoutTrigger>
+						<MenuPopoutContent>
+							<Menu ariaLabel="A checked menu">
+								<MenuCheck>
+									<MenuIndicator>Tick 1</MenuIndicator>
+									Checked 1
+								</MenuCheck>
+								<MenuCheck>
+									<MenuIndicator>Tick 2</MenuIndicator>
+									Checked 2
+								</MenuCheck>
+							</Menu>
+						</MenuPopoutContent>
+					</MenuPopout>
+					<MenuPopout>
+						<MenuPopoutTrigger>Radio popout button</MenuPopoutTrigger>
+						<MenuPopoutContent>
+							<Menu ariaLabel="A radio menu">
+								<MenuRadioGroup ariaLabel="Font color">
+									<MenuRadio value="radio1">
+										<MenuIndicator>Circle 1</MenuIndicator>
+										Radio 1
+									</MenuRadio>
+									<MenuRadio value="radio2">
+										<MenuIndicator>Circle 2</MenuIndicator>
+										Radio 2
+									</MenuRadio>
+								</MenuRadioGroup>
+							</Menu>
+						</MenuPopoutContent>
+					</MenuPopout>
+				</Menu>
+			</PopoverContent>
+		</Popover>
+	}
+}

package/test/MenuBar/accessibility.test.ts

@@ -0,0 +1,86 @@
+import { fireEvent, getByText, queryByText } from "@testing-library/dom";
+import "@testing-library/jest-dom/vitest";
+import { mount } from "@torpor/view";
+import { describe, expect, it } from "vitest";
+import MenuBarAccessibility from "./components/MenuBarAccessibility.torp";
+
+describe("MenuBar", () => {
+	it("Accessibility", async () => {
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		mount(container, MenuBarAccessibility);
+
+		// Tests from https://www.w3.org/WAI/ARIA/apg/patterns/menu/
+		// NOTE: MenuBar is a menubar
+
+		// A menu is a container of items that represent choices. The element serving as the menu has
+		// a role of either menu or menubar
+		expect(queryByText(container, "Top level")?.parentElement?.parentElement).toHaveAttribute(
+			"role",
+			"menubar",
+		);
+
+		// The items contained in a menu are child elements of the containing menu or menubar and have
+		// any of the following roles:
+		//   * menuitem
+		//   * menuitemcheckbox
+		//   * menuitemradio
+		expect(queryByText(container, "Top level")).toHaveAttribute("role", "menuitem");
+
+		// If activating a menuitem opens a submenu, the menuitem is known as a parent menuitem. A submenu's
+		// menu element is:
+		//   * Contained inside the same menu element as its parent menuitem
+		//   * Is the sibling element immediately following its parent menuitem
+
+		// A parent menuitem has aria-haspopup set to either menu or true
+		expect(queryByText(container, "Top level")).toHaveAttribute("aria-haspopup", "true");
+
+		// A parent menuitem has aria-expanded set to false when its child menu is not visible and set
+		// to true when the child menu is visible
+		expect(queryByText(container, "Top level")).toHaveAttribute("aria-expanded", "false");
+		fireEvent.click(getByText(container, "Top level"));
+		expect(queryByText(container, "Top level")).toHaveAttribute("aria-expanded", "true");
+
+		// One of the following approaches is used to enable scripts to move focus among items in a
+		// menu as described in Keyboard Navigation Inside Components:
+		//   * The menu container has tabindex set to -1 or 0 and aria-activedescendant set to the ID
+		//     of the focused item
+		//   * Each item in the menu has tabindex set to -1, except in a menubar, where the first item
+		//     has tabindex set to 0
+
+		// When a menuitemcheckbox or menuitemradio is checked, aria-checked is set to true
+		// NOTE: We don't (currently?) have checkboxes or radios in MenuBars
+
+		// When a menu item is disabled, aria-disabled is set to true
+		expect(queryByText(container, "Top level")).not.toHaveAttribute("aria-disabled");
+		expect(queryByText(container, "Disabled")).toHaveAttribute("aria-disabled", "true");
+
+		// Items in a menu may be divided into groups by placing an element with a role of separator
+		// between groups. For example, this technique should be used when a menu contains a set of
+		// menuitemradio items
+		expect(queryByText(container, "---")).toHaveAttribute("role", "separator");
+
+		// All separators should have aria-orientation consistent with the separator's orientation
+		// NOTE: What does this mean? None of the example separators have aria-orientation set
+
+		// If a menubar has a visible label, the element with role menubar has aria-labelledby set to
+		// a value that refers to the labelling element. Otherwise, the menubar element has a label
+		// provided by aria-label
+		// NOTE: We only support aria-label and it's required
+		expect(queryByText(container, "Top level")?.parentElement?.parentElement).toHaveAttribute(
+			"aria-label",
+			"Window menu",
+		);
+
+		// If a menubar is vertically oriented, it has aria-orientation set to vertical. The default
+		// value of aria-orientation for a menubar is horizontal
+		expect(queryByText(container, "Top level")?.parentElement?.parentElement).toHaveAttribute(
+			"aria-orientation",
+			"horizontal",
+		);
+		expect(queryByText(container, "Sub item 1")?.parentElement).toHaveAttribute(
+			"aria-orientation",
+			"vertical",
+		);
+	});
+});

package/test/MenuBar/basic.test.ts

@@ -0,0 +1,21 @@
+import { fireEvent, getByText, queryByText } from "@testing-library/dom";
+import "@testing-library/jest-dom/vitest";
+import { mount } from "@torpor/view";
+import { describe, expect, it } from "vitest";
+import MenuBarBasic from "./components/MenuBarBasic.torp";
+
+describe("MenuBar", () => {
+	it("Basic operation", async () => {
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		mount(container, MenuBarBasic);
+
+		// The top level item should be displayed
+		expect(queryByText(container, "Top level")).toBeInTheDocument();
+		expect(queryByText(container, "Sub item 1")).not.toBeInTheDocument();
+
+		// Clicking the top level item should show the sub item
+		fireEvent.click(getByText(container, "Top level"));
+		expect(queryByText(container, "Sub item 1")).toBeInTheDocument();
+	});
+});

package/test/MenuBar/components/MenuBarAccessibility.torp

@@ -0,0 +1,34 @@
+import {
+	MenuBar,
+	MenuBarItem,
+	MenuBarItemTrigger,
+	MenuBarItemContent
+} from "../../../src/MenuBar";
+import { Menu, MenuButton, MenuSeparator } from "../../../src/Menu";
+
+export default function MenuBarAccessibility() {
+	@render {
+		<MenuBar ariaLabel="Window menu">
+			<MenuBarItem>
+				<MenuBarItemTrigger>Top level</MenuBarItemTrigger>
+				<MenuBarItemContent>
+					<Menu ariaLabel="Sub window menu">
+						<MenuButton>Sub item 1</MenuButton>
+						<MenuButton>Sub item 2</MenuButton>
+						<MenuSeparator>---</MenuSeparator>
+						<MenuButton>Sub item 3</MenuButton>
+					</Menu>
+				</MenuBarItemContent>
+			</MenuBarItem>
+			<MenuBarItem>
+				<MenuBarItemTrigger disabled>Disabled</MenuBarItemTrigger>
+				<MenuBarItemContent>
+					<Menu ariaLabel="Disabled sub window menu">
+						<MenuButton>Disabled sub 1</MenuButton>
+						<MenuButton>Disabled sub 2</MenuButton>
+					</Menu>
+				</MenuBarItemContent>
+			</MenuBarItem>
+		</MenuBar>
+	}
+}

package/test/MenuBar/components/MenuBarBasic.torp

@@ -0,0 +1,25 @@
+import {
+	MenuBar,
+	MenuBarItem,
+	MenuBarItemTrigger,
+	MenuBarItemContent
+} from "../../../src/MenuBar";
+import { Menu, MenuButton, MenuSeparator } from "../../../src/Menu";
+
+export default function MenuBarBasic() {
+	@render {
+		<MenuBar ariaLabel="Window menu">
+			<MenuBarItem>
+				<MenuBarItemTrigger>Top level</MenuBarItemTrigger>
+				<MenuBarItemContent>
+					<Menu ariaLabel="Sub window menu">
+						<MenuButton>Sub item 1</MenuButton>
+						<MenuButton>Sub item 2</MenuButton>
+						<MenuSeparator />
+						<MenuButton>Sub item 3</MenuButton>
+					</Menu>
+				</MenuBarItemContent>
+			</MenuBarItem>
+		</MenuBar>
+	}
+}

package/test/Notification/accessibility.test.ts

@@ -0,0 +1,21 @@
+import { queryByText } from "@testing-library/dom";
+import "@testing-library/jest-dom/vitest";
+import { mount } from "@torpor/view";
+import { describe, expect, it } from "vitest";
+import NotificationAccessibility from "./components/NotificationAccessibility.torp";
+
+describe("Notification", () => {
+	it("Accessibility", async () => {
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		mount(container, NotificationAccessibility);
+
+		// Tests from https://www.w3.org/WAI/ARIA/apg/patterns/alert/
+
+		// The widget has a role of alert
+		expect(queryByText(container, "Here's a notification")?.parentElement).toHaveAttribute(
+			"role",
+			"alert",
+		);
+	});
+});

package/test/Notification/components/CustomNotification.torp

@@ -0,0 +1,14 @@
+import {
+	Notification,
+	NotificationContent,
+	NotificationClose
+} from "../../../src/Notification/index";
+
+export default function CustomNotification() {
+	@render {
+		<Notification>
+			<NotificationContent>{$props.text}</NotificationContent>
+			<NotificationClose>Close me</NotificationClose>
+		</Notification>
+	}
+}

package/test/Notification/components/NotificationAccessibility.torp

@@ -0,0 +1,14 @@
+import {
+	Notification,
+	NotificationContent,
+	NotificationClose
+} from "../../../src/Notification/index";
+
+export default function NotificationAccessibility() {
+	@render {
+		<Notification visible>
+			<NotificationContent>Here's a notification</NotificationContent>
+			<NotificationClose>Close me</NotificationClose>
+		</Notification>
+	}
+}

package/test/Notification/components/NotificationFunction.torp

@@ -0,0 +1,20 @@
+import {
+	Notification,
+	NotificationContainer,
+	NotificationContent,
+	NotificationClose,
+	showNotification
+} from "../../../src/Notification/index";
+import CustomNotification from "./CustomNotification.torp";
+
+export default function NotificationFunction() {
+	function show() {
+		showNotification(CustomNotification, { text: "Here's a notification" });
+	}
+
+	@render {
+		<button type="button" onclick={show}>Show a notification</button>
+
+		<NotificationContainer />
+	}
+}

package/test/Notification/components/NotificationVariable.torp

@@ -0,0 +1,22 @@
+import {
+	Notification,
+	NotificationContent,
+	NotificationClose
+} from "../../../src/Notification/index";
+
+export default function NotificationVariable() {
+	let $state = $watch({
+		showNotification: false
+	});
+
+	@render {
+		<button type="button" onclick={(e) => ($state.showNotification = !$state.showNotification)}>
+			Show a notification
+		</button>
+
+		<Notification &visible={$state.showNotification}>
+			<NotificationContent>Here's a notification</NotificationContent>
+			<NotificationClose>Close me</NotificationClose>
+		</Notification>
+	}
+}

package/test/Notification/function.test.ts

@@ -0,0 +1,25 @@
+import { getByText, queryByText } from "@testing-library/dom";
+import "@testing-library/jest-dom/vitest";
+import userEvent from "@testing-library/user-event";
+import { mount } from "@torpor/view";
+import { describe, expect, it } from "vitest";
+import NotificationFunction from "./components/NotificationFunction.torp";
+
+describe("Notification", () => {
+	it("Showing with a function", async () => {
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		mount(container, NotificationFunction);
+
+		// By default, the notification shouldn't be shown
+		expect(queryByText(container, "Here's a notification")).not.toBeInTheDocument();
+
+		// Clicking the button should show the notification
+		await userEvent.click(getByText(container, "Show a notification"));
+		expect(queryByText(container, "Here's a notification")).toBeInTheDocument();
+
+		// Clicking the close button should hide the notification
+		await userEvent.click(getByText(container, "Close me"));
+		expect(queryByText(container, "Here's a notification")).not.toBeInTheDocument();
+	});
+});

package/test/Notification/variable.test.ts

@@ -0,0 +1,25 @@
+import { getByText, queryByText } from "@testing-library/dom";
+import "@testing-library/jest-dom/vitest";
+import userEvent from "@testing-library/user-event";
+import { mount } from "@torpor/view";
+import { describe, expect, it } from "vitest";
+import NotificationVariable from "./components/NotificationVariable.torp";
+
+describe("Notification", () => {
+	it("Showing with a variable", async () => {
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		mount(container, NotificationVariable);
+
+		// By default, the notification shouldn't be shown
+		expect(queryByText(container, "Here's a notification")).not.toBeInTheDocument();
+
+		// Clicking the button should show the notification
+		await userEvent.click(getByText(container, "Show a notification"));
+		expect(queryByText(container, "Here's a notification")).toBeInTheDocument();
+
+		// Clicking the close button should hide the notification
+		await userEvent.click(getByText(container, "Close me"));
+		expect(queryByText(container, "Here's a notification")).not.toBeInTheDocument();
+	});
+});

package/test/Popover/components/CustomDialog.torp

@@ -0,0 +1,25 @@
+import { Popover, PopoverContent } from "../../../src/Popover/index";
+import {
+	Dialog,
+	DialogBody,
+	DialogFooter,
+	DialogButton
+} from "../../../src/Dialog/index";
+
+export default function CustomDialog() {
+	@render {
+		<Popover visible {$props.callback}>
+			<PopoverContent>
+				<Dialog>
+					<DialogBody>
+						<p>Which color do you prefer?</p>
+					</DialogBody>
+					<DialogFooter>
+						<DialogButton value="blue">Blue</DialogButton>
+						<DialogButton value="red">Red</DialogButton>
+					</DialogFooter>
+				</Dialog>
+			</PopoverContent>
+		</Popover>
+	}
+}

package/test/Popover/components/PromptFunction.torp

@@ -0,0 +1,19 @@
+import { showPopover } from "../../../src/Popover/index";
+import CustomDialog from "./CustomDialog.torp";
+
+export default function PromptFunction() {
+	let anchor;
+	let $state = $watch({ color: "" });
+
+	async function show() {
+		showPopover(CustomDialog, anchor, { callback: (x) => $state.color = x });
+	}
+
+	@render {
+		<button type="button" &ref={anchor} onclick={show}>Show the prompt</button>
+
+		@if ($state.color) {
+			<p>Your favorite color is {$state.color}?!</p>
+		}
+	}
+}

package/test/Popover/components/PromptVariable.torp

@@ -0,0 +1,38 @@
+import { Popover, PopoverContent } from "../../../src/Popover/index";
+import {
+	Dialog,
+	DialogBody,
+	DialogFooter,
+	DialogButton
+} from "../../../src/Dialog/index";
+
+export default function PromptVariable() {
+	let $state = $watch({
+		color: "",
+		showPopover: false
+	});
+
+	@render {
+		<button type="button" onclick={(e) => ($state.showPopover = !$state.showPopover)}>
+			Show the prompt
+		</button>
+
+		@if ($state.color) {
+			<p>Your favorite color is {$state.color}?!</p>
+		}
+
+		<Popover &visible={$state.showPopover}>
+			<PopoverContent>
+				<Dialog>
+					<DialogBody>
+						<p>Which color do you prefer?</p>
+					</DialogBody>
+					<DialogFooter>
+						<DialogButton value="blue" onclick={() => ($state.color = "blue")}>Blue</DialogButton>
+						<DialogButton value="red" onclick={() => ($state.color = "red")}>Red</DialogButton>
+					</DialogFooter>
+				</Dialog>
+			</PopoverContent>
+		</Popover>
+	}
+}

package/test/Popover/function.test.ts

@@ -0,0 +1,26 @@
+import { getByText, queryByText } from "@testing-library/dom";
+import "@testing-library/jest-dom/vitest";
+import userEvent from "@testing-library/user-event";
+import { mount } from "@torpor/view";
+import { describe, expect, it } from "vitest";
+import PromptFunction from "./components/PromptFunction.torp";
+
+describe("Prompt", () => {
+	it("Showing with a function", async () => {
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		mount(container, PromptFunction);
+
+		// By default, the prompt shouldn't be shown
+		expect(queryByText(container, "Which color do you prefer?")).not.toBeInTheDocument();
+
+		// Clicking the button should show the prompt
+		await userEvent.click(getByText(container, "Show the prompt"));
+		expect(queryByText(container, "Which color do you prefer?")).toBeInTheDocument();
+
+		// Clicking the blue button should hide the prompt and set the value
+		await userEvent.click(getByText(container, "Blue"));
+		expect(queryByText(container, "Which color do you prefer?")).not.toBeInTheDocument();
+		expect(queryByText(container, "Your favorite color is blue?!")).toBeInTheDocument();
+	});
+});

package/test/Popover/variable.test.ts

@@ -0,0 +1,27 @@
+import { getByText, queryByText } from "@testing-library/dom";
+import "@testing-library/jest-dom/vitest";
+import userEvent from "@testing-library/user-event";
+import { mount } from "@torpor/view";
+import { describe, expect, it } from "vitest";
+import PromptVariable from "./components/PromptVariable.torp";
+
+describe("Prompt", () => {
+	it("Showing with a variable", async () => {
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		mount(container, PromptVariable);
+
+		// By default, the prompt shouldn't be shown
+		expect(queryByText(container, "Which color do you prefer?")).not.toBeInTheDocument();
+		expect(queryByText(container, "Your favorite color is blue?!")).not.toBeInTheDocument();
+
+		// Clicking the button should show the prompt
+		await userEvent.click(getByText(container, "Show the prompt"));
+		expect(queryByText(container, "Which color do you prefer?")).toBeInTheDocument();
+
+		// Clicking the blue button should hide the prompt and set the value
+		await userEvent.click(getByText(container, "Blue"));
+		expect(queryByText(container, "Which color do you prefer?")).not.toBeInTheDocument();
+		expect(queryByText(container, "Your favorite color is blue?!")).toBeInTheDocument();
+	});
+});

package/tsup.config.ts

@@ -8,15 +8,23 @@ type Config =
 export default defineConfig({
 	entry: [
 		"src/Accordion/index.ts",
+		"src/Breadcrumb/index.ts",
+		"src/Calendar/index.ts",
 		"src/Dialog/index.ts",
+		"src/Disclosure/index.ts",
+		"src/Drawer/index.ts",
+		"src/Menu/index.ts",
+		"src/MenuBar/index.ts",
 		"src/NavMenu/index.ts",
-		"src/Offscreen/index.ts",
+		"src/Notification/index.ts",
 		"src/Popover/index.ts",
 		"src/TabGroup/index.ts",
-		"src/motion.ts",
+		"src/form/index.ts",
+		"src/icons/index.ts",
+		"src/motion/index.ts",
 	],
-	format: ["esm", "cjs"],
-	dts: { entry: ["src/motion.ts"] },
+	format: "esm",
+	dts: { entry: ["src/motion/index.ts"] },
 	clean: true,
 	metafile: true,
 	sourcemap: true,