@jobber/components 8.14.0 → 8.15.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.
- package/FilterPicker.d.ts +1 -0
- package/{Combobox.js → FilterPicker.js} +3 -3
- package/dist/Autocomplete-es.js +1 -1
- package/dist/BottomSheet-cjs.js +109 -77
- package/dist/BottomSheet-es.js +103 -75
- package/dist/Card/index.cjs +1 -2
- package/dist/Card/index.mjs +1 -2
- package/dist/DataDump/index.cjs +1 -2
- package/dist/DataDump/index.mjs +1 -2
- package/dist/DataList/components/DataListFilters/components/DataListSort/index.cjs +11 -11
- package/dist/DataList/components/DataListFilters/components/DataListSort/index.mjs +11 -11
- package/dist/DataList/components/DataListFilters/index.cjs +11 -11
- package/dist/DataList/components/DataListFilters/index.mjs +11 -11
- package/dist/DataList/index.cjs +11 -11
- package/dist/DataList/index.mjs +11 -11
- package/dist/DataListSort-cjs.js +5 -5
- package/dist/DataListSort-es.js +5 -5
- package/dist/FilterPicker/FilterPicker.d.ts +11 -0
- package/dist/{Combobox/Combobox.types.d.ts → FilterPicker/FilterPicker.types.d.ts} +51 -51
- package/dist/FilterPicker/FilterPickerProvider.d.ts +18 -0
- package/dist/FilterPicker/components/FilterPickerAction/FilterPickerAction.d.ts +3 -0
- package/dist/FilterPicker/components/FilterPickerAction/index.cjs +12 -0
- package/dist/FilterPicker/components/FilterPickerAction/index.d.ts +1 -0
- package/dist/FilterPicker/components/FilterPickerAction/index.mjs +6 -0
- package/dist/FilterPicker/components/FilterPickerActivator/FilterPickerActivator.d.ts +3 -0
- package/dist/{Combobox/components/ComboboxActivator → FilterPicker/components/FilterPickerActivator}/index.cjs +3 -3
- package/dist/FilterPicker/components/FilterPickerActivator/index.d.ts +1 -0
- package/dist/{Combobox/components/ComboboxActivator → FilterPicker/components/FilterPickerActivator}/index.mjs +2 -2
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContent.d.ts +3 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentHeader/FilterPickerContentHeader.d.ts +3 -0
- package/dist/{Combobox/components/ComboboxContent/ComboboxContentHeader → FilterPicker/components/FilterPickerContent/FilterPickerContentHeader}/index.cjs +2 -2
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentHeader/index.d.ts +1 -0
- package/dist/{Combobox/components/ComboboxContent/ComboboxContentHeader → FilterPicker/components/FilterPickerContent/FilterPickerContentHeader}/index.mjs +1 -1
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentList/FilterPickerContentList.d.ts +3 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentList/FilterPickerContentList.module.css.d.ts +13 -0
- package/dist/{Combobox/components/ComboboxContent/ComboboxContentList → FilterPicker/components/FilterPickerContent/FilterPickerContentList}/index.cjs +5 -5
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentList/index.d.ts +1 -0
- package/dist/{Combobox/components/ComboboxContent/ComboboxContentList → FilterPicker/components/FilterPickerContent/FilterPickerContentList}/index.mjs +4 -4
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentSearch/FilterPickerContentSearch.d.ts +3 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentSearch/index.cjs +10 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentSearch/index.d.ts +1 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerContentSearch/index.mjs +4 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerLoadMore/FilterPickerLoadMore.d.ts +6 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerLoadMore/index.cjs +9 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerLoadMore/index.d.ts +1 -0
- package/dist/FilterPicker/components/FilterPickerContent/FilterPickerLoadMore/index.mjs +3 -0
- package/dist/{Combobox/components/ComboboxContent → FilterPicker/components/FilterPickerContent}/index.cjs +8 -8
- package/dist/FilterPicker/components/FilterPickerContent/index.d.ts +1 -0
- package/dist/{Combobox/components/ComboboxContent → FilterPicker/components/FilterPickerContent}/index.mjs +7 -7
- package/dist/FilterPicker/components/FilterPickerOption/FilterPickerOption.d.ts +3 -0
- package/dist/{Combobox/components/ComboboxOption → FilterPicker/components/FilterPickerOption}/index.cjs +3 -3
- package/dist/FilterPicker/components/FilterPickerOption/index.d.ts +1 -0
- package/dist/{Combobox/components/ComboboxOption → FilterPicker/components/FilterPickerOption}/index.mjs +2 -2
- package/dist/FilterPicker/components/FilterPickerTrigger/FilterPickerTrigger.d.ts +3 -0
- package/dist/{Combobox/components/ComboboxTrigger → FilterPicker/components/FilterPickerTrigger}/index.cjs +3 -3
- package/dist/FilterPicker/components/FilterPickerTrigger/index.d.ts +1 -0
- package/dist/{Combobox/components/ComboboxTrigger → FilterPicker/components/FilterPickerTrigger}/index.mjs +2 -2
- package/dist/FilterPicker/constants.d.ts +1 -0
- package/dist/FilterPicker/hooks/useFilterPicker.d.ts +17 -0
- package/dist/FilterPicker/hooks/useFilterPickerAccessibility.d.ts +9 -0
- package/dist/FilterPicker/hooks/useFilterPickerActivatorAccessibility.d.ts +2 -0
- package/dist/FilterPicker/hooks/useFilterPickerContent.d.ts +9 -0
- package/dist/FilterPicker/hooks/useFilterPickerValidation.d.ts +12 -0
- package/dist/FilterPicker/hooks/useMakeFilterPickerHandlers.d.ts +8 -0
- package/dist/{Combobox → FilterPicker}/index.cjs +13 -13
- package/dist/FilterPicker/index.d.ts +3 -0
- package/dist/{Combobox → FilterPicker}/index.mjs +11 -11
- package/dist/{Combobox-cjs.js → FilterPicker-cjs.js} +25 -25
- package/dist/{Combobox-es.js → FilterPicker-es.js} +25 -25
- package/dist/{ComboboxAction-cjs.js → FilterPickerAction-cjs.js} +5 -5
- package/dist/{ComboboxAction-es.js → FilterPickerAction-es.js} +5 -5
- package/dist/{ComboboxActivator-cjs.js → FilterPickerActivator-cjs.js} +8 -8
- package/dist/{ComboboxActivator-es.js → FilterPickerActivator-es.js} +9 -9
- package/dist/{ComboboxContent-cjs.js → FilterPickerContent-cjs.js} +19 -19
- package/dist/{ComboboxContent-es.js → FilterPickerContent-es.js} +20 -20
- package/dist/{ComboboxContentHeader-cjs.js → FilterPickerContentHeader-cjs.js} +4 -4
- package/dist/{ComboboxContentHeader-es.js → FilterPickerContentHeader-es.js} +4 -4
- package/dist/{ComboboxContentList-cjs.js → FilterPickerContentList-cjs.js} +7 -7
- package/dist/{ComboboxContentList-es.js → FilterPickerContentList-es.js} +7 -7
- package/dist/{ComboboxContentSearch-cjs.js → FilterPickerContentSearch-cjs.js} +4 -4
- package/dist/{ComboboxContentSearch-es.js → FilterPickerContentSearch-es.js} +4 -4
- package/dist/FilterPickerLoadMore-cjs.js +16 -0
- package/dist/{ComboboxLoadMore-es.js → FilterPickerLoadMore-es.js} +4 -4
- package/dist/{ComboboxOption-cjs.js → FilterPickerOption-cjs.js} +5 -5
- package/dist/{ComboboxOption-es.js → FilterPickerOption-es.js} +5 -5
- package/dist/FilterPickerProvider-cjs.js +13 -0
- package/dist/FilterPickerProvider-es.js +10 -0
- package/dist/{ComboboxTrigger-cjs.js → FilterPickerTrigger-cjs.js} +4 -4
- package/dist/{ComboboxTrigger-es.js → FilterPickerTrigger-es.js} +4 -4
- package/dist/InputNumberExperimental-cjs.js +3 -4
- package/dist/InputNumberExperimental-es.js +2 -3
- package/dist/Menu/index.cjs +1 -2
- package/dist/Menu/index.mjs +1 -2
- package/dist/Menu-cjs.js +11 -56
- package/dist/Menu-es.js +4 -49
- package/dist/MenuSubmenuTrigger-cjs.js +160 -345
- package/dist/MenuSubmenuTrigger-es.js +4 -186
- package/dist/Modal/index.mjs +1 -1
- package/dist/NumberFieldInput-cjs.js +3 -4
- package/dist/NumberFieldInput-es.js +2 -3
- package/dist/Page/index.cjs +1 -2
- package/dist/Page/index.mjs +1 -2
- package/dist/{DrawerRoot-cjs.js → ScrollAreaViewport-cjs.js} +1042 -3
- package/dist/{DrawerRoot-es.js → ScrollAreaViewport-es.js} +1035 -5
- package/dist/constants-cjs.js +2 -2
- package/dist/constants-es.js +2 -2
- package/dist/docs/Autocomplete/Autocomplete.md +1 -1
- package/dist/docs/Chip/Chip.md +4 -4
- package/dist/docs/DataList/DataList.md +16 -15
- package/dist/docs/{Combobox/Combobox.md → FilterPicker/FilterPicker.md} +91 -85
- package/dist/docs/Menu/Menu.md +1 -1
- package/dist/docs/MultiSelect/MultiSelect.md +1 -1
- package/dist/docs/Tabs/Tabs.md +2 -2
- package/dist/docs/index.md +1 -1
- package/dist/docs/usage-guidelines/usage-guidelines.md +5 -5
- package/dist/floating-ui.react-es.js +1 -1
- package/dist/index.cjs +14 -15
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.mjs +12 -13
- package/dist/primitives/BottomSheet/BottomSheet.d.ts +15 -16
- package/dist/primitives/BottomSheet/BottomSheet.types.d.ts +27 -0
- package/dist/primitives/BottomSheet/BottomSheet.utils.d.ts +6 -0
- package/dist/primitives/BottomSheet/index.cjs +7 -2
- package/dist/primitives/BottomSheet/index.d.ts +1 -0
- package/dist/primitives/BottomSheet/index.mjs +7 -2
- package/dist/primitives/InputNumberExperimental/index.cjs +1 -2
- package/dist/primitives/InputNumberExperimental/index.mjs +1 -2
- package/dist/primitives/index.cjs +7 -8
- package/dist/primitives/index.mjs +7 -8
- package/dist/styles.css +115 -54
- package/dist/unstyledPrimitives/index.cjs +665 -297
- package/dist/unstyledPrimitives/index.d.ts +1 -0
- package/dist/unstyledPrimitives/index.mjs +375 -8
- package/dist/useRenderElement-es.js +1 -1
- package/dist/useValueChanged-cjs.js +251 -1
- package/dist/useValueChanged-es.js +248 -2
- package/dist/utils/meta/meta.json +5 -5
- package/package.json +6 -6
- package/rollup.config.mjs +2 -2
- package/Combobox.d.ts +0 -1
- package/dist/Combobox/Combobox.d.ts +0 -11
- package/dist/Combobox/ComboboxProvider.d.ts +0 -18
- package/dist/Combobox/components/ComboboxAction/ComboboxAction.d.ts +0 -3
- package/dist/Combobox/components/ComboboxAction/index.cjs +0 -12
- package/dist/Combobox/components/ComboboxAction/index.d.ts +0 -1
- package/dist/Combobox/components/ComboboxAction/index.mjs +0 -6
- package/dist/Combobox/components/ComboboxActivator/ComboboxActivator.d.ts +0 -3
- package/dist/Combobox/components/ComboboxActivator/index.d.ts +0 -1
- package/dist/Combobox/components/ComboboxContent/ComboboxContent.d.ts +0 -3
- package/dist/Combobox/components/ComboboxContent/ComboboxContentHeader/ComboboxContentHeader.d.ts +0 -3
- package/dist/Combobox/components/ComboboxContent/ComboboxContentHeader/index.d.ts +0 -1
- package/dist/Combobox/components/ComboboxContent/ComboboxContentList/ComboboxContentList.d.ts +0 -3
- package/dist/Combobox/components/ComboboxContent/ComboboxContentList/index.d.ts +0 -1
- package/dist/Combobox/components/ComboboxContent/ComboboxContentSearch/ComboboxContentSearch.d.ts +0 -3
- package/dist/Combobox/components/ComboboxContent/ComboboxContentSearch/index.cjs +0 -10
- package/dist/Combobox/components/ComboboxContent/ComboboxContentSearch/index.d.ts +0 -1
- package/dist/Combobox/components/ComboboxContent/ComboboxContentSearch/index.mjs +0 -4
- package/dist/Combobox/components/ComboboxContent/ComboboxLoadMore/ComboboxLoadMore.d.ts +0 -6
- package/dist/Combobox/components/ComboboxContent/ComboboxLoadMore/index.cjs +0 -9
- package/dist/Combobox/components/ComboboxContent/ComboboxLoadMore/index.d.ts +0 -1
- package/dist/Combobox/components/ComboboxContent/ComboboxLoadMore/index.mjs +0 -3
- package/dist/Combobox/components/ComboboxContent/index.d.ts +0 -1
- package/dist/Combobox/components/ComboboxOption/ComboboxOption.d.ts +0 -3
- package/dist/Combobox/components/ComboboxOption/index.d.ts +0 -1
- package/dist/Combobox/components/ComboboxTrigger/ComboboxTrigger.d.ts +0 -3
- package/dist/Combobox/components/ComboboxTrigger/index.d.ts +0 -1
- package/dist/Combobox/constants.d.ts +0 -1
- package/dist/Combobox/hooks/useCombobox.d.ts +0 -17
- package/dist/Combobox/hooks/useComboboxAccessibility.d.ts +0 -9
- package/dist/Combobox/hooks/useComboboxActivatorAccessibility.d.ts +0 -2
- package/dist/Combobox/hooks/useComboboxContent.d.ts +0 -9
- package/dist/Combobox/hooks/useComboboxValidation.d.ts +0 -12
- package/dist/Combobox/hooks/useMakeComboboxHandlers.d.ts +0 -8
- package/dist/Combobox/index.d.ts +0 -3
- package/dist/ComboboxLoadMore-cjs.js +0 -16
- package/dist/ComboboxProvider-cjs.js +0 -13
- package/dist/ComboboxProvider-es.js +0 -10
- package/dist/useBaseUiId-cjs.js +0 -275
- package/dist/useBaseUiId-es.js +0 -251
package/dist/useBaseUiId-es.js
DELETED
|
@@ -1,251 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { a as isHTMLElement } from './floating-ui.utils.dom-es.js';
|
|
3
|
-
import { S as SafeReact, u as useIsoLayoutEffect, a as useStableCallback, b as useId } from './useValueChanged-es.js';
|
|
4
|
-
import { f as formatErrorMessage, m as mergeProps, a as makeEventPreventable } from './useRenderElement-es.js';
|
|
5
|
-
|
|
6
|
-
let set;
|
|
7
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
8
|
-
set = new Set();
|
|
9
|
-
}
|
|
10
|
-
function error(...messages) {
|
|
11
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
12
|
-
const messageKey = messages.join(' ');
|
|
13
|
-
if (!set.has(messageKey)) {
|
|
14
|
-
set.add(messageKey);
|
|
15
|
-
console.error(`Base UI: ${messageKey}`);
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
const CompositeRootContext = /*#__PURE__*/React.createContext(undefined);
|
|
21
|
-
if (process.env.NODE_ENV !== "production") CompositeRootContext.displayName = "CompositeRootContext";
|
|
22
|
-
function useCompositeRootContext(optional = false) {
|
|
23
|
-
const context = React.useContext(CompositeRootContext);
|
|
24
|
-
if (context === undefined && !optional) {
|
|
25
|
-
throw new Error(process.env.NODE_ENV !== "production" ? 'Base UI: CompositeRootContext is missing. Composite parts must be placed within <Composite.Root>.' : formatErrorMessage(16));
|
|
26
|
-
}
|
|
27
|
-
return context;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
function useFocusableWhenDisabled(parameters) {
|
|
31
|
-
const {
|
|
32
|
-
focusableWhenDisabled,
|
|
33
|
-
disabled,
|
|
34
|
-
composite = false,
|
|
35
|
-
tabIndex: tabIndexProp = 0,
|
|
36
|
-
isNativeButton
|
|
37
|
-
} = parameters;
|
|
38
|
-
const isFocusableComposite = composite && focusableWhenDisabled !== false;
|
|
39
|
-
const isNonFocusableComposite = composite && focusableWhenDisabled === false;
|
|
40
|
-
|
|
41
|
-
// we can't explicitly assign `undefined` to any of these props because it
|
|
42
|
-
// would otherwise prevent subsequently merged props from setting them
|
|
43
|
-
const props = React.useMemo(() => {
|
|
44
|
-
const additionalProps = {
|
|
45
|
-
// allow Tabbing away from focusableWhenDisabled elements
|
|
46
|
-
onKeyDown(event) {
|
|
47
|
-
if (disabled && focusableWhenDisabled && event.key !== 'Tab') {
|
|
48
|
-
event.preventDefault();
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
};
|
|
52
|
-
if (!composite) {
|
|
53
|
-
additionalProps.tabIndex = tabIndexProp;
|
|
54
|
-
if (!isNativeButton && disabled) {
|
|
55
|
-
additionalProps.tabIndex = focusableWhenDisabled ? tabIndexProp : -1;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
if (isNativeButton && (focusableWhenDisabled || isFocusableComposite) || !isNativeButton && disabled) {
|
|
59
|
-
additionalProps['aria-disabled'] = disabled;
|
|
60
|
-
}
|
|
61
|
-
if (isNativeButton && (!focusableWhenDisabled || isNonFocusableComposite)) {
|
|
62
|
-
additionalProps.disabled = disabled;
|
|
63
|
-
}
|
|
64
|
-
return additionalProps;
|
|
65
|
-
}, [composite, disabled, focusableWhenDisabled, isFocusableComposite, isNonFocusableComposite, isNativeButton, tabIndexProp]);
|
|
66
|
-
return {
|
|
67
|
-
props
|
|
68
|
-
};
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
function useButton(parameters = {}) {
|
|
72
|
-
const {
|
|
73
|
-
disabled = false,
|
|
74
|
-
focusableWhenDisabled,
|
|
75
|
-
tabIndex = 0,
|
|
76
|
-
native: isNativeButton = true,
|
|
77
|
-
composite: compositeProp
|
|
78
|
-
} = parameters;
|
|
79
|
-
const elementRef = React.useRef(null);
|
|
80
|
-
const compositeRootContext = useCompositeRootContext(true);
|
|
81
|
-
const isCompositeItem = compositeProp ?? compositeRootContext !== undefined;
|
|
82
|
-
const {
|
|
83
|
-
props: focusableWhenDisabledProps
|
|
84
|
-
} = useFocusableWhenDisabled({
|
|
85
|
-
focusableWhenDisabled,
|
|
86
|
-
disabled,
|
|
87
|
-
composite: isCompositeItem,
|
|
88
|
-
tabIndex,
|
|
89
|
-
isNativeButton
|
|
90
|
-
});
|
|
91
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
92
|
-
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
93
|
-
React.useEffect(() => {
|
|
94
|
-
if (!elementRef.current) {
|
|
95
|
-
return;
|
|
96
|
-
}
|
|
97
|
-
const isButtonTag = isButtonElement(elementRef.current);
|
|
98
|
-
if (isNativeButton) {
|
|
99
|
-
if (!isButtonTag) {
|
|
100
|
-
const ownerStackMessage = SafeReact.captureOwnerStack?.() || '';
|
|
101
|
-
const message = 'A component that acts as a button expected a native <button> because the ' + '`nativeButton` prop is true. Rendering a non-<button> removes native button ' + 'semantics, which can impact forms and accessibility. Use a real <button> in the ' + '`render` prop, or set `nativeButton` to `false`.';
|
|
102
|
-
error(`${message}${ownerStackMessage}`);
|
|
103
|
-
}
|
|
104
|
-
} else if (isButtonTag) {
|
|
105
|
-
const ownerStackMessage = SafeReact.captureOwnerStack?.() || '';
|
|
106
|
-
const message = 'A component that acts as a button expected a non-<button> because the `nativeButton` ' + 'prop is false. Rendering a <button> keeps native behavior while Base UI applies ' + 'non-native attributes and handlers, which can add unintended extra attributes (such ' + 'as `role` or `aria-disabled`). Use a non-<button> in the `render` prop, or set ' + '`nativeButton` to `true`.';
|
|
107
|
-
error(`${message}${ownerStackMessage}`);
|
|
108
|
-
}
|
|
109
|
-
}, [isNativeButton]);
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
// handles a disabled composite button rendering another button, e.g.
|
|
113
|
-
// <Toolbar.Button disabled render={<Menu.Trigger />} />
|
|
114
|
-
// the `disabled` prop needs to pass through 2 `useButton`s then finally
|
|
115
|
-
// delete the `disabled` attribute from DOM
|
|
116
|
-
const updateDisabled = React.useCallback(() => {
|
|
117
|
-
const element = elementRef.current;
|
|
118
|
-
if (!isButtonElement(element)) {
|
|
119
|
-
return;
|
|
120
|
-
}
|
|
121
|
-
if (isCompositeItem && disabled && focusableWhenDisabledProps.disabled === undefined && element.disabled) {
|
|
122
|
-
element.disabled = false;
|
|
123
|
-
}
|
|
124
|
-
}, [disabled, focusableWhenDisabledProps.disabled, isCompositeItem]);
|
|
125
|
-
useIsoLayoutEffect(updateDisabled, [updateDisabled]);
|
|
126
|
-
const getButtonProps = React.useCallback((externalProps = {}) => {
|
|
127
|
-
const {
|
|
128
|
-
onClick: externalOnClick,
|
|
129
|
-
onMouseDown: externalOnMouseDown,
|
|
130
|
-
onKeyUp: externalOnKeyUp,
|
|
131
|
-
onKeyDown: externalOnKeyDown,
|
|
132
|
-
onPointerDown: externalOnPointerDown,
|
|
133
|
-
...otherExternalProps
|
|
134
|
-
} = externalProps;
|
|
135
|
-
const type = isNativeButton ? 'button' : undefined;
|
|
136
|
-
return mergeProps({
|
|
137
|
-
type,
|
|
138
|
-
onClick(event) {
|
|
139
|
-
if (disabled) {
|
|
140
|
-
event.preventDefault();
|
|
141
|
-
return;
|
|
142
|
-
}
|
|
143
|
-
externalOnClick?.(event);
|
|
144
|
-
},
|
|
145
|
-
onMouseDown(event) {
|
|
146
|
-
if (!disabled) {
|
|
147
|
-
externalOnMouseDown?.(event);
|
|
148
|
-
}
|
|
149
|
-
},
|
|
150
|
-
onKeyDown(event) {
|
|
151
|
-
if (disabled) {
|
|
152
|
-
return;
|
|
153
|
-
}
|
|
154
|
-
makeEventPreventable(event);
|
|
155
|
-
externalOnKeyDown?.(event);
|
|
156
|
-
if (event.baseUIHandlerPrevented) {
|
|
157
|
-
return;
|
|
158
|
-
}
|
|
159
|
-
const isCurrentTarget = event.target === event.currentTarget;
|
|
160
|
-
const currentTarget = event.currentTarget;
|
|
161
|
-
const isButton = isButtonElement(currentTarget);
|
|
162
|
-
const isLink = !isNativeButton && isValidLinkElement(currentTarget);
|
|
163
|
-
const shouldClick = isCurrentTarget && (isNativeButton ? isButton : !isLink);
|
|
164
|
-
const isEnterKey = event.key === 'Enter';
|
|
165
|
-
const isSpaceKey = event.key === ' ';
|
|
166
|
-
const role = currentTarget.getAttribute('role');
|
|
167
|
-
const isTextNavigationRole = role?.startsWith('menuitem') || role === 'option' || role === 'gridcell';
|
|
168
|
-
if (isCurrentTarget && isCompositeItem && isSpaceKey) {
|
|
169
|
-
if (event.defaultPrevented && isTextNavigationRole) {
|
|
170
|
-
return;
|
|
171
|
-
}
|
|
172
|
-
event.preventDefault();
|
|
173
|
-
if (isLink || isNativeButton && isButton) {
|
|
174
|
-
currentTarget.click();
|
|
175
|
-
event.preventBaseUIHandler();
|
|
176
|
-
} else if (shouldClick) {
|
|
177
|
-
externalOnClick?.(event);
|
|
178
|
-
event.preventBaseUIHandler();
|
|
179
|
-
}
|
|
180
|
-
return;
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
// Keyboard accessibility for native and non-native elements.
|
|
184
|
-
if (shouldClick) {
|
|
185
|
-
if (!isNativeButton && (isSpaceKey || isEnterKey)) {
|
|
186
|
-
event.preventDefault();
|
|
187
|
-
}
|
|
188
|
-
if (!isNativeButton && isEnterKey) {
|
|
189
|
-
externalOnClick?.(event);
|
|
190
|
-
}
|
|
191
|
-
}
|
|
192
|
-
},
|
|
193
|
-
onKeyUp(event) {
|
|
194
|
-
if (disabled) {
|
|
195
|
-
return;
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
// calling preventDefault in keyUp on a <button> will not dispatch a click event if Space is pressed
|
|
199
|
-
// https://codesandbox.io/p/sandbox/button-keyup-preventdefault-dn7f0
|
|
200
|
-
makeEventPreventable(event);
|
|
201
|
-
externalOnKeyUp?.(event);
|
|
202
|
-
if (event.target === event.currentTarget && isNativeButton && isCompositeItem && isButtonElement(event.currentTarget) && event.key === ' ') {
|
|
203
|
-
event.preventDefault();
|
|
204
|
-
return;
|
|
205
|
-
}
|
|
206
|
-
if (event.baseUIHandlerPrevented) {
|
|
207
|
-
return;
|
|
208
|
-
}
|
|
209
|
-
|
|
210
|
-
// Keyboard accessibility for non interactive elements
|
|
211
|
-
if (event.target === event.currentTarget && !isNativeButton && !isCompositeItem && event.key === ' ') {
|
|
212
|
-
externalOnClick?.(event);
|
|
213
|
-
}
|
|
214
|
-
},
|
|
215
|
-
onPointerDown(event) {
|
|
216
|
-
if (disabled) {
|
|
217
|
-
event.preventDefault();
|
|
218
|
-
return;
|
|
219
|
-
}
|
|
220
|
-
externalOnPointerDown?.(event);
|
|
221
|
-
}
|
|
222
|
-
}, !isNativeButton ? {
|
|
223
|
-
role: 'button'
|
|
224
|
-
} : undefined, focusableWhenDisabledProps, otherExternalProps);
|
|
225
|
-
}, [disabled, focusableWhenDisabledProps, isCompositeItem, isNativeButton]);
|
|
226
|
-
const buttonRef = useStableCallback(element => {
|
|
227
|
-
elementRef.current = element;
|
|
228
|
-
updateDisabled();
|
|
229
|
-
});
|
|
230
|
-
return {
|
|
231
|
-
getButtonProps,
|
|
232
|
-
buttonRef
|
|
233
|
-
};
|
|
234
|
-
}
|
|
235
|
-
function isButtonElement(elem) {
|
|
236
|
-
return isHTMLElement(elem) && elem.tagName === 'BUTTON';
|
|
237
|
-
}
|
|
238
|
-
function isValidLinkElement(elem) {
|
|
239
|
-
return Boolean(elem?.tagName === 'A' && elem?.href);
|
|
240
|
-
}
|
|
241
|
-
|
|
242
|
-
/**
|
|
243
|
-
* Wraps `useId` and prefixes generated `id`s with `base-ui-`
|
|
244
|
-
* @param {string | undefined} idOverride overrides the generated id when provided
|
|
245
|
-
* @returns {string | undefined}
|
|
246
|
-
*/
|
|
247
|
-
function useBaseUiId(idOverride) {
|
|
248
|
-
return useId(idOverride, 'base-ui');
|
|
249
|
-
}
|
|
250
|
-
|
|
251
|
-
export { useButton as a, useCompositeRootContext as b, error as e, useBaseUiId as u };
|