@atlaskit/visually-hidden 3.0.3 → 3.0.5

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/visually-hidden
 
+## 3.0.5
+
+### Patch Changes
+
+- [`02483200273ec`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/02483200273ec) -
+  Enrol all Design System UI packages into the React Compiler with platform gating via
+  isReactCompilerActivePlatform.
+
+## 3.0.4
+
+### Patch Changes
+
+- [`a60a82196851a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a60a82196851a) -
+  Internal refactors to remove unused variables. No functional or public changes.
+
 ## 3.0.3
 
 ### Patch Changes

package/dist/cjs/visually-hidden.js

@@ -1,4 +1,4 @@
-/* visually-hidden.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* visually-hidden.tsx generated by @compiled/babel-plugin v0.39.1 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");
@@ -9,8 +9,7 @@ exports.default = void 0;
 require("./visually-hidden.compiled.css");
 var React = _interopRequireWildcard(require("react"));
 var _runtime = require("@compiled/react/runtime");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var visuallyHiddenStyles = null;
 
 /**
@@ -43,4 +42,5 @@ var VisuallyHidden = function VisuallyHidden(_ref) {
     className: (0, _runtime.ax)(["_ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _19itidpf _1reo15vq _18m915vq _1bsbt94y _4t3it94y _kqswstnw _ogto7mnp _uiztglyw _o5721q9c"])
   }, children);
 };
+VisuallyHidden.displayName = 'VisuallyHidden';
 var _default = exports.default = VisuallyHidden;

package/dist/es2019/visually-hidden.js

@@ -1,4 +1,4 @@
-/* visually-hidden.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* visually-hidden.tsx generated by @compiled/babel-plugin v0.39.1 */
 import "./visually-hidden.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
@@ -35,4 +35,5 @@ const VisuallyHidden = ({
     className: ax(["_ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _19itidpf _1reo15vq _18m915vq _1bsbt94y _4t3it94y _kqswstnw _ogto7mnp _uiztglyw _o5721q9c"])
   }, children);
 };
+VisuallyHidden.displayName = 'VisuallyHidden';
 export default VisuallyHidden;

package/dist/esm/visually-hidden.js

@@ -1,4 +1,4 @@
-/* visually-hidden.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* visually-hidden.tsx generated by @compiled/babel-plugin v0.39.1 */
 import "./visually-hidden.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
@@ -34,4 +34,5 @@ var VisuallyHidden = function VisuallyHidden(_ref) {
     className: ax(["_ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _19itidpf _1reo15vq _18m915vq _1bsbt94y _4t3it94y _kqswstnw _ogto7mnp _uiztglyw _o5721q9c"])
   }, children);
 };
+VisuallyHidden.displayName = 'VisuallyHidden';
 export default VisuallyHidden;

package/offerings.json

@@ -0,0 +1,34 @@
+[
+	{
+		"name": "VisuallyHidden",
+		"package": "@atlaskit/visually-hidden",
+		"import": {
+			"name": "VisuallyHidden",
+			"package": "@atlaskit/visually-hidden",
+			"type": "default"
+		},
+		"keywords": ["hidden", "accessibility", "screen-reader", "aria", "utility"],
+		"categories": ["utility"],
+		"shortDescription": "A utility component for accessibility.",
+		"status": "general-availability",
+		"accessibilityGuidelines": [
+			"Use for screen reader only content",
+			"Ensure content is meaningful for assistive technology",
+			"Use appropriate ARIA roles when needed",
+			"Consider content context and purpose"
+		],
+		"usageGuidelines": [
+			"Use for screen reader only content",
+			"Provide meaningful hidden content",
+			"Use for accessibility enhancements",
+			"Consider content context and purpose"
+		],
+		"contentGuidelines": [
+			"Use clear, descriptive hidden content",
+			"Ensure content adds value for screen readers",
+			"Use appropriate language and tone",
+			"Keep content concise but meaningful"
+		],
+		"examples": ["./examples/00-basic.tsx"]
+	}
+]

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/visually-hidden",
-	"version": "3.0.3",
+	"version": "3.0.5",
 	"description": "A utility that hides content from the screen while retaining readability by screen readers for accessibility.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -17,8 +17,14 @@
 	],
 	"atlaskit:src": "src/index.tsx",
 	"atlassian": {
+		"react-compiler": {
+			"enabled": true,
+			"gating": {
+				"source": "@atlassian/react-compiler-gating",
+				"importSpecifierName": "isReactCompilerActivePlatform"
+			}
+		},
 		"team": "Design System Team",
-		"runReact18": true,
 		"website": {
 			"name": "Visually hidden",
 			"category": "Text and data display"
@@ -26,7 +32,7 @@
 	},
 	"dependencies": {
 		"@babel/runtime": "^7.0.0",
-		"@compiled/react": "^0.18.3"
+		"@compiled/react": "^0.20.0"
 	},
 	"peerDependencies": {
 		"react": "^18.2.0"
@@ -35,17 +41,17 @@
 		"@af/accessibility-testing": "workspace:^",
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
-		"@atlaskit/button": "^23.0.0",
-		"@atlaskit/docs": "^10.0.0",
-		"@atlaskit/ds-lib": "^4.0.0",
-		"@atlaskit/link": "^3.1.0",
-		"@atlaskit/section-message": "^8.2.0",
-		"@atlaskit/toggle": "^15.0.0",
-		"@atlaskit/tokens": "^4.8.0",
-		"@atlassian/ssr-tests": "^0.2.0",
-		"@testing-library/react": "^13.4.0",
-		"react-dom": "^18.2.0",
-		"typescript": "~5.4.2"
+		"@atlaskit/button": "^23.10.0",
+		"@atlaskit/docs": "^11.7.0",
+		"@atlaskit/link": "^3.3.0",
+		"@atlaskit/section-message": "^8.12.0",
+		"@atlaskit/toggle": "^15.2.0",
+		"@atlaskit/tokens": "^11.4.0",
+		"@atlassian/react-compiler-gating": "workspace:^",
+		"@atlassian/ssr-tests": "workspace:^",
+		"@atlassian/structured-docs-types": "workspace:^",
+		"@testing-library/react": "^16.3.0",
+		"react-dom": "^18.2.0"
 	},
 	"techstack": {
 		"@atlassian/frontend": {
@@ -76,8 +82,5 @@
 			]
 		}
 	},
-	"af:exports": {
-		".": "./src/index.tsx"
-	},
 	"homepage": "https://atlassian.design/components/visually-hidden/"
 }

package/visually-hidden.docs.tsx

@@ -0,0 +1,46 @@
+import path from 'path';
+
+import type { ComponentStructuredContentSource } from '@atlassian/structured-docs-types';
+
+const documentation: ComponentStructuredContentSource[] = [
+	{
+		name: 'VisuallyHidden',
+		description:
+			'Content hidden from sight but available to screen readers. Use when meaning is clear visually but not to assistive technology.',
+		status: 'general-availability',
+		import: {
+			name: 'VisuallyHidden',
+			package: '@atlaskit/visually-hidden',
+			type: 'default',
+			packagePath: path.resolve(__dirname),
+			packageJson: require('./package.json'),
+		},
+		usageGuidelines: [
+			'Use when meaning is clear visually but not to assistive technology',
+			'Avoid clutter—verbose screen-reader-only text can be more harmful than helpful',
+			'Use the role prop for semantic meaning when needed',
+		],
+		contentGuidelines: [
+			'Use clear, descriptive hidden content',
+			'Ensure content adds value for screen readers',
+			'Keep content concise but meaningful',
+		],
+		accessibilityGuidelines: [
+			'Use for screen reader only content when visual context is insufficient for AT',
+			'Use role prop for semantic meaning when appropriate',
+			'Balance clarity with brevity—avoid overwhelming screen reader users',
+			'Prefer over aria-label in some cases when screen readers need to translate or announce full phrasing',
+		],
+		examples: [
+			{
+				name: '00 Basic',
+				description: '00 Basic example',
+				source: path.resolve(__dirname, './examples/00-basic.tsx'),
+			},
+		],
+		keywords: ['hidden', 'accessibility', 'screen-reader', 'aria', 'utility'],
+		categories: ['utility'],
+	},
+];
+
+export default documentation;