@atlaskit/status 3.0.2 → 3.0.3

package/dist/esm/components/compiled/internal/color-palette.js

@@ -1,95 +0,0 @@
-/* color-palette.tsx generated by @compiled/babel-plugin v0.36.1 */
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import "./color-palette.compiled.css";
-import { ax, ix } from "@compiled/react/runtime";
-import React, { useEffect, useRef, useCallback, useState } from 'react';
-import Color from './color';
-import { fg } from '@atlaskit/platform-feature-flags';
-var paletteLegacy = [['neutral', "var(--ds-background-neutral, #091E420F)", "var(--ds-border-bold, #758195)", "var(--ds-icon, #44546F)"], ['purple', "var(--ds-background-discovery, #F3F0FF)", "var(--ds-border-discovery, #8270DB)", "var(--ds-icon-discovery, #8270DB)"], ['blue', "var(--ds-background-information, #E9F2FF)", "var(--ds-border-information, #1D7AFC)", "var(--ds-icon-information, #1D7AFC)"], ['red', "var(--ds-background-danger, #FFECEB)", "var(--ds-border-danger, #E2483D)", "var(--ds-icon-danger, #C9372C)"], ['yellow', "var(--ds-background-warning, #FFF7D6)", "var(--ds-border-warning, #E56910)", "var(--ds-icon-warning, #E56910)"], ['green', "var(--ds-background-success, #DCFFF1)", "var(--ds-border-success, #22A06B)", "var(--ds-icon-success, #22A06B)"]];
-var paletteRefreshed = [['neutral', "var(--ds-background-accent-gray-subtler, #DCDFE4)", "var(--ds-border-bold, #758195)", "var(--ds-icon, #44546F)"], ['blue', "var(--ds-background-information-pressed, #85B8FF)", "var(--ds-border-information, #1D7AFC)", "var(--ds-icon, #44546F)"], ['green', "var(--ds-background-success-pressed, #7EE2B8)", "var(--ds-border-success, #22A06B)", "var(--ds-icon, #44546F)"], ['yellow', "var(--ds-background-warning-pressed, #F5CD47)", "var(--ds-border-warning, #E56910)", "var(--ds-icon, #44546F)"], ['red', "var(--ds-background-danger-pressed, #FD9891)", "var(--ds-border-danger, #E2483D)", "var(--ds-icon, #44546F)"], ['purple', "var(--ds-background-discovery-pressed, #B8ACF6)", "var(--ds-border-discovery, #8270DB)", "var(--ds-icon, #44546F)"]];
-var getPalette = function getPalette() {
-  return fg('platform-component-visual-refresh') ? paletteRefreshed : paletteLegacy;
-};
-var palette = getPalette();
-
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/design-system/no-css-tagged-template-expression -- Ignored via go/DSP-18766
-var colorPaletteWrapperStyles = null;
-var VK_LEFT = 37; //ArrowLeft
-var VK_RIGHT = 39; //ArrowRight
-var VK_UP = 38; //ArrowUp
-var VK_DOWN = 40; //ArrowDown
-var VK_TAB = 9;
-export default (function (_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;
-  var colorRefs = useRef([]);
-  var _useState = useState(0),
-    _useState2 = _slicedToArray(_useState, 2),
-    currentFocusedColor = _useState2[0],
-    setCurrentFocusedColor = _useState2[1];
-  useEffect(function () {
-    colorRefs.current = colorRefs.current.slice(0, palette.length);
-  }, []);
-  var memoizedHandleKeyDown = useCallback(function (e) {
-    var newColorIndex = null;
-    var nextColor = function nextColor() {
-      return currentFocusedColor + 1 > palette.length - 1 ? 0 : currentFocusedColor + 1;
-    };
-    var previousColor = function previousColor() {
-      return currentFocusedColor - 1 < 0 ? palette.length - 1 : currentFocusedColor - 1;
-    };
-    switch (e.keyCode) {
-      case VK_RIGHT:
-      case VK_DOWN:
-        e.preventDefault();
-        newColorIndex = nextColor();
-        break;
-      case VK_LEFT:
-      case VK_UP:
-        e.preventDefault();
-        newColorIndex = previousColor();
-        break;
-      case VK_TAB:
-        setCurrentFocusedColor(0);
-        break;
-    }
-    if (newColorIndex === null) {
-      return;
-    }
-    setCurrentFocusedColor(newColorIndex);
-    var newRef = colorRefs.current[newColorIndex];
-    newRef === null || newRef === void 0 || newRef.focus();
-  }, [currentFocusedColor, setCurrentFocusedColor, colorRefs]);
-  return /*#__PURE__*/React.createElement("ul", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: ax(["_19bvidpf _19pku2gc _2hwxu2gc _otyridpf _18u0u2gc _1e0c1txw _1n261g80", className]),
-    style: {
-      maxWidth: cols * 32
-    },
-    onKeyDown: memoizedHandleKeyDown
-  }, palette.map(function (_ref2, i) {
-    var _ref3 = _slicedToArray(_ref2, 4),
-      colorValue = _ref3[0],
-      backgroundColor = _ref3[1],
-      borderColor = _ref3[2],
-      iconColor = _ref3[3];
-    return /*#__PURE__*/React.createElement(Color, {
-      key: colorValue,
-      value: colorValue,
-      backgroundColor: backgroundColor,
-      borderColor: borderColor,
-      iconColor: iconColor,
-      onClick: onClick,
-      onHover: onHover,
-      isSelected: colorValue === selectedColor,
-      tabIndex: i === 0 ? 0 : -1,
-      setRef: function setRef(el) {
-        return colorRefs.current[i] = el;
-      }
-    });
-  }));
-});

package/dist/esm/components/compiled/internal/color.js

@@ -1,112 +0,0 @@
-/* color.tsx generated by @compiled/babel-plugin v0.36.1 */
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import "./color.compiled.css";
-import * as React from 'react';
-import { ax, ix } from "@compiled/react/runtime";
-function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-import EditorDoneIcon from '@atlaskit/icon/core/migration/check-mark--editor-done';
-import { Pressable } from '@atlaskit/primitives/compiled';
-import { PureComponent } from 'react';
-import { FormattedMessage } from 'react-intl-next';
-import { ANALYTICS_HOVER_DELAY } from '../../constants';
-import { messages } from '../../i18n';
-var styles = {
-  button: "_2rkoglpi _19it7r9e _1reo15vq _18m915vq _4t3i1tcg _1bsb1tcg _bfhkm7j4 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _1e0c1ule"
-};
-
-// We have tried with changing border and padding from 1px to token near version 2px,
-// the pop - up is being expanded to two lines.
-var buttonWrapperStyles = null;
-var Color = /*#__PURE__*/function (_PureComponent) {
-  function Color() {
-    var _this;
-    _classCallCheck(this, Color);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _callSuper(this, Color, [].concat(args));
-    _defineProperty(_this, "hoverStartTime", 0);
-    _defineProperty(_this, "onMouseEnter", function () {
-      _this.hoverStartTime = Date.now();
-    });
-    _defineProperty(_this, "onMouseLeave", function () {
-      var onHover = _this.props.onHover;
-      var delay = Date.now() - _this.hoverStartTime;
-      if (delay >= ANALYTICS_HOVER_DELAY && onHover) {
-        onHover(_this.props.value);
-      }
-      _this.hoverStartTime = 0;
-    });
-    _defineProperty(_this, "onMouseDown", function (e) {
-      e.preventDefault();
-    });
-    _defineProperty(_this, "onClick", function (e) {
-      var _this$props = _this.props,
-        onClick = _this$props.onClick,
-        value = _this$props.value;
-      e.preventDefault();
-      onClick(value);
-    });
-    return _this;
-  }
-  _inherits(Color, _PureComponent);
-  return _createClass(Color, [{
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      var _this$props2 = this.props,
-        tabIndex = _this$props2.tabIndex,
-        backgroundColor = _this$props2.backgroundColor,
-        isSelected = _this$props2.isSelected,
-        borderColor = _this$props2.borderColor,
-        iconColor = _this$props2.iconColor,
-        value = _this$props2.value,
-        setRef = _this$props2.setRef;
-      return /*#__PURE__*/React.createElement("li", {
-        className: ax(["_ca0qt94y _u5f3t94y _n3tdt94y _19bvt94y _2rko12x7 _189et94y _1dqonqa1 _1h6d1j28 _19pkidpf _2hwxv77o _otyridpf _18u0v77o _1e0c1txw _4cvr1h6o _bfw7pp12"]),
-        style: {
-          "--_18x9sjc": ix("1px solid ".concat("var(--ds-border, #091E4224)"))
-        }
-      }, /*#__PURE__*/React.createElement(FormattedMessage, messages["".concat(value, "Color")], function (labels) {
-        return /*#__PURE__*/React.createElement(Pressable, {
-          xcss: styles.button,
-          onClick: _this2.onClick,
-          onMouseEnter: _this2.onMouseEnter,
-          onMouseLeave: _this2.onMouseLeave,
-          onMouseDown: _this2.onMouseDown,
-          tabIndex: tabIndex,
-          title: labels[0]
-          // button element does not support aria-selected.
-          // For button selected (to be precise pressed) or not
-          //  use aria-pressed as per
-          // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role#associated_aria_roles_states_and_properties
-          ,
-          "aria-pressed": isSelected,
-          style: {
-            backgroundColor: backgroundColor || 'transparent',
-            // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
-            color: iconColor,
-            // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
-            borderColor: borderColor
-          },
-          ref: setRef
-        }, isSelected && /*#__PURE__*/React.createElement(EditorDoneIcon, {
-          color: "currentColor",
-          label: labels[0]
-        }));
-      }));
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.hoverStartTime = 0;
-    }
-  }]);
-}(PureComponent);
-export { Color as default };

package/dist/types/components/compiled/Status.d.ts

@@ -1,16 +0,0 @@
-/// <reference types="react" />
-import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-export type Color = 'neutral' | 'purple' | 'blue' | 'red' | 'yellow' | 'green';
-export type StatusStyle = 'bold' | 'subtle';
-export interface OwnProps {
-    text: string;
-    color: Color;
-    style?: StatusStyle;
-    localId?: string;
-    onClick?: (event: React.SyntheticEvent<any>) => void;
-    onHover?: () => void;
-    role?: string;
-    isBold?: boolean;
-}
-export type Props = OwnProps & WithAnalyticsEventsProps;
-export declare const Status: import("react").ForwardRefExoticComponent<Omit<OwnProps, keyof WithAnalyticsEventsProps> & import("react").RefAttributes<any>>;

package/dist/types/components/compiled/StatusPicker.d.ts

@@ -1,16 +0,0 @@
-import React from 'react';
-import { type WrappedComponentProps } from 'react-intl-next';
-import { type Color } from './Status';
-export type ColorType = Color;
-export interface Props {
-    selectedColor: ColorType;
-    text: string;
-    onEnter: () => void;
-    onColorClick: (value: ColorType) => void;
-    onColorHover?: (value: ColorType) => void;
-    onTextChanged: (value: string) => void;
-    autoFocus?: boolean;
-}
-export declare const StatusPicker: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
-    WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
-};

package/dist/types/components/compiled/internal/color-palette.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { type Color as ColorType } from '../Status';
-interface ColorPaletteProps {
-    selectedColor?: ColorType;
-    onClick: (value: ColorType) => void;
-    onHover?: (value: ColorType) => void;
-    cols?: number;
-    className?: string;
-}
-declare const _default: ({ cols, onClick, selectedColor, className, onHover }: ColorPaletteProps) => JSX.Element;
-export default _default;

package/dist/types/components/compiled/internal/color.d.ts

@@ -1,22 +0,0 @@
-import { PureComponent } from 'react';
-import { type Color as ColorType } from '../Status';
-export interface ColorProps {
-    value: ColorType;
-    tabIndex?: number;
-    isSelected?: boolean;
-    onClick: (value: ColorType) => void;
-    onHover?: (value: ColorType) => void;
-    backgroundColor: string;
-    borderColor: string;
-    iconColor: string;
-    setRef?: (value: HTMLButtonElement) => HTMLButtonElement;
-}
-export default class Color extends PureComponent<ColorProps> {
-    private hoverStartTime;
-    render(): JSX.Element;
-    componentWillUnmount(): void;
-    onMouseEnter: () => void;
-    onMouseLeave: () => void;
-    onMouseDown: React.MouseEventHandler<HTMLButtonElement>;
-    onClick: React.MouseEventHandler<HTMLButtonElement>;
-}

package/dist/types-ts4.5/components/compiled/Status.d.ts

@@ -1,16 +0,0 @@
-/// <reference types="react" />
-import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-export type Color = 'neutral' | 'purple' | 'blue' | 'red' | 'yellow' | 'green';
-export type StatusStyle = 'bold' | 'subtle';
-export interface OwnProps {
-    text: string;
-    color: Color;
-    style?: StatusStyle;
-    localId?: string;
-    onClick?: (event: React.SyntheticEvent<any>) => void;
-    onHover?: () => void;
-    role?: string;
-    isBold?: boolean;
-}
-export type Props = OwnProps & WithAnalyticsEventsProps;
-export declare const Status: import("react").ForwardRefExoticComponent<Omit<OwnProps, keyof WithAnalyticsEventsProps> & import("react").RefAttributes<any>>;

package/dist/types-ts4.5/components/compiled/StatusPicker.d.ts

@@ -1,16 +0,0 @@
-import React from 'react';
-import { type WrappedComponentProps } from 'react-intl-next';
-import { type Color } from './Status';
-export type ColorType = Color;
-export interface Props {
-    selectedColor: ColorType;
-    text: string;
-    onEnter: () => void;
-    onColorClick: (value: ColorType) => void;
-    onColorHover?: (value: ColorType) => void;
-    onTextChanged: (value: string) => void;
-    autoFocus?: boolean;
-}
-export declare const StatusPicker: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
-    WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
-};

package/dist/types-ts4.5/components/compiled/internal/color-palette.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { type Color as ColorType } from '../Status';
-interface ColorPaletteProps {
-    selectedColor?: ColorType;
-    onClick: (value: ColorType) => void;
-    onHover?: (value: ColorType) => void;
-    cols?: number;
-    className?: string;
-}
-declare const _default: ({ cols, onClick, selectedColor, className, onHover }: ColorPaletteProps) => JSX.Element;
-export default _default;

package/dist/types-ts4.5/components/compiled/internal/color.d.ts

@@ -1,22 +0,0 @@
-import { PureComponent } from 'react';
-import { type Color as ColorType } from '../Status';
-export interface ColorProps {
-    value: ColorType;
-    tabIndex?: number;
-    isSelected?: boolean;
-    onClick: (value: ColorType) => void;
-    onHover?: (value: ColorType) => void;
-    backgroundColor: string;
-    borderColor: string;
-    iconColor: string;
-    setRef?: (value: HTMLButtonElement) => HTMLButtonElement;
-}
-export default class Color extends PureComponent<ColorProps> {
-    private hoverStartTime;
-    render(): JSX.Element;
-    componentWillUnmount(): void;
-    onMouseEnter: () => void;
-    onMouseLeave: () => void;
-    onMouseDown: React.MouseEventHandler<HTMLButtonElement>;
-    onClick: React.MouseEventHandler<HTMLButtonElement>;
-}