@instructure/ui-instructure 11.7.8-snapshot-6 → 11.7.8-snapshot-10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/CHANGELOG.md +3 -4
  2. package/es/AiInformation/v2/index.js +4 -1
  3. package/es/DataPermissionLevels/v2/index.js +15 -10
  4. package/es/DataPermissionLevels/v2/styles.js +1 -0
  5. package/lib/AiInformation/v2/index.js +4 -1
  6. package/lib/DataPermissionLevels/v2/index.js +15 -10
  7. package/lib/DataPermissionLevels/v2/styles.js +1 -0
  8. package/package.json +16 -16
  9. package/src/AiInformation/v2/README.md +2 -0
  10. package/src/AiInformation/v2/index.tsx +4 -1
  11. package/src/AiInformation/v2/props.ts +1 -0
  12. package/src/DataPermissionLevels/v2/index.tsx +8 -6
  13. package/src/DataPermissionLevels/v2/styles.ts +1 -0
  14. package/tsconfig.build.tsbuildinfo +1 -1
  15. package/types/AiInformation/v2/index.d.ts.map +1 -1
  16. package/types/AiInformation/v2/props.d.ts +1 -0
  17. package/types/AiInformation/v2/props.d.ts.map +1 -1
  18. package/types/DataPermissionLevels/v2/index.d.ts.map +1 -1
  19. package/types/DataPermissionLevels/v2/styles.d.ts.map +1 -1
package/CHANGELOG.md CHANGED
@@ -3,12 +3,11 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [11.7.8-snapshot-6](https://github.com/instructure/instructure-ui/compare/v11.7.7...v11.7.8-snapshot-6) (2026-10-02)
7
-
8
- **Note:** Version bump only for package @instructure/ui-instructure
9
-
6
+ ## [11.7.8-snapshot-10](https://github.com/instructure/instructure-ui/compare/v11.7.7...v11.7.8-snapshot-10) (2026-10-02)
10
7
 
8
+ ### Bug Fixes
11
9
 
10
+ * **ui-instructure:** improve screen reader support in AiInformation and DataPermissionLevels ([ed2720b](https://github.com/instructure/instructure-ui/commit/ed2720b84d126ad1f0c452d200e351cf3b2f538f))
12
11
 
13
12
 
14
13
  ## [11.7.7](https://github.com/instructure/instructure-ui/compare/v11.7.6...v11.7.7) (2026-09-23)
package/es/AiInformation/v2/index.js CHANGED
@@ -71,7 +71,7 @@ const AiInformation = ({
71
71
  renderTrigger: trigger,
72
72
  isShowingContent: open,
73
73
  on: "click",
74
- screenReaderLabel: "Popover Dialog Example",
74
+ screenReaderLabel: `IgniteAI, ${title}`,
75
75
  shouldContainFocus: true,
76
76
  shouldReturnFocus: true,
77
77
  shouldCloseOnDocumentClick: true,
@@ -98,6 +98,7 @@ const AiInformation = ({
98
98
  featureName,
99
99
  privacyNoticeText,
100
100
  privacyNoticeUrl,
101
+ privacyNoticeScreenReaderLabel,
101
102
  permissionLevelText,
102
103
  permissionLevel,
103
104
  description,
@@ -110,9 +111,11 @@ const AiInformation = ({
110
111
  css: styles?.privacyNotice,
111
112
  children: _jsx(Link, {
112
113
  href: privacyNoticeUrl,
114
+ "aria-label": privacyNoticeScreenReaderLabel,
113
115
  renderIcon: _jsx(ExternalLinkInstUIIcon, {
114
116
  size: "sm"
115
117
  }),
118
+ target: "_blank",
116
119
  iconPlacement: "end",
117
120
  variant: "standalone",
118
121
  children: privacyNoticeText
package/es/DataPermissionLevels/v2/index.js CHANGED
@@ -95,7 +95,7 @@ const DataPermissionLevels = ({
95
95
  highlighted
96
96
  }, index) => _jsxs("div", {
97
97
  css: highlighted ? styles?.highlightedCard : styles?.card,
98
- children: [highlighted ? _jsxs("div", {
98
+ children: [highlighted ? _jsxs("h3", {
99
99
  css: styles?.currentFeature,
100
100
  children: [_jsxs(Heading, {
101
101
  color: "primary-on",
@@ -109,15 +109,20 @@ const DataPermissionLevels = ({
109
109
  })]
110
110
  }) : null, _jsxs("div", {
111
111
  css: styles?.contentContainer,
112
- children: [_jsx("div", {
113
- css: styles?.level,
114
- children: level
115
- }), _jsx("div", {
116
- css: styles?.permissionTitle,
117
- children: _jsxs(Text, {
118
- variant: "descriptionPage",
119
- children: [title, " "]
120
- })
112
+ children: [_jsxs("h3", {
113
+ style: {
114
+ all: 'unset'
115
+ },
116
+ children: [_jsx("div", {
117
+ css: styles?.level,
118
+ children: level
119
+ }), _jsx("div", {
120
+ css: styles?.permissionTitle,
121
+ children: _jsxs(Text, {
122
+ variant: "descriptionPage",
123
+ children: [title, " "]
124
+ })
125
+ })]
121
126
  }), _jsx(Text, {
122
127
  variant: "content",
123
128
  color: "secondary",
package/es/DataPermissionLevels/v2/styles.js CHANGED
@@ -77,6 +77,7 @@ const generateStyle = (componentTheme, _props, sharedTokens) => {
77
77
  color: componentTheme?.levelColor
78
78
  },
79
79
  currentFeature: {
80
+ all: 'unset',
80
81
  label: 'data-permission-levels__current-feature',
81
82
  background: `
82
83
  linear-gradient(to right, ${componentTheme.aiTextLeftGradientColor} 0%, ${componentTheme.aiTextRightGradientColor} 100%)`,
package/lib/AiInformation/v2/index.js CHANGED
@@ -77,7 +77,7 @@ category: components/AI Components
77
77
  renderTrigger: trigger,
78
78
  isShowingContent: open,
79
79
  on: "click",
80
- screenReaderLabel: "Popover Dialog Example",
80
+ screenReaderLabel: `IgniteAI, ${title}`,
81
81
  shouldContainFocus: true,
82
82
  shouldReturnFocus: true,
83
83
  shouldCloseOnDocumentClick: true,
@@ -104,6 +104,7 @@ category: components/AI Components
104
104
  featureName,
105
105
  privacyNoticeText,
106
106
  privacyNoticeUrl,
107
+ privacyNoticeScreenReaderLabel,
107
108
  permissionLevelText,
108
109
  permissionLevel,
109
110
  description,
@@ -116,9 +117,11 @@ category: components/AI Components
116
117
  css: styles?.privacyNotice,
117
118
  children: (0, _jsxRuntime.jsx)(_latest5.Link, {
118
119
  href: privacyNoticeUrl,
120
+ "aria-label": privacyNoticeScreenReaderLabel,
119
121
  renderIcon: (0, _jsxRuntime.jsx)(_uiIcons.ExternalLinkInstUIIcon, {
120
122
  size: "sm"
121
123
  }),
124
+ target: "_blank",
122
125
  iconPlacement: "end",
123
126
  variant: "standalone",
124
127
  children: privacyNoticeText
package/lib/DataPermissionLevels/v2/index.js CHANGED
@@ -101,7 +101,7 @@ category: components/AI Components
101
101
  highlighted
102
102
  }, index) => (0, _jsxRuntime.jsxs)("div", {
103
103
  css: highlighted ? styles?.highlightedCard : styles?.card,
104
- children: [highlighted ? (0, _jsxRuntime.jsxs)("div", {
104
+ children: [highlighted ? (0, _jsxRuntime.jsxs)("h3", {
105
105
  css: styles?.currentFeature,
106
106
  children: [(0, _jsxRuntime.jsxs)(_latest3.Heading, {
107
107
  color: "primary-on",
@@ -115,15 +115,20 @@ category: components/AI Components
115
115
  })]
116
116
  }) : null, (0, _jsxRuntime.jsxs)("div", {
117
117
  css: styles?.contentContainer,
118
- children: [(0, _jsxRuntime.jsx)("div", {
119
- css: styles?.level,
120
- children: level
121
- }), (0, _jsxRuntime.jsx)("div", {
122
- css: styles?.permissionTitle,
123
- children: (0, _jsxRuntime.jsxs)(_latest4.Text, {
124
- variant: "descriptionPage",
125
- children: [title, " "]
126
- })
118
+ children: [(0, _jsxRuntime.jsxs)("h3", {
119
+ style: {
120
+ all: 'unset'
121
+ },
122
+ children: [(0, _jsxRuntime.jsx)("div", {
123
+ css: styles?.level,
124
+ children: level
125
+ }), (0, _jsxRuntime.jsx)("div", {
126
+ css: styles?.permissionTitle,
127
+ children: (0, _jsxRuntime.jsxs)(_latest4.Text, {
128
+ variant: "descriptionPage",
129
+ children: [title, " "]
130
+ })
131
+ })]
127
132
  }), (0, _jsxRuntime.jsx)(_latest4.Text, {
128
133
  variant: "content",
129
134
  color: "secondary",
package/lib/DataPermissionLevels/v2/styles.js CHANGED
@@ -83,6 +83,7 @@ const generateStyle = (componentTheme, _props, sharedTokens) => {
83
83
  color: componentTheme?.levelColor
84
84
  },
85
85
  currentFeature: {
86
+ all: 'unset',
86
87
  label: 'data-permission-levels__current-feature',
87
88
  background: `
88
89
  linear-gradient(to right, ${componentTheme.aiTextLeftGradientColor} 0%, ${componentTheme.aiTextRightGradientColor} 100%)`,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-instructure",
3
- "version": "11.7.8-snapshot-6",
3
+ "version": "11.7.8-snapshot-10",
4
4
  "description": "Collection of specific components for Instructure products",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -15,24 +15,24 @@
15
15
  "license": "MIT",
16
16
  "dependencies": {
17
17
  "@babel/runtime": "^7.29.7",
18
- "@instructure/emotion": "11.7.8-snapshot-6",
19
- "@instructure/ui-buttons": "11.7.8-snapshot-6",
20
- "@instructure/shared-types": "11.7.8-snapshot-6",
21
- "@instructure/ui-heading": "11.7.8-snapshot-6",
22
- "@instructure/ui-icons": "11.7.8-snapshot-6",
23
- "@instructure/ui-link": "11.7.8-snapshot-6",
24
- "@instructure/ui-modal": "11.7.8-snapshot-6",
25
- "@instructure/ui-react-utils": "11.7.8-snapshot-6",
26
- "@instructure/ui-view": "11.7.8-snapshot-6",
27
- "@instructure/ui-text": "11.7.8-snapshot-6",
28
- "@instructure/ui-themes": "11.7.8-snapshot-6",
29
- "@instructure/ui-popover": "11.7.8-snapshot-6"
18
+ "@instructure/emotion": "11.7.8-snapshot-10",
19
+ "@instructure/ui-heading": "11.7.8-snapshot-10",
20
+ "@instructure/ui-buttons": "11.7.8-snapshot-10",
21
+ "@instructure/shared-types": "11.7.8-snapshot-10",
22
+ "@instructure/ui-icons": "11.7.8-snapshot-10",
23
+ "@instructure/ui-link": "11.7.8-snapshot-10",
24
+ "@instructure/ui-modal": "11.7.8-snapshot-10",
25
+ "@instructure/ui-popover": "11.7.8-snapshot-10",
26
+ "@instructure/ui-react-utils": "11.7.8-snapshot-10",
27
+ "@instructure/ui-themes": "11.7.8-snapshot-10",
28
+ "@instructure/ui-text": "11.7.8-snapshot-10",
29
+ "@instructure/ui-view": "11.7.8-snapshot-10"
30
30
  },
31
31
  "devDependencies": {
32
32
  "vitest": "^5.0.0",
33
- "@instructure/ui-axe-check": "11.7.8-snapshot-6",
34
- "@instructure/ui-babel-preset": "11.7.8-snapshot-6",
35
- "@instructure/ui-color-utils": "11.7.8-snapshot-6"
33
+ "@instructure/ui-axe-check": "11.7.8-snapshot-10",
34
+ "@instructure/ui-color-utils": "11.7.8-snapshot-10",
35
+ "@instructure/ui-babel-preset": "11.7.8-snapshot-10"
36
36
  },
37
37
  "peerDependencies": {
38
38
  "react": ">=18 <=19"
package/src/AiInformation/v2/README.md CHANGED
@@ -25,6 +25,7 @@ readonly: true
25
25
  featureName: "Feature name",
26
26
  privacyNoticeText: "AI Privacy Notice",
27
27
  privacyNoticeUrl: "https://www.instructure.com/policies/artificial-intelligence-privacy",
28
+ privacyNoticeScreenReaderLabel: "AI Privacy Notice, opens an external page",
28
29
  permissionLevelText: "Permission Level",
29
30
  permissionLevel: "Level 1",
30
31
  description: "We leverage anonymized aggregate data for detailed analytics to inform model development and product improvements. No AI models are used at this level.",
@@ -173,6 +174,7 @@ readonly: true
173
174
  featureName: "Feature name",
174
175
  privacyNoticeText: "AI Privacy Notice",
175
176
  privacyNoticeUrl: "https://www.instructure.com/policies/artificial-intelligence-privacy",
177
+ privacyNoticeScreenReaderLabel: "AI Privacy Notice, opens an external page",
176
178
  permissionLevelText: "Permission Level",
177
179
  permissionLevel: "Level 1",
178
180
  description: "We leverage anonymized aggregate data for detailed analytics to inform model development and product improvements. No AI models are used at this level.",
package/src/AiInformation/v2/index.tsx CHANGED
@@ -77,7 +77,7 @@ const AiInformation = ({
77
77
  renderTrigger={trigger}
78
78
  isShowingContent={open}
79
79
  on="click"
80
- screenReaderLabel="Popover Dialog Example"
80
+ screenReaderLabel={`IgniteAI, ${title}`}
81
81
  shouldContainFocus
82
82
  shouldReturnFocus
83
83
  shouldCloseOnDocumentClick
@@ -104,6 +104,7 @@ const AiInformation = ({
104
104
  featureName,
105
105
  privacyNoticeText,
106
106
  privacyNoticeUrl,
107
+ privacyNoticeScreenReaderLabel,
107
108
  permissionLevelText,
108
109
  permissionLevel,
109
110
  description,
@@ -118,7 +119,9 @@ const AiInformation = ({
118
119
  <div css={styles?.privacyNotice}>
119
120
  <Link
120
121
  href={privacyNoticeUrl}
122
+ aria-label={privacyNoticeScreenReaderLabel}
121
123
  renderIcon={<ExternalLinkInstUIIcon size="sm" />}
124
+ target="_blank"
122
125
  iconPlacement="end"
123
126
  variant="standalone"
124
127
  >
package/src/AiInformation/v2/props.ts CHANGED
@@ -40,6 +40,7 @@ type AiInformationOwnProps = {
40
40
  featureName: string
41
41
  privacyNoticeText: string
42
42
  privacyNoticeUrl: string
43
+ privacyNoticeScreenReaderLabel?: string
43
44
  permissionLevelText: string
44
45
  permissionLevel: string
45
46
  description: string
package/src/DataPermissionLevels/v2/index.tsx CHANGED
@@ -97,7 +97,7 @@ const DataPermissionLevels = ({
97
97
  css={highlighted ? styles?.highlightedCard : styles?.card}
98
98
  >
99
99
  {highlighted ? (
100
- <div css={styles?.currentFeature}>
100
+ <h3 css={styles?.currentFeature}>
101
101
  <Heading
102
102
  color="primary-on"
103
103
  level="reset"
@@ -108,14 +108,16 @@ const DataPermissionLevels = ({
108
108
  <Text color="primary-on" variant="content">
109
109
  {currentFeature}
110
110
  </Text>
111
- </div>
111
+ </h3>
112
112
  ) : null}
113
113
 
114
114
  <div css={styles?.contentContainer}>
115
- <div css={styles?.level}>{level}</div>
116
- <div css={styles?.permissionTitle}>
117
- <Text variant="descriptionPage">{title} </Text>
118
- </div>
115
+ <h3 style={{ all: 'unset' }}>
116
+ <div css={styles?.level}>{level}</div>
117
+ <div css={styles?.permissionTitle}>
118
+ <Text variant="descriptionPage">{title} </Text>
119
+ </div>
120
+ </h3>
119
121
  <Text variant="content" color="secondary">
120
122
  {description}
121
123
  </Text>
package/src/DataPermissionLevels/v2/styles.ts CHANGED
@@ -87,6 +87,7 @@ const generateStyle = (
87
87
  color: componentTheme?.levelColor
88
88
  },
89
89
  currentFeature: {
90
+ all: 'unset',
90
91
  label: 'data-permission-levels__current-feature',
91
92
  background: `
92
93
  linear-gradient(to right, ${componentTheme.aiTextLeftGradientColor} 0%, ${componentTheme.aiTextRightGradientColor} 100%)`,