chore: bump to solid 1.7

CONTRIBUTING.md

@@ -116,6 +116,6 @@ Kobalte follows the [conventional commits](https://www.conventionalcommits.org/e
 
 ### Tests
 
-We use [jest](https://jestjs.io/) for unit tests and [solid-testing-library](https://github.com/solidjs/solid-testing-library) for rendering and writing assertions. Please make sure you include tests with your pull requests. Our CI will run the tests on PRs, you can see on each PR whether you have passed all our checks.
+We use [jest](https://jestjs.io/) for unit tests and [@solidjs/testing-library](https://github.com/solidjs/@solidjs/testing-library) for rendering and writing assertions. Please make sure you include tests with your pull requests. Our CI will run the tests on PRs, you can see on each PR whether you have passed all our checks.
 
 - To run tests locally - `pnpm test`.

apps/docs/package.json

@@ -35,7 +35,7 @@
     "@docsearch/js": "3.3.3",
     "@kobalte/core": "0.8.2",
     "@solidjs/meta": "0.28.2",
-    "@solidjs/router": "0.7.1",
+    "@solidjs/router": "0.8.2",
     "@tanstack/solid-virtual": "3.0.0-beta.6",
     "clsx": "1.2.1"
   },
@@ -46,26 +46,26 @@
     "@tailwindcss/typography": "0.5.9",
     "acorn": "8.8.2",
     "autoprefixer": "10.4.14",
-    "babel-preset-solid": "1.6.13",
+    "babel-preset-solid": "1.7.0",
     "encoding": "0.1.13",
-    "github-slugger": "1.5.0",
+    "github-slugger": "2.0.0",
     "iconv-lite": "0.6.3",
-    "node-fetch": "2.6.9",
+    "node-fetch": "3.3.1",
     "postcss": "8.4.21",
     "rehype-pretty-code": "0.9.4",
     "rehype-raw": "6.1.1",
     "rehype-slug": "5.1.0",
     "remark-code-extra": "1.0.1",
     "remark-gfm": "3.0.1",
-    "remark-shiki-twoslash": "3.1.1",
+    "remark-shiki-twoslash": "3.1.2",
     "safer-buffer": "2.1.2",
     "shiki": "0.14.1",
-    "solid-js": "1.6.15",
+    "solid-js": "1.7.0",
     "solid-mdx": "0.0.6",
-    "solid-start": "0.2.23",
-    "solid-start-netlify": "0.2.23",
-    "solid-start-node": "0.2.23",
-    "tailwindcss": "3.2.7",
+    "solid-start": "0.2.24",
+    "solid-start-netlify": "0.2.24",
+    "solid-start-node": "0.2.24",
+    "tailwindcss": "3.3.0",
     "typescript": "4.9.5",
     "undici": "5.21.0",
     "unist-util-visit": "4.1.2",

apps/playground/package.json

@@ -33,13 +33,13 @@
   "dependencies": {
     "@kobalte/core": "^0.8.2",
     "@kobalte/utils": "^0.6.1",
-    "solid-js": "1.6.15"
+    "solid-js": "1.7.0"
   },
   "devDependencies": {
     "@kobalte/tailwindcss": "^0.5.0",
-    "autoprefixer": "10.4.13",
+    "autoprefixer": "10.4.14",
     "postcss": "8.4.21",
-    "tailwindcss": "3.2.7",
+    "tailwindcss": "3.3.0",
     "typescript": "4.9.5",
     "vite": "3.2.5",
     "vite-plugin-solid": "2.6.1"

package.json

@@ -47,45 +47,44 @@
   "devDependencies": {
     "@babel/core": "7.21.3",
     "@babel/preset-env": "7.20.2",
-    "@changesets/cli": "2.26.0",
-    "@commitlint/cli": "17.4.2",
-    "@commitlint/config-conventional": "17.4.2",
-    "@commitlint/cz-commitlint": "17.4.2",
-    "@jest/types": "28.1.1",
-    "@testing-library/dom": "8.17.1",
+    "@changesets/cli": "2.26.1",
+    "@commitlint/cli": "17.5.1",
+    "@commitlint/config-conventional": "17.4.4",
+    "@commitlint/cz-commitlint": "17.5.0",
+    "@jest/types": "28.1.3",
+    "@solidjs/testing-library": "0.7.0",
+    "@testing-library/dom": "8.20.0",
     "@testing-library/jest-dom": "5.16.5",
     "@testing-library/user-event": "14.4.3",
-    "@types/jest": "28.1.4",
-    "@types/node": "18.13.0",
+    "@types/jest": "28.1.8",
+    "@types/node": "18.15.11",
     "@types/testing-library__jest-dom": "5.14.5",
-    "@typescript-eslint/eslint-plugin": "5.51.0",
-    "@typescript-eslint/parser": "5.51.0",
-    "babel-preset-solid": "1.6.13",
+    "@typescript-eslint/eslint-plugin": "5.57.0",
+    "@typescript-eslint/parser": "5.57.0",
+    "babel-preset-solid": "1.7.0",
     "commitizen": "4.3.0",
-    "eslint": "8.36.0",
-    "eslint-config-prettier": "8.6.0",
+    "eslint": "8.37.0",
+    "eslint-config-prettier": "8.8.0",
     "eslint-import-resolver-typescript": "2.7.1",
     "eslint-plugin-import": "2.27.5",
     "eslint-plugin-jsx-a11y": "6.7.1",
     "eslint-plugin-prettier": "4.2.1",
     "eslint-plugin-simple-import-sort": "10.0.0",
-    "eslint-plugin-solid": "0.11.0",
+    "eslint-plugin-solid": "0.12.0",
     "husky": "8.0.3",
     "inquirer": "8.2.5",
-    "jest": "28.1.2",
-    "jest-environment-jsdom": "28.1.2",
-    "lint-staged": "13.1.1",
-    "prettier": "2.8.4",
-    "prettier-plugin-tailwindcss": "0.2.2",
+    "jest": "28.1.3",
+    "jest-environment-jsdom": "28.1.3",
+    "lint-staged": "13.2.0",
+    "prettier": "2.8.7",
+    "prettier-plugin-tailwindcss": "0.2.6",
     "rollup": "3.20.2",
     "rollup-preset-solid": "2.0.1",
-    "solid-js": "1.6.15",
-    "solid-testing-library": "0.3.0",
+    "solid-js": "1.7.0",
     "sort-package-json": "2.4.1",
-    "ts-jest": "28.0.5",
-    "tsup": "6.6.3",
-    "tsup-preset-solid": "0.1.8",
-    "turbo": "1.7.4",
+    "ts-jest": "28.0.8",
+    "tsup": "6.7.0",
+    "turbo": "1.8.8",
     "typescript": "4.9.5",
     "vite": "3.2.5",
     "vite-plugin-solid": "2.6.1"

packages/core/package.json

@@ -53,7 +53,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@floating-ui/dom": "^1.2.3",
+    "@floating-ui/dom": "^1.2.5",
     "@internationalized/date": "^3.1.0",
     "@internationalized/number": "^3.2.0",
     "@internationalized/string": "^3.1.0",
@@ -63,7 +63,7 @@
     "@kobalte/tests": "^0.3.1"
   },
   "peerDependencies": {
-    "solid-js": "^1.6.15"
+    "solid-js": "^1.7.0"
   },
   "publishConfig": {
     "access": "public"

packages/core/src/accordion/accordion.test.tsx

@@ -6,10 +6,10 @@
  * https://github.com/radix-ui/primitives/blob/21a7c97dc8efa79fecca36428eec49f187294085/packages/react/accordion/src/Accordion.test.tsx
  */
 
-import { checkAccessibility, installPointerEvent } from "@kobalte/tests";
+import { installPointerEvent } from "@kobalte/tests";
 import userEvent from "@testing-library/user-event";
 import { ComponentProps, For } from "solid-js";
-import { fireEvent, render, screen, within } from "solid-testing-library";
+import { fireEvent, render, screen, within } from "@solidjs/testing-library";
 
 import * as Accordion from ".";
 
@@ -33,8 +33,6 @@ function AccordionTest(props: ComponentProps<typeof Accordion.Root>) {
 describe("Accordion", () => {
   installPointerEvent();
 
-  checkAccessibility([<AccordionTest />]);
-
   it("renders properly", () => {
     render(() => <AccordionTest defaultValue={["one"]} />);
 

packages/core/src/alert-dialog/alert-dialog.test.tsx

@@ -6,7 +6,7 @@
  * https://github.com/adobe/react-spectrum/blob/810579b671791f1593108f62cdc1893de3a220e3/packages/@react-spectrum/dialog/test/Dialog.test.js
  */
 
-import { render, screen } from "solid-testing-library";
+import { render, screen } from "@solidjs/testing-library";
 
 import * as AlertDialog from ".";
 

packages/core/src/alert/alert.test.tsx

@@ -1,23 +1,8 @@
-import {
-  checkAccessibility,
-  itRendersChildren,
-  itSupportsClass,
-  itSupportsRef,
-  itSupportsStyle,
-} from "@kobalte/tests";
-import { render, screen } from "solid-testing-library";
+import { render, screen } from "@solidjs/testing-library";
 
 import * as Alert from ".";
 
-const defaultProps = {};
-
 describe("Alert", () => {
-  checkAccessibility([<Alert.Root>Alert</Alert.Root>]);
-  itRendersChildren(Alert.Root as any, defaultProps);
-  itSupportsClass(Alert.Root as any, defaultProps);
-  itSupportsRef(Alert.Root as any, defaultProps, HTMLDivElement);
-  itSupportsStyle(Alert.Root as any, defaultProps);
-
   it("should have attribute 'role=alert'", () => {
     render(() => <Alert.Root>Alert</Alert.Root>);
 

packages/core/src/breadcrumbs/breadcrumbs.test.tsx

@@ -7,7 +7,7 @@
  * https://github.com/adobe/react-spectrum/blob/38a57d3360268fb0cb55c6b42b9a5f6f13bb57d6/packages/@react-aria/breadcrumbs/test/useBreadcrumbItem.test.js
  */
 
-import { render, screen } from "solid-testing-library";
+import { render, screen } from "@solidjs/testing-library";
 
 import * as Breadcrumbs from ".";
 

packages/core/src/button/button.test.tsx

@@ -1,27 +1,12 @@
-import {
-  checkAccessibility,
-  installPointerEvent,
-  itRendersChildren,
-  itSupportsClass,
-  itSupportsRef,
-  itSupportsStyle,
-} from "@kobalte/tests";
-import { render, screen } from "solid-testing-library";
+import { installPointerEvent } from "@kobalte/tests";
+import { render, screen } from "@solidjs/testing-library";
 
 import { As } from "../polymorphic";
 import * as Button from ".";
 
-const defaultProps: Button.ButtonRootOptions = {};
-
 describe("Button", () => {
   installPointerEvent();
 
-  checkAccessibility([<Button.Root>Button</Button.Root>]);
-  itRendersChildren(Button.Root as any, defaultProps);
-  itSupportsClass(Button.Root as any, defaultProps);
-  itSupportsRef(Button.Root as any, defaultProps, HTMLButtonElement);
-  itSupportsStyle(Button.Root as any, defaultProps);
-
   it("should have attribute 'type=button' by default", () => {
     render(() => <Button.Root data-testid="button">Button</Button.Root>);
 

packages/core/src/checkbox/checkbox-input.tsx

@@ -56,7 +56,7 @@ export function CheckboxInput(props: CheckboxInputProps) {
     );
   };
 
-  const onChange: JSX.EventHandlerUnion<HTMLInputElement, Event> = e => {
+  const onChange: JSX.ChangeEventHandlerUnion<HTMLInputElement, Event> = e => {
     callHandler(e, local.onChange);
 
     e.stopPropagation();
@@ -75,12 +75,12 @@ export function CheckboxInput(props: CheckboxInputProps) {
     target.checked = context.isChecked();
   };
 
-  const onFocus: JSX.EventHandlerUnion<any, FocusEvent> = e => {
+  const onFocus: JSX.FocusEventHandlerUnion<any, FocusEvent> = e => {
     callHandler(e, local.onFocus);
     context.setIsFocused(true);
   };
 
-  const onBlur: JSX.EventHandlerUnion<any, FocusEvent> = e => {
+  const onBlur: JSX.FocusEventHandlerUnion<any, FocusEvent> = e => {
     callHandler(e, local.onBlur);
     context.setIsFocused(false);
   };

packages/core/src/checkbox/checkbox-root.tsx

@@ -190,8 +190,10 @@ interface CheckboxRootChildProps extends Pick<CheckboxRootOptions, "children"> {
 }
 
 function CheckboxRootChild(props: CheckboxRootChildProps) {
-  return children(() => {
+  const resolvedChildren = children(() => {
     const body = props.children;
     return isFunction(body) ? body(props.state) : body;
   });
+
+  return <>{resolvedChildren()}</>;
 }

packages/core/src/checkbox/checkbox.test.tsx

@@ -7,7 +7,7 @@
  */
 
 import { installPointerEvent } from "@kobalte/tests";
-import { fireEvent, render, screen } from "solid-testing-library";
+import { fireEvent, render, screen } from "@solidjs/testing-library";
 
 import * as Checkbox from ".";
 

packages/core/src/collapsible/collapsible.test.tsx

@@ -6,9 +6,9 @@
  * https://github.com/radix-ui/primitives/blob/21a7c97dc8efa79fecca36428eec49f187294085/packages/react/collapsible/src/Collapsible.test.tsx
  */
 
-import { checkAccessibility, installPointerEvent } from "@kobalte/tests";
+import { installPointerEvent } from "@kobalte/tests";
 import { ComponentProps } from "solid-js";
-import { fireEvent, render, screen } from "solid-testing-library";
+import { fireEvent, render, screen } from "@solidjs/testing-library";
 
 import * as Collapsible from ".";
 
@@ -25,8 +25,6 @@ const Example = (props: ComponentProps<typeof Collapsible.Root>) => (
 describe("Collapsible", () => {
   installPointerEvent();
 
-  checkAccessibility([<Example />]);
-
   it("should toggle between open/close the content when clicking the trigger", async () => {
     render(() => <Example />);
 

packages/core/src/dialog/dialog.test.tsx

@@ -6,7 +6,7 @@
  * https://github.com/adobe/react-spectrum/blob/810579b671791f1593108f62cdc1893de3a220e3/packages/@react-spectrum/dialog/test/Dialog.test.js
  */
 
-import { render, screen } from "solid-testing-library";
+import { render, screen } from "@solidjs/testing-library";
 
 import * as Dialog from ".";
 

packages/core/src/form-control/create-form-control.test.tsx

@@ -8,7 +8,7 @@
  */
 
 import { ParentProps } from "solid-js";
-import { render, screen } from "solid-testing-library";
+import { render, screen } from "@solidjs/testing-library";
 
 import { createFormControl, CreateFormControlProps } from "./create-form-control";
 import { FormControlContext } from "./form-control-context";

packages/core/src/i18n/i18n.test.tsx

@@ -1,5 +1,5 @@
 import { createRoot, onCleanup, onMount } from "solid-js";
-import { render, screen } from "solid-testing-library";
+import { render, screen } from "@solidjs/testing-library";
 
 import { createDefaultLocale } from "./create-default-locale";
 import { I18nProvider, useLocale } from "./i18n-provider";

packages/core/src/image/image.test.tsx

@@ -6,8 +6,7 @@
  * https://github.com/radix-ui/primitives/blob/21a7c97dc8efa79fecca36428eec49f187294085/packages/react/avatar/src/Avatar.test.tsx
  */
 
-import { checkAccessibility } from "@kobalte/tests";
-import { render, screen } from "solid-testing-library";
+import { render, screen } from "@solidjs/testing-library";
 
 import * as Image from ".";
 
@@ -17,14 +16,6 @@ const IMAGE_ALT_TEXT = "Fake Image";
 const DELAY = 300;
 
 describe("Image", () => {
-  describe("with fallback and no image", () => {
-    checkAccessibility([
-      <Image.Root data-testid={ROOT_TEST_ID}>
-        <Image.Fallback>{FALLBACK_TEXT}</Image.Fallback>
-      </Image.Root>,
-    ]);
-  });
-
   describe("with fallback and a working image", () => {
     const originalGlobalImage = window.Image;
 

packages/core/src/link/link.test.tsx

@@ -1,27 +1,12 @@
-import {
-  checkAccessibility,
-  installPointerEvent,
-  itRendersChildren,
-  itSupportsClass,
-  itSupportsRef,
-  itSupportsStyle,
-} from "@kobalte/tests";
-import { render, screen } from "solid-testing-library";
+import { installPointerEvent } from "@kobalte/tests";
+import { render, screen } from "@solidjs/testing-library";
 
 import { As } from "../polymorphic";
 import * as Link from ".";
 
-const defaultProps: Link.LinkRootOptions = {};
-
 describe("Link", () => {
   installPointerEvent();
 
-  checkAccessibility([<Link.Root href="#">Link</Link.Root>]);
-  itRendersChildren(Link.Root as any, defaultProps);
-  itSupportsClass(Link.Root as any, defaultProps);
-  itSupportsRef(Link.Root as any, defaultProps, HTMLAnchorElement);
-  itSupportsStyle(Link.Root as any, defaultProps);
-
   it("should not have attribute 'role=link' when it's a native link", () => {
     render(() => <Link.Root data-testid="link">Link</Link.Root>);