@fluentui/react-field 9.0.0-alpha.9 → 9.0.0-beta.2
Sign up to get free protection for your applications and to get access to all the features.
- package/.swcrc +30 -0
- package/CHANGELOG.json +666 -1
- package/CHANGELOG.md +242 -2
- package/README.md +66 -1
- package/dist/index.d.ts +153 -80
- package/lib/Field.js.map +1 -1
- package/lib/components/Field/Field.js +13 -0
- package/lib/components/Field/Field.js.map +1 -0
- package/lib/components/Field/Field.types.js +1 -1
- package/lib/components/Field/Field.types.js.map +1 -1
- package/lib/components/Field/index.js +1 -0
- package/lib/components/Field/index.js.map +1 -1
- package/lib/components/Field/renderField.js +11 -9
- package/lib/components/Field/renderField.js.map +1 -1
- package/lib/components/Field/useField.js +32 -98
- package/lib/components/Field/useField.js.map +1 -1
- package/lib/components/Field/useFieldStyles.js +61 -76
- package/lib/components/Field/useFieldStyles.js.map +1 -1
- package/lib/contexts/FieldContext.js +5 -0
- package/lib/contexts/FieldContext.js.map +1 -0
- package/lib/contexts/index.js +4 -0
- package/lib/contexts/index.js.map +1 -0
- package/lib/contexts/useFieldContextValues.js +33 -0
- package/lib/contexts/useFieldContextValues.js.map +1 -0
- package/lib/contexts/useFieldControlProps.js +65 -0
- package/lib/contexts/useFieldControlProps.js.map +1 -0
- package/lib/index.js +4 -1
- package/lib/index.js.map +1 -1
- package/lib/util/makeDeprecatedField.js +68 -0
- package/lib/util/makeDeprecatedField.js.map +1 -0
- package/lib-commonjs/Field.js +4 -5
- package/lib-commonjs/Field.js.map +1 -1
- package/lib-commonjs/components/Field/Field.js +23 -0
- package/lib-commonjs/components/Field/Field.js.map +1 -0
- package/lib-commonjs/components/Field/Field.types.js +5 -2
- package/lib-commonjs/components/Field/Field.types.js.map +1 -1
- package/lib-commonjs/components/Field/index.js +8 -11
- package/lib-commonjs/components/Field/index.js.map +1 -1
- package/lib-commonjs/components/Field/renderField.js +19 -26
- package/lib-commonjs/components/Field/renderField.js.map +1 -1
- package/lib-commonjs/components/Field/useField.js +71 -155
- package/lib-commonjs/components/Field/useField.js.map +1 -1
- package/lib-commonjs/components/Field/useFieldStyles.js +138 -118
- package/lib-commonjs/components/Field/useFieldStyles.js.map +1 -1
- package/lib-commonjs/contexts/FieldContext.js +21 -0
- package/lib-commonjs/contexts/FieldContext.js.map +1 -0
- package/lib-commonjs/contexts/index.js +11 -0
- package/lib-commonjs/contexts/index.js.map +1 -0
- package/lib-commonjs/contexts/useFieldContextValues.js +44 -0
- package/lib-commonjs/contexts/useFieldContextValues.js.map +1 -0
- package/lib-commonjs/contexts/useFieldControlProps.js +71 -0
- package/lib-commonjs/contexts/useFieldControlProps.js.map +1 -0
- package/lib-commonjs/index.js +24 -29
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/util/makeDeprecatedField.js +61 -0
- package/lib-commonjs/util/makeDeprecatedField.js.map +1 -0
- package/package.json +14 -11
- package/Spec.md +0 -354
- package/lib/components/Field/SlotComponent.types.js +0 -2
- package/lib/components/Field/SlotComponent.types.js.map +0 -1
- package/lib-amd/Field.js +0 -6
- package/lib-amd/Field.js.map +0 -1
- package/lib-amd/components/Field/Field.types.js +0 -5
- package/lib-amd/components/Field/Field.types.js.map +0 -1
- package/lib-amd/components/Field/SlotComponent.types.js +0 -5
- package/lib-amd/components/Field/SlotComponent.types.js.map +0 -1
- package/lib-amd/components/Field/index.js +0 -9
- package/lib-amd/components/Field/index.js.map +0 -1
- package/lib-amd/components/Field/renderField.js +0 -20
- package/lib-amd/components/Field/renderField.js.map +0 -1
- package/lib-amd/components/Field/useField.js +0 -121
- package/lib-amd/components/Field/useField.js.map +0 -1
- package/lib-amd/components/Field/useFieldStyles.js +0 -97
- package/lib-amd/components/Field/useFieldStyles.js.map +0 -1
- package/lib-amd/index.js +0 -10
- package/lib-amd/index.js.map +0 -1
- package/lib-commonjs/components/Field/SlotComponent.types.js +0 -6
- package/lib-commonjs/components/Field/SlotComponent.types.js.map +0 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["../../../lib/components/Field/useField.js"],"sourcesContent":["import * as React from 'react';\nimport { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nconst validationMessageIcons = {\n error: /*#__PURE__*/React.createElement(ErrorCircle12Filled, null),\n warning: /*#__PURE__*/React.createElement(Warning12Filled, null),\n success: /*#__PURE__*/React.createElement(CheckmarkCircle12Filled, null),\n none: undefined\n};\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props, ref) => {\n const {\n children,\n orientation = 'vertical',\n required = false,\n validationState = props.validationMessage ? 'error' : 'none',\n size = 'medium'\n } = props;\n const baseId = useId('field-');\n const generatedControlId = baseId + '__control';\n const root = getNativeElementProps('div', {\n ...props,\n ref\n }, /*excludedPropNames:*/['children']);\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: generatedControlId,\n id: baseId + '__label',\n required,\n size\n }\n });\n const validationMessage = resolveShorthand(props.validationMessage, {\n defaultProps: {\n id: baseId + '__validationMessage',\n role: validationState === 'error' ? 'alert' : undefined\n }\n });\n const hint = resolveShorthand(props.hint, {\n defaultProps: {\n id: baseId + '__hint'\n }\n });\n const defaultIcon = validationMessageIcons[validationState];\n const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {\n required: !!defaultIcon,\n defaultProps: {\n children: defaultIcon\n }\n });\n return {\n children,\n generatedControlId,\n orientation,\n required,\n size,\n validationState,\n components: {\n root: 'div',\n label: Label,\n validationMessage: 'div',\n validationMessageIcon: 'span',\n hint: 'div'\n },\n root,\n label,\n validationMessageIcon,\n validationMessage,\n hint\n };\n};\n//# sourceMappingURL=useField.js.map"],"names":["useField_unstable","validationMessageIcons","error","React","createElement","ErrorCircle12Filled","warning","Warning12Filled","success","CheckmarkCircle12Filled","none","undefined","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","useId","generatedControlId","root","getNativeElementProps","label","resolveShorthand","defaultProps","htmlFor","id","role","hint","defaultIcon","validationMessageIcon","components","Label"],"mappings":";;;;+BAmBaA;;aAAAA;;;6DAnBU;4BACuD;4BACxD;gCACyC;AAC/D,MAAMC,yBAAyB;IAC7BC,OAAO,WAAW,GAAEC,OAAMC,aAAa,CAACC,+BAAmB,EAAE,IAAI;IACjEC,SAAS,WAAW,GAAEH,OAAMC,aAAa,CAACG,2BAAe,EAAE,IAAI;IAC/DC,SAAS,WAAW,GAAEL,OAAMC,aAAa,CAACK,mCAAuB,EAAE,IAAI;IACvEC,MAAMC;AACR;AAUO,MAAMX,oBAAoB,CAACY,OAAOC,MAAQ;IAC/C,MAAM,EACJC,SAAQ,EACRC,aAAc,WAAU,EACxBC,UAAW,KAAK,CAAA,EAChBC,iBAAkBL,MAAMM,iBAAiB,GAAG,UAAU,MAAM,CAAA,EAC5DC,MAAO,SAAQ,EAChB,GAAGP;IACJ,MAAMQ,SAASC,IAAAA,qBAAK,EAAC;IACrB,MAAMC,qBAAqBF,SAAS;IACpC,MAAMG,OAAOC,IAAAA,qCAAqB,EAAC,OAAO;QACxC,GAAGZ,KAAK;QACRC;IACF,GAAG,oBAAoB,GAAE;QAAC;KAAW;IACrC,MAAMY,QAAQC,IAAAA,gCAAgB,EAACd,MAAMa,KAAK,EAAE;QAC1CE,cAAc;YACZC,SAASN;YACTO,IAAIT,SAAS;YACbJ;YACAG;QACF;IACF;IACA,MAAMD,oBAAoBQ,IAAAA,gCAAgB,EAACd,MAAMM,iBAAiB,EAAE;QAClES,cAAc;YACZE,IAAIT,SAAS;YACbU,MAAMb,oBAAoB,UAAU,UAAUN,SAAS;QACzD;IACF;IACA,MAAMoB,OAAOL,IAAAA,gCAAgB,EAACd,MAAMmB,IAAI,EAAE;QACxCJ,cAAc;YACZE,IAAIT,SAAS;QACf;IACF;IACA,MAAMY,cAAc/B,sBAAsB,CAACgB,gBAAgB;IAC3D,MAAMgB,wBAAwBP,IAAAA,gCAAgB,EAACd,MAAMqB,qBAAqB,EAAE;QAC1EjB,UAAU,CAAC,CAACgB;QACZL,cAAc;YACZb,UAAUkB;QACZ;IACF;IACA,OAAO;QACLlB;QACAQ;QACAP;QACAC;QACAG;QACAF;QACAiB,YAAY;YACVX,MAAM;YACNE,OAAOU,iBAAK;YACZjB,mBAAmB;YACnBe,uBAAuB;YACvBF,MAAM;QACR;QACAR;QACAE;QACAQ;QACAf;QACAa;IACF;AACF,GACA,oCAAoC"}
|
@@ -1,134 +1,154 @@
|
|
1
1
|
"use strict";
|
2
|
-
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
4
|
-
|
3
|
+
value: true
|
5
4
|
});
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
label: `fui-${name}__label`,
|
16
|
-
validationMessage: `fui-${name}__validationMessage`,
|
17
|
-
validationMessageIcon: `fui-${name}__validationMessageIcon`,
|
18
|
-
hint: `fui-${name}__hint`
|
5
|
+
function _export(target, all) {
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
7
|
+
enumerable: true,
|
8
|
+
get: all[name]
|
9
|
+
});
|
10
|
+
}
|
11
|
+
_export(exports, {
|
12
|
+
fieldClassNames: ()=>fieldClassNames,
|
13
|
+
useFieldStyles_unstable: ()=>useFieldStyles_unstable
|
19
14
|
});
|
20
|
-
|
21
|
-
|
15
|
+
const _react = require("@griffel/react");
|
16
|
+
const fieldClassNames = {
|
17
|
+
root: `fui-Field`,
|
18
|
+
label: `fui-Field__label`,
|
19
|
+
validationMessage: `fui-Field__validationMessage`,
|
20
|
+
validationMessageIcon: `fui-Field__validationMessageIcon`,
|
21
|
+
hint: `fui-Field__hint`
|
22
|
+
};
|
23
|
+
// Size of the icon in the validation message
|
24
|
+
const iconSize = '12px';
|
22
25
|
/**
|
23
26
|
* Styles for the root slot
|
24
|
-
*/
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
27
|
+
*/ const useRootStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
28
|
+
base: {
|
29
|
+
mc9l5x: "f13qh94s"
|
30
|
+
},
|
31
|
+
horizontal: {
|
32
|
+
Budl1dq: "f2wwaib",
|
33
|
+
wkccdc: "f1645dqt"
|
34
|
+
},
|
35
|
+
horizontalNoLabel: {
|
36
|
+
uwmqm3: [
|
37
|
+
"f15jqgz8",
|
38
|
+
"fggqkej"
|
39
|
+
],
|
40
|
+
Budl1dq: "f1c2z91y"
|
41
|
+
}
|
39
42
|
}, {
|
40
|
-
|
43
|
+
d: [
|
44
|
+
".f13qh94s{display:grid;}",
|
45
|
+
".f2wwaib{grid-template-columns:33% 1fr;}",
|
46
|
+
".f1645dqt{grid-template-rows:auto auto auto 1fr;}",
|
47
|
+
".f15jqgz8{padding-left:33%;}",
|
48
|
+
".fggqkej{padding-right:33%;}",
|
49
|
+
".f1c2z91y{grid-template-columns:1fr;}"
|
50
|
+
]
|
41
51
|
});
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
52
|
+
const useLabelStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
53
|
+
base: {
|
54
|
+
z8tnut: "fclwglc",
|
55
|
+
Byoj8tv: "fywfov9"
|
56
|
+
},
|
57
|
+
large: {
|
58
|
+
z8tnut: "f1sl3k7w",
|
59
|
+
Byoj8tv: "f1brlhvm"
|
60
|
+
},
|
61
|
+
vertical: {
|
62
|
+
jrapky: "fyacil5"
|
63
|
+
},
|
64
|
+
verticalLarge: {
|
65
|
+
jrapky: "f8l5zjj"
|
66
|
+
},
|
67
|
+
horizontal: {
|
68
|
+
t21cq0: [
|
69
|
+
"fkujibs",
|
70
|
+
"f199hnxi"
|
71
|
+
],
|
72
|
+
Ijaq50: "f16hsg94",
|
73
|
+
nk6f5a: "f1nzqi2z"
|
74
|
+
}
|
55
75
|
}, {
|
56
|
-
|
76
|
+
d: [
|
77
|
+
".fclwglc{padding-top:var(--spacingVerticalXXS);}",
|
78
|
+
".fywfov9{padding-bottom:var(--spacingVerticalXXS);}",
|
79
|
+
".f1sl3k7w{padding-top:1px;}",
|
80
|
+
".f1brlhvm{padding-bottom:1px;}",
|
81
|
+
".fyacil5{margin-bottom:var(--spacingVerticalXXS);}",
|
82
|
+
".f8l5zjj{margin-bottom:var(--spacingVerticalXS);}",
|
83
|
+
".fkujibs{margin-right:var(--spacingHorizontalM);}",
|
84
|
+
".f199hnxi{margin-left:var(--spacingHorizontalM);}",
|
85
|
+
".f16hsg94{grid-row-start:1;}",
|
86
|
+
".f1nzqi2z{grid-row-end:-1;}"
|
87
|
+
]
|
57
88
|
});
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
89
|
+
const useSecondaryTextBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("r5c4z9l", null, [
|
90
|
+
".r5c4z9l{margin-top:var(--spacingVerticalXXS);color:var(--colorNeutralForeground3);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);}"
|
91
|
+
]);
|
92
|
+
const useSecondaryTextStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
93
|
+
error: {
|
94
|
+
sj55zd: "f1hcrxcs"
|
95
|
+
},
|
96
|
+
withIcon: {
|
97
|
+
uwmqm3: [
|
98
|
+
"frawy03",
|
99
|
+
"fg4c52"
|
100
|
+
]
|
101
|
+
}
|
71
102
|
}, {
|
72
|
-
|
103
|
+
d: [
|
104
|
+
".f1hcrxcs{color:var(--colorPaletteRedForeground1);}",
|
105
|
+
".frawy03{padding-left:calc(12px + var(--spacingHorizontalXS));}",
|
106
|
+
".fg4c52{padding-right:calc(12px + var(--spacingHorizontalXS));}"
|
107
|
+
]
|
73
108
|
});
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
"success": {
|
89
|
-
"sj55zd": "ffmvakt"
|
90
|
-
}
|
109
|
+
const useValidationMessageIconBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("ra7h1uk", "r1rh6bd7", [
|
110
|
+
".ra7h1uk{display:inline-block;font-size:12px;margin-left:calc(-12px - var(--spacingHorizontalXS));margin-right:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}",
|
111
|
+
".r1rh6bd7{display:inline-block;font-size:12px;margin-right:calc(-12px - var(--spacingHorizontalXS));margin-left:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}"
|
112
|
+
]);
|
113
|
+
const useValidationMessageIconStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
114
|
+
error: {
|
115
|
+
sj55zd: "f1hcrxcs"
|
116
|
+
},
|
117
|
+
warning: {
|
118
|
+
sj55zd: "f1k5f75o"
|
119
|
+
},
|
120
|
+
success: {
|
121
|
+
sj55zd: "ffmvakt"
|
122
|
+
}
|
91
123
|
}, {
|
92
|
-
|
124
|
+
d: [
|
125
|
+
".f1hcrxcs{color:var(--colorPaletteRedForeground1);}",
|
126
|
+
".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}",
|
127
|
+
".ffmvakt{color:var(--colorPaletteGreenForeground1);}"
|
128
|
+
]
|
93
129
|
});
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
const
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
if (state.validationMessageIcon) {
|
119
|
-
state.validationMessageIcon.className = react_1.mergeClasses(classNames.validationMessageIcon, validationMessageIconStyles.base, !!validationState && validationMessageIconStyles[validationState], state.validationMessageIcon.className);
|
120
|
-
}
|
121
|
-
|
122
|
-
const secondaryTextStyles = useSecondaryTextStyles();
|
123
|
-
|
124
|
-
if (state.validationMessage) {
|
125
|
-
state.validationMessage.className = react_1.mergeClasses(classNames.validationMessage, secondaryTextStyles.base, horizontal && rootStyles.secondColumn, validationState === 'error' && secondaryTextStyles.error, state.validationMessage.className);
|
126
|
-
}
|
127
|
-
|
128
|
-
if (state.hint) {
|
129
|
-
state.hint.className = react_1.mergeClasses(classNames.hint, secondaryTextStyles.base, horizontal && rootStyles.secondColumn, state.hint.className);
|
130
|
-
}
|
131
|
-
};
|
130
|
+
const useFieldStyles_unstable = (state)=>{
|
131
|
+
const { validationState } = state;
|
132
|
+
const horizontal = state.orientation === 'horizontal';
|
133
|
+
const rootStyles = useRootStyles();
|
134
|
+
state.root.className = (0, _react.mergeClasses)(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);
|
135
|
+
const labelStyles = useLabelStyles();
|
136
|
+
if (state.label) {
|
137
|
+
state.label.className = (0, _react.mergeClasses)(fieldClassNames.label, labelStyles.base, horizontal && labelStyles.horizontal, !horizontal && labelStyles.vertical, state.label.size === 'large' && labelStyles.large, !horizontal && state.label.size === 'large' && labelStyles.verticalLarge, state.label.className);
|
138
|
+
}
|
139
|
+
const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();
|
140
|
+
const validationMessageIconStyles = useValidationMessageIconStyles();
|
141
|
+
if (state.validationMessageIcon) {
|
142
|
+
state.validationMessageIcon.className = (0, _react.mergeClasses)(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);
|
143
|
+
}
|
144
|
+
const secondaryTextBaseClassName = useSecondaryTextBaseClassName();
|
145
|
+
const secondaryTextStyles = useSecondaryTextStyles();
|
146
|
+
if (state.validationMessage) {
|
147
|
+
state.validationMessage.className = (0, _react.mergeClasses)(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);
|
148
|
+
}
|
149
|
+
if (state.hint) {
|
150
|
+
state.hint.className = (0, _react.mergeClasses)(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);
|
151
|
+
}
|
152
|
+
}; //# sourceMappingURL=useFieldStyles.js.map
|
132
153
|
|
133
|
-
exports.useFieldStyles_unstable = useFieldStyles_unstable;
|
134
154
|
//# sourceMappingURL=useFieldStyles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["../../../lib/components/Field/useFieldStyles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { __resetStyles, __styles, mergeClasses } from '@griffel/react';\nexport const fieldClassNames = {\n root: `fui-Field`,\n label: `fui-Field__label`,\n validationMessage: `fui-Field__validationMessage`,\n validationMessageIcon: `fui-Field__validationMessageIcon`,\n hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f13qh94s\"\n },\n horizontal: {\n Budl1dq: \"f2wwaib\",\n wkccdc: \"f1645dqt\"\n },\n horizontalNoLabel: {\n uwmqm3: [\"f15jqgz8\", \"fggqkej\"],\n Budl1dq: \"f1c2z91y\"\n }\n}, {\n d: [\".f13qh94s{display:grid;}\", \".f2wwaib{grid-template-columns:33% 1fr;}\", \".f1645dqt{grid-template-rows:auto auto auto 1fr;}\", \".f15jqgz8{padding-left:33%;}\", \".fggqkej{padding-right:33%;}\", \".f1c2z91y{grid-template-columns:1fr;}\"]\n});\nconst useLabelStyles = /*#__PURE__*/__styles({\n base: {\n z8tnut: \"fclwglc\",\n Byoj8tv: \"fywfov9\"\n },\n large: {\n z8tnut: \"f1sl3k7w\",\n Byoj8tv: \"f1brlhvm\"\n },\n vertical: {\n jrapky: \"fyacil5\"\n },\n verticalLarge: {\n jrapky: \"f8l5zjj\"\n },\n horizontal: {\n t21cq0: [\"fkujibs\", \"f199hnxi\"],\n Ijaq50: \"f16hsg94\",\n nk6f5a: \"f1nzqi2z\"\n }\n}, {\n d: [\".fclwglc{padding-top:var(--spacingVerticalXXS);}\", \".fywfov9{padding-bottom:var(--spacingVerticalXXS);}\", \".f1sl3k7w{padding-top:1px;}\", \".f1brlhvm{padding-bottom:1px;}\", \".fyacil5{margin-bottom:var(--spacingVerticalXXS);}\", \".f8l5zjj{margin-bottom:var(--spacingVerticalXS);}\", \".fkujibs{margin-right:var(--spacingHorizontalM);}\", \".f199hnxi{margin-left:var(--spacingHorizontalM);}\", \".f16hsg94{grid-row-start:1;}\", \".f1nzqi2z{grid-row-end:-1;}\"]\n});\nconst useSecondaryTextBaseClassName = /*#__PURE__*/__resetStyles(\"r5c4z9l\", null, [\".r5c4z9l{margin-top:var(--spacingVerticalXXS);color:var(--colorNeutralForeground3);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);}\"]);\nconst useSecondaryTextStyles = /*#__PURE__*/__styles({\n error: {\n sj55zd: \"f1hcrxcs\"\n },\n withIcon: {\n uwmqm3: [\"frawy03\", \"fg4c52\"]\n }\n}, {\n d: [\".f1hcrxcs{color:var(--colorPaletteRedForeground1);}\", \".frawy03{padding-left:calc(12px + var(--spacingHorizontalXS));}\", \".fg4c52{padding-right:calc(12px + var(--spacingHorizontalXS));}\"]\n});\nconst useValidationMessageIconBaseClassName = /*#__PURE__*/__resetStyles(\"ra7h1uk\", \"r1rh6bd7\", [\".ra7h1uk{display:inline-block;font-size:12px;margin-left:calc(-12px - var(--spacingHorizontalXS));margin-right:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}\", \".r1rh6bd7{display:inline-block;font-size:12px;margin-right:calc(-12px - var(--spacingHorizontalXS));margin-left:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}\"]);\nconst useValidationMessageIconStyles = /*#__PURE__*/__styles({\n error: {\n sj55zd: \"f1hcrxcs\"\n },\n warning: {\n sj55zd: \"f1k5f75o\"\n },\n success: {\n sj55zd: \"ffmvakt\"\n }\n}, {\n d: [\".f1hcrxcs{color:var(--colorPaletteRedForeground1);}\", \".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}\", \".ffmvakt{color:var(--colorPaletteGreenForeground1);}\"]\n});\n/**\n * Apply styling to the Field slots based on the state\n */\nexport const useFieldStyles_unstable = state => {\n const {\n validationState\n } = state;\n const horizontal = state.orientation === 'horizontal';\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(fieldClassNames.label, labelStyles.base, horizontal && labelStyles.horizontal, !horizontal && labelStyles.vertical, state.label.size === 'large' && labelStyles.large, !horizontal && state.label.size === 'large' && labelStyles.verticalLarge, state.label.className);\n }\n const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n const validationMessageIconStyles = useValidationMessageIconStyles();\n if (state.validationMessageIcon) {\n state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n }\n const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n const secondaryTextStyles = useSecondaryTextStyles();\n if (state.validationMessage) {\n state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n }\n if (state.hint) {\n state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n }\n};\n//# sourceMappingURL=useFieldStyles.js.map"],"names":["fieldClassNames","useFieldStyles_unstable","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","__styles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","z8tnut","Byoj8tv","large","vertical","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","useSecondaryTextBaseClassName","__resetStyles","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","state","validationState","orientation","rootStyles","className","mergeClasses","labelStyles","size","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"mappings":"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"}
|
@@ -0,0 +1,21 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
function _export(target, all) {
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
7
|
+
enumerable: true,
|
8
|
+
get: all[name]
|
9
|
+
});
|
10
|
+
}
|
11
|
+
_export(exports, {
|
12
|
+
FieldContextProvider: ()=>FieldContextProvider,
|
13
|
+
useFieldContext_unstable: ()=>useFieldContext_unstable
|
14
|
+
});
|
15
|
+
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
16
|
+
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
17
|
+
const FieldContext = /*#__PURE__*/ _react.createContext(undefined);
|
18
|
+
const FieldContextProvider = FieldContext.Provider;
|
19
|
+
const useFieldContext_unstable = ()=>_react.useContext(FieldContext); //# sourceMappingURL=FieldContext.js.map
|
20
|
+
|
21
|
+
//# sourceMappingURL=FieldContext.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../lib/contexts/FieldContext.js"],"sourcesContent":["import * as React from 'react';\nconst FieldContext = /*#__PURE__*/React.createContext(undefined);\nexport const FieldContextProvider = FieldContext.Provider;\nexport const useFieldContext_unstable = () => React.useContext(FieldContext);\n//# sourceMappingURL=FieldContext.js.map"],"names":["FieldContextProvider","useFieldContext_unstable","FieldContext","React","createContext","undefined","Provider","useContext"],"mappings":";;;;;;;;;;;IAEaA,oBAAoB,MAApBA;IACAC,wBAAwB,MAAxBA;;;6DAHU;AACvB,MAAMC,eAAe,WAAW,GAAEC,OAAMC,aAAa,CAACC;AAC/C,MAAML,uBAAuBE,aAAaI,QAAQ;AAClD,MAAML,2BAA2B,IAAME,OAAMI,UAAU,CAACL,eAC/D,wCAAwC"}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
|
6
|
+
_exportStar(require("./FieldContext"), exports);
|
7
|
+
_exportStar(require("./useFieldContextValues"), exports);
|
8
|
+
_exportStar(require("./useFieldControlProps"), exports);
|
9
|
+
//# sourceMappingURL=index.js.map
|
10
|
+
|
11
|
+
//# sourceMappingURL=index.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../lib/contexts/index.js"],"sourcesContent":["export * from './FieldContext';\nexport * from './useFieldContextValues';\nexport * from './useFieldControlProps';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;CACd,iCAAiC"}
|
@@ -0,0 +1,44 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
Object.defineProperty(exports, "useFieldContextValues_unstable", {
|
6
|
+
enumerable: true,
|
7
|
+
get: ()=>useFieldContextValues_unstable
|
8
|
+
});
|
9
|
+
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
10
|
+
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
11
|
+
const useFieldContextValues_unstable = (state)=>{
|
12
|
+
var _state_label, _state_label1, _state_validationMessage, _state_hint;
|
13
|
+
const { generatedControlId , orientation , required , size , validationState } = state;
|
14
|
+
const labelFor = (_state_label = state.label) === null || _state_label === void 0 ? void 0 : _state_label.htmlFor;
|
15
|
+
const labelId = (_state_label1 = state.label) === null || _state_label1 === void 0 ? void 0 : _state_label1.id;
|
16
|
+
const validationMessageId = (_state_validationMessage = state.validationMessage) === null || _state_validationMessage === void 0 ? void 0 : _state_validationMessage.id;
|
17
|
+
const hintId = (_state_hint = state.hint) === null || _state_hint === void 0 ? void 0 : _state_hint.id;
|
18
|
+
const field = _react.useMemo(()=>({
|
19
|
+
generatedControlId,
|
20
|
+
hintId,
|
21
|
+
labelFor,
|
22
|
+
labelId,
|
23
|
+
orientation,
|
24
|
+
required,
|
25
|
+
size,
|
26
|
+
validationMessageId,
|
27
|
+
validationState
|
28
|
+
}), [
|
29
|
+
generatedControlId,
|
30
|
+
hintId,
|
31
|
+
labelFor,
|
32
|
+
labelId,
|
33
|
+
orientation,
|
34
|
+
required,
|
35
|
+
size,
|
36
|
+
validationMessageId,
|
37
|
+
validationState
|
38
|
+
]);
|
39
|
+
return {
|
40
|
+
field
|
41
|
+
};
|
42
|
+
}; //# sourceMappingURL=useFieldContextValues.js.map
|
43
|
+
|
44
|
+
//# sourceMappingURL=useFieldContextValues.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../lib/contexts/useFieldContextValues.js"],"sourcesContent":["import * as React from 'react';\n/**\n * Get the context values used when rendering Field.\n */\nexport const useFieldContextValues_unstable = state => {\n var _state_label, _state_label1, _state_validationMessage, _state_hint;\n const {\n generatedControlId,\n orientation,\n required,\n size,\n validationState\n } = state;\n const labelFor = (_state_label = state.label) === null || _state_label === void 0 ? void 0 : _state_label.htmlFor;\n const labelId = (_state_label1 = state.label) === null || _state_label1 === void 0 ? void 0 : _state_label1.id;\n const validationMessageId = (_state_validationMessage = state.validationMessage) === null || _state_validationMessage === void 0 ? void 0 : _state_validationMessage.id;\n const hintId = (_state_hint = state.hint) === null || _state_hint === void 0 ? void 0 : _state_hint.id;\n const field = React.useMemo(() => ({\n generatedControlId,\n hintId,\n labelFor,\n labelId,\n orientation,\n required,\n size,\n validationMessageId,\n validationState\n }), [generatedControlId, hintId, labelFor, labelId, orientation, required, size, validationMessageId, validationState]);\n return {\n field\n };\n};\n//# sourceMappingURL=useFieldContextValues.js.map"],"names":["useFieldContextValues_unstable","state","_state_label","_state_label1","_state_validationMessage","_state_hint","generatedControlId","orientation","required","size","validationState","labelFor","label","htmlFor","labelId","id","validationMessageId","validationMessage","hintId","hint","field","React","useMemo"],"mappings":";;;;+BAIaA;;aAAAA;;;6DAJU;AAIhB,MAAMA,iCAAiCC,CAAAA,QAAS;IACrD,IAAIC,cAAcC,eAAeC,0BAA0BC;IAC3D,MAAM,EACJC,mBAAkB,EAClBC,YAAW,EACXC,SAAQ,EACRC,KAAI,EACJC,gBAAe,EAChB,GAAGT;IACJ,MAAMU,WAAW,AAACT,CAAAA,eAAeD,MAAMW,KAAK,AAAD,MAAO,IAAI,IAAIV,iBAAiB,KAAK,IAAI,KAAK,IAAIA,aAAaW,OAAO;IACjH,MAAMC,UAAU,AAACX,CAAAA,gBAAgBF,MAAMW,KAAK,AAAD,MAAO,IAAI,IAAIT,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcY,EAAE;IAC9G,MAAMC,sBAAsB,AAACZ,CAAAA,2BAA2BH,MAAMgB,iBAAiB,AAAD,MAAO,IAAI,IAAIb,6BAA6B,KAAK,IAAI,KAAK,IAAIA,yBAAyBW,EAAE;IACvK,MAAMG,SAAS,AAACb,CAAAA,cAAcJ,MAAMkB,IAAI,AAAD,MAAO,IAAI,IAAId,gBAAgB,KAAK,IAAI,KAAK,IAAIA,YAAYU,EAAE;IACtG,MAAMK,QAAQC,OAAMC,OAAO,CAAC,IAAO,CAAA;YACjChB;YACAY;YACAP;YACAG;YACAP;YACAC;YACAC;YACAO;YACAN;QACF,CAAA,GAAI;QAACJ;QAAoBY;QAAQP;QAAUG;QAASP;QAAaC;QAAUC;QAAMO;QAAqBN;KAAgB;IACtH,OAAO;QACLU;IACF;AACF,GACA,iDAAiD"}
|
@@ -0,0 +1,71 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
function _export(target, all) {
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
7
|
+
enumerable: true,
|
8
|
+
get: all[name]
|
9
|
+
});
|
10
|
+
}
|
11
|
+
_export(exports, {
|
12
|
+
useFieldControlProps_unstable: ()=>useFieldControlProps_unstable,
|
13
|
+
getFieldControlProps: ()=>getFieldControlProps
|
14
|
+
});
|
15
|
+
const _fieldContext = require("./FieldContext");
|
16
|
+
var _props, _props1, _arialabelledby, _props2, _ariainvalid, _props3, _props4, _ariarequired, _props5;
|
17
|
+
function useFieldControlProps_unstable(props, options) {
|
18
|
+
return getFieldControlProps((0, _fieldContext.useFieldContext_unstable)(), props, options);
|
19
|
+
}
|
20
|
+
function getFieldControlProps(context, props, options) {
|
21
|
+
if (!context) {
|
22
|
+
return props;
|
23
|
+
}
|
24
|
+
// Create a copy of props so we don't modify the original
|
25
|
+
props = {
|
26
|
+
...props
|
27
|
+
};
|
28
|
+
const { generatedControlId , hintId , labelFor , labelId , required , validationMessageId , validationState } = context;
|
29
|
+
if (generatedControlId) {
|
30
|
+
var _id;
|
31
|
+
(_id = (_props = props).id) !== null && _id !== void 0 ? _id : _props.id = generatedControlId;
|
32
|
+
}
|
33
|
+
// Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer
|
34
|
+
// to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).
|
35
|
+
if (labelId && (!(options === null || options === void 0 ? void 0 : options.supportsLabelFor) || labelFor !== props.id)) {
|
36
|
+
var _;
|
37
|
+
(_ = (_props1 = props)[_arialabelledby = 'aria-labelledby']) !== null && _ !== void 0 ? _ : _props1[_arialabelledby] = labelId;
|
38
|
+
}
|
39
|
+
// The control is described by the validation message, or hint, or both.
|
40
|
+
// We also preserve and append any aria-describedby from props.
|
41
|
+
// For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933
|
42
|
+
if (validationMessageId || hintId) {
|
43
|
+
// NOTE: Not using ??= since we're merging and overriding the user-provided value.
|
44
|
+
props['aria-describedby'] = [
|
45
|
+
validationMessageId,
|
46
|
+
hintId,
|
47
|
+
props === null || props === void 0 ? void 0 : props['aria-describedby']
|
48
|
+
].filter(Boolean).join(' ');
|
49
|
+
}
|
50
|
+
if (validationState === 'error') {
|
51
|
+
var _1;
|
52
|
+
(_1 = (_props2 = props)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _props2[_ariainvalid] = true;
|
53
|
+
}
|
54
|
+
if (required) {
|
55
|
+
if (options === null || options === void 0 ? void 0 : options.supportsRequired) {
|
56
|
+
var _required;
|
57
|
+
(_required = (_props3 = props).required) !== null && _required !== void 0 ? _required : _props3.required = true;
|
58
|
+
} else {
|
59
|
+
var _2;
|
60
|
+
(_2 = (_props4 = props)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _props4[_ariarequired] = true;
|
61
|
+
}
|
62
|
+
}
|
63
|
+
// Include the size prop if this control supports it
|
64
|
+
if (options === null || options === void 0 ? void 0 : options.supportsSize) {
|
65
|
+
var _size;
|
66
|
+
(_size = (_props5 = props).size) !== null && _size !== void 0 ? _size : _props5.size = context.size;
|
67
|
+
}
|
68
|
+
return props;
|
69
|
+
} //# sourceMappingURL=useFieldControlProps.js.map
|
70
|
+
|
71
|
+
//# sourceMappingURL=useFieldControlProps.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../lib/contexts/useFieldControlProps.js"],"sourcesContent":["var _props, _props1, _arialabelledby, _props2, _ariainvalid, _props3, _props4, _ariarequired, _props5;\nimport { useFieldContext_unstable } from './FieldContext';\nexport function useFieldControlProps_unstable(props, options) {\n return getFieldControlProps(useFieldContext_unstable(), props, options);\n}\n/**\n * @internal\n * Implementation of useFieldControlProps_unstable.\n * Split out so it can be used directly in renderField_unstable.\n */\nexport function getFieldControlProps(context, props, options) {\n if (!context) {\n return props;\n }\n // Create a copy of props so we don't modify the original\n props = {\n ...props\n };\n const {\n generatedControlId,\n hintId,\n labelFor,\n labelId,\n required,\n validationMessageId,\n validationState\n } = context;\n if (generatedControlId) {\n var _id;\n (_id = (_props = props).id) !== null && _id !== void 0 ? _id : _props.id = generatedControlId;\n }\n // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer\n // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).\n if (labelId && (!(options === null || options === void 0 ? void 0 : options.supportsLabelFor) || labelFor !== props.id)) {\n var _;\n (_ = (_props1 = props)[_arialabelledby = 'aria-labelledby']) !== null && _ !== void 0 ? _ : _props1[_arialabelledby] = labelId;\n }\n // The control is described by the validation message, or hint, or both.\n // We also preserve and append any aria-describedby from props.\n // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933\n if (validationMessageId || hintId) {\n // NOTE: Not using ??= since we're merging and overriding the user-provided value.\n props['aria-describedby'] = [validationMessageId, hintId, props === null || props === void 0 ? void 0 : props['aria-describedby']].filter(Boolean).join(' ');\n }\n if (validationState === 'error') {\n var _1;\n (_1 = (_props2 = props)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _props2[_ariainvalid] = true;\n }\n if (required) {\n if (options === null || options === void 0 ? void 0 : options.supportsRequired) {\n var _required;\n (_required = (_props3 = props).required) !== null && _required !== void 0 ? _required : _props3.required = true;\n } else {\n var _2;\n (_2 = (_props4 = props)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _props4[_ariarequired] = true;\n }\n }\n // Include the size prop if this control supports it\n if (options === null || options === void 0 ? void 0 : options.supportsSize) {\n var _size;\n (_size = (_props5 = props).size) !== null && _size !== void 0 ? _size : _props5.size = context.size;\n }\n return props;\n}\n//# sourceMappingURL=useFieldControlProps.js.map"],"names":["useFieldControlProps_unstable","getFieldControlProps","_props","_props1","_arialabelledby","_props2","_ariainvalid","_props3","_props4","_ariarequired","_props5","props","options","useFieldContext_unstable","context","generatedControlId","hintId","labelFor","labelId","required","validationMessageId","validationState","_id","id","supportsLabelFor","_","filter","Boolean","join","_1","supportsRequired","_required","_2","supportsSize","_size","size"],"mappings":"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"}
|
package/lib-commonjs/index.js
CHANGED
@@ -1,34 +1,29 @@
|
|
1
1
|
"use strict";
|
2
|
-
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
4
|
-
|
5
|
-
});
|
6
|
-
exports.useField_unstable = exports.useFieldStyles_unstable = exports.renderField_unstable = exports.getFieldClassNames = void 0;
|
7
|
-
|
8
|
-
var Field_1 = /*#__PURE__*/require("./Field");
|
9
|
-
|
10
|
-
Object.defineProperty(exports, "getFieldClassNames", {
|
11
|
-
enumerable: true,
|
12
|
-
get: function () {
|
13
|
-
return Field_1.getFieldClassNames;
|
14
|
-
}
|
3
|
+
value: true
|
15
4
|
});
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
}
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
5
|
+
function _export(target, all) {
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
7
|
+
enumerable: true,
|
8
|
+
get: all[name]
|
9
|
+
});
|
10
|
+
}
|
11
|
+
_export(exports, {
|
12
|
+
Field: ()=>_field.Field,
|
13
|
+
fieldClassNames: ()=>_field.fieldClassNames,
|
14
|
+
renderField_unstable: ()=>_field.renderField_unstable,
|
15
|
+
useFieldStyles_unstable: ()=>_field.useFieldStyles_unstable,
|
16
|
+
useField_unstable: ()=>_field.useField_unstable,
|
17
|
+
FieldContextProvider: ()=>_index.FieldContextProvider,
|
18
|
+
useFieldContext_unstable: ()=>_index.useFieldContext_unstable,
|
19
|
+
useFieldContextValues_unstable: ()=>_index.useFieldContextValues_unstable,
|
20
|
+
useFieldControlProps_unstable: ()=>_index.useFieldControlProps_unstable,
|
21
|
+
getDeprecatedFieldClassNames: ()=>_makeDeprecatedField.getDeprecatedFieldClassNames,
|
22
|
+
makeDeprecatedField: ()=>_makeDeprecatedField.makeDeprecatedField
|
33
23
|
});
|
24
|
+
const _field = require("./Field");
|
25
|
+
const _index = require("./contexts/index");
|
26
|
+
const _makeDeprecatedField = require("./util/makeDeprecatedField");
|
27
|
+
//# sourceMappingURL=index.js.map
|
28
|
+
|
34
29
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["../lib/index.js"],"sourcesContent":["export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport { FieldContextProvider, useFieldContext_unstable, useFieldContextValues_unstable, useFieldControlProps_unstable } from './contexts/index';\n// eslint-disable-next-line deprecation/deprecation\nexport { getDeprecatedFieldClassNames, makeDeprecatedField } from './util/makeDeprecatedField';\n//# sourceMappingURL=index.js.map"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable","getDeprecatedFieldClassNames","makeDeprecatedField"],"mappings":";;;;;;;;;;;IAASA,KAAK,MAALA,YAAK;IAAEC,eAAe,MAAfA,sBAAe;IAAEC,oBAAoB,MAApBA,2BAAoB;IAAEC,uBAAuB,MAAvBA,8BAAuB;IAAEC,iBAAiB,MAAjBA,wBAAiB;IACxFC,oBAAoB,MAApBA,2BAAoB;IAAEC,wBAAwB,MAAxBA,+BAAwB;IAAEC,8BAA8B,MAA9BA,qCAA8B;IAAEC,6BAA6B,MAA7BA,oCAA6B;IAE7GC,4BAA4B,MAA5BA,iDAA4B;IAAEC,mBAAmB,MAAnBA,wCAAmB;;uBAH+C;uBACqB;qCAE5D;CAClE,iCAAiC"}
|