@instructure/ui-checkbox 11.7.3-snapshot-30 → 11.7.3-snapshot-31

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.3-snapshot-30](https://github.com/instructure/instructure-ui/compare/v11.7.2...v11.7.3-snapshot-30) (2026-05-07)
+## [11.7.3-snapshot-31](https://github.com/instructure/instructure-ui/compare/v11.7.2...v11.7.3-snapshot-31) (2026-05-07)
 
 
 ### Bug Fixes
@@ -11,6 +11,11 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
 * **many:** update dependencies, remove lots of Babel plugins, remove Webpack 4 support ([f916fca](https://github.com/instructure/instructure-ui/commit/f916fcafdddcb2d7de401f93e8ff92cfdfa47bba))
 
 
+### Features
+
+* **ui-checkbox:** add data-checked attribute to reflect checked state ([a790019](https://github.com/instructure/instructure-ui/commit/a790019ed2b47064a01b7ec532494cc723943241))
+
+
 
 
 

package/es/Checkbox/v2/index.js

@@ -257,6 +257,7 @@ let Checkbox = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle),
       children: _jsxs("div", {
         css: styles?.container,
         children: [_jsx("input", {
+          "data-checked": indeterminate ? 'mixed' : this.checked,
           ...props,
           id: this.id,
           value: value,

package/lib/Checkbox/v2/index.js

@@ -277,6 +277,7 @@ let Checkbox = exports.Checkbox = (_dec = (0, _withDeterministicId.withDetermini
       children: (0, _jsxRuntime.jsxs)("div", {
         css: styles?.container,
         children: [(0, _jsxRuntime.jsx)("input", {
+          "data-checked": indeterminate ? 'mixed' : this.checked,
           ...props,
           id: this.id,
           value: value,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-checkbox",
-  "version": "11.7.3-snapshot-30",
+  "version": "11.7.3-snapshot-31",
   "description": " styled HTML input type='checkbox' component.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -16,27 +16,27 @@
   "dependencies": {
     "@babel/runtime": "^7.29.2",
     "keycode": "^2",
-    "@instructure/console": "11.7.3-snapshot-30",
-    "@instructure/emotion": "11.7.3-snapshot-30",
-    "@instructure/ui-dom-utils": "11.7.3-snapshot-30",
-    "@instructure/shared-types": "11.7.3-snapshot-30",
-    "@instructure/ui-form-field": "11.7.3-snapshot-30",
-    "@instructure/ui-icons": "11.7.3-snapshot-30",
-    "@instructure/ui-react-utils": "11.7.3-snapshot-30",
-    "@instructure/ui-svg-images": "11.7.3-snapshot-30",
-    "@instructure/ui-themes": "11.7.3-snapshot-30",
-    "@instructure/ui-view": "11.7.3-snapshot-30",
-    "@instructure/uid": "11.7.3-snapshot-30",
-    "@instructure/ui-utils": "11.7.3-snapshot-30"
+    "@instructure/console": "11.7.3-snapshot-31",
+    "@instructure/emotion": "11.7.3-snapshot-31",
+    "@instructure/shared-types": "11.7.3-snapshot-31",
+    "@instructure/ui-form-field": "11.7.3-snapshot-31",
+    "@instructure/ui-dom-utils": "11.7.3-snapshot-31",
+    "@instructure/ui-icons": "11.7.3-snapshot-31",
+    "@instructure/ui-react-utils": "11.7.3-snapshot-31",
+    "@instructure/ui-utils": "11.7.3-snapshot-31",
+    "@instructure/ui-view": "11.7.3-snapshot-31",
+    "@instructure/uid": "11.7.3-snapshot-31",
+    "@instructure/ui-themes": "11.7.3-snapshot-31",
+    "@instructure/ui-svg-images": "11.7.3-snapshot-31"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "15.0.7",
     "@testing-library/user-event": "^14.6.1",
     "vitest": "^3.2.2",
-    "@instructure/ui-babel-preset": "11.7.3-snapshot-30",
-    "@instructure/ui-axe-check": "11.7.3-snapshot-30",
-    "@instructure/ui-color-utils": "11.7.3-snapshot-30"
+    "@instructure/ui-axe-check": "11.7.3-snapshot-31",
+    "@instructure/ui-color-utils": "11.7.3-snapshot-31",
+    "@instructure/ui-babel-preset": "11.7.3-snapshot-31"
   },
   "peerDependencies": {
     "react": ">=18 <=19"

package/src/Checkbox/v2/README.md

@@ -162,6 +162,10 @@ type: example
 />
 ```
 
+### Querying checked state from the DOM
+
+The underlying `<input>` has a `data-checked` attribute (`"true"`, `"false"`, or `"mixed"` when indeterminate) that can be queried from the DOM to read the current state.
+
 ### Guidelines
 
 ```js

package/src/Checkbox/v2/index.tsx

@@ -325,6 +325,7 @@ class Checkbox extends Component<CheckboxProps, CheckboxState> {
       >
         <div css={styles?.container}>
           <input
+            data-checked={indeterminate ? 'mixed' : this.checked}
             {...props}
             id={this.id}
             value={value}

package/src/CheckboxGroup/v2/README.md

@@ -80,6 +80,10 @@ type: example
 </CheckboxGroup>
 ```
 
+### Querying checked state from the DOM
+
+Each `<Checkbox>` in the group exposes a `data-checked` attribute (`"true"` or `"false"`) on its underlying `<input>` that can be queried from the DOM to read the current state, for example for analytics tracking tools.
+
 ### Guidelines
 
 ```js