@atlaskit/textfield - npm Package Compare versions

Comparing version 6.2.0 to 6.3.0

CHANGELOG.md

 # @atlaskit/textfield
 
+## 6.3.0
+
+### Minor Changes
+
+-   [#94675](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/94675)
+    [`5d9e1dccacca`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5d9e1dccacca) -
+    [ux] Update input border color token to meet 3:1 color contrast ratioLight theme:
+    color.border.input: #091E4224 → #8590A2Dark mode: color.border.input: #A6C5E229 → #738496
+
+### Patch Changes
+
+-   Updated dependencies
+
 ## 6.2.0
@@ -4,0 +17,0 @@

dist/cjs/styles.js

@@ -9,3 +9,2 @@ "use strict";
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
@@ -33,3 +32,3 @@ var _constants = require("@atlaskit/theme/constants");
 var borderColor = {
-  standard: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? _colors.N100 : _colors.N40, ")"),
+  standard: "var(--ds-border-input, ".concat(_colors.N100, ")"),
   subtle: 'transparent',
@@ -44,3 +43,3 @@ none: 'transparent'
 var borderColorHover = {
-  standard: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? _colors.N100 : _colors.N40, ")"),
+  standard: "var(--ds-border-input, ".concat(_colors.N100, ")"),
   subtle: "var(--ds-border-input, transparent)",
@@ -62,3 +61,3 @@ none: 'transparent'
       borderColor: borderColorFocus[appearance],
-      boxShadow: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-input-border-wdith_5abwv') ? "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", borderColorFocus[appearance]) : undefined
+      boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", borderColorFocus[appearance])
     },
@@ -74,3 +73,3 @@ '&[data-disabled]': _objectSpread({
       borderColor: "var(--ds-border-danger, ".concat(_colors.R400, ")"),
-      boxShadow: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-input-border-wdith_5abwv') ? "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, ".concat(_colors.R400, ")")) : undefined
+      boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, ".concat(_colors.R400, ")"))
     },
@@ -80,3 +79,3 @@ '&[data-invalid]:focus-within': {
       borderColor: "var(--ds-border-focused, ".concat(_colors.B200, ")"),
-      boxShadow: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-input-border-wdith_5abwv') ? "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-focused, ".concat(_colors.B200, ")")) : undefined
+      boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-focused, ".concat(_colors.B200, ")"))
     },
@@ -111,4 +110,4 @@ '@media screen and (-ms-high-contrast: active)': {
     borderRadius: 3,
-    borderWidth: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-input-border-wdith_5abwv') ? "var(--ds-border-width, 1px)" : 2
-  }, (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-input-border-wdith_5abwv') && appearance !== 'none' ? {
+    borderWidth: "var(--ds-border-width, 1px)"
+  }, appearance !== 'none' ? {
     padding: "var(--ds-border-width, 1px)".concat(" 0")
@@ -115,0 +114,0 @@ } : {}), {}, {

dist/cjs/text-field.js

@@ -26,3 +26,3 @@ "use strict";
   packageName: "@atlaskit/textfield",
-  packageVersion: "6.2.0"
+  packageVersion: "6.3.0"
 };
@@ -29,0 +29,0 @@ var TextfieldComponent = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {

dist/es2019/styles.js

@@ -1,3 +0,2 @@
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { B200, N0, N10, N100, N200, N30, N40, N70, N900, R400 } from '@atlaskit/theme/colors';
+import { B200, N0, N10, N100, N200, N30, N70, N900, R400 } from '@atlaskit/theme/colors';
 import { codeFontFamily, fontFamily, fontSize as getFontSize,
@@ -24,3 +23,3 @@ // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 const borderColor = {
-  standard: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40})`,
+  standard: `var(--ds-border-input, ${N100})`,
   subtle: 'transparent',
@@ -35,3 +34,3 @@ none: 'transparent'
 const borderColorHover = {
-  standard: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40})`,
+  standard: `var(--ds-border-input, ${N100})`,
   subtle: "var(--ds-border-input, transparent)",
@@ -52,3 +51,3 @@ none: 'transparent'
     borderColor: borderColorFocus[appearance],
-    boxShadow: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${borderColorFocus[appearance]}` : undefined
+    boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${borderColorFocus[appearance]}`
   },
@@ -67,3 +66,3 @@ '&[data-disabled]': {
     borderColor: `var(--ds-border-danger, ${R400})`,
-    boxShadow: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-danger, ${R400})`}` : undefined
+    boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-danger, ${R400})`}`
   },
@@ -73,3 +72,3 @@ '&[data-invalid]:focus-within': {
     borderColor: `var(--ds-border-focused, ${B200})`,
-    boxShadow: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-focused, ${B200})`}` : undefined
+    boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-focused, ${B200})`}`
   },
@@ -100,5 +99,5 @@ '@media screen and (-ms-high-contrast: active)': {
   borderRadius: 3,
-  borderWidth: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? "var(--ds-border-width, 1px)" : 2,
+  borderWidth: "var(--ds-border-width, 1px)",
   // add 1px padding on both top and bottom to keep the same overall height after border reduced from 2px to 1px under feature flag
-  ...(getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') && appearance !== 'none' ? {
+  ...(appearance !== 'none' ? {
     padding: `${"var(--ds-border-width, 1px)"} 0`
@@ -105,0 +104,0 @@ } : {}),

dist/es2019/text-field.js

@@ -10,3 +10,3 @@ import _extends from "@babel/runtime/helpers/extends";
   packageName: "@atlaskit/textfield",
-  packageVersion: "6.2.0"
+  packageVersion: "6.3.0"
 };
@@ -13,0 +13,0 @@ const TextfieldComponent = /*#__PURE__*/forwardRef((props, ref) => {

dist/esm/styles.js

 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; }
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { B200, N0, N10, N100, N200, N30, N40, N70, N900, R400 } from '@atlaskit/theme/colors';
+import { B200, N0, N10, N100, N200, N30, N70, N900, R400 } from '@atlaskit/theme/colors';
 import { codeFontFamily, fontFamily, fontSize as getFontSize,
@@ -27,3 +26,3 @@ // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 var borderColor = {
-  standard: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40, ")"),
+  standard: "var(--ds-border-input, ".concat(N100, ")"),
   subtle: 'transparent',
@@ -38,3 +37,3 @@ none: 'transparent'
 var borderColorHover = {
-  standard: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40, ")"),
+  standard: "var(--ds-border-input, ".concat(N100, ")"),
   subtle: "var(--ds-border-input, transparent)",
@@ -56,3 +55,3 @@ none: 'transparent'
       borderColor: borderColorFocus[appearance],
-      boxShadow: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", borderColorFocus[appearance]) : undefined
+      boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", borderColorFocus[appearance])
     },
@@ -68,3 +67,3 @@ '&[data-disabled]': _objectSpread({
       borderColor: "var(--ds-border-danger, ".concat(R400, ")"),
-      boxShadow: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, ".concat(R400, ")")) : undefined
+      boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, ".concat(R400, ")"))
     },
@@ -74,3 +73,3 @@ '&[data-invalid]:focus-within': {
       borderColor: "var(--ds-border-focused, ".concat(B200, ")"),
-      boxShadow: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-focused, ".concat(B200, ")")) : undefined
+      boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-focused, ".concat(B200, ")"))
     },
@@ -105,4 +104,4 @@ '@media screen and (-ms-high-contrast: active)': {
     borderRadius: 3,
-    borderWidth: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? "var(--ds-border-width, 1px)" : 2
-  }, getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') && appearance !== 'none' ? {
+    borderWidth: "var(--ds-border-width, 1px)"
+  }, appearance !== 'none' ? {
     padding: "var(--ds-border-width, 1px)".concat(" 0")
@@ -109,0 +108,0 @@ } : {}), {}, {

dist/esm/text-field.js

@@ -16,3 +16,3 @@ import _extends from "@babel/runtime/helpers/extends";
   packageName: "@atlaskit/textfield",
-  packageVersion: "6.2.0"
+  packageVersion: "6.3.0"
 };
@@ -19,0 +19,0 @@ var TextfieldComponent = /*#__PURE__*/forwardRef(function (props, ref) {

dist/types-ts4.5/styles.d.ts

@@ -17,3 +17,3 @@ import { Appearance } from './types';
     readonly borderRadius: 3;
-    readonly borderWidth: "var(--ds-border-width)" | 2;
+    readonly borderWidth: "var(--ds-border-width)";
     readonly backgroundColor: string;
@@ -30,3 +30,3 @@ readonly borderColor: string;
         borderColor: string;
-        boxShadow: string | undefined;
+        boxShadow: string;
     };
@@ -41,3 +41,3 @@ readonly '&[data-disabled]': {
         borderColor: "var(--ds-border-danger)";
-        boxShadow: string | undefined;
+        boxShadow: string;
     };
@@ -47,3 +47,3 @@ readonly '&[data-invalid]:focus-within': {
         borderColor: "var(--ds-border-focused)";
-        boxShadow: string | undefined;
+        boxShadow: string;
     };
@@ -50,0 +50,0 @@ readonly '@media screen and (-ms-high-contrast: active)': {

dist/types/styles.d.ts

@@ -17,3 +17,3 @@ import { Appearance } from './types';
     readonly borderRadius: 3;
-    readonly borderWidth: "var(--ds-border-width)" | 2;
+    readonly borderWidth: "var(--ds-border-width)";
     readonly backgroundColor: string;
@@ -30,3 +30,3 @@ readonly borderColor: string;
         borderColor: string;
-        boxShadow: string | undefined;
+        boxShadow: string;
     };
@@ -41,3 +41,3 @@ readonly '&[data-disabled]': {
         borderColor: "var(--ds-border-danger)";
-        boxShadow: string | undefined;
+        boxShadow: string;
     };
@@ -47,3 +47,3 @@ readonly '&[data-invalid]:focus-within': {
         borderColor: "var(--ds-border-focused)";
-        boxShadow: string | undefined;
+        boxShadow: string;
     };
@@ -50,0 +50,0 @@ readonly '@media screen and (-ms-high-contrast: active)': {

package.json

 {
   "name": "@atlaskit/textfield",
-  "version": "6.2.0",
+  "version": "6.3.0",
   "description": "A text field is an input that allows a user to write or edit text.",
@@ -31,5 +31,4 @@ "publishConfig": {
     "@atlaskit/analytics-next": "^9.3.0",
-    "@atlaskit/platform-feature-flags": "^0.2.0",
     "@atlaskit/theme": "^12.7.0",
-    "@atlaskit/tokens": "^1.44.0",
+    "@atlaskit/tokens": "^1.45.0",
     "@babel/runtime": "^7.0.0",
@@ -95,12 +94,4 @@ "@emotion/react": "^11.7.1"
   },
-  "platform-feature-flags": {
-    "platform.design-system-team.border-checkbox_nyoiu": {
-      "type": "boolean"
-    },
-    "platform.design-system-team.update-input-border-wdith_5abwv": {
-      "type": "boolean"
-    }
-  },
   "homepage": "https://atlassian.design/components/textfield/",
   "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
 }

No alert changes

Improved metrics

Dependency count

6

decreased by-14.29%

Worsened metrics

Total package byte prevSize

121470

decreased by-1.64%

Lines of code

2245

decreased by-0.13%

Dependency changes

• - Removed@atlaskit/platform-feature-flags@^0.2.0

• - Removed@atlaskit/platform-feature-flags@0.2.6(transitive)

• Updated@atlaskit/tokens@^1.45.0