@fluentui/react-field 9.1.5 → 9.1.6
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +46 -1
- package/CHANGELOG.md +16 -2
- package/lib/Field.js +0 -1
- package/lib/Field.js.map +1 -1
- package/lib/components/Field/Field.js +5 -6
- package/lib/components/Field/Field.js.map +1 -1
- package/lib/components/Field/Field.types.js +0 -1
- package/lib/components/Field/Field.types.js.map +1 -1
- package/lib/components/Field/index.js +0 -1
- package/lib/components/Field/index.js.map +1 -1
- package/lib/components/Field/renderField.js +10 -17
- package/lib/components/Field/renderField.js.map +1 -1
- package/lib/components/Field/useField.js +60 -66
- package/lib/components/Field/useField.js.map +1 -1
- package/lib/components/Field/useFieldStyles.styles.js.map +1 -1
- package/lib/contexts/FieldContext.js +2 -3
- package/lib/contexts/FieldContext.js.map +1 -1
- package/lib/contexts/index.js +0 -1
- package/lib/contexts/index.js.map +1 -1
- package/lib/contexts/useFieldContextValues.js +31 -29
- package/lib/contexts/useFieldContextValues.js.map +1 -1
- package/lib/contexts/useFieldControlProps.js +49 -55
- package/lib/contexts/useFieldControlProps.js.map +1 -1
- package/lib/index.js +0 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/Field.js +0 -3
- package/lib-commonjs/Field.js.map +1 -1
- package/lib-commonjs/components/Field/Field.js +1 -3
- package/lib-commonjs/components/Field/Field.js.map +1 -1
- package/lib-commonjs/components/Field/Field.types.js +0 -3
- package/lib-commonjs/components/Field/Field.types.js.map +1 -1
- package/lib-commonjs/components/Field/index.js +0 -3
- package/lib-commonjs/components/Field/index.js.map +1 -1
- package/lib-commonjs/components/Field/renderField.js +1 -3
- package/lib-commonjs/components/Field/renderField.js.map +1 -1
- package/lib-commonjs/components/Field/useField.js +1 -3
- package/lib-commonjs/components/Field/useField.js.map +1 -1
- package/lib-commonjs/components/Field/useFieldStyles.styles.js +0 -2
- package/lib-commonjs/components/Field/useFieldStyles.styles.js.map +1 -1
- package/lib-commonjs/contexts/FieldContext.js +1 -3
- package/lib-commonjs/contexts/FieldContext.js.map +1 -1
- package/lib-commonjs/contexts/index.js +0 -3
- package/lib-commonjs/contexts/index.js.map +1 -1
- package/lib-commonjs/contexts/useFieldContextValues.js +1 -3
- package/lib-commonjs/contexts/useFieldContextValues.js.map +1 -1
- package/lib-commonjs/contexts/useFieldControlProps.js +1 -3
- package/lib-commonjs/contexts/useFieldControlProps.js.map +1 -1
- package/lib-commonjs/index.js +0 -3
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +7 -7
package/CHANGELOG.json
CHANGED
@@ -2,7 +2,52 @@
|
|
2
2
|
"name": "@fluentui/react-field",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "
|
5
|
+
"date": "Wed, 31 May 2023 06:42:56 GMT",
|
6
|
+
"tag": "@fluentui/react-field_v9.1.6",
|
7
|
+
"version": "9.1.6",
|
8
|
+
"comments": {
|
9
|
+
"patch": [
|
10
|
+
{
|
11
|
+
"author": "seanmonahan@microsoft.com",
|
12
|
+
"package": "@fluentui/react-field",
|
13
|
+
"commit": "d640b972d7ac86bfb76ae6c6329f12cdd33b3b7c",
|
14
|
+
"comment": "chore: Update Griffel to v1.5.7."
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"author": "beachball",
|
18
|
+
"package": "@fluentui/react-field",
|
19
|
+
"comment": "Bump @fluentui/react-context-selector to v9.1.22",
|
20
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
21
|
+
},
|
22
|
+
{
|
23
|
+
"author": "beachball",
|
24
|
+
"package": "@fluentui/react-field",
|
25
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.6",
|
26
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
27
|
+
},
|
28
|
+
{
|
29
|
+
"author": "beachball",
|
30
|
+
"package": "@fluentui/react-field",
|
31
|
+
"comment": "Bump @fluentui/react-label to v9.1.15",
|
32
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
33
|
+
},
|
34
|
+
{
|
35
|
+
"author": "beachball",
|
36
|
+
"package": "@fluentui/react-field",
|
37
|
+
"comment": "Bump @fluentui/react-utilities to v9.9.2",
|
38
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
39
|
+
},
|
40
|
+
{
|
41
|
+
"author": "beachball",
|
42
|
+
"package": "@fluentui/react-field",
|
43
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.22",
|
44
|
+
"commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
|
45
|
+
}
|
46
|
+
]
|
47
|
+
}
|
48
|
+
},
|
49
|
+
{
|
50
|
+
"date": "Thu, 25 May 2023 10:00:48 GMT",
|
6
51
|
"tag": "@fluentui/react-field_v9.1.5",
|
7
52
|
"version": "9.1.5",
|
8
53
|
"comments": {
|
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,26 @@
|
|
1
1
|
# Change Log - @fluentui/react-field
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Wed, 31 May 2023 06:42:56 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.1.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.1.6)
|
8
|
+
|
9
|
+
Wed, 31 May 2023 06:42:56 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.1.5..@fluentui/react-field_v9.1.6)
|
11
|
+
|
12
|
+
### Patches
|
13
|
+
|
14
|
+
- chore: Update Griffel to v1.5.7. ([PR #27925](https://github.com/microsoft/fluentui/pull/27925) by seanmonahan@microsoft.com)
|
15
|
+
- Bump @fluentui/react-context-selector to v9.1.22 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
16
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.6 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
17
|
+
- Bump @fluentui/react-label to v9.1.15 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
18
|
+
- Bump @fluentui/react-utilities to v9.9.2 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
19
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.22 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
|
20
|
+
|
7
21
|
## [9.1.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.1.5)
|
8
22
|
|
9
|
-
Thu, 25 May 2023
|
23
|
+
Thu, 25 May 2023 10:00:48 GMT
|
10
24
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.1.4..@fluentui/react-field_v9.1.5)
|
11
25
|
|
12
26
|
### Patches
|
package/lib/Field.js
CHANGED
package/lib/Field.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["Field.ts"],"sourcesContent":["export * from './components/Field/index';\n"],"names":[],"mappings":"AAAA,cAAc,2BAA2B"}
|
@@ -3,11 +3,10 @@ import { renderField_unstable } from './renderField';
|
|
3
3
|
import { useField_unstable } from './useField';
|
4
4
|
import { useFieldStyles_unstable } from './useFieldStyles.styles';
|
5
5
|
import { useFieldContextValues_unstable } from '../../contexts/index';
|
6
|
-
export const Field = /*#__PURE__*/React.forwardRef((props, ref)
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
6
|
+
export const Field = /*#__PURE__*/ React.forwardRef((props, ref)=>{
|
7
|
+
const state = useField_unstable(props, ref);
|
8
|
+
useFieldStyles_unstable(state);
|
9
|
+
const context = useFieldContextValues_unstable(state);
|
10
|
+
return renderField_unstable(state, context);
|
11
11
|
});
|
12
12
|
Field.displayName = 'Field';
|
13
|
-
//# sourceMappingURL=Field.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from './Field.types';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles.styles';\nimport { useFieldContextValues_unstable } from '../../contexts/index';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n const state = useField_unstable(props, ref);\n useFieldStyles_unstable(state);\n const context = useFieldContextValues_unstable(state);\n return renderField_unstable(state, context);\n});\n\nField.displayName = 'Field';\n"],"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","useFieldContextValues_unstable","Field","forwardRef","props","ref","state","context","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,iBAAiB,QAAQ,aAAa;AAC/C,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,8BAA8B,QAAQ,uBAAuB;AAEtE,OAAO,MAAMC,sBAAyCL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACrF,MAAMC,QAAQP,kBAAkBK,OAAOC;IACvCL,wBAAwBM;IACxB,MAAMC,UAAUN,+BAA+BK;IAC/C,OAAOR,qBAAqBQ,OAAOC;AACrC,GAAG;AAEHL,MAAMM,WAAW,GAAG"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["Field.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * The props added to the control inside the Field.\n */\nexport type FieldControlProps = Pick<\n React.HTMLAttributes<HTMLElement>,\n 'id' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-required'\n>;\n\n/**\n * Slots of the Field component\n */\nexport type FieldSlots = {\n root: NonNullable<Slot<'div'>>;\n\n /**\n * The label associated with the field.\n */\n label?: Slot<typeof Label>;\n\n /**\n * A message about the validation state. By default, this is an error message, but it can be a success, warning,\n * or custom message by setting `validationState`.\n */\n validationMessage?: Slot<'div'>;\n\n /**\n * The icon associated with the `validationMessage`. This will only be displayed if `validationMessage` is set.\n *\n * The default depends on `validationState`:\n * * error: `<ErrorCircle12Filled />`\n * * warning: `<Warning12Filled />`\n * * success: `<CheckmarkCircle12Filled />`\n * * none: `null`\n */\n validationMessageIcon?: Slot<'span'>;\n\n /**\n * Additional hint text below the field.\n */\n hint?: Slot<'div'>;\n};\n\n/**\n * Field Props\n */\nexport type FieldProps = Omit<ComponentProps<FieldSlots>, 'children'> & {\n /**\n * The Field's child can be a single form control, or a render function that takes the props that should be spread on\n * a form control.\n *\n * All form controls in this library can be used directly as children (such as `<Input>` or `<RadioGroup>`).\n *\n * For other controls, there are two options:\n * 1. The child of Field can be a render function that is given the props that should be spread on the control.\n * `<Field>{(props) => <MyInput {...props} />}</Field>`\n * 2. The control itself can merge props from field with useFieldControlProps_unstable().\n * `props = useFieldControlProps_unstable(props);`\n */\n children?: React.ReactNode | ((props: FieldControlProps) => React.ReactNode);\n\n /**\n * The orientation of the label relative to the field component.\n * This only affects the label, and not the validationMessage or hint (which always appear below the field component).\n *\n * @default vertical\n */\n orientation?: 'vertical' | 'horizontal';\n\n /**\n * The `validationState` affects the display of the `validationMessage` and `validationMessageIcon`.\n *\n * * error: (default) The validation message has a red error icon and red text, with `role=\"alert\"` so it is\n * announced by screen readers. Additionally, the control inside the field has `aria-invalid` set, which adds a\n * red border to some field components (such as `Input`).\n * * success: The validation message has a green checkmark icon and gray text.\n * * warning: The validation message has a yellow exclamation icon and gray text.\n * * none: The validation message has no icon and gray text.\n *\n * @default error when validationMessage is set; none otherwise.\n */\n validationState?: 'error' | 'warning' | 'success' | 'none';\n\n /**\n * Marks the Field as required. If `true`, an asterisk will be appended to the label, and `aria-required` will be set\n * on the Field's child.\n */\n required?: boolean;\n\n /**\n * The size of the Field's label.\n *\n * @default medium\n */\n size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering Field\n */\nexport type FieldState = ComponentState<Required<FieldSlots>> &\n Required<Pick<FieldProps, 'orientation' | 'required' | 'size' | 'validationState'>> &\n Pick<FieldProps, 'children'> & {\n /**\n * The ID generated for the control inside the field, and the default value of label.htmlFor prop.\n */\n generatedControlId: string;\n };\n\nexport type FieldContextValue = Readonly<\n Pick<FieldState, 'generatedControlId' | 'orientation' | 'required' | 'size' | 'validationState'> & {\n /** The label's for prop. Undefined if there is no label. */\n labelFor?: string;\n /** The label's id prop. Undefined if there is no label. */\n labelId?: string;\n /** The validationMessage's id prop. Undefined if there is no validationMessage. */\n validationMessageId?: string;\n /** The hint's id prop. Undefined if there is no hint. */\n hintId?: string;\n }\n>;\n\nexport type FieldContextValues = {\n field: FieldContextValue;\n};\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Field.types';\nexport * from './Field';\nexport * from './renderField';\nexport * from './useField';\nexport * from './useFieldStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,gBAAgB;AAC9B,cAAc,aAAa;AAC3B,cAAc,0BAA0B"}
|
@@ -1,22 +1,15 @@
|
|
1
|
-
/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
|
1
|
+
/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
|
2
2
|
import { getSlotsNext } from '@fluentui/react-utilities';
|
3
3
|
import { FieldContextProvider, getFieldControlProps } from '../../contexts/index';
|
4
4
|
/**
|
5
5
|
* Render the final JSX of Field
|
6
|
-
*/
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
if (typeof children === 'function') {
|
16
|
-
children = children(getFieldControlProps(contextValues.field) || {});
|
17
|
-
}
|
18
|
-
return /*#__PURE__*/createElement(FieldContextProvider, {
|
19
|
-
value: contextValues === null || contextValues === void 0 ? void 0 : contextValues.field
|
20
|
-
}, /*#__PURE__*/createElement(slots.root, slotProps.root, slots.label && /*#__PURE__*/createElement(slots.label, slotProps.label), children, slots.validationMessage && /*#__PURE__*/createElement(slots.validationMessage, slotProps.validationMessage, slots.validationMessageIcon && /*#__PURE__*/createElement(slots.validationMessageIcon, slotProps.validationMessageIcon), slotProps.validationMessage.children), slots.hint && /*#__PURE__*/createElement(slots.hint, slotProps.hint)));
|
6
|
+
*/ export const renderField_unstable = (state, contextValues)=>{
|
7
|
+
const { slots , slotProps } = getSlotsNext(state);
|
8
|
+
let { children } = state;
|
9
|
+
if (typeof children === 'function') {
|
10
|
+
children = children(getFieldControlProps(contextValues.field) || {});
|
11
|
+
}
|
12
|
+
return /*#__PURE__*/ createElement(FieldContextProvider, {
|
13
|
+
value: contextValues === null || contextValues === void 0 ? void 0 : contextValues.field
|
14
|
+
}, /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.label && /*#__PURE__*/ createElement(slots.label, slotProps.label), children, slots.validationMessage && /*#__PURE__*/ createElement(slots.validationMessage, slotProps.validationMessage, slots.validationMessageIcon && /*#__PURE__*/ createElement(slots.validationMessageIcon, slotProps.validationMessageIcon), slotProps.validationMessage.children), slots.hint && /*#__PURE__*/ createElement(slots.hint, slotProps.hint)));
|
21
15
|
};
|
22
|
-
//# sourceMappingURL=renderField.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["renderField.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { FieldContextProvider, getFieldControlProps } from '../../contexts/index';\nimport type { FieldContextValues, FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldState, contextValues: FieldContextValues) => {\n const { slots, slotProps } = getSlotsNext<FieldSlots>(state);\n\n let { children } = state;\n if (typeof children === 'function') {\n children = children(getFieldControlProps(contextValues.field) || {});\n }\n\n return (\n <FieldContextProvider value={contextValues?.field}>\n <slots.root {...slotProps.root}>\n {slots.label && <slots.label {...slotProps.label} />}\n {children}\n {slots.validationMessage && (\n <slots.validationMessage {...slotProps.validationMessage}>\n {slots.validationMessageIcon && <slots.validationMessageIcon {...slotProps.validationMessageIcon} />}\n {slotProps.validationMessage.children}\n </slots.validationMessage>\n )}\n {slots.hint && <slots.hint {...slotProps.hint} />}\n </slots.root>\n </FieldContextProvider>\n );\n};\n"],"names":["createElement","getSlotsNext","FieldContextProvider","getFieldControlProps","renderField_unstable","state","contextValues","slots","slotProps","children","field","value","root","label","validationMessage","validationMessageIcon","hint"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,oBAAoB,EAAEC,oBAAoB,QAAQ,uBAAuB;AAGlF;;CAEC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAmBC,gBAAsC;IAC5F,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGP,aAAyBI;IAEtD,IAAI,EAAEI,SAAQ,EAAE,GAAGJ;IACnB,IAAI,OAAOI,aAAa,YAAY;QAClCA,WAAWA,SAASN,qBAAqBG,cAAcI,KAAK,KAAK,CAAC;IACpE,CAAC;IAED,qBACE,AApBJ,cAoBKR;QAAqBS,OAAOL,0BAAAA,2BAAAA,KAAAA,IAAAA,cAAeI,KAAK;qBAC/C,AArBN,cAqBOH,MAAMK,IAAI,EAAKJ,UAAUI,IAAI,EAC3BL,MAAMM,KAAK,kBAAI,AAtBxB,cAsByBN,MAAMM,KAAK,EAAKL,UAAUK,KAAK,GAC/CJ,UACAF,MAAMO,iBAAiB,kBACtB,AAzBV,cAyBWP,MAAMO,iBAAiB,EAAKN,UAAUM,iBAAiB,EACrDP,MAAMQ,qBAAqB,kBAAI,AA1B5C,cA0B6CR,MAAMQ,qBAAqB,EAAKP,UAAUO,qBAAqB,GAC/FP,UAAUM,iBAAiB,CAACL,QAAQ,GAGxCF,MAAMS,IAAI,kBAAI,AA9BvB,cA8BwBT,MAAMS,IAAI,EAAKR,UAAUQ,IAAI;AAIrD,EAAE"}
|
@@ -3,10 +3,10 @@ import { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@
|
|
3
3
|
import { Label } from '@fluentui/react-label';
|
4
4
|
import { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';
|
5
5
|
const validationMessageIcons = {
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
6
|
+
error: /*#__PURE__*/ React.createElement(ErrorCircle12Filled, null),
|
7
|
+
warning: /*#__PURE__*/ React.createElement(Warning12Filled, null),
|
8
|
+
success: /*#__PURE__*/ React.createElement(CheckmarkCircle12Filled, null),
|
9
|
+
none: undefined
|
10
10
|
};
|
11
11
|
/**
|
12
12
|
* Create the state required to render Field.
|
@@ -16,66 +16,60 @@ const validationMessageIcons = {
|
|
16
16
|
*
|
17
17
|
* @param props - Props passed to this field
|
18
18
|
* @param ref - Ref to the root
|
19
|
-
*/
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
label,
|
76
|
-
validationMessageIcon,
|
77
|
-
validationMessage,
|
78
|
-
hint
|
79
|
-
};
|
19
|
+
*/ export const useField_unstable = (props, ref)=>{
|
20
|
+
const { children , orientation ='vertical' , required =false , validationState =props.validationMessage ? 'error' : 'none' , size ='medium' } = props;
|
21
|
+
const baseId = useId('field-');
|
22
|
+
const generatedControlId = baseId + '__control';
|
23
|
+
const root = getNativeElementProps('div', {
|
24
|
+
...props,
|
25
|
+
ref
|
26
|
+
}, /*excludedPropNames:*/ [
|
27
|
+
'children'
|
28
|
+
]);
|
29
|
+
const label = resolveShorthand(props.label, {
|
30
|
+
defaultProps: {
|
31
|
+
htmlFor: generatedControlId,
|
32
|
+
id: baseId + '__label',
|
33
|
+
required,
|
34
|
+
size
|
35
|
+
}
|
36
|
+
});
|
37
|
+
const validationMessage = resolveShorthand(props.validationMessage, {
|
38
|
+
defaultProps: {
|
39
|
+
id: baseId + '__validationMessage',
|
40
|
+
role: validationState === 'error' ? 'alert' : undefined
|
41
|
+
}
|
42
|
+
});
|
43
|
+
const hint = resolveShorthand(props.hint, {
|
44
|
+
defaultProps: {
|
45
|
+
id: baseId + '__hint'
|
46
|
+
}
|
47
|
+
});
|
48
|
+
const defaultIcon = validationMessageIcons[validationState];
|
49
|
+
const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {
|
50
|
+
required: !!defaultIcon,
|
51
|
+
defaultProps: {
|
52
|
+
children: defaultIcon
|
53
|
+
}
|
54
|
+
});
|
55
|
+
return {
|
56
|
+
children,
|
57
|
+
generatedControlId,
|
58
|
+
orientation,
|
59
|
+
required,
|
60
|
+
size,
|
61
|
+
validationState,
|
62
|
+
components: {
|
63
|
+
root: 'div',
|
64
|
+
label: Label,
|
65
|
+
validationMessage: 'div',
|
66
|
+
validationMessageIcon: 'span',
|
67
|
+
hint: 'div'
|
68
|
+
},
|
69
|
+
root,
|
70
|
+
label,
|
71
|
+
validationMessageIcon,
|
72
|
+
validationMessage,
|
73
|
+
hint
|
74
|
+
};
|
80
75
|
};
|
81
|
-
//# sourceMappingURL=useField.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\n\nconst validationMessageIcons = {\n error: <ErrorCircle12Filled />,\n warning: <Warning12Filled />,\n success: <CheckmarkCircle12Filled />,\n none: undefined,\n} as const;\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: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n const {\n children,\n orientation = 'vertical',\n required = false,\n validationState = props.validationMessage ? 'error' : 'none',\n size = 'medium',\n } = props;\n\n const baseId = useId('field-');\n const generatedControlId = baseId + '__control';\n\n const root = getNativeElementProps('div', { ...props, ref }, /*excludedPropNames:*/ ['children']);\n\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: generatedControlId,\n id: baseId + '__label',\n required,\n size,\n },\n });\n\n const validationMessage = resolveShorthand(props.validationMessage, {\n defaultProps: {\n id: baseId + '__validationMessage',\n role: validationState === 'error' ? 'alert' : undefined,\n },\n });\n\n const hint = resolveShorthand(props.hint, {\n defaultProps: {\n id: baseId + '__hint',\n },\n });\n\n const defaultIcon = validationMessageIcons[validationState];\n const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {\n required: !!defaultIcon,\n defaultProps: {\n children: defaultIcon,\n },\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"],"names":["React","CheckmarkCircle12Filled","ErrorCircle12Filled","Warning12Filled","Label","getNativeElementProps","resolveShorthand","useId","validationMessageIcons","error","warning","success","none","undefined","useField_unstable","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","generatedControlId","root","label","defaultProps","htmlFor","id","role","hint","defaultIcon","validationMessageIcon","components"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,EAAEC,mBAAmB,EAAEC,eAAe,QAAQ,wBAAwB;AACtG,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,4BAA4B;AAG3F,MAAMC,yBAAyB;IAC7BC,qBAAO,oBAACP;IACRQ,uBAAS,oBAACP;IACVQ,uBAAS,oBAACV;IACVW,MAAMC;AACR;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,oBAAoB,CAACC,OAAmBC,MAA+C;IAClG,MAAM,EACJC,SAAQ,EACRC,aAAc,WAAU,EACxBC,UAAW,KAAK,CAAA,EAChBC,iBAAkBL,MAAMM,iBAAiB,GAAG,UAAU,MAAM,CAAA,EAC5DC,MAAO,SAAQ,EAChB,GAAGP;IAEJ,MAAMQ,SAAShB,MAAM;IACrB,MAAMiB,qBAAqBD,SAAS;IAEpC,MAAME,OAAOpB,sBAAsB,OAAO;QAAE,GAAGU,KAAK;QAAEC;IAAI,GAAG,oBAAoB,GAAG;QAAC;KAAW;IAEhG,MAAMU,QAAQpB,iBAAiBS,MAAMW,KAAK,EAAE;QAC1CC,cAAc;YACZC,SAASJ;YACTK,IAAIN,SAAS;YACbJ;YACAG;QACF;IACF;IAEA,MAAMD,oBAAoBf,iBAAiBS,MAAMM,iBAAiB,EAAE;QAClEM,cAAc;YACZE,IAAIN,SAAS;YACbO,MAAMV,oBAAoB,UAAU,UAAUP,SAAS;QACzD;IACF;IAEA,MAAMkB,OAAOzB,iBAAiBS,MAAMgB,IAAI,EAAE;QACxCJ,cAAc;YACZE,IAAIN,SAAS;QACf;IACF;IAEA,MAAMS,cAAcxB,sBAAsB,CAACY,gBAAgB;IAC3D,MAAMa,wBAAwB3B,iBAAiBS,MAAMkB,qBAAqB,EAAE;QAC1Ed,UAAU,CAAC,CAACa;QACZL,cAAc;YACZV,UAAUe;QACZ;IACF;IAEA,OAAO;QACLf;QACAO;QACAN;QACAC;QACAG;QACAF;QACAc,YAAY;YACVT,MAAM;YACNC,OAAOtB;YACPiB,mBAAmB;YACnBY,uBAAuB;YACvBF,MAAM;QACR;QACAN;QACAC;QACAO;QACAZ;QACAU;IACF;AACF,EAAE"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","z8tnut","Byoj8tv","large","vertical","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","orientation","rootStyles","className","labelStyles","size","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["
|
1
|
+
{"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","z8tnut","Byoj8tv","large","vertical","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","orientation","rootStyles","className","labelStyles","size","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["useFieldStyles.styles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, 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 */ const useRootStyles = makeStyles({\n base: {\n display: 'grid'\n },\n // In horizontal layout, the field is a grid with the label taking up the entire first column.\n // The last row is slack space in case the label is taller than the rest of the content.\n horizontal: {\n gridTemplateColumns: '33% 1fr',\n gridTemplateRows: 'auto auto auto 1fr'\n },\n // In horizontal layout without a label, replace the label's column with padding.\n // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n horizontalNoLabel: {\n paddingLeft: '33%',\n gridTemplateColumns: '1fr'\n }\n});\nconst useLabelStyles = makeStyles({\n base: {\n paddingTop: tokens.spacingVerticalXXS,\n paddingBottom: tokens.spacingVerticalXXS\n },\n large: {\n paddingTop: '1px',\n paddingBottom: '1px'\n },\n vertical: {\n marginBottom: tokens.spacingVerticalXXS\n },\n verticalLarge: {\n marginBottom: tokens.spacingVerticalXS\n },\n horizontal: {\n marginRight: tokens.spacingHorizontalM,\n gridRowStart: '1',\n gridRowEnd: '-1'\n }\n});\nconst useSecondaryTextBaseClassName = makeResetStyles({\n marginTop: tokens.spacingVerticalXXS,\n color: tokens.colorNeutralForeground3,\n ...typographyStyles.caption1\n});\nconst useSecondaryTextStyles = makeStyles({\n error: {\n color: tokens.colorPaletteRedForeground1\n },\n withIcon: {\n // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`\n }\n});\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n display: 'inline-block',\n fontSize: iconSize,\n // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n marginRight: tokens.spacingHorizontalXS,\n // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n lineHeight: '0',\n // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n verticalAlign: '-1px'\n});\nconst useValidationMessageIconStyles = makeStyles({\n error: {\n color: tokens.colorPaletteRedForeground1\n },\n warning: {\n color: tokens.colorPaletteDarkOrangeForeground1\n },\n success: {\n color: tokens.colorPaletteGreenForeground1\n }\n});\n/**\n * Apply styling to the Field slots based on the state\n */ export const useFieldStyles_unstable = (state)=>{\n const { validationState } = 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"],"mappings":"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"}
|
@@ -1,5 +1,4 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
const FieldContext =
|
2
|
+
const FieldContext = React.createContext(undefined);
|
3
3
|
export const FieldContextProvider = FieldContext.Provider;
|
4
|
-
export const useFieldContext_unstable = ()
|
5
|
-
//# sourceMappingURL=FieldContext.js.map
|
4
|
+
export const useFieldContext_unstable = ()=>React.useContext(FieldContext);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["FieldContext.ts"],"sourcesContent":["import * as React from 'react';\n\nimport type { FieldContextValue } from '../Field';\n\nconst FieldContext = React.createContext<FieldContextValue | undefined>(undefined);\n\nexport const FieldContextProvider = FieldContext.Provider;\n\nexport const useFieldContext_unstable = () => React.useContext(FieldContext);\n"],"names":["React","FieldContext","createContext","undefined","FieldContextProvider","Provider","useFieldContext_unstable","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,MAAMC,eAAeD,MAAME,aAAa,CAAgCC;AAExE,OAAO,MAAMC,uBAAuBH,aAAaI,QAAQ,CAAC;AAE1D,OAAO,MAAMC,2BAA2B,IAAMN,MAAMO,UAAU,CAACN,cAAc"}
|
package/lib/contexts/index.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './FieldContext';\nexport * from './useFieldContextValues';\nexport * from './useFieldControlProps';\n"],"names":[],"mappings":"AAAA,cAAc,iBAAiB;AAC/B,cAAc,0BAA0B;AACxC,cAAc,yBAAyB"}
|
@@ -1,33 +1,35 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
/**
|
3
3
|
* Get the context values used when rendering Field.
|
4
|
-
*/
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
4
|
+
*/ export const useFieldContextValues_unstable = (state)=>{
|
5
|
+
var _state_label, _state_label1, _state_validationMessage, _state_hint;
|
6
|
+
const { generatedControlId , orientation , required , size , validationState } = state;
|
7
|
+
const labelFor = (_state_label = state.label) === null || _state_label === void 0 ? void 0 : _state_label.htmlFor;
|
8
|
+
const labelId = (_state_label1 = state.label) === null || _state_label1 === void 0 ? void 0 : _state_label1.id;
|
9
|
+
const validationMessageId = (_state_validationMessage = state.validationMessage) === null || _state_validationMessage === void 0 ? void 0 : _state_validationMessage.id;
|
10
|
+
const hintId = (_state_hint = state.hint) === null || _state_hint === void 0 ? void 0 : _state_hint.id;
|
11
|
+
const field = React.useMemo(()=>({
|
12
|
+
generatedControlId,
|
13
|
+
hintId,
|
14
|
+
labelFor,
|
15
|
+
labelId,
|
16
|
+
orientation,
|
17
|
+
required,
|
18
|
+
size,
|
19
|
+
validationMessageId,
|
20
|
+
validationState
|
21
|
+
}), [
|
22
|
+
generatedControlId,
|
23
|
+
hintId,
|
24
|
+
labelFor,
|
25
|
+
labelId,
|
26
|
+
orientation,
|
27
|
+
required,
|
28
|
+
size,
|
29
|
+
validationMessageId,
|
30
|
+
validationState
|
31
|
+
]);
|
32
|
+
return {
|
33
|
+
field
|
34
|
+
};
|
32
35
|
};
|
33
|
-
//# sourceMappingURL=useFieldContextValues.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["useFieldContextValues.ts"],"sourcesContent":["import * as React from 'react';\n\nimport type { FieldContextValue, FieldContextValues, FieldState } from '../Field';\n\n/**\n * Get the context values used when rendering Field.\n */\nexport const useFieldContextValues_unstable = (state: FieldState): FieldContextValues => {\n const { generatedControlId, orientation, required, size, validationState } = state;\n const labelFor = state.label?.htmlFor;\n const labelId = state.label?.id;\n const validationMessageId = state.validationMessage?.id;\n const hintId = state.hint?.id;\n\n const field: FieldContextValue = React.useMemo(\n () => ({\n generatedControlId,\n hintId,\n labelFor,\n labelId,\n orientation,\n required,\n size,\n validationMessageId,\n validationState,\n }),\n [generatedControlId, hintId, labelFor, labelId, orientation, required, size, validationMessageId, validationState],\n );\n\n return { field };\n};\n"],"names":["React","useFieldContextValues_unstable","state","generatedControlId","orientation","required","size","validationState","labelFor","label","htmlFor","labelId","id","validationMessageId","validationMessage","hintId","hint","field","useMemo"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B;;CAEC,GACD,OAAO,MAAMC,iCAAiC,CAACC,QAA0C;QAEtEA,cACDA,eACYA,0BACbA;IAJf,MAAM,EAAEC,mBAAkB,EAAEC,YAAW,EAAEC,SAAQ,EAAEC,KAAI,EAAEC,gBAAe,EAAE,GAAGL;IAC7E,MAAMM,WAAWN,CAAAA,eAAAA,MAAMO,KAAK,cAAXP,0BAAAA,KAAAA,IAAAA,aAAaQ,OAAO;IACrC,MAAMC,UAAUT,CAAAA,gBAAAA,MAAMO,KAAK,cAAXP,2BAAAA,KAAAA,IAAAA,cAAaU,EAAE;IAC/B,MAAMC,sBAAsBX,CAAAA,2BAAAA,MAAMY,iBAAiB,cAAvBZ,sCAAAA,KAAAA,IAAAA,yBAAyBU,EAAE;IACvD,MAAMG,SAASb,CAAAA,cAAAA,MAAMc,IAAI,cAAVd,yBAAAA,KAAAA,IAAAA,YAAYU,EAAE;IAE7B,MAAMK,QAA2BjB,MAAMkB,OAAO,CAC5C,IAAO,CAAA;YACLf;YACAY;YACAP;YACAG;YACAP;YACAC;YACAC;YACAO;YACAN;QACF,CAAA,GACA;QAACJ;QAAoBY;QAAQP;QAAUG;QAASP;QAAaC;QAAUC;QAAMO;QAAqBN;KAAgB;IAGpH,OAAO;QAAEU;IAAM;AACjB,EAAE"}
|
@@ -1,65 +1,59 @@
|
|
1
1
|
var _props, _props1, _arialabelledby, _props2, _ariainvalid, _props3, _props4, _ariarequired, _props5;
|
2
2
|
import { useFieldContext_unstable } from './FieldContext';
|
3
3
|
export function useFieldControlProps_unstable(props, options) {
|
4
|
-
|
4
|
+
return getFieldControlProps(useFieldContext_unstable(), props, options);
|
5
5
|
}
|
6
6
|
/**
|
7
7
|
* @internal
|
8
8
|
* Implementation of useFieldControlProps_unstable.
|
9
9
|
* Split out so it can be used directly in renderField_unstable.
|
10
|
-
*/
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
};
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
// We also preserve and append any aria-describedby from props.
|
40
|
-
// For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933
|
41
|
-
if (validationMessageId || hintId) {
|
42
|
-
// NOTE: Not using ??= since we're merging and overriding the user-provided value.
|
43
|
-
props['aria-describedby'] = [validationMessageId, hintId, props === null || props === void 0 ? void 0 : props['aria-describedby']].filter(Boolean).join(' ');
|
44
|
-
}
|
45
|
-
if (validationState === 'error') {
|
46
|
-
var _1;
|
47
|
-
(_1 = (_props2 = props)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _props2[_ariainvalid] = true;
|
48
|
-
}
|
49
|
-
if (required) {
|
50
|
-
if (options === null || options === void 0 ? void 0 : options.supportsRequired) {
|
51
|
-
var _required;
|
52
|
-
(_required = (_props3 = props).required) !== null && _required !== void 0 ? _required : _props3.required = true;
|
53
|
-
} else {
|
54
|
-
var _2;
|
55
|
-
(_2 = (_props4 = props)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _props4[_ariarequired] = true;
|
10
|
+
*/ export function getFieldControlProps(context, props, options) {
|
11
|
+
if (!context) {
|
12
|
+
return props;
|
13
|
+
}
|
14
|
+
// Create a copy of props so we don't modify the original
|
15
|
+
props = {
|
16
|
+
...props
|
17
|
+
};
|
18
|
+
const { generatedControlId , hintId , labelFor , labelId , required , validationMessageId , validationState } = context;
|
19
|
+
if (generatedControlId) {
|
20
|
+
var _id;
|
21
|
+
(_id = (_props = props).id) !== null && _id !== void 0 ? _id : _props.id = generatedControlId;
|
22
|
+
}
|
23
|
+
// Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer
|
24
|
+
// to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).
|
25
|
+
if (labelId && (!(options === null || options === void 0 ? void 0 : options.supportsLabelFor) || labelFor !== props.id)) {
|
26
|
+
var _;
|
27
|
+
(_ = (_props1 = props)[_arialabelledby = 'aria-labelledby']) !== null && _ !== void 0 ? _ : _props1[_arialabelledby] = labelId;
|
28
|
+
}
|
29
|
+
// The control is described by the validation message, or hint, or both.
|
30
|
+
// We also preserve and append any aria-describedby from props.
|
31
|
+
// For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933
|
32
|
+
if (validationMessageId || hintId) {
|
33
|
+
// NOTE: Not using ??= since we're merging and overriding the user-provided value.
|
34
|
+
props['aria-describedby'] = [
|
35
|
+
validationMessageId,
|
36
|
+
hintId,
|
37
|
+
props === null || props === void 0 ? void 0 : props['aria-describedby']
|
38
|
+
].filter(Boolean).join(' ');
|
56
39
|
}
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
40
|
+
if (validationState === 'error') {
|
41
|
+
var _1;
|
42
|
+
(_1 = (_props2 = props)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _props2[_ariainvalid] = true;
|
43
|
+
}
|
44
|
+
if (required) {
|
45
|
+
if (options === null || options === void 0 ? void 0 : options.supportsRequired) {
|
46
|
+
var _required;
|
47
|
+
(_required = (_props3 = props).required) !== null && _required !== void 0 ? _required : _props3.required = true;
|
48
|
+
} else {
|
49
|
+
var _2;
|
50
|
+
(_2 = (_props4 = props)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _props4[_ariarequired] = true;
|
51
|
+
}
|
52
|
+
}
|
53
|
+
// Include the size prop if this control supports it
|
54
|
+
if (options === null || options === void 0 ? void 0 : options.supportsSize) {
|
55
|
+
var _size;
|
56
|
+
(_size = (_props5 = props).size) !== null && _size !== void 0 ? _size : _props5.size = context.size;
|
57
|
+
}
|
58
|
+
return props;
|
64
59
|
}
|
65
|
-
//# sourceMappingURL=useFieldControlProps.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["useFieldControlProps.ts"],"sourcesContent":["import type { FieldContextValue, FieldControlProps } from '../Field';\nimport { useFieldContext_unstable } from './FieldContext';\n\n/**\n * Options for `useFieldControlProps_unstable`.\n */\nexport type FieldControlPropsOptions = {\n /**\n * Skips setting `aria-labelledby` on the control if the `label.htmlFor` refers to the control.\n *\n * This should be used with controls that can be the target of a label's `for` prop:\n * `<button>`, `<input>`, `<progress>`, `<select>`, `<textarea>`.\n */\n supportsLabelFor?: boolean;\n\n /**\n * Sets `required` instead of `aria-required` when the Field is marked required.\n *\n * This should be used with controls that support the `required` prop:\n * `<input>` (except `range` or `color`), `<select>`, `<textarea>`.\n */\n supportsRequired?: boolean;\n\n /**\n * Sets the size prop on the control to match the Field's size: `'small' | 'medium' | 'large'`.\n *\n * This should be used with controls that have a custom size prop that matches the Field's size prop.\n */\n supportsSize?: boolean;\n};\n\n/**\n * Gets the control props from the field context, if this inside a `<Field>`.\n *\n * When called with no arguments, returns the FieldControlProps that should be applied to the control.\n *\n * @returns A FieldControlProps object if inside a `<Field>`, otherwise undefined.\n */\nexport function useFieldControlProps_unstable(): FieldControlProps | undefined;\n\n/**\n * Copies and merges the FieldControlProps with the given props, if this inside a `<Field>`.\n *\n * @param props - The existing props for the control. These will be merged with the control props from the field context.\n * @param options - Option to include the size prop.\n * @returns Merged props if inside a `<Field>`, otherwise the original props, or undefined if no props given.\n */\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n props: Props,\n options?: FieldControlPropsOptions,\n): Props;\nexport function useFieldControlProps_unstable<Props extends FieldControlProps>(\n props?: Props,\n options?: FieldControlPropsOptions,\n): Props | undefined {\n return getFieldControlProps(useFieldContext_unstable(), props, options);\n}\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<Props extends FieldControlProps>(\n context: FieldContextValue | undefined,\n props?: Props,\n options?: FieldControlPropsOptions,\n): Props | undefined {\n if (!context) {\n return props;\n }\n\n // Create a copy of props so we don't modify the original\n props = { ...props } as Props;\n\n const { generatedControlId, hintId, labelFor, labelId, required, validationMessageId, validationState } = context;\n\n if (generatedControlId) {\n props.id ??= generatedControlId;\n }\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?.supportsLabelFor || labelFor !== props.id)) {\n props['aria-labelledby'] ??= labelId;\n }\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?.['aria-describedby']].filter(Boolean).join(' ');\n }\n\n if (validationState === 'error') {\n props['aria-invalid'] ??= true;\n }\n\n if (required) {\n if (options?.supportsRequired) {\n (props as { required?: boolean }).required ??= true;\n } else {\n props['aria-required'] ??= true;\n }\n }\n\n // Include the size prop if this control supports it\n if (options?.supportsSize) {\n (props as { size?: FieldContextValue['size'] }).size ??= context.size;\n }\n\n return props;\n}\n"],"names":["props","useFieldContext_unstable","useFieldControlProps_unstable","options","getFieldControlProps","context","generatedControlId","hintId","labelFor","labelId","required","validationMessageId","validationState","id","supportsLabelFor","filter","Boolean","join","supportsRequired","supportsSize","size"],"mappings":"IA8EIA,QAMAA,SAAM,iBAYNA,SAAM,cAKHA,SAEDA,SAAM,eAMPA;AA5GL,SAASC,wBAAwB,QAAQ,iBAAiB;AAkD1D,OAAO,SAASC,8BACdF,KAAa,EACbG,OAAkC,EACf;IACnB,OAAOC,qBAAqBH,4BAA4BD,OAAOG;AACjE,CAAC;AAED;;;;CAIC,GACD,OAAO,SAASC,qBACdC,OAAsC,EACtCL,KAAa,EACbG,OAAkC,EACf;IACnB,IAAI,CAACE,SAAS;QACZ,OAAOL;IACT,CAAC;IAED,yDAAyD;IACzDA,QAAQ;QAAE,GAAGA,KAAK;IAAC;IAEnB,MAAM,EAAEM,mBAAkB,EAAEC,OAAM,EAAEC,SAAQ,EAAEC,QAAO,EAAEC,SAAQ,EAAEC,oBAAmB,EAAEC,gBAAe,EAAE,GAAGP;IAE1G,IAAIC,oBAAoB;;QACtBN,QAAAA,SAAAA,OAAMa,uCAANb,OAAMa,KAAOP,kBAAkB;IACjC,CAAC;IAED,4GAA4G;IAC5G,6GAA6G;IAC7G,IAAIG,WAAY,CAAA,CAACN,CAAAA,oBAAAA,qBAAAA,KAAAA,IAAAA,QAASW,gBAAgB,AAAD,KAAKN,aAAaR,MAAMa,EAAE,AAAD,GAAI;;QACpEb,MAAAA,UAAAA,MAAK,CAAC,kBAAA,kBAAkB,iCAAxBA,OAAK,CAAC,gBAAkB,GAAKS,OAAO;IACtC,CAAC;IAED,wEAAwE;IACxE,+DAA+D;IAC/D,yFAAyF;IACzF,IAAIE,uBAAuBJ,QAAQ;QACjC,kFAAkF;QAClFP,KAAK,CAAC,mBAAmB,GAAG;YAACW;YAAqBJ;YAAQP,kBAAAA,mBAAAA,KAAAA,IAAAA,KAAO,CAAC,mBAAmB;SAAC,CAACe,MAAM,CAACC,SAASC,IAAI,CAAC;IAC9G,CAAC;IAED,IAAIL,oBAAoB,SAAS;;QAC/BZ,OAAAA,UAAAA,MAAK,CAAC,eAAA,eAAe,mCAArBA,OAAK,CAAC,aAAe,GAAK,IAAI;IAChC,CAAC;IAED,IAAIU,UAAU;QACZ,IAAIP,oBAAAA,qBAAAA,KAAAA,IAAAA,QAASe,gBAAgB,EAAE;;YAC7B,cAAClB,UAAAA,OAAiCU,yDAAjCV,QAAiCU,WAAa,IAAI;QACrD,OAAO;;YACLV,OAAAA,UAAAA,MAAK,CAAC,gBAAA,gBAAgB,mCAAtBA,OAAK,CAAC,cAAgB,GAAK,IAAI;QACjC,CAAC;IACH,CAAC;IAED,oDAAoD;IACpD,IAAIG,oBAAAA,qBAAAA,KAAAA,IAAAA,QAASgB,YAAY,EAAE;;QACzB,UAACnB,UAAAA,OAA+CoB,6CAA/CpB,QAA+CoB,OAASf,QAAQe,IAAI;IACvE,CAAC;IAED,OAAOpB;AACT,CAAC"}
|
package/lib/index.js
CHANGED
@@ -1,3 +1,2 @@
|
|
1
1
|
export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';
|
2
2
|
export { FieldContextProvider, useFieldContext_unstable, useFieldContextValues_unstable, useFieldControlProps_unstable } from './contexts/index';
|
3
|
-
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport type {\n FieldContextValue,\n FieldContextValues,\n FieldControlProps,\n FieldProps,\n FieldSlots,\n FieldState,\n} from './Field';\nexport {\n FieldContextProvider,\n useFieldContext_unstable,\n useFieldContextValues_unstable,\n useFieldControlProps_unstable,\n} from './contexts/index';\nexport type { FieldControlPropsOptions } from './contexts/index';\n"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable"],"mappings":"AAAA,SAASA,KAAK,EAAEC,eAAe,EAAEC,oBAAoB,EAAEC,uBAAuB,EAAEC,iBAAiB,QAAQ,UAAU;AASnH,SACEC,oBAAoB,EACpBC,wBAAwB,EACxBC,8BAA8B,EAC9BC,6BAA6B,QACxB,mBAAmB"}
|
package/lib-commonjs/Field.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["Field.js"],"sourcesContent":["export * from './components/Field/index';\n"],"names":[],"mappings":";;;;;oBAAc"}
|
@@ -18,6 +18,4 @@ const Field = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
18
18
|
const context = (0, _index.useFieldContextValues_unstable)(state);
|
19
19
|
return (0, _renderField.renderField_unstable)(state, context);
|
20
20
|
});
|
21
|
-
Field.displayName = 'Field';
|
22
|
-
|
23
|
-
//# sourceMappingURL=Field.js.map
|
21
|
+
Field.displayName = 'Field';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["Field.js"],"sourcesContent":["import * as React from 'react';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles.styles';\nimport { useFieldContextValues_unstable } from '../../contexts/index';\nexport const Field = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const state = useField_unstable(props, ref);\n useFieldStyles_unstable(state);\n const context = useFieldContextValues_unstable(state);\n return renderField_unstable(state, context);\n});\nField.displayName = 'Field';\n"],"names":["Field","React","forwardRef","props","ref","state","useField_unstable","useFieldStyles_unstable","context","useFieldContextValues_unstable","renderField_unstable","displayName"],"mappings":";;;;+BAKaA;;aAAAA;;;6DALU;6BACc;0BACH;sCACM;uBACO;AACxC,MAAMA,QAAQ,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IAC9D,MAAMC,QAAQC,IAAAA,2BAAiB,EAACH,OAAOC;IACvCG,IAAAA,6CAAuB,EAACF;IACxB,MAAMG,UAAUC,IAAAA,qCAA8B,EAACJ;IAC/C,OAAOK,IAAAA,iCAAoB,EAACL,OAAOG;AACvC;AACAR,MAAMW,WAAW,GAAG"}
|
@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
6
6
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
7
|
-
//# sourceMappingURL=Field.types.js.map
|
8
|
-
|
9
|
-
//# sourceMappingURL=Field.types.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["Field.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;6DAAuB"}
|
@@ -8,6 +8,3 @@ _exportStar(require("./Field"), exports);
|
|
8
8
|
_exportStar(require("./renderField"), exports);
|
9
9
|
_exportStar(require("./useField"), exports);
|
10
10
|
_exportStar(require("./useFieldStyles.styles"), exports);
|
11
|
-
//# sourceMappingURL=index.js.map
|
12
|
-
|
13
|
-
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export * from './Field.types';\nexport * from './Field';\nexport * from './renderField';\nexport * from './useField';\nexport * from './useFieldStyles.styles';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA"}
|
@@ -18,6 +18,4 @@ const renderField_unstable = (state, contextValues)=>{
|
|
18
18
|
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_index.FieldContextProvider, {
|
19
19
|
value: contextValues === null || contextValues === void 0 ? void 0 : contextValues.field
|
20
20
|
}, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, slots.label && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.label, slotProps.label), children, slots.validationMessage && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.validationMessage, slotProps.validationMessage, slots.validationMessageIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.validationMessageIcon, slotProps.validationMessageIcon), slotProps.validationMessage.children), slots.hint && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.hint, slotProps.hint)));
|
21
|
-
};
|
22
|
-
|
23
|
-
//# sourceMappingURL=renderField.js.map
|
21
|
+
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["renderField.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { FieldContextProvider, getFieldControlProps } from '../../contexts/index';\n/**\n * Render the final JSX of Field\n */ export const renderField_unstable = (state, contextValues)=>{\n const { slots , slotProps } = getSlotsNext(state);\n let { children } = state;\n if (typeof children === 'function') {\n children = children(getFieldControlProps(contextValues.field) || {});\n }\n return /*#__PURE__*/ createElement(FieldContextProvider, {\n value: contextValues === null || contextValues === void 0 ? void 0 : contextValues.field\n }, /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.label && /*#__PURE__*/ createElement(slots.label, slotProps.label), children, slots.validationMessage && /*#__PURE__*/ createElement(slots.validationMessage, slotProps.validationMessage, slots.validationMessageIcon && /*#__PURE__*/ createElement(slots.validationMessageIcon, slotProps.validationMessageIcon), slotProps.validationMessage.children), slots.hint && /*#__PURE__*/ createElement(slots.hint, slotProps.hint)));\n};\n"],"names":["renderField_unstable","state","contextValues","slots","slotProps","getSlotsNext","children","getFieldControlProps","field","createElement","FieldContextProvider","value","root","label","validationMessage","validationMessageIcon","hint"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACtD;uBAC8B;AAGhD,MAAMA,uBAAuB,CAACC,OAAOC,gBAAgB;IAC5D,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACJ;IAC5C,IAAI,EAAEK,SAAQ,EAAG,GAAGL;IACpB,IAAI,OAAOK,aAAa,YAAY;QAChCA,WAAWA,SAASC,IAAAA,2BAAoB,EAACL,cAAcM,KAAK,KAAK,CAAC;IACtE,CAAC;IACD,OAAO,WAAW,GAAGC,IAAAA,8BAAa,EAACC,2BAAoB,EAAE;QACrDC,OAAOT,kBAAkB,IAAI,IAAIA,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcM,KAAK;IAC5F,GAAG,WAAW,GAAGC,IAAAA,8BAAa,EAACN,MAAMS,IAAI,EAAER,UAAUQ,IAAI,EAAET,MAAMU,KAAK,IAAI,WAAW,GAAGJ,IAAAA,8BAAa,EAACN,MAAMU,KAAK,EAAET,UAAUS,KAAK,GAAGP,UAAUH,MAAMW,iBAAiB,IAAI,WAAW,GAAGL,IAAAA,8BAAa,EAACN,MAAMW,iBAAiB,EAAEV,UAAUU,iBAAiB,EAAEX,MAAMY,qBAAqB,IAAI,WAAW,GAAGN,IAAAA,8BAAa,EAACN,MAAMY,qBAAqB,EAAEX,UAAUW,qBAAqB,GAAGX,UAAUU,iBAAiB,CAACR,QAAQ,GAAGH,MAAMa,IAAI,IAAI,WAAW,GAAGP,IAAAA,8BAAa,EAACN,MAAMa,IAAI,EAAEZ,UAAUY,IAAI;AACre"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["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 */ export const useField_unstable = (props, ref)=>{\n const { children , orientation ='vertical' , required =false , validationState =props.validationMessage ? 'error' : 'none' , size ='medium' } = props;\n const baseId = useId('field-');\n const generatedControlId = baseId + '__control';\n const root = getNativeElementProps('div', {\n ...props,\n ref\n }, /*excludedPropNames:*/ [\n 'children'\n ]);\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"],"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":";;;;+BAkBiBA;;aAAAA;;;6DAlBM;4BACuD;4BACxD;gCACyC;AAC/D,MAAMC,yBAAyB;IAC3BC,OAAO,WAAW,GAAGC,OAAMC,aAAa,CAACC,+BAAmB,EAAE,IAAI;IAClEC,SAAS,WAAW,GAAGH,OAAMC,aAAa,CAACG,2BAAe,EAAE,IAAI;IAChEC,SAAS,WAAW,GAAGL,OAAMC,aAAa,CAACK,mCAAuB,EAAE,IAAI;IACxEC,MAAMC;AACV;AASW,MAAMX,oBAAoB,CAACY,OAAOC,MAAM;IAC/C,MAAM,EAAEC,SAAQ,EAAGC,aAAa,WAAU,EAAGC,UAAU,KAAK,CAAA,EAAGC,iBAAiBL,MAAMM,iBAAiB,GAAG,UAAU,MAAM,CAAA,EAAGC,MAAM,SAAQ,EAAG,GAAGP;IACjJ,MAAMQ,SAASC,IAAAA,qBAAK,EAAC;IACrB,MAAMC,qBAAqBF,SAAS;IACpC,MAAMG,OAAOC,IAAAA,qCAAqB,EAAC,OAAO;QACtC,GAAGZ,KAAK;QACRC;IACJ,GAAG,oBAAoB,GAAG;QACtB;KACH;IACD,MAAMY,QAAQC,IAAAA,gCAAgB,EAACd,MAAMa,KAAK,EAAE;QACxCE,cAAc;YACVC,SAASN;YACTO,IAAIT,SAAS;YACbJ;YACAG;QACJ;IACJ;IACA,MAAMD,oBAAoBQ,IAAAA,gCAAgB,EAACd,MAAMM,iBAAiB,EAAE;QAChES,cAAc;YACVE,IAAIT,SAAS;YACbU,MAAMb,oBAAoB,UAAU,UAAUN,SAAS;QAC3D;IACJ;IACA,MAAMoB,OAAOL,IAAAA,gCAAgB,EAACd,MAAMmB,IAAI,EAAE;QACtCJ,cAAc;YACVE,IAAIT,SAAS;QACjB;IACJ;IACA,MAAMY,cAAc/B,sBAAsB,CAACgB,gBAAgB;IAC3D,MAAMgB,wBAAwBP,IAAAA,gCAAgB,EAACd,MAAMqB,qBAAqB,EAAE;QACxEjB,UAAU,CAAC,CAACgB;QACZL,cAAc;YACVb,UAAUkB;QACd;IACJ;IACA,OAAO;QACHlB;QACAQ;QACAP;QACAC;QACAG;QACAF;QACAiB,YAAY;YACRX,MAAM;YACNE,OAAOU,iBAAK;YACZjB,mBAAmB;YACnBe,uBAAuB;YACvBF,MAAM;QACV;QACAR;QACAE;QACAQ;QACAf;QACAa;IACJ;AACJ"}
|
@@ -150,5 +150,3 @@ const useFieldStyles_unstable = (state)=>{
|
|
150
150
|
state.hint.className = (0, _react.mergeClasses)(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);
|
151
151
|
}
|
152
152
|
}; //# sourceMappingURL=useFieldStyles.styles.js.map
|
153
|
-
|
154
|
-
//# sourceMappingURL=useFieldStyles.styles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["useFieldStyles.styles.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.styles.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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"}
|
@@ -16,6 +16,4 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
|
|
16
16
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
17
17
|
const FieldContext = /*#__PURE__*/ _react.createContext(undefined);
|
18
18
|
const FieldContextProvider = FieldContext.Provider;
|
19
|
-
const useFieldContext_unstable = ()=>_react.useContext(FieldContext);
|
20
|
-
|
21
|
-
//# sourceMappingURL=FieldContext.js.map
|
19
|
+
const useFieldContext_unstable = ()=>_react.useContext(FieldContext);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["FieldContext.js"],"sourcesContent":["import * as React from 'react';\nconst FieldContext = React.createContext(undefined);\nexport const FieldContextProvider = FieldContext.Provider;\nexport const useFieldContext_unstable = ()=>React.useContext(FieldContext);\n"],"names":["FieldContextProvider","useFieldContext_unstable","FieldContext","React","createContext","undefined","Provider","useContext"],"mappings":";;;;;;;;;;;IAEaA,oBAAoB,MAApBA;IACAC,wBAAwB,MAAxBA;;;6DAHU;AACvB,MAAMC,6BAAeC,OAAMC,aAAa,CAACC;AAClC,MAAML,uBAAuBE,aAAaI,QAAQ;AAClD,MAAML,2BAA2B,IAAIE,OAAMI,UAAU,CAACL"}
|
@@ -6,6 +6,3 @@ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
|
|
6
6
|
_exportStar(require("./FieldContext"), exports);
|
7
7
|
_exportStar(require("./useFieldContextValues"), exports);
|
8
8
|
_exportStar(require("./useFieldControlProps"), exports);
|
9
|
-
//# sourceMappingURL=index.js.map
|
10
|
-
|
11
|
-
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export * from './FieldContext';\nexport * from './useFieldContextValues';\nexport * from './useFieldControlProps';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["useFieldContextValues.js"],"sourcesContent":["import * as React from 'react';\n/**\n * Get the context values used when rendering Field.\n */ export const useFieldContextValues_unstable = (state)=>{\n var _state_label, _state_label1, _state_validationMessage, _state_hint;\n const { generatedControlId , orientation , required , size , validationState } = 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 }), [\n generatedControlId,\n hintId,\n labelFor,\n labelId,\n orientation,\n required,\n size,\n validationMessageId,\n validationState\n ]);\n return {\n field\n };\n};\n"],"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":";;;;+BAGiBA;;aAAAA;;;6DAHM;AAGZ,MAAMA,iCAAiC,CAACC,QAAQ;IACvD,IAAIC,cAAcC,eAAeC,0BAA0BC;IAC3D,MAAM,EAAEC,mBAAkB,EAAGC,YAAW,EAAGC,SAAQ,EAAGC,KAAI,EAAGC,gBAAe,EAAG,GAAGT;IAClF,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,IAAK,CAAA;YACzBhB;YACAY;YACAP;YACAG;YACAP;YACAC;YACAC;YACAO;YACAN;QACJ,CAAA,GAAI;QACJJ;QACAY;QACAP;QACAG;QACAP;QACAC;QACAC;QACAO;QACAN;KACH;IACD,OAAO;QACHU;IACJ;AACJ"}
|
@@ -66,6 +66,4 @@ function getFieldControlProps(context, props, options) {
|
|
66
66
|
(_size = (_props5 = props).size) !== null && _size !== void 0 ? _size : _props5.size = context.size;
|
67
67
|
}
|
68
68
|
return props;
|
69
|
-
}
|
70
|
-
|
71
|
-
//# sourceMappingURL=useFieldControlProps.js.map
|
69
|
+
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["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 */ export 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 { generatedControlId , hintId , labelFor , labelId , required , validationMessageId , validationState } = 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'] = [\n validationMessageId,\n hintId,\n props === null || props === void 0 ? void 0 : props['aria-describedby']\n ].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"],"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":";;;;;;;;;;;IAEgBA,6BAA6B,MAA7BA;IAOIC,oBAAoB,MAApBA;;8BARqB;AADzC,IAAIC,QAAQC,SAASC,iBAAiBC,SAASC,cAAcC,SAASC,SAASC,eAAeC;AAEvF,SAASV,8BAA8BW,KAAK,EAAEC,OAAO,EAAE;IAC1D,OAAOX,qBAAqBY,IAAAA,sCAAwB,KAAIF,OAAOC;AACnE;AAKW,SAASX,qBAAqBa,OAAO,EAAEH,KAAK,EAAEC,OAAO,EAAE;IAC9D,IAAI,CAACE,SAAS;QACV,OAAOH;IACX,CAAC;IACD,yDAAyD;IACzDA,QAAQ;QACJ,GAAGA,KAAK;IACZ;IACA,MAAM,EAAEI,mBAAkB,EAAGC,OAAM,EAAGC,SAAQ,EAAGC,QAAO,EAAGC,SAAQ,EAAGC,oBAAmB,EAAGC,gBAAe,EAAG,GAAGP;IACjH,IAAIC,oBAAoB;QACpB,IAAIO;QACHA,CAAAA,MAAM,AAACpB,CAAAA,SAASS,KAAI,EAAGY,EAAE,AAAD,MAAO,IAAI,IAAID,QAAQ,KAAK,IAAIA,MAAMpB,OAAOqB,EAAE,GAAGR,kBAAkB;IACjG,CAAC;IACD,4GAA4G;IAC5G,6GAA6G;IAC7G,IAAIG,WAAY,CAAA,CAAEN,CAAAA,YAAY,IAAI,IAAIA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQY,gBAAgB,AAAD,KAAMP,aAAaN,MAAMY,EAAE,AAAD,GAAI;QACrH,IAAIE;QACHA,CAAAA,IAAI,AAACtB,CAAAA,UAAUQ,KAAI,CAAE,CAACP,kBAAkB,kBAAkB,AAAD,MAAO,IAAI,IAAIqB,MAAM,KAAK,IAAIA,IAAItB,OAAO,CAACC,gBAAgB,GAAGc,OAAO;IAClI,CAAC;IACD,wEAAwE;IACxE,+DAA+D;IAC/D,yFAAyF;IACzF,IAAIE,uBAAuBJ,QAAQ;QAC/B,kFAAkF;QAClFL,KAAK,CAAC,mBAAmB,GAAG;YACxBS;YACAJ;YACAL,UAAU,IAAI,IAAIA,UAAU,KAAK,IAAI,KAAK,IAAIA,KAAK,CAAC,mBAAmB;SAC1E,CAACe,MAAM,CAACC,SAASC,IAAI,CAAC;IAC3B,CAAC;IACD,IAAIP,oBAAoB,SAAS;QAC7B,IAAIQ;QACHA,CAAAA,KAAK,AAACxB,CAAAA,UAAUM,KAAI,CAAE,CAACL,eAAe,eAAe,AAAD,MAAO,IAAI,IAAIuB,OAAO,KAAK,IAAIA,KAAKxB,OAAO,CAACC,aAAa,GAAG,IAAI;IACzH,CAAC;IACD,IAAIa,UAAU;QACV,IAAIP,YAAY,IAAI,IAAIA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQkB,gBAAgB,EAAE;YAC5E,IAAIC;YACHA,CAAAA,YAAY,AAACxB,CAAAA,UAAUI,KAAI,EAAGQ,QAAQ,AAAD,MAAO,IAAI,IAAIY,cAAc,KAAK,IAAIA,YAAYxB,QAAQY,QAAQ,GAAG,IAAI;QACnH,OAAO;YACH,IAAIa;YACHA,CAAAA,KAAK,AAACxB,CAAAA,UAAUG,KAAI,CAAE,CAACF,gBAAgB,gBAAgB,AAAD,MAAO,IAAI,IAAIuB,OAAO,KAAK,IAAIA,KAAKxB,OAAO,CAACC,cAAc,GAAG,IAAI;QAC5H,CAAC;IACL,CAAC;IACD,oDAAoD;IACpD,IAAIG,YAAY,IAAI,IAAIA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQqB,YAAY,EAAE;QACxE,IAAIC;QACHA,CAAAA,QAAQ,AAACxB,CAAAA,UAAUC,KAAI,EAAGwB,IAAI,AAAD,MAAO,IAAI,IAAID,UAAU,KAAK,IAAIA,QAAQxB,QAAQyB,IAAI,GAAGrB,QAAQqB,IAAI;IACvG,CAAC;IACD,OAAOxB;AACX"}
|
package/lib-commonjs/index.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["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"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable"],"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;;uBADb;uBACqB"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-field",
|
3
|
-
"version": "9.1.
|
3
|
+
"version": "9.1.6",
|
4
4
|
"description": "Fluent UI Field components",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -28,18 +28,18 @@
|
|
28
28
|
"devDependencies": {
|
29
29
|
"@fluentui/eslint-plugin": "*",
|
30
30
|
"@fluentui/react-conformance": "*",
|
31
|
-
"@fluentui/react-conformance-griffel": "9.0.0-beta.
|
31
|
+
"@fluentui/react-conformance-griffel": "9.0.0-beta.22",
|
32
32
|
"@fluentui/scripts-api-extractor": "*",
|
33
33
|
"@fluentui/scripts-tasks": "*"
|
34
34
|
},
|
35
35
|
"dependencies": {
|
36
|
-
"@fluentui/react-context-selector": "^9.1.
|
36
|
+
"@fluentui/react-context-selector": "^9.1.22",
|
37
37
|
"@fluentui/react-icons": "^2.0.196",
|
38
|
-
"@fluentui/react-jsx-runtime": "9.0.0-alpha.
|
39
|
-
"@fluentui/react-label": "^9.1.
|
38
|
+
"@fluentui/react-jsx-runtime": "9.0.0-alpha.6",
|
39
|
+
"@fluentui/react-label": "^9.1.15",
|
40
40
|
"@fluentui/react-theme": "^9.1.8",
|
41
|
-
"@fluentui/react-utilities": "^9.9.
|
42
|
-
"@griffel/react": "^1.5.
|
41
|
+
"@fluentui/react-utilities": "^9.9.2",
|
42
|
+
"@griffel/react": "^1.5.7",
|
43
43
|
"@swc/helpers": "^0.4.14"
|
44
44
|
},
|
45
45
|
"peerDependencies": {
|