@skyscanner/backpack-web 34.15.1 → 34.16.0-preminor.2
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/bpk-component-aria-live/src/BpkAriaLive.d.ts +1 -1
- package/bpk-component-badge/src/BpkBadge.d.ts +1 -1
- package/bpk-component-banner-alert/src/AnimateAndFade.d.ts +1 -1
- package/bpk-component-banner-alert/src/BpkBannerAlert.d.ts +1 -2
- package/bpk-component-banner-alert/src/BpkBannerAlertDismissable.d.ts +1 -2
- package/bpk-component-banner-alert/src/BpkBannerAlertExpandable.d.ts +1 -1
- package/bpk-component-banner-alert/src/BpkBannerAlertInner.d.ts +1 -1
- package/bpk-component-banner-alert/src/withBannerAlertState.d.ts +36 -44
- package/bpk-component-boilerplate/src/BpkBoilerplate.d.ts +1 -2
- package/bpk-component-bottom-sheet/src/BpkBottomSheet.d.ts +1 -1
- package/bpk-component-button/BpkButtonDestructive.d.ts +1 -2
- package/bpk-component-button/BpkButtonFeatured.d.ts +1 -2
- package/bpk-component-button/BpkButtonLink.d.ts +1 -2
- package/bpk-component-button/BpkButtonLinkOnDark.d.ts +1 -2
- package/bpk-component-button/BpkButtonPrimary.d.ts +1 -2
- package/bpk-component-button/BpkButtonPrimaryOnDark.d.ts +1 -2
- package/bpk-component-button/BpkButtonPrimaryOnLight.d.ts +1 -2
- package/bpk-component-button/BpkButtonSecondary.d.ts +1 -2
- package/bpk-component-button/BpkButtonSecondaryOnDark.d.ts +1 -2
- package/bpk-component-button/src/BpkButton.d.ts +1 -2
- package/bpk-component-button/src/BpkButtonBase.d.ts +2 -13
- package/bpk-component-button/src/BpkButtonDestructive.module.css +18 -0
- package/bpk-component-button/src/BpkButtonFeatured.module.css +18 -0
- package/bpk-component-button/src/BpkButtonLink.module.css +18 -0
- package/bpk-component-button/src/BpkButtonLinkOnDark.module.css +18 -0
- package/bpk-component-button/src/BpkButtonPrimaryOnDark.module.css +18 -0
- package/bpk-component-button/src/BpkButtonPrimaryOnLight.module.css +18 -0
- package/bpk-component-button/src/BpkButtonSecondary.module.css +18 -0
- package/bpk-component-button/src/BpkButtonSecondaryOnDark.module.css +18 -0
- package/bpk-component-button/src/BpkButtonV2/BpkButton.d.ts +1 -2
- package/bpk-component-calendar/src/BpkCalendarContainer.d.ts +10 -14
- package/bpk-component-calendar/src/BpkCalendarDate.d.ts +1 -1
- package/bpk-component-calendar/src/BpkCalendarGrid.d.ts +5 -5
- package/bpk-component-calendar/src/BpkCalendarGridHeader.d.ts +1 -1
- package/bpk-component-calendar/src/BpkCalendarGridTransition.d.ts +2 -2
- package/bpk-component-calendar/src/BpkCalendarNav.d.ts +1 -1
- package/bpk-component-calendar/src/BpkCalendarWeek.d.ts +1 -1
- package/bpk-component-calendar/src/composeCalendar.d.ts +1 -1
- package/bpk-component-card/src/BpkCard.d.ts +1 -1
- package/bpk-component-card/src/BpkCardWrapper.d.ts +1 -1
- package/bpk-component-card/src/BpkDividedCard.d.ts +1 -1
- package/bpk-component-card/src/CardContext.d.ts +0 -1
- package/bpk-component-card-button/src/BpkSaveButton.d.ts +1 -1
- package/bpk-component-carousel/src/BpkCarousel.d.ts +1 -2
- package/bpk-component-carousel/src/BpkCarouselContainer.d.ts +1 -1
- package/bpk-component-carousel/src/utils.test.js +30 -0
- package/bpk-component-chip/src/BpkDismissibleChip.d.ts +1 -2
- package/bpk-component-chip/src/BpkDropdownChip.d.ts +1 -2
- package/bpk-component-chip/src/BpkIconChip.d.ts +1 -1
- package/bpk-component-chip/src/BpkSelectableChip.d.ts +1 -1
- package/bpk-component-chip-group/src/BpkMultiSelectChipGroup.d.ts +1 -1
- package/bpk-component-chip-group/src/BpkSingleSelectChipGroup.d.ts +1 -2
- package/bpk-component-chip-group/src/Nudger.d.ts +1 -1
- package/bpk-component-close-button/src/BpkCloseButton.d.ts +10 -0
- package/bpk-component-close-button/src/BpkCloseButton.js +21 -37
- package/bpk-component-datatable/src/BpkDataTable.d.ts +1 -2
- package/bpk-component-datatable/src/BpkDataTableHeader.d.ts +1 -2
- package/bpk-component-datepicker/src/BpkDatepicker.d.ts +7 -9
- package/bpk-component-datepicker/src/BpkDatepicker.module.css +18 -0
- package/bpk-component-description-list/src/BpkDescriptionDetails.d.ts +1 -1
- package/bpk-component-description-list/src/BpkDescriptionList.d.ts +1 -1
- package/bpk-component-description-list/src/BpkDescriptionTerm.d.ts +1 -1
- package/bpk-component-dialog/src/BpkDialog.d.ts +1 -2
- package/bpk-component-dialog/src/BpkDialogInner.d.ts +11 -16
- package/bpk-component-flare/src/__generated__/js/corner-radius.d.ts +5 -0
- package/bpk-component-flare/src/__generated__/js/pointer.d.ts +5 -0
- package/bpk-component-floating-notification/src/BpkFloatingNotification.d.ts +1 -1
- package/bpk-component-graphic-promotion/src/BpkGraphicPromo.d.ts +1 -2
- package/bpk-component-icon/index.d.ts +2 -2
- package/bpk-component-icon/src/classNameModifierHOCFactory.d.ts +2 -2
- package/bpk-component-icon/src/withAlignment.d.ts +1 -1
- package/bpk-component-icon/src/withRtlSupport.d.ts +3 -4
- package/bpk-component-image/src/BpkBackgroundImage.d.ts +1 -1
- package/bpk-component-image/src/BpkImage.d.ts +1 -1
- package/bpk-component-image/src/withLazyLoading.d.ts +8 -11
- package/bpk-component-image/src/withLoadingBehavior.d.ts +5 -7
- package/bpk-component-info-banner/src/AnimateAndFade.d.ts +1 -1
- package/bpk-component-info-banner/src/BpkInfoBanner.d.ts +1 -2
- package/bpk-component-info-banner/src/BpkInfoBannerDismissable.d.ts +1 -2
- package/bpk-component-info-banner/src/BpkInfoBannerExpandable.d.ts +1 -1
- package/bpk-component-info-banner/src/BpkInfoBannerInner.d.ts +1 -1
- package/bpk-component-info-banner/src/withBannerAlertState.d.ts +36 -45
- package/bpk-component-input/src/BpkClearButton.module.css +18 -0
- package/bpk-component-input/src/BpkInput.d.ts +1 -1
- package/bpk-component-input/src/BpkInput.js +1 -1
- package/bpk-component-input/src/common-types.d.ts +1 -1
- package/bpk-component-input/src/withOpenEvents.d.ts +4 -6
- package/bpk-component-inset-banner/src/BpkInsetBanner.d.ts +1 -2
- package/bpk-component-journey-arrow/src/BpkJourneyArrow.d.ts +1 -2
- package/bpk-component-loading-button/src/BpkLoadingButton.d.ts +6 -38
- package/bpk-component-loading-button/src/BpkLoadingButton.js +13 -44
- package/bpk-component-map/src/BpkBasicMapMarker.d.ts +1 -1
- package/bpk-component-map/src/BpkPriceMarkerV2/BpkPriceMarker.d.ts +1 -1
- package/bpk-component-modal/src/BpkModal.d.ts +1 -1
- package/bpk-component-modal/src/BpkModalInner.d.ts +1 -1
- package/bpk-component-modal/src/BpkModalV2/BpkModal.d.ts +1 -1
- package/bpk-component-navigation-bar/src/BpkNavigationBar.d.ts +1 -1
- package/bpk-component-navigation-bar/src/BpkNavigationBarButtonLink.d.ts +1 -1
- package/bpk-component-navigation-bar/src/BpkNavigationBarButtonLink.module.css +18 -0
- package/bpk-component-navigation-bar/src/BpkNavigationBarIconButton.d.ts +1 -1
- package/bpk-component-nudger/index.d.ts +1 -2
- package/bpk-component-nudger/index.js +1 -2
- package/bpk-component-nudger/src/BpkNudger.d.ts +1 -2
- package/bpk-component-nudger/src/BpkNudger.js +102 -20
- package/bpk-component-nudger/src/BpkNudger.module.css +1 -1
- package/bpk-component-nudger/src/common-types.d.ts +7 -5
- package/bpk-component-overlay/src/BpkOverlay.d.ts +1 -1
- package/bpk-component-popover/src/BpkPopover.d.ts +1 -1
- package/bpk-component-rating/src/BpkRating.d.ts +1 -1
- package/bpk-component-rtl-toggle/src/BpkRtlToggle.d.ts +1 -1
- package/bpk-component-rtl-toggle/src/updateOnDirectionChange.d.ts +11 -15
- package/bpk-component-scrollable-calendar/src/BpkScrollableCalendar.d.ts +6 -9
- package/bpk-component-scrollable-calendar/src/BpkScrollableCalendarDate.d.ts +1 -2
- package/bpk-component-scrollable-calendar/src/BpkScrollableCalendarGrid.d.ts +3 -3
- package/bpk-component-scrollable-calendar/src/BpkScrollableCalendarGridList.d.ts +3 -3
- package/bpk-component-section-header/src/BpkSectionHeader.d.ts +1 -1
- package/bpk-component-segmented-control/src/BpkSegmentedControl.d.ts +1 -1
- package/bpk-component-skeleton/src/BpkBaseSkeleton.d.d.ts +0 -1
- package/bpk-component-skeleton/src/BpkBaseSkeleton.d.ts +1 -2
- package/bpk-component-skeleton/src/BpkSkeleton.d.d.ts +0 -1
- package/bpk-component-skeleton/src/BpkSkeleton.d.ts +1 -2
- package/bpk-component-slider/src/BpkSlider.d.ts +4 -2
- package/bpk-component-slider/src/BpkSlider.js +51 -3
- package/bpk-component-snippet/index.d.ts +3 -0
- package/bpk-component-snippet/index.js +21 -0
- package/bpk-component-snippet/src/BpkSnippet.d.ts +48 -0
- package/bpk-component-snippet/src/BpkSnippet.js +131 -0
- package/bpk-component-snippet/src/BpkSnippet.module.css +18 -0
- package/bpk-component-spinner/src/BpkExtraLargeSpinner.d.ts +4 -15
- package/bpk-component-spinner/src/BpkExtraLargeSpinner.js +5 -16
- package/bpk-component-spinner/src/BpkLargeSpinner.d.ts +5 -18
- package/bpk-component-spinner/src/BpkLargeSpinner.js +6 -19
- package/bpk-component-spinner/src/BpkSpinner.d.ts +5 -18
- package/bpk-component-spinner/src/BpkSpinner.js +6 -19
- package/bpk-component-split-input/src/BpkInputField.d.ts +21 -0
- package/bpk-component-split-input/src/BpkInputField.js +13 -15
- package/bpk-component-split-input/src/BpkSplitInput.d.ts +44 -0
- package/bpk-component-split-input/src/BpkSplitInput.js +23 -34
- package/bpk-component-swap-button/src/BpkSwapButton.d.ts +1 -2
- package/bpk-component-text/src/BpkText.d.ts +1 -1
- package/bpk-component-tooltip/src/BpkTooltip.d.ts +1 -1
- package/bpk-component-tooltip/src/BpkTooltipPortal.d.ts +1 -1
- package/bpk-react-utils/index.d.ts +9 -10
- package/bpk-react-utils/src/BpkDialogWrapper/BpkDialogWrapper.d.ts +1 -1
- package/bpk-react-utils/src/TransitionInitialMount.d.ts +1 -1
- package/bpk-react-utils/src/nativeEventHandler.d.ts +1 -1
- package/bpk-react-utils/src/nativeEventHandler.js +7 -5
- package/bpk-react-utils/src/withDefaultProps.d.ts +1 -1
- package/bpk-scrim-utils/index.d.ts +12 -17
- package/bpk-scrim-utils/src/BpkScrim.d.ts +1 -1
- package/bpk-scrim-utils/src/withScrim.d.ts +11 -15
- package/bpk-scrim-utils/src/withScrimmedPortal.d.ts +1 -1
- package/bpk-stylesheets/test.css +164 -0
- package/bpk-theming/src/BpkThemeProvider.js +19 -30
- package/package.json +5 -3
- package/bpk-component-nudger/src/BpkConfigurableNudger.d.ts +0 -27
- package/bpk-component-nudger/src/BpkConfigurableNudger.js +0 -96
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Backpack - Skyscanner's Design System
|
|
3
|
-
*
|
|
4
|
-
* Copyright 2016 Skyscanner Ltd
|
|
5
|
-
*
|
|
6
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
7
|
-
* you may not use this file except in compliance with the License.
|
|
8
|
-
* You may obtain a copy of the License at
|
|
9
|
-
*
|
|
10
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
11
|
-
*
|
|
12
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
13
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
14
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
15
|
-
* See the License for the specific language governing permissions and
|
|
16
|
-
* limitations under the License.
|
|
17
|
-
*/
|
|
18
|
-
|
|
19
|
-
import { useRef } from 'react';
|
|
20
|
-
import { BpkButtonV2, BUTTON_TYPES } from "../../bpk-component-button";
|
|
21
|
-
import { withButtonAlignment } from "../../bpk-component-icon";
|
|
22
|
-
import MinusIcon from "../../bpk-component-icon/sm/minus";
|
|
23
|
-
import PlusIcon from "../../bpk-component-icon/sm/plus";
|
|
24
|
-
import { cssModules, setNativeValue } from "../../bpk-react-utils";
|
|
25
|
-
import STYLES from "./BpkNudger.module.css";
|
|
26
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
27
|
-
const getClassName = cssModules(STYLES);
|
|
28
|
-
const AlignedMinusIcon = withButtonAlignment(MinusIcon);
|
|
29
|
-
const AlignedPlusIcon = withButtonAlignment(PlusIcon);
|
|
30
|
-
const BpkConfigurableNudger = ({
|
|
31
|
-
buttonType = 'secondary',
|
|
32
|
-
className = null,
|
|
33
|
-
compareValues,
|
|
34
|
-
decreaseButtonLabel,
|
|
35
|
-
decrementValue,
|
|
36
|
-
formatValue,
|
|
37
|
-
id,
|
|
38
|
-
increaseButtonLabel,
|
|
39
|
-
incrementValue,
|
|
40
|
-
inputClassName = null,
|
|
41
|
-
max,
|
|
42
|
-
min,
|
|
43
|
-
name,
|
|
44
|
-
onChange,
|
|
45
|
-
value,
|
|
46
|
-
...rest
|
|
47
|
-
}) => {
|
|
48
|
-
const classNames = getClassName('bpk-nudger', className);
|
|
49
|
-
const maxButtonDisabled = compareValues(value, max) >= 0;
|
|
50
|
-
const minButtonDisabled = compareValues(value, min) <= 0;
|
|
51
|
-
const inputStyles = getClassName('bpk-nudger__input', inputClassName && inputClassName, buttonType === 'secondaryOnDark' && 'bpk-nudger__input--secondary-on-dark');
|
|
52
|
-
const inputRef = useRef(null);
|
|
53
|
-
return /*#__PURE__*/_jsxs("div", {
|
|
54
|
-
className: classNames,
|
|
55
|
-
children: [/*#__PURE__*/_jsx(BpkButtonV2, {
|
|
56
|
-
type: BUTTON_TYPES[buttonType],
|
|
57
|
-
iconOnly: true,
|
|
58
|
-
onClick: () => {
|
|
59
|
-
const newValue = decrementValue(value);
|
|
60
|
-
onChange(newValue);
|
|
61
|
-
// We want to maintain native input events across our form components. Along with react updating
|
|
62
|
-
// the value attribute we can set it via native handlers and emit a "change" event.
|
|
63
|
-
inputRef.current && setNativeValue(inputRef.current, `${newValue}`);
|
|
64
|
-
},
|
|
65
|
-
disabled: minButtonDisabled,
|
|
66
|
-
title: decreaseButtonLabel,
|
|
67
|
-
"aria-controls": id,
|
|
68
|
-
children: /*#__PURE__*/_jsx(AlignedMinusIcon, {})
|
|
69
|
-
}), /*#__PURE__*/_jsx("input", {
|
|
70
|
-
type: "text",
|
|
71
|
-
"aria-live": "polite",
|
|
72
|
-
defaultValue: formatValue(value),
|
|
73
|
-
id: id,
|
|
74
|
-
ref: inputRef,
|
|
75
|
-
name: name || id,
|
|
76
|
-
onChange: event => onChange(parseInt(event?.target.value, 10)),
|
|
77
|
-
className: inputStyles,
|
|
78
|
-
...rest
|
|
79
|
-
}), /*#__PURE__*/_jsx(BpkButtonV2, {
|
|
80
|
-
type: BUTTON_TYPES[buttonType],
|
|
81
|
-
iconOnly: true,
|
|
82
|
-
onClick: () => {
|
|
83
|
-
const newValue = incrementValue(value);
|
|
84
|
-
onChange(newValue);
|
|
85
|
-
// We want to maintain native input events across our form components. Along with react updating
|
|
86
|
-
// the value attribute we can set it via native handlers and emit a "change" event.
|
|
87
|
-
inputRef.current && setNativeValue(inputRef.current, `${newValue}`);
|
|
88
|
-
},
|
|
89
|
-
disabled: maxButtonDisabled,
|
|
90
|
-
title: increaseButtonLabel,
|
|
91
|
-
"aria-controls": id,
|
|
92
|
-
children: /*#__PURE__*/_jsx(AlignedPlusIcon, {})
|
|
93
|
-
})]
|
|
94
|
-
});
|
|
95
|
-
};
|
|
96
|
-
export default BpkConfigurableNudger;
|