@atlaskit/textfield 6.1.0 → 6.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/textfield
2
2
 
3
+ ## 6.1.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#81644](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/81644) [`8ab7a816dca7`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8ab7a816dca7) - Revert input border change from the previous version
8
+
3
9
  ## 6.1.0
4
10
 
5
11
  ### Minor Changes
@@ -56,7 +56,7 @@ var getContainerTextBgAndBorderColor = function getContainerTextBgAndBorderColor
56
56
  '&:focus-within:not([data-disabled])': {
57
57
  backgroundColor: backgroundColorFocus[appearance],
58
58
  borderColor: borderColorFocus[appearance],
59
- boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", borderColorFocus[appearance])
59
+ 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
60
60
  },
61
61
  '&[data-disabled]': _objectSpread({
62
62
  color: "var(--ds-text-disabled, ".concat(_colors.N70, ")"),
@@ -67,12 +67,12 @@ var getContainerTextBgAndBorderColor = function getContainerTextBgAndBorderColor
67
67
  }),
68
68
  '&[data-invalid], &[data-invalid]:hover': {
69
69
  borderColor: "var(--ds-border-danger, ".concat(_colors.R400, ")"),
70
- boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, ".concat(_colors.R400, ")"))
70
+ 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
71
71
  },
72
72
  '&[data-invalid]:focus-within': {
73
73
  backgroundColor: "var(--ds-background-input-pressed, ".concat(_colors.N0, ")"),
74
74
  borderColor: "var(--ds-border-focused, ".concat(_colors.B200, ")"),
75
- boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-focused, ".concat(_colors.B200, ")"))
75
+ 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
76
76
  },
77
77
  '@media screen and (-ms-high-contrast: active)': {
78
78
  '&[data-invalid]:focus-within': {
@@ -102,8 +102,8 @@ var containerStyles = exports.containerStyles = function containerStyles(appeara
102
102
  alignItems: 'center'
103
103
  }, getContainerTextBgAndBorderColor(appearance)), {}, {
104
104
  borderRadius: 3,
105
- borderWidth: "var(--ds-border-width, 1px)"
106
- }, appearance !== 'none' ? {
105
+ borderWidth: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-input-border-wdith_5abwv') ? "var(--ds-border-width, 1px)" : 2
106
+ }, (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-input-border-wdith_5abwv') && appearance !== 'none' ? {
107
107
  padding: "var(--ds-border-width, 1px)".concat(" 0")
108
108
  } : {}), {}, {
109
109
  borderStyle: appearance === 'none' ? 'none' : 'solid',
@@ -23,7 +23,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
23
23
  var analyticsParams = {
24
24
  componentName: 'textField',
25
25
  packageName: "@atlaskit/textfield",
26
- packageVersion: "6.1.0"
26
+ packageVersion: "6.1.1"
27
27
  };
28
28
  var Textfield = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
29
29
  var _props$appearance = props.appearance,
@@ -47,7 +47,7 @@ const getContainerTextBgAndBorderColor = appearance => ({
47
47
  '&:focus-within:not([data-disabled])': {
48
48
  backgroundColor: backgroundColorFocus[appearance],
49
49
  borderColor: borderColorFocus[appearance],
50
- boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${borderColorFocus[appearance]}`
50
+ boxShadow: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${borderColorFocus[appearance]}` : undefined
51
51
  },
52
52
  '&[data-disabled]': {
53
53
  color: `var(--ds-text-disabled, ${N70})`,
@@ -61,12 +61,12 @@ const getContainerTextBgAndBorderColor = appearance => ({
61
61
  },
62
62
  '&[data-invalid], &[data-invalid]:hover': {
63
63
  borderColor: `var(--ds-border-danger, ${R400})`,
64
- boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-danger, ${R400})`}`
64
+ 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
65
65
  },
66
66
  '&[data-invalid]:focus-within': {
67
67
  backgroundColor: `var(--ds-background-input-pressed, ${N0})`,
68
68
  borderColor: `var(--ds-border-focused, ${B200})`,
69
- boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-focused, ${B200})`}`
69
+ 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
70
70
  },
71
71
  '@media screen and (-ms-high-contrast: active)': {
72
72
  '&[data-invalid]:focus-within': {
@@ -92,9 +92,9 @@ export const containerStyles = (appearance, width) => ({
92
92
  alignItems: 'center',
93
93
  ...getContainerTextBgAndBorderColor(appearance),
94
94
  borderRadius: 3,
95
- borderWidth: "var(--ds-border-width, 1px)",
95
+ borderWidth: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? "var(--ds-border-width, 1px)" : 2,
96
96
  // add 1px padding on both top and bottom to keep the same overall height after border reduced from 2px to 1px under feature flag
97
- ...(appearance !== 'none' ? {
97
+ ...(getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') && appearance !== 'none' ? {
98
98
  padding: `${"var(--ds-border-width, 1px)"} 0`
99
99
  } : {}),
100
100
  borderStyle: appearance === 'none' ? 'none' : 'solid',
@@ -7,7 +7,7 @@ import { containerStyles as getContainerStyles, inputStyles as getInputStyles }
7
7
  const analyticsParams = {
8
8
  componentName: 'textField',
9
9
  packageName: "@atlaskit/textfield",
10
- packageVersion: "6.1.0"
10
+ packageVersion: "6.1.1"
11
11
  };
12
12
  const Textfield = /*#__PURE__*/forwardRef((props, ref) => {
13
13
  const {
@@ -51,7 +51,7 @@ var getContainerTextBgAndBorderColor = function getContainerTextBgAndBorderColor
51
51
  '&:focus-within:not([data-disabled])': {
52
52
  backgroundColor: backgroundColorFocus[appearance],
53
53
  borderColor: borderColorFocus[appearance],
54
- boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", borderColorFocus[appearance])
54
+ boxShadow: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", borderColorFocus[appearance]) : undefined
55
55
  },
56
56
  '&[data-disabled]': _objectSpread({
57
57
  color: "var(--ds-text-disabled, ".concat(N70, ")"),
@@ -62,12 +62,12 @@ var getContainerTextBgAndBorderColor = function getContainerTextBgAndBorderColor
62
62
  }),
63
63
  '&[data-invalid], &[data-invalid]:hover': {
64
64
  borderColor: "var(--ds-border-danger, ".concat(R400, ")"),
65
- boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, ".concat(R400, ")"))
65
+ 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
66
66
  },
67
67
  '&[data-invalid]:focus-within': {
68
68
  backgroundColor: "var(--ds-background-input-pressed, ".concat(N0, ")"),
69
69
  borderColor: "var(--ds-border-focused, ".concat(B200, ")"),
70
- boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-focused, ".concat(B200, ")"))
70
+ 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
71
71
  },
72
72
  '@media screen and (-ms-high-contrast: active)': {
73
73
  '&[data-invalid]:focus-within': {
@@ -97,8 +97,8 @@ export var containerStyles = function containerStyles(appearance, width) {
97
97
  alignItems: 'center'
98
98
  }, getContainerTextBgAndBorderColor(appearance)), {}, {
99
99
  borderRadius: 3,
100
- borderWidth: "var(--ds-border-width, 1px)"
101
- }, appearance !== 'none' ? {
100
+ borderWidth: getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') ? "var(--ds-border-width, 1px)" : 2
101
+ }, getBooleanFF('platform.design-system-team.update-input-border-wdith_5abwv') && appearance !== 'none' ? {
102
102
  padding: "var(--ds-border-width, 1px)".concat(" 0")
103
103
  } : {}), {}, {
104
104
  borderStyle: appearance === 'none' ? 'none' : 'solid',
@@ -13,7 +13,7 @@ import { containerStyles as getContainerStyles, inputStyles as getInputStyles }
13
13
  var analyticsParams = {
14
14
  componentName: 'textField',
15
15
  packageName: "@atlaskit/textfield",
16
- packageVersion: "6.1.0"
16
+ packageVersion: "6.1.1"
17
17
  };
18
18
  var Textfield = /*#__PURE__*/forwardRef(function (props, ref) {
19
19
  var _props$appearance = props.appearance,
@@ -14,7 +14,7 @@ export declare const containerStyles: (appearance: Appearance, width?: string |
14
14
  readonly pointerEvents: "auto";
15
15
  readonly padding?: string | undefined;
16
16
  readonly borderRadius: 3;
17
- readonly borderWidth: "var(--ds-border-width)";
17
+ readonly borderWidth: "var(--ds-border-width)" | 2;
18
18
  readonly backgroundColor: string;
19
19
  readonly borderColor: string;
20
20
  readonly color: "var(--ds-text)";
@@ -26,7 +26,7 @@ export declare const containerStyles: (appearance: Appearance, width?: string |
26
26
  readonly '&:focus-within:not([data-disabled])': {
27
27
  backgroundColor: string;
28
28
  borderColor: string;
29
- boxShadow: string;
29
+ boxShadow: string | undefined;
30
30
  };
31
31
  readonly '&[data-disabled]': {
32
32
  backgroundColor?: "var(--ds-background-disabled)" | undefined;
@@ -36,12 +36,12 @@ export declare const containerStyles: (appearance: Appearance, width?: string |
36
36
  };
37
37
  readonly '&[data-invalid], &[data-invalid]:hover': {
38
38
  borderColor: "var(--ds-border-danger)";
39
- boxShadow: string;
39
+ boxShadow: string | undefined;
40
40
  };
41
41
  readonly '&[data-invalid]:focus-within': {
42
42
  backgroundColor: "var(--ds-background-input-pressed)";
43
43
  borderColor: "var(--ds-border-focused)";
44
- boxShadow: string;
44
+ boxShadow: string | undefined;
45
45
  };
46
46
  readonly '@media screen and (-ms-high-contrast: active)': {
47
47
  '&[data-invalid]:focus-within': {
@@ -14,7 +14,7 @@ export declare const containerStyles: (appearance: Appearance, width?: string |
14
14
  readonly pointerEvents: "auto";
15
15
  readonly padding?: string | undefined;
16
16
  readonly borderRadius: 3;
17
- readonly borderWidth: "var(--ds-border-width)";
17
+ readonly borderWidth: "var(--ds-border-width)" | 2;
18
18
  readonly backgroundColor: string;
19
19
  readonly borderColor: string;
20
20
  readonly color: "var(--ds-text)";
@@ -26,7 +26,7 @@ export declare const containerStyles: (appearance: Appearance, width?: string |
26
26
  readonly '&:focus-within:not([data-disabled])': {
27
27
  backgroundColor: string;
28
28
  borderColor: string;
29
- boxShadow: string;
29
+ boxShadow: string | undefined;
30
30
  };
31
31
  readonly '&[data-disabled]': {
32
32
  backgroundColor?: "var(--ds-background-disabled)" | undefined;
@@ -36,12 +36,12 @@ export declare const containerStyles: (appearance: Appearance, width?: string |
36
36
  };
37
37
  readonly '&[data-invalid], &[data-invalid]:hover': {
38
38
  borderColor: "var(--ds-border-danger)";
39
- boxShadow: string;
39
+ boxShadow: string | undefined;
40
40
  };
41
41
  readonly '&[data-invalid]:focus-within': {
42
42
  backgroundColor: "var(--ds-background-input-pressed)";
43
43
  borderColor: "var(--ds-border-focused)";
44
- boxShadow: string;
44
+ boxShadow: string | undefined;
45
45
  };
46
46
  readonly '@media screen and (-ms-high-contrast: active)': {
47
47
  '&[data-invalid]:focus-within': {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/textfield",
3
- "version": "6.1.0",
3
+ "version": "6.1.1",
4
4
  "description": "A text field is an input that allows a user to write or edit text.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -93,6 +93,9 @@
93
93
  "platform-feature-flags": {
94
94
  "platform.design-system-team.border-checkbox_nyoiu": {
95
95
  "type": "boolean"
96
+ },
97
+ "platform.design-system-team.update-input-border-wdith_5abwv": {
98
+ "type": "boolean"
96
99
  }
97
100
  },
98
101
  "homepage": "https://atlassian.design/components/textfield/",