@instructure/ui-tree-browser 11.7.4-snapshot-103 → 11.7.4-snapshot-105

package/CHANGELOG.md

@@ -3,7 +3,7 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [11.7.4-snapshot-103](https://github.com/instructure/instructure-ui/compare/v11.7.3...v11.7.4-snapshot-103) (2026-07-14)
+## [11.7.4-snapshot-105](https://github.com/instructure/instructure-ui/compare/v11.7.3...v11.7.4-snapshot-105) (2026-07-15)
 
 
 ### Bug Fixes
@@ -14,6 +14,7 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
 ### Features
 
 * **many:** remove deprecated v2 items ([eaf8876](https://github.com/instructure/instructure-ui/commit/eaf88767c9beb95c4e09ee5705c387dfd79e4cb7))
+* **many:** support current spacing tokens in the margin prop for v2 components ([1b47c5f](https://github.com/instructure/instructure-ui/commit/1b47c5f23eaa60b532cdfd53c39bd71f0cf51aaa))
 
 
 ### BREAKING CHANGES

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-tree-browser",
-  "version": "11.7.4-snapshot-103",
+  "version": "11.7.4-snapshot-105",
   "description": "A component for displaying a hierarchical view of information",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -16,21 +16,21 @@
   "dependencies": {
     "@babel/runtime": "^7.29.7",
     "keycode": "^2",
-    "@instructure/emotion": "11.7.4-snapshot-103",
-    "@instructure/shared-types": "11.7.4-snapshot-103",
-    "@instructure/ui-icons": "11.7.4-snapshot-103",
-    "@instructure/ui-react-utils": "11.7.4-snapshot-103",
-    "@instructure/ui-img": "11.7.4-snapshot-103",
-    "@instructure/ui-themes": "11.7.4-snapshot-103",
-    "@instructure/ui-utils": "11.7.4-snapshot-103"
+    "@instructure/emotion": "11.7.4-snapshot-105",
+    "@instructure/ui-icons": "11.7.4-snapshot-105",
+    "@instructure/shared-types": "11.7.4-snapshot-105",
+    "@instructure/ui-react-utils": "11.7.4-snapshot-105",
+    "@instructure/ui-img": "11.7.4-snapshot-105",
+    "@instructure/ui-themes": "11.7.4-snapshot-105",
+    "@instructure/ui-utils": "11.7.4-snapshot-105"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "16.3.2",
     "vitest": "^4.1.9",
-    "@instructure/ui-babel-preset": "11.7.4-snapshot-103",
-    "@instructure/ui-color-utils": "11.7.4-snapshot-103",
-    "@instructure/ui-axe-check": "11.7.4-snapshot-103"
+    "@instructure/ui-axe-check": "11.7.4-snapshot-105",
+    "@instructure/ui-babel-preset": "11.7.4-snapshot-105",
+    "@instructure/ui-color-utils": "11.7.4-snapshot-105"
   },
   "peerDependencies": {
     "react": ">=18 <=19"

package/src/TreeBrowser/v2/README.md

@@ -21,7 +21,7 @@ const Example = () => {
 
   return (
     <>
-      <View display="block" margin="none none medium">
+      <View display="block" margin="none none general.spaceXl">
         <RadioInputGroup
           name="treeBrowserSize"
           defaultValue="medium"
@@ -317,7 +317,7 @@ type: example
     if (props.level > 1) {
       return <div style={{ display: 'flex', alignItems: 'flex-end', padding: '0.6rem 0 0.6rem 1rem', color: 'darkorange' }}>
         <span>{props.name}</span>
-        <Tag text="done" size="small" margin="0 xx-small 0 xx-small"/>
+        <Tag text="done" size="small" margin="0 general.spaceXs 0 general.spaceXs"/>
         <Tag text="class A" size="small"/>
       </div>
     }
@@ -387,7 +387,7 @@ const Example = () => {
             screenReaderLabel="Cancel"
             onClick={(e) => handleExpandToggle(e, false)}
             onKeyDown={(e) => handleKeyPress(e, false)}
-            margin="0 0 0 small"
+            margin="0 0 0 general.spaceMd"
           >
             <XInstUIIcon />
           </IconButton>
@@ -395,7 +395,7 @@ const Example = () => {
             screenReaderLabel="Add new group"
             onClick={(e) => handleExpandToggle(e, false)}
             onKeyDown={(e) => handleKeyPress(e, false)}
-            margin="0 0 0 small"
+            margin="0 0 0 general.spaceMd"
           >
             <CheckInstUIIcon />
           </IconButton>
@@ -480,7 +480,7 @@ const Example = () => {
 
   return (
     <>
-      <View display="block" margin="none none medium">
+      <View display="block" margin="none none general.spaceXl">
         <FormFieldGroup description="Turn on/off sorting">
           <Checkbox checked={sorted} label="Sort" onChange={toggleSort} />
         </FormFieldGroup>
@@ -633,7 +633,7 @@ const Example = () => {
 
   return (
     <>
-      <View display="block" margin="none none medium">
+      <View display="block" margin="none none general.spaceXl">
         <Checkbox
           label="showRootCollection"
           variant="toggle"