@atlaskit/status 0.11.3

package/LICENSE

@@ -0,0 +1,13 @@
+Copyright 2019 Atlassian Pty Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.

package/build/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "extends": "../tsconfig",
+  "compilerOptions": {
+    "declaration": true,
+    "target": "es5",
+    "paths": {}
+  },
+  "include": [
+    "../src/**/*.ts",
+    "../src/**/*.tsx"
+  ],
+  "exclude": [
+    "../src/**/__tests__/*",
+    "../src/**/*.test.*",
+    "../src/**/test.*"
+  ]
+}

package/dist/cjs/components/Status.js

@@ -0,0 +1,150 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Status = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
+
+var _analyticsNext = require("@atlaskit/analytics-next");
+
+var _analytics = require("./analytics");
+
+var _constants = require("./constants");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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 _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var colorToLozengeAppearanceMap = {
+  neutral: 'default',
+  purple: 'new',
+  blue: 'inprogress',
+  red: 'removed',
+  yellow: 'moved',
+  green: 'success'
+};
+var DEFAULT_APPEARANCE = 'default';
+var MAX_WIDTH = 200;
+
+var StatusInternal = /*#__PURE__*/function (_PureComponent) {
+  (0, _inherits2.default)(StatusInternal, _PureComponent);
+
+  var _super = _createSuper(StatusInternal);
+
+  function StatusInternal() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, StatusInternal);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "hoverStartTime", 0);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleMouseEnter", function (_e) {
+      _this.hoverStartTime = Date.now();
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleMouseLeave", function (_e) {
+      var onHover = _this.props.onHover;
+
+      var delay = Date.now() - _this.hoverStartTime;
+
+      if (delay >= _constants.ANALYTICS_HOVER_DELAY && onHover) {
+        onHover();
+      }
+
+      _this.hoverStartTime = 0;
+    });
+    return _this;
+  }
+
+  (0, _createClass2.default)(StatusInternal, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.hoverStartTime = 0;
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          text = _this$props.text,
+          color = _this$props.color,
+          style = _this$props.style,
+          onClick = _this$props.onClick;
+
+      if (text.trim().length === 0) {
+        return null;
+      }
+
+      var appearance = colorToLozengeAppearanceMap[color] || DEFAULT_APPEARANCE; // Note: ommitted data-local-id attribute to avoid copying/pasting the same localId
+
+      return /*#__PURE__*/_react.default.createElement("span", {
+        className: "status-lozenge-span" // Using title here as `@atlaskit/tooltip` adds too much overhead
+        ,
+        title: text,
+        onClick: onClick,
+        onMouseEnter: this.handleMouseEnter,
+        onMouseLeave: this.handleMouseLeave,
+        "data-node-type": "status",
+        "data-color": color,
+        "data-style": style
+      }, /*#__PURE__*/_react.default.createElement(_lozenge.default, {
+        appearance: appearance,
+        maxWidth: MAX_WIDTH
+      }, text));
+    }
+  }]);
+  return StatusInternal;
+}(_react.PureComponent);
+
+(0, _defineProperty2.default)(StatusInternal, "displayName", 'StatusInternal');
+var Status = (0, _analyticsNext.withAnalyticsEvents)({
+  onClick: function onClick(createEvent, props) {
+    var localId = props.localId;
+    return (0, _analytics.createStatusAnalyticsAndFire)(createEvent)({
+      action: 'clicked',
+      actionSubject: 'statusLozenge',
+      attributes: {
+        localId: localId
+      }
+    });
+  },
+  onHover: function onHover(createEvent, props) {
+    var localId = props.localId;
+    return (0, _analytics.createStatusAnalyticsAndFire)(createEvent)({
+      action: 'hovered',
+      actionSubject: 'statusLozenge',
+      attributes: {
+        localId: localId
+      }
+    });
+  }
+})(StatusInternal);
+exports.Status = Status;

package/dist/cjs/components/StatusPicker.js

@@ -0,0 +1,121 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StatusPicker = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
+
+var _constants = require("@atlaskit/theme/constants");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _colorPalette = _interopRequireDefault(require("./internal/color-palette"));
+
+var _templateObject;
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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 _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var FieldTextWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0 ", "px;\n"])), (0, _constants.gridSize)());
+
+var StatusPicker = /*#__PURE__*/function (_PureComponent) {
+  (0, _inherits2.default)(StatusPicker, _PureComponent);
+
+  var _super = _createSuper(StatusPicker);
+
+  function StatusPicker() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, StatusPicker);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "fieldTextWrapperKey", Math.random().toString());
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "colorPaletteKey", Math.random().toString());
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onChange", function (evt) {
+      // @ts-ignore
+      _this.props.onTextChanged(evt.target.value);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onKeyPress", function (event) {
+      if (event.key === 'Enter') {
+        _this.props.onEnter();
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleInputRef", function (ref) {
+      if (ref && _this.props.autoFocus) {
+        // Defer to prevent editor scrolling to top (See FS-3227, also ED-2992)
+        setTimeout(function () {
+          ref.focus();
+        });
+      }
+    });
+    return _this;
+  }
+
+  (0, _createClass2.default)(StatusPicker, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          text = _this$props.text,
+          selectedColor = _this$props.selectedColor,
+          onColorClick = _this$props.onColorClick,
+          onColorHover = _this$props.onColorHover; // Using <React.Fragment> instead of [] to workaround Enzyme
+      // (https://github.com/airbnb/enzyme/issues/1149)
+
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(FieldTextWrapper, {
+        key: this.fieldTextWrapperKey
+      }, /*#__PURE__*/_react.default.createElement(_textfield.default, {
+        value: text,
+        isCompact: true,
+        ref: this.handleInputRef,
+        onChange: this.onChange,
+        onKeyPress: this.onKeyPress,
+        spellCheck: false,
+        autoComplete: "off"
+      })), /*#__PURE__*/_react.default.createElement(_colorPalette.default, {
+        key: this.colorPaletteKey,
+        onClick: onColorClick,
+        onHover: onColorHover,
+        selectedColor: selectedColor
+      }));
+    }
+  }]);
+  return StatusPicker;
+}(_react.PureComponent);
+
+exports.StatusPicker = StatusPicker;
+(0, _defineProperty2.default)(StatusPicker, "defaultProps", {
+  autoFocus: true
+});

package/dist/cjs/components/analytics.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createStatusAnalyticsAndFire = exports.ELEMENTS_CHANNEL = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _version = require("../version.json");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var ELEMENTS_CHANNEL = 'fabric-elements';
+exports.ELEMENTS_CHANNEL = ELEMENTS_CHANNEL;
+
+var createStatusAnalyticsAndFire = function createStatusAnalyticsAndFire(createAnalyticsEvent) {
+  return function (payload) {
+    var statusPayload = _objectSpread(_objectSpread({}, payload), {}, {
+      eventType: 'ui'
+    });
+
+    if (!statusPayload.attributes) {
+      statusPayload.attributes = {};
+    }
+
+    statusPayload.attributes.packageName = _version.name;
+    statusPayload.attributes.packageVersion = _version.version;
+    statusPayload.attributes.componentName = 'status';
+    var event = createAnalyticsEvent(statusPayload);
+    event.fire(ELEMENTS_CHANNEL);
+    return event;
+  };
+};
+
+exports.createStatusAnalyticsAndFire = createStatusAnalyticsAndFire;

package/dist/cjs/components/constants.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ANALYTICS_HOVER_DELAY = void 0;
+var ANALYTICS_HOVER_DELAY = 1000;
+exports.ANALYTICS_HOVER_DELAY = ANALYTICS_HOVER_DELAY;

package/dist/cjs/components/i18n.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.messages = void 0;
+
+var _reactIntl = require("react-intl");
+
+var messages = (0, _reactIntl.defineMessages)({
+  neutralColor: {
+    id: 'fabric.status.color.grey',
+    defaultMessage: 'Grey',
+    description: 'Tooltip for the grey color in color palette'
+  },
+  purpleColor: {
+    id: 'fabric.status.color.purple',
+    defaultMessage: 'Purple',
+    description: 'Tooltip for the purple color in color palette'
+  },
+  blueColor: {
+    id: 'fabric.status.color.blue',
+    defaultMessage: 'Blue',
+    description: 'Tooltip for the blue color in color palette'
+  },
+  redColor: {
+    id: 'fabric.status.color.red',
+    defaultMessage: 'Red',
+    description: 'Tooltip for the red color in color palette'
+  },
+  yellowColor: {
+    id: 'fabric.status.color.yellow',
+    defaultMessage: 'Yellow',
+    description: 'Tooltip for the yellow color in color palette'
+  },
+  greenColor: {
+    id: 'fabric.status.color.green',
+    defaultMessage: 'Green',
+    description: 'Tooltip for the green color in color palette'
+  }
+});
+exports.messages = messages;

package/dist/cjs/components/internal/color-palette.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _constants = require("@atlaskit/theme/constants");
+
+var colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _color = _interopRequireDefault(require("./color"));
+
+var _templateObject;
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+// color value, label, background, borderColor
+var palette = [['neutral', colors.N40, colors.N400], ['purple', colors.P50, colors.P400], ['blue', colors.B50, colors.B400], ['red', colors.R50, colors.R400], ['yellow', colors.Y75, colors.Y400], ['green', colors.G50, colors.G400]];
+
+var ColorPaletteWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  margin: ", "px ", "px 0 ", "px;\n  /* Firefox bug fix: https://product-fabric.atlassian.net/browse/ED-1789 */\n  display: flex;\n  flex-wrap: wrap;\n"])), (0, _constants.gridSize)(), (0, _constants.gridSize)(), (0, _constants.gridSize)());
+
+var _default = function _default(_ref) {
+  var _ref$cols = _ref.cols,
+      cols = _ref$cols === void 0 ? 7 : _ref$cols,
+      onClick = _ref.onClick,
+      selectedColor = _ref.selectedColor,
+      className = _ref.className,
+      onHover = _ref.onHover;
+  return /*#__PURE__*/_react.default.createElement(ColorPaletteWrapper, {
+    className: className,
+    style: {
+      maxWidth: cols * 32
+    }
+  }, palette.map(function (_ref2) {
+    var _ref3 = (0, _slicedToArray2.default)(_ref2, 3),
+        colorValue = _ref3[0],
+        backgroundColor = _ref3[1],
+        borderColor = _ref3[2];
+
+    return /*#__PURE__*/_react.default.createElement(_color.default, {
+      key: colorValue,
+      value: colorValue,
+      backgroundColor: backgroundColor,
+      borderColor: borderColor,
+      onClick: onClick,
+      onHover: onHover,
+      isSelected: colorValue === selectedColor
+    });
+  }));
+};
+
+exports.default = _default;