@atlaskit/status 1.4.4 → 1.4.6

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/status
 
+## 1.4.6
+
+### Patch Changes
+
+- [#66759](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/66759) [`906578f1ea5d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/906578f1ea5d) - [ux] ED-21787: Migrating few CSS entries to space and color tokens
+
+## 1.4.5
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.4.4
 
 ### Patch Changes

package/afm-cc/tsconfig.json

@@ -0,0 +1,40 @@
+{
+    "extends": "../../../../tsconfig.entry-points.confluence.json",
+    "compilerOptions": {
+        "declaration": true,
+        "target": "es5",
+        "composite": true,
+        "outDir": "../dist",
+        "rootDir": "../",
+        "baseUrl": "../"
+    },
+    "include": [
+        "../src/**/*.ts",
+        "../src/**/*.tsx"
+    ],
+    "exclude": [
+        "../src/**/__tests__/*",
+        "../src/**/*.test.*",
+        "../src/**/test.*"
+    ],
+    "references": [
+        {
+            "path": "../../../analytics/analytics-next/afm-cc/tsconfig.json"
+        },
+        {
+            "path": "../../../design-system/icon/afm-cc/tsconfig.json"
+        },
+        {
+            "path": "../../../design-system/lozenge/afm-cc/tsconfig.json"
+        },
+        {
+            "path": "../../../design-system/textfield/afm-cc/tsconfig.json"
+        },
+        {
+            "path": "../../../design-system/theme/afm-cc/tsconfig.json"
+        },
+        {
+            "path": "../../../design-system/tokens/afm-cc/tsconfig.json"
+        }
+    ]
+}

package/dist/cjs/components/Status.js

@@ -20,7 +20,9 @@ var _analytics = require("./analytics");
 var _constants = require("./constants");
 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; } } /** @jsx jsx */
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
+// Disabling linting for nextline since these values are used as text reference, but not used as part of the CSS
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview */
 var colorToLozengeAppearanceMap = {
   neutral: 'default',
   purple: 'new',
@@ -29,7 +31,7 @@ var colorToLozengeAppearanceMap = {
   yellow: 'moved',
   green: 'success'
 };
-/* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
+/* eslint-enable @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview */
 
 var DEFAULT_APPEARANCE = 'default';
 var MAX_WIDTH = 200;

package/dist/cjs/components/analytics.js

@@ -10,7 +10,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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; }
 var ELEMENTS_CHANNEL = exports.ELEMENTS_CHANNEL = 'fabric-elements';
 var packageName = "@atlaskit/status";
-var packageVersion = "1.4.4";
+var packageVersion = "1.4.6";
 var createStatusAnalyticsAndFire = exports.createStatusAnalyticsAndFire = function createStatusAnalyticsAndFire(createAnalyticsEvent) {
   return function (payload) {
     var statusPayload = _objectSpread(_objectSpread({}, payload), {}, {

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

@@ -28,7 +28,11 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 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 buttonStyles = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 24px;\n  width: 24px;\n  background: ", ";\n  padding: 0;\n  border-radius: 4px;\n  border: 1px solid ", ";\n  cursor: pointer;\n  display: block;\n  box-sizing: border-box;\n  overflow: hidden;\n"])), "var(--ds-background-neutral, ".concat(_colors.N900, ")"), "var(--ds-border, ".concat(_colors.N0, ")"));
-var buttonWrapperStyles = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  border: 1px solid transparent;\n  margin: 0 ", ";\n  font-size: 0;\n  display: flex;\n  align-items: center;\n  padding: 1px;\n  border-radius: 6px;\n  &:hover {\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-space-025, 2px)", "var(--ds-border, ".concat(_colors.N50, ")"));
+
+// We have tried with changing border and padding from 1px to token near version 2px,
+// the pop - up is being expanded to two lines.
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+var buttonWrapperStyles = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  border: 1px solid transparent;\n  margin: 0 ", ";\n  font-size: 0;\n  display: flex;\n  align-items: center;\n  padding: 1px;\n  border-radius: ", ";\n  &:hover {\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-space-025, 2px)", "var(--ds-space-075, 6px)", "var(--ds-border, ".concat(_colors.N50, ")"));
 var Color = exports.default = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Color, _PureComponent);
   var _super = _createSuper(Color);

package/dist/es2019/components/Status.js

@@ -6,7 +6,10 @@ import Lozenge from '@atlaskit/lozenge';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { createStatusAnalyticsAndFire } from './analytics';
 import { ANALYTICS_HOVER_DELAY } from './constants';
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
+
+// Disabling linting for nextline since these values are used as text reference, but not used as part of the CSS
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview */
 const colorToLozengeAppearanceMap = {
   neutral: 'default',
   purple: 'new',
@@ -15,7 +18,7 @@ const colorToLozengeAppearanceMap = {
   yellow: 'moved',
   green: 'success'
 };
-/* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
+/* eslint-enable @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview */
 
 const DEFAULT_APPEARANCE = 'default';
 const MAX_WIDTH = 200;

package/dist/es2019/components/analytics.js

@@ -1,6 +1,6 @@
 export const ELEMENTS_CHANNEL = 'fabric-elements';
 const packageName = "@atlaskit/status";
-const packageVersion = "1.4.4";
+const packageVersion = "1.4.6";
 export const createStatusAnalyticsAndFire = createAnalyticsEvent => payload => {
   const statusPayload = {
     ...payload,

package/dist/es2019/components/internal/color.js

@@ -19,6 +19,10 @@ const buttonStyles = css`
   box-sizing: border-box;
   overflow: hidden;
 `;
+
+// We have tried with changing border and padding from 1px to token near version 2px,
+// the pop - up is being expanded to two lines.
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
 const buttonWrapperStyles = css`
   border: 1px solid transparent;
   margin: 0 ${"var(--ds-space-025, 2px)"};
@@ -26,7 +30,7 @@ const buttonWrapperStyles = css`
   display: flex;
   align-items: center;
   padding: 1px;
-  border-radius: 6px;
+  border-radius: ${"var(--ds-space-075, 6px)"};
   &:hover {
     border: 1px solid ${`var(--ds-border, ${N50})`};
   }

package/dist/esm/components/Status.js

@@ -14,7 +14,10 @@ import Lozenge from '@atlaskit/lozenge';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { createStatusAnalyticsAndFire } from './analytics';
 import { ANALYTICS_HOVER_DELAY } from './constants';
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
+
+// Disabling linting for nextline since these values are used as text reference, but not used as part of the CSS
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview */
 var colorToLozengeAppearanceMap = {
   neutral: 'default',
   purple: 'new',
@@ -23,7 +26,7 @@ var colorToLozengeAppearanceMap = {
   yellow: 'moved',
   green: 'success'
 };
-/* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
+/* eslint-enable @atlaskit/design-system/ensure-design-token-usage, @atlaskit/design-system/ensure-design-token-usage/preview */
 
 var DEFAULT_APPEARANCE = 'default';
 var MAX_WIDTH = 200;

package/dist/esm/components/analytics.js

@@ -3,7 +3,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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; }
 export var ELEMENTS_CHANNEL = 'fabric-elements';
 var packageName = "@atlaskit/status";
-var packageVersion = "1.4.4";
+var packageVersion = "1.4.6";
 export var createStatusAnalyticsAndFire = function createStatusAnalyticsAndFire(createAnalyticsEvent) {
   return function (payload) {
     var statusPayload = _objectSpread(_objectSpread({}, payload), {}, {

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

@@ -18,7 +18,11 @@ import { css, jsx } from '@emotion/react';
 import { ANALYTICS_HOVER_DELAY } from '../constants';
 import { messages } from '../i18n';
 var buttonStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 24px;\n  width: 24px;\n  background: ", ";\n  padding: 0;\n  border-radius: 4px;\n  border: 1px solid ", ";\n  cursor: pointer;\n  display: block;\n  box-sizing: border-box;\n  overflow: hidden;\n"])), "var(--ds-background-neutral, ".concat(N900, ")"), "var(--ds-border, ".concat(N0, ")"));
-var buttonWrapperStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border: 1px solid transparent;\n  margin: 0 ", ";\n  font-size: 0;\n  display: flex;\n  align-items: center;\n  padding: 1px;\n  border-radius: 6px;\n  &:hover {\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-space-025, 2px)", "var(--ds-border, ".concat(N50, ")"));
+
+// We have tried with changing border and padding from 1px to token near version 2px,
+// the pop - up is being expanded to two lines.
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+var buttonWrapperStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border: 1px solid transparent;\n  margin: 0 ", ";\n  font-size: 0;\n  display: flex;\n  align-items: center;\n  padding: 1px;\n  border-radius: ", ";\n  &:hover {\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-space-025, 2px)", "var(--ds-space-075, 6px)", "var(--ds-border, ".concat(N50, ")"));
 var Color = /*#__PURE__*/function (_PureComponent) {
   _inherits(Color, _PureComponent);
   var _super = _createSuper(Color);

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@atlaskit/status",
-  "version": "1.4.4",
+  "version": "1.4.6",
   "description": "Fabric Status React Components",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend",
+  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
   "main": "dist/cjs/index.js",
@@ -19,7 +19,8 @@
     "releaseModel": "continuous",
     "website": {
       "name": "Status"
-    }
+    },
+    "runReact18": false
   },
   "config": {
     "access": "public"
@@ -27,10 +28,10 @@
   "dependencies": {
     "@atlaskit/analytics-next": "^9.1.0",
     "@atlaskit/icon": "^22.0.0",
-    "@atlaskit/lozenge": "^11.4.0",
-    "@atlaskit/textfield": "^5.6.0",
+    "@atlaskit/lozenge": "^11.6.0",
+    "@atlaskit/textfield": "^6.0.0",
     "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.28.0",
+    "@atlaskit/tokens": "^1.33.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1"
   },

package/tmp/api-report-tmp.d.ts

@@ -1,74 +0,0 @@
-## API Report File for "@atlaskit/status"
-
-> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
-
-```ts
-
-/// <reference types="react" />
-
-import { ForwardRefExoticComponent } from 'react';
-import { default as React_2 } from 'react';
-import { RefAttributes } from 'react';
-import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import { WithIntlProps } from 'react-intl-next';
-import { WrappedComponentProps } from 'react-intl-next';
-
-// @public (undocumented)
-export type Color = 'blue' | 'green' | 'neutral' | 'purple' | 'red' | 'yellow';
-
-// @public (undocumented)
-type ColorType = Color;
-
-// @public (undocumented)
-interface OwnProps {
-    // (undocumented)
-    color: Color;
-    // (undocumented)
-    localId?: string;
-    // (undocumented)
-    onClick?: (event: React.SyntheticEvent<any>) => void;
-    // (undocumented)
-    onHover?: () => void;
-    // (undocumented)
-    role?: string;
-    // (undocumented)
-    style?: StatusStyle;
-    // (undocumented)
-    text: string;
-}
-
-// @public (undocumented)
-export type Props = OwnProps & WithAnalyticsEventsProps;
-
-// @public (undocumented)
-export const Status: ForwardRefExoticComponent<Omit<Props, keyof WithAnalyticsEventsProps> & RefAttributes<any>>;
-
-// @public (undocumented)
-export const StatusPicker: React_2.FC<WithIntlProps<StatusPickerProps & WrappedComponentProps<"intl">>> & {
-    WrappedComponent: React_2.ComponentType<StatusPickerProps & WrappedComponentProps<"intl">>;
-};
-
-// @public (undocumented)
-export interface StatusPickerProps {
-    // (undocumented)
-    autoFocus?: boolean;
-    // (undocumented)
-    onColorClick: (value: ColorType) => void;
-    // (undocumented)
-    onColorHover?: (value: ColorType) => void;
-    // (undocumented)
-    onEnter: () => void;
-    // (undocumented)
-    onTextChanged: (value: string) => void;
-    // (undocumented)
-    selectedColor: ColorType;
-    // (undocumented)
-    text: string;
-}
-
-// @public (undocumented)
-export type StatusStyle = 'bold' | 'subtle';
-
-// (No @packageDocumentation comment for this package)
-
-```