@atlaskit/checkbox 17.3.6 → 17.3.7

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/checkbox
 
+## 17.3.7
+
+### Patch Changes
+
+- [`7aef1e49e90ea`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7aef1e49e90ea) -
+  Removes redundant fallback color values via @atlaskit/theme
+
 ## 17.3.6
 
 ### Patch Changes

package/checkbox.docs.tsx

@@ -0,0 +1,53 @@
+import path from 'path';
+
+import type { ComponentStructuredContentSource } from '@atlassian/structured-docs-types';
+
+const documentation: ComponentStructuredContentSource[] = [
+	{
+		name: 'Checkbox',
+		description:
+			'A checkbox is an input control that allows a user to select one or more options from a number of choices.',
+		status: 'general-availability',
+		import: {
+			name: 'Checkbox',
+			package: '@atlaskit/checkbox',
+			type: 'default',
+			packagePath: path.resolve(__dirname),
+			packageJson: require('./package.json'),
+		},
+		usageGuidelines: [
+			'Use for multiple choice selections from a list, or for explicit confirmation (e.g. settings)',
+			'Use indeterminate state when some but not all children in a group are selected',
+			'Group related checkboxes logically',
+			'Provide clear labels for each option',
+			'Consider default states carefully',
+			'Use Radio for single selection; Dropdown for compact single choice; Toggle for on/off',
+		],
+		contentGuidelines: [
+			'Write short, descriptive labels; no punctuation after labels',
+			'Use consistent language across related options',
+			'Avoid negative phrasing when possible',
+			'Group related options together',
+		],
+		accessibilityGuidelines: [
+			'Include error messages for required or invalid checkbox state',
+			'Do not use disabled if the control must stay in tab order; use validation and error message so screen reader users hear why and how to proceed',
+			'Ensure proper labeling for all checkboxes',
+			'Use clear, descriptive labels that explain the choice',
+			'Provide keyboard navigation support',
+			'Indicate required fields clearly',
+			'Use appropriate error states and messaging',
+		],
+		examples: [
+			{
+				name: 'Checkbox',
+				description: 'Checkbox example',
+				source: path.resolve(__dirname, './examples/ai/checkbox.tsx'),
+			},
+		],
+		keywords: ['checkbox', 'input', 'form', 'selection', 'choice', 'option', 'multiple'],
+		categories: ['forms-and-input'],
+	},
+];
+
+export default documentation;

package/dist/cjs/checkbox.js

@@ -73,7 +73,7 @@ var Checkbox = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
     analyticsData: analyticsContext,
     componentName: 'checkbox',
     packageName: "@atlaskit/checkbox",
-    packageVersion: "0.0.0-development"
+    packageVersion: "17.3.7"
   });
   var internalRef = (0, _react.useRef)(null);
   var mergedRefs = (0, _mergeRefs.default)([internalRef, ref]);

package/dist/cjs/internal/required-indicator.compiled.css

@@ -1,2 +1,2 @@
 ._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
-._syaz1ml5{color:var(--_1xw92dq)}
+._syaz1tmw{color:var(--ds-text-danger,#ae2e24)}

package/dist/cjs/internal/required-indicator.js

@@ -9,15 +9,11 @@ exports.default = RequiredIndicator;
 require("./required-indicator.compiled.css");
 var React = _interopRequireWildcard(require("react"));
 var _runtime = require("@compiled/react/runtime");
-var _colors = require("@atlaskit/theme/colors");
 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 requiredIndicatorStyles = null;
 function RequiredIndicator() {
   return /*#__PURE__*/React.createElement("span", {
     "aria-hidden": true,
-    className: (0, _runtime.ax)(["_syaz1ml5 _bozgv77o"]),
-    style: {
-      "--_1xw92dq": (0, _runtime.ix)("var(--ds-text-danger, ".concat(_colors.R500, ")"))
-    }
+    className: (0, _runtime.ax)(["_syaz1tmw _bozgv77o"])
   }, "*");
 }

package/dist/es2019/checkbox.js

@@ -55,7 +55,7 @@ const Checkbox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Checkbox({
     analyticsData: analyticsContext,
     componentName: 'checkbox',
     packageName: "@atlaskit/checkbox",
-    packageVersion: "0.0.0-development"
+    packageVersion: "17.3.7"
   });
   const internalRef = useRef(null);
   const mergedRefs = mergeRefs([internalRef, ref]);

package/dist/es2019/internal/required-indicator.compiled.css

@@ -1,2 +1,2 @@
 ._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
-._syaz1gtz{color:var(--ds-text-danger,#bf2600)}
+._syaz1tmw{color:var(--ds-text-danger,#ae2e24)}

package/dist/es2019/internal/required-indicator.js

@@ -2,11 +2,10 @@
 import "./required-indicator.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { R500 } from '@atlaskit/theme/colors';
 const requiredIndicatorStyles = null;
 export default function RequiredIndicator() {
   return /*#__PURE__*/React.createElement("span", {
     "aria-hidden": true,
-    className: ax(["_syaz1gtz _bozgv77o"])
+    className: ax(["_syaz1tmw _bozgv77o"])
   }, "*");
 }

package/dist/esm/checkbox.js

@@ -64,7 +64,7 @@ var Checkbox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Checkbox(_ref
     analyticsData: analyticsContext,
     componentName: 'checkbox',
     packageName: "@atlaskit/checkbox",
-    packageVersion: "0.0.0-development"
+    packageVersion: "17.3.7"
   });
   var internalRef = useRef(null);
   var mergedRefs = mergeRefs([internalRef, ref]);

package/dist/esm/internal/required-indicator.compiled.css

@@ -1,2 +1,2 @@
 ._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
-._syaz1ml5{color:var(--_1xw92dq)}
+._syaz1tmw{color:var(--ds-text-danger,#ae2e24)}

package/dist/esm/internal/required-indicator.js

@@ -2,14 +2,10 @@
 import "./required-indicator.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { R500 } from '@atlaskit/theme/colors';
 var requiredIndicatorStyles = null;
 export default function RequiredIndicator() {
   return /*#__PURE__*/React.createElement("span", {
     "aria-hidden": true,
-    className: ax(["_syaz1ml5 _bozgv77o"]),
-    style: {
-      "--_1xw92dq": ix("var(--ds-text-danger, ".concat(R500, ")"))
-    }
+    className: ax(["_syaz1tmw _bozgv77o"])
   }, "*");
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/checkbox",
-	"version": "17.3.6",
+	"version": "17.3.7",
 	"description": "A checkbox is an input control that allows a user to select one or more options from a number of choices.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -32,11 +32,10 @@
 		}
 	},
 	"dependencies": {
-		"@atlaskit/analytics-next": "^11.1.0",
+		"@atlaskit/analytics-next": "^11.2.0",
 		"@atlaskit/css": "^0.19.0",
 		"@atlaskit/ds-lib": "^6.0.0",
-		"@atlaskit/theme": "^22.0.0",
-		"@atlaskit/tokens": "^11.1.0",
+		"@atlaskit/tokens": "^11.4.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.20.0"
 	},
@@ -49,12 +48,13 @@
 		"@af/suppress-react-warnings": "workspace:^",
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/button": "^23.10.0",
-		"@atlaskit/docs": "^11.6.0",
-		"@atlaskit/form": "^15.4.0",
+		"@atlaskit/docs": "^11.7.0",
+		"@atlaskit/form": "^15.5.0",
 		"@atlaskit/link": "^3.3.0",
-		"@atlaskit/primitives": "^18.0.0",
+		"@atlaskit/primitives": "^18.1.0",
 		"@atlaskit/section-message": "^8.12.0",
 		"@atlassian/ssr-tests": "workspace:^",
+		"@atlassian/structured-docs-types": "workspace:^",
 		"@testing-library/react": "^16.3.0",
 		"jscodeshift": "^17.0.0",
 		"react-dom": "^18.2.0",