@veeqo/ui 9.4.0 → 9.5.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/README.md +1 -1
- package/dist/components/Accordion/Accordion.js +21 -21
- package/dist/components/Accordion/Accordion.js.map +1 -1
- package/dist/components/ActionMenu/ActionMenu.js +4 -4
- package/dist/components/ActionMenu/ActionMenu.js.map +1 -1
- package/dist/components/Alerts/Alert/Alert.js +11 -11
- package/dist/components/Alerts/Alert/Alert.js.map +1 -1
- package/dist/components/Alerts/MiniAlert/MiniAlert.js +4 -4
- package/dist/components/Alerts/MiniAlert/MiniAlert.js.map +1 -1
- package/dist/components/Anchor/Anchor.js +2 -2
- package/dist/components/Anchor/Anchor.js.map +1 -1
- package/dist/components/AnimatedDropdown/AnimatedDropdown.js +5 -5
- package/dist/components/AnimatedDropdown/AnimatedDropdown.js.map +1 -1
- package/dist/components/AnimatedDropdown/components/BasicDropdown.js +2 -2
- package/dist/components/AnimatedDropdown/components/BasicDropdown.js.map +1 -1
- package/dist/components/Avatar/Avatar.js +2 -2
- package/dist/components/Avatar/Avatar.js.map +1 -1
- package/dist/components/Badge/Badge.js +4 -4
- package/dist/components/Badge/Badge.js.map +1 -1
- package/dist/components/Banner/Banner.js +7 -7
- package/dist/components/Banner/Banner.js.map +1 -1
- package/dist/components/Breadcrumbs/Breadcrumbs.js +5 -5
- package/dist/components/Breadcrumbs/Breadcrumbs.js.map +1 -1
- package/dist/components/Breadcrumbs/components/Breadcrumb.js +4 -4
- package/dist/components/Breadcrumbs/components/Breadcrumb.js.map +1 -1
- package/dist/components/Button/Button.js +7 -7
- package/dist/components/Button/Button.js.map +1 -1
- package/dist/components/Calendars/components/Calendar/Calendar.js +4 -4
- package/dist/components/Calendars/components/Calendar/Calendar.js.map +1 -1
- package/dist/components/Calendars/components/RangeCalendar/RangeCalendar.js +4 -4
- package/dist/components/Calendars/components/RangeCalendar/RangeCalendar.js.map +1 -1
- package/dist/components/Calendars/components/subcomponents/CalendarGrid/CalendarGrid.js +4 -4
- package/dist/components/Calendars/components/subcomponents/CalendarGrid/CalendarGrid.js.map +1 -1
- package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/DodecadeCalendar.js +2 -2
- package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/DodecadeCalendar.js.map +1 -1
- package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/MonthCalendar.js +4 -4
- package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/MonthCalendar.js.map +1 -1
- package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/YearCalendar.js +2 -2
- package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/YearCalendar.js.map +1 -1
- package/dist/components/Calendars/components/subcomponents/CalendarHeader.js +9 -9
- package/dist/components/Calendars/components/subcomponents/CalendarHeader.js.map +1 -1
- package/dist/components/Calendars/components/subcomponents/CalendarHeading.js +2 -2
- package/dist/components/Calendars/components/subcomponents/CalendarHeading.js.map +1 -1
- package/dist/components/Card/Card.js +6 -6
- package/dist/components/Card/Card.js.map +1 -1
- package/dist/components/CardHeader/CardHeader.js +8 -8
- package/dist/components/CardHeader/CardHeader.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.js +3 -3
- package/dist/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/components/Choice/Choice.js +14 -14
- package/dist/components/Choice/Choice.js.map +1 -1
- package/dist/components/ChoiceList/ChoiceList.js +4 -4
- package/dist/components/ChoiceList/ChoiceList.js.map +1 -1
- package/dist/components/CopyToClipboard/CopyToClipboard.js +4 -4
- package/dist/components/CopyToClipboard/CopyToClipboard.js.map +1 -1
- package/dist/components/DataTable/DataTable.js +34 -34
- package/dist/components/DataTable/DataTable.js.map +1 -1
- package/dist/components/DataTable/components/ActionBar.js +3 -3
- package/dist/components/DataTable/components/ActionBar.js.map +1 -1
- package/dist/components/DataTable/components/ColumnDivider.js +2 -2
- package/dist/components/DataTable/components/ColumnDivider.js.map +1 -1
- package/dist/components/DataTable/components/ColumnMenu.cjs +1 -1
- package/dist/components/DataTable/components/ColumnMenu.cjs.map +1 -1
- package/dist/components/DataTable/components/ColumnMenu.js +11 -11
- package/dist/components/DataTable/components/ColumnMenu.js.map +1 -1
- package/dist/components/DataTable/components/SelectionCell.js +5 -5
- package/dist/components/DataTable/components/SelectionCell.js.map +1 -1
- package/dist/components/DataTable/components/SelectionHeader.js +4 -4
- package/dist/components/DataTable/components/SelectionHeader.js.map +1 -1
- package/dist/components/DataTable/components/StickyHead.js +4 -4
- package/dist/components/DataTable/components/StickyHead.js.map +1 -1
- package/dist/components/DataTable/hooks/useSelection.js +3 -3
- package/dist/components/DataTable/hooks/useSelection.js.map +1 -1
- package/dist/components/DataTable/renderers/renderFooter.js +2 -2
- package/dist/components/DataTable/renderers/renderFooter.js.map +1 -1
- package/dist/components/DataTable/renderers/renderHeader.js +8 -8
- package/dist/components/DataTable/renderers/renderHeader.js.map +1 -1
- package/dist/components/DataTable/renderers/renderLoadingCell.js +3 -3
- package/dist/components/DataTable/renderers/renderLoadingCell.js.map +1 -1
- package/dist/components/DataTable/renderers/renderNestedCell.js +2 -2
- package/dist/components/DataTable/renderers/renderNestedCell.js.map +1 -1
- package/dist/components/DataTable/utils/GetSortIcon.cjs +2 -2
- package/dist/components/DataTable/utils/GetSortIcon.cjs.map +1 -1
- package/dist/components/DataTable/utils/GetSortIcon.js +5 -5
- package/dist/components/DataTable/utils/GetSortIcon.js.map +1 -1
- package/dist/components/DateInputField/DateInputField.js +11 -11
- package/dist/components/DateInputField/DateInputField.js.map +1 -1
- package/dist/components/DatePicker/DatePicker.js +9 -9
- package/dist/components/DatePicker/DatePicker.js.map +1 -1
- package/dist/components/DateRangePicker/DateRangePicker.js +12 -12
- package/dist/components/DateRangePicker/DateRangePicker.js.map +1 -1
- package/dist/components/DateRangePicker/components/ComparePreviousPeriod.js +5 -5
- package/dist/components/DateRangePicker/components/ComparePreviousPeriod.js.map +1 -1
- package/dist/components/DescriptionList/DescriptionList.js +9 -9
- package/dist/components/DescriptionList/DescriptionList.js.map +1 -1
- package/dist/components/DetailPage/DetailPage.js +4 -4
- package/dist/components/DetailPage/DetailPage.js.map +1 -1
- package/dist/components/DimensionsInput/DimensionsInput.js +10 -10
- package/dist/components/DimensionsInput/DimensionsInput.js.map +1 -1
- package/dist/components/Dropdown/Dropdown.js +4 -4
- package/dist/components/Dropdown/Dropdown.js.map +1 -1
- package/dist/components/Dropdown/DropdownPopover.js +4 -4
- package/dist/components/Dropdown/DropdownPopover.js.map +1 -1
- package/dist/components/FilterTag/FilterTag.js +12 -12
- package/dist/components/FilterTag/FilterTag.js.map +1 -1
- package/dist/components/Image/Image.js +8 -8
- package/dist/components/Image/Image.js.map +1 -1
- package/dist/components/Image/components/PlaceholderImage.js +3 -3
- package/dist/components/Image/components/PlaceholderImage.js.map +1 -1
- package/dist/components/Indicator/Indicator.js +2 -2
- package/dist/components/Indicator/Indicator.js.map +1 -1
- package/dist/components/InputGroup/components/InputGroupLabel/InputGroupLabel.js +3 -3
- package/dist/components/InputGroup/components/InputGroupLabel/InputGroupLabel.js.map +1 -1
- package/dist/components/LegacyDataTable/LegacyDataTable.cjs +2 -2
- package/dist/components/LegacyDataTable/LegacyDataTable.cjs.map +1 -1
- package/dist/components/LegacyDataTable/LegacyDataTable.js +40 -40
- package/dist/components/LegacyDataTable/LegacyDataTable.js.map +1 -1
- package/dist/components/LegacyDataTable/SkeletonContent/SkeletonContent.js +3 -3
- package/dist/components/LegacyDataTable/SkeletonContent/SkeletonContent.js.map +1 -1
- package/dist/components/LegacyDataTable/SpecificState/SpecificState.js +5 -5
- package/dist/components/LegacyDataTable/SpecificState/SpecificState.js.map +1 -1
- package/dist/components/LegacyDataTable/StickyHeader.js +3 -3
- package/dist/components/LegacyDataTable/StickyHeader.js.map +1 -1
- package/dist/components/LegacyDataTable/cells/ClickableCell.js +3 -3
- package/dist/components/LegacyDataTable/cells/ClickableCell.js.map +1 -1
- package/dist/components/LegacyDataTable/cells/EditableCell.js +4 -4
- package/dist/components/LegacyDataTable/cells/EditableCell.js.map +1 -1
- package/dist/components/LegacyDataTable/cells/SkeletonCell.js +3 -3
- package/dist/components/LegacyDataTable/cells/SkeletonCell.js.map +1 -1
- package/dist/components/LegacyDataTable/cells/SkeletonHeaderCell.js +3 -3
- package/dist/components/LegacyDataTable/cells/SkeletonHeaderCell.js.map +1 -1
- package/dist/components/LegacyDataTable/utils/constants.js +3 -3
- package/dist/components/LegacyDataTable/utils/constants.js.map +1 -1
- package/dist/components/Loader/Grid.js +20 -20
- package/dist/components/Loader/Grid.js.map +1 -1
- package/dist/components/Loader/Loader.js +4 -4
- package/dist/components/Loader/Loader.js.map +1 -1
- package/dist/components/Loader/TailSpin.js +13 -13
- package/dist/components/Loader/TailSpin.js.map +1 -1
- package/dist/components/Loader/ThreeDots.js +11 -11
- package/dist/components/Loader/ThreeDots.js.map +1 -1
- package/dist/components/LoginWithAmazonButton/LoginWithAmazonButton.js +3 -3
- package/dist/components/LoginWithAmazonButton/LoginWithAmazonButton.js.map +1 -1
- package/dist/components/Modal/Modal.js +11 -11
- package/dist/components/Modal/Modal.js.map +1 -1
- package/dist/components/Modal/components/Dialog/Dialog.js +2 -2
- package/dist/components/Modal/components/Dialog/Dialog.js.map +1 -1
- package/dist/components/Pagination/Pagination.js +9 -9
- package/dist/components/Pagination/Pagination.js.map +1 -1
- package/dist/components/Pagination/components.js +6 -6
- package/dist/components/Pagination/components.js.map +1 -1
- package/dist/components/Popover/Popover.js +4 -4
- package/dist/components/Popover/Popover.js.map +1 -1
- package/dist/components/Portal/Portal.cjs +32 -21
- package/dist/components/Portal/Portal.cjs.map +1 -1
- package/dist/components/Portal/Portal.d.ts +13 -2
- package/dist/components/Portal/Portal.js +33 -22
- package/dist/components/Portal/Portal.js.map +1 -1
- package/dist/components/Portal/utils.cjs.map +1 -1
- package/dist/components/Portal/utils.d.ts +1 -1
- package/dist/components/Portal/utils.js.map +1 -1
- package/dist/components/PriceInput/PriceInput.js +6 -6
- package/dist/components/PriceInput/PriceInput.js.map +1 -1
- package/dist/components/Radio/Radio.js +3 -3
- package/dist/components/Radio/Radio.js.map +1 -1
- package/dist/components/ScreenReaderOnly/ScreenReaderOnly.js +2 -2
- package/dist/components/ScreenReaderOnly/ScreenReaderOnly.js.map +1 -1
- package/dist/components/Search/Search.js +9 -9
- package/dist/components/Search/Search.js.map +1 -1
- package/dist/components/SegmentedControl/SegmentedControl.js +2 -2
- package/dist/components/SegmentedControl/SegmentedControl.js.map +1 -1
- package/dist/components/Select/Select.js +3 -3
- package/dist/components/Select/Select.js.map +1 -1
- package/dist/components/ShortcutKeys/ShortcutKeys.js +6 -6
- package/dist/components/ShortcutKeys/ShortcutKeys.js.map +1 -1
- package/dist/components/SimpleTable/SimpleTable.js +2 -2
- package/dist/components/SimpleTable/SimpleTable.js.map +1 -1
- package/dist/components/Slider/Slider.js +6 -6
- package/dist/components/Slider/Slider.js.map +1 -1
- package/dist/components/Stepper/Stepper.js +6 -6
- package/dist/components/Stepper/Stepper.js.map +1 -1
- package/dist/components/TextField/TextField.js +3 -3
- package/dist/components/TextField/TextField.js.map +1 -1
- package/dist/components/ToastsLayout/ToastsLayout.js +4 -4
- package/dist/components/ToastsLayout/ToastsLayout.js.map +1 -1
- package/dist/components/ToastsLayout/components/Toast.js +10 -10
- package/dist/components/ToastsLayout/components/Toast.js.map +1 -1
- package/dist/components/Toggle/Toggle.js +6 -6
- package/dist/components/Toggle/Toggle.js.map +1 -1
- package/dist/components/ToggleButton/ToggleButton.js +2 -2
- package/dist/components/ToggleButton/ToggleButton.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.js +5 -5
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/components/Tooltip/components/TooltipPopover.js +4 -4
- package/dist/components/Tooltip/components/TooltipPopover.js.map +1 -1
- package/dist/components/UploadFile/UploadFile.js +13 -13
- package/dist/components/UploadFile/UploadFile.js.map +1 -1
- package/dist/components/UploadFile/UploadGraphic.js +4 -4
- package/dist/components/UploadFile/UploadGraphic.js.map +1 -1
- package/dist/components/UploadFile/components/UploadCopy/UploadCopy.js +4 -4
- package/dist/components/UploadFile/components/UploadCopy/UploadCopy.js.map +1 -1
- package/dist/components/UploadFile/components/UploadFileErrors/UploadFileErrors.js +4 -4
- package/dist/components/UploadFile/components/UploadFileErrors/UploadFileErrors.js.map +1 -1
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.js +4 -4
- package/dist/components/UploadFile/components/UploadedFile/UploadedFile.js.map +1 -1
- package/dist/components/VideoModal/VideoModal.js +6 -6
- package/dist/components/VideoModal/VideoModal.js.map +1 -1
- package/dist/components/VideoModal/components/Popup.js +7 -7
- package/dist/components/VideoModal/components/Popup.js.map +1 -1
- package/dist/components/View/View.js +9 -9
- package/dist/components/View/View.js.map +1 -1
- package/dist/components/ViewTab/ViewTab.js +10 -10
- package/dist/components/ViewTab/ViewTab.js.map +1 -1
- package/dist/components/ViewsContainer/ViewsContainer.js +9 -9
- package/dist/components/ViewsContainer/ViewsContainer.js.map +1 -1
- package/dist/components/WeightInput/WeightInput.js +13 -13
- package/dist/components/WeightInput/WeightInput.js.map +1 -1
- package/dist/hoc/withDeprecated.js +2 -2
- package/dist/hoc/withDeprecated.js.map +1 -1
- package/dist/hoc/withLabels/withLabels.js +13 -13
- package/dist/hoc/withLabels/withLabels.js.map +1 -1
- package/dist/hooks/useFocusVisible.js +8 -8
- package/dist/hooks/useFocusVisible.js.map +1 -1
- package/dist/index.cjs +74 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +37 -0
- package/dist/index.js.map +1 -1
- package/dist/tempIcons/ActiveCheckboxIcon.cjs +14 -0
- package/dist/tempIcons/ActiveCheckboxIcon.cjs.map +1 -0
- package/dist/tempIcons/ActiveCheckboxIcon.js +8 -0
- package/dist/tempIcons/ActiveCheckboxIcon.js.map +1 -0
- package/dist/tempIcons/ActiveRadioIcon.cjs +14 -0
- package/dist/tempIcons/ActiveRadioIcon.cjs.map +1 -0
- package/dist/tempIcons/ActiveRadioIcon.js +8 -0
- package/dist/tempIcons/ActiveRadioIcon.js.map +1 -0
- package/dist/tempIcons/ArrowDownIcon.js +3 -3
- package/dist/tempIcons/ArrowDownIcon.js.map +1 -1
- package/dist/tempIcons/ArrowUpIcon.js +3 -3
- package/dist/tempIcons/ArrowUpIcon.js.map +1 -1
- package/dist/tempIcons/AttentionIcon.js +3 -3
- package/dist/tempIcons/AttentionIcon.js.map +1 -1
- package/dist/tempIcons/CalendarIcon.js +3 -3
- package/dist/tempIcons/CalendarIcon.js.map +1 -1
- package/dist/tempIcons/ClipboardIcon.js +3 -3
- package/dist/tempIcons/ClipboardIcon.js.map +1 -1
- package/dist/tempIcons/CrossIcon.js +3 -3
- package/dist/tempIcons/CrossIcon.js.map +1 -1
- package/dist/tempIcons/DashboardIcon.cjs +13 -0
- package/dist/tempIcons/DashboardIcon.cjs.map +1 -0
- package/dist/tempIcons/DashboardIcon.d.ts +2 -0
- package/dist/tempIcons/DashboardIcon.js +7 -0
- package/dist/tempIcons/DashboardIcon.js.map +1 -0
- package/dist/tempIcons/DestructiveIcon.cjs +30 -0
- package/dist/tempIcons/DestructiveIcon.cjs.map +1 -0
- package/dist/tempIcons/DestructiveIcon.js +8 -0
- package/dist/tempIcons/DestructiveIcon.js.map +1 -0
- package/dist/tempIcons/DoubleArrowAscIcon.js +4 -4
- package/dist/tempIcons/DoubleArrowAscIcon.js.map +1 -1
- package/dist/tempIcons/DoubleArrowDescIcon.js +4 -4
- package/dist/tempIcons/DoubleArrowDescIcon.js.map +1 -1
- package/dist/tempIcons/{DoubleArrowIconIcon.cjs → DoubleArrowIcon.cjs} +1 -1
- package/dist/tempIcons/DoubleArrowIcon.cjs.map +1 -0
- package/dist/tempIcons/DoubleArrowIcon.js +8 -0
- package/dist/tempIcons/DoubleArrowIcon.js.map +1 -0
- package/dist/tempIcons/DownArrowIcon.js +3 -3
- package/dist/tempIcons/DownArrowIcon.js.map +1 -1
- package/dist/tempIcons/DragIndicatorIcon.cjs +13 -0
- package/dist/tempIcons/DragIndicatorIcon.cjs.map +1 -0
- package/dist/tempIcons/DragIndicatorIcon.js +7 -0
- package/dist/tempIcons/DragIndicatorIcon.js.map +1 -0
- package/dist/tempIcons/DropdownIcon.js +3 -3
- package/dist/tempIcons/DropdownIcon.js.map +1 -1
- package/dist/tempIcons/EditIcon.js +3 -3
- package/dist/tempIcons/EditIcon.js.map +1 -1
- package/dist/tempIcons/EndArrowIcon.js +4 -4
- package/dist/tempIcons/EndArrowIcon.js.map +1 -1
- package/dist/tempIcons/FailIcon.js +3 -3
- package/dist/tempIcons/FailIcon.js.map +1 -1
- package/dist/tempIcons/HelpIcon.js +3 -3
- package/dist/tempIcons/HelpIcon.js.map +1 -1
- package/dist/tempIcons/InactiveCheckboxIcon.cjs +14 -0
- package/dist/tempIcons/InactiveCheckboxIcon.cjs.map +1 -0
- package/dist/tempIcons/InactiveCheckboxIcon.js +8 -0
- package/dist/tempIcons/InactiveCheckboxIcon.js.map +1 -0
- package/dist/tempIcons/InactiveRadioIcon.cjs +14 -0
- package/dist/tempIcons/InactiveRadioIcon.cjs.map +1 -0
- package/dist/tempIcons/InactiveRadioIcon.js +8 -0
- package/dist/tempIcons/InactiveRadioIcon.js.map +1 -0
- package/dist/tempIcons/InfoIcon.js +5 -5
- package/dist/tempIcons/InfoIcon.js.map +1 -1
- package/dist/tempIcons/LeftArrowIcon.js +3 -3
- package/dist/tempIcons/LeftArrowIcon.js.map +1 -1
- package/dist/tempIcons/MergeIcon.js +3 -3
- package/dist/tempIcons/MergeIcon.js.map +1 -1
- package/dist/tempIcons/PlusIcon.cjs +30 -0
- package/dist/tempIcons/PlusIcon.cjs.map +1 -0
- package/dist/tempIcons/PlusIcon.js +8 -0
- package/dist/tempIcons/PlusIcon.js.map +1 -0
- package/dist/tempIcons/RecommendIcon.js +5 -5
- package/dist/tempIcons/RecommendIcon.js.map +1 -1
- package/dist/tempIcons/ReorderIcon.js +3 -3
- package/dist/tempIcons/ReorderIcon.js.map +1 -1
- package/dist/tempIcons/RightArrowIcon.js +3 -3
- package/dist/tempIcons/RightArrowIcon.js.map +1 -1
- package/dist/tempIcons/SearchIcon.js +3 -3
- package/dist/tempIcons/SearchIcon.js.map +1 -1
- package/dist/tempIcons/StartArrowIcon.js +4 -4
- package/dist/tempIcons/StartArrowIcon.js.map +1 -1
- package/dist/tempIcons/SuccessIcon.js +3 -3
- package/dist/tempIcons/SuccessIcon.js.map +1 -1
- package/dist/tempIcons/ThreeDotsIcon.js +3 -3
- package/dist/tempIcons/ThreeDotsIcon.js.map +1 -1
- package/dist/tempIcons/UpArrowIcon.js +3 -3
- package/dist/tempIcons/UpArrowIcon.js.map +1 -1
- package/dist/tempIcons/VisibilityIcon.cjs +2 -2
- package/dist/tempIcons/VisibilityIcon.cjs.map +1 -1
- package/dist/tempIcons/VisibilityIcon.d.ts +1 -1
- package/dist/tempIcons/VisibilityIcon.js +4 -4
- package/dist/tempIcons/VisibilityIcon.js.map +1 -1
- package/dist/tempIcons/VisibilityOffIcon.cjs +2 -2
- package/dist/tempIcons/VisibilityOffIcon.cjs.map +1 -1
- package/dist/tempIcons/VisibilityOffIcon.d.ts +1 -1
- package/dist/tempIcons/VisibilityOffIcon.js +4 -4
- package/dist/tempIcons/VisibilityOffIcon.js.map +1 -1
- package/dist/tempIcons/WarningIcon.js +4 -4
- package/dist/tempIcons/WarningIcon.js.map +1 -1
- package/dist/tempIcons/index.d.ts +37 -0
- package/package.json +1 -1
- package/dist/tempIcons/DoubleArrowIconIcon.cjs.map +0 -1
- package/dist/tempIcons/DoubleArrowIconIcon.d.ts +0 -2
- package/dist/tempIcons/DoubleArrowIconIcon.js +0 -8
- package/dist/tempIcons/DoubleArrowIconIcon.js.map +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default from 'react';
|
|
2
2
|
import { Kbd, ShortcutKeysContainer } from './styled.js';
|
|
3
3
|
import { ValidModifierKeysMap, ValidModifierKeyssLabelMap } from './utils.js';
|
|
4
4
|
|
|
@@ -20,19 +20,19 @@ const ShortcutKeys = ({ shortcut, label, inverse = false, displayLabel = false,
|
|
|
20
20
|
// Replace modifier keys with the corresponding UTF-16 character if available.
|
|
21
21
|
const keysToRenderComponents = keysToRender.map((key) => {
|
|
22
22
|
if (ValidModifierKeysMap[key]) {
|
|
23
|
-
return (
|
|
23
|
+
return (React__default.createElement(Kbd, { key: `Key: ${key}`, "aria-label": ValidModifierKeyssLabelMap[key] }, ValidModifierKeysMap[key]));
|
|
24
24
|
}
|
|
25
|
-
return
|
|
25
|
+
return React__default.createElement(Kbd, { key: `Key: ${key}` }, key);
|
|
26
26
|
});
|
|
27
27
|
// Combine the <Kbd /> components to sit inside a single <ShortcutKeysContainer /> component.
|
|
28
|
-
const shortcutElements = keysToRenderComponents.reduce((previousKbdElement, currentKbdElement) => (
|
|
28
|
+
const shortcutElements = keysToRenderComponents.reduce((previousKbdElement, currentKbdElement) => (React__default.createElement(React__default.Fragment, null,
|
|
29
29
|
previousKbdElement,
|
|
30
30
|
"+",
|
|
31
31
|
currentKbdElement)));
|
|
32
|
-
return (
|
|
32
|
+
return (React__default.createElement(ShortcutKeysContainer, { "aria-label": label, "$inverse": inverse, ...props },
|
|
33
33
|
shortcutElements,
|
|
34
34
|
" ",
|
|
35
|
-
displayLabel ?
|
|
35
|
+
displayLabel ? React__default.createElement("span", null, label) : null));
|
|
36
36
|
};
|
|
37
37
|
|
|
38
38
|
export { ShortcutKeys };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ShortcutKeys.js","sources":["../../../src/components/ShortcutKeys/ShortcutKeys.tsx"],"sourcesContent":["import React from 'react';\nimport { ShortcutKeysContainer, Kbd } from './styled';\nimport { ValidModifierKeys, ShortcutKeysProps } from './types';\nimport { ValidModifierKeyssLabelMap, ValidModifierKeysMap } from './utils';\n\n/**\n * ShortcutKeys UI component\n *\n * Renders a keyboard shortcut string by splitting it on \"+\" and rendering each\n * key to a <kbd> component.\n *\n * Criteria for `shortcut` prop:\n * - ValidModifierKeys MUST always come before other keys e.g. `shift+a` is valid, `a+shift` is invalid\n * - If it's not a modifier key it must be a singular key e.g. `a`, `2` is valid and `a2` or `abcde` is invalid etc.\n * - A limit of 3 key combinations separated between the '+' symbol e.g. `shift+ctrl+a` is valid, `shift+ctrl+a+b` is invalid\n *\n */\nexport const ShortcutKeys = ({\n shortcut,\n label,\n inverse = false,\n displayLabel = false,\n ...props\n}: ShortcutKeysProps) => {\n // Split the keys into individual <Kbd /> components\n const keysToRender = shortcut.split('+') as ValidModifierKeys[];\n\n // Replace modifier keys with the corresponding UTF-16 character if available.\n const keysToRenderComponents = keysToRender.map((key) => {\n if (ValidModifierKeysMap[key]) {\n return (\n <Kbd key={`Key: ${key}`} aria-label={ValidModifierKeyssLabelMap[key]}>\n {ValidModifierKeysMap[key]}\n </Kbd>\n );\n }\n return <Kbd key={`Key: ${key}`}>{key}</Kbd>;\n });\n\n // Combine the <Kbd /> components to sit inside a single <ShortcutKeysContainer /> component.\n const shortcutElements = keysToRenderComponents.reduce(\n (previousKbdElement, currentKbdElement) => (\n <>\n {previousKbdElement}+{currentKbdElement}\n </>\n ),\n );\n\n return (\n <ShortcutKeysContainer aria-label={label} $inverse={inverse} {...props}>\n {shortcutElements} {displayLabel ? <span>{label}</span> : null}\n </ShortcutKeysContainer>\n );\n};\n"],"names":[],"mappings":";;;;AAKA;;;;;;;;;;;AAWG;MACU,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,KAAK,EACL,OAAO,GAAG,KAAK,EACf,YAAY,GAAG,KAAK,EACpB,GAAG,KAAK,EACU,KAAI;;IAEtB,MAAM,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAwB;;IAG/D,MAAM,sBAAsB,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,KAAI;AACtD,QAAA,IAAI,oBAAoB,CAAC,GAAG,CAAC,EAAE;YAC7B,
|
|
1
|
+
{"version":3,"file":"ShortcutKeys.js","sources":["../../../src/components/ShortcutKeys/ShortcutKeys.tsx"],"sourcesContent":["import React from 'react';\nimport { ShortcutKeysContainer, Kbd } from './styled';\nimport { ValidModifierKeys, ShortcutKeysProps } from './types';\nimport { ValidModifierKeyssLabelMap, ValidModifierKeysMap } from './utils';\n\n/**\n * ShortcutKeys UI component\n *\n * Renders a keyboard shortcut string by splitting it on \"+\" and rendering each\n * key to a <kbd> component.\n *\n * Criteria for `shortcut` prop:\n * - ValidModifierKeys MUST always come before other keys e.g. `shift+a` is valid, `a+shift` is invalid\n * - If it's not a modifier key it must be a singular key e.g. `a`, `2` is valid and `a2` or `abcde` is invalid etc.\n * - A limit of 3 key combinations separated between the '+' symbol e.g. `shift+ctrl+a` is valid, `shift+ctrl+a+b` is invalid\n *\n */\nexport const ShortcutKeys = ({\n shortcut,\n label,\n inverse = false,\n displayLabel = false,\n ...props\n}: ShortcutKeysProps) => {\n // Split the keys into individual <Kbd /> components\n const keysToRender = shortcut.split('+') as ValidModifierKeys[];\n\n // Replace modifier keys with the corresponding UTF-16 character if available.\n const keysToRenderComponents = keysToRender.map((key) => {\n if (ValidModifierKeysMap[key]) {\n return (\n <Kbd key={`Key: ${key}`} aria-label={ValidModifierKeyssLabelMap[key]}>\n {ValidModifierKeysMap[key]}\n </Kbd>\n );\n }\n return <Kbd key={`Key: ${key}`}>{key}</Kbd>;\n });\n\n // Combine the <Kbd /> components to sit inside a single <ShortcutKeysContainer /> component.\n const shortcutElements = keysToRenderComponents.reduce(\n (previousKbdElement, currentKbdElement) => (\n <>\n {previousKbdElement}+{currentKbdElement}\n </>\n ),\n );\n\n return (\n <ShortcutKeysContainer aria-label={label} $inverse={inverse} {...props}>\n {shortcutElements} {displayLabel ? <span>{label}</span> : null}\n </ShortcutKeysContainer>\n );\n};\n"],"names":["React"],"mappings":";;;;AAKA;;;;;;;;;;;AAWG;MACU,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,KAAK,EACL,OAAO,GAAG,KAAK,EACf,YAAY,GAAG,KAAK,EACpB,GAAG,KAAK,EACU,KAAI;;IAEtB,MAAM,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAwB;;IAG/D,MAAM,sBAAsB,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,KAAI;AACtD,QAAA,IAAI,oBAAoB,CAAC,GAAG,CAAC,EAAE;YAC7B,QACEA,6BAAC,GAAG,EAAA,EAAC,GAAG,EAAE,CAAA,KAAA,EAAQ,GAAG,CAAE,CAAA,EAAA,YAAA,EAAc,0BAA0B,CAAC,GAAG,CAAC,EACjE,EAAA,oBAAoB,CAAC,GAAG,CAAC,CACtB;AAET;QACD,OAAOA,cAAA,CAAA,aAAA,CAAC,GAAG,EAAA,EAAC,GAAG,EAAE,CAAQ,KAAA,EAAA,GAAG,CAAE,CAAA,EAAA,EAAG,GAAG,CAAO;AAC7C,KAAC,CAAC;;AAGF,IAAA,MAAM,gBAAgB,GAAG,sBAAsB,CAAC,MAAM,CACpD,CAAC,kBAAkB,EAAE,iBAAiB,MACpCA,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA;QACG,kBAAkB;;QAAG,iBAAiB,CACtC,CACJ,CACF;IAED,QACEA,6BAAC,qBAAqB,EAAA,EAAA,YAAA,EAAa,KAAK,EAAY,UAAA,EAAA,OAAO,KAAM,KAAK,EAAA;QACnE,gBAAgB;;AAAG,QAAA,YAAY,GAAGA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAAO,KAAK,CAAQ,GAAG,IAAI,CACxC;AAE5B;;;;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default from 'react';
|
|
2
2
|
import { Table, TableHeader, TableBody, TableRow, TableHeaderCell, TableCell } from './styled.js';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* A simple table component which provides flexible, pre-styled table elements.
|
|
6
6
|
*/
|
|
7
|
-
const SimpleTable = ({ striped = true, className, children }) => (
|
|
7
|
+
const SimpleTable = ({ striped = true, className, children }) => (React__default.createElement(Table, { striped: striped, className: className }, children));
|
|
8
8
|
SimpleTable.Header = TableHeader;
|
|
9
9
|
SimpleTable.Body = TableBody;
|
|
10
10
|
SimpleTable.Row = TableRow;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SimpleTable.js","sources":["../../../src/components/SimpleTable/SimpleTable.tsx"],"sourcesContent":["import React from 'react';\nimport { TableBody, TableCell, TableHeader, TableRow, TableHeaderCell, Table } from './styled';\nimport { SimpleTableProps } from './types';\n\n/**\n * A simple table component which provides flexible, pre-styled table elements.\n */\nexport const SimpleTable = ({ striped = true, className, children }: SimpleTableProps) => (\n <Table striped={striped} className={className}>\n {children}\n </Table>\n);\n\nSimpleTable.Header = TableHeader;\nSimpleTable.Body = TableBody;\nSimpleTable.Row = TableRow;\nSimpleTable.HeaderCell = TableHeaderCell;\nSimpleTable.Cell = TableCell;\n"],"names":[],"mappings":";;;AAIA;;AAEG;AACI,MAAM,WAAW,GAAG,CAAC,EAAE,OAAO,GAAG,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAoB,
|
|
1
|
+
{"version":3,"file":"SimpleTable.js","sources":["../../../src/components/SimpleTable/SimpleTable.tsx"],"sourcesContent":["import React from 'react';\nimport { TableBody, TableCell, TableHeader, TableRow, TableHeaderCell, Table } from './styled';\nimport { SimpleTableProps } from './types';\n\n/**\n * A simple table component which provides flexible, pre-styled table elements.\n */\nexport const SimpleTable = ({ striped = true, className, children }: SimpleTableProps) => (\n <Table striped={striped} className={className}>\n {children}\n </Table>\n);\n\nSimpleTable.Header = TableHeader;\nSimpleTable.Body = TableBody;\nSimpleTable.Row = TableRow;\nSimpleTable.HeaderCell = TableHeaderCell;\nSimpleTable.Cell = TableCell;\n"],"names":["React"],"mappings":";;;AAIA;;AAEG;AACI,MAAM,WAAW,GAAG,CAAC,EAAE,OAAO,GAAG,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAoB,MACnFA,cAAC,CAAA,aAAA,CAAA,KAAK,EAAC,EAAA,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAA,EAC1C,QAAQ,CACH;AAGV,WAAW,CAAC,MAAM,GAAG,WAAW;AAChC,WAAW,CAAC,IAAI,GAAG,SAAS;AAC5B,WAAW,CAAC,GAAG,GAAG,QAAQ;AAC1B,WAAW,CAAC,UAAU,GAAG,eAAe;AACxC,WAAW,CAAC,IAAI,GAAG,SAAS;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default, { useState, useRef, useCallback, useEffect } from 'react';
|
|
2
2
|
import { SliderContainer, SliderTrack, SliderRange, SliderDiv } from './styled.js';
|
|
3
3
|
import { buildClassnames } from '../../utils/buildClassnames.js';
|
|
4
4
|
|
|
@@ -104,15 +104,15 @@ const Slider = ({ id, value, min, max, step = 1, onChange, className, e2eClassNa
|
|
|
104
104
|
else {
|
|
105
105
|
sliderClassName = buildClassnames([classNames === null || classNames === undefined ? undefined : classNames.slider, e2eClassNames === null || e2eClassNames === undefined ? undefined : e2eClassNames.slider]);
|
|
106
106
|
}
|
|
107
|
-
return (
|
|
107
|
+
return (React__default.createElement(SliderDiv, { role: "slider", ref: index === 1 ? endSliderRef : startSliderRef, className: sliderClassName, left: left, "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": valueNow }));
|
|
108
108
|
};
|
|
109
109
|
const renderRangeSlider = (rangeSliderValue) => {
|
|
110
110
|
// handle value used to get slider position relative to container from value
|
|
111
111
|
const handleValueStart = ((rangeSliderValue[0] < min ? 0 : rangeSliderValue[0] - min) * 100) / (max - min);
|
|
112
112
|
const handleValueEnd = ((rangeSliderValue[1] > max ? 100 : rangeSliderValue[1] - min) * 100) / (max - min);
|
|
113
113
|
const rangeWidth = handleValueEnd - handleValueStart;
|
|
114
|
-
return (
|
|
115
|
-
|
|
114
|
+
return (React__default.createElement(React__default.Fragment, null,
|
|
115
|
+
React__default.createElement(SliderRange, { className: buildClassnames([classNames === null || classNames === undefined ? undefined : classNames.sliderRange, e2eClassNames === null || e2eClassNames === undefined ? undefined : e2eClassNames.sliderRange]), left: handleValueStart, width: rangeWidth }),
|
|
116
116
|
renderSlider(handleValueStart, rangeSliderValue[0], 0),
|
|
117
117
|
renderSlider(handleValueEnd, rangeSliderValue[1], 1)));
|
|
118
118
|
};
|
|
@@ -133,8 +133,8 @@ const Slider = ({ id, value, min, max, step = 1, onChange, className, e2eClassNa
|
|
|
133
133
|
render = renderRangeSlider(value);
|
|
134
134
|
else
|
|
135
135
|
render = renderSingleSlider(value);
|
|
136
|
-
return (
|
|
137
|
-
|
|
136
|
+
return (React__default.createElement(SliderContainer, { className: buildClassnames([classNames === null || classNames === undefined ? undefined : classNames.container, e2eClassNames === null || e2eClassNames === undefined ? undefined : e2eClassNames.container]), id: id, ref: containerRef },
|
|
137
|
+
React__default.createElement(SliderTrack, null),
|
|
138
138
|
render));
|
|
139
139
|
};
|
|
140
140
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.js","sources":["../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { SliderContainer, SliderTrack, SliderRange, SliderDiv } from './styled';\nimport { SliderComponentPropTypes, DraggingSliderIndex, ClassNamesReturnPayload } from './types';\nimport { buildClassnames } from '../../utils/buildClassnames';\n\nconst generateClassNames = (prefix: string | undefined): ClassNamesReturnPayload => ({\n container: prefix ? `${prefix}-slider-container` : undefined,\n sliderRange: prefix ? `${prefix}-slider-range` : undefined,\n slider: prefix ? `${prefix}-slider` : undefined,\n startSlider: prefix ? `${prefix}-start-slider` : undefined,\n endSlider: prefix ? `${prefix}-end-slider` : undefined,\n});\n\nexport const Slider = ({\n id,\n value,\n min,\n max,\n step = 1,\n onChange,\n className,\n e2eClassName,\n onSlideStart = () => {},\n onSlideEnd = () => {},\n}: SliderComponentPropTypes) => {\n const [isDragging, setIsDragging] = useState(false);\n const [draggingSliderIndex, setDraggingSliderIndex] = useState<DraggingSliderIndex>(-1);\n const containerRef = useRef<HTMLDivElement>(null);\n const startSliderRef = useRef<HTMLDivElement>(null);\n const endSliderRef = useRef<HTMLDivElement>(null);\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n const handleMouseMove = useCallback(\n (e: MouseEvent) => {\n if (!isDragging || !containerRef.current) return;\n const sliderValue: number =\n draggingSliderIndex > -1 ? (value as number[])[draggingSliderIndex] : (value as number);\n const containerSize = containerRef.current.getBoundingClientRect();\n // slider position relative to the container in percents\n const handleValue = ((e.pageX - containerSize.x) * 100) / containerSize.width;\n // current value by slider position\n let newValue = (max - min) * (handleValue / 100) + min;\n\n const diff = sliderValue - newValue;\n\n // use to apply step to new value\n if (diff > 0) {\n newValue = sliderValue + Math.ceil(newValue / step - sliderValue / step) * step;\n }\n if (diff < 0) {\n newValue = sliderValue + Math.floor(newValue / step - sliderValue / step) * step;\n }\n\n if (sliderValue === newValue) return;\n if (newValue > max) newValue = max;\n if (newValue < min) newValue = min;\n\n if (Array.isArray(value)) {\n if (draggingSliderIndex === 0 && newValue > value[1]) [, newValue] = value;\n if (draggingSliderIndex === 1 && newValue < value[0]) [newValue] = value;\n }\n\n // used to fix 0.30000000000000004 problem\n const decimalPlaces = step.toString().includes('.')\n ? step.toString().split('.').pop()?.length\n : 0;\n newValue = Number(newValue.toFixed(decimalPlaces));\n\n let resultValue;\n if (Array.isArray(value)) {\n resultValue = draggingSliderIndex === 0 ? [newValue, value[1]] : [value[0], newValue];\n } else {\n resultValue = newValue;\n }\n\n onChange(resultValue);\n\n if (Array.isArray(resultValue) && resultValue[0] === resultValue[1]) {\n if (draggingSliderIndex === 0) setDraggingSliderIndex(1);\n if (draggingSliderIndex === 1) setDraggingSliderIndex(0);\n }\n },\n [draggingSliderIndex, isDragging, max, min, onChange, step, value],\n );\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n onSlideEnd();\n }, [onSlideEnd]);\n const handleMouseDown = useCallback(\n (e: Event, index: DraggingSliderIndex) => {\n setIsDragging(true);\n onSlideStart();\n if (typeof index === 'number') setDraggingSliderIndex(index);\n e.preventDefault();\n },\n [onSlideStart],\n );\n\n useEffect(() => {\n const handleStartSliderMouseDown = (e: Event) =>\n handleMouseDown(e, Array.isArray(value) ? 0 : 1);\n const handleEndSliderMouseDown = (e: Event) => handleMouseDown(e, 1);\n\n const startSliderEl = startSliderRef.current;\n const endSliderEl = endSliderRef.current;\n\n startSliderEl?.addEventListener('mousedown', handleStartSliderMouseDown);\n endSliderEl?.addEventListener('mousedown', handleEndSliderMouseDown);\n\n document.addEventListener('mousemove', handleMouseMove);\n document.addEventListener('mouseup', handleMouseUp);\n return () => {\n startSliderEl?.removeEventListener('mousedown', handleStartSliderMouseDown);\n endSliderEl?.removeEventListener('mousedown', handleEndSliderMouseDown);\n\n document.removeEventListener('mousemove', handleMouseMove);\n document.removeEventListener('mouseup', handleMouseUp);\n };\n }, [handleMouseDown, handleMouseMove, handleMouseUp, value]);\n\n const renderSlider = (left: number, valueNow: number, index?: 0 | 1) => {\n let sliderClassName;\n\n if (typeof index === 'number') {\n sliderClassName = buildClassnames(\n index === 0\n ? [classNames?.startSlider, e2eClassNames?.startSlider]\n : [classNames?.endSlider, e2eClassNames?.endSlider],\n );\n } else {\n sliderClassName = buildClassnames([classNames?.slider, e2eClassNames?.slider]);\n }\n\n return (\n <SliderDiv\n role=\"slider\"\n ref={index === 1 ? endSliderRef : startSliderRef}\n className={sliderClassName}\n left={left}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={valueNow}\n />\n );\n };\n\n const renderRangeSlider = (rangeSliderValue: number[]) => {\n // handle value used to get slider position relative to container from value\n const handleValueStart =\n ((rangeSliderValue[0] < min ? 0 : rangeSliderValue[0] - min) * 100) / (max - min);\n const handleValueEnd =\n ((rangeSliderValue[1] > max ? 100 : rangeSliderValue[1] - min) * 100) / (max - min);\n\n const rangeWidth = handleValueEnd - handleValueStart;\n\n return (\n <>\n <SliderRange\n className={buildClassnames([classNames?.sliderRange, e2eClassNames?.sliderRange])}\n left={handleValueStart}\n width={rangeWidth}\n />\n {renderSlider(handleValueStart, rangeSliderValue[0], 0)}\n {renderSlider(handleValueEnd, rangeSliderValue[1], 1)}\n </>\n );\n };\n\n const renderSingleSlider = (sliderValue: number) => {\n if (Array.isArray(value)) return renderRangeSlider(value as number[]);\n\n let handleValue: number;\n\n if (value > max) handleValue = 100;\n else if (value < min) handleValue = 0;\n else handleValue = ((sliderValue - min) * 100) / (max - min);\n\n return renderSlider(handleValue, sliderValue);\n };\n\n let render;\n if (Array.isArray(value)) render = renderRangeSlider(value);\n else render = renderSingleSlider(value);\n\n return (\n <SliderContainer\n className={buildClassnames([classNames?.container, e2eClassNames?.container])}\n id={id}\n ref={containerRef}\n >\n <SliderTrack />\n {render}\n </SliderContainer>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Slider.js","sources":["../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { SliderContainer, SliderTrack, SliderRange, SliderDiv } from './styled';\nimport { SliderComponentPropTypes, DraggingSliderIndex, ClassNamesReturnPayload } from './types';\nimport { buildClassnames } from '../../utils/buildClassnames';\n\nconst generateClassNames = (prefix: string | undefined): ClassNamesReturnPayload => ({\n container: prefix ? `${prefix}-slider-container` : undefined,\n sliderRange: prefix ? `${prefix}-slider-range` : undefined,\n slider: prefix ? `${prefix}-slider` : undefined,\n startSlider: prefix ? `${prefix}-start-slider` : undefined,\n endSlider: prefix ? `${prefix}-end-slider` : undefined,\n});\n\nexport const Slider = ({\n id,\n value,\n min,\n max,\n step = 1,\n onChange,\n className,\n e2eClassName,\n onSlideStart = () => {},\n onSlideEnd = () => {},\n}: SliderComponentPropTypes) => {\n const [isDragging, setIsDragging] = useState(false);\n const [draggingSliderIndex, setDraggingSliderIndex] = useState<DraggingSliderIndex>(-1);\n const containerRef = useRef<HTMLDivElement>(null);\n const startSliderRef = useRef<HTMLDivElement>(null);\n const endSliderRef = useRef<HTMLDivElement>(null);\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n const handleMouseMove = useCallback(\n (e: MouseEvent) => {\n if (!isDragging || !containerRef.current) return;\n const sliderValue: number =\n draggingSliderIndex > -1 ? (value as number[])[draggingSliderIndex] : (value as number);\n const containerSize = containerRef.current.getBoundingClientRect();\n // slider position relative to the container in percents\n const handleValue = ((e.pageX - containerSize.x) * 100) / containerSize.width;\n // current value by slider position\n let newValue = (max - min) * (handleValue / 100) + min;\n\n const diff = sliderValue - newValue;\n\n // use to apply step to new value\n if (diff > 0) {\n newValue = sliderValue + Math.ceil(newValue / step - sliderValue / step) * step;\n }\n if (diff < 0) {\n newValue = sliderValue + Math.floor(newValue / step - sliderValue / step) * step;\n }\n\n if (sliderValue === newValue) return;\n if (newValue > max) newValue = max;\n if (newValue < min) newValue = min;\n\n if (Array.isArray(value)) {\n if (draggingSliderIndex === 0 && newValue > value[1]) [, newValue] = value;\n if (draggingSliderIndex === 1 && newValue < value[0]) [newValue] = value;\n }\n\n // used to fix 0.30000000000000004 problem\n const decimalPlaces = step.toString().includes('.')\n ? step.toString().split('.').pop()?.length\n : 0;\n newValue = Number(newValue.toFixed(decimalPlaces));\n\n let resultValue;\n if (Array.isArray(value)) {\n resultValue = draggingSliderIndex === 0 ? [newValue, value[1]] : [value[0], newValue];\n } else {\n resultValue = newValue;\n }\n\n onChange(resultValue);\n\n if (Array.isArray(resultValue) && resultValue[0] === resultValue[1]) {\n if (draggingSliderIndex === 0) setDraggingSliderIndex(1);\n if (draggingSliderIndex === 1) setDraggingSliderIndex(0);\n }\n },\n [draggingSliderIndex, isDragging, max, min, onChange, step, value],\n );\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n onSlideEnd();\n }, [onSlideEnd]);\n const handleMouseDown = useCallback(\n (e: Event, index: DraggingSliderIndex) => {\n setIsDragging(true);\n onSlideStart();\n if (typeof index === 'number') setDraggingSliderIndex(index);\n e.preventDefault();\n },\n [onSlideStart],\n );\n\n useEffect(() => {\n const handleStartSliderMouseDown = (e: Event) =>\n handleMouseDown(e, Array.isArray(value) ? 0 : 1);\n const handleEndSliderMouseDown = (e: Event) => handleMouseDown(e, 1);\n\n const startSliderEl = startSliderRef.current;\n const endSliderEl = endSliderRef.current;\n\n startSliderEl?.addEventListener('mousedown', handleStartSliderMouseDown);\n endSliderEl?.addEventListener('mousedown', handleEndSliderMouseDown);\n\n document.addEventListener('mousemove', handleMouseMove);\n document.addEventListener('mouseup', handleMouseUp);\n return () => {\n startSliderEl?.removeEventListener('mousedown', handleStartSliderMouseDown);\n endSliderEl?.removeEventListener('mousedown', handleEndSliderMouseDown);\n\n document.removeEventListener('mousemove', handleMouseMove);\n document.removeEventListener('mouseup', handleMouseUp);\n };\n }, [handleMouseDown, handleMouseMove, handleMouseUp, value]);\n\n const renderSlider = (left: number, valueNow: number, index?: 0 | 1) => {\n let sliderClassName;\n\n if (typeof index === 'number') {\n sliderClassName = buildClassnames(\n index === 0\n ? [classNames?.startSlider, e2eClassNames?.startSlider]\n : [classNames?.endSlider, e2eClassNames?.endSlider],\n );\n } else {\n sliderClassName = buildClassnames([classNames?.slider, e2eClassNames?.slider]);\n }\n\n return (\n <SliderDiv\n role=\"slider\"\n ref={index === 1 ? endSliderRef : startSliderRef}\n className={sliderClassName}\n left={left}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={valueNow}\n />\n );\n };\n\n const renderRangeSlider = (rangeSliderValue: number[]) => {\n // handle value used to get slider position relative to container from value\n const handleValueStart =\n ((rangeSliderValue[0] < min ? 0 : rangeSliderValue[0] - min) * 100) / (max - min);\n const handleValueEnd =\n ((rangeSliderValue[1] > max ? 100 : rangeSliderValue[1] - min) * 100) / (max - min);\n\n const rangeWidth = handleValueEnd - handleValueStart;\n\n return (\n <>\n <SliderRange\n className={buildClassnames([classNames?.sliderRange, e2eClassNames?.sliderRange])}\n left={handleValueStart}\n width={rangeWidth}\n />\n {renderSlider(handleValueStart, rangeSliderValue[0], 0)}\n {renderSlider(handleValueEnd, rangeSliderValue[1], 1)}\n </>\n );\n };\n\n const renderSingleSlider = (sliderValue: number) => {\n if (Array.isArray(value)) return renderRangeSlider(value as number[]);\n\n let handleValue: number;\n\n if (value > max) handleValue = 100;\n else if (value < min) handleValue = 0;\n else handleValue = ((sliderValue - min) * 100) / (max - min);\n\n return renderSlider(handleValue, sliderValue);\n };\n\n let render;\n if (Array.isArray(value)) render = renderRangeSlider(value);\n else render = renderSingleSlider(value);\n\n return (\n <SliderContainer\n className={buildClassnames([classNames?.container, e2eClassNames?.container])}\n id={id}\n ref={containerRef}\n >\n <SliderTrack />\n {render}\n </SliderContainer>\n );\n};\n"],"names":["React"],"mappings":"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"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default from 'react';
|
|
2
2
|
import { theme } from '../../theme/index.js';
|
|
3
3
|
import { Container, StepButton } from './styled.js';
|
|
4
4
|
import { DownArrowIcon } from '../../tempIcons/DownArrowIcon.js';
|
|
5
5
|
import { UpArrowIcon } from '../../tempIcons/UpArrowIcon.js';
|
|
6
6
|
|
|
7
|
-
const Stepper = ({ onIncrement, onDecrement, disabled = false, size }) => (
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
7
|
+
const Stepper = ({ onIncrement, onDecrement, disabled = false, size }) => (React__default.createElement(Container, { size: size },
|
|
8
|
+
React__default.createElement(StepButton, { type: "button", onClick: onIncrement, disabled: disabled },
|
|
9
|
+
React__default.createElement(UpArrowIcon, { height: theme.sizes.base, width: theme.sizes.base, color: theme.colors.neutral.ink.base })),
|
|
10
|
+
React__default.createElement(StepButton, { type: "button", onClick: onDecrement, disabled: disabled },
|
|
11
|
+
React__default.createElement(DownArrowIcon, { height: theme.sizes.base, width: theme.sizes.base, color: theme.colors.neutral.ink.base }))));
|
|
12
12
|
|
|
13
13
|
export { Stepper };
|
|
14
14
|
//# sourceMappingURL=Stepper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stepper.js","sources":["../../../src/components/Stepper/Stepper.tsx"],"sourcesContent":["import React from 'react';\nimport { theme } from '../../theme';\n\nimport { Container, StepButton } from './styled';\nimport { DownArrowIcon } from '../../tempIcons/DownArrowIcon';\nimport { UpArrowIcon } from '../../tempIcons/UpArrowIcon';\nimport { ComponentSize } from '../types';\n\nexport interface StepperProps {\n onIncrement: () => void;\n onDecrement: () => void;\n disabled?: boolean;\n size?: ComponentSize;\n}\n\nexport const Stepper = ({ onIncrement, onDecrement, disabled = false, size }: StepperProps) => (\n <Container size={size}>\n <StepButton type=\"button\" onClick={onIncrement} disabled={disabled}>\n <UpArrowIcon\n height={theme.sizes.base}\n width={theme.sizes.base}\n color={theme.colors.neutral.ink.base}\n />\n </StepButton>\n <StepButton type=\"button\" onClick={onDecrement} disabled={disabled}>\n <DownArrowIcon\n height={theme.sizes.base}\n width={theme.sizes.base}\n color={theme.colors.neutral.ink.base}\n />\n </StepButton>\n </Container>\n);\n"],"names":[],"mappings":";;;;;;AAea,MAAA,OAAO,GAAG,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,GAAG,KAAK,EAAE,IAAI,EAAgB,
|
|
1
|
+
{"version":3,"file":"Stepper.js","sources":["../../../src/components/Stepper/Stepper.tsx"],"sourcesContent":["import React from 'react';\nimport { theme } from '../../theme';\n\nimport { Container, StepButton } from './styled';\nimport { DownArrowIcon } from '../../tempIcons/DownArrowIcon';\nimport { UpArrowIcon } from '../../tempIcons/UpArrowIcon';\nimport { ComponentSize } from '../types';\n\nexport interface StepperProps {\n onIncrement: () => void;\n onDecrement: () => void;\n disabled?: boolean;\n size?: ComponentSize;\n}\n\nexport const Stepper = ({ onIncrement, onDecrement, disabled = false, size }: StepperProps) => (\n <Container size={size}>\n <StepButton type=\"button\" onClick={onIncrement} disabled={disabled}>\n <UpArrowIcon\n height={theme.sizes.base}\n width={theme.sizes.base}\n color={theme.colors.neutral.ink.base}\n />\n </StepButton>\n <StepButton type=\"button\" onClick={onDecrement} disabled={disabled}>\n <DownArrowIcon\n height={theme.sizes.base}\n width={theme.sizes.base}\n color={theme.colors.neutral.ink.base}\n />\n </StepButton>\n </Container>\n);\n"],"names":["React"],"mappings":";;;;;;AAea,MAAA,OAAO,GAAG,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,GAAG,KAAK,EAAE,IAAI,EAAgB,MACxFA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA;AACnB,IAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAA;AAChE,QAAAA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EACxB,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EACvB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,GACpC,CACS;AACb,IAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAA;AAChE,QAAAA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EACZ,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EACxB,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EACvB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAA,CACpC,CACS,CACH;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default, { forwardRef, useCallback } from 'react';
|
|
2
2
|
import { generateId } from '../../utils/generateId.js';
|
|
3
3
|
import { Textarea, Input } from './styled.js';
|
|
4
4
|
import { ComponentSize } from '../types.js';
|
|
@@ -25,9 +25,9 @@ const TextField = forwardRef(({ id, className, disabled = false, hasError, multi
|
|
|
25
25
|
}, [onChange, type]);
|
|
26
26
|
const componentId = id !== null && id !== undefined ? id : generateId('textfield');
|
|
27
27
|
if (type === 'text' && multiline) {
|
|
28
|
-
return (
|
|
28
|
+
return (React__default.createElement(Textarea, { className: className, disabled: disabled, hasError: hasError, id: componentId, name: name, onChange: handleChange, placeholder: placeholder, value: value, ref: ref, spellCheck: spellCheck, ...otherProps }));
|
|
29
29
|
}
|
|
30
|
-
return (
|
|
30
|
+
return (React__default.createElement(Input, { className: className, disabled: disabled, hasError: hasError, id: componentId, inputSize: size, name: name, "aria-label": name, onChange: handleChange, placeholder: placeholder, type: type, value: value, ref: ref, spellCheck: spellCheck, ...otherProps }));
|
|
31
31
|
});
|
|
32
32
|
|
|
33
33
|
export { TextField };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextField.js","sources":["../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import React, { useCallback, ChangeEvent, forwardRef } from 'react';\nimport { TextFieldProps } from './types';\nimport { generateId } from '../../utils/generateId';\n\nimport { Input, Textarea } from './styled';\nimport { ComponentSize } from '../types';\n\nconst NUMBER_REGEX = /^-?[0-9]*\\.?[0-9]+$/;\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n (\n {\n id,\n className,\n disabled = false,\n hasError,\n multiline = false,\n spellCheck = false,\n name,\n onChange,\n placeholder,\n size = ComponentSize.base,\n type = 'text',\n value,\n ...otherProps\n }: TextFieldProps,\n ref,\n ) => {\n const handleChange = useCallback(\n (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n if (!onChange) return;\n const newValue = event.currentTarget.value;\n\n if (newValue === '') {\n onChange(newValue);\n return;\n }\n\n if (type !== 'number') {\n onChange(newValue);\n return;\n }\n\n const reg = new RegExp(NUMBER_REGEX);\n if (!reg.test(newValue)) {\n return;\n }\n\n onChange(newValue);\n },\n [onChange, type],\n );\n\n const componentId = id ?? generateId('textfield');\n\n if (type === 'text' && multiline) {\n return (\n <Textarea\n className={className}\n disabled={disabled}\n hasError={hasError}\n id={componentId}\n name={name}\n onChange={handleChange}\n placeholder={placeholder}\n value={value}\n ref={ref}\n spellCheck={spellCheck}\n {...otherProps}\n />\n );\n }\n\n return (\n <Input\n className={className}\n disabled={disabled}\n hasError={hasError}\n id={componentId}\n inputSize={size}\n name={name}\n aria-label={name}\n onChange={handleChange}\n placeholder={placeholder}\n type={type}\n value={value}\n ref={ref}\n spellCheck={spellCheck}\n {...otherProps}\n />\n );\n },\n);\n"],"names":[],"mappings":";;;;;AAOA,MAAM,YAAY,GAAG,qBAAqB;MAE7B,SAAS,GAAG,UAAU,CACjC,CACE,EACE,EAAE,EACF,SAAS,EACT,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,IAAI,GAAG,aAAa,CAAC,IAAI,EACzB,IAAI,GAAG,MAAM,EACb,KAAK,EACL,GAAG,UAAU,EACE,EACjB,GAAG,KACD;AACF,IAAA,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,KAA0D,KAAI;AAC7D,QAAA,IAAI,CAAC,QAAQ;YAAE;AACf,QAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC,KAAK;QAE1C,IAAI,QAAQ,KAAK,EAAE,EAAE;YACnB,QAAQ,CAAC,QAAQ,CAAC;YAClB;AACD;QAED,IAAI,IAAI,KAAK,QAAQ,EAAE;YACrB,QAAQ,CAAC,QAAQ,CAAC;YAClB;AACD;AAED,QAAA,MAAM,GAAG,GAAG,IAAI,MAAM,CAAC,YAAY,CAAC;AACpC,QAAA,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACvB;AACD;QAED,QAAQ,CAAC,QAAQ,CAAC;AACpB,KAAC,EACD,CAAC,QAAQ,EAAE,IAAI,CAAC,CACjB;AAED,IAAA,MAAM,WAAW,GAAG,EAAE,KAAA,IAAA,IAAF,EAAE,KAAA,SAAA,GAAF,EAAE,GAAI,UAAU,CAAC,WAAW,CAAC;AAEjD,IAAA,IAAI,IAAI,KAAK,MAAM,IAAI,SAAS,EAAE;QAChC,
|
|
1
|
+
{"version":3,"file":"TextField.js","sources":["../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import React, { useCallback, ChangeEvent, forwardRef } from 'react';\nimport { TextFieldProps } from './types';\nimport { generateId } from '../../utils/generateId';\n\nimport { Input, Textarea } from './styled';\nimport { ComponentSize } from '../types';\n\nconst NUMBER_REGEX = /^-?[0-9]*\\.?[0-9]+$/;\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n (\n {\n id,\n className,\n disabled = false,\n hasError,\n multiline = false,\n spellCheck = false,\n name,\n onChange,\n placeholder,\n size = ComponentSize.base,\n type = 'text',\n value,\n ...otherProps\n }: TextFieldProps,\n ref,\n ) => {\n const handleChange = useCallback(\n (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n if (!onChange) return;\n const newValue = event.currentTarget.value;\n\n if (newValue === '') {\n onChange(newValue);\n return;\n }\n\n if (type !== 'number') {\n onChange(newValue);\n return;\n }\n\n const reg = new RegExp(NUMBER_REGEX);\n if (!reg.test(newValue)) {\n return;\n }\n\n onChange(newValue);\n },\n [onChange, type],\n );\n\n const componentId = id ?? generateId('textfield');\n\n if (type === 'text' && multiline) {\n return (\n <Textarea\n className={className}\n disabled={disabled}\n hasError={hasError}\n id={componentId}\n name={name}\n onChange={handleChange}\n placeholder={placeholder}\n value={value}\n ref={ref}\n spellCheck={spellCheck}\n {...otherProps}\n />\n );\n }\n\n return (\n <Input\n className={className}\n disabled={disabled}\n hasError={hasError}\n id={componentId}\n inputSize={size}\n name={name}\n aria-label={name}\n onChange={handleChange}\n placeholder={placeholder}\n type={type}\n value={value}\n ref={ref}\n spellCheck={spellCheck}\n {...otherProps}\n />\n );\n },\n);\n"],"names":["React"],"mappings":";;;;;AAOA,MAAM,YAAY,GAAG,qBAAqB;MAE7B,SAAS,GAAG,UAAU,CACjC,CACE,EACE,EAAE,EACF,SAAS,EACT,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,IAAI,GAAG,aAAa,CAAC,IAAI,EACzB,IAAI,GAAG,MAAM,EACb,KAAK,EACL,GAAG,UAAU,EACE,EACjB,GAAG,KACD;AACF,IAAA,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,KAA0D,KAAI;AAC7D,QAAA,IAAI,CAAC,QAAQ;YAAE;AACf,QAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC,KAAK;QAE1C,IAAI,QAAQ,KAAK,EAAE,EAAE;YACnB,QAAQ,CAAC,QAAQ,CAAC;YAClB;AACD;QAED,IAAI,IAAI,KAAK,QAAQ,EAAE;YACrB,QAAQ,CAAC,QAAQ,CAAC;YAClB;AACD;AAED,QAAA,MAAM,GAAG,GAAG,IAAI,MAAM,CAAC,YAAY,CAAC;AACpC,QAAA,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YACvB;AACD;QAED,QAAQ,CAAC,QAAQ,CAAC;AACpB,KAAC,EACD,CAAC,QAAQ,EAAE,IAAI,CAAC,CACjB;AAED,IAAA,MAAM,WAAW,GAAG,EAAE,KAAA,IAAA,IAAF,EAAE,KAAA,SAAA,GAAF,EAAE,GAAI,UAAU,CAAC,WAAW,CAAC;AAEjD,IAAA,IAAI,IAAI,KAAK,MAAM,IAAI,SAAS,EAAE;QAChC,QACEA,6BAAC,QAAQ,EAAA,EACP,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,EAAE,EAAE,WAAW,EACf,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,YAAY,EACtB,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,EAClB,GAAA,UAAU,EACd,CAAA;AAEL;IAED,QACEA,cAAC,CAAA,aAAA,CAAA,KAAK,EACJ,EAAA,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,EAAE,EAAE,WAAW,EACf,SAAS,EAAE,IAAI,EACf,IAAI,EAAE,IAAI,EAAA,YAAA,EACE,IAAI,EAChB,QAAQ,EAAE,YAAY,EACtB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,EAClB,GAAA,UAAU,EACd,CAAA;AAEN,CAAC;;;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { TransitionGroup, CSSTransition } from 'react-transition-group';
|
|
2
|
-
import
|
|
2
|
+
import React__default, { useEffect } from 'react';
|
|
3
3
|
import { createPortal } from 'react-dom';
|
|
4
4
|
import { ToastsLayoutContainer } from './components/styled.js';
|
|
5
5
|
import { Toast } from './components/Toast.js';
|
|
@@ -9,9 +9,9 @@ const ToastsLayout = ({ className, e2eClassName, toasts, minWidth = '50vw', max
|
|
|
9
9
|
if (max && toasts.length > max)
|
|
10
10
|
onClose(toasts[0].key);
|
|
11
11
|
}, [toasts, max, onClose]);
|
|
12
|
-
return createPortal(
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
return createPortal(React__default.createElement(ToastsLayoutContainer, { direction: "vertical", alignX: "center", spacing: 4 },
|
|
13
|
+
React__default.createElement(TransitionGroup, { component: null }, [...toasts].reverse().map((toast, index) => (React__default.createElement(CSSTransition, { key: toast.key, timeout: 500, classNames: "veeqo-components-toast" },
|
|
14
|
+
React__default.createElement(Toast, { className: className, e2eClassName: e2eClassName, minWidth: minWidth, last: index === toasts.length - 1, onClose: () => onClose(toast.key), ...toast })))))), document.body);
|
|
15
15
|
};
|
|
16
16
|
|
|
17
17
|
export { ToastsLayout };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastsLayout.js","sources":["../../../src/components/ToastsLayout/ToastsLayout.tsx"],"sourcesContent":["import { CSSTransition, TransitionGroup } from 'react-transition-group';\nimport React, { useEffect, FC } from 'react';\nimport { createPortal } from 'react-dom';\nimport { ToastsLayoutPropTypes } from './types';\nimport { ToastsLayoutContainer } from './components/styled';\nimport { Toast } from './components/Toast';\n\nexport const ToastsLayout: FC<ToastsLayoutPropTypes> = ({\n className,\n e2eClassName,\n toasts,\n minWidth = '50vw',\n max = 3,\n onClose,\n}) => {\n useEffect(() => {\n if (max && toasts.length > max) onClose(toasts[0].key);\n }, [toasts, max, onClose]);\n\n return createPortal(\n <ToastsLayoutContainer direction=\"vertical\" alignX=\"center\" spacing={4}>\n <TransitionGroup component={null}>\n {[...toasts].reverse().map((toast, index) => (\n <CSSTransition key={toast.key} timeout={500} classNames=\"veeqo-components-toast\">\n <Toast\n className={className}\n e2eClassName={e2eClassName}\n minWidth={minWidth}\n last={index === toasts.length - 1}\n onClose={() => onClose(toast.key)}\n {...toast}\n />\n </CSSTransition>\n ))}\n </TransitionGroup>\n </ToastsLayoutContainer>,\n document.body,\n );\n};\n"],"names":[],"mappings":";;;;;;MAOa,YAAY,GAA8B,CAAC,EACtD,SAAS,EACT,YAAY,EACZ,MAAM,EACN,QAAQ,GAAG,MAAM,EACjB,GAAG,GAAG,CAAC,EACP,OAAO,GACR,KAAI;IACH,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,GAAG,IAAI,MAAM,CAAC,MAAM,GAAG,GAAG;YAAE,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;KACvD,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE,OAAO,CAAC,CAAC;AAE1B,IAAA,OAAO,YAAY,
|
|
1
|
+
{"version":3,"file":"ToastsLayout.js","sources":["../../../src/components/ToastsLayout/ToastsLayout.tsx"],"sourcesContent":["import { CSSTransition, TransitionGroup } from 'react-transition-group';\nimport React, { useEffect, FC } from 'react';\nimport { createPortal } from 'react-dom';\nimport { ToastsLayoutPropTypes } from './types';\nimport { ToastsLayoutContainer } from './components/styled';\nimport { Toast } from './components/Toast';\n\nexport const ToastsLayout: FC<ToastsLayoutPropTypes> = ({\n className,\n e2eClassName,\n toasts,\n minWidth = '50vw',\n max = 3,\n onClose,\n}) => {\n useEffect(() => {\n if (max && toasts.length > max) onClose(toasts[0].key);\n }, [toasts, max, onClose]);\n\n return createPortal(\n <ToastsLayoutContainer direction=\"vertical\" alignX=\"center\" spacing={4}>\n <TransitionGroup component={null}>\n {[...toasts].reverse().map((toast, index) => (\n <CSSTransition key={toast.key} timeout={500} classNames=\"veeqo-components-toast\">\n <Toast\n className={className}\n e2eClassName={e2eClassName}\n minWidth={minWidth}\n last={index === toasts.length - 1}\n onClose={() => onClose(toast.key)}\n {...toast}\n />\n </CSSTransition>\n ))}\n </TransitionGroup>\n </ToastsLayoutContainer>,\n document.body,\n );\n};\n"],"names":["React"],"mappings":";;;;;;MAOa,YAAY,GAA8B,CAAC,EACtD,SAAS,EACT,YAAY,EACZ,MAAM,EACN,QAAQ,GAAG,MAAM,EACjB,GAAG,GAAG,CAAC,EACP,OAAO,GACR,KAAI;IACH,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,GAAG,IAAI,MAAM,CAAC,MAAM,GAAG,GAAG;YAAE,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;KACvD,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE,OAAO,CAAC,CAAC;AAE1B,IAAA,OAAO,YAAY,CACjBA,cAAC,CAAA,aAAA,CAAA,qBAAqB,IAAC,SAAS,EAAC,UAAU,EAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,EAAE,CAAC,EAAA;AACpE,QAAAA,cAAA,CAAA,aAAA,CAAC,eAAe,EAAC,EAAA,SAAS,EAAE,IAAI,IAC7B,CAAC,GAAG,MAAM,CAAC,CAAC,OAAO,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,MACtCA,6BAAC,aAAa,EAAA,EAAC,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,UAAU,EAAC,wBAAwB,EAAA;YAC9EA,cAAC,CAAA,aAAA,CAAA,KAAK,IACJ,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,KAAK,KAAK,MAAM,CAAC,MAAM,GAAG,CAAC,EACjC,OAAO,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,EAC7B,GAAA,KAAK,GACT,CACY,CACjB,CAAC,CACc,CACI,EACxB,QAAQ,CAAC,IAAI,CACd;AACH;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default from 'react';
|
|
2
2
|
import { colors } from '../../../theme/modules/colors.js';
|
|
3
3
|
import { Toast as Toast$1, IconWrap, ContentStack, StyledText } from './styled.js';
|
|
4
4
|
import { buildClassnames } from '../../../utils/buildClassnames.js';
|
|
@@ -12,19 +12,19 @@ import { CrossIcon } from '../../../tempIcons/CrossIcon.js';
|
|
|
12
12
|
const toastTypes = {
|
|
13
13
|
info: {
|
|
14
14
|
accentColor: colors.brand.blue.base,
|
|
15
|
-
icon:
|
|
15
|
+
icon: React__default.createElement(InfoIcon, null),
|
|
16
16
|
},
|
|
17
17
|
success: {
|
|
18
18
|
accentColor: colors.secondary.green.base,
|
|
19
|
-
icon:
|
|
19
|
+
icon: React__default.createElement(SuccessIcon, null),
|
|
20
20
|
},
|
|
21
21
|
error: {
|
|
22
22
|
accentColor: colors.secondary.red.base,
|
|
23
|
-
icon:
|
|
23
|
+
icon: React__default.createElement(AttentionIcon, null),
|
|
24
24
|
},
|
|
25
25
|
merge: {
|
|
26
26
|
accentColor: colors.secondary.purple.base,
|
|
27
|
-
icon:
|
|
27
|
+
icon: React__default.createElement(MergeIcon, null),
|
|
28
28
|
},
|
|
29
29
|
};
|
|
30
30
|
const generateClassNames = (prefix) => ({
|
|
@@ -35,12 +35,12 @@ const generateClassNames = (prefix) => ({
|
|
|
35
35
|
const Toast = ({ className, e2eClassName, type, iconSlot, text, last, minWidth, cta, onClose, }) => {
|
|
36
36
|
const classNames = generateClassNames(className);
|
|
37
37
|
const e2eClassNames = generateClassNames(e2eClassName);
|
|
38
|
-
return (
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
38
|
+
return (React__default.createElement(Toast$1, { className: buildClassnames([classNames === null || classNames === undefined ? undefined : classNames.container, e2eClassNames === null || e2eClassNames === undefined ? undefined : e2eClassNames.container]), direction: "horizontal", alignY: "center", minWidth: minWidth, last: last },
|
|
39
|
+
React__default.createElement(IconWrap, { color: toastTypes[type].accentColor, className: buildClassnames([classNames.icon, e2eClassNames.icon]) }, iconSlot !== null && iconSlot !== undefined ? iconSlot : toastTypes[type].icon),
|
|
40
|
+
React__default.createElement(ContentStack, { direction: "horizontal", alignY: "center", alignX: "between" },
|
|
41
|
+
React__default.createElement(StyledText, { variant: "body" }, text),
|
|
42
42
|
cta),
|
|
43
|
-
|
|
43
|
+
React__default.createElement(Button, { variant: "flat", iconSlot: React__default.createElement(CrossIcon, { color: "white" }), onClick: onClose, "aria-label": "Close" })));
|
|
44
44
|
};
|
|
45
45
|
|
|
46
46
|
export { Toast };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.js","sources":["../../../../src/components/ToastsLayout/components/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport { colors } from '../../../theme/modules/colors';\nimport { IconWrap, Toast as ToastContainer, StyledText as Text, ContentStack } from './styled';\nimport { ToastType, ToastPropTypes, ClassNamesReturnPayload } from '../types';\nimport { buildClassnames } from '../../../utils/buildClassnames';\nimport { Button } from '../../Button';\nimport { SuccessIcon } from '../../../tempIcons/SuccessIcon';\nimport { InfoIcon } from '../../../tempIcons/InfoIcon';\nimport { AttentionIcon } from '../../../tempIcons/AttentionIcon';\nimport { MergeIcon } from '../../../tempIcons/MergeIcon';\nimport { CrossIcon } from '../../../tempIcons/CrossIcon';\n\nconst toastTypes: ToastType = {\n info: {\n accentColor: colors.brand.blue.base,\n icon: <InfoIcon />,\n },\n success: {\n accentColor: colors.secondary.green.base,\n icon: <SuccessIcon />,\n },\n error: {\n accentColor: colors.secondary.red.base,\n icon: <AttentionIcon />,\n },\n merge: {\n accentColor: colors.secondary.purple.base,\n icon: <MergeIcon />,\n },\n};\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n container: prefix ? `${prefix}-toast-container` : undefined,\n icon: prefix ? `${prefix}-toast-icon` : undefined,\n closeIcon: prefix ? `${prefix}-toast-close-icon` : undefined,\n});\n\nexport const Toast = ({\n className,\n e2eClassName,\n type,\n iconSlot,\n text,\n last,\n minWidth,\n cta,\n onClose,\n}: ToastPropTypes) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n return (\n <ToastContainer\n className={buildClassnames([classNames?.container, e2eClassNames?.container])}\n direction=\"horizontal\"\n alignY=\"center\"\n minWidth={minWidth}\n last={last}\n >\n <IconWrap\n color={toastTypes[type].accentColor}\n className={buildClassnames([classNames.icon, e2eClassNames.icon])}\n >\n {iconSlot ?? toastTypes[type].icon}\n </IconWrap>\n <ContentStack direction=\"horizontal\" alignY=\"center\" alignX=\"between\">\n <Text variant=\"body\">{text}</Text>\n {cta}\n </ContentStack>\n <Button\n variant=\"flat\"\n iconSlot={<CrossIcon color=\"white\" />}\n onClick={onClose}\n aria-label=\"Close\"\n />\n </ToastContainer>\n );\n};\n"],"names":["ToastContainer","Text"],"mappings":";;;;;;;;;;;AAYA,MAAM,UAAU,GAAc;AAC5B,IAAA,IAAI,EAAE;AACJ,QAAA,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI;QACnC,IAAI,
|
|
1
|
+
{"version":3,"file":"Toast.js","sources":["../../../../src/components/ToastsLayout/components/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport { colors } from '../../../theme/modules/colors';\nimport { IconWrap, Toast as ToastContainer, StyledText as Text, ContentStack } from './styled';\nimport { ToastType, ToastPropTypes, ClassNamesReturnPayload } from '../types';\nimport { buildClassnames } from '../../../utils/buildClassnames';\nimport { Button } from '../../Button';\nimport { SuccessIcon } from '../../../tempIcons/SuccessIcon';\nimport { InfoIcon } from '../../../tempIcons/InfoIcon';\nimport { AttentionIcon } from '../../../tempIcons/AttentionIcon';\nimport { MergeIcon } from '../../../tempIcons/MergeIcon';\nimport { CrossIcon } from '../../../tempIcons/CrossIcon';\n\nconst toastTypes: ToastType = {\n info: {\n accentColor: colors.brand.blue.base,\n icon: <InfoIcon />,\n },\n success: {\n accentColor: colors.secondary.green.base,\n icon: <SuccessIcon />,\n },\n error: {\n accentColor: colors.secondary.red.base,\n icon: <AttentionIcon />,\n },\n merge: {\n accentColor: colors.secondary.purple.base,\n icon: <MergeIcon />,\n },\n};\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n container: prefix ? `${prefix}-toast-container` : undefined,\n icon: prefix ? `${prefix}-toast-icon` : undefined,\n closeIcon: prefix ? `${prefix}-toast-close-icon` : undefined,\n});\n\nexport const Toast = ({\n className,\n e2eClassName,\n type,\n iconSlot,\n text,\n last,\n minWidth,\n cta,\n onClose,\n}: ToastPropTypes) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n return (\n <ToastContainer\n className={buildClassnames([classNames?.container, e2eClassNames?.container])}\n direction=\"horizontal\"\n alignY=\"center\"\n minWidth={minWidth}\n last={last}\n >\n <IconWrap\n color={toastTypes[type].accentColor}\n className={buildClassnames([classNames.icon, e2eClassNames.icon])}\n >\n {iconSlot ?? toastTypes[type].icon}\n </IconWrap>\n <ContentStack direction=\"horizontal\" alignY=\"center\" alignX=\"between\">\n <Text variant=\"body\">{text}</Text>\n {cta}\n </ContentStack>\n <Button\n variant=\"flat\"\n iconSlot={<CrossIcon color=\"white\" />}\n onClick={onClose}\n aria-label=\"Close\"\n />\n </ToastContainer>\n );\n};\n"],"names":["React","ToastContainer","Text"],"mappings":"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"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default, { forwardRef } from 'react';
|
|
2
2
|
import { Wrapper, Switch, Input, Slider } from './styled.js';
|
|
3
3
|
import { Choice } from '../Choice/Choice.js';
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* A toggle switch component, use-cases should provide a label, wrap with a custom one or pass in an aria-label.
|
|
7
7
|
*/
|
|
8
|
-
const Toggle = forwardRef(({ id = 'testid', className, name, switched, small, onClick = () => { }, disabled, ariaLabel, inputPosition = 'right', ...choiceProps }, ref) => (
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
8
|
+
const Toggle = forwardRef(({ id = 'testid', className, name, switched, small, onClick = () => { }, disabled, ariaLabel, inputPosition = 'right', ...choiceProps }, ref) => (React__default.createElement(Choice, { id: id, inputPosition: inputPosition, ...choiceProps },
|
|
9
|
+
React__default.createElement(Wrapper, { className: className, disabled: disabled },
|
|
10
|
+
React__default.createElement(Switch, { small: small, disabled: disabled, className: className },
|
|
11
|
+
React__default.createElement(Input, { id: id, role: "switch", type: "checkbox", name: name, "aria-label": ariaLabel, checked: !!switched, onChange: (e) => (disabled ? undefined : onClick(e)), disabled: disabled, ref: ref }),
|
|
12
|
+
React__default.createElement(Slider, { switched: switched, disabled: disabled }))))));
|
|
13
13
|
|
|
14
14
|
export { Toggle };
|
|
15
15
|
//# sourceMappingURL=Toggle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toggle.js","sources":["../../../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ToggleProps } from './types';\nimport { Input, Slider, Switch, Wrapper } from './styled';\nimport { Choice, ForwardedChoiceProps } from '../Choice';\n\n/**\n * A toggle switch component, use-cases should provide a label, wrap with a custom one or pass in an aria-label.\n */\nexport const Toggle = forwardRef<HTMLInputElement, ToggleProps>(\n (\n {\n id = 'testid',\n className,\n name,\n switched,\n small,\n onClick = () => {},\n disabled,\n ariaLabel,\n inputPosition = 'right',\n ...choiceProps\n }: ToggleProps,\n ref,\n ) => (\n <Choice id={id} inputPosition={inputPosition} {...(choiceProps as ForwardedChoiceProps)}>\n <Wrapper className={className} disabled={disabled}>\n <Switch small={small} disabled={disabled} className={className}>\n <Input\n id={id}\n role=\"switch\"\n type=\"checkbox\"\n name={name}\n aria-label={ariaLabel}\n checked={!!switched}\n onChange={(e) => (disabled ? undefined : onClick(e))}\n disabled={disabled}\n ref={ref}\n />\n <Slider switched={switched} disabled={disabled} />\n </Switch>\n </Wrapper>\n </Choice>\n ),\n);\n"],"names":[],"mappings":";;;;AAMA;;AAEG;AACU,MAAA,MAAM,GAAG,UAAU,CAC9B,CACE,EACE,EAAE,GAAG,QAAQ,EACb,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,OAAO,GAAG,MAAK,GAAG,EAClB,QAAQ,EACR,SAAS,EACT,aAAa,GAAG,OAAO,EACvB,GAAG,WAAW,EACF,EACd,GAAG,
|
|
1
|
+
{"version":3,"file":"Toggle.js","sources":["../../../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ToggleProps } from './types';\nimport { Input, Slider, Switch, Wrapper } from './styled';\nimport { Choice, ForwardedChoiceProps } from '../Choice';\n\n/**\n * A toggle switch component, use-cases should provide a label, wrap with a custom one or pass in an aria-label.\n */\nexport const Toggle = forwardRef<HTMLInputElement, ToggleProps>(\n (\n {\n id = 'testid',\n className,\n name,\n switched,\n small,\n onClick = () => {},\n disabled,\n ariaLabel,\n inputPosition = 'right',\n ...choiceProps\n }: ToggleProps,\n ref,\n ) => (\n <Choice id={id} inputPosition={inputPosition} {...(choiceProps as ForwardedChoiceProps)}>\n <Wrapper className={className} disabled={disabled}>\n <Switch small={small} disabled={disabled} className={className}>\n <Input\n id={id}\n role=\"switch\"\n type=\"checkbox\"\n name={name}\n aria-label={ariaLabel}\n checked={!!switched}\n onChange={(e) => (disabled ? undefined : onClick(e))}\n disabled={disabled}\n ref={ref}\n />\n <Slider switched={switched} disabled={disabled} />\n </Switch>\n </Wrapper>\n </Choice>\n ),\n);\n"],"names":["React"],"mappings":";;;;AAMA;;AAEG;AACU,MAAA,MAAM,GAAG,UAAU,CAC9B,CACE,EACE,EAAE,GAAG,QAAQ,EACb,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,OAAO,GAAG,MAAK,GAAG,EAClB,QAAQ,EACR,SAAS,EACT,aAAa,GAAG,OAAO,EACvB,GAAG,WAAW,EACF,EACd,GAAG,MAEHA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,aAAa,EAAE,aAAa,EAAA,GAAO,WAAoC,EAAA;IACrFA,cAAC,CAAA,aAAA,CAAA,OAAO,IAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAA;AAC/C,QAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAA;YAC5DA,cAAC,CAAA,aAAA,CAAA,KAAK,EACJ,EAAA,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,IAAI,EACE,YAAA,EAAA,SAAS,EACrB,OAAO,EAAE,CAAC,CAAC,QAAQ,EACnB,QAAQ,EAAE,CAAC,CAAC,MAAM,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,EACpD,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,GAAG,EACR,CAAA;AACF,YAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAC3C,CACD,CACH,CACV;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default from 'react';
|
|
2
2
|
import { StyledButton } from './styled.js';
|
|
3
3
|
|
|
4
|
-
const ToggleButton = ({ children, checked, size = 'base', disabled = false, onChange, }) => (
|
|
4
|
+
const ToggleButton = ({ children, checked, size = 'base', disabled = false, onChange, }) => (React__default.createElement(StyledButton, { type: "button", checked: checked, size: size, disabled: disabled, "aria-pressed": checked, tabIndex: "0", onClick: () => onChange(!checked) }, children));
|
|
5
5
|
|
|
6
6
|
export { ToggleButton };
|
|
7
7
|
//# sourceMappingURL=ToggleButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButton.js","sources":["../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\n\nimport { StyledButton } from './styled';\n\nexport interface ToggleButtonProps {\n children: ReactNode;\n checked: boolean;\n size?: 'sm' | 'base';\n disabled?: boolean;\n onChange: (checked: boolean) => void;\n}\n\nexport const ToggleButton = ({\n children,\n checked,\n size = 'base',\n disabled = false,\n onChange,\n}: ToggleButtonProps) => (\n <StyledButton\n type=\"button\"\n checked={checked}\n size={size}\n disabled={disabled}\n aria-pressed={checked}\n tabIndex=\"0\"\n onClick={() => onChange(!checked)}\n >\n {children}\n </StyledButton>\n);\n"],"names":[],"mappings":";;;AAYO,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,OAAO,EACP,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,QAAQ,GACU,
|
|
1
|
+
{"version":3,"file":"ToggleButton.js","sources":["../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\n\nimport { StyledButton } from './styled';\n\nexport interface ToggleButtonProps {\n children: ReactNode;\n checked: boolean;\n size?: 'sm' | 'base';\n disabled?: boolean;\n onChange: (checked: boolean) => void;\n}\n\nexport const ToggleButton = ({\n children,\n checked,\n size = 'base',\n disabled = false,\n onChange,\n}: ToggleButtonProps) => (\n <StyledButton\n type=\"button\"\n checked={checked}\n size={size}\n disabled={disabled}\n aria-pressed={checked}\n tabIndex=\"0\"\n onClick={() => onChange(!checked)}\n >\n {children}\n </StyledButton>\n);\n"],"names":["React"],"mappings":";;;AAYO,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,OAAO,EACP,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,QAAQ,GACU,MAClBA,cAAC,CAAA,aAAA,CAAA,YAAY,EACX,EAAA,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,OAAO,EACrB,QAAQ,EAAC,GAAG,EACZ,OAAO,EAAE,MAAM,QAAQ,CAAC,CAAC,OAAO,CAAC,EAAA,EAEhC,QAAQ,CACI;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default, { useState } from 'react';
|
|
2
2
|
import { Container, Hoverable } from './components/styled.js';
|
|
3
3
|
import { TooltipPopover } from './components/TooltipPopover.js';
|
|
4
4
|
import { Portal } from '../Portal/Portal.js';
|
|
@@ -19,11 +19,11 @@ const Tooltip = ({ children, text, content, config, reversed = false, className,
|
|
|
19
19
|
return children;
|
|
20
20
|
const show = () => setShouldShow(true);
|
|
21
21
|
const hide = () => setShouldShow(false);
|
|
22
|
-
const tooltipContent = (
|
|
23
|
-
const tooltipMarkup = useReactPortal ?
|
|
24
|
-
return (
|
|
22
|
+
const tooltipContent = (React__default.createElement(TooltipPopover, { classNames: classNames, hoverableElement: hoverableElement, config: config, reversed: reversed, withTriangle: withTriangle, text: text, content: content }));
|
|
23
|
+
const tooltipMarkup = useReactPortal ? React__default.createElement(Portal, null, tooltipContent) : tooltipContent;
|
|
24
|
+
return (React__default.createElement(Container, { className: classNames.container },
|
|
25
25
|
shouldShow && tooltipMarkup,
|
|
26
|
-
|
|
26
|
+
React__default.createElement(Hoverable, { ref: setHoverableElement, className: classNames.hoverable, onMouseEnter: show, onMouseLeave: hide }, children)));
|
|
27
27
|
};
|
|
28
28
|
|
|
29
29
|
export { Tooltip };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { TooltipProps } from './types';\nimport { Container, Hoverable } from './components/styled';\nimport { TooltipPopover } from './components/TooltipPopover';\nimport { Portal } from '../Portal';\n\nexport const Tooltip = ({\n children,\n text,\n content,\n config,\n reversed = false,\n className,\n withTriangle,\n initialShouldShow = false,\n useReactPortal = true,\n}: TooltipProps): JSX.Element | null => {\n const [shouldShow, setShouldShow] = useState(initialShouldShow);\n const [hoverableElement, setHoverableElement] = useState<HTMLDivElement | null>(null);\n\n const hasText = text ? text.trim().length > 0 : false;\n\n const classNames = {\n container: className && `${className} ${className}-container`,\n tip: className && `${className}-tip`,\n wrap: className && `${className}-wrap`,\n triangle: className && `${className}-triangle`,\n hoverable: className && `${className}-hoverable`,\n };\n\n const hasContent = !!(content || hasText);\n if (!hasContent) return children;\n\n const show = () => setShouldShow(true);\n const hide = () => setShouldShow(false);\n\n const tooltipContent = (\n <TooltipPopover\n classNames={classNames}\n hoverableElement={hoverableElement}\n config={config}\n reversed={reversed}\n withTriangle={withTriangle}\n text={text}\n content={content}\n />\n );\n\n const tooltipMarkup = useReactPortal ? <Portal>{tooltipContent}</Portal> : tooltipContent;\n\n return (\n <Container className={classNames.container}>\n {shouldShow && tooltipMarkup}\n <Hoverable\n ref={setHoverableElement}\n className={classNames.hoverable}\n onMouseEnter={show}\n onMouseLeave={hide}\n >\n {children}\n </Hoverable>\n </Container>\n );\n};\n"],"names":[],"mappings":";;;;;AAMO,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,YAAY,EACZ,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,IAAI,GACR,KAAwB;IACrC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;AAErF,IAAA,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK;AAErD,IAAA,MAAM,UAAU,GAAG;AACjB,QAAA,SAAS,EAAE,SAAS,IAAI,GAAG,SAAS,CAAA,CAAA,EAAI,SAAS,CAAY,UAAA,CAAA;AAC7D,QAAA,GAAG,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,CAAM,IAAA,CAAA;AACpC,QAAA,IAAI,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,CAAO,KAAA,CAAA;AACtC,QAAA,QAAQ,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,CAAW,SAAA,CAAA;AAC9C,QAAA,SAAS,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,CAAY,UAAA,CAAA;KACjD;IAED,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC;AACzC,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAO,QAAQ;IAEhC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,IAAI,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC;AAEvC,IAAA,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { TooltipProps } from './types';\nimport { Container, Hoverable } from './components/styled';\nimport { TooltipPopover } from './components/TooltipPopover';\nimport { Portal } from '../Portal';\n\nexport const Tooltip = ({\n children,\n text,\n content,\n config,\n reversed = false,\n className,\n withTriangle,\n initialShouldShow = false,\n useReactPortal = true,\n}: TooltipProps): JSX.Element | null => {\n const [shouldShow, setShouldShow] = useState(initialShouldShow);\n const [hoverableElement, setHoverableElement] = useState<HTMLDivElement | null>(null);\n\n const hasText = text ? text.trim().length > 0 : false;\n\n const classNames = {\n container: className && `${className} ${className}-container`,\n tip: className && `${className}-tip`,\n wrap: className && `${className}-wrap`,\n triangle: className && `${className}-triangle`,\n hoverable: className && `${className}-hoverable`,\n };\n\n const hasContent = !!(content || hasText);\n if (!hasContent) return children;\n\n const show = () => setShouldShow(true);\n const hide = () => setShouldShow(false);\n\n const tooltipContent = (\n <TooltipPopover\n classNames={classNames}\n hoverableElement={hoverableElement}\n config={config}\n reversed={reversed}\n withTriangle={withTriangle}\n text={text}\n content={content}\n />\n );\n\n const tooltipMarkup = useReactPortal ? <Portal>{tooltipContent}</Portal> : tooltipContent;\n\n return (\n <Container className={classNames.container}>\n {shouldShow && tooltipMarkup}\n <Hoverable\n ref={setHoverableElement}\n className={classNames.hoverable}\n onMouseEnter={show}\n onMouseLeave={hide}\n >\n {children}\n </Hoverable>\n </Container>\n );\n};\n"],"names":["React"],"mappings":";;;;;AAMO,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,YAAY,EACZ,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,IAAI,GACR,KAAwB;IACrC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;AAErF,IAAA,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK;AAErD,IAAA,MAAM,UAAU,GAAG;AACjB,QAAA,SAAS,EAAE,SAAS,IAAI,GAAG,SAAS,CAAA,CAAA,EAAI,SAAS,CAAY,UAAA,CAAA;AAC7D,QAAA,GAAG,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,CAAM,IAAA,CAAA;AACpC,QAAA,IAAI,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,CAAO,KAAA,CAAA;AACtC,QAAA,QAAQ,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,CAAW,SAAA,CAAA;AAC9C,QAAA,SAAS,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,CAAY,UAAA,CAAA;KACjD;IAED,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC;AACzC,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAO,QAAQ;IAEhC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,IAAI,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC;AAEvC,IAAA,MAAM,cAAc,IAClBA,cAAA,CAAA,aAAA,CAAC,cAAc,EACb,EAAA,UAAU,EAAE,UAAU,EACtB,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAAA,CAChB,CACH;AAED,IAAA,MAAM,aAAa,GAAG,cAAc,GAAGA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,IAAA,EAAE,cAAc,CAAU,GAAG,cAAc;IAEzF,QACEA,6BAAC,SAAS,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,SAAS,EAAA;AACvC,QAAA,UAAU,IAAI,aAAa;QAC5BA,cAAC,CAAA,aAAA,CAAA,SAAS,EACR,EAAA,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAE,UAAU,CAAC,SAAS,EAC/B,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,IAAI,IAEjB,QAAQ,CACC,CACF;AAEhB;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default, { useState } from 'react';
|
|
2
2
|
import { usePopper } from 'react-popper';
|
|
3
3
|
import { Tip, Wrap, TooltipText, Triangle } from './styled.js';
|
|
4
4
|
import { Sides } from '../types.js';
|
|
@@ -30,9 +30,9 @@ const TooltipPopover = ({ content, text, hoverableElement, config, reversed, wit
|
|
|
30
30
|
...styles.popper,
|
|
31
31
|
zIndex: theme.layers.tooltip,
|
|
32
32
|
};
|
|
33
|
-
return (
|
|
34
|
-
|
|
35
|
-
withTriangle &&
|
|
33
|
+
return (React__default.createElement(Tip, { className: classNames.tip, ref: setPopperElement, duration: duration, triangleOffsetSize: triangleOffset, style: tooltipStyles, ...attributes.popper, role: "tooltip" },
|
|
34
|
+
React__default.createElement(Wrap, { className: classNames.wrap, tipMinWidth: tipMinWidth, tipMaxWidth: tipMaxWidth }, content !== null && content !== undefined ? content : React__default.createElement(TooltipText, null, text)),
|
|
35
|
+
withTriangle && React__default.createElement(Triangle, { id: "veeqo-components-triangle", className: classNames.triangle })));
|
|
36
36
|
};
|
|
37
37
|
|
|
38
38
|
export { TooltipPopover };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipPopover.js","sources":["../../../../src/components/Tooltip/components/TooltipPopover.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { usePopper } from 'react-popper';\nimport { Tip, TooltipText, Triangle, Wrap } from './styled';\nimport { IConfig, Sides } from '../types';\nimport { Placement, TooltipPopoverProps } from './types';\nimport { theme } from '../../../theme';\n\nconst defaultConfig: IConfig = {\n duration: 400,\n side: Sides.TOP,\n triangleOffset: 8,\n tipMinWidth: 60,\n tipMaxWidth: 340,\n};\n\nexport const TooltipPopover = ({\n content,\n text,\n hoverableElement,\n config,\n reversed,\n withTriangle,\n classNames,\n}: TooltipPopoverProps) => {\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const usedConfig = { ...defaultConfig, ...config };\n const { duration, side, triangleOffset, tipMinWidth, tipMaxWidth } = usedConfig;\n\n const { styles, attributes } = usePopper(hoverableElement, popperElement, {\n placement: `${side}-${reversed ? 'end' : 'start'}` as Placement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 10],\n },\n },\n ],\n });\n\n const tooltipStyles = {\n ...styles.popper,\n zIndex: theme.layers.tooltip,\n };\n\n return (\n <Tip\n className={classNames.tip}\n ref={setPopperElement}\n duration={duration}\n triangleOffsetSize={triangleOffset}\n style={tooltipStyles}\n {...attributes.popper}\n role=\"tooltip\"\n >\n <Wrap className={classNames.wrap} tipMinWidth={tipMinWidth} tipMaxWidth={tipMaxWidth}>\n {content ?? <TooltipText>{text}</TooltipText>}\n </Wrap>\n {withTriangle && <Triangle id=\"veeqo-components-triangle\" className={classNames.triangle} />}\n </Tip>\n );\n};\n"],"names":[],"mappings":";;;;;;AAOA,MAAM,aAAa,GAAY;AAC7B,IAAA,QAAQ,EAAE,GAAG;IACb,IAAI,EAAE,KAAK,CAAC,GAAG;AACf,IAAA,cAAc,EAAE,CAAC;AACjB,IAAA,WAAW,EAAE,EAAE;AACf,IAAA,WAAW,EAAE,GAAG;CACjB;MAEY,cAAc,GAAG,CAAC,EAC7B,OAAO,EACP,IAAI,EACJ,gBAAgB,EAChB,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,UAAU,GACU,KAAI;IACxB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;IAE/E,MAAM,UAAU,GAAG,EAAE,GAAG,aAAa,EAAE,GAAG,MAAM,EAAE;AAClD,IAAA,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,cAAc,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,UAAU;IAE/E,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,SAAS,CAAC,gBAAgB,EAAE,aAAa,EAAE;AACxE,QAAA,SAAS,EAAE,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,QAAQ,GAAG,KAAK,GAAG,OAAO,CAAe,CAAA;AAC/D,QAAA,SAAS,EAAE;AACT,YAAA;AACE,gBAAA,IAAI,EAAE,QAAQ;AACd,gBAAA,OAAO,EAAE;AACP,oBAAA,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AAChB,iBAAA;AACF,aAAA;AACF,SAAA;AACF,KAAA,CAAC;AAEF,IAAA,MAAM,aAAa,GAAG;QACpB,GAAG,MAAM,CAAC,MAAM;AAChB,QAAA,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO;KAC7B;AAED,IAAA,
|
|
1
|
+
{"version":3,"file":"TooltipPopover.js","sources":["../../../../src/components/Tooltip/components/TooltipPopover.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { usePopper } from 'react-popper';\nimport { Tip, TooltipText, Triangle, Wrap } from './styled';\nimport { IConfig, Sides } from '../types';\nimport { Placement, TooltipPopoverProps } from './types';\nimport { theme } from '../../../theme';\n\nconst defaultConfig: IConfig = {\n duration: 400,\n side: Sides.TOP,\n triangleOffset: 8,\n tipMinWidth: 60,\n tipMaxWidth: 340,\n};\n\nexport const TooltipPopover = ({\n content,\n text,\n hoverableElement,\n config,\n reversed,\n withTriangle,\n classNames,\n}: TooltipPopoverProps) => {\n const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n\n const usedConfig = { ...defaultConfig, ...config };\n const { duration, side, triangleOffset, tipMinWidth, tipMaxWidth } = usedConfig;\n\n const { styles, attributes } = usePopper(hoverableElement, popperElement, {\n placement: `${side}-${reversed ? 'end' : 'start'}` as Placement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 10],\n },\n },\n ],\n });\n\n const tooltipStyles = {\n ...styles.popper,\n zIndex: theme.layers.tooltip,\n };\n\n return (\n <Tip\n className={classNames.tip}\n ref={setPopperElement}\n duration={duration}\n triangleOffsetSize={triangleOffset}\n style={tooltipStyles}\n {...attributes.popper}\n role=\"tooltip\"\n >\n <Wrap className={classNames.wrap} tipMinWidth={tipMinWidth} tipMaxWidth={tipMaxWidth}>\n {content ?? <TooltipText>{text}</TooltipText>}\n </Wrap>\n {withTriangle && <Triangle id=\"veeqo-components-triangle\" className={classNames.triangle} />}\n </Tip>\n );\n};\n"],"names":["React"],"mappings":";;;;;;AAOA,MAAM,aAAa,GAAY;AAC7B,IAAA,QAAQ,EAAE,GAAG;IACb,IAAI,EAAE,KAAK,CAAC,GAAG;AACf,IAAA,cAAc,EAAE,CAAC;AACjB,IAAA,WAAW,EAAE,EAAE;AACf,IAAA,WAAW,EAAE,GAAG;CACjB;MAEY,cAAc,GAAG,CAAC,EAC7B,OAAO,EACP,IAAI,EACJ,gBAAgB,EAChB,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,UAAU,GACU,KAAI;IACxB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;IAE/E,MAAM,UAAU,GAAG,EAAE,GAAG,aAAa,EAAE,GAAG,MAAM,EAAE;AAClD,IAAA,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,cAAc,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,UAAU;IAE/E,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,SAAS,CAAC,gBAAgB,EAAE,aAAa,EAAE;AACxE,QAAA,SAAS,EAAE,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,QAAQ,GAAG,KAAK,GAAG,OAAO,CAAe,CAAA;AAC/D,QAAA,SAAS,EAAE;AACT,YAAA;AACE,gBAAA,IAAI,EAAE,QAAQ;AACd,gBAAA,OAAO,EAAE;AACP,oBAAA,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AAChB,iBAAA;AACF,aAAA;AACF,SAAA;AACF,KAAA,CAAC;AAEF,IAAA,MAAM,aAAa,GAAG;QACpB,GAAG,MAAM,CAAC,MAAM;AAChB,QAAA,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO;KAC7B;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,GAAG,EAAA,EACF,SAAS,EAAE,UAAU,CAAC,GAAG,EACzB,GAAG,EAAE,gBAAgB,EACrB,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,cAAc,EAClC,KAAK,EAAE,aAAa,EAChB,GAAA,UAAU,CAAC,MAAM,EACrB,IAAI,EAAC,SAAS,EAAA;QAEdA,cAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,SAAS,EAAE,UAAU,CAAC,IAAI,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EACjF,EAAA,OAAO,KAAP,IAAA,IAAA,OAAO,KAAP,SAAA,GAAA,OAAO,GAAIA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,IAAA,EAAE,IAAI,CAAe,CACxC;AACN,QAAA,YAAY,IAAIA,cAAC,CAAA,aAAA,CAAA,QAAQ,EAAC,EAAA,EAAE,EAAC,2BAA2B,EAAC,SAAS,EAAE,UAAU,CAAC,QAAQ,EAAI,CAAA,CACxF;AAEV;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React__default, { forwardRef, useRef, useImperativeHandle, useState, useCallback, useEffect } from 'react';
|
|
2
2
|
import { DropZoneContainer } from './styled.js';
|
|
3
3
|
import { InputState, FileSizeUnit } from './constants.js';
|
|
4
4
|
import { UploadCopy } from './components/UploadCopy/UploadCopy.js';
|
|
@@ -120,19 +120,19 @@ const UploadFile = forwardRef(({ id, name, maxBytes = 1000000, format = FileSize
|
|
|
120
120
|
ref === null || ref === undefined ? undefined : ref.removeEventListener('cancel', resetSelection);
|
|
121
121
|
};
|
|
122
122
|
}, [onInputChange, resetSelection]);
|
|
123
|
-
return (
|
|
124
|
-
|
|
123
|
+
return (React__default.createElement(RootStack, { spacing: "sm", alignX: "stretch" },
|
|
124
|
+
React__default.createElement(Label, { htmlFor: id },
|
|
125
125
|
label,
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
126
|
+
React__default.createElement(Stack, { spacing: 3, alignX: "stretch", style: { paddingTop: sizes.sm } },
|
|
127
|
+
React__default.createElement(Hint, null,
|
|
128
|
+
React__default.createElement("div", null, acceptedTypesCopy),
|
|
129
|
+
React__default.createElement("div", null, maxSizeCopy)),
|
|
130
|
+
React__default.createElement(DropZoneContainer, { onDrop: onDrop, onDragEnter: onDragEnter, onDragOver: onDragOver, onDragLeave: onDragLeave },
|
|
131
|
+
React__default.createElement(UploadCopy, null),
|
|
132
|
+
React__default.createElement("input", { ref: inputRef, id: id, type: "file", accept: acceptedTypesForInputEl, name: name, required: required, disabled: disabled, ...otherProps })))),
|
|
133
|
+
React__default.createElement(Stack, { alignX: "stretch", spacing: "sm" },
|
|
134
|
+
React__default.createElement(UploadedFile, { file: file, resetSelection: resetSelection, disabled: disabled }),
|
|
135
|
+
React__default.createElement(UploadFileErrors, { acceptedTypesCopy: isInvalidFormat ? acceptedTypesCopy : undefined, maxSizeCopy: isOverMaxSize ? maxSizeCopy : undefined }))));
|
|
136
136
|
});
|
|
137
137
|
|
|
138
138
|
export { UploadFile };
|