@jobber/components 8.22.0 → 8.23.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/dist/CSPContext-cjs.js +69 -0
  2. package/dist/CSPContext-es.js +46 -0
  3. package/dist/Card/index.cjs +2 -0
  4. package/dist/Card/index.mjs +2 -0
  5. package/dist/ComboboxChipRemove-cjs.js +54 -211
  6. package/dist/ComboboxChipRemove-es.js +8 -164
  7. package/dist/DataDump/index.cjs +2 -0
  8. package/dist/DataDump/index.mjs +2 -0
  9. package/dist/Dialog/index.cjs +1 -0
  10. package/dist/Dialog/index.mjs +1 -0
  11. package/dist/DrawerDescription-cjs.js +2 -1
  12. package/dist/DrawerDescription-es.js +3 -2
  13. package/dist/DrawerTitle-es.js +1 -1
  14. package/dist/InputNumberExperimental-cjs.js +24 -23
  15. package/dist/InputNumberExperimental-es.js +3 -2
  16. package/dist/InternalBackdrop-es.js +3 -3
  17. package/dist/Menu/index.cjs +2 -0
  18. package/dist/Menu/index.mjs +2 -0
  19. package/dist/Menu-cjs.js +1 -1
  20. package/dist/Menu-es.js +1 -1
  21. package/dist/MenuSubmenuTrigger-cjs.js +5 -13
  22. package/dist/MenuSubmenuTrigger-es.js +8 -16
  23. package/dist/NumberFieldInput-cjs.js +9 -9
  24. package/dist/NumberFieldInput-es.js +3 -3
  25. package/dist/Page/index.cjs +2 -0
  26. package/dist/Page/index.mjs +2 -0
  27. package/dist/ScrollAreaViewport-cjs.js +5 -47
  28. package/dist/ScrollAreaViewport-es.js +5 -46
  29. package/dist/SelectGroupLabel-cjs.js +1924 -0
  30. package/dist/SelectGroupLabel-es.js +1888 -0
  31. package/dist/SelectPrimitive-cjs.js +112 -0
  32. package/dist/SelectPrimitive-es.js +110 -0
  33. package/dist/ToolbarRootContext-cjs.js +35 -0
  34. package/dist/ToolbarRootContext-es.js +14 -0
  35. package/dist/docs/SelectPrimitive/SelectPrimitive.md +326 -0
  36. package/dist/docs/index.md +1 -0
  37. package/dist/floating-ui.react-dom-cjs.js +1 -0
  38. package/dist/floating-ui.react-dom-es.js +2 -2
  39. package/dist/floating-ui.utils.dom-es.js +1 -1
  40. package/dist/index.cjs +2 -0
  41. package/dist/index.mjs +2 -0
  42. package/dist/primitives/BottomSheet/index.cjs +1 -0
  43. package/dist/primitives/BottomSheet/index.mjs +1 -0
  44. package/dist/primitives/ComboboxPrimitive/index.cjs +3 -1
  45. package/dist/primitives/ComboboxPrimitive/index.mjs +3 -1
  46. package/dist/primitives/InputNumberExperimental/index.cjs +2 -1
  47. package/dist/primitives/InputNumberExperimental/index.mjs +2 -1
  48. package/dist/primitives/SelectPrimitive/SelectPrimitive.d.ts +63 -0
  49. package/dist/primitives/SelectPrimitive/index.cjs +29 -0
  50. package/dist/primitives/SelectPrimitive/index.d.ts +2 -0
  51. package/dist/primitives/SelectPrimitive/index.mjs +23 -0
  52. package/dist/primitives/SelectPrimitive/types.d.ts +16 -0
  53. package/dist/primitives/index.cjs +8 -1
  54. package/dist/primitives/index.d.ts +1 -0
  55. package/dist/primitives/index.mjs +7 -1
  56. package/dist/primitives/mergeClassName.d.ts +12 -0
  57. package/dist/resolveAriaLabelledBy-cjs.js +195 -0
  58. package/dist/resolveAriaLabelledBy-es.js +162 -0
  59. package/dist/styles.css +325 -0
  60. package/dist/unstyledPrimitives/index.cjs +416 -24
  61. package/dist/unstyledPrimitives/index.d.ts +1 -0
  62. package/dist/unstyledPrimitives/index.mjs +417 -26
  63. package/dist/useButton-cjs.js +2 -0
  64. package/dist/useButton-es.js +3 -2
  65. package/dist/useCompositeListItem-es.js +3 -3
  66. package/dist/useLabel-cjs.js +3 -329
  67. package/dist/useLabel-es.js +4 -299
  68. package/dist/useLabelableId-cjs.js +332 -0
  69. package/dist/useLabelableId-es.js +300 -0
  70. package/dist/useRenderElement-cjs.js +3 -0
  71. package/dist/useRenderElement-es.js +4 -1
  72. package/package.json +2 -2
@@ -1,323 +1,8 @@
1
1
  'use strict';
2
2
 
3
- var ReactDOM = require('react-dom');
4
- var useButton = require('./useButton-cjs.js');
5
- var React = require('react');
6
- var useRenderElement = require('./useRenderElement-cjs.js');
7
3
  var floatingUi_utils_dom = require('./floating-ui.utils.dom-cjs.js');
8
-
9
- function _interopNamespaceDefault(e) {
10
- var n = Object.create(null);
11
- if (e) {
12
- Object.keys(e).forEach(function (k) {
13
- if (k !== 'default') {
14
- var d = Object.getOwnPropertyDescriptor(e, k);
15
- Object.defineProperty(n, k, d.get ? d : {
16
- enumerable: true,
17
- get: function () { return e[k]; }
18
- });
19
- }
20
- });
21
- }
22
- n.default = e;
23
- return Object.freeze(n);
24
- }
25
-
26
- var ReactDOM__namespace = /*#__PURE__*/_interopNamespaceDefault(ReactDOM);
27
- var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
28
-
29
- let FieldControlDataAttributes = /*#__PURE__*/function (FieldControlDataAttributes) {
30
- /**
31
- * Present when the field is disabled.
32
- */
33
- FieldControlDataAttributes["disabled"] = "data-disabled";
34
- /**
35
- * Present when the field is in valid state.
36
- */
37
- FieldControlDataAttributes["valid"] = "data-valid";
38
- /**
39
- * Present when the field is in invalid state.
40
- */
41
- FieldControlDataAttributes["invalid"] = "data-invalid";
42
- /**
43
- * Present when the field has been touched.
44
- */
45
- FieldControlDataAttributes["touched"] = "data-touched";
46
- /**
47
- * Present when the field's value has changed.
48
- */
49
- FieldControlDataAttributes["dirty"] = "data-dirty";
50
- /**
51
- * Present when the field is filled.
52
- */
53
- FieldControlDataAttributes["filled"] = "data-filled";
54
- /**
55
- * Present when the field control is focused.
56
- */
57
- FieldControlDataAttributes["focused"] = "data-focused";
58
- return FieldControlDataAttributes;
59
- }({});
60
-
61
- const DEFAULT_VALIDITY_STATE = {
62
- badInput: false,
63
- customError: false,
64
- patternMismatch: false,
65
- rangeOverflow: false,
66
- rangeUnderflow: false,
67
- stepMismatch: false,
68
- tooLong: false,
69
- tooShort: false,
70
- typeMismatch: false,
71
- valid: null,
72
- valueMissing: false
73
- };
74
- const DEFAULT_FIELD_STATE_ATTRIBUTES = {
75
- valid: null,
76
- touched: false,
77
- dirty: false,
78
- filled: false,
79
- focused: false
80
- };
81
- const DEFAULT_FIELD_ROOT_STATE = {
82
- disabled: false,
83
- ...DEFAULT_FIELD_STATE_ATTRIBUTES
84
- };
85
- const fieldValidityMapping = {
86
- valid(value) {
87
- if (value === null) {
88
- return null;
89
- }
90
- if (value) {
91
- return {
92
- [FieldControlDataAttributes.valid]: ''
93
- };
94
- }
95
- return {
96
- [FieldControlDataAttributes.invalid]: ''
97
- };
98
- }
99
- };
100
-
101
- const FieldRootContext = /*#__PURE__*/React__namespace.createContext({
102
- invalid: undefined,
103
- name: undefined,
104
- validityData: {
105
- state: DEFAULT_VALIDITY_STATE,
106
- errors: [],
107
- error: '',
108
- value: '',
109
- initialValue: null
110
- },
111
- setValidityData: useRenderElement.NOOP,
112
- disabled: undefined,
113
- touched: DEFAULT_FIELD_STATE_ATTRIBUTES.touched,
114
- setTouched: useRenderElement.NOOP,
115
- dirty: DEFAULT_FIELD_STATE_ATTRIBUTES.dirty,
116
- setDirty: useRenderElement.NOOP,
117
- filled: DEFAULT_FIELD_STATE_ATTRIBUTES.filled,
118
- setFilled: useRenderElement.NOOP,
119
- focused: DEFAULT_FIELD_STATE_ATTRIBUTES.focused,
120
- setFocused: useRenderElement.NOOP,
121
- validate: () => null,
122
- validationMode: 'onSubmit',
123
- validationDebounceTime: 0,
124
- shouldValidateOnChange: () => false,
125
- state: DEFAULT_FIELD_ROOT_STATE,
126
- markedDirtyRef: {
127
- current: false
128
- },
129
- validation: {
130
- getValidationProps: (props = useRenderElement.EMPTY_OBJECT) => props,
131
- getInputValidationProps: (props = useRenderElement.EMPTY_OBJECT) => props,
132
- inputRef: {
133
- current: null
134
- },
135
- commit: async () => {}
136
- }
137
- });
138
- if (process.env.NODE_ENV !== "production") FieldRootContext.displayName = "FieldRootContext";
139
- function useFieldRootContext(optional = true) {
140
- const context = React__namespace.useContext(FieldRootContext);
141
- if (context.setValidityData === useRenderElement.NOOP && !optional) {
142
- throw new Error(process.env.NODE_ENV !== "production" ? 'Base UI: FieldRootContext is missing. Field parts must be placed within <Field.Root>.' : useRenderElement.formatErrorMessage(28));
143
- }
144
- return context;
145
- }
146
-
147
- /**
148
- * Combines the field's client-side, stateful validity data with the external invalid state to
149
- * determine the field's true validity.
150
- */
151
- function getCombinedFieldValidityData(validityData, invalid) {
152
- return {
153
- ...validityData,
154
- state: {
155
- ...validityData.state,
156
- valid: !invalid && validityData.state.valid
157
- }
158
- };
159
- }
160
-
161
- const FormContext = /*#__PURE__*/React__namespace.createContext({
162
- formRef: {
163
- current: {
164
- fields: new Map()
165
- }
166
- },
167
- errors: {},
168
- clearErrors: useRenderElement.NOOP,
169
- validationMode: 'onSubmit',
170
- submitAttemptedRef: {
171
- current: false
172
- }
173
- });
174
- if (process.env.NODE_ENV !== "production") FormContext.displayName = "FormContext";
175
- function useFormContext() {
176
- return React__namespace.useContext(FormContext);
177
- }
178
-
179
- function useField(params) {
180
- const {
181
- enabled = true,
182
- value,
183
- id,
184
- name,
185
- controlRef,
186
- commit
187
- } = params;
188
- const {
189
- formRef
190
- } = useFormContext();
191
- const {
192
- invalid,
193
- markedDirtyRef,
194
- validityData,
195
- setValidityData
196
- } = useFieldRootContext();
197
- const getValue = useButton.useStableCallback(params.getValue);
198
- useButton.useIsoLayoutEffect(() => {
199
- if (!enabled) {
200
- return;
201
- }
202
- let initialValue = value;
203
- if (initialValue === undefined) {
204
- initialValue = getValue();
205
- }
206
- if (validityData.initialValue === null && initialValue !== null) {
207
- setValidityData(prev => ({
208
- ...prev,
209
- initialValue
210
- }));
211
- }
212
- }, [enabled, setValidityData, value, validityData.initialValue, getValue]);
213
- useButton.useIsoLayoutEffect(() => {
214
- if (!enabled || !id) {
215
- return;
216
- }
217
- formRef.current.fields.set(id, {
218
- getValue,
219
- name,
220
- controlRef,
221
- validityData: getCombinedFieldValidityData(validityData, invalid),
222
- validate(flushSync = true) {
223
- let nextValue = value;
224
- if (nextValue === undefined) {
225
- nextValue = getValue();
226
- }
227
- markedDirtyRef.current = true;
228
- if (!flushSync) {
229
- commit(nextValue);
230
- } else {
231
- // Synchronously update the validity state so the submit event can be prevented.
232
- ReactDOM__namespace.flushSync(() => commit(nextValue));
233
- }
234
- }
235
- });
236
- }, [commit, controlRef, enabled, formRef, getValue, id, invalid, markedDirtyRef, name, validityData, value]);
237
- useButton.useIsoLayoutEffect(() => {
238
- const fields = formRef.current.fields;
239
- return () => {
240
- if (id) {
241
- fields.delete(id);
242
- }
243
- };
244
- }, [formRef, id]);
245
- }
246
-
247
- /**
248
- * A context for providing [labelable elements](https://html.spec.whatwg.org/multipage/forms.html#category-label)\
249
- * with an accessible name (label) and description.
250
- */
251
- const LabelableContext = /*#__PURE__*/React__namespace.createContext({
252
- controlId: undefined,
253
- registerControlId: useRenderElement.NOOP,
254
- labelId: undefined,
255
- setLabelId: useRenderElement.NOOP,
256
- messageIds: [],
257
- setMessageIds: useRenderElement.NOOP,
258
- getDescriptionProps: externalProps => externalProps
259
- });
260
- if (process.env.NODE_ENV !== "production") LabelableContext.displayName = "LabelableContext";
261
- function useLabelableContext() {
262
- return React__namespace.useContext(LabelableContext);
263
- }
264
-
265
- function useLabelableId(params = {}) {
266
- const {
267
- id,
268
- implicit = false,
269
- controlRef
270
- } = params;
271
- const {
272
- controlId,
273
- registerControlId
274
- } = useLabelableContext();
275
- const defaultId = useButton.useBaseUiId(id);
276
- const controlIdForEffect = implicit ? controlId : undefined;
277
- const controlSourceRef = useRenderElement.useRefWithInit(() => Symbol('labelable-control'));
278
- const hasRegisteredRef = React__namespace.useRef(false);
279
- const hadExplicitIdRef = React__namespace.useRef(id != null);
280
- const unregisterControlId = useButton.useStableCallback(() => {
281
- if (!hasRegisteredRef.current || registerControlId === useRenderElement.NOOP) {
282
- return;
283
- }
284
- hasRegisteredRef.current = false;
285
- registerControlId(controlSourceRef.current, undefined);
286
- });
287
- useButton.useIsoLayoutEffect(() => {
288
- if (registerControlId === useRenderElement.NOOP) {
289
- return undefined;
290
- }
291
- let nextId;
292
- if (implicit) {
293
- const elem = controlRef?.current;
294
- if (floatingUi_utils_dom.isElement(elem) && elem.closest('label') != null) {
295
- nextId = id ?? null;
296
- } else {
297
- nextId = controlIdForEffect ?? defaultId;
298
- }
299
- } else if (id != null) {
300
- hadExplicitIdRef.current = true;
301
- nextId = id;
302
- } else if (hadExplicitIdRef.current) {
303
- nextId = defaultId;
304
- } else {
305
- unregisterControlId();
306
- return undefined;
307
- }
308
- if (nextId === undefined) {
309
- unregisterControlId();
310
- return undefined;
311
- }
312
- hasRegisteredRef.current = true;
313
- registerControlId(controlSourceRef.current, nextId);
314
- return undefined;
315
- }, [id, controlRef, controlIdForEffect, registerControlId, implicit, defaultId, controlSourceRef, unregisterControlId]);
316
- React__namespace.useEffect(() => {
317
- return unregisterControlId;
318
- }, [unregisterControlId]);
319
- return controlId ?? defaultId;
320
- }
4
+ var useButton = require('./useButton-cjs.js');
5
+ var useLabelableId = require('./useLabelableId-cjs.js');
321
6
 
322
7
  function useRegisteredLabelId(idProp, setLabelId) {
323
8
  const id = useButton.useBaseUiId(idProp);
@@ -341,7 +26,7 @@ function useLabel(params = {}) {
341
26
  const {
342
27
  controlId: contextControlId,
343
28
  setLabelId: setContextLabelId
344
- } = useLabelableContext();
29
+ } = useLabelableId.useLabelableContext();
345
30
  const syncLabelId = useButton.useStableCallback(nextLabelId => {
346
31
  setContextLabelId(nextLabelId);
347
32
  setLabelIdProp?.(nextLabelId);
@@ -397,15 +82,4 @@ function focusElementWithVisible(element) {
397
82
  });
398
83
  }
399
84
 
400
- exports.DEFAULT_FIELD_STATE_ATTRIBUTES = DEFAULT_FIELD_STATE_ATTRIBUTES;
401
- exports.DEFAULT_VALIDITY_STATE = DEFAULT_VALIDITY_STATE;
402
- exports.FieldRootContext = FieldRootContext;
403
- exports.LabelableContext = LabelableContext;
404
- exports.fieldValidityMapping = fieldValidityMapping;
405
- exports.getCombinedFieldValidityData = getCombinedFieldValidityData;
406
- exports.useField = useField;
407
- exports.useFieldRootContext = useFieldRootContext;
408
- exports.useFormContext = useFormContext;
409
85
  exports.useLabel = useLabel;
410
- exports.useLabelableContext = useLabelableContext;
411
- exports.useLabelableId = useLabelableId;
@@ -1,301 +1,6 @@
1
- import * as ReactDOM from 'react-dom';
2
- import { e as useStableCallback, j as useIsoLayoutEffect, b as useBaseUiId, k as getTarget, o as ownerDocument } from './useButton-es.js';
3
- import * as React from 'react';
4
- import { N as NOOP, f as formatErrorMessage, E as EMPTY_OBJECT, a as useRefWithInit } from './useRenderElement-es.js';
5
- import { b as isElement, a as isHTMLElement } from './floating-ui.utils.dom-es.js';
6
-
7
- let FieldControlDataAttributes = /*#__PURE__*/function (FieldControlDataAttributes) {
8
- /**
9
- * Present when the field is disabled.
10
- */
11
- FieldControlDataAttributes["disabled"] = "data-disabled";
12
- /**
13
- * Present when the field is in valid state.
14
- */
15
- FieldControlDataAttributes["valid"] = "data-valid";
16
- /**
17
- * Present when the field is in invalid state.
18
- */
19
- FieldControlDataAttributes["invalid"] = "data-invalid";
20
- /**
21
- * Present when the field has been touched.
22
- */
23
- FieldControlDataAttributes["touched"] = "data-touched";
24
- /**
25
- * Present when the field's value has changed.
26
- */
27
- FieldControlDataAttributes["dirty"] = "data-dirty";
28
- /**
29
- * Present when the field is filled.
30
- */
31
- FieldControlDataAttributes["filled"] = "data-filled";
32
- /**
33
- * Present when the field control is focused.
34
- */
35
- FieldControlDataAttributes["focused"] = "data-focused";
36
- return FieldControlDataAttributes;
37
- }({});
38
-
39
- const DEFAULT_VALIDITY_STATE = {
40
- badInput: false,
41
- customError: false,
42
- patternMismatch: false,
43
- rangeOverflow: false,
44
- rangeUnderflow: false,
45
- stepMismatch: false,
46
- tooLong: false,
47
- tooShort: false,
48
- typeMismatch: false,
49
- valid: null,
50
- valueMissing: false
51
- };
52
- const DEFAULT_FIELD_STATE_ATTRIBUTES = {
53
- valid: null,
54
- touched: false,
55
- dirty: false,
56
- filled: false,
57
- focused: false
58
- };
59
- const DEFAULT_FIELD_ROOT_STATE = {
60
- disabled: false,
61
- ...DEFAULT_FIELD_STATE_ATTRIBUTES
62
- };
63
- const fieldValidityMapping = {
64
- valid(value) {
65
- if (value === null) {
66
- return null;
67
- }
68
- if (value) {
69
- return {
70
- [FieldControlDataAttributes.valid]: ''
71
- };
72
- }
73
- return {
74
- [FieldControlDataAttributes.invalid]: ''
75
- };
76
- }
77
- };
78
-
79
- const FieldRootContext = /*#__PURE__*/React.createContext({
80
- invalid: undefined,
81
- name: undefined,
82
- validityData: {
83
- state: DEFAULT_VALIDITY_STATE,
84
- errors: [],
85
- error: '',
86
- value: '',
87
- initialValue: null
88
- },
89
- setValidityData: NOOP,
90
- disabled: undefined,
91
- touched: DEFAULT_FIELD_STATE_ATTRIBUTES.touched,
92
- setTouched: NOOP,
93
- dirty: DEFAULT_FIELD_STATE_ATTRIBUTES.dirty,
94
- setDirty: NOOP,
95
- filled: DEFAULT_FIELD_STATE_ATTRIBUTES.filled,
96
- setFilled: NOOP,
97
- focused: DEFAULT_FIELD_STATE_ATTRIBUTES.focused,
98
- setFocused: NOOP,
99
- validate: () => null,
100
- validationMode: 'onSubmit',
101
- validationDebounceTime: 0,
102
- shouldValidateOnChange: () => false,
103
- state: DEFAULT_FIELD_ROOT_STATE,
104
- markedDirtyRef: {
105
- current: false
106
- },
107
- validation: {
108
- getValidationProps: (props = EMPTY_OBJECT) => props,
109
- getInputValidationProps: (props = EMPTY_OBJECT) => props,
110
- inputRef: {
111
- current: null
112
- },
113
- commit: async () => {}
114
- }
115
- });
116
- if (process.env.NODE_ENV !== "production") FieldRootContext.displayName = "FieldRootContext";
117
- function useFieldRootContext(optional = true) {
118
- const context = React.useContext(FieldRootContext);
119
- if (context.setValidityData === NOOP && !optional) {
120
- throw new Error(process.env.NODE_ENV !== "production" ? 'Base UI: FieldRootContext is missing. Field parts must be placed within <Field.Root>.' : formatErrorMessage(28));
121
- }
122
- return context;
123
- }
124
-
125
- /**
126
- * Combines the field's client-side, stateful validity data with the external invalid state to
127
- * determine the field's true validity.
128
- */
129
- function getCombinedFieldValidityData(validityData, invalid) {
130
- return {
131
- ...validityData,
132
- state: {
133
- ...validityData.state,
134
- valid: !invalid && validityData.state.valid
135
- }
136
- };
137
- }
138
-
139
- const FormContext = /*#__PURE__*/React.createContext({
140
- formRef: {
141
- current: {
142
- fields: new Map()
143
- }
144
- },
145
- errors: {},
146
- clearErrors: NOOP,
147
- validationMode: 'onSubmit',
148
- submitAttemptedRef: {
149
- current: false
150
- }
151
- });
152
- if (process.env.NODE_ENV !== "production") FormContext.displayName = "FormContext";
153
- function useFormContext() {
154
- return React.useContext(FormContext);
155
- }
156
-
157
- function useField(params) {
158
- const {
159
- enabled = true,
160
- value,
161
- id,
162
- name,
163
- controlRef,
164
- commit
165
- } = params;
166
- const {
167
- formRef
168
- } = useFormContext();
169
- const {
170
- invalid,
171
- markedDirtyRef,
172
- validityData,
173
- setValidityData
174
- } = useFieldRootContext();
175
- const getValue = useStableCallback(params.getValue);
176
- useIsoLayoutEffect(() => {
177
- if (!enabled) {
178
- return;
179
- }
180
- let initialValue = value;
181
- if (initialValue === undefined) {
182
- initialValue = getValue();
183
- }
184
- if (validityData.initialValue === null && initialValue !== null) {
185
- setValidityData(prev => ({
186
- ...prev,
187
- initialValue
188
- }));
189
- }
190
- }, [enabled, setValidityData, value, validityData.initialValue, getValue]);
191
- useIsoLayoutEffect(() => {
192
- if (!enabled || !id) {
193
- return;
194
- }
195
- formRef.current.fields.set(id, {
196
- getValue,
197
- name,
198
- controlRef,
199
- validityData: getCombinedFieldValidityData(validityData, invalid),
200
- validate(flushSync = true) {
201
- let nextValue = value;
202
- if (nextValue === undefined) {
203
- nextValue = getValue();
204
- }
205
- markedDirtyRef.current = true;
206
- if (!flushSync) {
207
- commit(nextValue);
208
- } else {
209
- // Synchronously update the validity state so the submit event can be prevented.
210
- ReactDOM.flushSync(() => commit(nextValue));
211
- }
212
- }
213
- });
214
- }, [commit, controlRef, enabled, formRef, getValue, id, invalid, markedDirtyRef, name, validityData, value]);
215
- useIsoLayoutEffect(() => {
216
- const fields = formRef.current.fields;
217
- return () => {
218
- if (id) {
219
- fields.delete(id);
220
- }
221
- };
222
- }, [formRef, id]);
223
- }
224
-
225
- /**
226
- * A context for providing [labelable elements](https://html.spec.whatwg.org/multipage/forms.html#category-label)\
227
- * with an accessible name (label) and description.
228
- */
229
- const LabelableContext = /*#__PURE__*/React.createContext({
230
- controlId: undefined,
231
- registerControlId: NOOP,
232
- labelId: undefined,
233
- setLabelId: NOOP,
234
- messageIds: [],
235
- setMessageIds: NOOP,
236
- getDescriptionProps: externalProps => externalProps
237
- });
238
- if (process.env.NODE_ENV !== "production") LabelableContext.displayName = "LabelableContext";
239
- function useLabelableContext() {
240
- return React.useContext(LabelableContext);
241
- }
242
-
243
- function useLabelableId(params = {}) {
244
- const {
245
- id,
246
- implicit = false,
247
- controlRef
248
- } = params;
249
- const {
250
- controlId,
251
- registerControlId
252
- } = useLabelableContext();
253
- const defaultId = useBaseUiId(id);
254
- const controlIdForEffect = implicit ? controlId : undefined;
255
- const controlSourceRef = useRefWithInit(() => Symbol('labelable-control'));
256
- const hasRegisteredRef = React.useRef(false);
257
- const hadExplicitIdRef = React.useRef(id != null);
258
- const unregisterControlId = useStableCallback(() => {
259
- if (!hasRegisteredRef.current || registerControlId === NOOP) {
260
- return;
261
- }
262
- hasRegisteredRef.current = false;
263
- registerControlId(controlSourceRef.current, undefined);
264
- });
265
- useIsoLayoutEffect(() => {
266
- if (registerControlId === NOOP) {
267
- return undefined;
268
- }
269
- let nextId;
270
- if (implicit) {
271
- const elem = controlRef?.current;
272
- if (isElement(elem) && elem.closest('label') != null) {
273
- nextId = id ?? null;
274
- } else {
275
- nextId = controlIdForEffect ?? defaultId;
276
- }
277
- } else if (id != null) {
278
- hadExplicitIdRef.current = true;
279
- nextId = id;
280
- } else if (hadExplicitIdRef.current) {
281
- nextId = defaultId;
282
- } else {
283
- unregisterControlId();
284
- return undefined;
285
- }
286
- if (nextId === undefined) {
287
- unregisterControlId();
288
- return undefined;
289
- }
290
- hasRegisteredRef.current = true;
291
- registerControlId(controlSourceRef.current, nextId);
292
- return undefined;
293
- }, [id, controlRef, controlIdForEffect, registerControlId, implicit, defaultId, controlSourceRef, unregisterControlId]);
294
- React.useEffect(() => {
295
- return unregisterControlId;
296
- }, [unregisterControlId]);
297
- return controlId ?? defaultId;
298
- }
1
+ import { a as isHTMLElement } from './floating-ui.utils.dom-es.js';
2
+ import { u as useBaseUiId, a as useIsoLayoutEffect, b as useStableCallback, g as getTarget, o as ownerDocument } from './useButton-es.js';
3
+ import { u as useLabelableContext } from './useLabelableId-es.js';
299
4
 
300
5
  function useRegisteredLabelId(idProp, setLabelId) {
301
6
  const id = useBaseUiId(idProp);
@@ -375,4 +80,4 @@ function focusElementWithVisible(element) {
375
80
  });
376
81
  }
377
82
 
378
- export { DEFAULT_VALIDITY_STATE as D, FieldRootContext as F, LabelableContext as L, useFormContext as a, useFieldRootContext as b, useLabel as c, useLabelableId as d, useField as e, fieldValidityMapping as f, getCombinedFieldValidityData as g, DEFAULT_FIELD_STATE_ATTRIBUTES as h, useLabelableContext as u };
83
+ export { useLabel as u };