@stratakit/structures 0.5.2 → 0.5.3

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## 0.5.3
+
+- [#1108](https://github.com/iTwin/design-system/pull/1108): Decoupled the styles for `@stratakit/bricks` and `@stratakit/structures` from `@stratakit/foundations` so that the latter does not indirectly depend on the former two. This change also reduces the need for these packages to remain in lockstep.
+- Updated dependencies:
+  - @stratakit/foundations@0.4.3
+  - @stratakit/bricks@0.5.3
+
 ## 0.5.2
 
 - [#1078](https://github.com/iTwin/design-system/pull/1078): Added `DropdownMenu.Group` component used to group menu items within a dropdown menu.

package/dist/DEV/~utils.ListItem.js

@@ -3,7 +3,9 @@ import { Role } from "@ariakit/react/role";
 import { Text } from "@stratakit/bricks";
 import { forwardRef } from "@stratakit/foundations/secret-internals";
 import cx from "classnames";
+import { useInit } from "./~utils.useInit.js";
 const ListItem = forwardRef((props, forwardedRef) => {
+  useInit();
   return /* @__PURE__ */ jsx(
     Role.div,
     {

package/dist/DEV/~utils.useInit.js

@@ -1,15 +1,21 @@
 import * as React from "react";
-import { RootContext } from "@stratakit/foundations/secret-internals";
+import {
+  RootContext,
+  useSafeContext
+} from "@stratakit/foundations/secret-internals";
+import css from "./styles.css.js";
 const packageName = "@stratakit/structures";
+const key = `${packageName}@${"0.5.3"}`;
 function useInit() {
-  const rootContext = React.useContext(RootContext);
-  if (!rootContext) {
-    DEV: console.error(
-      `All ${packageName} components must be used within a <Root> component from @stratakit/foundations.`
-    );
-  } else {
-    rootContext.versions?.set(packageName, "0.5.2");
-  }
+  const rootContext = useSafeContext(RootContext);
+  if (!rootContext.versions?.has(packageName))
+    rootContext.versions?.set(packageName, "0.5.3");
+  const { rootNode, loadStyles } = rootContext;
+  React.useInsertionEffect(() => {
+    if (!rootNode || !loadStyles) return;
+    const { cleanup } = loadStyles(rootNode, { css, key });
+    return cleanup;
+  }, [rootNode, loadStyles]);
 }
 export {
   useInit

package/dist/~utils.ListItem.js

@@ -3,7 +3,9 @@ import { Role } from "@ariakit/react/role";
 import { Text } from "@stratakit/bricks";
 import { forwardRef } from "@stratakit/foundations/secret-internals";
 import cx from "classnames";
+import { useInit } from "./~utils.useInit.js";
 const ListItem = forwardRef((props, forwardedRef) => {
+  useInit();
   return /* @__PURE__ */ jsx(Role.div, {
     role: "listitem",
     ...props,

package/dist/~utils.useInit.js

@@ -1,12 +1,44 @@
+import { c as _c } from "react-compiler-runtime";
 import * as React from "react";
-import { RootContext } from "@stratakit/foundations/secret-internals";
+import { RootContext, useSafeContext } from "@stratakit/foundations/secret-internals";
+import css from "./styles.css.js";
 const packageName = "@stratakit/structures";
+const key = `${packageName}@${"0.5.3"}`;
 function useInit() {
-  const rootContext = React.useContext(RootContext);
-  if (!rootContext) {
+  const $ = _c(4);
+  const rootContext = useSafeContext(RootContext);
+  if (!rootContext.versions?.has(packageName)) {
+    rootContext.versions?.set(packageName, "0.5.3");
+  }
+  const {
+    rootNode,
+    loadStyles
+  } = rootContext;
+  let t0;
+  let t1;
+  if ($[0] !== loadStyles || $[1] !== rootNode) {
+    t0 = () => {
+      if (!rootNode || !loadStyles) {
+        return;
+      }
+      const {
+        cleanup
+      } = loadStyles(rootNode, {
+        css,
+        key
+      });
+      return cleanup;
+    };
+    t1 = [rootNode, loadStyles];
+    $[0] = loadStyles;
+    $[1] = rootNode;
+    $[2] = t0;
+    $[3] = t1;
   } else {
-    rootContext.versions?.set(packageName, "0.5.2");
+    t0 = $[2];
+    t1 = $[3];
   }
+  React.useInsertionEffect(t0, t1);
 }
 export {
   useInit

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@stratakit/structures",
   "type": "module",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "license": "MIT",
   "sideEffects": false,
   "types": "./dist/index.d.ts",
@@ -119,24 +119,24 @@
     "ui"
   ],
   "dependencies": {
-    "@ariakit/react": "^0.4.19",
-    "@stratakit/bricks": "^0.5.2",
+    "@ariakit/react": "^0.4.20",
+    "@stratakit/bricks": "^0.5.3",
     "classnames": "^2.5.1",
     "react-compiler-runtime": "^1.0.0",
-    "zustand": "^5.0.8"
+    "zustand": "^5.0.9"
   },
   "devDependencies": {
     "@types/node": "^22.19.1",
-    "@types/react": "^19.2.2",
+    "@types/react": "^19.2.7",
     "@types/react-dom": "^19.2.3",
     "esbuild": "^0.27.0",
-    "react": "^19.2.0",
-    "react-dom": "^19.2.0",
+    "react": "^19.2.1",
+    "react-dom": "^19.2.1",
     "typescript": "~5.9.3",
-    "@stratakit/foundations": "0.4.2"
+    "@stratakit/foundations": "0.4.3"
   },
   "peerDependencies": {
-    "@stratakit/foundations": "^0.4.2",
+    "@stratakit/foundations": "^0.4.3",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },