@atlaskit/task-decision 17.10.3 → 17.10.5

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/task-decision
 
+## 17.10.5
+
+### Patch Changes
+
+- [#142911](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/142911)
+  [`f661df7842ec7`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f661df7842ec7) -
+  [ux] [ED-24772] create request to edit component under feature toggle
+
+## 17.10.4
+
+### Patch Changes
+
+- [#141679](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/141679)
+  [`b005c6bc8be60`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b005c6bc8be60) -
+  improve decision item on SSR
+
 ## 17.10.3
 
 ### Patch Changes

package/dist/cjs/components/DecisionItem.js

@@ -8,7 +8,6 @@ exports.default = void 0;
 var _react = require("@emotion/react");
 var _decision = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/decision"));
 var _Item = _interopRequireDefault(require("./Item"));
-var _colors = require("@atlaskit/theme/colors");
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -23,7 +22,7 @@ var iconStyles = function iconStyles(showPlaceholder) {
     width: '16px',
     margin: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-150, 12px)", " 0 0"),
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    color: showPlaceholder ? "var(--ds-icon-subtle, ".concat(_colors.N100, ")") : "var(--ds-icon-success, ".concat(_colors.G400, ")"),
+    color: showPlaceholder ? "var(--ds-icon-subtle, #626F86)" : "var(--ds-icon-success, #22A06B)",
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '> span': {
       margin: "var(--ds-space-negative-100, -8px)"

package/dist/cjs/components/DecisionList.js

@@ -15,8 +15,8 @@ var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _styles = require("./styles");
 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 && Object.prototype.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 _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+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 _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx

package/dist/cjs/components/Item.js

@@ -16,7 +16,7 @@ var _react = require("react");
 var _react2 = require("@emotion/react");
 var _constants = require("@atlaskit/theme/constants");
 var _styles = require("./styles");
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx

package/dist/cjs/components/ResourcedTaskItem.js

@@ -17,10 +17,10 @@ var _react = _interopRequireWildcard(require("react"));
 var _TaskItem = _interopRequireDefault(require("./TaskItem"));
 var _analyticsNamespacedContext = require("@atlaskit/analytics-namespaced-context");
 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 && Object.prototype.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, 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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var ResourcedTaskItem = exports.default = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(ResourcedTaskItem, _PureComponent);
@@ -39,7 +39,12 @@ var ResourcedTaskItem = exports.default = /*#__PURE__*/function (_PureComponent)
       var _this$props = _this.props,
         taskDecisionProvider = _this$props.taskDecisionProvider,
         objectAri = _this$props.objectAri,
-        onChange = _this$props.onChange;
+        onChange = _this$props.onChange,
+        disableOnChange = _this$props.disableOnChange;
+      if (disableOnChange) {
+        return;
+      }
+
       // Optimistically update the task
       _this.setState({
         isDone: isDone
@@ -68,6 +73,12 @@ var ResourcedTaskItem = exports.default = /*#__PURE__*/function (_PureComponent)
         }
       }
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleOnClick", function () {
+      var onClick = _this.props.onClick;
+      if (onClick) {
+        onClick();
+      }
+    });
     _this.state = {
       isDone: props.isDone
     };
@@ -157,7 +168,8 @@ var ResourcedTaskItem = exports.default = /*#__PURE__*/function (_PureComponent)
         disabled = _this$props3.disabled,
         dataAttributes = _this$props3.dataAttributes,
         isRenderer = _this$props3.isRenderer,
-        isFocused = _this$props3.isFocused;
+        isFocused = _this$props3.isFocused,
+        inputRef = _this$props3.inputRef;
       return /*#__PURE__*/_react.default.createElement(_analyticsNamespacedContext.FabricElementsAnalyticsContext, {
         data: {
           objectAri: objectAri
@@ -168,12 +180,14 @@ var ResourcedTaskItem = exports.default = /*#__PURE__*/function (_PureComponent)
         isFocused: isFocused,
         taskId: taskId,
         onChange: this.handleOnChange,
+        onClick: this.handleOnClick,
         appearance: appearance,
         contentRef: contentRef,
         showPlaceholder: showPlaceholder,
         placeholder: placeholder,
         disabled: disabled,
-        dataAttributes: dataAttributes
+        dataAttributes: dataAttributes,
+        inputRef: inputRef
       }, children));
     }
   }]);

package/dist/cjs/components/TaskItem.js

@@ -14,7 +14,7 @@ var _analyticsNext = require("@atlaskit/analytics-next");
 var _analytics = require("../analytics");
 var _styles = require("./styles");
 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 && Object.prototype.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, 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; }
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -39,7 +39,9 @@ var TaskItem = function TaskItem(props) {
     dataAttributes = props.dataAttributes,
     taskId = props.taskId,
     onChange = props.onChange,
-    createAnalyticsEvent = props.createAnalyticsEvent;
+    onClick = props.onClick,
+    createAnalyticsEvent = props.createAnalyticsEvent,
+    inputRefFromProps = props.inputRef;
   var checkBoxId = (0, _react.useMemo)(function () {
     return getCheckBoxId(taskId);
   }, [taskId]);
@@ -69,7 +71,8 @@ var TaskItem = function TaskItem(props) {
       }
     };
   }, [handleOnChange]);
-  var inputRef = (0, _react.useRef)(null);
+  var defaultInputRef = (0, _react.useRef)(null);
+  var inputRef = inputRefFromProps !== null && inputRefFromProps !== void 0 ? inputRefFromProps : defaultInputRef;
   var icon =
   // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   (0, _react2.jsx)("span", {
@@ -81,6 +84,7 @@ var TaskItem = function TaskItem(props) {
     name: checkBoxId,
     type: "checkbox",
     onChange: handleOnChange,
+    onClick: onClick,
     checked: !!isDone,
     disabled: !!disabled,
     suppressHydrationWarning: true,
@@ -99,7 +103,7 @@ var TaskItem = function TaskItem(props) {
         (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.focus();
       }, 100);
     }
-  }, [isFocused]);
+  }, [isFocused, inputRef]);
   return (0, _react2.jsx)(_Item.default, {
     appearance: appearance,
     contentRef: contentRef,

package/dist/cjs/components/TaskList.js

@@ -16,8 +16,8 @@ var _react2 = require("@emotion/react");
 var _analyticsNamespacedContext = require("@atlaskit/analytics-namespaced-context");
 var _styles = require("./styles");
 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 && Object.prototype.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 _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+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 _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx

package/dist/cjs/components/styles.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.taskStyles = exports.taskListStyles = exports.placeholderStyles = exports.listStyles = exports.decisionStyles = exports.contentStyles = exports.checkboxStyles = void 0;
 var _react = require("@emotion/react");
-var _colors = require("@atlaskit/theme/colors");
 var _theme = _interopRequireDefault(require("./theme"));
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
@@ -53,7 +52,7 @@ var decisionStyles = exports.decisionStyles = function decisionStyles() {
     padding: "var(--ds-space-100, 8px)",
     paddingLeft: "var(--ds-space-150, 12px)",
     borderRadius: "var(--ds-border-radius-100, 3px)",
-    backgroundColor: "var(--ds-background-neutral, ".concat(_colors.N20A, ")"),
+    backgroundColor: "var(--ds-background-neutral, #091E420F)",
     position: 'relative',
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '.decision-item': {
@@ -66,7 +65,7 @@ var placeholderStyles = exports.placeholderStyles = function placeholderStyles(o
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     margin: "0 0 0 ".concat(offset, "px"),
     position: 'absolute',
-    color: "var(--ds-text-subtlest, ".concat(_colors.N200, ")"),
+    color: "var(--ds-text-subtlest, #626F86)",
     pointerEvents: 'none',
     textOverflow: 'ellipsis',
     overflow: 'hidden',

package/dist/es2019/components/DecisionItem.js

@@ -7,7 +7,6 @@
 import { css, jsx } from '@emotion/react';
 import DecisionIcon from '@atlaskit/icon/glyph/editor/decision';
 import Item from './Item';
-import { G400, N100 } from '@atlaskit/theme/colors';
 const iconStyles = showPlaceholder => {
   return css({
     flex: '0 0 16px',
@@ -15,7 +14,7 @@ const iconStyles = showPlaceholder => {
     width: '16px',
     margin: `${"var(--ds-space-050, 4px)"} ${"var(--ds-space-150, 12px)"} 0 0`,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    color: showPlaceholder ? `var(--ds-icon-subtle, ${N100})` : `var(--ds-icon-success, ${G400})`,
+    color: showPlaceholder ? "var(--ds-icon-subtle, #626F86)" : "var(--ds-icon-success, #22A06B)",
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '> span': {
       margin: "var(--ds-space-negative-100, -8px)"

package/dist/es2019/components/ResourcedTaskItem.js

@@ -16,8 +16,13 @@ export default class ResourcedTaskItem extends PureComponent {
       const {
         taskDecisionProvider,
         objectAri,
-        onChange
+        onChange,
+        disableOnChange
       } = this.props;
+      if (disableOnChange) {
+        return;
+      }
+
       // Optimistically update the task
       this.setState({
         isDone
@@ -46,6 +51,14 @@ export default class ResourcedTaskItem extends PureComponent {
         }
       }
     });
+    _defineProperty(this, "handleOnClick", () => {
+      const {
+        onClick
+      } = this.props;
+      if (onClick) {
+        onClick();
+      }
+    });
     this.state = {
       isDone: props.isDone
     };
@@ -126,7 +139,8 @@ export default class ResourcedTaskItem extends PureComponent {
       disabled,
       dataAttributes,
       isRenderer,
-      isFocused
+      isFocused,
+      inputRef
     } = this.props;
     return /*#__PURE__*/React.createElement(FabricElementsAnalyticsContext, {
       data: {
@@ -138,12 +152,14 @@ export default class ResourcedTaskItem extends PureComponent {
       isFocused: isFocused,
       taskId: taskId,
       onChange: this.handleOnChange,
+      onClick: this.handleOnClick,
       appearance: appearance,
       contentRef: contentRef,
       showPlaceholder: showPlaceholder,
       placeholder: placeholder,
       disabled: disabled,
-      dataAttributes: dataAttributes
+      dataAttributes: dataAttributes,
+      inputRef: inputRef
     }, children));
   }
 }

package/dist/es2019/components/TaskItem.js

@@ -26,7 +26,9 @@ const TaskItem = props => {
     dataAttributes,
     taskId,
     onChange,
-    createAnalyticsEvent
+    onClick,
+    createAnalyticsEvent,
+    inputRef: inputRefFromProps
   } = props;
   const checkBoxId = useMemo(() => getCheckBoxId(taskId), [taskId]);
   const handleOnChange = useMemo(() => {
@@ -53,7 +55,8 @@ const TaskItem = props => {
       handleOnChange(event);
     }
   }, [handleOnChange]);
-  const inputRef = useRef(null);
+  const defaultInputRef = useRef(null);
+  const inputRef = inputRefFromProps !== null && inputRefFromProps !== void 0 ? inputRefFromProps : defaultInputRef;
   const icon =
   // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   jsx("span", {
@@ -65,6 +68,7 @@ const TaskItem = props => {
     name: checkBoxId,
     type: "checkbox",
     onChange: handleOnChange,
+    onClick: onClick,
     checked: !!isDone,
     disabled: !!disabled,
     suppressHydrationWarning: true,
@@ -83,7 +87,7 @@ const TaskItem = props => {
         (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.focus();
       }, 100);
     }
-  }, [isFocused]);
+  }, [isFocused, inputRef]);
   return jsx(Item, {
     appearance: appearance,
     contentRef: contentRef,

package/dist/es2019/components/styles.js

@@ -1,6 +1,5 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
-import { N200, N20A } from '@atlaskit/theme/colors';
 import checkboxTheme from './theme';
 
 /*
@@ -45,7 +44,7 @@ export const decisionStyles = () => css({
   padding: "var(--ds-space-100, 8px)",
   paddingLeft: "var(--ds-space-150, 12px)",
   borderRadius: "var(--ds-border-radius-100, 3px)",
-  backgroundColor: `var(--ds-background-neutral, ${N20A})`,
+  backgroundColor: "var(--ds-background-neutral, #091E420F)",
   position: 'relative',
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.decision-item': {
@@ -56,7 +55,7 @@ export const placeholderStyles = offset => css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   margin: `0 0 0 ${offset}px`,
   position: 'absolute',
-  color: `var(--ds-text-subtlest, ${N200})`,
+  color: "var(--ds-text-subtlest, #626F86)",
   pointerEvents: 'none',
   textOverflow: 'ellipsis',
   overflow: 'hidden',

package/dist/esm/components/DecisionItem.js

@@ -7,7 +7,6 @@
 import { css, jsx } from '@emotion/react';
 import DecisionIcon from '@atlaskit/icon/glyph/editor/decision';
 import Item from './Item';
-import { G400, N100 } from '@atlaskit/theme/colors';
 var iconStyles = function iconStyles(showPlaceholder) {
   return css({
     flex: '0 0 16px',
@@ -15,7 +14,7 @@ var iconStyles = function iconStyles(showPlaceholder) {
     width: '16px',
     margin: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-150, 12px)", " 0 0"),
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    color: showPlaceholder ? "var(--ds-icon-subtle, ".concat(N100, ")") : "var(--ds-icon-success, ".concat(G400, ")"),
+    color: showPlaceholder ? "var(--ds-icon-subtle, #626F86)" : "var(--ds-icon-success, #22A06B)",
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '> span': {
       margin: "var(--ds-space-negative-100, -8px)"

package/dist/esm/components/DecisionList.js

@@ -3,7 +3,7 @@ import _createClass from "@babel/runtime/helpers/createClass";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic

package/dist/esm/components/Item.js

@@ -5,7 +5,7 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic

package/dist/esm/components/ResourcedTaskItem.js

@@ -7,7 +7,7 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
 import { PureComponent } from 'react';
@@ -30,7 +30,12 @@ var ResourcedTaskItem = /*#__PURE__*/function (_PureComponent) {
       var _this$props = _this.props,
         taskDecisionProvider = _this$props.taskDecisionProvider,
         objectAri = _this$props.objectAri,
-        onChange = _this$props.onChange;
+        onChange = _this$props.onChange,
+        disableOnChange = _this$props.disableOnChange;
+      if (disableOnChange) {
+        return;
+      }
+
       // Optimistically update the task
       _this.setState({
         isDone: isDone
@@ -59,6 +64,12 @@ var ResourcedTaskItem = /*#__PURE__*/function (_PureComponent) {
         }
       }
     });
+    _defineProperty(_assertThisInitialized(_this), "handleOnClick", function () {
+      var onClick = _this.props.onClick;
+      if (onClick) {
+        onClick();
+      }
+    });
     _this.state = {
       isDone: props.isDone
     };
@@ -148,7 +159,8 @@ var ResourcedTaskItem = /*#__PURE__*/function (_PureComponent) {
         disabled = _this$props3.disabled,
         dataAttributes = _this$props3.dataAttributes,
         isRenderer = _this$props3.isRenderer,
-        isFocused = _this$props3.isFocused;
+        isFocused = _this$props3.isFocused,
+        inputRef = _this$props3.inputRef;
       return /*#__PURE__*/React.createElement(FabricElementsAnalyticsContext, {
         data: {
           objectAri: objectAri
@@ -159,12 +171,14 @@ var ResourcedTaskItem = /*#__PURE__*/function (_PureComponent) {
         isFocused: isFocused,
         taskId: taskId,
         onChange: this.handleOnChange,
+        onClick: this.handleOnClick,
         appearance: appearance,
         contentRef: contentRef,
         showPlaceholder: showPlaceholder,
         placeholder: placeholder,
         disabled: disabled,
-        dataAttributes: dataAttributes
+        dataAttributes: dataAttributes,
+        inputRef: inputRef
       }, children));
     }
   }]);

package/dist/esm/components/TaskItem.js

@@ -27,7 +27,9 @@ var TaskItem = function TaskItem(props) {
     dataAttributes = props.dataAttributes,
     taskId = props.taskId,
     onChange = props.onChange,
-    createAnalyticsEvent = props.createAnalyticsEvent;
+    onClick = props.onClick,
+    createAnalyticsEvent = props.createAnalyticsEvent,
+    inputRefFromProps = props.inputRef;
   var checkBoxId = useMemo(function () {
     return getCheckBoxId(taskId);
   }, [taskId]);
@@ -57,7 +59,8 @@ var TaskItem = function TaskItem(props) {
       }
     };
   }, [handleOnChange]);
-  var inputRef = useRef(null);
+  var defaultInputRef = useRef(null);
+  var inputRef = inputRefFromProps !== null && inputRefFromProps !== void 0 ? inputRefFromProps : defaultInputRef;
   var icon =
   // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   jsx("span", {
@@ -69,6 +72,7 @@ var TaskItem = function TaskItem(props) {
     name: checkBoxId,
     type: "checkbox",
     onChange: handleOnChange,
+    onClick: onClick,
     checked: !!isDone,
     disabled: !!disabled,
     suppressHydrationWarning: true,
@@ -87,7 +91,7 @@ var TaskItem = function TaskItem(props) {
         (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.focus();
       }, 100);
     }
-  }, [isFocused]);
+  }, [isFocused, inputRef]);
   return jsx(Item, {
     appearance: appearance,
     contentRef: contentRef,

package/dist/esm/components/TaskList.js

@@ -3,7 +3,7 @@ import _createClass from "@babel/runtime/helpers/createClass";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic

package/dist/esm/components/styles.js

@@ -1,6 +1,5 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
-import { N200, N20A } from '@atlaskit/theme/colors';
 import checkboxTheme from './theme';
 
 /*
@@ -46,7 +45,7 @@ export var decisionStyles = function decisionStyles() {
     padding: "var(--ds-space-100, 8px)",
     paddingLeft: "var(--ds-space-150, 12px)",
     borderRadius: "var(--ds-border-radius-100, 3px)",
-    backgroundColor: "var(--ds-background-neutral, ".concat(N20A, ")"),
+    backgroundColor: "var(--ds-background-neutral, #091E420F)",
     position: 'relative',
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '.decision-item': {
@@ -59,7 +58,7 @@ export var placeholderStyles = function placeholderStyles(offset) {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     margin: "0 0 0 ".concat(offset, "px"),
     position: 'absolute',
-    color: "var(--ds-text-subtlest, ".concat(N200, ")"),
+    color: "var(--ds-text-subtlest, #626F86)",
     pointerEvents: 'none',
     textOverflow: 'ellipsis',
     overflow: 'hidden',

package/dist/types/components/ResourcedTaskItem.d.ts

@@ -1,3 +1,4 @@
+import { type RefObject } from 'react';
 import { PureComponent } from 'react';
 import { type Appearance, type ContentRef, type TaskDecisionProvider } from '../types';
 export interface Props {
@@ -6,6 +7,7 @@ export interface Props {
     isRenderer?: boolean;
     isFocused?: boolean;
     onChange?: (taskId: string, isChecked: boolean) => void;
+    onClick?: () => void;
     contentRef?: ContentRef;
     children?: any;
     taskDecisionProvider?: Promise<TaskDecisionProvider>;
@@ -17,6 +19,8 @@ export interface Props {
     dataAttributes?: {
         [key: string]: string | number;
     };
+    inputRef?: RefObject<HTMLInputElement>;
+    disableOnChange?: boolean;
 }
 export interface State {
     isDone?: boolean;
@@ -32,5 +36,6 @@ export default class ResourcedTaskItem extends PureComponent<Props, State> {
     private unsubscribe;
     private onUpdate;
     private handleOnChange;
+    private handleOnClick;
     render(): JSX.Element;
 }

package/dist/types/components/TaskItem.d.ts

@@ -2,7 +2,7 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-import React from 'react';
+import React, { type RefObject } from 'react';
 import { type Appearance, type ContentRef } from '../types';
 import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 export interface Props {
@@ -11,6 +11,7 @@ export interface Props {
     isFocused?: boolean;
     isRenderer?: boolean;
     onChange?: (taskId: string, isChecked: boolean) => void;
+    onClick?: () => void;
     contentRef?: ContentRef;
     children?: any;
     placeholder?: string;
@@ -20,6 +21,7 @@ export interface Props {
     dataAttributes?: {
         [key: string]: string | number;
     };
+    inputRef?: RefObject<HTMLInputElement>;
 }
 declare const _default: React.ForwardRefExoticComponent<Omit<Props & WithAnalyticsEventsProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;
 export default _default;

package/dist/types-ts4.5/components/ResourcedTaskItem.d.ts

@@ -1,3 +1,4 @@
+import { type RefObject } from 'react';
 import { PureComponent } from 'react';
 import { type Appearance, type ContentRef, type TaskDecisionProvider } from '../types';
 export interface Props {
@@ -6,6 +7,7 @@ export interface Props {
     isRenderer?: boolean;
     isFocused?: boolean;
     onChange?: (taskId: string, isChecked: boolean) => void;
+    onClick?: () => void;
     contentRef?: ContentRef;
     children?: any;
     taskDecisionProvider?: Promise<TaskDecisionProvider>;
@@ -17,6 +19,8 @@ export interface Props {
     dataAttributes?: {
         [key: string]: string | number;
     };
+    inputRef?: RefObject<HTMLInputElement>;
+    disableOnChange?: boolean;
 }
 export interface State {
     isDone?: boolean;
@@ -32,5 +36,6 @@ export default class ResourcedTaskItem extends PureComponent<Props, State> {
     private unsubscribe;
     private onUpdate;
     private handleOnChange;
+    private handleOnClick;
     render(): JSX.Element;
 }

package/dist/types-ts4.5/components/TaskItem.d.ts

@@ -2,7 +2,7 @@
  * @jsxRuntime classic
  * @jsx jsx
  */
-import React from 'react';
+import React, { type RefObject } from 'react';
 import { type Appearance, type ContentRef } from '../types';
 import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 export interface Props {
@@ -11,6 +11,7 @@ export interface Props {
     isFocused?: boolean;
     isRenderer?: boolean;
     onChange?: (taskId: string, isChecked: boolean) => void;
+    onClick?: () => void;
     contentRef?: ContentRef;
     children?: any;
     placeholder?: string;
@@ -20,6 +21,7 @@ export interface Props {
     dataAttributes?: {
         [key: string]: string | number;
     };
+    inputRef?: RefObject<HTMLInputElement>;
 }
 declare const _default: React.ForwardRefExoticComponent<Omit<Props & WithAnalyticsEventsProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/task-decision",
-	"version": "17.10.3",
+	"version": "17.10.5",
 	"description": "Tasks and decisions react components",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -30,7 +30,6 @@
 	},
 	"atlassian": {
 		"team": "Editor: AI",
-		"releaseModel": "continuous",
 		"website": {
 			"name": "Task Decision"
 		},
@@ -40,11 +39,11 @@
 		"access": "public"
 	},
 	"dependencies": {
-		"@atlaskit/analytics-namespaced-context": "^6.11.0",
+		"@atlaskit/analytics-namespaced-context": "^6.12.0",
 		"@atlaskit/analytics-next": "^10.1.0",
-		"@atlaskit/icon": "^22.12.0",
+		"@atlaskit/icon": "^22.18.0",
 		"@atlaskit/theme": "^13.0.0",
-		"@atlaskit/tokens": "^1.58.0",
+		"@atlaskit/tokens": "^1.60.0",
 		"@atlaskit/util-service-support": "^6.2.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",