@atlaskit/checkbox 17.3.6 → 17.3.8

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/checkbox
 
+## 17.3.8
+
+### Patch Changes
+
+- [`f1383e3821070`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f1383e3821070) -
+  Removes internal barrel file
+
+## 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

@@ -16,7 +16,10 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _usePlatformLeafEventHandler = require("@atlaskit/analytics-next/usePlatformLeafEventHandler");
 var _mergeRefs = _interopRequireDefault(require("@atlaskit/ds-lib/merge-refs"));
-var _internal = require("./internal");
+var _checkboxIcon = _interopRequireDefault(require("./internal/checkbox-icon"));
+var _label = _interopRequireDefault(require("./internal/label"));
+var _labelText = _interopRequireDefault(require("./internal/label-text"));
+var _requiredIndicator = _interopRequireDefault(require("./internal/required-indicator"));
 var _excluded = ["isChecked", "isDisabled", "isInvalid", "defaultChecked", "isIndeterminate", "onChange", "analyticsContext", "label", "name", "value", "isRequired", "testId", "xcss", "className"];
 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); }
 /**
@@ -85,7 +88,7 @@ var Checkbox = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
       internalRef.current.indeterminate = isIndeterminate;
     }
   }, [isIndeterminate]);
-  return /*#__PURE__*/React.createElement(_internal.Label, {
+  return /*#__PURE__*/React.createElement(_label.default, {
     isDisabled: isDisabled,
     isChecked: isChecked,
     isIndeterminate: isIndeterminate,
@@ -114,10 +117,10 @@ var Checkbox = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
     "aria-invalid": isInvalid ? 'true' : undefined,
     "data-testid": testId && "".concat(testId, "--hidden-checkbox"),
     "data-invalid": isInvalid ? 'true' : undefined
-  })), /*#__PURE__*/React.createElement(_internal.CheckboxIcon, {
+  })), /*#__PURE__*/React.createElement(_checkboxIcon.default, {
     isIndeterminate: isIndeterminate,
     isChecked: isChecked
-  }), label && /*#__PURE__*/React.createElement(_internal.LabelText, null, label, isRequired && /*#__PURE__*/React.createElement(_internal.RequiredIndicator, null)));
+  }), label && /*#__PURE__*/React.createElement(_labelText.default, null, label, isRequired && /*#__PURE__*/React.createElement(_requiredIndicator.default, null)));
 }));
 Checkbox.displayName = 'Checkbox';
 var _default = exports.default = Checkbox;

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

@@ -6,7 +6,10 @@ import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef, memo, useCallback, useEffect, useRef, useState } from 'react';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
 import mergeRefs from '@atlaskit/ds-lib/merge-refs';
-import { CheckboxIcon, Label, LabelText, RequiredIndicator } from './internal';
+import CheckboxIcon from './internal/checkbox-icon';
+import Label from './internal/label';
+import LabelText from './internal/label-text';
+import RequiredIndicator from './internal/required-indicator';
 /**
  * The input is visually hidden but remains in the DOM for accessibility.
  * State-based styling is handled by the Label component using CSS custom properties

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

@@ -9,7 +9,10 @@ import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef, memo, useCallback, useEffect, useRef, useState } from 'react';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
 import mergeRefs from '@atlaskit/ds-lib/merge-refs';
-import { CheckboxIcon, Label, LabelText, RequiredIndicator } from './internal';
+import CheckboxIcon from './internal/checkbox-icon';
+import Label from './internal/label';
+import LabelText from './internal/label-text';
+import RequiredIndicator from './internal/required-indicator';
 /**
  * The input is visually hidden but remains in the DOM for accessibility.
  * State-based styling is handled by the Label component using CSS custom properties

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.8",
 	"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",

package/dist/cjs/internal/index.js

@@ -1,34 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "CheckboxIcon", {
-  enumerable: true,
-  get: function get() {
-    return _checkboxIcon.default;
-  }
-});
-Object.defineProperty(exports, "Label", {
-  enumerable: true,
-  get: function get() {
-    return _label.default;
-  }
-});
-Object.defineProperty(exports, "LabelText", {
-  enumerable: true,
-  get: function get() {
-    return _labelText.default;
-  }
-});
-Object.defineProperty(exports, "RequiredIndicator", {
-  enumerable: true,
-  get: function get() {
-    return _requiredIndicator.default;
-  }
-});
-var _checkboxIcon = _interopRequireDefault(require("./checkbox-icon"));
-var _label = _interopRequireDefault(require("./label"));
-var _labelText = _interopRequireDefault(require("./label-text"));
-var _requiredIndicator = _interopRequireDefault(require("./required-indicator"));

package/dist/es2019/internal/index.js

@@ -1,4 +0,0 @@
-export { default as CheckboxIcon } from './checkbox-icon';
-export { default as Label } from './label';
-export { default as LabelText } from './label-text';
-export { default as RequiredIndicator } from './required-indicator';

package/dist/esm/internal/index.js

@@ -1,4 +0,0 @@
-export { default as CheckboxIcon } from './checkbox-icon';
-export { default as Label } from './label';
-export { default as LabelText } from './label-text';
-export { default as RequiredIndicator } from './required-indicator';

package/dist/types/internal/index.d.ts

@@ -1,4 +0,0 @@
-export { default as CheckboxIcon } from './checkbox-icon';
-export { default as Label } from './label';
-export { default as LabelText } from './label-text';
-export { default as RequiredIndicator } from './required-indicator';

package/dist/types-ts4.5/internal/index.d.ts

@@ -1,4 +0,0 @@
-export { default as CheckboxIcon } from './checkbox-icon';
-export { default as Label } from './label';
-export { default as LabelText } from './label-text';
-export { default as RequiredIndicator } from './required-indicator';