@instructure/ui-buttons 8.11.2-snapshot.15 → 8.11.2-snapshot.23

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.
Files changed (6) hide show
  1. package/es/BaseButton/index.js +7 -5
  2. package/lib/BaseButton/index.js +7 -5
  3. package/package.json +21 -21
  4. package/src/BaseButton/index.tsx +10 -6
  5. package/types/BaseButton/index.d.ts +1 -1
  6. package/types/BaseButton/index.d.ts.map +1 -1
package/es/BaseButton/index.js CHANGED
@@ -48,12 +48,10 @@ category: components/utilities
48
48
  let BaseButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_temp = _class2 = class BaseButton extends Component {
49
49
  constructor(...args) {
50
50
  super(...args);
51
- this._rootElement = null;
52
51
  this.ref = null;
53
52
 
54
53
  this.handleElementRef = el => {
55
54
  const elementRef = this.props.elementRef;
56
- this._rootElement = el;
57
55
  this.ref = el;
58
56
 
59
57
  if (typeof elementRef === 'function') {
@@ -97,7 +95,7 @@ let BaseButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec
97
95
  }
98
96
 
99
97
  if (href) {
100
- this._rootElement && this._rootElement.click();
98
+ this.ref && this.ref.click();
101
99
  }
102
100
  }
103
101
  };
@@ -111,6 +109,10 @@ let BaseButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec
111
109
  this.props.makeStyles(this.makeStylesVariables);
112
110
  }
113
111
 
112
+ get _rootElement() {
113
+ return this.ref;
114
+ }
115
+
114
116
  get makeStylesVariables() {
115
117
  return {
116
118
  isDisabled: this.isDisabled,
@@ -169,11 +171,11 @@ let BaseButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec
169
171
  }
170
172
 
171
173
  get focused() {
172
- return isActiveElement(this._rootElement);
174
+ return isActiveElement(this.ref);
173
175
  }
174
176
 
175
177
  focus() {
176
- this._rootElement && this._rootElement.focus();
178
+ this.ref && this.ref.focus();
177
179
  }
178
180
 
179
181
  renderChildren() {
package/lib/BaseButton/index.js CHANGED
@@ -49,12 +49,10 @@ category: components/utilities
49
49
  let BaseButton = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_temp = _class2 = class BaseButton extends _react.Component {
50
50
  constructor(...args) {
51
51
  super(...args);
52
- this._rootElement = null;
53
52
  this.ref = null;
54
53
 
55
54
  this.handleElementRef = el => {
56
55
  const elementRef = this.props.elementRef;
57
- this._rootElement = el;
58
56
  this.ref = el;
59
57
 
60
58
  if (typeof elementRef === 'function') {
@@ -98,7 +96,7 @@ let BaseButton = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default
98
96
  }
99
97
 
100
98
  if (href) {
101
- this._rootElement && this._rootElement.click();
99
+ this.ref && this.ref.click();
102
100
  }
103
101
  }
104
102
  };
@@ -112,6 +110,10 @@ let BaseButton = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default
112
110
  this.props.makeStyles(this.makeStylesVariables);
113
111
  }
114
112
 
113
+ get _rootElement() {
114
+ return this.ref;
115
+ }
116
+
115
117
  get makeStylesVariables() {
116
118
  return {
117
119
  isDisabled: this.isDisabled,
@@ -170,11 +172,11 @@ let BaseButton = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default
170
172
  }
171
173
 
172
174
  get focused() {
173
- return (0, _isActiveElement.isActiveElement)(this._rootElement);
175
+ return (0, _isActiveElement.isActiveElement)(this.ref);
174
176
  }
175
177
 
176
178
  focus() {
177
- this._rootElement && this._rootElement.focus();
179
+ this.ref && this.ref.focus();
178
180
  }
179
181
 
180
182
  renderChildren() {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-buttons",
3
- "version": "8.11.2-snapshot.15+4f855a7cf",
3
+ "version": "8.11.2-snapshot.23+0d8081052",
4
4
  "description": "Accessible button components",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "type": "commonjs",
@@ -24,28 +24,28 @@
24
24
  },
25
25
  "license": "MIT",
26
26
  "devDependencies": {
27
- "@instructure/ui-babel-preset": "8.11.2-snapshot.15+4f855a7cf",
28
- "@instructure/ui-test-locator": "8.11.2-snapshot.15+4f855a7cf",
29
- "@instructure/ui-test-queries": "8.11.2-snapshot.15+4f855a7cf",
30
- "@instructure/ui-test-utils": "8.11.2-snapshot.15+4f855a7cf",
31
- "@instructure/ui-themes": "8.11.2-snapshot.15+4f855a7cf"
27
+ "@instructure/ui-babel-preset": "8.11.2-snapshot.23+0d8081052",
28
+ "@instructure/ui-test-locator": "8.11.2-snapshot.23+0d8081052",
29
+ "@instructure/ui-test-queries": "8.11.2-snapshot.23+0d8081052",
30
+ "@instructure/ui-test-utils": "8.11.2-snapshot.23+0d8081052",
31
+ "@instructure/ui-themes": "8.11.2-snapshot.23+0d8081052"
32
32
  },
33
33
  "dependencies": {
34
34
  "@babel/runtime": "^7.13.10",
35
- "@instructure/console": "8.11.2-snapshot.15+4f855a7cf",
36
- "@instructure/emotion": "8.11.2-snapshot.15+4f855a7cf",
37
- "@instructure/shared-types": "8.11.2-snapshot.15+4f855a7cf",
38
- "@instructure/ui-a11y-content": "8.11.2-snapshot.15+4f855a7cf",
39
- "@instructure/ui-a11y-utils": "8.11.2-snapshot.15+4f855a7cf",
40
- "@instructure/ui-color-utils": "8.11.2-snapshot.15+4f855a7cf",
41
- "@instructure/ui-dom-utils": "8.11.2-snapshot.15+4f855a7cf",
42
- "@instructure/ui-icons": "8.11.2-snapshot.15+4f855a7cf",
43
- "@instructure/ui-position": "8.11.2-snapshot.15+4f855a7cf",
44
- "@instructure/ui-react-utils": "8.11.2-snapshot.15+4f855a7cf",
45
- "@instructure/ui-testable": "8.11.2-snapshot.15+4f855a7cf",
46
- "@instructure/ui-tooltip": "8.11.2-snapshot.15+4f855a7cf",
47
- "@instructure/ui-utils": "8.11.2-snapshot.15+4f855a7cf",
48
- "@instructure/ui-view": "8.11.2-snapshot.15+4f855a7cf",
35
+ "@instructure/console": "8.11.2-snapshot.23+0d8081052",
36
+ "@instructure/emotion": "8.11.2-snapshot.23+0d8081052",
37
+ "@instructure/shared-types": "8.11.2-snapshot.23+0d8081052",
38
+ "@instructure/ui-a11y-content": "8.11.2-snapshot.23+0d8081052",
39
+ "@instructure/ui-a11y-utils": "8.11.2-snapshot.23+0d8081052",
40
+ "@instructure/ui-color-utils": "8.11.2-snapshot.23+0d8081052",
41
+ "@instructure/ui-dom-utils": "8.11.2-snapshot.23+0d8081052",
42
+ "@instructure/ui-icons": "8.11.2-snapshot.23+0d8081052",
43
+ "@instructure/ui-position": "8.11.2-snapshot.23+0d8081052",
44
+ "@instructure/ui-react-utils": "8.11.2-snapshot.23+0d8081052",
45
+ "@instructure/ui-testable": "8.11.2-snapshot.23+0d8081052",
46
+ "@instructure/ui-tooltip": "8.11.2-snapshot.23+0d8081052",
47
+ "@instructure/ui-utils": "8.11.2-snapshot.23+0d8081052",
48
+ "@instructure/ui-view": "8.11.2-snapshot.23+0d8081052",
49
49
  "keycode": "^2",
50
50
  "prop-types": "^15"
51
51
  },
@@ -56,5 +56,5 @@
56
56
  "access": "public"
57
57
  },
58
58
  "sideEffects": false,
59
- "gitHead": "4f855a7cfb0f347bca6a71b18be9504447ba768f"
59
+ "gitHead": "0d8081052d9986085a7d0c62ee9ac41a1dcf8608"
60
60
  }
package/src/BaseButton/index.tsx CHANGED
@@ -79,8 +79,6 @@ class BaseButton extends Component<BaseButtonProps> {
79
79
  onKeyDown: (event) => {}
80
80
  } as const
81
81
 
82
- _rootElement: Element | null = null
83
-
84
82
  ref: Element | null = null
85
83
 
86
84
  componentDidMount() {
@@ -93,6 +91,13 @@ class BaseButton extends Component<BaseButtonProps> {
93
91
  // @ts-expect-error ts-migrate(2722) FIXME: Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
94
92
  this.props.makeStyles(this.makeStylesVariables)
95
93
  }
94
+ get _rootElement() {
95
+ console.warn(
96
+ '_rootElement property is deprecated and will be removed in v9, please use ref instead'
97
+ )
98
+
99
+ return this.ref
100
+ }
96
101
 
97
102
  get makeStylesVariables(): BaseButtonStyleProps {
98
103
  return {
@@ -147,18 +152,17 @@ class BaseButton extends Component<BaseButtonProps> {
147
152
  }
148
153
 
149
154
  get focused() {
150
- return isActiveElement(this._rootElement)
155
+ return isActiveElement(this.ref)
151
156
  }
152
157
 
153
158
  focus() {
154
159
  // @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
155
- this._rootElement && this._rootElement.focus()
160
+ this.ref && this.ref.focus()
156
161
  }
157
162
 
158
163
  handleElementRef = (el: Element | null) => {
159
164
  const { elementRef } = this.props
160
165
 
161
- this._rootElement = el
162
166
  this.ref = el
163
167
 
164
168
  if (typeof elementRef === 'function') {
@@ -206,7 +210,7 @@ class BaseButton extends Component<BaseButtonProps> {
206
210
 
207
211
  if (href) {
208
212
  // @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
209
- this._rootElement && this._rootElement.click()
213
+ this.ref && this.ref.click()
210
214
  }
211
215
  }
212
216
  }
package/types/BaseButton/index.d.ts CHANGED
@@ -72,10 +72,10 @@ declare class BaseButton extends Component<BaseButtonProps> {
72
72
  readonly cursor: "pointer";
73
73
  readonly onKeyDown: (event: any) => void;
74
74
  };
75
- _rootElement: Element | null;
76
75
  ref: Element | null;
77
76
  componentDidMount(): void;
78
77
  componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
78
+ get _rootElement(): Element | null;
79
79
  get makeStylesVariables(): BaseButtonStyleProps;
80
80
  get hasOnlyIconVisible(): boolean;
81
81
  get elementType(): import("@instructure/shared-types/types/CommonProps").AsElementType;
package/types/BaseButton/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/BaseButton/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAcjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEpE;;;;GAIG;AAEH,cAEM,UAAW,SAAQ,SAAS,CAAC,eAAe,CAAC;IACjD,MAAM,CAAC,QAAQ,CAAC,WAAW,gBAAe;IAE1C,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;MAmBT;IAEV,YAAY,EAAE,OAAO,GAAG,IAAI,CAAO;IAEnC,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,mBAAmB,IAAI,oBAAoB,CAK9C;IAED,IAAI,kBAAkB,YAGrB;IAED,IAAI,WAAW,wEAEd;IAED,IAAI,WAAW,0DAEd;IAED,IAAI,UAAU,YAEb;IAED,IAAI,UAAU,YAEb;IAED,IAAI,SAAS,YAEZ;IAED,IAAI,UAAU,uBAkBb;IAED,IAAI,OAAO,YAEV;IAED,KAAK;IAKL,gBAAgB,OAAQ,OAAO,GAAG,IAAI,UASrC;IAGD,WAAW,uBAaV;IAGD,aAAa,uBA0BZ;IAED,cAAc;IAgCd,MAAM;CAwDP;AAED,OAAO,EAAE,UAAU,EAAE,CAAA;AACrB,eAAe,UAAU,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/BaseButton/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAcjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEpE;;;;GAIG;AAEH,cAEM,UAAW,SAAQ,SAAS,CAAC,eAAe,CAAC;IACjD,MAAM,CAAC,QAAQ,CAAC,WAAW,gBAAe;IAE1C,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;MAmBT;IAEV,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAIjD,IAAI,YAAY,mBAMf;IAED,IAAI,mBAAmB,IAAI,oBAAoB,CAK9C;IAED,IAAI,kBAAkB,YAGrB;IAED,IAAI,WAAW,wEAEd;IAED,IAAI,WAAW,0DAEd;IAED,IAAI,UAAU,YAEb;IAED,IAAI,UAAU,YAEb;IAED,IAAI,SAAS,YAEZ;IAED,IAAI,UAAU,uBAkBb;IAED,IAAI,OAAO,YAEV;IAED,KAAK;IAKL,gBAAgB,OAAQ,OAAO,GAAG,IAAI,UAQrC;IAGD,WAAW,uBAaV;IAGD,aAAa,uBA0BZ;IAED,cAAc;IAgCd,MAAM;CAwDP;AAED,OAAO,EAAE,UAAU,EAAE,CAAA;AACrB,eAAe,UAAU,CAAA"}