@ntbjs/react-components 2.0.0-rc.29 → 2.0.0-rc.30
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/build/{_rollupPluginBabelHelpers-c245b26a.js → _virtual/_rollupPluginBabelHelpers.js} +2 -1
- package/build/_virtual/_rollupPluginBabelHelpers.js.map +1 -0
- package/build/{Alert-e6847a22.js → data/Alert/Alert.js} +5 -55
- package/build/data/Alert/Alert.js.map +1 -0
- package/build/data/Alert/Alert.styled.js +56 -0
- package/build/data/Alert/Alert.styled.js.map +1 -0
- package/build/data/Alert/index.js +2 -6
- package/build/data/Alert/index.js.map +1 -0
- package/build/data/Badge/Badge.js +87 -0
- package/build/data/Badge/Badge.js.map +1 -0
- package/build/{Badge-d93586a9.js → data/Badge/Badge.styled.js} +4 -85
- package/build/data/Badge/Badge.styled.js.map +1 -0
- package/build/data/Badge/index.js +2 -5
- package/build/data/Badge/index.js.map +1 -0
- package/build/data/Popover/Popover.js +93 -0
- package/build/data/Popover/Popover.js.map +1 -0
- package/build/{Popover-20050b91.js → data/Popover/Popover.styled.js} +6 -92
- package/build/data/Popover/Popover.styled.js.map +1 -0
- package/build/data/Popover/index.js +2 -10
- package/build/data/Popover/index.js.map +1 -0
- package/build/{Tab-04d435c3.js → data/Tab/Tab.js} +5 -12
- package/build/data/Tab/Tab.js.map +1 -0
- package/build/data/Tab/Tab.styled.js +13 -0
- package/build/data/Tab/Tab.styled.js.map +1 -0
- package/build/data/Tab/index.js +2 -5
- package/build/data/Tab/index.js.map +1 -0
- package/build/{Tabs-74d1ea8a.js → data/Tabs/Tabs.js} +6 -74
- package/build/data/Tabs/Tabs.js.map +1 -0
- package/build/data/Tabs/Tabs.styled.js +74 -0
- package/build/data/Tabs/Tabs.styled.js.map +1 -0
- package/build/data/Tabs/index.js +2 -7
- package/build/data/Tabs/index.js.map +1 -0
- package/build/{Tooltip-c1d1199e.js → data/Tooltip/Tooltip.js} +5 -26
- package/build/data/Tooltip/Tooltip.js.map +1 -0
- package/build/data/Tooltip/Tooltip.styled.js +28 -0
- package/build/data/Tooltip/Tooltip.styled.js.map +1 -0
- package/build/data/Tooltip/index.js +2 -7
- package/build/data/Tooltip/index.js.map +1 -0
- package/build/data/VerificationStatusIcon/VerificationStatusIcon.js +36 -0
- package/build/data/VerificationStatusIcon/VerificationStatusIcon.js.map +1 -0
- package/build/data/VerificationStatusIcon/VerificationStatusIcon.styled.js +53 -0
- package/build/data/VerificationStatusIcon/VerificationStatusIcon.styled.js.map +1 -0
- package/build/data/index.js +8 -16
- package/build/data/index.js.map +1 -0
- package/build/hooks/useEventListner.js +21 -0
- package/build/hooks/useEventListner.js.map +1 -0
- package/build/hooks/useIsomorphicLayoutEffect.js +6 -0
- package/build/hooks/useIsomorphicLayoutEffect.js.map +1 -0
- package/build/hooks/useOnClickOutside.js +14 -0
- package/build/hooks/useOnClickOutside.js.map +1 -0
- package/build/icons/arrow-back.svg.js +16 -0
- package/build/icons/arrow-back.svg.js.map +1 -0
- package/build/{arrow-forward-ad12c5f3.js → icons/arrow-forward.svg.js} +2 -1
- package/build/icons/arrow-forward.svg.js.map +1 -0
- package/build/icons/check-rectangle-filled.svg.js +16 -0
- package/build/icons/check-rectangle-filled.svg.js.map +1 -0
- package/build/{close-a5d37608.js → icons/close.svg.js} +2 -1
- package/build/icons/close.svg.js.map +1 -0
- package/build/{edit-note-283a0e15.js → icons/edit-note.svg.js} +2 -1
- package/build/icons/edit-note.svg.js.map +1 -0
- package/build/{expand-more-c5523c46.js → icons/expand-more.svg.js} +2 -1
- package/build/icons/expand-more.svg.js.map +1 -0
- package/build/icons/headset.svg.js +16 -0
- package/build/icons/headset.svg.js.map +1 -0
- package/build/icons/layers.svg.js +16 -0
- package/build/icons/layers.svg.js.map +1 -0
- package/build/icons/link.svg.js +16 -0
- package/build/icons/link.svg.js.map +1 -0
- package/build/icons/play.svg.js +16 -0
- package/build/icons/play.svg.js.map +1 -0
- package/build/icons/search.svg.js +16 -0
- package/build/icons/search.svg.js.map +1 -0
- package/build/icons/star-filled.svg.js +16 -0
- package/build/icons/star-filled.svg.js.map +1 -0
- package/build/icons/star.svg.js +16 -0
- package/build/icons/star.svg.js.map +1 -0
- package/build/icons/triangle-right.svg.js +16 -0
- package/build/icons/triangle-right.svg.js.map +1 -0
- package/build/icons/verification.svg.js +16 -0
- package/build/icons/verification.svg.js.map +1 -0
- package/build/{warning-circle-24f3efcd.js → icons/warning-circle.svg.js} +2 -1
- package/build/icons/warning-circle.svg.js.map +1 -0
- package/build/index.js +5 -0
- package/build/index.js.map +1 -0
- package/build/inputs/ActionButton/ActionButton.js +36 -0
- package/build/inputs/ActionButton/ActionButton.js.map +1 -0
- package/build/{ActionButton-4db754c3.js → inputs/ActionButton/ActionButton.styled.js} +4 -34
- package/build/inputs/ActionButton/ActionButton.styled.js.map +1 -0
- package/build/inputs/ActionButton/index.js +2 -6
- package/build/inputs/ActionButton/index.js.map +1 -0
- package/build/inputs/Button/Button.js +188 -0
- package/build/inputs/Button/Button.js.map +1 -0
- package/build/{Button-73eb8516.js → inputs/Button/Button.styled.js} +4 -186
- package/build/inputs/Button/Button.styled.js.map +1 -0
- package/build/inputs/Button/index.js +2 -13
- package/build/inputs/Button/index.js.map +1 -0
- package/build/inputs/Checkbox/Checkbox.js +97 -0
- package/build/inputs/Checkbox/Checkbox.js.map +1 -0
- package/build/inputs/Checkbox/Checkbox.styled.js +122 -0
- package/build/inputs/Checkbox/Checkbox.styled.js.map +1 -0
- package/build/inputs/Checkbox/index.js +2 -6
- package/build/inputs/Checkbox/index.js.map +1 -0
- package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.js +267 -0
- package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.js.map +1 -0
- package/build/{CompactAutocompleteSelect-52c49513.js → inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.styled.js} +6 -267
- package/build/inputs/CompactAutocompleteSelect/CompactAutocompleteSelect.styled.js.map +1 -0
- package/build/inputs/CompactAutocompleteSelect/index.js +2 -23
- package/build/inputs/CompactAutocompleteSelect/index.js.map +1 -0
- package/build/inputs/CompactStarRating/CompactStarRating.js +177 -0
- package/build/inputs/CompactStarRating/CompactStarRating.js.map +1 -0
- package/build/inputs/CompactStarRating/CompactStarRating.styled.js +217 -0
- package/build/inputs/CompactStarRating/CompactStarRating.styled.js.map +1 -0
- package/build/inputs/CompactStarRating/index.js +2 -17
- package/build/inputs/CompactStarRating/index.js.map +1 -0
- package/build/inputs/CompactTextInput/CompactTextInput.js +184 -0
- package/build/inputs/CompactTextInput/CompactTextInput.js.map +1 -0
- package/build/{CompactTextInput-42ca5d42.js → inputs/CompactTextInput/CompactTextInput.styled.js} +4 -194
- package/build/inputs/CompactTextInput/CompactTextInput.styled.js.map +1 -0
- package/build/inputs/CompactTextInput/index.js +2 -19
- package/build/inputs/CompactTextInput/index.js.map +1 -0
- package/build/inputs/MultiLevelCheckbox/MultiLevelCheckbox.js +207 -0
- package/build/inputs/MultiLevelCheckbox/MultiLevelCheckbox.js.map +1 -0
- package/build/inputs/MultiLevelCheckbox/MultiLevelCheckbox.styled.js +66 -0
- package/build/inputs/MultiLevelCheckbox/MultiLevelCheckbox.styled.js.map +1 -0
- package/build/inputs/MultiLevelCheckbox/index.js +3 -0
- package/build/inputs/MultiLevelCheckbox/index.js.map +1 -0
- package/build/inputs/MultiLevelCheckbox/types.js +27 -0
- package/build/inputs/MultiLevelCheckbox/types.js.map +1 -0
- package/build/inputs/MultiLevelCheckboxSelect/MultiLevelCheckboxSelect.js +184 -26
- package/build/inputs/MultiLevelCheckboxSelect/MultiLevelCheckboxSelect.js.map +1 -0
- package/build/inputs/MultiLevelCheckboxSelect/MultiLevelCheckboxSelect.styled.js +93 -0
- package/build/inputs/MultiLevelCheckboxSelect/MultiLevelCheckboxSelect.styled.js.map +1 -0
- package/build/inputs/MultiLevelCheckboxSelect/index.js +2 -0
- package/build/inputs/MultiLevelCheckboxSelect/index.js.map +1 -0
- package/build/{MultiSelect-9f497e62.js → inputs/MultiSelect/MultiSelect.js} +6 -223
- package/build/inputs/MultiSelect/MultiSelect.js.map +1 -0
- package/build/inputs/MultiSelect/MultiSelect.styled.js +224 -0
- package/build/inputs/MultiSelect/MultiSelect.styled.js.map +1 -0
- package/build/inputs/MultiSelect/index.js +2 -10
- package/build/inputs/MultiSelect/index.js.map +1 -0
- package/build/inputs/Radio/Radio.js +60 -0
- package/build/inputs/Radio/Radio.js.map +1 -0
- package/build/{Radio-73ca3ae2.js → inputs/Radio/Radio.styled.js} +4 -58
- package/build/inputs/Radio/Radio.styled.js.map +1 -0
- package/build/inputs/Radio/index.js +2 -7
- package/build/inputs/Radio/index.js.map +1 -0
- package/build/inputs/Switch/Switch.js +64 -0
- package/build/inputs/Switch/Switch.js.map +1 -0
- package/build/{Switch-ecf3122b.js → inputs/Switch/Switch.styled.js} +4 -62
- package/build/inputs/Switch/Switch.styled.js.map +1 -0
- package/build/inputs/Switch/index.js +2 -6
- package/build/inputs/Switch/index.js.map +1 -0
- package/build/inputs/TextArea/TextArea.js +178 -0
- package/build/inputs/TextArea/TextArea.js.map +1 -0
- package/build/{TextArea-1e5b9201.js → inputs/TextArea/TextArea.styled.js} +3 -175
- package/build/inputs/TextArea/TextArea.styled.js.map +1 -0
- package/build/inputs/TextArea/index.js +2 -20
- package/build/inputs/TextArea/index.js.map +1 -0
- package/build/inputs/TextInput/TextInput.js +139 -0
- package/build/inputs/TextInput/TextInput.js.map +1 -0
- package/build/{TextInput-fab35842.js → inputs/TextInput/TextInput.styled.js} +4 -137
- package/build/inputs/TextInput/TextInput.styled.js.map +1 -0
- package/build/inputs/TextInput/index.js +2 -9
- package/build/inputs/TextInput/index.js.map +1 -0
- package/build/inputs/index.js +15 -40
- package/build/inputs/index.js.map +1 -0
- package/build/{InputGroup-1294d190.js → layout/InputGroup/InputGroup.js} +5 -8
- package/build/layout/InputGroup/InputGroup.js.map +1 -0
- package/build/layout/InputGroup/InputGroup.styled.js +9 -0
- package/build/layout/InputGroup/InputGroup.styled.js.map +1 -0
- package/build/layout/SectionSeparator/SectionSeparator.js +23 -0
- package/build/layout/SectionSeparator/SectionSeparator.js.map +1 -0
- package/build/layout/SectionSeparator/SectionSeparator.styled.js +14 -0
- package/build/layout/SectionSeparator/SectionSeparator.styled.js.map +1 -0
- package/build/layout/SectionSeparator/index.js +2 -5
- package/build/layout/SectionSeparator/index.js.map +1 -0
- package/build/layout/index.js +3 -6
- package/build/layout/index.js.map +1 -0
- package/build/ssr/index.js +1 -0
- package/build/ssr/index.js.map +1 -0
- package/build/styles/utils/colors.scss.js +4 -0
- package/build/styles/utils/colors.scss.js.map +1 -0
- package/build/utils/dateTime.js +17 -0
- package/build/utils/dateTime.js.map +1 -0
- package/build/utils/defaultTheme.js +44 -0
- package/build/utils/defaultTheme.js.map +1 -0
- package/build/{AssetAction-98d76ce0.js → widgets/AssetAction/AssetAction.js} +6 -40
- package/build/widgets/AssetAction/AssetAction.js.map +1 -0
- package/build/widgets/AssetAction/AssetAction.styled.js +41 -0
- package/build/widgets/AssetAction/AssetAction.styled.js.map +1 -0
- package/build/widgets/AssetAction/index.js +2 -7
- package/build/widgets/AssetAction/index.js.map +1 -0
- package/build/{AssetActionsBase-9e4c0735.js → widgets/AssetActionsBase/AssetActionsBase.js} +6 -15
- package/build/widgets/AssetActionsBase/AssetActionsBase.js.map +1 -0
- package/build/widgets/AssetActionsBase/AssetActionsBase.styled.js +15 -0
- package/build/widgets/AssetActionsBase/AssetActionsBase.styled.js.map +1 -0
- package/build/widgets/AssetActionsBase/index.js +2 -8
- package/build/widgets/AssetActionsBase/index.js.map +1 -0
- package/build/widgets/AssetGallery/AssetGallery.js +99 -0
- package/build/widgets/AssetGallery/AssetGallery.js.map +1 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.js +385 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.js.map +1 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.styled.js +30 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryBase.styled.js.map +1 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.js +401 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.js.map +1 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.styled.js +329 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryCompactCard/AssetGalleryCompactCard.styled.js.map +1 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.js +409 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.js.map +1 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.styled.js +280 -0
- package/build/widgets/AssetGallery/AssetGalleryBase/AssetGalleryGridCard/AssetGalleryGridCard.styled.js.map +1 -0
- package/build/widgets/AssetGallery/asset.propType.js +54 -0
- package/build/widgets/AssetGallery/asset.propType.js.map +1 -0
- package/build/widgets/AssetGallery/index.js +2 -48
- package/build/widgets/AssetGallery/index.js.map +1 -0
- package/build/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.js +44 -0
- package/build/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.js.map +1 -0
- package/build/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.styled.js +77 -0
- package/build/widgets/AssetPreview/AssetPreviewTopBar/AssetPreviewTopBar.styled.js.map +1 -0
- package/build/widgets/AssetPreview/AssetPreviewTopBar/index.js +2 -6
- package/build/widgets/AssetPreview/AssetPreviewTopBar/index.js.map +1 -0
- package/build/{ContextMenu-0f7134e4.js → widgets/ContextMenu/ContextMenu.js} +5 -9
- package/build/widgets/ContextMenu/ContextMenu.js.map +1 -0
- package/build/widgets/ContextMenu/ContextMenu.styled.js +10 -0
- package/build/widgets/ContextMenu/ContextMenu.styled.js.map +1 -0
- package/build/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.js +44 -0
- package/build/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.js.map +1 -0
- package/build/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.styled.js +77 -0
- package/build/widgets/ContextMenu/ContextMenuItem/ContextMenuItem.styled.js.map +1 -0
- package/build/widgets/ContextMenu/ContextMenuItem/index.js +2 -5
- package/build/widgets/ContextMenu/ContextMenuItem/index.js.map +1 -0
- package/build/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.js +22 -0
- package/build/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.js.map +1 -0
- package/build/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.styled.js +21 -0
- package/build/widgets/ContextMenu/ContextMenuItemsGroup/ContextMenuItemsGroup.styled.js.map +1 -0
- package/build/widgets/ContextMenu/ContextMenuItemsGroup/index.js +2 -37
- package/build/widgets/ContextMenu/ContextMenuItemsGroup/index.js.map +1 -0
- package/build/widgets/ContextMenu/index.js +2 -5
- package/build/widgets/ContextMenu/index.js.map +1 -0
- package/build/widgets/InfoCard/InfoCard.js +40 -0
- package/build/widgets/InfoCard/InfoCard.js.map +1 -0
- package/build/{InfoCard-c98b6f5a.js → widgets/InfoCard/InfoCard.styled.js} +5 -38
- package/build/widgets/InfoCard/InfoCard.styled.js.map +1 -0
- package/build/widgets/InfoCard/index.js +2 -6
- package/build/widgets/InfoCard/index.js.map +1 -0
- package/build/{Instructions-bfd28cea.js → widgets/Instructions/Instructions.js} +8 -34
- package/build/widgets/Instructions/Instructions.js.map +1 -0
- package/build/widgets/Instructions/Instructions.styled.js +32 -0
- package/build/widgets/Instructions/Instructions.styled.js.map +1 -0
- package/build/widgets/Instructions/index.js +2 -28
- package/build/widgets/Instructions/index.js.map +1 -0
- package/build/widgets/ProgressBar/ProgressBar.js +72 -0
- package/build/widgets/ProgressBar/ProgressBar.js.map +1 -0
- package/build/{ProgressBar-bc4a4a7e.js → widgets/ProgressBar/ProgressBar.styled.js} +5 -70
- package/build/widgets/ProgressBar/ProgressBar.styled.js.map +1 -0
- package/build/widgets/ProgressBar/index.js +2 -6
- package/build/widgets/ProgressBar/index.js.map +1 -0
- package/build/widgets/SummaryCard/SummaryCard.js +92 -0
- package/build/widgets/SummaryCard/SummaryCard.js.map +1 -0
- package/build/widgets/SummaryCard/SummaryCard.styled.js +137 -0
- package/build/widgets/SummaryCard/SummaryCard.styled.js.map +1 -0
- package/build/widgets/SummaryCard/index.js +2 -19
- package/build/widgets/SummaryCard/index.js.map +1 -0
- package/build/widgets/index.js +12 -53
- package/build/widgets/index.js.map +1 -0
- package/package.json +5 -2
- package/build/AssetGallery-63f721ec.js +0 -1981
- package/build/AssetPreviewTopBar-acd6353d.js +0 -127
- package/build/Checkbox-4a5fd716.js +0 -213
- package/build/CompactStarRating-9af2f427.js +0 -411
- package/build/ContextMenuItem-ea411141.js +0 -127
- package/build/MultiLevelCheckboxSelect-d8044c88.js +0 -604
- package/build/SectionSeparator-f47760a2.js +0 -31
- package/build/SummaryCard-24040650.js +0 -223
- package/build/VerificationStatusIcon-49cb1c1b.js +0 -95
- package/build/defaultTheme-1bcc2541.js +0 -1178
- package/build/layout/InputGroup/index.js +0 -5
- package/build/shift-away-subtle-0dd94a03.js +0 -7
|
@@ -0,0 +1,217 @@
|
|
|
1
|
+
import styled, { keyframes, css } from 'styled-components';
|
|
2
|
+
import { applyDefaultTheme } from '../../utils/defaultTheme.js';
|
|
3
|
+
|
|
4
|
+
const fadeIn = keyframes`
|
|
5
|
+
from {
|
|
6
|
+
background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)')};
|
|
7
|
+
}
|
|
8
|
+
to {
|
|
9
|
+
background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)')};
|
|
10
|
+
}
|
|
11
|
+
`;
|
|
12
|
+
const fadeOut = keyframes`
|
|
13
|
+
from {
|
|
14
|
+
background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)')};
|
|
15
|
+
}
|
|
16
|
+
to {
|
|
17
|
+
background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)')};
|
|
18
|
+
}
|
|
19
|
+
`;
|
|
20
|
+
const fadeInCheck = keyframes`
|
|
21
|
+
from {
|
|
22
|
+
opacity: 0
|
|
23
|
+
}
|
|
24
|
+
to {
|
|
25
|
+
opacity: 1
|
|
26
|
+
}
|
|
27
|
+
`;
|
|
28
|
+
const fadeOutCheck = keyframes`
|
|
29
|
+
from {
|
|
30
|
+
opacity: 1
|
|
31
|
+
}
|
|
32
|
+
to {
|
|
33
|
+
opacity: 0
|
|
34
|
+
}
|
|
35
|
+
`;
|
|
36
|
+
const CompactStarRating = styled.div.attrs(applyDefaultTheme)`
|
|
37
|
+
font-family: ${props => props.theme.primaryFontFamily};
|
|
38
|
+
font-size: 1rem;
|
|
39
|
+
font-weight: 500;
|
|
40
|
+
height: 24px;
|
|
41
|
+
width: 100%;
|
|
42
|
+
display: flex;
|
|
43
|
+
|
|
44
|
+
align-items: center;
|
|
45
|
+
input[type='number'] {
|
|
46
|
+
position: absolute;
|
|
47
|
+
opacity: 0;
|
|
48
|
+
pointer-events: none;
|
|
49
|
+
margin: 0;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
${props => props.readOnly && css`
|
|
53
|
+
pointer-events: none;
|
|
54
|
+
`}
|
|
55
|
+
|
|
56
|
+
${props => props.disabled && css`
|
|
57
|
+
opacity: 0.5;
|
|
58
|
+
cursor: not-allowed;
|
|
59
|
+
`}
|
|
60
|
+
`;
|
|
61
|
+
const labelWidth = styled.div.attrs(applyDefaultTheme)`
|
|
62
|
+
width: 33.33%;
|
|
63
|
+
display: flex;
|
|
64
|
+
align-items: center;
|
|
65
|
+
text-align: left;
|
|
66
|
+
font: normal normal normal 14px/16px Roboto;
|
|
67
|
+
letter-spacing: 0px;
|
|
68
|
+
padding: 0;
|
|
69
|
+
height: 19px;
|
|
70
|
+
cursor: default;
|
|
71
|
+
justify-content: space-between;
|
|
72
|
+
${props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'))};
|
|
73
|
+
${props => props.disabled && css`
|
|
74
|
+
cursor: not-allowed;
|
|
75
|
+
`}
|
|
76
|
+
`;
|
|
77
|
+
const SuccessContainer = styled.div.attrs(applyDefaultTheme)`
|
|
78
|
+
opacity: 1;
|
|
79
|
+
pointer-events: none;
|
|
80
|
+
display: flex;
|
|
81
|
+
opacity: ${props => props.fadeIn ? 0 : 1};
|
|
82
|
+
animation: ${props => props.fadeIn ? fadeOutCheck : fadeInCheck} 0.5s ease-in-out;
|
|
83
|
+
transition: opacity 0.5s ease-in-out;
|
|
84
|
+
margin-right: 5px;
|
|
85
|
+
${props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-500'))}
|
|
86
|
+
> svg {
|
|
87
|
+
width: 13px;
|
|
88
|
+
}
|
|
89
|
+
`;
|
|
90
|
+
const starsWidth = styled.div.attrs(applyDefaultTheme)`
|
|
91
|
+
display: flex;
|
|
92
|
+
width: 66.66%;
|
|
93
|
+
border-radius: 3px;
|
|
94
|
+
height: 24px;
|
|
95
|
+
align-items: center;
|
|
96
|
+
padding-left: 8px;
|
|
97
|
+
box-sizing: border-box;
|
|
98
|
+
border: 1px solid;
|
|
99
|
+
|
|
100
|
+
${props => props.readOnly && css`
|
|
101
|
+
border: none;
|
|
102
|
+
`}
|
|
103
|
+
|
|
104
|
+
${props => props.theme.themeProp('border-color', props.theme.getColor('gray-900'), props.theme.getColor('white'))}
|
|
105
|
+
|
|
106
|
+
${props => props.type === 'success' && css`
|
|
107
|
+
animation: ${props => props.success ? fadeIn : fadeOut} 0.5s ease-in-out;
|
|
108
|
+
`}
|
|
109
|
+
|
|
110
|
+
${props => props.type === 'error' && css`
|
|
111
|
+
${props.theme.themeProp('background', '#7F1B1B', '#FBEAE6')};
|
|
112
|
+
${props.theme.themeProp('border-color', '#7f1b1b', '#FBEAE6')}
|
|
113
|
+
`}
|
|
114
|
+
|
|
115
|
+
${props => props.type === 'warning' && css`
|
|
116
|
+
${props.theme.themeProp('background', '#634E01', '#FFFDE8')};
|
|
117
|
+
${props.theme.themeProp('border-color', '#2F2402 ', '#FFFDE8')}
|
|
118
|
+
`}
|
|
119
|
+
&&:not(:hover):not(:focus) {
|
|
120
|
+
${props => props.edit && props.theme.themeProp('background', 'rgba(39,39,42, 0.7)', 'rgba(244,244,245, 0.3)')};
|
|
121
|
+
${props => props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)')};
|
|
122
|
+
}
|
|
123
|
+
&&:hover:not(:focus) {
|
|
124
|
+
${props => props.edit && props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'))}
|
|
125
|
+
|
|
126
|
+
${props => props.edit && props.theme.themeProp('border-color', props.theme.getColor('gray-700'), props.theme.getColor('gray-100'))};
|
|
127
|
+
|
|
128
|
+
${props => props.type === 'warning' && !props.readOnly && props.theme.themeProp('background', '#806403', '#FFFEBF')};
|
|
129
|
+
|
|
130
|
+
${props => props.type === 'error' && !props.readOnly && props.theme.themeProp('background', '#901d1d', '#f7d5d0')};
|
|
131
|
+
}
|
|
132
|
+
`;
|
|
133
|
+
const Star = styled.button.attrs(applyDefaultTheme)`
|
|
134
|
+
display: flex;
|
|
135
|
+
align-items: center;
|
|
136
|
+
background: none;
|
|
137
|
+
border: none;
|
|
138
|
+
cursor: pointer;
|
|
139
|
+
padding: 0;
|
|
140
|
+
|
|
141
|
+
svg {
|
|
142
|
+
height: 12px;
|
|
143
|
+
padding-left: 4px;
|
|
144
|
+
transition: color 250ms;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
${props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};
|
|
148
|
+
|
|
149
|
+
${props => props.type === 'warning' && props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};
|
|
150
|
+
|
|
151
|
+
${props => props.type === 'warning' && props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};
|
|
152
|
+
|
|
153
|
+
${props => props.hover && props.theme.themeProp('color', props.theme.getColor('orange-500'), props.theme.getColor('orange-500'))};
|
|
154
|
+
|
|
155
|
+
${props => props.readOnly && css`
|
|
156
|
+
pointer-events: none;
|
|
157
|
+
`}
|
|
158
|
+
|
|
159
|
+
${props => props.disabled && css`
|
|
160
|
+
button {
|
|
161
|
+
cursor: not-allowed;
|
|
162
|
+
}
|
|
163
|
+
> * {
|
|
164
|
+
cursor: not-allowed;
|
|
165
|
+
}
|
|
166
|
+
`}
|
|
167
|
+
`;
|
|
168
|
+
const StarFill = styled.button.attrs(applyDefaultTheme)`
|
|
169
|
+
display: flex;
|
|
170
|
+
align-items: center;
|
|
171
|
+
background: none;
|
|
172
|
+
border: none;
|
|
173
|
+
cursor: pointer;
|
|
174
|
+
padding: 0;
|
|
175
|
+
|
|
176
|
+
svg {
|
|
177
|
+
height: 12px;
|
|
178
|
+
padding-left: 4px;
|
|
179
|
+
transition: color 250ms;
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
${props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};
|
|
183
|
+
|
|
184
|
+
${props => props.type === 'error' && props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};
|
|
185
|
+
|
|
186
|
+
${props => props.type === 'warning' && props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};
|
|
187
|
+
|
|
188
|
+
${props => props.hover && props.theme.themeProp('color', props.theme.getColor('orange-500'), props.theme.getColor('orange-500'))};
|
|
189
|
+
|
|
190
|
+
${props => props.readOnly && css`
|
|
191
|
+
pointer-events: none;
|
|
192
|
+
`}
|
|
193
|
+
|
|
194
|
+
${props => props.disabled && css`
|
|
195
|
+
button {
|
|
196
|
+
cursor: not-allowed;
|
|
197
|
+
}
|
|
198
|
+
> * {
|
|
199
|
+
cursor: not-allowed;
|
|
200
|
+
}
|
|
201
|
+
`}
|
|
202
|
+
`;
|
|
203
|
+
styled.div.attrs(applyDefaultTheme)`
|
|
204
|
+
opacity: 1;
|
|
205
|
+
pointer-events: none;
|
|
206
|
+
margin-left: auto;
|
|
207
|
+
opacity: ${props => props.type === 'success' ? 0 : 1};
|
|
208
|
+
animation: ${props => props.type === 'success' ? fadeOutCheck : fadeInCheck} 0.5s ease-in-out;
|
|
209
|
+
transition: opacity 0.5s ease-in-out;
|
|
210
|
+
${props => props.theme.themeProp('color', props.theme.getColor('emerald-200'), props.theme.getColor('emerald-500'))}
|
|
211
|
+
> svg {
|
|
212
|
+
width: 13px;
|
|
213
|
+
}
|
|
214
|
+
`;
|
|
215
|
+
|
|
216
|
+
export { CompactStarRating, Star, StarFill, SuccessContainer, labelWidth, starsWidth };
|
|
217
|
+
//# sourceMappingURL=CompactStarRating.styled.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CompactStarRating.styled.js","sources":["../../../src/components/inputs/CompactStarRating/CompactStarRating.styled.js"],"sourcesContent":["import styled, { css, keyframes } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nconst fadeIn = keyframes`\n from {\n background-color: ${props =>\n props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)')};\n }\n to {\n background-color: ${props =>\n props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)')};\n }\n`;\n\nconst fadeOut = keyframes`\n from {\n background-color: ${props =>\n props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)')};\n }\n to {\n background-color: ${props =>\n props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)')};\n }\n`;\n\nconst fadeInCheck = keyframes`\n from {\n opacity: 0\n }\n to {\n opacity: 1\n }\n`;\n\nconst fadeOutCheck = keyframes`\n from {\n opacity: 1\n }\n to {\n opacity: 0\n }\n`;\n\nexport const CompactStarRating = styled.div.attrs(applyDefaultTheme)`\n font-family: ${props => props.theme.primaryFontFamily};\n font-size: 1rem;\n font-weight: 500;\n height: 24px;\n width: 100%;\n display: flex;\n\n align-items: center;\n input[type='number'] {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n margin: 0;\n }\n\n ${props =>\n props.readOnly &&\n css`\n pointer-events: none;\n `}\n\n ${props =>\n props.disabled &&\n css`\n opacity: 0.5;\n cursor: not-allowed;\n `}\n`;\n\nexport const labelWidth = styled.div.attrs(applyDefaultTheme)`\n width: 33.33%;\n display: flex;\n align-items: center;\n text-align: left;\n font: normal normal normal 14px/16px Roboto;\n letter-spacing: 0px;\n padding: 0;\n height: 19px;\n cursor: default;\n justify-content: space-between;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('white'),\n props.theme.getColor('gray-700')\n )};\n ${props =>\n props.disabled &&\n css`\n cursor: not-allowed;\n `}\n`;\n\nexport const SuccessContainer = styled.div.attrs(applyDefaultTheme)`\n opacity: 1;\n pointer-events: none;\n display: flex;\n opacity: ${props => (props.fadeIn ? 0 : 1)};\n animation: ${props => (props.fadeIn ? fadeOutCheck : fadeInCheck)} 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n margin-right: 5px;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('gray-300'),\n props.theme.getColor('gray-500')\n )}\n > svg {\n width: 13px;\n }\n`;\n\nexport const starsWidth = styled.div.attrs(applyDefaultTheme)`\n display: flex;\n width: 66.66%;\n border-radius: 3px;\n height: 24px;\n align-items: center;\n padding-left: 8px;\n box-sizing: border-box;\n border: 1px solid;\n\n ${props =>\n props.readOnly &&\n css`\n border: none;\n `}\n\n ${props =>\n props.theme.themeProp(\n 'border-color',\n props.theme.getColor('gray-900'),\n props.theme.getColor('white')\n )}\n\n ${props =>\n props.type === 'success' &&\n css`\n animation: ${props => (props.success ? fadeIn : fadeOut)} 0.5s ease-in-out;\n `}\n\n ${props =>\n props.type === 'error' &&\n css`\n ${props.theme.themeProp('background', '#7F1B1B', '#FBEAE6')};\n ${props.theme.themeProp('border-color', '#7f1b1b', '#FBEAE6')}\n `}\n\n ${props =>\n props.type === 'warning' &&\n css`\n ${props.theme.themeProp('background', '#634E01', '#FFFDE8')};\n ${props.theme.themeProp('border-color', '#2F2402 ', '#FFFDE8')}\n `}\n &&:not(:hover):not(:focus) {\n ${props =>\n props.edit &&\n props.theme.themeProp('background', 'rgba(39,39,42, 0.7)', 'rgba(244,244,245, 0.3)')};\n ${props =>\n props.edit &&\n props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)')};\n }\n &&:hover:not(:focus) {\n ${props =>\n props.edit &&\n props.theme.themeProp(\n 'background',\n props.theme.getColor('gray-700'),\n props.theme.getColor('gray-100')\n )}\n\n ${props =>\n props.edit &&\n props.theme.themeProp(\n 'border-color',\n props.theme.getColor('gray-700'),\n props.theme.getColor('gray-100')\n )};\n\n ${props =>\n props.type === 'warning' &&\n !props.readOnly &&\n props.theme.themeProp('background', '#806403', '#FFFEBF')};\n\n ${props =>\n props.type === 'error' &&\n !props.readOnly &&\n props.theme.themeProp('background', '#901d1d', '#f7d5d0')};\n }\n`;\n\nexport const Star = styled.button.attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n\n svg {\n height: 12px;\n padding-left: 4px;\n transition: color 250ms;\n }\n\n ${props =>\n props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};\n\n ${props =>\n props.type === 'warning' &&\n props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};\n\n ${props =>\n props.type === 'warning' &&\n props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};\n\n ${props =>\n props.hover &&\n props.theme.themeProp(\n 'color',\n props.theme.getColor('orange-500'),\n props.theme.getColor('orange-500')\n )};\n\n ${props =>\n props.readOnly &&\n css`\n pointer-events: none;\n `}\n\n ${props =>\n props.disabled &&\n css`\n button {\n cursor: not-allowed;\n }\n > * {\n cursor: not-allowed;\n }\n `}\n`;\n\nexport const StarFill = styled.button.attrs(applyDefaultTheme)`\n display: flex;\n align-items: center;\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n\n svg {\n height: 12px;\n padding-left: 4px;\n transition: color 250ms;\n }\n\n ${props =>\n props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};\n\n ${props =>\n props.type === 'error' &&\n props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};\n\n ${props =>\n props.type === 'warning' &&\n props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('black'))};\n\n ${props =>\n props.hover &&\n props.theme.themeProp(\n 'color',\n props.theme.getColor('orange-500'),\n props.theme.getColor('orange-500')\n )};\n\n ${props =>\n props.readOnly &&\n css`\n pointer-events: none;\n `}\n\n ${props =>\n props.disabled &&\n css`\n button {\n cursor: not-allowed;\n }\n > * {\n cursor: not-allowed;\n }\n `}\n`;\n\nexport const CheckIconContainer = styled.div.attrs(applyDefaultTheme)`\n opacity: 1;\n pointer-events: none;\n margin-left: auto;\n opacity: ${props => (props.type === 'success' ? 0 : 1)};\n animation: ${props => (props.type === 'success' ? fadeOutCheck : fadeInCheck)} 0.5s ease-in-out;\n transition: opacity 0.5s ease-in-out;\n ${props =>\n props.theme.themeProp(\n 'color',\n props.theme.getColor('emerald-200'),\n props.theme.getColor('emerald-500')\n )}\n > svg {\n width: 13px;\n }\n`;\n"],"names":["fadeIn","keyframes","props","theme","themeProp","fadeOut","fadeInCheck","fadeOutCheck","CompactStarRating","styled","div","attrs","applyDefaultTheme","primaryFontFamily","readOnly","css","disabled","labelWidth","getColor","SuccessContainer","starsWidth","type","success","edit","Star","button","hover","StarFill"],"mappings":"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"}
|
|
@@ -1,17 +1,2 @@
|
|
|
1
|
-
export {
|
|
2
|
-
|
|
3
|
-
import '../../defaultTheme-1bcc2541.js';
|
|
4
|
-
import 'styled-components';
|
|
5
|
-
import 'react';
|
|
6
|
-
import '../../Alert-e6847a22.js';
|
|
7
|
-
import 'lodash';
|
|
8
|
-
import '../../Badge-d93586a9.js';
|
|
9
|
-
import '../../Popover-20050b91.js';
|
|
10
|
-
import 'polished';
|
|
11
|
-
import '@tippyjs/react';
|
|
12
|
-
import '../../shift-away-subtle-0dd94a03.js';
|
|
13
|
-
import 'popper-max-size-modifier';
|
|
14
|
-
import '../../Tab-04d435c3.js';
|
|
15
|
-
import '../../Tabs-74d1ea8a.js';
|
|
16
|
-
import '../../Tooltip-c1d1199e.js';
|
|
17
|
-
import '../../VerificationStatusIcon-49cb1c1b.js';
|
|
1
|
+
export { default } from './CompactStarRating.js';
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -0,0 +1,184 @@
|
|
|
1
|
+
import { isFunction, isEmpty } from 'lodash';
|
|
2
|
+
import { nanoid } from 'nanoid';
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
import React__default, { useState, useMemo, useEffect, useCallback } from 'react';
|
|
5
|
+
import { ReactComponent as SvgEditNote } from '../../icons/edit-note.svg.js';
|
|
6
|
+
import { ReactComponent as SvgLink } from '../../icons/link.svg.js';
|
|
7
|
+
import '../../data/Alert/Alert.js';
|
|
8
|
+
import '../../data/Badge/Badge.js';
|
|
9
|
+
import Popover from '../../data/Popover/Popover.js';
|
|
10
|
+
import '../../data/Tab/Tab.js';
|
|
11
|
+
import '../../data/Tabs/Tabs.js';
|
|
12
|
+
import Tooltip from '../../data/Tooltip/Tooltip.js';
|
|
13
|
+
import '../../data/VerificationStatusIcon/VerificationStatusIcon.js';
|
|
14
|
+
import { CompactTextInput as CompactTextInput$1, Label, SuccessContainer, InputContainer, LinkPopoverContainer, StyledLink, ReadOnlyLinkContainer, InputIconContainer, InputSuccessContainer, Input } from './CompactTextInput.styled.js';
|
|
15
|
+
|
|
16
|
+
const CompactTextInput = React__default.forwardRef(function CompactTextInput({
|
|
17
|
+
label,
|
|
18
|
+
inputType,
|
|
19
|
+
name,
|
|
20
|
+
defaultValue,
|
|
21
|
+
value,
|
|
22
|
+
placeholder,
|
|
23
|
+
link,
|
|
24
|
+
linkTarget,
|
|
25
|
+
linkHandler,
|
|
26
|
+
activeLinkHandler,
|
|
27
|
+
autoSelect,
|
|
28
|
+
readOnly,
|
|
29
|
+
disabled,
|
|
30
|
+
edit,
|
|
31
|
+
type,
|
|
32
|
+
descriptionToolTip,
|
|
33
|
+
bold,
|
|
34
|
+
hidden,
|
|
35
|
+
onChange: onChangeProp,
|
|
36
|
+
onFocus: onFocusProp,
|
|
37
|
+
onBlur: onBlurProp,
|
|
38
|
+
loadingIcon,
|
|
39
|
+
successIcon,
|
|
40
|
+
...props
|
|
41
|
+
}, forwardedRef) {
|
|
42
|
+
const [uniqueId] = useState(nanoid());
|
|
43
|
+
const [currentValue, setCurrentValue] = useState();
|
|
44
|
+
const [autoFocus, setAutoFocus] = useState(false);
|
|
45
|
+
const memoizedDescriptionToolTip = useMemo(() => {
|
|
46
|
+
return descriptionToolTip;
|
|
47
|
+
}, [descriptionToolTip]);
|
|
48
|
+
useEffect(() => {
|
|
49
|
+
setCurrentValue(value || defaultValue);
|
|
50
|
+
setAutoFocus(false);
|
|
51
|
+
}, [value, defaultValue]);
|
|
52
|
+
const onChange = useCallback(event => {
|
|
53
|
+
setCurrentValue(event.target.value);
|
|
54
|
+
if (!autoFocus) {
|
|
55
|
+
setAutoFocus(true);
|
|
56
|
+
}
|
|
57
|
+
if (isFunction(onChangeProp)) {
|
|
58
|
+
onChangeProp(event);
|
|
59
|
+
}
|
|
60
|
+
}, [onChangeProp]);
|
|
61
|
+
const onFocus = useCallback(event => {
|
|
62
|
+
if (autoSelect) {
|
|
63
|
+
event.target.select();
|
|
64
|
+
}
|
|
65
|
+
if (isFunction(onFocusProp)) {
|
|
66
|
+
onFocusProp(event);
|
|
67
|
+
}
|
|
68
|
+
}, [autoSelect, readOnly, onFocusProp]);
|
|
69
|
+
const onBlur = useCallback(event => {
|
|
70
|
+
if (isFunction(onBlurProp)) {
|
|
71
|
+
onBlurProp(event);
|
|
72
|
+
}
|
|
73
|
+
}, [onBlurProp]);
|
|
74
|
+
const input = () => {
|
|
75
|
+
return React__default.createElement(Input, {
|
|
76
|
+
ref: forwardedRef,
|
|
77
|
+
id: uniqueId,
|
|
78
|
+
key: uniqueId,
|
|
79
|
+
autoFocus: autoFocus,
|
|
80
|
+
inputType: inputType,
|
|
81
|
+
name: name,
|
|
82
|
+
readOnly: readOnly,
|
|
83
|
+
disabled: disabled,
|
|
84
|
+
edit: edit,
|
|
85
|
+
placeholder: placeholder,
|
|
86
|
+
defaultValue: defaultValue,
|
|
87
|
+
value: value,
|
|
88
|
+
type: type,
|
|
89
|
+
bold: bold,
|
|
90
|
+
hasLink: !isEmpty(link),
|
|
91
|
+
onFocus: onFocus,
|
|
92
|
+
onChange: onChange,
|
|
93
|
+
onBlur: onBlur
|
|
94
|
+
});
|
|
95
|
+
};
|
|
96
|
+
if (hidden) return null;
|
|
97
|
+
return React__default.createElement(CompactTextInput$1, props, label && React__default.createElement(Label, {
|
|
98
|
+
htmlFor: uniqueId,
|
|
99
|
+
disabled: disabled
|
|
100
|
+
}, label, React__default.createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), React__default.createElement(InputContainer, {
|
|
101
|
+
$hasLabel: !isEmpty(label)
|
|
102
|
+
}, !memoizedDescriptionToolTip && !link && React__default.createElement("div", null, input()), memoizedDescriptionToolTip && !link && React__default.createElement("div", null, React__default.createElement(Tooltip, {
|
|
103
|
+
content: memoizedDescriptionToolTip,
|
|
104
|
+
key: "tooltip1",
|
|
105
|
+
placement: "bottom-end",
|
|
106
|
+
trigger: 'mouseenter',
|
|
107
|
+
zIndex: 999999
|
|
108
|
+
}, input())), link && !readOnly && React__default.createElement("div", null, React__default.createElement(Popover, {
|
|
109
|
+
arrow: false,
|
|
110
|
+
content: React__default.createElement(LinkPopoverContainer, null, activeLinkHandler ? React__default.createElement(StyledLink, {
|
|
111
|
+
href: link,
|
|
112
|
+
target: linkTarget,
|
|
113
|
+
onClick: e => {
|
|
114
|
+
if (activeLinkHandler) {
|
|
115
|
+
e.preventDefault();
|
|
116
|
+
linkHandler();
|
|
117
|
+
}
|
|
118
|
+
},
|
|
119
|
+
rel: "noreferrer"
|
|
120
|
+
}, React__default.createElement(SvgLink, null), currentValue) : React__default.createElement(StyledLink, {
|
|
121
|
+
href: link,
|
|
122
|
+
target: linkTarget,
|
|
123
|
+
rel: "noreferrer"
|
|
124
|
+
}, React__default.createElement(SvgLink, null), currentValue)),
|
|
125
|
+
key: "tooltip2",
|
|
126
|
+
placement: "bottom-start",
|
|
127
|
+
trigger: "focusin",
|
|
128
|
+
zIndex: 999999,
|
|
129
|
+
interactive: true
|
|
130
|
+
}, input())), link && readOnly && React__default.createElement(ReadOnlyLinkContainer, null, React__default.createElement(StyledLink, {
|
|
131
|
+
href: link,
|
|
132
|
+
rel: "noreferrer",
|
|
133
|
+
style: {
|
|
134
|
+
display: 'inline-block'
|
|
135
|
+
},
|
|
136
|
+
target: linkTarget
|
|
137
|
+
}, currentValue)), !readOnly && !disabled && React__default.createElement(React__default.Fragment, null, React__default.createElement(InputIconContainer, {
|
|
138
|
+
type: type
|
|
139
|
+
}, React__default.createElement(SvgEditNote, null)), isEmpty(label) && React__default.createElement(InputSuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon))));
|
|
140
|
+
});
|
|
141
|
+
CompactTextInput.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
142
|
+
label: PropTypes.string,
|
|
143
|
+
success: PropTypes.bool,
|
|
144
|
+
inputType: PropTypes.string,
|
|
145
|
+
name: PropTypes.string,
|
|
146
|
+
defaultValue: PropTypes.string,
|
|
147
|
+
value: PropTypes.string,
|
|
148
|
+
placeholder: PropTypes.string,
|
|
149
|
+
link: PropTypes.string,
|
|
150
|
+
linkTarget: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),
|
|
151
|
+
linkHandler: PropTypes.func,
|
|
152
|
+
activeLinkHandler: PropTypes.bool,
|
|
153
|
+
autoSelect: PropTypes.bool,
|
|
154
|
+
readOnly: PropTypes.bool,
|
|
155
|
+
disabled: PropTypes.bool,
|
|
156
|
+
edit: PropTypes.bool,
|
|
157
|
+
warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
|
|
158
|
+
bold: PropTypes.bool,
|
|
159
|
+
hidden: PropTypes.bool,
|
|
160
|
+
onChange: PropTypes.func,
|
|
161
|
+
onFocus: PropTypes.func,
|
|
162
|
+
onBlur: PropTypes.func,
|
|
163
|
+
type: PropTypes.oneOf(['', 'error', 'warning', 'loading', 'success']),
|
|
164
|
+
descriptionToolTip: PropTypes.string,
|
|
165
|
+
loadingIcon: PropTypes.element,
|
|
166
|
+
successIcon: PropTypes.element
|
|
167
|
+
} : {};
|
|
168
|
+
CompactTextInput.defaultProps = {
|
|
169
|
+
inputType: 'text',
|
|
170
|
+
autoSelect: true,
|
|
171
|
+
linkTarget: '_self',
|
|
172
|
+
bold: false,
|
|
173
|
+
readOnly: false,
|
|
174
|
+
descriptionToolTip: '',
|
|
175
|
+
edit: false,
|
|
176
|
+
hidden: false,
|
|
177
|
+
type: '',
|
|
178
|
+
linkHandler: () => {},
|
|
179
|
+
activeLinkHandler: false,
|
|
180
|
+
onChange: () => {}
|
|
181
|
+
};
|
|
182
|
+
|
|
183
|
+
export { CompactTextInput as default };
|
|
184
|
+
//# sourceMappingURL=CompactTextInput.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CompactTextInput.js","sources":["../../../src/components/inputs/CompactTextInput/CompactTextInput.js"],"sourcesContent":["import { isEmpty, isFunction } from 'lodash';\nimport { nanoid } from 'nanoid';\nimport PropTypes from 'prop-types';\nimport React, { useCallback, useState, useEffect, useMemo } from 'react';\nimport { ReactComponent as EditNoteIcon } from '../../../icons/edit-note.svg';\nimport { ReactComponent as LinkIcon } from '../../../icons/link.svg';\nimport { Tooltip, Popover } from '../../data';\nimport * as S from './CompactTextInput.styled';\n\n// const ConditionalWrapper = ({ condition, wrapper, children }) =>\n// condition ? wrapper(children) : children;\n\n/**\n * Compact text inputs let users enter and edit text in the UI in a compact way. They typically appear in forms or displays of metadata.\n *\n * ### Import\n *\n * ``` js\n * import { CompactTextInput } from '@ntbjs/react-components/inputs'\n * // or\n * import CompactTextInput from '@ntbjs/react-components/inputs/CompactTextInput'\n * ```\n */\nconst CompactTextInput = React.forwardRef(function CompactTextInput(\n {\n label,\n inputType,\n name,\n defaultValue,\n value,\n placeholder,\n link,\n linkTarget,\n linkHandler,\n activeLinkHandler,\n autoSelect,\n readOnly,\n disabled,\n edit,\n type,\n descriptionToolTip,\n bold,\n hidden,\n onChange: onChangeProp,\n onFocus: onFocusProp,\n onBlur: onBlurProp,\n loadingIcon,\n successIcon,\n ...props\n },\n forwardedRef\n) {\n const [uniqueId] = useState(nanoid());\n const [currentValue, setCurrentValue] = useState();\n const [autoFocus, setAutoFocus] = useState(false);\n\n const memoizedDescriptionToolTip = useMemo(() => {\n return descriptionToolTip;\n }, [descriptionToolTip]);\n\n useEffect(() => {\n setCurrentValue(value || defaultValue);\n setAutoFocus(false);\n }, [value, defaultValue]);\n\n const onChange = useCallback(\n event => {\n setCurrentValue(event.target.value);\n\n if (!autoFocus) {\n setAutoFocus(true);\n }\n if (isFunction(onChangeProp)) {\n onChangeProp(event);\n }\n },\n [onChangeProp]\n );\n\n const onFocus = useCallback(\n event => {\n if (autoSelect) {\n event.target.select();\n }\n\n if (isFunction(onFocusProp)) {\n onFocusProp(event);\n }\n },\n [autoSelect, readOnly, onFocusProp]\n );\n\n const onBlur = useCallback(\n event => {\n if (isFunction(onBlurProp)) {\n onBlurProp(event);\n }\n },\n [onBlurProp]\n );\n\n const input = () => {\n return (\n <S.Input\n ref={forwardedRef}\n id={uniqueId}\n key={uniqueId}\n autoFocus={autoFocus}\n inputType={inputType}\n name={name}\n readOnly={readOnly}\n disabled={disabled}\n edit={edit}\n placeholder={placeholder}\n defaultValue={defaultValue}\n value={value}\n type={type}\n bold={bold}\n hasLink={!isEmpty(link)}\n onFocus={onFocus}\n onChange={onChange}\n onBlur={onBlur}\n />\n );\n };\n\n if (hidden) return null;\n\n return (\n <S.CompactTextInput {...props}>\n {label && (\n <S.Label htmlFor={uniqueId} disabled={disabled}>\n {label}\n <S.SuccessContainer>\n {type === 'loading' && loadingIcon}\n {type === 'success' && successIcon}\n </S.SuccessContainer>\n </S.Label>\n )}\n <S.InputContainer $hasLabel={!isEmpty(label)}>\n {!memoizedDescriptionToolTip && !link && <div>{input()}</div>}\n {memoizedDescriptionToolTip && !link && (\n <div>\n <Tooltip\n content={memoizedDescriptionToolTip}\n key=\"tooltip1\"\n placement=\"bottom-end\"\n trigger={'mouseenter'}\n zIndex={999999}\n >\n {input()}\n </Tooltip>\n </div>\n )}\n {link && !readOnly && (\n <div>\n <Popover\n arrow={false}\n content={\n <S.LinkPopoverContainer>\n {activeLinkHandler ? (\n <S.StyledLink\n href={link}\n target={linkTarget}\n onClick={e => {\n if (activeLinkHandler) {\n e.preventDefault();\n linkHandler();\n } else null;\n }}\n rel=\"noreferrer\"\n >\n <LinkIcon />\n {currentValue}\n </S.StyledLink>\n ) : (\n <S.StyledLink href={link} target={linkTarget} rel=\"noreferrer\">\n <LinkIcon />\n {currentValue}\n </S.StyledLink>\n )}\n </S.LinkPopoverContainer>\n }\n key=\"tooltip2\"\n placement=\"bottom-start\"\n trigger=\"focusin\"\n zIndex={999999}\n interactive={true}\n >\n {input()}\n </Popover>\n </div>\n )}\n {link && readOnly && (\n <S.ReadOnlyLinkContainer>\n <S.StyledLink\n href={link}\n rel=\"noreferrer\"\n style={{ display: 'inline-block' }}\n target={linkTarget}\n >\n {currentValue}\n </S.StyledLink>\n </S.ReadOnlyLinkContainer>\n )}\n {!readOnly && !disabled && (\n <>\n <S.InputIconContainer type={type}>\n <EditNoteIcon />\n </S.InputIconContainer>\n {isEmpty(label) && (\n <S.InputSuccessContainer>\n {type === 'loading' && loadingIcon}\n {type === 'success' && successIcon}\n </S.InputSuccessContainer>\n )}\n </>\n )}\n </S.InputContainer>\n </S.CompactTextInput>\n );\n});\n\nCompactTextInput.propTypes = {\n /**\n * The label of the input field - leave `undefined` to hide the label\n */\n label: PropTypes.string,\n /**\n * Displays a light green background to show that an action was successful.\n */\n success: PropTypes.bool,\n /**\n * The input type - eg. `text`, `number`\n */\n inputType: PropTypes.string,\n /**\n * The input name\n */\n name: PropTypes.string,\n /**\n * The default value of the input - creates an uncontrolled input\n */\n defaultValue: PropTypes.string,\n /**\n * The value of the input - creates a controlled input\n */\n value: PropTypes.string,\n /**\n * The placeholder of the input\n */\n placeholder: PropTypes.string,\n /**\n * A URL associated with the input value. Creates a clickable link that accepts full or relative URL\n */\n link: PropTypes.string,\n /**\n * The target for the link. Only applies when the field is in read-only mode\n */\n linkTarget: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),\n /**\n * Whether the link has a onClick event.\n */\n linkHandler: PropTypes.func,\n /**\n * Whether the handler should preceed the link behavior.\n */\n activeLinkHandler: PropTypes.bool,\n /**\n * Whether to auto select the entire value when the input is focused – does also work when the field is in read-only mode\n */\n autoSelect: PropTypes.bool,\n /**\n * Whether the value is read only\n */\n readOnly: PropTypes.bool,\n /**\n * Whether the value is disabled\n */\n disabled: PropTypes.bool,\n /**\n * Displays a grey background to show that value is editable\n */\n edit: PropTypes.bool,\n /**\n * There is an error present - 'error be prioritized over warnings if both are set to 'true'.\n */\n // error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n /**\n * There is a warning present.\n */\n warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n /**\n * Whether to bold the input content - Slightly increases the font size and font weight of the input value\n */\n bold: PropTypes.bool,\n /**\n * Whether the component is hidden or visible.\n */\n hidden: PropTypes.bool,\n /**\n * Callback for `onChange`\n */\n onChange: PropTypes.func,\n /**\n * Callback for `onFocus`\n */\n onFocus: PropTypes.func,\n /**\n * Callback for `onBlur`\n */\n onBlur: PropTypes.func,\n /**\n * Define the type based on error, warning, loading and success.\n */\n type: PropTypes.oneOf(['', 'error', 'warning', 'loading', 'success']),\n /**\n * Description ToolTip text.\n */\n descriptionToolTip: PropTypes.string,\n /**\n * Icon element – E.g: `icon={<Spinner />}`\n */\n loadingIcon: PropTypes.element,\n /**\n * Icon element – E.g: `icon={<Check />}`\n */\n successIcon: PropTypes.element\n};\n\nCompactTextInput.defaultProps = {\n inputType: 'text',\n autoSelect: true,\n linkTarget: '_self',\n bold: false,\n readOnly: false,\n descriptionToolTip: '',\n edit: false,\n hidden: false,\n type: '',\n linkHandler: () => {},\n activeLinkHandler: false,\n onChange: () => {}\n};\n\nexport default CompactTextInput;\n"],"names":["CompactTextInput","React","forwardRef","label","inputType","name","defaultValue","value","placeholder","link","linkTarget","linkHandler","activeLinkHandler","autoSelect","readOnly","disabled","edit","type","descriptionToolTip","bold","hidden","onChange","onChangeProp","onFocus","onFocusProp","onBlur","onBlurProp","loadingIcon","successIcon","props","forwardedRef","uniqueId","useState","nanoid","currentValue","setCurrentValue","autoFocus","setAutoFocus","memoizedDescriptionToolTip","useMemo","useEffect","useCallback","event","target","isFunction","select","input","createElement","S","ref","id","key","hasLink","isEmpty","htmlFor","$hasLabel","Tooltip","content","placement","trigger","zIndex","Popover","arrow","href","onClick","e","preventDefault","rel","LinkIcon","interactive","style","display","Fragment","EditNoteIcon","propTypes","process","env","NODE_ENV","PropTypes","string","success","bool","oneOf","func","warning","oneOfType","element","defaultProps"],"mappings":"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"}
|