@instructure/ui-form-field 8.10.3-snapshot.4 → 8.11.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 +8 -0
- package/es/FormField/index.js +5 -3
- package/es/FormField/props.js +4 -0
- package/es/FormFieldGroup/index.js +9 -7
- package/es/FormFieldGroup/props.js +4 -0
- package/es/FormFieldLayout/index.js +10 -8
- package/es/FormFieldLayout/props.js +4 -0
- package/lib/FormField/index.js +5 -3
- package/lib/FormField/props.js +4 -0
- package/lib/FormFieldGroup/index.js +9 -7
- package/lib/FormFieldGroup/props.js +4 -0
- package/lib/FormFieldLayout/index.js +10 -8
- package/lib/FormFieldLayout/props.js +4 -0
- package/package.json +15 -16
- package/src/FormField/index.tsx +6 -1
- package/src/FormField/props.ts +8 -2
- package/src/FormFieldGroup/index.tsx +6 -1
- package/src/FormFieldGroup/props.ts +7 -2
- package/src/FormFieldLabel/props.ts +4 -2
- package/src/FormFieldLayout/index.tsx +7 -2
- package/src/FormFieldLayout/props.ts +10 -2
- package/src/FormFieldMessages/props.ts +4 -2
- package/types/FormField/index.d.ts +2 -2
- package/types/FormField/index.d.ts.map +1 -1
- package/types/FormField/props.d.ts +2 -2
- package/types/FormField/props.d.ts.map +1 -1
- package/types/FormFieldGroup/index.d.ts.map +1 -1
- package/types/FormFieldGroup/props.d.ts +2 -2
- package/types/FormFieldGroup/props.d.ts.map +1 -1
- package/types/FormFieldLabel/props.d.ts +2 -2
- package/types/FormFieldLabel/props.d.ts.map +1 -1
- package/types/FormFieldLayout/index.d.ts +2 -2
- package/types/FormFieldLayout/index.d.ts.map +1 -1
- package/types/FormFieldLayout/props.d.ts +2 -2
- package/types/FormFieldLayout/props.d.ts.map +1 -1
- package/types/FormFieldMessages/props.d.ts +2 -2
- package/types/FormFieldMessages/props.d.ts.map +1 -1
- package/LICENSE.md +0 -27
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [8.11.1](https://github.com/instructure/instructure-ui/compare/v8.11.0...v8.11.1) (2021-10-19)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @instructure/ui-form-field
|
|
9
|
+
|
|
10
|
+
# [8.11.0](https://github.com/instructure/instructure-ui/compare/v8.10.2...v8.11.0) (2021-10-15)
|
|
11
|
+
|
|
12
|
+
**Note:** Version bump only for package @instructure/ui-form-field
|
|
13
|
+
|
|
6
14
|
## [8.10.2](https://github.com/instructure/instructure-ui/compare/v8.10.1...v8.10.2) (2021-10-01)
|
|
7
15
|
|
|
8
16
|
**Note:** Version bump only for package @instructure/ui-form-field
|
package/es/FormField/index.js
CHANGED
|
@@ -37,10 +37,12 @@ class FormField extends Component {
|
|
|
37
37
|
this.ref = null;
|
|
38
38
|
|
|
39
39
|
this.handleRef = el => {
|
|
40
|
-
|
|
41
|
-
|
|
40
|
+
const elementRef = this.props.elementRef;
|
|
42
41
|
this.ref = el;
|
|
43
|
-
|
|
42
|
+
|
|
43
|
+
if (typeof elementRef === 'function') {
|
|
44
|
+
elementRef(el);
|
|
45
|
+
}
|
|
44
46
|
};
|
|
45
47
|
}
|
|
46
48
|
|
package/es/FormField/props.js
CHANGED
|
@@ -46,6 +46,10 @@ const propTypes = {
|
|
|
46
46
|
vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
|
|
47
47
|
width: PropTypes.string,
|
|
48
48
|
inputContainerRef: PropTypes.func,
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* provides a reference to the underlying html root element
|
|
52
|
+
*/
|
|
49
53
|
elementRef: PropTypes.func
|
|
50
54
|
};
|
|
51
55
|
const allowedProps = ['label', 'id', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'vAlign', 'width', 'inputContainerRef', 'elementRef'];
|
|
@@ -48,10 +48,12 @@ let FormFieldGroup = (_dec = withStyle(generateStyle, generateComponentTheme), _
|
|
|
48
48
|
this.ref = null;
|
|
49
49
|
|
|
50
50
|
this.handleRef = el => {
|
|
51
|
-
|
|
52
|
-
|
|
51
|
+
const elementRef = this.props.elementRef;
|
|
53
52
|
this.ref = el;
|
|
54
|
-
|
|
53
|
+
|
|
54
|
+
if (typeof elementRef === 'function') {
|
|
55
|
+
elementRef(el);
|
|
56
|
+
}
|
|
55
57
|
};
|
|
56
58
|
}
|
|
57
59
|
|
|
@@ -102,10 +104,10 @@ let FormFieldGroup = (_dec = withStyle(generateStyle, generateComponentTheme), _
|
|
|
102
104
|
}
|
|
103
105
|
|
|
104
106
|
render() {
|
|
105
|
-
const _this$
|
|
106
|
-
styles = _this$
|
|
107
|
-
makeStyles = _this$
|
|
108
|
-
props = _objectWithoutProperties(_this$
|
|
107
|
+
const _this$props = this.props,
|
|
108
|
+
styles = _this$props.styles,
|
|
109
|
+
makeStyles = _this$props.makeStyles,
|
|
110
|
+
props = _objectWithoutProperties(_this$props, _excluded);
|
|
109
111
|
|
|
110
112
|
return jsx(FormFieldLayout, Object.assign({}, omitProps(props, FormFieldGroup.allowedProps), pickProps(props, FormFieldLayout.allowedProps), {
|
|
111
113
|
vAlign: props.vAlign,
|
|
@@ -50,6 +50,10 @@ const propTypes = {
|
|
|
50
50
|
colSpacing: PropTypes.oneOf(['none', 'small', 'medium', 'large']),
|
|
51
51
|
vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
|
|
52
52
|
startAt: PropTypes.oneOf(['small', 'medium', 'large', 'x-large', null]),
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* provides a reference to the underlying html root element
|
|
56
|
+
*/
|
|
53
57
|
elementRef: PropTypes.func
|
|
54
58
|
};
|
|
55
59
|
const allowedProps = ['description', 'as', 'messages', 'messagesId', 'disabled', 'children', 'layout', 'rowSpacing', 'colSpacing', 'vAlign', 'startAt', 'elementRef'];
|
|
@@ -52,10 +52,12 @@ let FormFieldLayout = (_dec = withStyle(generateStyle, null), _dec(_class = (_te
|
|
|
52
52
|
this.ref = null;
|
|
53
53
|
|
|
54
54
|
this.handleRef = el => {
|
|
55
|
-
|
|
56
|
-
|
|
55
|
+
const elementRef = this.props.elementRef;
|
|
57
56
|
this.ref = el;
|
|
58
|
-
|
|
57
|
+
|
|
58
|
+
if (typeof elementRef === 'function') {
|
|
59
|
+
elementRef(el);
|
|
60
|
+
}
|
|
59
61
|
};
|
|
60
62
|
|
|
61
63
|
this.handleInputContainerRef = node => {
|
|
@@ -100,7 +102,7 @@ let FormFieldLayout = (_dec = withStyle(generateStyle, null), _dec(_class = (_te
|
|
|
100
102
|
textAlign: this.props.labelAlign,
|
|
101
103
|
width: this.inlineContainerAndLabel ? 'auto' : 3
|
|
102
104
|
}, jsx(FormFieldLabel, {
|
|
103
|
-
"aria-hidden": this.elementType === 'fieldset' ? 'true' :
|
|
105
|
+
"aria-hidden": this.elementType === 'fieldset' ? 'true' : void 0
|
|
104
106
|
}, this.props.label));
|
|
105
107
|
} else if (this.elementType !== 'fieldset') {
|
|
106
108
|
// to avoid duplicate label/legend content
|
|
@@ -133,10 +135,10 @@ let FormFieldLayout = (_dec = withStyle(generateStyle, null), _dec(_class = (_te
|
|
|
133
135
|
render() {
|
|
134
136
|
const ElementType = this.elementType;
|
|
135
137
|
|
|
136
|
-
const _this$
|
|
137
|
-
makeStyles = _this$
|
|
138
|
-
styles = _this$
|
|
139
|
-
props = _objectWithoutProperties(_this$
|
|
138
|
+
const _this$props = this.props,
|
|
139
|
+
makeStyles = _this$props.makeStyles,
|
|
140
|
+
styles = _this$props.styles,
|
|
141
|
+
props = _objectWithoutProperties(_this$props, _excluded);
|
|
140
142
|
|
|
141
143
|
const width = props.width,
|
|
142
144
|
layout = props.layout,
|
|
@@ -54,6 +54,10 @@ const propTypes = {
|
|
|
54
54
|
labelAlign: PropTypes.oneOf(['start', 'end']),
|
|
55
55
|
width: PropTypes.string,
|
|
56
56
|
inputContainerRef: PropTypes.func,
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* provides a reference to the underlying html root element
|
|
60
|
+
*/
|
|
57
61
|
elementRef: PropTypes.func
|
|
58
62
|
};
|
|
59
63
|
const allowedProps = ['label', 'id', 'as', 'messages', 'messagesId', 'children', 'inline', 'layout', 'labelAlign', 'width', 'inputContainerRef', 'elementRef'];
|
package/lib/FormField/index.js
CHANGED
|
@@ -52,10 +52,12 @@ class FormField extends _react.Component {
|
|
|
52
52
|
this.ref = null;
|
|
53
53
|
|
|
54
54
|
this.handleRef = el => {
|
|
55
|
-
|
|
56
|
-
|
|
55
|
+
const elementRef = this.props.elementRef;
|
|
57
56
|
this.ref = el;
|
|
58
|
-
|
|
57
|
+
|
|
58
|
+
if (typeof elementRef === 'function') {
|
|
59
|
+
elementRef(el);
|
|
60
|
+
}
|
|
59
61
|
};
|
|
60
62
|
}
|
|
61
63
|
|
package/lib/FormField/props.js
CHANGED
|
@@ -57,6 +57,10 @@ const propTypes = {
|
|
|
57
57
|
vAlign: _propTypes.default.oneOf(['top', 'middle', 'bottom']),
|
|
58
58
|
width: _propTypes.default.string,
|
|
59
59
|
inputContainerRef: _propTypes.default.func,
|
|
60
|
+
|
|
61
|
+
/**
|
|
62
|
+
* provides a reference to the underlying html root element
|
|
63
|
+
*/
|
|
60
64
|
elementRef: _propTypes.default.func
|
|
61
65
|
};
|
|
62
66
|
exports.propTypes = propTypes;
|
|
@@ -42,10 +42,12 @@ let FormFieldGroup = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.def
|
|
|
42
42
|
this.ref = null;
|
|
43
43
|
|
|
44
44
|
this.handleRef = el => {
|
|
45
|
-
|
|
46
|
-
|
|
45
|
+
const elementRef = this.props.elementRef;
|
|
47
46
|
this.ref = el;
|
|
48
|
-
|
|
47
|
+
|
|
48
|
+
if (typeof elementRef === 'function') {
|
|
49
|
+
elementRef(el);
|
|
50
|
+
}
|
|
49
51
|
};
|
|
50
52
|
}
|
|
51
53
|
|
|
@@ -96,10 +98,10 @@ let FormFieldGroup = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.def
|
|
|
96
98
|
}
|
|
97
99
|
|
|
98
100
|
render() {
|
|
99
|
-
const _this$
|
|
100
|
-
styles = _this$
|
|
101
|
-
makeStyles = _this$
|
|
102
|
-
props = (0, _objectWithoutProperties2.default)(_this$
|
|
101
|
+
const _this$props = this.props,
|
|
102
|
+
styles = _this$props.styles,
|
|
103
|
+
makeStyles = _this$props.makeStyles,
|
|
104
|
+
props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
|
|
103
105
|
return (0, _emotion.jsx)(_FormFieldLayout.FormFieldLayout, Object.assign({}, (0, _omitProps.omitProps)(props, FormFieldGroup.allowedProps), (0, _pickProps.pickProps)(props, _FormFieldLayout.FormFieldLayout.allowedProps), {
|
|
104
106
|
vAlign: props.vAlign,
|
|
105
107
|
layout: props.layout === 'inline' ? 'inline' : 'stacked',
|
|
@@ -61,6 +61,10 @@ const propTypes = {
|
|
|
61
61
|
colSpacing: _propTypes.default.oneOf(['none', 'small', 'medium', 'large']),
|
|
62
62
|
vAlign: _propTypes.default.oneOf(['top', 'middle', 'bottom']),
|
|
63
63
|
startAt: _propTypes.default.oneOf(['small', 'medium', 'large', 'x-large', null]),
|
|
64
|
+
|
|
65
|
+
/**
|
|
66
|
+
* provides a reference to the underlying html root element
|
|
67
|
+
*/
|
|
64
68
|
elementRef: _propTypes.default.func
|
|
65
69
|
};
|
|
66
70
|
exports.propTypes = propTypes;
|
|
@@ -52,10 +52,12 @@ let FormFieldLayout = (_dec = (0, _emotion.withStyle)(_styles.default, null), _d
|
|
|
52
52
|
this.ref = null;
|
|
53
53
|
|
|
54
54
|
this.handleRef = el => {
|
|
55
|
-
|
|
56
|
-
|
|
55
|
+
const elementRef = this.props.elementRef;
|
|
57
56
|
this.ref = el;
|
|
58
|
-
|
|
57
|
+
|
|
58
|
+
if (typeof elementRef === 'function') {
|
|
59
|
+
elementRef(el);
|
|
60
|
+
}
|
|
59
61
|
};
|
|
60
62
|
|
|
61
63
|
this.handleInputContainerRef = node => {
|
|
@@ -100,7 +102,7 @@ let FormFieldLayout = (_dec = (0, _emotion.withStyle)(_styles.default, null), _d
|
|
|
100
102
|
textAlign: this.props.labelAlign,
|
|
101
103
|
width: this.inlineContainerAndLabel ? 'auto' : 3
|
|
102
104
|
}, (0, _emotion.jsx)(_FormFieldLabel.FormFieldLabel, {
|
|
103
|
-
"aria-hidden": this.elementType === 'fieldset' ? 'true' :
|
|
105
|
+
"aria-hidden": this.elementType === 'fieldset' ? 'true' : void 0
|
|
104
106
|
}, this.props.label));
|
|
105
107
|
} else if (this.elementType !== 'fieldset') {
|
|
106
108
|
// to avoid duplicate label/legend content
|
|
@@ -132,10 +134,10 @@ let FormFieldLayout = (_dec = (0, _emotion.withStyle)(_styles.default, null), _d
|
|
|
132
134
|
|
|
133
135
|
render() {
|
|
134
136
|
const ElementType = this.elementType;
|
|
135
|
-
const _this$
|
|
136
|
-
makeStyles = _this$
|
|
137
|
-
styles = _this$
|
|
138
|
-
props = (0, _objectWithoutProperties2.default)(_this$
|
|
137
|
+
const _this$props = this.props,
|
|
138
|
+
makeStyles = _this$props.makeStyles,
|
|
139
|
+
styles = _this$props.styles,
|
|
140
|
+
props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
|
|
139
141
|
const width = props.width,
|
|
140
142
|
layout = props.layout,
|
|
141
143
|
children = props.children;
|
|
@@ -65,6 +65,10 @@ const propTypes = {
|
|
|
65
65
|
labelAlign: _propTypes.default.oneOf(['start', 'end']),
|
|
66
66
|
width: _propTypes.default.string,
|
|
67
67
|
inputContainerRef: _propTypes.default.func,
|
|
68
|
+
|
|
69
|
+
/**
|
|
70
|
+
* provides a reference to the underlying html root element
|
|
71
|
+
*/
|
|
68
72
|
elementRef: _propTypes.default.func
|
|
69
73
|
};
|
|
70
74
|
exports.propTypes = propTypes;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@instructure/ui-form-field",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.11.1",
|
|
4
4
|
"description": "Form layout components.",
|
|
5
5
|
"author": "Instructure, Inc. Engineering and Product Design",
|
|
6
6
|
"type": "commonjs",
|
|
@@ -24,22 +24,22 @@
|
|
|
24
24
|
},
|
|
25
25
|
"license": "MIT",
|
|
26
26
|
"devDependencies": {
|
|
27
|
-
"@instructure/ui-babel-preset": "8.
|
|
28
|
-
"@instructure/ui-test-utils": "8.
|
|
29
|
-
"@instructure/ui-themes": "8.
|
|
27
|
+
"@instructure/ui-babel-preset": "8.11.1",
|
|
28
|
+
"@instructure/ui-test-utils": "8.11.1",
|
|
29
|
+
"@instructure/ui-themes": "8.11.1"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
32
|
"@babel/runtime": "^7.13.10",
|
|
33
|
-
"@instructure/console": "8.
|
|
34
|
-
"@instructure/emotion": "8.
|
|
35
|
-
"@instructure/shared-types": "8.
|
|
36
|
-
"@instructure/ui-a11y-content": "8.
|
|
37
|
-
"@instructure/ui-a11y-utils": "8.
|
|
38
|
-
"@instructure/ui-grid": "8.
|
|
39
|
-
"@instructure/ui-icons": "8.
|
|
40
|
-
"@instructure/ui-react-utils": "8.
|
|
41
|
-
"@instructure/ui-utils": "8.
|
|
42
|
-
"@instructure/uid": "8.
|
|
33
|
+
"@instructure/console": "8.11.1",
|
|
34
|
+
"@instructure/emotion": "8.11.1",
|
|
35
|
+
"@instructure/shared-types": "8.11.1",
|
|
36
|
+
"@instructure/ui-a11y-content": "8.11.1",
|
|
37
|
+
"@instructure/ui-a11y-utils": "8.11.1",
|
|
38
|
+
"@instructure/ui-grid": "8.11.1",
|
|
39
|
+
"@instructure/ui-icons": "8.11.1",
|
|
40
|
+
"@instructure/ui-react-utils": "8.11.1",
|
|
41
|
+
"@instructure/ui-utils": "8.11.1",
|
|
42
|
+
"@instructure/uid": "8.11.1",
|
|
43
43
|
"prop-types": "^15"
|
|
44
44
|
},
|
|
45
45
|
"peerDependencies": {
|
|
@@ -47,6 +47,5 @@
|
|
|
47
47
|
},
|
|
48
48
|
"publishConfig": {
|
|
49
49
|
"access": "public"
|
|
50
|
-
}
|
|
51
|
-
"gitHead": "118e47643bbadaf5beac7f8ffb047b29eb0618d1"
|
|
50
|
+
}
|
|
52
51
|
}
|
package/src/FormField/index.tsx
CHANGED
|
@@ -52,8 +52,13 @@ class FormField extends Component<FormFieldProps> {
|
|
|
52
52
|
ref: Element | null = null
|
|
53
53
|
|
|
54
54
|
handleRef = (el: Element | null) => {
|
|
55
|
+
const { elementRef } = this.props
|
|
56
|
+
|
|
55
57
|
this.ref = el
|
|
56
|
-
|
|
58
|
+
|
|
59
|
+
if (typeof elementRef === 'function') {
|
|
60
|
+
elementRef(el)
|
|
61
|
+
}
|
|
57
62
|
}
|
|
58
63
|
|
|
59
64
|
render() {
|
package/src/FormField/props.ts
CHANGED
|
@@ -27,7 +27,10 @@ import PropTypes from 'prop-types'
|
|
|
27
27
|
|
|
28
28
|
import { FormPropTypes } from '../FormPropTypes'
|
|
29
29
|
|
|
30
|
-
import type {
|
|
30
|
+
import type {
|
|
31
|
+
OtherHTMLAttributes,
|
|
32
|
+
PropValidators
|
|
33
|
+
} from '@instructure/shared-types'
|
|
31
34
|
import type { FormMessage } from '../FormPropTypes'
|
|
32
35
|
|
|
33
36
|
type FormFieldOwnProps = {
|
|
@@ -49,7 +52,7 @@ type PropKeys = keyof FormFieldOwnProps
|
|
|
49
52
|
|
|
50
53
|
type AllowedPropKeys = Readonly<Array<PropKeys>>
|
|
51
54
|
|
|
52
|
-
type FormFieldProps = FormFieldOwnProps
|
|
55
|
+
type FormFieldProps = FormFieldOwnProps & OtherHTMLAttributes<FormFieldOwnProps>
|
|
53
56
|
|
|
54
57
|
const propTypes: PropValidators<PropKeys> = {
|
|
55
58
|
label: PropTypes.node.isRequired,
|
|
@@ -72,6 +75,9 @@ const propTypes: PropValidators<PropKeys> = {
|
|
|
72
75
|
vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
|
|
73
76
|
width: PropTypes.string,
|
|
74
77
|
inputContainerRef: PropTypes.func,
|
|
78
|
+
/**
|
|
79
|
+
* provides a reference to the underlying html root element
|
|
80
|
+
*/
|
|
75
81
|
elementRef: PropTypes.func
|
|
76
82
|
}
|
|
77
83
|
|
|
@@ -60,8 +60,13 @@ class FormFieldGroup extends Component<FormFieldGroupProps> {
|
|
|
60
60
|
ref: Element | null = null
|
|
61
61
|
|
|
62
62
|
handleRef = (el: Element | null) => {
|
|
63
|
+
const { elementRef } = this.props
|
|
64
|
+
|
|
63
65
|
this.ref = el
|
|
64
|
-
|
|
66
|
+
|
|
67
|
+
if (typeof elementRef === 'function') {
|
|
68
|
+
elementRef(el)
|
|
69
|
+
}
|
|
65
70
|
}
|
|
66
71
|
|
|
67
72
|
componentDidMount() {
|
|
@@ -29,7 +29,8 @@ import { FormPropTypes } from '../FormPropTypes'
|
|
|
29
29
|
import type {
|
|
30
30
|
AsElementType,
|
|
31
31
|
PropValidators,
|
|
32
|
-
FormFieldGroupTheme
|
|
32
|
+
FormFieldGroupTheme,
|
|
33
|
+
OtherHTMLAttributes
|
|
33
34
|
} from '@instructure/shared-types'
|
|
34
35
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
|
|
35
36
|
import type { FormMessage } from '../FormPropTypes'
|
|
@@ -58,7 +59,8 @@ type PropKeys = keyof FormFieldGroupOwnProps
|
|
|
58
59
|
type AllowedPropKeys = Readonly<Array<PropKeys>>
|
|
59
60
|
|
|
60
61
|
type FormFieldGroupProps = FormFieldGroupOwnProps &
|
|
61
|
-
WithStyleProps<FormFieldGroupTheme, FormFieldGroupStyle>
|
|
62
|
+
WithStyleProps<FormFieldGroupTheme, FormFieldGroupStyle> &
|
|
63
|
+
OtherHTMLAttributes<FormFieldGroupOwnProps>
|
|
62
64
|
|
|
63
65
|
type FormFieldGroupStyle = ComponentStyle<'formFieldGroup'>
|
|
64
66
|
|
|
@@ -86,6 +88,9 @@ const propTypes: PropValidators<PropKeys> = {
|
|
|
86
88
|
colSpacing: PropTypes.oneOf(['none', 'small', 'medium', 'large']),
|
|
87
89
|
vAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
|
|
88
90
|
startAt: PropTypes.oneOf(['small', 'medium', 'large', 'x-large', null]),
|
|
91
|
+
/**
|
|
92
|
+
* provides a reference to the underlying html root element
|
|
93
|
+
*/
|
|
89
94
|
elementRef: PropTypes.func
|
|
90
95
|
}
|
|
91
96
|
|
|
@@ -27,7 +27,8 @@ import PropTypes from 'prop-types'
|
|
|
27
27
|
import type {
|
|
28
28
|
AsElementType,
|
|
29
29
|
PropValidators,
|
|
30
|
-
FormFieldLabelTheme
|
|
30
|
+
FormFieldLabelTheme,
|
|
31
|
+
OtherHTMLAttributes
|
|
31
32
|
} from '@instructure/shared-types'
|
|
32
33
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
|
|
33
34
|
|
|
@@ -41,7 +42,8 @@ type PropKeys = keyof FormFieldLabelOwnProps
|
|
|
41
42
|
type AllowedPropKeys = Readonly<Array<PropKeys>>
|
|
42
43
|
|
|
43
44
|
type FormFieldLabelProps = FormFieldLabelOwnProps &
|
|
44
|
-
WithStyleProps<FormFieldLabelTheme, FormFieldLabelStyle>
|
|
45
|
+
WithStyleProps<FormFieldLabelTheme, FormFieldLabelStyle> &
|
|
46
|
+
OtherHTMLAttributes<FormFieldLabelOwnProps>
|
|
45
47
|
|
|
46
48
|
type FormFieldLabelStyle = ComponentStyle<'formFieldLabel'>
|
|
47
49
|
|
|
@@ -84,8 +84,13 @@ class FormFieldLayout extends Component<FormFieldLayoutProps> {
|
|
|
84
84
|
ref: Element | null = null
|
|
85
85
|
|
|
86
86
|
handleRef = (el: Element | null) => {
|
|
87
|
+
const { elementRef } = this.props
|
|
88
|
+
|
|
87
89
|
this.ref = el
|
|
88
|
-
|
|
90
|
+
|
|
91
|
+
if (typeof elementRef === 'function') {
|
|
92
|
+
elementRef(el)
|
|
93
|
+
}
|
|
89
94
|
}
|
|
90
95
|
|
|
91
96
|
componentDidMount() {
|
|
@@ -131,7 +136,7 @@ class FormFieldLayout extends Component<FormFieldLayoutProps> {
|
|
|
131
136
|
width={this.inlineContainerAndLabel ? 'auto' : 3}
|
|
132
137
|
>
|
|
133
138
|
<FormFieldLabel
|
|
134
|
-
aria-hidden={this.elementType === 'fieldset' ? 'true' :
|
|
139
|
+
aria-hidden={this.elementType === 'fieldset' ? 'true' : undefined}
|
|
135
140
|
>
|
|
136
141
|
{this.props.label}
|
|
137
142
|
</FormFieldLabel>
|
|
@@ -26,7 +26,11 @@ import PropTypes from 'prop-types'
|
|
|
26
26
|
|
|
27
27
|
import { FormPropTypes } from '../FormPropTypes'
|
|
28
28
|
|
|
29
|
-
import type {
|
|
29
|
+
import type {
|
|
30
|
+
AsElementType,
|
|
31
|
+
OtherHTMLAttributes,
|
|
32
|
+
PropValidators
|
|
33
|
+
} from '@instructure/shared-types'
|
|
30
34
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
|
|
31
35
|
import type { FormMessage } from '../FormPropTypes'
|
|
32
36
|
|
|
@@ -50,7 +54,8 @@ type PropKeys = keyof FormFieldLayoutOwnProps
|
|
|
50
54
|
type AllowedPropKeys = Readonly<Array<PropKeys>>
|
|
51
55
|
|
|
52
56
|
type FormFieldLayoutProps = FormFieldLayoutOwnProps &
|
|
53
|
-
WithStyleProps<null, FormFieldLayoutStyle>
|
|
57
|
+
WithStyleProps<null, FormFieldLayoutStyle> &
|
|
58
|
+
OtherHTMLAttributes<FormFieldLayoutOwnProps>
|
|
54
59
|
|
|
55
60
|
type FormFieldLayoutStyle = ComponentStyle<'formFieldLayout'>
|
|
56
61
|
|
|
@@ -81,6 +86,9 @@ const propTypes: PropValidators<PropKeys> = {
|
|
|
81
86
|
labelAlign: PropTypes.oneOf(['start', 'end']),
|
|
82
87
|
width: PropTypes.string,
|
|
83
88
|
inputContainerRef: PropTypes.func,
|
|
89
|
+
/**
|
|
90
|
+
* provides a reference to the underlying html root element
|
|
91
|
+
*/
|
|
84
92
|
elementRef: PropTypes.func
|
|
85
93
|
}
|
|
86
94
|
|
|
@@ -28,7 +28,8 @@ import { FormPropTypes } from '../FormPropTypes'
|
|
|
28
28
|
|
|
29
29
|
import type {
|
|
30
30
|
PropValidators,
|
|
31
|
-
FormFieldMessagesTheme
|
|
31
|
+
FormFieldMessagesTheme,
|
|
32
|
+
OtherHTMLAttributes
|
|
32
33
|
} from '@instructure/shared-types'
|
|
33
34
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
|
|
34
35
|
import type { FormMessage } from '../FormPropTypes'
|
|
@@ -42,7 +43,8 @@ type PropKeys = keyof FormFieldMessagesOwnProps
|
|
|
42
43
|
type AllowedPropKeys = Readonly<Array<PropKeys>>
|
|
43
44
|
|
|
44
45
|
type FormFieldMessagesProps = FormFieldMessagesOwnProps &
|
|
45
|
-
WithStyleProps<FormFieldMessagesTheme, FormFieldMessagesStyle>
|
|
46
|
+
WithStyleProps<FormFieldMessagesTheme, FormFieldMessagesStyle> &
|
|
47
|
+
OtherHTMLAttributes<FormFieldMessagesOwnProps>
|
|
46
48
|
|
|
47
49
|
type FormFieldMessagesStyle = ComponentStyle<'formFieldMessages' | 'message'>
|
|
48
50
|
|
|
@@ -15,7 +15,7 @@ declare class FormField extends Component<FormFieldProps> {
|
|
|
15
15
|
children?: React.ReactNode;
|
|
16
16
|
inline?: boolean | undefined;
|
|
17
17
|
layout?: "inline" | "stacked" | undefined;
|
|
18
|
-
labelAlign?: "
|
|
18
|
+
labelAlign?: "start" | "end" | undefined;
|
|
19
19
|
vAlign?: "middle" | "bottom" | "top" | undefined;
|
|
20
20
|
width?: string | undefined;
|
|
21
21
|
inputContainerRef?: ((...args: any[]) => any) | undefined;
|
|
@@ -29,7 +29,7 @@ declare class FormField extends Component<FormFieldProps> {
|
|
|
29
29
|
children?: React.ReactNode;
|
|
30
30
|
inline?: boolean | undefined;
|
|
31
31
|
layout?: "inline" | "stacked" | undefined;
|
|
32
|
-
labelAlign?: "
|
|
32
|
+
labelAlign?: "start" | "end" | undefined;
|
|
33
33
|
vAlign?: "middle" | "bottom" | "top" | undefined;
|
|
34
34
|
width?: string | undefined;
|
|
35
35
|
inputContainerRef?: ((...args: any[]) => any) | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormField/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOxC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;GAIG;AACH,cAAM,SAAU,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/C,MAAM,CAAC,QAAQ,CAAC,WAAW,eAAc;IAEzC,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;MAMlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormField/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOxC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C;;;;GAIG;AACH,cAAM,SAAU,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/C,MAAM,CAAC,QAAQ,CAAC,WAAW,eAAc;IAEzC,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;MAMlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAQ9B;IAED,MAAM;CAaP;AAED,eAAe,SAAS,CAAA;AACxB,OAAO,EAAE,SAAS,EAAE,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { PropValidators } from '@instructure/shared-types';
|
|
2
|
+
import type { OtherHTMLAttributes, PropValidators } from '@instructure/shared-types';
|
|
3
3
|
import type { FormMessage } from '../FormPropTypes';
|
|
4
4
|
declare type FormFieldOwnProps = {
|
|
5
5
|
label: React.ReactNode;
|
|
@@ -17,7 +17,7 @@ declare type FormFieldOwnProps = {
|
|
|
17
17
|
};
|
|
18
18
|
declare type PropKeys = keyof FormFieldOwnProps;
|
|
19
19
|
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
20
|
-
declare type FormFieldProps = FormFieldOwnProps
|
|
20
|
+
declare type FormFieldProps = FormFieldOwnProps & OtherHTMLAttributes<FormFieldOwnProps>;
|
|
21
21
|
declare const propTypes: PropValidators<PropKeys>;
|
|
22
22
|
declare const allowedProps: AllowedPropKeys;
|
|
23
23
|
export type { FormFieldProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormField/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormField/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EACV,mBAAmB,EACnB,cAAc,EACf,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,iBAAiB,GAAG;IACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC7B,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC5B,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iBAAiB,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IAC3C,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;CAC/C,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,iBAAiB,CAAA;AAEvC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,cAAc,GAAG,iBAAiB,GAAG,mBAAmB,CAAC,iBAAiB,CAAC,CAAA;AAEhF,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAyBvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAanB,CAAA;AAED,YAAY,EAAE,cAAc,EAAE,CAAA;AAC9B,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldGroup/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAA;AAI3C,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAE5E;;;;GAIG;AACH,cACM,cAAe,SAAQ,SAAS,CAAC,mBAAmB,CAAC;IACzD,MAAM,CAAC,QAAQ,CAAC,WAAW,oBAAmB;IAE9C,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;MAOlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldGroup/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAA;AAI3C,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAE5E;;;;GAIG;AACH,cACM,cAAe,SAAQ,SAAS,CAAC,mBAAmB,CAAC;IACzD,MAAM,CAAC,QAAQ,CAAC,WAAW,oBAAmB;IAE9C,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;MAOlB;IAED,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAQ9B;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,mBAAmB,IAAI,wBAAwB,CAElD;IAED,IAAI,OAAO,YAOV;IAED,aAAa;IAcb,cAAc;IAgBd,YAAY;IAUZ,MAAM;CAmBP;AAED,eAAe,cAAc,CAAA;AAC7B,OAAO,EAAE,cAAc,EAAE,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import type { AsElementType, PropValidators, FormFieldGroupTheme } from '@instructure/shared-types';
|
|
2
|
+
import type { AsElementType, PropValidators, FormFieldGroupTheme, OtherHTMLAttributes } from '@instructure/shared-types';
|
|
3
3
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
|
|
4
4
|
import type { FormMessage } from '../FormPropTypes';
|
|
5
5
|
declare type FormFieldGroupOwnProps = {
|
|
@@ -21,7 +21,7 @@ declare type FormFieldGroupStyleProps = {
|
|
|
21
21
|
};
|
|
22
22
|
declare type PropKeys = keyof FormFieldGroupOwnProps;
|
|
23
23
|
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
24
|
-
declare type FormFieldGroupProps = FormFieldGroupOwnProps & WithStyleProps<FormFieldGroupTheme, FormFieldGroupStyle>;
|
|
24
|
+
declare type FormFieldGroupProps = FormFieldGroupOwnProps & WithStyleProps<FormFieldGroupTheme, FormFieldGroupStyle> & OtherHTMLAttributes<FormFieldGroupOwnProps>;
|
|
25
25
|
declare type FormFieldGroupStyle = ComponentStyle<'formFieldGroup'>;
|
|
26
26
|
declare const propTypes: PropValidators<PropKeys>;
|
|
27
27
|
declare const allowedProps: AllowedPropKeys;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldGroup/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,sBAAsB,GAAG;IAC5B,WAAW,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IACzC,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACpC,OAAO,CAAC,EAAE,GAAG,CAAA;IACb,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;CAC/C,CAAA;AAED,aAAK,wBAAwB,GAAG;IAC9B,OAAO,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,sBAAsB,CAAA;AAE5C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,mBAAmB,GAAG,sBAAsB,GAC/C,cAAc,CAAC,mBAAmB,EAAE,mBAAmB,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldGroup/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,sBAAsB,GAAG;IAC5B,WAAW,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IACzC,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClD,MAAM,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACpC,OAAO,CAAC,EAAE,GAAG,CAAA;IACb,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;CAC/C,CAAA;AAED,aAAK,wBAAwB,GAAG;IAC9B,OAAO,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,sBAAsB,CAAA;AAE5C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,mBAAmB,GAAG,sBAAsB,GAC/C,cAAc,CAAC,mBAAmB,EAAE,mBAAmB,CAAC,GACxD,mBAAmB,CAAC,sBAAsB,CAAC,CAAA;AAE7C,aAAK,mBAAmB,GAAG,cAAc,CAAC,gBAAgB,CAAC,CAAA;AAE3D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA4BvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAanB,CAAA;AAED,YAAY,EACV,mBAAmB,EACnB,wBAAwB,EACxB,mBAAmB,EACpB,CAAA;AACD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import type { AsElementType, PropValidators, FormFieldLabelTheme } from '@instructure/shared-types';
|
|
2
|
+
import type { AsElementType, PropValidators, FormFieldLabelTheme, OtherHTMLAttributes } from '@instructure/shared-types';
|
|
3
3
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
|
|
4
4
|
declare type FormFieldLabelOwnProps = {
|
|
5
5
|
as?: AsElementType;
|
|
@@ -7,7 +7,7 @@ declare type FormFieldLabelOwnProps = {
|
|
|
7
7
|
};
|
|
8
8
|
declare type PropKeys = keyof FormFieldLabelOwnProps;
|
|
9
9
|
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
10
|
-
declare type FormFieldLabelProps = FormFieldLabelOwnProps & WithStyleProps<FormFieldLabelTheme, FormFieldLabelStyle>;
|
|
10
|
+
declare type FormFieldLabelProps = FormFieldLabelOwnProps & WithStyleProps<FormFieldLabelTheme, FormFieldLabelStyle> & OtherHTMLAttributes<FormFieldLabelOwnProps>;
|
|
11
11
|
declare type FormFieldLabelStyle = ComponentStyle<'formFieldLabel'>;
|
|
12
12
|
declare const propTypes: PropValidators<PropKeys>;
|
|
13
13
|
declare const allowedProps: AllowedPropKeys;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldLabel/props.ts"],"names":[],"mappings":";AA0BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1E,aAAK,sBAAsB,GAAG;IAC5B,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,sBAAsB,CAAA;AAE5C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,mBAAmB,GAAG,sBAAsB,GAC/C,cAAc,CAAC,mBAAmB,EAAE,mBAAmB,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldLabel/props.ts"],"names":[],"mappings":";AA0BA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1E,aAAK,sBAAsB,GAAG;IAC5B,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,sBAAsB,CAAA;AAE5C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,mBAAmB,GAAG,sBAAsB,GAC/C,cAAc,CAAC,mBAAmB,EAAE,mBAAmB,CAAC,GACxD,mBAAmB,CAAC,sBAAsB,CAAC,CAAA;AAE7C,aAAK,mBAAmB,GAAG,cAAc,CAAC,gBAAgB,CAAC,CAAA;AAE3D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAGvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAAoC,CAAA;AAExD,YAAY,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,CAAA;AACxD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -18,7 +18,7 @@ declare class FormFieldLayout extends Component<FormFieldLayoutProps> {
|
|
|
18
18
|
children?: import("react").ReactNode;
|
|
19
19
|
inline?: boolean | undefined;
|
|
20
20
|
layout?: "inline" | "stacked" | undefined;
|
|
21
|
-
labelAlign?: "
|
|
21
|
+
labelAlign?: "start" | "end" | undefined;
|
|
22
22
|
width?: string | undefined;
|
|
23
23
|
inputContainerRef?: ((...args: any[]) => any) | undefined;
|
|
24
24
|
elementRef?: ((element: Element | null) => void) | undefined;
|
|
@@ -32,7 +32,7 @@ declare class FormFieldLayout extends Component<FormFieldLayoutProps> {
|
|
|
32
32
|
children?: import("react").ReactNode;
|
|
33
33
|
inline?: boolean | undefined;
|
|
34
34
|
layout?: "inline" | "stacked" | undefined;
|
|
35
|
-
labelAlign?: "
|
|
35
|
+
labelAlign?: "start" | "end" | undefined;
|
|
36
36
|
width?: string | undefined;
|
|
37
37
|
inputContainerRef?: ((...args: any[]) => any) | undefined;
|
|
38
38
|
elementRef?: ((element: Element | null) => void) | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldLayout/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAajC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEnD;;;;GAIG;AACH,cACM,eAAgB,SAAQ,SAAS,CAAC,oBAAoB,CAAC;IAC3D,MAAM,CAAC,QAAQ,CAAC,WAAW,qBAAoB;IAE/C,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;MAMT;gBAGE,KAAK,KAAA;IAejB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFieldLayout/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAajC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAQrD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEnD;;;;GAIG;AACH,cACM,eAAgB,SAAQ,SAAS,CAAC,oBAAoB,CAAC;IAC3D,MAAM,CAAC,QAAQ,CAAC,WAAW,qBAAoB;IAE/C,MAAM,CAAC,SAAS;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;MAMT;gBAGE,KAAK,KAAA;IAejB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAQ9B;IAED,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,eAAe,wCAElB;IAED,IAAI,WAAW,wBAEd;IAED,IAAI,WAAW,wEAEd;IAED,IAAI,uBAAuB,wBAG1B;IAGD,uBAAuB,sBAItB;IAED,WAAW;IAsBX,YAAY;IAaZ,qBAAqB;IAkBrB,MAAM;CAyCP;AAED,eAAe,eAAe,CAAA;AAC9B,OAAO,EAAE,eAAe,EAAE,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import type { AsElementType, PropValidators } from '@instructure/shared-types';
|
|
2
|
+
import type { AsElementType, OtherHTMLAttributes, PropValidators } from '@instructure/shared-types';
|
|
3
3
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
|
|
4
4
|
import type { FormMessage } from '../FormPropTypes';
|
|
5
5
|
declare type FormFieldLayoutOwnProps = {
|
|
@@ -18,7 +18,7 @@ declare type FormFieldLayoutOwnProps = {
|
|
|
18
18
|
};
|
|
19
19
|
declare type PropKeys = keyof FormFieldLayoutOwnProps;
|
|
20
20
|
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
21
|
-
declare type FormFieldLayoutProps = FormFieldLayoutOwnProps & WithStyleProps<null, FormFieldLayoutStyle>;
|
|
21
|
+
declare type FormFieldLayoutProps = FormFieldLayoutOwnProps & WithStyleProps<null, FormFieldLayoutStyle> & OtherHTMLAttributes<FormFieldLayoutOwnProps>;
|
|
22
22
|
declare type FormFieldLayoutStyle = ComponentStyle<'formFieldLayout'>;
|
|
23
23
|
declare const propTypes: PropValidators<PropKeys>;
|
|
24
24
|
declare const allowedProps: AllowedPropKeys;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldLayout/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldLayout/props.ts"],"names":[],"mappings":";AA4BA,OAAO,KAAK,EACV,aAAa,EACb,mBAAmB,EACnB,cAAc,EACf,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,uBAAuB,GAAG;IAC7B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC7B,UAAU,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iBAAiB,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IAC3C,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;CAC/C,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,uBAAuB,CAAA;AAE7C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,oBAAoB,GAAG,uBAAuB,GACjD,cAAc,CAAC,IAAI,EAAE,oBAAoB,CAAC,GAC1C,mBAAmB,CAAC,uBAAuB,CAAC,CAAA;AAE9C,aAAK,oBAAoB,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAA;AAE7D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA+BvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAanB,CAAA;AAED,YAAY,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,CAAA;AAC1D,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { PropValidators, FormFieldMessagesTheme } from '@instructure/shared-types';
|
|
1
|
+
import type { PropValidators, FormFieldMessagesTheme, OtherHTMLAttributes } from '@instructure/shared-types';
|
|
2
2
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
|
|
3
3
|
import type { FormMessage } from '../FormPropTypes';
|
|
4
4
|
declare type FormFieldMessagesOwnProps = {
|
|
@@ -6,7 +6,7 @@ declare type FormFieldMessagesOwnProps = {
|
|
|
6
6
|
};
|
|
7
7
|
declare type PropKeys = keyof FormFieldMessagesOwnProps;
|
|
8
8
|
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
9
|
-
declare type FormFieldMessagesProps = FormFieldMessagesOwnProps & WithStyleProps<FormFieldMessagesTheme, FormFieldMessagesStyle>;
|
|
9
|
+
declare type FormFieldMessagesProps = FormFieldMessagesOwnProps & WithStyleProps<FormFieldMessagesTheme, FormFieldMessagesStyle> & OtherHTMLAttributes<FormFieldMessagesOwnProps>;
|
|
10
10
|
declare type FormFieldMessagesStyle = ComponentStyle<'formFieldMessages' | 'message'>;
|
|
11
11
|
declare const propTypes: PropValidators<PropKeys>;
|
|
12
12
|
declare const allowedProps: AllowedPropKeys;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldMessages/props.ts"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EACV,cAAc,EACd,sBAAsB,
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/FormFieldMessages/props.ts"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EACV,cAAc,EACd,sBAAsB,EACtB,mBAAmB,EACpB,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAEnD,aAAK,yBAAyB,GAAG;IAC/B,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAA;CACzB,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,yBAAyB,CAAA;AAE/C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,sBAAsB,GAAG,yBAAyB,GACrD,cAAc,CAAC,sBAAsB,EAAE,sBAAsB,CAAC,GAC9D,mBAAmB,CAAC,yBAAyB,CAAC,CAAA;AAEhD,aAAK,sBAAsB,GAAG,cAAc,CAAC,mBAAmB,GAAG,SAAS,CAAC,CAAA;AAE7E,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAQvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAA8B,CAAA;AAElD,YAAY,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,CAAA;AAC9D,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
package/LICENSE.md
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: The MIT License (MIT)
|
|
3
|
-
category: Getting Started
|
|
4
|
-
order: 9
|
|
5
|
-
---
|
|
6
|
-
|
|
7
|
-
# The MIT License (MIT)
|
|
8
|
-
|
|
9
|
-
Copyright (c) 2015 Instructure, Inc.
|
|
10
|
-
|
|
11
|
-
**Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
12
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
13
|
-
in the Software without restriction, including without limitation the rights
|
|
14
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
15
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
16
|
-
furnished to do so, subject to the following conditions.**
|
|
17
|
-
|
|
18
|
-
The above copyright notice and this permission notice shall be included in all
|
|
19
|
-
copies or substantial portions of the Software.
|
|
20
|
-
|
|
21
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
22
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
23
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
24
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
25
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
26
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
27
|
-
SOFTWARE.
|