@primer/components 0.0.0-20211030163410 → 0.0.0-20211030175556
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +2 -28
- package/dist/browser.esm.js +591 -602
- package/dist/browser.esm.js.map +1 -1
- package/dist/browser.umd.js +200 -211
- package/dist/browser.umd.js.map +1 -1
- package/lib/ActionList/Divider.jsx +29 -0
- package/lib/ActionList/Group.jsx +23 -0
- package/lib/ActionList/Header.jsx +66 -0
- package/lib/ActionList/Item.js +3 -3
- package/lib/ActionList/Item.jsx +288 -0
- package/lib/ActionList/List.jsx +138 -0
- package/lib/ActionList/index.js +12 -23
- package/lib/ActionList2/Description.jsx +29 -0
- package/lib/ActionList2/Divider.jsx +22 -0
- package/lib/ActionList2/Group.jsx +54 -0
- package/lib/ActionList2/Header.d.ts +26 -0
- package/lib/ActionList2/Header.js +55 -0
- package/lib/ActionList2/Header.jsx +36 -0
- package/lib/ActionList2/Item.js +1 -3
- package/lib/ActionList2/Item.jsx +174 -0
- package/lib/ActionList2/LinkItem.jsx +28 -0
- package/lib/ActionList2/List.js +2 -1
- package/lib/ActionList2/List.jsx +41 -0
- package/lib/ActionList2/Selection.js +1 -3
- package/lib/ActionList2/Selection.jsx +50 -0
- package/lib/ActionList2/Visuals.jsx +48 -0
- package/lib/ActionList2/index.js +23 -41
- package/lib/ActionMenu.jsx +73 -0
- package/lib/AnchoredOverlay/AnchoredOverlay.jsx +100 -0
- package/lib/AnchoredOverlay/index.js +4 -12
- package/lib/Autocomplete/Autocomplete.d.ts +0 -1
- package/lib/Autocomplete/Autocomplete.jsx +100 -0
- package/lib/Autocomplete/AutocompleteContext.jsx +5 -0
- package/lib/Autocomplete/AutocompleteInput.d.ts +0 -1
- package/lib/Autocomplete/AutocompleteInput.jsx +113 -0
- package/lib/Autocomplete/AutocompleteMenu.js +13 -6
- package/lib/Autocomplete/AutocompleteMenu.jsx +190 -0
- package/lib/Autocomplete/AutocompleteOverlay.jsx +55 -0
- package/lib/Autocomplete/index.js +7 -14
- package/lib/Avatar.jsx +34 -0
- package/lib/AvatarPair.jsx +29 -0
- package/lib/AvatarStack.jsx +151 -0
- package/lib/BaseStyles.jsx +65 -0
- package/lib/BorderBox.jsx +18 -0
- package/lib/Box.jsx +10 -0
- package/lib/BranchName.jsx +20 -0
- package/lib/Breadcrumbs.jsx +71 -0
- package/lib/Button/Button.d.ts +0 -1
- package/lib/Button/Button.jsx +40 -0
- package/lib/Button/ButtonBase.jsx +33 -0
- package/lib/Button/ButtonClose.d.ts +1 -2
- package/lib/Button/ButtonClose.jsx +53 -0
- package/lib/Button/ButtonDanger.d.ts +0 -1
- package/lib/Button/ButtonDanger.jsx +43 -0
- package/lib/Button/ButtonGroup.jsx +55 -0
- package/lib/Button/ButtonInvisible.d.ts +0 -1
- package/lib/Button/ButtonInvisible.jsx +32 -0
- package/lib/Button/ButtonOutline.d.ts +0 -1
- package/lib/Button/ButtonOutline.jsx +43 -0
- package/lib/Button/ButtonPrimary.d.ts +0 -1
- package/lib/Button/ButtonPrimary.jsx +42 -0
- package/lib/Button/ButtonStyles.jsx +37 -0
- package/lib/Button/ButtonTableList.jsx +46 -0
- package/lib/Button/index.js +21 -70
- package/lib/Caret.jsx +93 -0
- package/lib/CircleBadge.jsx +42 -0
- package/lib/CircleOcticon.d.ts +0 -1
- package/lib/CircleOcticon.jsx +21 -0
- package/lib/CounterLabel.jsx +43 -0
- package/lib/Details.jsx +21 -0
- package/lib/Dialog/ConfirmationDialog.jsx +146 -0
- package/lib/Dialog/Dialog.jsx +279 -0
- package/lib/Dialog.d.ts +2 -3
- package/lib/Dialog.jsx +129 -0
- package/lib/Dropdown.d.ts +0 -4
- package/lib/Dropdown.jsx +131 -0
- package/lib/DropdownMenu/DropdownButton.d.ts +1 -2
- package/lib/DropdownMenu/DropdownButton.jsx +14 -0
- package/lib/DropdownMenu/DropdownMenu.jsx +70 -0
- package/lib/DropdownMenu/index.js +6 -20
- package/lib/DropdownStyles.js +18 -26
- package/lib/FilterList.d.ts +0 -1
- package/lib/FilterList.jsx +59 -0
- package/lib/FilteredActionList/FilteredActionList.jsx +100 -0
- package/lib/FilteredActionList/index.js +4 -12
- package/lib/FilteredSearch.jsx +28 -0
- package/lib/Flash.jsx +69 -0
- package/lib/Flex.jsx +15 -0
- package/lib/FormGroup.jsx +22 -0
- package/lib/Grid.jsx +15 -0
- package/lib/Header.jsx +83 -0
- package/lib/Heading.jsx +21 -0
- package/lib/Label.jsx +82 -0
- package/lib/LabelGroup.jsx +18 -0
- package/lib/Link.jsx +36 -0
- package/lib/NewButton/button-counter.jsx +14 -0
- package/lib/NewButton/button.jsx +279 -0
- package/lib/NewButton/index.js +5 -12
- package/lib/NewButton/types.js +2 -1
- package/lib/Overlay.d.ts +3 -5
- package/lib/Overlay.jsx +154 -0
- package/lib/Pagehead.jsx +17 -0
- package/lib/Pagination/Pagination.jsx +161 -0
- package/lib/Pagination/index.js +6 -12
- package/lib/Pagination/model.jsx +174 -0
- package/lib/PointerBox.jsx +25 -0
- package/lib/Popover.jsx +202 -0
- package/lib/Portal/Portal.jsx +79 -0
- package/lib/Portal/index.js +5 -16
- package/lib/Position.d.ts +4 -4
- package/lib/Position.jsx +46 -0
- package/lib/ProgressBar.jsx +39 -0
- package/lib/SelectMenu/SelectMenu.d.ts +4 -10
- package/lib/SelectMenu/SelectMenu.jsx +112 -0
- package/lib/SelectMenu/SelectMenuContext.jsx +5 -0
- package/lib/SelectMenu/SelectMenuDivider.jsx +42 -0
- package/lib/SelectMenu/SelectMenuFilter.jsx +58 -0
- package/lib/SelectMenu/SelectMenuFooter.jsx +45 -0
- package/lib/SelectMenu/SelectMenuHeader.jsx +42 -0
- package/lib/SelectMenu/SelectMenuItem.d.ts +1 -1
- package/lib/SelectMenu/SelectMenuItem.jsx +142 -0
- package/lib/SelectMenu/SelectMenuList.jsx +59 -0
- package/lib/SelectMenu/SelectMenuLoadingAnimation.jsx +22 -0
- package/lib/SelectMenu/SelectMenuModal.d.ts +1 -1
- package/lib/SelectMenu/SelectMenuModal.jsx +118 -0
- package/lib/SelectMenu/SelectMenuTab.jsx +92 -0
- package/lib/SelectMenu/SelectMenuTabPanel.jsx +42 -0
- package/lib/SelectMenu/SelectMenuTabs.jsx +57 -0
- package/lib/SelectMenu/hooks/useKeyboardNav.js +80 -96
- package/lib/SelectMenu/index.js +7 -14
- package/lib/SelectPanel/SelectPanel.jsx +105 -0
- package/lib/SelectPanel/index.js +4 -12
- package/lib/SideNav.jsx +173 -0
- package/lib/Spinner.jsx +35 -0
- package/lib/StateLabel.jsx +93 -0
- package/lib/StyledOcticon.jsx +18 -0
- package/lib/SubNav.jsx +101 -0
- package/lib/TabNav.jsx +58 -0
- package/lib/Text.jsx +14 -0
- package/lib/TextInput.jsx +23 -0
- package/lib/TextInputWithTokens.d.ts +0 -1
- package/lib/TextInputWithTokens.jsx +218 -0
- package/lib/ThemeProvider.jsx +130 -0
- package/lib/Timeline.jsx +123 -0
- package/lib/Token/AvatarToken.d.ts +1 -1
- package/lib/Token/AvatarToken.jsx +54 -0
- package/lib/Token/IssueLabelToken.d.ts +1 -1
- package/lib/Token/IssueLabelToken.jsx +125 -0
- package/lib/Token/Token.d.ts +1 -1
- package/lib/Token/Token.jsx +103 -0
- package/lib/Token/TokenBase.jsx +88 -0
- package/lib/Token/_RemoveTokenButton.jsx +108 -0
- package/lib/Token/_TokenTextContainer.jsx +49 -0
- package/lib/Token/index.js +11 -30
- package/lib/Tooltip.jsx +246 -0
- package/lib/Truncate.jsx +24 -0
- package/lib/UnderlineNav.jsx +88 -0
- package/lib/_TextInputWrapper.jsx +120 -0
- package/lib/_UnstyledTextInput.jsx +22 -0
- package/lib/behaviors/anchoredPosition.js +205 -234
- package/lib/behaviors/focusTrap.js +121 -157
- package/lib/behaviors/focusZone.js +434 -509
- package/lib/behaviors/scrollIntoViewingArea.js +18 -35
- package/lib/constants.js +39 -43
- package/lib/drafts.js +20 -30
- package/lib/hooks/index.js +16 -60
- package/lib/hooks/useAnchoredPosition.js +32 -40
- package/lib/hooks/useCombinedRefs.js +32 -36
- package/lib/hooks/useDetails.jsx +39 -0
- package/lib/hooks/useDialog.js +72 -96
- package/lib/hooks/useFocusTrap.js +43 -60
- package/lib/hooks/useFocusZone.js +54 -50
- package/lib/hooks/useOnEscapePress.js +25 -36
- package/lib/hooks/useOnOutsideClick.jsx +61 -0
- package/lib/hooks/useOpenAndCloseFocus.js +22 -34
- package/lib/hooks/useOverlay.jsx +15 -0
- package/lib/hooks/useProvidedRefOrCreate.js +10 -14
- package/lib/hooks/useProvidedStateOrCreate.js +13 -16
- package/lib/hooks/useRenderForcingRef.js +13 -17
- package/lib/hooks/useResizeObserver.js +15 -18
- package/lib/hooks/useSafeTimeout.js +22 -30
- package/lib/hooks/useScrollFlash.js +16 -23
- package/lib/index.d.ts +0 -5
- package/lib/index.js +163 -676
- package/lib/polyfills/eventListenerSignal.js +37 -45
- package/lib/sx.js +10 -22
- package/lib/theme-preval.js +64 -3169
- package/lib/theme.js +3 -12
- package/lib/utils/create-slots.jsx +65 -0
- package/lib/utils/deprecate.jsx +59 -0
- package/lib/utils/isNumeric.jsx +7 -0
- package/lib/utils/iterateFocusableElements.js +63 -85
- package/lib/utils/ssr.jsx +6 -0
- package/lib/utils/test-deprecations.jsx +20 -0
- package/lib/utils/test-helpers.jsx +8 -0
- package/lib/utils/test-matchers.jsx +100 -0
- package/lib/utils/testing.d.ts +1 -2
- package/lib/utils/testing.js +0 -29
- package/lib/utils/testing.jsx +206 -0
- package/lib/utils/theme.js +33 -47
- package/lib/utils/types/AriaRole.js +2 -1
- package/lib/utils/types/ComponentProps.js +2 -1
- package/lib/utils/types/Flatten.js +2 -1
- package/lib/utils/types/KeyPaths.js +2 -1
- package/lib/utils/types/MandateProps.js +16 -1
- package/lib/utils/types/Merge.js +2 -1
- package/lib/utils/types/index.js +16 -69
- package/lib/utils/uniqueId.js +5 -8
- package/lib/utils/use-force-update.js +8 -14
- package/lib/utils/useIsomorphicLayoutEffect.js +8 -11
- package/lib/utils/userAgent.js +8 -12
- package/lib-esm/ActionList/Item.js +3 -3
- package/lib-esm/ActionList2/Header.d.ts +26 -0
- package/lib-esm/ActionList2/Header.js +44 -0
- package/lib-esm/ActionList2/Item.js +1 -3
- package/lib-esm/ActionList2/List.js +2 -1
- package/lib-esm/ActionList2/Selection.js +1 -3
- package/lib-esm/Autocomplete/Autocomplete.d.ts +0 -1
- package/lib-esm/Autocomplete/AutocompleteInput.d.ts +0 -1
- package/lib-esm/Autocomplete/AutocompleteMenu.js +13 -3
- package/lib-esm/Button/Button.d.ts +0 -1
- package/lib-esm/Button/ButtonClose.d.ts +1 -2
- package/lib-esm/Button/ButtonDanger.d.ts +0 -1
- package/lib-esm/Button/ButtonInvisible.d.ts +0 -1
- package/lib-esm/Button/ButtonOutline.d.ts +0 -1
- package/lib-esm/Button/ButtonPrimary.d.ts +0 -1
- package/lib-esm/CircleOcticon.d.ts +0 -1
- package/lib-esm/Dialog.d.ts +2 -3
- package/lib-esm/Dropdown.d.ts +0 -4
- package/lib-esm/DropdownMenu/DropdownButton.d.ts +1 -2
- package/lib-esm/FilterList.d.ts +0 -1
- package/lib-esm/Overlay.d.ts +3 -5
- package/lib-esm/Position.d.ts +4 -4
- package/lib-esm/SelectMenu/SelectMenu.d.ts +4 -10
- package/lib-esm/SelectMenu/SelectMenuItem.d.ts +1 -1
- package/lib-esm/SelectMenu/SelectMenuModal.d.ts +1 -1
- package/lib-esm/TextInputWithTokens.d.ts +0 -1
- package/lib-esm/Token/AvatarToken.d.ts +1 -1
- package/lib-esm/Token/IssueLabelToken.d.ts +1 -1
- package/lib-esm/Token/Token.d.ts +1 -1
- package/lib-esm/index.d.ts +0 -5
- package/lib-esm/index.js +0 -4
- package/lib-esm/theme-preval.js +0 -446
- package/lib-esm/utils/testing.d.ts +1 -2
- package/lib-esm/utils/testing.js +0 -24
- package/package.json +6 -5
- package/lib/Checkbox.d.ts +0 -29
- package/lib/Checkbox.js +0 -64
- package/lib/CheckboxInputField.d.ts +0 -11
- package/lib/CheckboxInputField.js +0 -74
- package/lib/RadioInputField.d.ts +0 -9
- package/lib/RadioInputField.js +0 -83
- package/lib/TextInputField.d.ts +0 -581
- package/lib/TextInputField.js +0 -66
- package/lib/_InputCaption.d.ts +0 -6
- package/lib/_InputCaption.js +0 -23
- package/lib/_InputField/InputField.d.ts +0 -39
- package/lib/_InputField/InputField.js +0 -90
- package/lib/_InputField/InputFieldCaption.d.ts +0 -3
- package/lib/_InputField/InputFieldCaption.js +0 -28
- package/lib/_InputField/InputFieldLabel.d.ts +0 -9
- package/lib/_InputField/InputFieldLabel.js +0 -34
- package/lib/_InputField/InputFieldValidation.d.ts +0 -6
- package/lib/_InputField/InputFieldValidation.js +0 -17
- package/lib/_InputField/ToggleInputField.d.ts +0 -13
- package/lib/_InputField/ToggleInputField.js +0 -71
- package/lib/_InputField/ToggleInputLeadingVisual.d.ts +0 -3
- package/lib/_InputField/ToggleInputLeadingVisual.js +0 -22
- package/lib/_InputField/ValidationAnimationContainer.d.ts +0 -6
- package/lib/_InputField/ValidationAnimationContainer.js +0 -48
- package/lib/_InputField/index.d.ts +0 -1
- package/lib/_InputField/index.js +0 -15
- package/lib/_InputField/slots.d.ts +0 -13
- package/lib/_InputField/slots.js +0 -17
- package/lib/_InputLabel.d.ts +0 -8
- package/lib/_InputLabel.js +0 -44
- package/lib/_InputValidation.d.ts +0 -8
- package/lib/_InputValidation.js +0 -56
- package/lib/_VisuallyHidden.d.ts +0 -6
- package/lib/_VisuallyHidden.js +0 -39
- package/lib/utils/types/FormValidationStatus.d.ts +0 -1
- package/lib/utils/types/FormValidationStatus.js +0 -1
- package/lib-esm/Checkbox.d.ts +0 -29
- package/lib-esm/Checkbox.js +0 -44
- package/lib-esm/CheckboxInputField.d.ts +0 -11
- package/lib-esm/CheckboxInputField.js +0 -57
- package/lib-esm/RadioInputField.d.ts +0 -9
- package/lib-esm/RadioInputField.js +0 -66
- package/lib-esm/TextInputField.d.ts +0 -581
- package/lib-esm/TextInputField.js +0 -50
- package/lib-esm/_InputCaption.d.ts +0 -6
- package/lib-esm/_InputCaption.js +0 -12
- package/lib-esm/_InputField/InputField.d.ts +0 -39
- package/lib-esm/_InputField/InputField.js +0 -70
- package/lib-esm/_InputField/InputFieldCaption.d.ts +0 -3
- package/lib-esm/_InputField/InputFieldCaption.js +0 -16
- package/lib-esm/_InputField/InputFieldLabel.d.ts +0 -9
- package/lib-esm/_InputField/InputFieldLabel.js +0 -22
- package/lib-esm/_InputField/InputFieldValidation.d.ts +0 -6
- package/lib-esm/_InputField/InputFieldValidation.js +0 -7
- package/lib-esm/_InputField/ToggleInputField.d.ts +0 -13
- package/lib-esm/_InputField/ToggleInputField.js +0 -54
- package/lib-esm/_InputField/ToggleInputLeadingVisual.d.ts +0 -3
- package/lib-esm/_InputField/ToggleInputLeadingVisual.js +0 -11
- package/lib-esm/_InputField/ValidationAnimationContainer.d.ts +0 -6
- package/lib-esm/_InputField/ValidationAnimationContainer.js +0 -33
- package/lib-esm/_InputField/index.d.ts +0 -1
- package/lib-esm/_InputField/index.js +0 -1
- package/lib-esm/_InputField/slots.d.ts +0 -13
- package/lib-esm/_InputField/slots.js +0 -5
- package/lib-esm/_InputLabel.d.ts +0 -8
- package/lib-esm/_InputLabel.js +0 -32
- package/lib-esm/_InputValidation.d.ts +0 -8
- package/lib-esm/_InputValidation.js +0 -43
- package/lib-esm/_VisuallyHidden.d.ts +0 -6
- package/lib-esm/_VisuallyHidden.js +0 -26
- package/lib-esm/utils/types/FormValidationStatus.d.ts +0 -1
- package/lib-esm/utils/types/FormValidationStatus.js +0 -1
@@ -1,12 +1,7 @@
|
|
1
1
|
"use strict";
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
});
|
6
|
-
exports.useProvidedStateOrCreate = useProvidedStateOrCreate;
|
7
|
-
|
8
|
-
var _react = require("react");
|
9
|
-
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.useProvidedStateOrCreate = void 0;
|
4
|
+
const react_1 = require("react");
|
10
5
|
/**
|
11
6
|
* There are some situations where we want to give users the option to control state externally with their own state handlers
|
12
7
|
* or default to using internal state handlers. Because of the 'rules-of-hooks', we cannot conditionally make a call to `React.useState`
|
@@ -17,11 +12,13 @@ var _react = require("react");
|
|
17
12
|
* @param defaultState The defaultState to use, if using internal state.
|
18
13
|
*/
|
19
14
|
function useProvidedStateOrCreate(externalState, setExternalState, defaultState) {
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
15
|
+
const [internalState, setInternalState] = react_1.useState(defaultState);
|
16
|
+
const state = externalState ?? internalState;
|
17
|
+
const setState = react_1.useCallback((s) => {
|
18
|
+
setInternalState(s);
|
19
|
+
if (setExternalState)
|
20
|
+
setExternalState(s);
|
21
|
+
}, [setExternalState]);
|
22
|
+
return [state, setState];
|
23
|
+
}
|
24
|
+
exports.useProvidedStateOrCreate = useProvidedStateOrCreate;
|
@@ -1,12 +1,7 @@
|
|
1
1
|
"use strict";
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
});
|
6
|
-
exports.useRenderForcingRef = useRenderForcingRef;
|
7
|
-
|
8
|
-
var _react = require("react");
|
9
|
-
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.useRenderForcingRef = void 0;
|
4
|
+
const react_1 = require("react");
|
10
5
|
/**
|
11
6
|
* There are certain situations where a ref might be set after the current render cycle for a
|
12
7
|
* component has finished. e.g. a forward ref from a conditionally rendered child component.
|
@@ -14,12 +9,13 @@ var _react = require("react");
|
|
14
9
|
* @type TRef The type of the RefObject which should be created.
|
15
10
|
*/
|
16
11
|
function useRenderForcingRef() {
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
}
|
12
|
+
const [refCurrent, setRefCurrent] = react_1.useState(null);
|
13
|
+
const ref = react_1.useRef(null);
|
14
|
+
ref.current = refCurrent;
|
15
|
+
const setRef = react_1.useCallback((newRef) => {
|
16
|
+
ref.current = newRef;
|
17
|
+
setRefCurrent(newRef);
|
18
|
+
}, [ref]);
|
19
|
+
return [ref, setRef];
|
20
|
+
}
|
21
|
+
exports.useRenderForcingRef = useRenderForcingRef;
|
@@ -1,20 +1,17 @@
|
|
1
1
|
"use strict";
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
});
|
6
|
-
exports.useResizeObserver =
|
7
|
-
|
8
|
-
var _useIsomorphicLayoutEffect = _interopRequireDefault(require("../utils/useIsomorphicLayoutEffect"));
|
9
|
-
|
10
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
11
|
-
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
exports.useResizeObserver = void 0;
|
7
|
+
const useIsomorphicLayoutEffect_1 = __importDefault(require("../utils/useIsomorphicLayoutEffect"));
|
12
8
|
function useResizeObserver(callback) {
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
}
|
9
|
+
useIsomorphicLayoutEffect_1.default(() => {
|
10
|
+
const observer = new window.ResizeObserver(() => callback());
|
11
|
+
observer.observe(document.documentElement);
|
12
|
+
return () => {
|
13
|
+
observer.disconnect();
|
14
|
+
};
|
15
|
+
}, [callback]);
|
16
|
+
}
|
17
|
+
exports.useResizeObserver = useResizeObserver;
|
@@ -1,38 +1,30 @@
|
|
1
1
|
"use strict";
|
2
|
-
|
3
|
-
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.default = useSafeTimeout;
|
7
|
-
|
8
|
-
var _react = require("react");
|
9
|
-
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
const react_1 = require("react");
|
10
4
|
/**
|
11
5
|
* Safely call `setTimeout` and `clearTimeout` within a component.
|
12
6
|
*
|
13
7
|
* This hook ensures that all timeouts are cleared when the component unmounts.
|
14
8
|
*/
|
15
9
|
function useSafeTimeout() {
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
clearTimeout(id);
|
24
|
-
timers.current.delete(id);
|
25
|
-
}, []);
|
26
|
-
(0, _react.useEffect)(() => {
|
27
|
-
return () => {
|
28
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
29
|
-
for (const id of timers.current) {
|
10
|
+
const timers = react_1.useRef(new Set());
|
11
|
+
const safeSetTimeout = react_1.useCallback((handler, timeout, ...args) => {
|
12
|
+
const id = window.setTimeout(handler, timeout, ...args);
|
13
|
+
timers.current.add(id);
|
14
|
+
return id;
|
15
|
+
}, []);
|
16
|
+
const safeClearTimeout = react_1.useCallback((id) => {
|
30
17
|
clearTimeout(id);
|
31
|
-
|
32
|
-
};
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
}
|
18
|
+
timers.current.delete(id);
|
19
|
+
}, []);
|
20
|
+
react_1.useEffect(() => {
|
21
|
+
return () => {
|
22
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
23
|
+
for (const id of timers.current) {
|
24
|
+
clearTimeout(id);
|
25
|
+
}
|
26
|
+
};
|
27
|
+
}, []);
|
28
|
+
return { safeSetTimeout, safeClearTimeout };
|
29
|
+
}
|
30
|
+
exports.default = useSafeTimeout;
|
@@ -1,29 +1,22 @@
|
|
1
1
|
"use strict";
|
2
|
-
|
3
|
-
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.default = useScrollFlash;
|
7
|
-
|
8
|
-
var _react = require("react");
|
9
|
-
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
const react_1 = require("react");
|
10
4
|
/**
|
11
5
|
* This hook will flash the scrollbars for a ref of a container that has scrollable overflow
|
12
6
|
* @param scrollContainerRef The ref of the scrollable content
|
13
7
|
*/
|
14
8
|
function useScrollFlash(scrollContainerRef) {
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
}
|
9
|
+
// https://adxlv.computer/projects/flash-scrollers/
|
10
|
+
react_1.useEffect(() => {
|
11
|
+
const scrollContainer = scrollContainerRef.current;
|
12
|
+
if (!scrollContainer) {
|
13
|
+
return;
|
14
|
+
}
|
15
|
+
const currentScroll = scrollContainer.scrollTop;
|
16
|
+
const maxScroll = scrollContainer.scrollHeight;
|
17
|
+
const altScroll = currentScroll < Math.min(1, maxScroll) ? currentScroll + 1 : currentScroll - 1;
|
18
|
+
scrollContainer.scrollTop = altScroll;
|
19
|
+
scrollContainer.scrollTop = currentScroll;
|
20
|
+
}, [scrollContainerRef]);
|
21
|
+
}
|
22
|
+
exports.default = useScrollFlash;
|
package/lib/index.d.ts
CHANGED
@@ -46,7 +46,6 @@ export { default as CircleBadge } from './CircleBadge';
|
|
46
46
|
export type { CircleBadgeProps, CircleBadgeIconProps } from './CircleBadge';
|
47
47
|
export { default as CircleOcticon } from './CircleOcticon';
|
48
48
|
export type { CircleOcticonProps } from './CircleOcticon';
|
49
|
-
export { default as CheckboxInputField } from './CheckboxInputField';
|
50
49
|
export { default as CounterLabel } from './CounterLabel';
|
51
50
|
export type { CounterLabelProps } from './CounterLabel';
|
52
51
|
export { default as Details } from './Details';
|
@@ -87,7 +86,6 @@ export { default as Popover } from './Popover';
|
|
87
86
|
export type { PopoverProps, PopoverContentProps } from './Popover';
|
88
87
|
export { default as ProgressBar } from './ProgressBar';
|
89
88
|
export type { ProgressBarProps } from './ProgressBar';
|
90
|
-
export { default as RadioInputField } from './RadioInputField';
|
91
89
|
export { default as SelectMenu } from './SelectMenu';
|
92
90
|
export type { SelectMenuProps, SelectMenuDividerProps, SelectMenuFilterProps, SelectMenuFooterProps, SelectMenuItemProps, SelectMenuListProps, SelectMenuModalProps, SelectMenuTabsProps, SelectMenuHeaderProps, SelectMenuTabProps, SelectMenuTabPanelProps, SelectMenuLoadingAnimationProps } from './SelectMenu';
|
93
91
|
export { default as SideNav } from './SideNav';
|
@@ -104,7 +102,6 @@ export { default as TabNav } from './TabNav';
|
|
104
102
|
export type { TabNavProps, TabNavLinkProps } from './TabNav';
|
105
103
|
export { default as TextInput } from './TextInput';
|
106
104
|
export type { TextInputProps } from './TextInput';
|
107
|
-
export { default as TextInputField } from './TextInputField';
|
108
105
|
export { default as TextInputWithTokens } from './TextInputWithTokens';
|
109
106
|
export type { TextInputWithTokensProps } from './TextInputWithTokens';
|
110
107
|
export { default as Text } from './Text';
|
@@ -118,6 +115,4 @@ export { default as Truncate } from './Truncate';
|
|
118
115
|
export type { TruncateProps } from './Truncate';
|
119
116
|
export { default as UnderlineNav } from './UnderlineNav';
|
120
117
|
export type { UnderlineNavProps, UnderlineNavLinkProps } from './UnderlineNav';
|
121
|
-
export { default as Checkbox } from './Checkbox';
|
122
|
-
export type { CheckboxProps } from './Checkbox';
|
123
118
|
export { SSRProvider, useSSRSafeId } from './utils/ssr';
|