@atlaskit/textfield 8.0.0 → 8.0.2

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,19 @@
1
1
  # @atlaskit/textfield
2
2
 
3
+ ## 8.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#126525](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/126525)
8
+ [`69b96eb748121`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/69b96eb748121) -
9
+ Update dependencies and remove old codemods.
10
+
11
+ ## 8.0.1
12
+
13
+ ### Patch Changes
14
+
15
+ - Updated dependencies
16
+
3
17
  ## 8.0.0
4
18
 
5
19
  ### Major Changes
@@ -1,6 +1,6 @@
1
1
 
2
- ._11c81doa{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
3
- ._11c81oud{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
2
+ ._11c81ixg{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
3
+ ._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
4
4
  ._19itidpf{border:0}
5
5
  ._1tnq1l7b._1tnq1l7b{border-radius:3px}
6
6
  ._v564r5cv{transition:background-color .2s ease-in-out,border-color .2s ease-in-out}
@@ -77,4 +77,4 @@
77
77
  ._irr31d5g:hover{background-color:var(--ds-background-input-hovered,#f7f8f9)}
78
78
  ._irr31j28:hover{background-color:transparent}
79
79
  @media screen and (-ms-high-contrast:active){._1fnx18qt{color:GrayText}._6up518qt{border-color:GrayText}._srjtgir2:focus-within{border-color:Highlight}}
80
- @media (min-width:30rem){._14md1odn{font-family:var(--ds-font-family-code,ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}._1srd1b66[data-compact]{padding-block-end:var(--ds-space-050,4px)}._oi9h1b66[data-compact]{padding-block-start:var(--ds-space-050,4px)}._1e3012x7[data-compact]{padding-inline-end:var(--ds-space-075,6px)}._1txv12x7[data-compact]{padding-inline-start:var(--ds-space-075,6px)}._1tn21oud{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}._l9oiu2gc:not([data-compact]){padding-block-end:var(--ds-space-100,8px)}._549yu2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}._1h5w12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}._124212x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}}
80
+ @media (min-width:30rem){._14md1odn{font-family:var(--ds-font-family-code,ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}._1srd1b66[data-compact]{padding-block-end:var(--ds-space-050,4px)}._oi9h1b66[data-compact]{padding-block-start:var(--ds-space-050,4px)}._1e3012x7[data-compact]{padding-inline-end:var(--ds-space-075,6px)}._1txv12x7[data-compact]{padding-inline-start:var(--ds-space-075,6px)}._1tn22smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}._l9oiu2gc:not([data-compact]){padding-block-end:var(--ds-space-100,8px)}._549yu2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}._1h5w12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}._124212x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}}
@@ -29,7 +29,7 @@ var inputMediaDisabled = null;
29
29
  var analyticsParams = {
30
30
  componentName: 'textField',
31
31
  packageName: "@atlaskit/textfield",
32
- packageVersion: "8.0.0"
32
+ packageVersion: "8.0.2"
33
33
  };
34
34
  var disabledStyle = {
35
35
  standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",
@@ -158,7 +158,7 @@ var Textfield = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
158
158
  "data-testid": testId && "".concat(testId, "-container"),
159
159
  onMouseDown: handleOnMouseDown,
160
160
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
161
- className: (0, _runtime.ax)(["_16jlkb7n _1o9zkb7n _i0dl1osq _11c81oud _1reo15vq _18m915vq _v564r5cv _189ee4h9 _1e0c1txw _vchhusvi _4cvr1h6o _1bah1yb4 _lcxv1wug _s7n4jp4b _slp31hna _1tnq1l7b", getContainerTextBgAndBorderColor[appearance], containerStyleAppearance[appearance], !isDisabled && focusWithinStyle[appearance], !isDisabled && hoverStyle[appearance], isDisabled && containerMedia.disabled, isDisabled && disabledStyle[appearance], isInvalid && containerMedia.invalid, isInvalid && "_1h6d1bqt _4cvx1bqt _16qs13x5 _1dbz13x5 _10j7r01l", className]),
161
+ className: (0, _runtime.ax)(["_16jlkb7n _1o9zkb7n _i0dl1osq _11c82smr _1reo15vq _18m915vq _v564r5cv _189ee4h9 _1e0c1txw _vchhusvi _4cvr1h6o _1bah1yb4 _lcxv1wug _s7n4jp4b _slp31hna _1tnq1l7b", getContainerTextBgAndBorderColor[appearance], containerStyleAppearance[appearance], !isDisabled && focusWithinStyle[appearance], !isDisabled && hoverStyle[appearance], isDisabled && containerMedia.disabled, isDisabled && disabledStyle[appearance], isInvalid && containerMedia.invalid, isInvalid && "_1h6d1bqt _4cvx1bqt _16qs13x5 _1dbz13x5 _10j7r01l", className]),
162
162
  style: {
163
163
  maxWidth: "".concat(getMaxWidth(width)),
164
164
  "--_x5k4n9": (0, _runtime.ix)("inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, #E2483D)"))
@@ -182,7 +182,7 @@ var Textfield = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
182
182
  readOnly: isReadOnly,
183
183
  ref: setInputRef,
184
184
  required: isRequired,
185
- className: (0, _runtime.ax)(["_19itidpf _11c81oud _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l _3hog1lh4", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_oo9g1lh4", isDisabled && "_1fnx18qt", !isCompact && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_11c81doa _1tn21oud", isCompact && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
185
+ className: (0, _runtime.ax)(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l _3hog1lh4", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_oo9g1lh4", isDisabled && "_1fnx18qt", !isCompact && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_11c81ixg _1tn22smr", isCompact && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
186
186
  })), elemAfterInput);
187
187
  });
188
188
  var _default = exports.default = Textfield;
@@ -1,6 +1,6 @@
1
1
 
2
- ._11c81doa{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
3
- ._11c81oud{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
2
+ ._11c81ixg{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
3
+ ._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
4
4
  ._19itidpf{border:0}
5
5
  ._1tnq1l7b._1tnq1l7b{border-radius:3px}
6
6
  ._v564r5cv{transition:background-color .2s ease-in-out,border-color .2s ease-in-out}
@@ -77,4 +77,4 @@
77
77
  ._irr31d5g:hover{background-color:var(--ds-background-input-hovered,#f7f8f9)}
78
78
  ._irr31j28:hover{background-color:transparent}
79
79
  @media screen and (-ms-high-contrast:active){._1fnx18qt{color:GrayText}._6up518qt{border-color:GrayText}._srjtgir2:focus-within{border-color:Highlight}}
80
- @media (min-width:30rem){._14md1odn{font-family:var(--ds-font-family-code,ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}._1srd1b66[data-compact]{padding-block-end:var(--ds-space-050,4px)}._oi9h1b66[data-compact]{padding-block-start:var(--ds-space-050,4px)}._1e3012x7[data-compact]{padding-inline-end:var(--ds-space-075,6px)}._1txv12x7[data-compact]{padding-inline-start:var(--ds-space-075,6px)}._1tn21oud{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}._l9oiu2gc:not([data-compact]){padding-block-end:var(--ds-space-100,8px)}._549yu2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}._1h5w12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}._124212x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}}
80
+ @media (min-width:30rem){._14md1odn{font-family:var(--ds-font-family-code,ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}._1srd1b66[data-compact]{padding-block-end:var(--ds-space-050,4px)}._oi9h1b66[data-compact]{padding-block-start:var(--ds-space-050,4px)}._1e3012x7[data-compact]{padding-inline-end:var(--ds-space-075,6px)}._1txv12x7[data-compact]{padding-inline-start:var(--ds-space-075,6px)}._1tn22smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}._l9oiu2gc:not([data-compact]){padding-block-end:var(--ds-space-100,8px)}._549yu2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}._1h5w12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}._124212x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}}
@@ -13,7 +13,7 @@ const inputMediaDisabled = null;
13
13
  const analyticsParams = {
14
14
  componentName: 'textField',
15
15
  packageName: "@atlaskit/textfield",
16
- packageVersion: "8.0.0"
16
+ packageVersion: "8.0.2"
17
17
  };
18
18
  const disabledStyle = {
19
19
  standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",
@@ -140,7 +140,7 @@ const Textfield = /*#__PURE__*/forwardRef((props, ref) => {
140
140
  maxWidth: `${getMaxWidth(width)}`
141
141
  },
142
142
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
143
- className: ax(["_16jlkb7n _1o9zkb7n _i0dl1osq _11c81oud _1reo15vq _18m915vq _v564r5cv _189ee4h9 _1e0c1txw _vchhusvi _4cvr1h6o _1bah1yb4 _lcxv1wug _s7n4jp4b _slp31hna _1tnq1l7b", getContainerTextBgAndBorderColor[appearance], containerStyleAppearance[appearance], !isDisabled && focusWithinStyle[appearance], !isDisabled && hoverStyle[appearance], isDisabled && containerMedia.disabled, isDisabled && disabledStyle[appearance], isInvalid && containerMedia.invalid, isInvalid && "_1h6d1bqt _4cvx1bqt _16qsizbr _1dbzizbr _10j7r01l", className])
143
+ className: ax(["_16jlkb7n _1o9zkb7n _i0dl1osq _11c82smr _1reo15vq _18m915vq _v564r5cv _189ee4h9 _1e0c1txw _vchhusvi _4cvr1h6o _1bah1yb4 _lcxv1wug _s7n4jp4b _slp31hna _1tnq1l7b", getContainerTextBgAndBorderColor[appearance], containerStyleAppearance[appearance], !isDisabled && focusWithinStyle[appearance], !isDisabled && hoverStyle[appearance], isDisabled && containerMedia.disabled, isDisabled && disabledStyle[appearance], isInvalid && containerMedia.invalid, isInvalid && "_1h6d1bqt _4cvx1bqt _16qsizbr _1dbzizbr _10j7r01l", className])
144
144
  }, elemBeforeInput, /*#__PURE__*/React.createElement("input", _extends({}, spreadProps, {
145
145
  "aria-invalid": isInvalid ? isInvalid : undefined
146
146
  // TODO: When removing legacy theming fix this.
@@ -160,7 +160,7 @@ const Textfield = /*#__PURE__*/forwardRef((props, ref) => {
160
160
  readOnly: isReadOnly,
161
161
  ref: setInputRef,
162
162
  required: isRequired,
163
- className: ax(["_19itidpf _11c81oud _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l _3hog1lh4", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_oo9g1lh4", isDisabled && "_1fnx18qt", !isCompact && fg('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", fg('platform_design_system_team_safari_input_fix') && "_11c81doa _1tn21oud", isCompact && fg('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && fg('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
163
+ className: ax(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l _3hog1lh4", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_oo9g1lh4", isDisabled && "_1fnx18qt", !isCompact && fg('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", fg('platform_design_system_team_safari_input_fix') && "_11c81ixg _1tn22smr", isCompact && fg('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && fg('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
164
164
  })), elemAfterInput);
165
165
  });
166
166
  export default Textfield;
@@ -1,6 +1,6 @@
1
1
 
2
- ._11c81doa{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
3
- ._11c81oud{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
2
+ ._11c81ixg{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
3
+ ._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
4
4
  ._19itidpf{border:0}
5
5
  ._1tnq1l7b._1tnq1l7b{border-radius:3px}
6
6
  ._v564r5cv{transition:background-color .2s ease-in-out,border-color .2s ease-in-out}
@@ -77,4 +77,4 @@
77
77
  ._irr31d5g:hover{background-color:var(--ds-background-input-hovered,#f7f8f9)}
78
78
  ._irr31j28:hover{background-color:transparent}
79
79
  @media screen and (-ms-high-contrast:active){._1fnx18qt{color:GrayText}._6up518qt{border-color:GrayText}._srjtgir2:focus-within{border-color:Highlight}}
80
- @media (min-width:30rem){._14md1odn{font-family:var(--ds-font-family-code,ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}._1srd1b66[data-compact]{padding-block-end:var(--ds-space-050,4px)}._oi9h1b66[data-compact]{padding-block-start:var(--ds-space-050,4px)}._1e3012x7[data-compact]{padding-inline-end:var(--ds-space-075,6px)}._1txv12x7[data-compact]{padding-inline-start:var(--ds-space-075,6px)}._1tn21oud{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}._l9oiu2gc:not([data-compact]){padding-block-end:var(--ds-space-100,8px)}._549yu2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}._1h5w12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}._124212x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}}
80
+ @media (min-width:30rem){._14md1odn{font-family:var(--ds-font-family-code,ui-monospace,Menlo,"Segoe UI Mono","Ubuntu Mono",monospace)}._1srd1b66[data-compact]{padding-block-end:var(--ds-space-050,4px)}._oi9h1b66[data-compact]{padding-block-start:var(--ds-space-050,4px)}._1e3012x7[data-compact]{padding-inline-end:var(--ds-space-075,6px)}._1txv12x7[data-compact]{padding-inline-start:var(--ds-space-075,6px)}._1tn22smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}._l9oiu2gc:not([data-compact]){padding-block-end:var(--ds-space-100,8px)}._549yu2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}._1h5w12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}._124212x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}}
@@ -19,7 +19,7 @@ var inputMediaDisabled = null;
19
19
  var analyticsParams = {
20
20
  componentName: 'textField',
21
21
  packageName: "@atlaskit/textfield",
22
- packageVersion: "8.0.0"
22
+ packageVersion: "8.0.2"
23
23
  };
24
24
  var disabledStyle = {
25
25
  standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",
@@ -148,7 +148,7 @@ var Textfield = /*#__PURE__*/forwardRef(function (props, ref) {
148
148
  "data-testid": testId && "".concat(testId, "-container"),
149
149
  onMouseDown: handleOnMouseDown,
150
150
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
151
- className: ax(["_16jlkb7n _1o9zkb7n _i0dl1osq _11c81oud _1reo15vq _18m915vq _v564r5cv _189ee4h9 _1e0c1txw _vchhusvi _4cvr1h6o _1bah1yb4 _lcxv1wug _s7n4jp4b _slp31hna _1tnq1l7b", getContainerTextBgAndBorderColor[appearance], containerStyleAppearance[appearance], !isDisabled && focusWithinStyle[appearance], !isDisabled && hoverStyle[appearance], isDisabled && containerMedia.disabled, isDisabled && disabledStyle[appearance], isInvalid && containerMedia.invalid, isInvalid && "_1h6d1bqt _4cvx1bqt _16qs13x5 _1dbz13x5 _10j7r01l", className]),
151
+ className: ax(["_16jlkb7n _1o9zkb7n _i0dl1osq _11c82smr _1reo15vq _18m915vq _v564r5cv _189ee4h9 _1e0c1txw _vchhusvi _4cvr1h6o _1bah1yb4 _lcxv1wug _s7n4jp4b _slp31hna _1tnq1l7b", getContainerTextBgAndBorderColor[appearance], containerStyleAppearance[appearance], !isDisabled && focusWithinStyle[appearance], !isDisabled && hoverStyle[appearance], isDisabled && containerMedia.disabled, isDisabled && disabledStyle[appearance], isInvalid && containerMedia.invalid, isInvalid && "_1h6d1bqt _4cvx1bqt _16qs13x5 _1dbz13x5 _10j7r01l", className]),
152
152
  style: {
153
153
  maxWidth: "".concat(getMaxWidth(width)),
154
154
  "--_x5k4n9": ix("inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, #E2483D)"))
@@ -172,7 +172,7 @@ var Textfield = /*#__PURE__*/forwardRef(function (props, ref) {
172
172
  readOnly: isReadOnly,
173
173
  ref: setInputRef,
174
174
  required: isRequired,
175
- className: ax(["_19itidpf _11c81oud _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l _3hog1lh4", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_oo9g1lh4", isDisabled && "_1fnx18qt", !isCompact && fg('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", fg('platform_design_system_team_safari_input_fix') && "_11c81doa _1tn21oud", isCompact && fg('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && fg('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
175
+ className: ax(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l _3hog1lh4", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_oo9g1lh4", isDisabled && "_1fnx18qt", !isCompact && fg('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", fg('platform_design_system_team_safari_input_fix') && "_11c81ixg _1tn22smr", isCompact && fg('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && fg('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
176
176
  })), elemAfterInput);
177
177
  });
178
178
  export default Textfield;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/textfield",
3
- "version": "8.0.0",
3
+ "version": "8.0.2",
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/"
@@ -27,8 +27,8 @@
27
27
  "dependencies": {
28
28
  "@atlaskit/analytics-next": "^11.0.0",
29
29
  "@atlaskit/platform-feature-flags": "^1.1.0",
30
- "@atlaskit/theme": "^17.0.0",
31
- "@atlaskit/tokens": "^4.0.0",
30
+ "@atlaskit/theme": "^18.0.0",
31
+ "@atlaskit/tokens": "^4.5.0",
32
32
  "@babel/runtime": "^7.0.0",
33
33
  "@compiled/react": "^0.18.2"
34
34
  },
@@ -36,19 +36,22 @@
36
36
  "react": "^18.2.0"
37
37
  },
38
38
  "devDependencies": {
39
- "@af/accessibility-testing": "*",
40
- "@af/integration-testing": "*",
41
- "@af/visual-regression": "*",
42
- "@atlaskit/codemod-utils": "^4.2.3",
39
+ "@af/accessibility-testing": "^2.0.0",
40
+ "@af/integration-testing": "^0.5.0",
41
+ "@af/visual-regression": "^1.3.0",
42
+ "@atlaskit/avatar": "^25.0.0",
43
+ "@atlaskit/button": "^21.1.0",
44
+ "@atlaskit/docs": "^10.0.0",
43
45
  "@atlaskit/ds-lib": "^4.0.0",
44
- "@atlaskit/ssr": "*",
45
- "@atlaskit/visual-regression": "*",
46
- "@atlassian/feature-flags-test-utils": "*",
47
- "@testing-library/dom": "^10.1.0",
46
+ "@atlaskit/form": "^12.0.0",
47
+ "@atlaskit/icon": "^25.0.0",
48
+ "@atlaskit/link": "^3.0.0",
49
+ "@atlaskit/primitives": "^14.1.0",
50
+ "@atlaskit/section-message": "^8.1.0",
51
+ "@atlaskit/ssr": "^0.4.0",
48
52
  "@testing-library/react": "^13.4.0",
49
- "jscodeshift": "^0.13.0",
53
+ "@testing-library/user-event": "^14.4.3",
50
54
  "react-dom": "^18.2.0",
51
- "storybook-addon-performance": "^0.17.3",
52
55
  "typescript": "~5.4.2"
53
56
  },
54
57
  "keywords": [
@@ -1,13 +0,0 @@
1
- import { removeThemeImports } from './migrations/remove-imports';
2
- import { removeThemeProp } from './migrations/remove-props';
3
- import { renameThemeAppearanceImport, renamethemeTokensImport } from './migrations/rename-imports';
4
- import { createTransformer } from './migrations/utils';
5
-
6
- const transformer = createTransformer('@atlaskit/textfield', [
7
- removeThemeProp,
8
- removeThemeImports,
9
- renamethemeTokensImport,
10
- renameThemeAppearanceImport,
11
- ]);
12
-
13
- export default transformer;
@@ -1,7 +0,0 @@
1
- import { createTransformer } from '@atlaskit/codemod-utils';
2
-
3
- import { renameDisabledToIsDisabled } from './migrations/rename-disabled-to-isdisabled';
4
-
5
- const transformer = createTransformer([renameDisabledToIsDisabled]);
6
-
7
- export default transformer;
@@ -1,87 +0,0 @@
1
- jest.autoMockOff();
2
-
3
- import transformer from '../5.0.0-lite-mode';
4
-
5
- const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
6
-
7
- describe('TextField code-mods', () => {
8
- defineInlineTest(
9
- { default: transformer, parser: 'tsx' },
10
- {},
11
- `
12
- import Textfield, { ThemeProps, ThemeAppearance , themeTokens as ColorTokens, ThemeTokens } from '@atlaskit/textfield';
13
- import customeTheme from './theme';
14
- import React from 'react';
15
-
16
- const SimpleTextfield = () => {
17
- return (
18
- <Textfield
19
- theme={customTheme}
20
- />
21
- );
22
- }
23
- `,
24
- `
25
- /* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
26
- has now been removed due to its poor performance characteristics. We have not replaced
27
- theme with an equivalent API due to minimal usage of the \`theme\` prop.
28
- The appearance of TextField will have likely changed. */
29
- /* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
30
- has now been removed due to its poor performance characteristics. */
31
- import Textfield, { Appearance, TextFieldColors as ColorTokens } from '@atlaskit/textfield';
32
- import customeTheme from './theme';
33
- import React from 'react';
34
-
35
- const SimpleTextfield = () => {
36
- return <Textfield />;
37
- }
38
- `,
39
- 'should remove theme & its imports from Textfield and leave a comment',
40
- );
41
- defineInlineTest(
42
- { default: transformer, parser: 'tsx' },
43
- {},
44
- `
45
- import Textfield, { ThemeProps, ThemeTokens } from '@atlaskit/textfield';
46
- import React from 'react';
47
-
48
- const SimpleTextfield = () => {
49
- return (
50
- <Textfield
51
- theme={(theme, props: ThemeProps) => {
52
- const { container, input, ...rest } = theme(props);
53
- return {
54
- ...rest,
55
- container: {
56
- ...container,
57
- padding: 5,
58
- border: '2px solid orange',
59
- },
60
- input: {
61
- ...input,
62
- fontSize: 20,
63
- border: '2px solid green',
64
- },
65
- };
66
- }}
67
- />
68
- );
69
- }
70
- `,
71
- `
72
- /* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
73
- has now been removed due to its poor performance characteristics. We have not replaced
74
- theme with an equivalent API due to minimal usage of the \`theme\` prop.
75
- The appearance of TextField will have likely changed. */
76
- /* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
77
- has now been removed due to its poor performance characteristics. */
78
- import Textfield from '@atlaskit/textfield';
79
- import React from 'react';
80
-
81
- const SimpleTextfield = () => {
82
- return <Textfield />;
83
- }
84
- `,
85
- 'should remove theme prop & its imports from Textfield and leave a comment',
86
- );
87
- });
@@ -1,62 +0,0 @@
1
- jest.autoMockOff();
2
-
3
- import { removeThemeImports } from '../migrations/remove-imports';
4
- import { createTransformer } from '../migrations/utils';
5
-
6
- const transformer = createTransformer('@atlaskit/textfield', [removeThemeImports]);
7
-
8
- const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
9
-
10
- const importToDoComment = `
11
- /* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
12
- has now been removed due to its poor performance characteristics. */`;
13
-
14
- describe('Remove imports', () => {
15
- defineInlineTest(
16
- { default: transformer, parser: 'tsx' },
17
- {},
18
- `
19
- import Textfield, { Theme, ThemeProps, ThemeTokens } from '@atlaskit/textfield';
20
- `,
21
- `
22
- ${importToDoComment}
23
- import Textfield from '@atlaskit/textfield';
24
- `,
25
- 'should remove theme imports from Textfield and leave a comment',
26
- );
27
- defineInlineTest(
28
- { default: transformer, parser: 'tsx' },
29
- {},
30
- `
31
- import Textfield, { ThemeProps as TextfieldThemeProp, Theme as TextFieldTheme, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
32
- `,
33
- `
34
- ${importToDoComment}
35
- import Textfield from '@atlaskit/textfield';
36
- `,
37
- 'should remove theme imports with alias name from Textfield and leave a comment',
38
- );
39
- defineInlineTest(
40
- { default: transformer, parser: 'tsx' },
41
- {},
42
- `
43
- import { TextFieldProps, ThemeProps, Theme, ThemeTokens } from '@atlaskit/textfield';
44
- `,
45
- `
46
- ${importToDoComment}
47
- import { TextFieldProps } from '@atlaskit/textfield';
48
- `,
49
- 'should remove theme imports & leave other imports from Textfield and leave a comment',
50
- );
51
- defineInlineTest(
52
- { default: transformer, parser: 'tsx' },
53
- {},
54
- `
55
- import { ThemeProps, ThemeTokens, Theme } from '@atlaskit/textfield';
56
- `,
57
- `
58
- ${importToDoComment}
59
- `,
60
- 'should remove theme imports & remove whole line if no default import from Textfield and leave a comment',
61
- );
62
- });
@@ -1,142 +0,0 @@
1
- jest.autoMockOff();
2
-
3
- import { removeThemeProp } from '../migrations/remove-props';
4
- import { createTransformer } from '../migrations/utils';
5
-
6
- const transformer = createTransformer('@atlaskit/textfield', [removeThemeProp]);
7
-
8
- const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
9
-
10
- const themeToDoComment = `
11
- /* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
12
- has now been removed due to its poor performance characteristics. We have not replaced
13
- theme with an equivalent API due to minimal usage of the \`theme\` prop.
14
- The appearance of TextField will have likely changed. */`;
15
-
16
- describe('Remove prop', () => {
17
- defineInlineTest(
18
- { default: transformer, parser: 'tsx' },
19
- {},
20
- `
21
- import React from 'react';
22
- import Textfield from '@atlaskit/textfield';
23
- import customeTheme from './theme';
24
-
25
- const SimpleTextfield = () => {
26
- return (
27
- <Textfield
28
- theme={customTheme}
29
- />
30
- );
31
- }
32
- `,
33
- `
34
- ${themeToDoComment}
35
- import React from 'react';
36
- import Textfield from '@atlaskit/textfield';
37
- import customeTheme from './theme';
38
-
39
- const SimpleTextfield = () => {
40
- return <Textfield />;
41
- }
42
- `,
43
- 'should remove theme from Textfield and leave a comment',
44
- );
45
-
46
- defineInlineTest(
47
- { default: transformer, parser: 'tsx' },
48
- {},
49
- `
50
- import React from 'react';
51
- import TextField from '@atlaskit/textfield';
52
- import customeTheme from './theme';
53
-
54
- const SimpleTextfield = () => {
55
- return (
56
- <TextField
57
- theme={customTheme}
58
- />
59
- );
60
- }
61
- `,
62
- `
63
- ${themeToDoComment}
64
- import React from 'react';
65
- import TextField from '@atlaskit/textfield';
66
- import customeTheme from './theme';
67
-
68
- const SimpleTextfield = () => {
69
- return <TextField />;
70
- }
71
- `,
72
- 'should remove theme from TextField and leave a comment',
73
- );
74
-
75
- defineInlineTest(
76
- { default: transformer, parser: 'tsx' },
77
- {},
78
- `
79
- import React from 'react';
80
- import Textfield from '@atlaskit/textfield';
81
- import customeTheme from './theme';
82
-
83
- const SimpleTextfield = () => {
84
- return (
85
- <div>
86
- <Textfield
87
- theme={customTheme}
88
- />
89
- <Textfield
90
- theme={customTheme}
91
- />
92
- </div>
93
- );
94
- }
95
- `,
96
- `
97
- ${themeToDoComment}
98
- import React from 'react';
99
- import Textfield from '@atlaskit/textfield';
100
- import customeTheme from './theme';
101
-
102
- const SimpleTextfield = () => {
103
- return (
104
- <div>
105
- <Textfield />
106
- <Textfield />
107
- </div>
108
- );
109
- }
110
- `,
111
- 'should remove 2 usages of theme and add 1 comment',
112
- );
113
-
114
- defineInlineTest(
115
- { default: transformer, parser: 'tsx' },
116
- {},
117
- `
118
- import React from 'react';
119
- import Foo from '@atlaskit/textfield';
120
- import customeTheme from './theme';
121
-
122
- const SimpleTextfield = () => {
123
- return (
124
- <Foo
125
- theme={customeTheme}
126
- />
127
- );
128
- }
129
- `,
130
- `
131
- ${themeToDoComment}
132
- import React from 'react';
133
- import Foo from '@atlaskit/textfield';
134
- import customeTheme from './theme';
135
-
136
- const SimpleTextfield = () => {
137
- return <Foo />;
138
- }
139
- `,
140
- 'should remove theme prop when using an aliased name',
141
- );
142
- });
@@ -1,143 +0,0 @@
1
- jest.autoMockOff();
2
-
3
- import { createTransformer } from '@atlaskit/codemod-utils';
4
-
5
- import { renameDisabledToIsDisabled } from '../migrations/rename-disabled-to-isdisabled';
6
-
7
- const transformer = createTransformer([renameDisabledToIsDisabled]);
8
-
9
- const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
10
-
11
- describe('Rename `disabled` prop to `isDisabled`', () => {
12
- defineInlineTest(
13
- { default: transformer, parser: 'tsx' },
14
- {},
15
- `
16
- import React from 'react';
17
- import Textfield from '@atlaskit/textfield';
18
-
19
- const SimpleTextfield = () => {
20
- return <Textfield disabled />;
21
- }
22
- `,
23
- `
24
- import React from 'react';
25
- import Textfield from '@atlaskit/textfield';
26
-
27
- const SimpleTextfield = () => {
28
- return <Textfield isDisabled />;
29
- }
30
- `,
31
- 'should rename single line disabled to isDisabled',
32
- );
33
-
34
- defineInlineTest(
35
- { default: transformer, parser: 'tsx' },
36
- {},
37
- `
38
- import React from 'react';
39
- import Textfield from '@atlaskit/textfield';
40
-
41
- const SimpleTextfield = () => {
42
- return (
43
- <Textfield
44
- name="basic"
45
- aria-label="default text field"
46
- disabled
47
- />
48
- );
49
- }
50
- `,
51
- `
52
- import React from 'react';
53
- import Textfield from '@atlaskit/textfield';
54
-
55
- const SimpleTextfield = () => {
56
- return (
57
- <Textfield
58
- name="basic"
59
- aria-label="default text field"
60
- isDisabled
61
- />
62
- );
63
- }
64
- `,
65
- 'should rename multiline disabled to isDisabled',
66
- );
67
-
68
- defineInlineTest(
69
- { default: transformer, parser: 'tsx' },
70
- {},
71
- `
72
- import React from 'react';
73
- import Textfield from '@atlaskit/textfield';
74
-
75
- const SimpleTextfield = () => {
76
- const disabled = true;
77
-
78
- return (
79
- <Textfield
80
- name="basic"
81
- aria-label="default text field"
82
- disabled={disabled}
83
- />
84
- );
85
- }
86
- `,
87
- `
88
- import React from 'react';
89
- import Textfield from '@atlaskit/textfield';
90
-
91
- const SimpleTextfield = () => {
92
- const disabled = true;
93
-
94
- return (
95
- <Textfield
96
- name="basic"
97
- aria-label="default text field"
98
- isDisabled={disabled}
99
- />
100
- );
101
- }
102
- `,
103
- 'should rename disabled to isDisabled with indirection',
104
- );
105
-
106
- defineInlineTest(
107
- { default: transformer, parser: 'tsx' },
108
- {},
109
- `
110
- import React from 'react';
111
- import AkTextfield from '@atlaskit/textfield';
112
-
113
- const SimpleTextfield = () => {
114
- const disabled = true;
115
-
116
- return (
117
- <AkTextfield
118
- name="basic"
119
- aria-label="default text field"
120
- disabled={disabled}
121
- />
122
- );
123
- }
124
- `,
125
- `
126
- import React from 'react';
127
- import AkTextfield from '@atlaskit/textfield';
128
-
129
- const SimpleTextfield = () => {
130
- const disabled = true;
131
-
132
- return (
133
- <AkTextfield
134
- name="basic"
135
- aria-label="default text field"
136
- isDisabled={disabled}
137
- />
138
- );
139
- }
140
- `,
141
- 'should rename disabled to isDisabled with indirection and different default import',
142
- );
143
- });
@@ -1,82 +0,0 @@
1
- jest.autoMockOff();
2
-
3
- import { renameThemeAppearanceImport, renamethemeTokensImport } from '../migrations/rename-imports';
4
- import { createTransformer } from '../migrations/utils';
5
-
6
- const transformer = createTransformer('@atlaskit/textfield', [
7
- renamethemeTokensImport,
8
- renameThemeAppearanceImport,
9
- ]);
10
-
11
- const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
12
-
13
- describe('Rename imports', () => {
14
- defineInlineTest(
15
- { default: transformer, parser: 'tsx' },
16
- {},
17
- `
18
- import { themeTokens, ThemeAppearance } from '@atlaskit/textfield';
19
- `,
20
- `
21
- import { TextFieldColors, Appearance } from '@atlaskit/textfield';
22
- `,
23
- 'should rename themeTokens & ThemeAppearance to TextFieldColors & Appearance',
24
- );
25
- defineInlineTest(
26
- { default: transformer, parser: 'tsx' },
27
- {},
28
- `
29
- import Textfield, { ThemeAppearance, themeTokens } from '@atlaskit/textfield';
30
- `,
31
- `
32
- import Textfield, { Appearance, TextFieldColors } from '@atlaskit/textfield';
33
- `,
34
- 'should rename themeTokens & Appearance to TextFieldColors & Appearance and keep Textfield default import as is',
35
- );
36
- defineInlineTest(
37
- { default: transformer, parser: 'tsx' },
38
- {},
39
- `
40
- import Textfield, { TextFieldProps, themeTokens } from '@atlaskit/textfield';
41
- `,
42
- `
43
- import Textfield, { TextFieldProps, TextFieldColors } from '@atlaskit/textfield';
44
- `,
45
- 'should rename themeTokens to TextFieldColors and keep TextFieldProps as is',
46
- );
47
- defineInlineTest(
48
- { default: transformer, parser: 'tsx' },
49
- {},
50
- `
51
- import Textfield, { TextFieldProps, themeTokens as MyLifeMyColors } from '@atlaskit/textfield';
52
- `,
53
- `
54
- import Textfield, { TextFieldProps, TextFieldColors as MyLifeMyColors } from '@atlaskit/textfield';
55
- `,
56
- 'should rename themeTokens to TextFieldColors and keep its alias name as is',
57
- );
58
- defineInlineTest(
59
- { default: transformer, parser: 'tsx' },
60
- {},
61
- `
62
- import Textfield, { ThemeProps as TextfieldThemeProp,
63
- ThemeAppearance as TextFieldAppearance, Theme as TextFieldTheme, themeTokens as MyLifeMyColors, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
64
- `,
65
- `
66
- import Textfield, { ThemeProps as TextfieldThemeProp,
67
- Appearance as TextFieldAppearance, Theme as TextFieldTheme, TextFieldColors as MyLifeMyColors, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
68
- `,
69
- 'should rename themeTokens to TextFieldColors, ThemeAppearance to Appearance and keep its alias name as is even when there are multiple name exports with alias',
70
- );
71
- defineInlineTest(
72
- { default: transformer, parser: 'tsx' },
73
- {},
74
- `
75
- import { themeTokens, TextFieldProps } from '@atlaskit/textfield';
76
- `,
77
- `
78
- import { TextFieldColors, TextFieldProps } from '@atlaskit/textfield';
79
- `,
80
- 'should rename themeTokens to TextFieldColors and keep TextFieldProps named import as is',
81
- );
82
- });
@@ -1,8 +0,0 @@
1
- import { createRemoveImportsFor } from './utils';
2
-
3
- export const removeThemeImports = createRemoveImportsFor({
4
- importsToRemove: ['ThemeProps', 'ThemeTokens', 'Theme'],
5
- packagePath: '@atlaskit/textfield',
6
- comment: `This file uses exports used to help theme @atlaskit/textfield which
7
- has now been removed due to its poor performance characteristics.`,
8
- });
@@ -1,10 +0,0 @@
1
- import { createRemoveFuncFor } from './utils';
2
-
3
- const component = '@atlaskit/textfield';
4
- const prop = 'theme';
5
- const comment = `This file uses the @atlaskit/textfield \`theme\` prop which
6
- has now been removed due to its poor performance characteristics. We have not replaced
7
- theme with an equivalent API due to minimal usage of the \`theme\` prop.
8
- The appearance of TextField will have likely changed.`;
9
-
10
- export const removeThemeProp = createRemoveFuncFor(component, prop, comment);
@@ -1,7 +0,0 @@
1
- import { createRenameFuncFor } from '@atlaskit/codemod-utils';
2
-
3
- const component = '@atlaskit/textfield';
4
- const from = 'disabled';
5
- const to = 'isDisabled';
6
-
7
- export const renameDisabledToIsDisabled = createRenameFuncFor(component, from, to);
@@ -1,15 +0,0 @@
1
- import { createRenameJSXFunc } from './utils';
2
-
3
- export const renamethemeTokensImport = createRenameJSXFunc(
4
- '@atlaskit/textfield',
5
- 'themeTokens',
6
- 'TextFieldColors',
7
- 'DSTextFieldColors',
8
- );
9
-
10
- export const renameThemeAppearanceImport = createRenameJSXFunc(
11
- '@atlaskit/textfield',
12
- 'ThemeAppearance',
13
- 'Appearance',
14
- 'DSTextFieldAppearance',
15
- );
@@ -1,335 +0,0 @@
1
- import {
2
- type API,
3
- type ASTPath,
4
- type default as core,
5
- type FileInfo,
6
- type Identifier,
7
- type ImportDeclaration,
8
- type ImportSpecifier,
9
- type JSXAttribute,
10
- type Options,
11
- type Program,
12
- } from 'jscodeshift';
13
- import { type Collection } from 'jscodeshift/src/Collection';
14
-
15
- export type Nullable<T> = T | null;
16
-
17
- export function getDefaultSpecifier(j: core.JSCodeshift, source: any, specifier: string) {
18
- const specifiers = source
19
- .find(j.ImportDeclaration)
20
- .filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
21
- .find(j.ImportDefaultSpecifier);
22
-
23
- if (!specifiers.length) {
24
- return null;
25
- }
26
- return specifiers.nodes()[0]!.local!.name;
27
- }
28
- export function getNamedSpecifier(
29
- j: core.JSCodeshift,
30
- source: any,
31
- specifier: string,
32
- importName: string,
33
- ) {
34
- const specifiers = source
35
- .find(j.ImportDeclaration)
36
- .filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
37
- .find(j.ImportSpecifier)
38
- .filter((path: ASTPath<ImportSpecifier>) => path.node.imported.name === importName);
39
-
40
- if (!specifiers.length) {
41
- return null;
42
- }
43
- return specifiers.nodes()[0]!.local!.name;
44
- }
45
-
46
- export function getJSXAttributesByName(
47
- j: core.JSCodeshift,
48
- element: ASTPath<any>,
49
- attributeName: string,
50
- ): Collection<JSXAttribute> {
51
- return j(element)
52
- .find(j.JSXOpeningElement)
53
- .find(j.JSXAttribute)
54
- .filter((attribute) => {
55
- const matches = j(attribute)
56
- .find(j.JSXIdentifier)
57
- .filter((identifier) => identifier.value.name === attributeName);
58
- return Boolean(matches.length);
59
- });
60
- }
61
-
62
- export function hasImportDeclaration(j: core.JSCodeshift, source: any, importPath: string) {
63
- const imports = source
64
- .find(j.ImportDeclaration)
65
- .filter(
66
- (path: ASTPath<ImportDeclaration>) =>
67
- typeof path.node.source.value === 'string' && path.node.source.value.startsWith(importPath),
68
- );
69
-
70
- return Boolean(imports.length);
71
- }
72
- // not replacing newlines (which \s does)
73
- const spacesAndTabs: RegExp = /[ \t]{2,}/g;
74
- const lineStartWithSpaces: RegExp = /^[ \t]*/gm;
75
-
76
- function clean(value: string): string {
77
- return (
78
- value
79
- .replace(spacesAndTabs, ' ')
80
- .replace(lineStartWithSpaces, '')
81
- // using .trim() to clear the any newlines before the first text and after last text
82
- .trim()
83
- );
84
- }
85
-
86
- export function addCommentToStartOfFile({
87
- j,
88
- base,
89
- message,
90
- }: {
91
- j: core.JSCodeshift;
92
- base: Collection<Node>;
93
- message: string;
94
- }) {
95
- addCommentBefore({
96
- j,
97
- target: base.find(j.Program),
98
- message,
99
- });
100
- }
101
-
102
- export function addCommentBefore({
103
- j,
104
- target,
105
- message,
106
- }: {
107
- j: core.JSCodeshift;
108
- target: Collection<Program> | Collection<ImportDeclaration>;
109
- message: string;
110
- }) {
111
- const content: string = ` TODO: (from codemod) ${clean(message)} `;
112
- target.forEach((path: ASTPath<Program | ImportDeclaration>) => {
113
- path.value.comments = path.value.comments || [];
114
-
115
- const exists = path.value.comments.find((comment) => comment.value === content);
116
-
117
- // avoiding duplicates of the same comment
118
- if (exists) {
119
- return;
120
- }
121
-
122
- path.value.comments.push(j.commentBlock(content));
123
- });
124
- }
125
-
126
- export function doesIdentifierExist({
127
- j,
128
- base,
129
- name,
130
- }: {
131
- j: core.JSCodeshift;
132
- base: Collection<any>;
133
- name: string;
134
- }): boolean {
135
- return (
136
- base
137
- .find(j.Identifier)
138
- .filter((identifer: ASTPath<Identifier>) => identifer.value.name === name).length > 0
139
- );
140
- }
141
-
142
- export function getSafeImportName({
143
- j,
144
- base,
145
- currentDefaultSpecifierName,
146
- desiredName,
147
- fallbackName,
148
- }: {
149
- j: core.JSCodeshift;
150
- base: Collection<any>;
151
- currentDefaultSpecifierName: string;
152
- desiredName: string;
153
- fallbackName: string;
154
- }) {
155
- if (currentDefaultSpecifierName === desiredName) {
156
- return desiredName;
157
- }
158
-
159
- const isUsed: boolean = doesIdentifierExist({ j, base, name: desiredName });
160
-
161
- return isUsed ? fallbackName : desiredName;
162
- }
163
-
164
- export const createRemoveFuncFor =
165
- (component: string, prop: string, comment?: string) =>
166
- (j: core.JSCodeshift, source: Collection<Node>) => {
167
- const defaultSpecifier = getDefaultSpecifier(j, source, component);
168
-
169
- if (!defaultSpecifier) {
170
- return;
171
- }
172
-
173
- source.findJSXElements(defaultSpecifier).forEach((element) => {
174
- getJSXAttributesByName(j, element, prop).forEach((attribute) => {
175
- j(attribute).remove();
176
- if (comment) {
177
- addCommentToStartOfFile({ j, base: source, message: comment });
178
- }
179
- });
180
- });
181
- };
182
-
183
- export const createRemoveImportsFor =
184
- ({
185
- importsToRemove,
186
- packagePath,
187
- comment,
188
- }: {
189
- importsToRemove: string[];
190
- packagePath: string;
191
- comment: string;
192
- }) =>
193
- (j: core.JSCodeshift, source: Collection<Node>) => {
194
- const isUsingName: boolean =
195
- source.find(j.ImportDeclaration).filter((path) => path.node.source.value === packagePath)
196
- .length > 0;
197
- if (!isUsingName) {
198
- return;
199
- }
200
-
201
- const existingAliases: Nullable<string>[] =
202
- source
203
- .find(j.ImportDeclaration)
204
- .filter((path) => path.node.source.value === packagePath)
205
- .find(j.ImportSpecifier)
206
- .nodes()
207
- .map((specifier): Nullable<string> => {
208
- if (!importsToRemove.includes(specifier.imported.name)) {
209
- return null;
210
- }
211
- // If aliased: return the alias
212
- if (specifier.local && !importsToRemove.includes(specifier.local.name)) {
213
- return specifier.local.name;
214
- }
215
-
216
- return null;
217
- })
218
- .filter(Boolean) || null;
219
-
220
- // Add comments
221
- source
222
- .find(j.ImportDeclaration)
223
- .filter((path) => path.node.source.value === packagePath)
224
- .find(j.ImportSpecifier)
225
- .filter((importSpecifier) => {
226
- const identifier = j(importSpecifier).find(j.Identifier).get();
227
- if (
228
- importsToRemove.includes(identifier.value.name) ||
229
- existingAliases.includes(identifier.value.name)
230
- ) {
231
- addCommentToStartOfFile({ j, base: source, message: comment });
232
- return true;
233
- }
234
- return false;
235
- })
236
- .remove();
237
-
238
- // Remove entire import if it is empty
239
- const isEmptyNamedImport =
240
- source
241
- .find(j.ImportDeclaration)
242
- .filter((path) => path.node.source.value === packagePath)
243
- .find(j.ImportSpecifier)
244
- .find(j.Identifier).length === 0;
245
-
246
- if (isEmptyNamedImport) {
247
- const isEmptyDefaultImport =
248
- source
249
- .find(j.ImportDeclaration)
250
- .filter((path) => path.node.source.value === packagePath)
251
- .find(j.ImportDefaultSpecifier)
252
- .find(j.Identifier).length === 0;
253
-
254
- isEmptyDefaultImport
255
- ? source
256
- .find(j.ImportDeclaration)
257
- .filter((path) => path.node.source.value === packagePath)
258
- .remove()
259
- : source
260
- .find(j.ImportDeclaration)
261
- .filter((path) => path.node.source.value === packagePath)
262
- .find(j.ImportSpecifier)
263
- .remove();
264
- }
265
- };
266
-
267
- export const createRenameJSXFunc =
268
- (packagePath: string, from: string, to: string, fallback: string | undefined = undefined) =>
269
- (j: core.JSCodeshift, source: any) => {
270
- const namedSpecifier = getNamedSpecifier(j, source, packagePath, from);
271
-
272
- const toName = fallback
273
- ? getSafeImportName({
274
- j,
275
- base: source,
276
- currentDefaultSpecifierName: namedSpecifier,
277
- desiredName: to,
278
- fallbackName: fallback,
279
- })
280
- : to;
281
-
282
- const existingAlias: Nullable<string> =
283
- source
284
- .find(j.ImportDeclaration)
285
- .filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === packagePath)
286
- .find(j.ImportSpecifier)
287
- .nodes()
288
- .map((specifier: ImportSpecifier): Nullable<string> => {
289
- if (from !== specifier.imported.name) {
290
- return null;
291
- }
292
- // If aliased: return the alias
293
- if (specifier.local && from !== specifier.local.name) {
294
- return specifier.local.name;
295
- }
296
-
297
- return null;
298
- })
299
- .filter(Boolean)[0] || null;
300
-
301
- source
302
- .find(j.ImportDeclaration)
303
- .filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === packagePath)
304
- .find(j.ImportSpecifier)
305
- .filter((importSpecifier: ImportSpecifier) => {
306
- const identifier = j(importSpecifier).find(j.Identifier).get();
307
- if (from === identifier.value.name || existingAlias === identifier.value.name) {
308
- return true;
309
- }
310
- return false;
311
- })
312
- .replaceWith(
313
- [
314
- j.importSpecifier(
315
- j.identifier(toName),
316
- existingAlias ? j.identifier(existingAlias) : null,
317
- ),
318
- ],
319
- j.literal(packagePath),
320
- );
321
- };
322
-
323
- export const createTransformer =
324
- (component: string, migrates: { (j: core.JSCodeshift, source: Collection<Node>): void }[]) =>
325
- (fileInfo: FileInfo, { jscodeshift: j }: API, options: Options) => {
326
- const source: Collection<Node> = j(fileInfo.source);
327
-
328
- if (!hasImportDeclaration(j, source, component)) {
329
- return fileInfo.source;
330
- }
331
-
332
- migrates.forEach((tf) => tf(j, source));
333
-
334
- return source.toSource(options.printOptions || { quote: 'single' });
335
- };