@pedidopago/ui 1.7.26 → 1.8.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/dist/components/Alert/alert.test.js +1 -85
- package/dist/components/Alert/index.js +1 -63
- package/dist/components/Alert/styles.js +1 -32
- package/dist/components/Avatar/avatar.test.js +1 -67
- package/dist/components/Avatar/index.js +1 -94
- package/dist/components/Avatar/styles.js +1 -51
- package/dist/components/Badge/badge.test.js +1 -71
- package/dist/components/Badge/index.js +2 -43
- package/dist/components/Badge/styles.js +1 -33
- package/dist/components/Button/Button.test.js +1 -154
- package/dist/components/Button/index.js +1 -87
- package/dist/components/Button/styles.js +1 -112
- package/dist/components/Card/card.test.js +1 -30
- package/dist/components/Card/index.js +1 -44
- package/dist/components/Card/styles.js +1 -16
- package/dist/components/CheckboxInput/checkbox-input.test.js +1 -170
- package/dist/components/CheckboxInput/components/MultipleCheckbox.js +1 -205
- package/dist/components/CheckboxInput/index.js +1 -94
- package/dist/components/CheckboxInput/styles.js +1 -34
- package/dist/components/ChoiceList/index.d.ts +6 -0
- package/dist/components/ChoiceList/index.d.ts.map +1 -0
- package/dist/components/ChoiceList/index.js +1 -0
- package/dist/components/ChoiceList/styles.d.ts +22 -0
- package/dist/components/ChoiceList/styles.d.ts.map +1 -0
- package/dist/components/ChoiceList/styles.js +1 -0
- package/dist/components/ChoiceList/types.d.ts +24 -0
- package/dist/components/ChoiceList/types.d.ts.map +1 -0
- package/dist/components/ChoiceList/types.js +1 -0
- package/dist/components/CollapseCard/ExpandButton/index.js +1 -40
- package/dist/components/CollapseCard/ExpandButton/styles.js +1 -16
- package/dist/components/CollapseCard/expand-button.test.js +1 -161
- package/dist/components/CollapseCard/index.js +1 -98
- package/dist/components/CollapseCard/styles.js +1 -26
- package/dist/components/ColorPicker/colorpicker.test.js +1 -64
- package/dist/components/ColorPicker/components/ColorHue.js +1 -44
- package/dist/components/ColorPicker/components/ColorInput.js +1 -63
- package/dist/components/ColorPicker/components/ColorPickerBox.js +1 -52
- package/dist/components/ColorPicker/components/ColorPointer.js +1 -25
- package/dist/components/ColorPicker/components/ColorSelector.js +1 -107
- package/dist/components/ColorPicker/hooks/useCachedCallback.js +1 -16
- package/dist/components/ColorPicker/hooks/useHsva.js +1 -53
- package/dist/components/ColorPicker/index.js +1 -93
- package/dist/components/ColorPicker/styles.js +1 -46
- package/dist/components/ColorPicker/utils/checkers.js +1 -55
- package/dist/components/ColorPicker/utils/conversors.js +2 -243
- package/dist/components/ColorPicker/utils/parsers.js +10 -108
- package/dist/components/ComposeIcon/index.js +2 -48
- package/dist/components/ComposeIcon/styles.js +1 -53
- package/dist/components/DateInput/DateInput-example.js +7 -45
- package/dist/components/DateInput/components/ModalWrapper/index.js +1 -35
- package/dist/components/DateInput/components/ModalWrapper/styles.js +1 -21
- package/dist/components/DateInput/dateInput.test.js +2 -43
- package/dist/components/DateInput/index.js +2 -104
- package/dist/components/DateInput/styles.js +1 -18
- package/dist/components/DatePicker/components/DatePickerContent.js +2 -222
- package/dist/components/DatePicker/components/DateYearPicker.js +1 -102
- package/dist/components/DatePicker/datepicker.test.js +1 -120
- package/dist/components/DatePicker/index.js +1 -236
- package/dist/components/DatePicker/styles.js +1 -88
- package/dist/components/DatePicker/utils/getMonthName.js +1 -11
- package/dist/components/Dialog/dialog-example.js +1 -46
- package/dist/components/Dialog/dialog.test.js +1 -68
- package/dist/components/Dialog/index.js +2 -100
- package/dist/components/Dialog/styles.js +1 -31
- package/dist/components/Dropzone/dropzone.test.js +1 -69
- package/dist/components/Dropzone/index.js +1 -289
- package/dist/components/Dropzone/styles.js +1 -75
- package/dist/components/Dropzone/utils/accepts.js +2 -27
- package/dist/components/EmojiPicker/Emote/index.js +2 -24
- package/dist/components/EmojiPicker/Emote/styles.js +1 -27
- package/dist/components/EmojiPicker/EmotePickerData/constants.js +1 -51
- package/dist/components/EmojiPicker/EmotePickerData/index.js +2 -159
- package/dist/components/EmojiPicker/EmotePickerData/styles.js +1 -57
- package/dist/components/EmojiPicker/EmotePickerData/utils.js +1 -41
- package/dist/components/EmojiPicker/Example/EmotePickerExample.js +1 -43
- package/dist/components/EmojiPicker/animation.js +1 -43
- package/dist/components/EmojiPicker/index.js +1 -169
- package/dist/components/EmojiPicker/styles.js +1 -21
- package/dist/components/Flex/flex.test.js +1 -336
- package/dist/components/Flex/index.js +1 -49
- package/dist/components/Flex/styles.js +1 -25
- package/dist/components/Grid/grid.test.js +1 -134
- package/dist/components/Grid/index.js +1 -51
- package/dist/components/Grid/styles.js +1 -48
- package/dist/components/Icon/data/beauty.js +2 -206
- package/dist/components/Icon/data/dash.js +2 -2
- package/dist/components/Icon/data/ecommerce.js +2 -94
- package/dist/components/Icon/data/form.js +2 -248
- package/dist/components/Icon/data/health.js +2 -255
- package/dist/components/Icon/data/illustrations.js +2 -318
- package/dist/components/Icon/data/men.js +2 -52
- package/dist/components/Icon/data/payment.js +2 -94
- package/dist/components/Icon/data/pedidoPago.js +2 -45
- package/dist/components/Icon/data/physicalPerfomance.js +2 -283
- package/dist/components/Icon/data/social.js +2 -24
- package/dist/components/Icon/data/status.js +2 -115
- package/dist/components/Icon/data/summer.js +2 -52
- package/dist/components/Icon/data/woman.js +2 -80
- package/dist/components/Icon/icon.test.js +1 -57
- package/dist/components/Icon/index.js +1 -53
- package/dist/components/Icon/scripts/build.js +9 -104
- package/dist/components/Icon/scripts/extractor.js +2 -33
- package/dist/components/Icon/scripts/run-build.js +2 -7
- package/dist/components/Icon/scripts/writers.js +3 -34
- package/dist/components/Icon/styles.js +1 -22
- package/dist/components/Icon/utils/allIcons.js +1 -28
- package/dist/components/Icon/utils/iconExists.js +1 -13
- package/dist/components/IconItem/IconItem.test.js +1 -58
- package/dist/components/IconItem/index.js +1 -52
- package/dist/components/IconItem/styles.js +1 -43
- package/dist/components/Illustration/illustration.test.js +4 -50
- package/dist/components/Illustration/index.js +2 -65
- package/dist/components/Illustration/styles.js +1 -65
- package/dist/components/ImageItem/imageFake.js +1 -25
- package/dist/components/ImageItem/index.js +2 -66
- package/dist/components/ImageItem/input.test.js +1 -85
- package/dist/components/ImageItem/styles.js +1 -61
- package/dist/components/Input/index.js +1 -163
- package/dist/components/Input/input.test.js +1 -120
- package/dist/components/Input/styles.js +1 -177
- package/dist/components/Label/index.js +1 -45
- package/dist/components/Label/label.test.js +1 -83
- package/dist/components/Label/styles.js +1 -21
- package/dist/components/List/index.js +1 -39
- package/dist/components/List/list.test.js +1 -64
- package/dist/components/List/styles.js +1 -23
- package/dist/components/Modal/ModalExample.js +1 -70
- package/dist/components/Modal/index.js +1 -145
- package/dist/components/Modal/modal.test.js +1 -179
- package/dist/components/Modal/styles.js +1 -33
- package/dist/components/MultipleSelect/MultipleSelect.test.js +1 -334
- package/dist/components/MultipleSelect/animations.js +1 -25
- package/dist/components/MultipleSelect/components/InputWrapper/index.js +1 -26
- package/dist/components/MultipleSelect/components/OptionsArea/index.js +1 -244
- package/dist/components/MultipleSelect/components/OptionsArea/styles.js +1 -68
- package/dist/components/MultipleSelect/components/SelectArea/ButtonsArea.js +1 -27
- package/dist/components/MultipleSelect/components/SelectArea/SelectAreaWrapper.js +1 -37
- package/dist/components/MultipleSelect/components/SelectArea/SelectedOptionsArea.js +1 -49
- package/dist/components/MultipleSelect/components/SelectArea/index.js +1 -100
- package/dist/components/MultipleSelect/components/SelectArea/styles.js +1 -36
- package/dist/components/MultipleSelect/components/index.js +1 -38
- package/dist/components/MultipleSelect/index.js +1 -209
- package/dist/components/NewSelect/Examples/constants.js +1 -56
- package/dist/components/NewSelect/Examples/index.js +1 -161
- package/dist/components/NewSelect/components/Chip/index.js +1 -36
- package/dist/components/NewSelect/components/Chip/styles.js +1 -24
- package/dist/components/NewSelect/components/OptionsSelect/styles.js +1 -21
- package/dist/components/NewSelect/components/SelectInputSearch/index.js +1 -24
- package/dist/components/NewSelect/components/SelectItem/index.js +1 -22
- package/dist/components/NewSelect/components/SelectItem/styles.js +1 -24
- package/dist/components/NewSelect/index.js +1 -18
- package/dist/components/NewSelect/multiple/index.js +1 -246
- package/dist/components/NewSelect/newSelect.test.js +1 -108
- package/dist/components/NewSelect/single/index.js +1 -183
- package/dist/components/NewSelect/styles.js +1 -44
- package/dist/components/Observer/index.js +1 -59
- package/dist/components/Observer/observer.test.js +2 -43
- package/dist/components/Pagination/hooks/usePagination.js +1 -57
- package/dist/components/Pagination/index.js +1 -174
- package/dist/components/Pagination/pagination.test.js +1 -118
- package/dist/components/Pagination/styles.js +1 -78
- package/dist/components/Progress/Circle/index.js +1 -102
- package/dist/components/Progress/Circle/styles.js +1 -69
- package/dist/components/Progress/Linear/index.js +1 -62
- package/dist/components/Progress/Linear/styles.js +1 -66
- package/dist/components/Progress/getSteps.js +1 -17
- package/dist/components/Progress/index.js +1 -39
- package/dist/components/Progress/progress.test.js +1 -109
- package/dist/components/Radio/components/RadioGroup/index.d.ts +5 -0
- package/dist/components/Radio/components/RadioGroup/index.d.ts.map +1 -0
- package/dist/components/Radio/components/RadioGroup/index.js +1 -0
- package/dist/components/Radio/components/RadioGroup/styles.d.ts +19 -0
- package/dist/components/Radio/components/RadioGroup/styles.d.ts.map +1 -0
- package/dist/components/Radio/components/RadioGroup/styles.js +1 -0
- package/dist/components/Radio/components/RadioGroup/types.d.ts +17 -0
- package/dist/components/Radio/components/RadioGroup/types.d.ts.map +1 -0
- package/dist/components/Radio/components/RadioGroup/types.js +1 -0
- package/dist/components/Radio/index.d.ts +5 -0
- package/dist/components/Radio/index.d.ts.map +1 -0
- package/dist/components/Radio/index.js +1 -0
- package/dist/components/Radio/styles.d.ts +10 -0
- package/dist/components/Radio/styles.d.ts.map +1 -0
- package/dist/components/Radio/styles.js +1 -0
- package/dist/components/Radio/types.d.ts +6 -0
- package/dist/components/Radio/types.d.ts.map +1 -0
- package/dist/components/Radio/types.js +1 -0
- package/dist/components/Rating/index.js +1 -133
- package/dist/components/Rating/rating.test.js +1 -63
- package/dist/components/Rating/styles.js +1 -27
- package/dist/components/ReactPortal/index.js +1 -43
- package/dist/components/ReactPortal/reactPortal.test.js +1 -21
- package/dist/components/ReactPortal/utils/createWrapperAndApprendToBody.js +1 -12
- package/dist/components/Select/components/OptionsSelect/index.js +1 -73
- package/dist/components/Select/components/OptionsSelect/styles.js +1 -21
- package/dist/components/Select/index.js +4 -247
- package/dist/components/Select/select.test.js +1 -58
- package/dist/components/Select/styles.js +1 -46
- package/dist/components/Skeleton/index.js +1 -28
- package/dist/components/Skeleton/skeleton.test.js +1 -90
- package/dist/components/Skeleton/styles.js +1 -27
- package/dist/components/Slider/SliderExample.js +1 -52
- package/dist/components/Slider/components/SliderPointer.js +1 -39
- package/dist/components/Slider/components/SliderRail.js +1 -116
- package/dist/components/Slider/components/SliderSelector.js +1 -173
- package/dist/components/Slider/hooks/useEventCallback.js +1 -16
- package/dist/components/Slider/index.js +1 -137
- package/dist/components/Slider/slider.test.js +1 -121
- package/dist/components/Slider/styles.js +1 -69
- package/dist/components/Spinner/index.js +1 -26
- package/dist/components/Spinner/spinner.test.js +1 -45
- package/dist/components/Spinner/styles.js +1 -23
- package/dist/components/Steps/components/StepIcon/index.js +1 -50
- package/dist/components/Steps/components/StepIcon/styles.js +1 -42
- package/dist/components/Steps/components/StepIcon/utils.js +1 -22
- package/dist/components/Steps/index.js +1 -116
- package/dist/components/Steps/steps.test.js +1 -53
- package/dist/components/Steps/styles.js +1 -96
- package/dist/components/Steps/utils.js +1 -15
- package/dist/components/Switch/index.js +1 -73
- package/dist/components/Switch/styles.js +1 -58
- package/dist/components/Switch/switch.test.js +2 -115
- package/dist/components/Table/components/MenuItem.js +1 -59
- package/dist/components/Table/components/TableSkeleton.js +1 -39
- package/dist/components/Table/components/animations.js +1 -24
- package/dist/components/Table/index.js +2 -253
- package/dist/components/Table/styles.js +1 -49
- package/dist/components/Table/table.test.js +1 -114
- package/dist/components/Tabs/TabsExample.js +1 -64
- package/dist/components/Tabs/components/Tab.js +1 -49
- package/dist/components/Tabs/components/TabPanel.js +1 -25
- package/dist/components/Tabs/components/Tabs.js +1 -107
- package/dist/components/Tabs/index.js +1 -26
- package/dist/components/Tabs/styles.js +1 -61
- package/dist/components/Tabs/tabs.test.js +1 -146
- package/dist/components/Tag/index.js +1 -53
- package/dist/components/Tag/styles.js +1 -34
- package/dist/components/Tag/tag.test.js +1 -64
- package/dist/components/TextAreaInput/index.js +1 -74
- package/dist/components/TextAreaInput/styles.js +1 -53
- package/dist/components/TextAreaInput/text-area-input.test.js +1 -81
- package/dist/components/Thumbnail/index.js +1 -125
- package/dist/components/Thumbnail/styles.js +1 -47
- package/dist/components/Thumbnail/thumbnail.test.js +1 -66
- package/dist/components/Thumbnail/utils/index.js +1 -27
- package/dist/components/Thumbnail/utils/validate-file-size.js +1 -10
- package/dist/components/Thumbnail/utils/validate-file-type.js +1 -9
- package/dist/components/TimeInput/constants.js +1 -29
- package/dist/components/TimeInput/index.js +1 -288
- package/dist/components/TimeInput/styles.js +1 -34
- package/dist/components/TimeInput/utils.js +1 -94
- package/dist/components/Timeline/components/Timeline.js +1 -17
- package/dist/components/Timeline/components/TimelineContent.js +1 -61
- package/dist/components/Timeline/components/TimelineItem.js +1 -25
- package/dist/components/Timeline/components/TimelineSeparator.js +1 -20
- package/dist/components/Timeline/index.js +1 -33
- package/dist/components/Timeline/styles.js +1 -37
- package/dist/components/Timeline/timeline.test.js +1 -138
- package/dist/components/Toast/button-example.js +1 -31
- package/dist/components/Toast/components/Toast.js +1 -79
- package/dist/components/Toast/contexts/ToastProvider.js +1 -72
- package/dist/components/Toast/hooks/useToast.js +1 -18
- package/dist/components/Toast/index.js +1 -111
- package/dist/components/Toast/styles.js +1 -36
- package/dist/components/Toast/toast.test.js +1 -129
- package/dist/components/Tooltip/components/TooltipLabel.js +1 -71
- package/dist/components/Tooltip/example.js +1 -27
- package/dist/components/Tooltip/index.js +1 -187
- package/dist/components/Tooltip/styles.js +1 -20
- package/dist/components/Typography/index.js +1 -37
- package/dist/components/Typography/styles.js +1 -15
- package/dist/components/Typography/typography.test.js +1 -288
- package/dist/index.d.ts +5 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -548
- package/dist/shared/animations/opacityAnimation.js +1 -21
- package/dist/shared/assets/emotes.js +1 -1
- package/dist/shared/components/FocusLock/index.js +5 -86
- package/dist/shared/formatters/format-number.js +5 -41
- package/dist/shared/global.js +1 -8
- package/dist/shared/hooks/devices.js +1 -14
- package/dist/shared/hooks/useBreakpoints.js +2 -95
- package/dist/shared/hooks/useDebounce.js +1 -35
- package/dist/shared/hooks/useDevices.js +2 -42
- package/dist/shared/hooks/useDisableBodyScroll.js +5 -52
- package/dist/shared/hooks/useDraggableScroll/index.js +5 -65
- package/dist/shared/hooks/useKeyPress.js +1 -18
- package/dist/shared/hooks/useObserver.js +2 -29
- package/dist/shared/hooks/useOnClickOutside.js +1 -30
- package/dist/shared/hooks/useReposition/index.js +2 -53
- package/dist/shared/hooks/useSystemTheme.js +1 -38
- package/dist/shared/hooks/useWindowSize.js +1 -36
- package/dist/shared/tests/test-utils.js +1 -31
- package/dist/shared/theme/button-example.js +1 -31
- package/dist/shared/theme/contexts/ThemeContext.js +1 -90
- package/dist/shared/theme/hooks/useColorMode.js +1 -18
- package/dist/shared/theme/hooks/useColorModeValue.js +1 -13
- package/dist/shared/theme/hooks/useTheme.js +1 -17
- package/dist/shared/theme/index.js +1 -67
- package/dist/shared/theme/objects/breakpoints.js +1 -15
- package/dist/shared/theme/objects/colors.js +1 -177
- package/dist/shared/theme/objects/shadows.js +1 -19
- package/dist/shared/theme/objects/sizes.js +6 -33
- package/dist/shared/theme/objects/spaces.js +1 -75
- package/dist/shared/theme/objects/transitions.js +1 -10
- package/dist/shared/theme/objects/typography.js +1 -20
- package/dist/shared/theme/objects/z-indexes.js +1 -20
- package/dist/shared/theme/theme.js +1 -36
- package/dist/shared/theme/theme.test.js +1 -94
- package/dist/shared/theme/utils/extendTheme.js +1 -25
- package/dist/shared/theme/utils/localStorageController.js +1 -21
- package/dist/styled.d.js +1 -3
- package/dist/utils/GenerateKey.js +3 -18
- package/dist/utils/brightnessColorChange.js +2 -17
- package/dist/utils/colorCheck.js +6 -64
- package/dist/utils/colorFunctions.js +1 -39
- package/dist/utils/colorToGray.js +2 -64
- package/dist/utils/customColorMode.js +1 -11
- package/dist/utils/file.js +5 -124
- package/dist/utils/formatters/bytes.js +2 -17
- package/dist/utils/formatters/capitalize.js +2 -11
- package/dist/utils/formatters/cep.js +3 -18
- package/dist/utils/formatters/cnpj.js +4 -38
- package/dist/utils/formatters/color.js +12 -101
- package/dist/utils/formatters/cpf.js +16 -85
- package/dist/utils/formatters/credit-card.js +5 -54
- package/dist/utils/formatters/email.js +1 -8
- package/dist/utils/formatters/index.js +1 -170
- package/dist/utils/formatters/name.js +4 -31
- package/dist/utils/formatters/number.js +5 -14
- package/dist/utils/formatters/passport.js +5 -33
- package/dist/utils/formatters/phone.js +17 -214
- package/dist/utils/formatters/price.js +3 -21
- package/dist/utils/formatters/rg.js +3 -18
- package/dist/utils/formatters/strings.js +4 -27
- package/dist/utils/fuctionsColors.js +1 -39
- package/dist/utils/generateUUID.js +1 -13
- package/dist/utils/getColorValue.js +2 -23
- package/dist/utils/getSvg.js +1 -17
- package/dist/utils/getValuesBySize.js +1 -9
- package/dist/utils/invertColor.js +4 -40
- package/package.json +2 -1
|
@@ -1,33 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.BadgeSkeleton = exports.BadgeContainer = exports.BadgeCircle = void 0;
|
|
7
|
-
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
8
|
-
var _colorCheck = require("../../utils/colorCheck");
|
|
9
|
-
var _templateObject, _templateObject2;
|
|
10
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
12
|
-
var BadgeContainer = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n"])));
|
|
13
|
-
exports.BadgeContainer = BadgeContainer;
|
|
14
|
-
var BadgeCircle = _styled.default.div(function (props) {
|
|
15
|
-
var theme = props.theme,
|
|
16
|
-
_props$type = props.type,
|
|
17
|
-
type = _props$type === void 0 ? 'neutral' : _props$type,
|
|
18
|
-
customColor = props.color;
|
|
19
|
-
var themeColor = !theme.colors[type] || type === 'neutral' ? theme.colors.neutral.neutral1 : theme.colors[type].default;
|
|
20
|
-
var color = customColor ? (0, _colorCheck.stripThemeColors)(customColor, theme.colors) || customColor : themeColor;
|
|
21
|
-
return "\n width: 10px;\n height: 10px;\n border-radius: 50%;\n box-shadow: inset 0 0 0 3px ".concat(color, ";\n margin-right: 8px;\n flex-shrink: 0;\n ");
|
|
22
|
-
});
|
|
23
|
-
exports.BadgeCircle = BadgeCircle;
|
|
24
|
-
var BadgeSkeleton = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: ", ";\n height: 10px;\n display: block;\n border-radius: ", ";\n background-color: ", ";\n overflow: hidden;\n\n &:not(:last-child) {\n margin-right: 8px;\n }\n\n &::after {\n content: '';\n inset: 0px;\n width: 100%;\n height: 100%;\n display: block;\n animation: 1.6s linear 0.5s infinite normal none running move;\n transform: translateX(-100%);\n background: linear-gradient(\n 90deg,\n transparent,\n ", ",\n transparent\n );\n }\n\n @keyframes move {\n 0% {\n transform: translateX(-100%);\n }\n 100% {\n transform: translateX(100%);\n }\n }\n"])), function (props) {
|
|
25
|
-
return props.circle ? '10px' : '4rem';
|
|
26
|
-
}, function (props) {
|
|
27
|
-
return props.circle ? '999999px' : '2px';
|
|
28
|
-
}, function (props) {
|
|
29
|
-
return props.theme.colors.neutral.neutral1;
|
|
30
|
-
}, function (props) {
|
|
31
|
-
return props.theme.colors.neutral.neutral2;
|
|
32
|
-
});
|
|
33
|
-
exports.BadgeSkeleton = BadgeSkeleton;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.BadgeSkeleton=exports.BadgeContainer=exports.BadgeCircle=void 0;var _templateObject,_templateObject2,_styled=_interopRequireDefault(require("@emotion/styled")),_colorCheck=require("../../utils/colorCheck");function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _taggedTemplateLiteral(strings,raw){return raw||(raw=strings.slice(0)),Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}))}var BadgeContainer=_styled.default.div(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n"])));exports.BadgeContainer=BadgeContainer;var BadgeCircle=_styled.default.div(function(props){var theme=props.theme,_props$type=props.type,type=void 0===_props$type?"neutral":_props$type,customColor=props.color,themeColor=theme.colors[type]&&"neutral"!==type?theme.colors[type].default:theme.colors.neutral.neutral1,color=customColor?(0,_colorCheck.stripThemeColors)(customColor,theme.colors)||customColor:themeColor;return"\n width: 10px;\n height: 10px;\n border-radius: 50%;\n box-shadow: inset 0 0 0 3px ".concat(color,";\n margin-right: 8px;\n flex-shrink: 0;\n ")});exports.BadgeCircle=BadgeCircle;var BadgeSkeleton=_styled.default.div(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["\n width: ",";\n height: 10px;\n display: block;\n border-radius: ",";\n background-color: ",";\n overflow: hidden;\n\n &:not(:last-child) {\n margin-right: 8px;\n }\n\n &::after {\n content: '';\n inset: 0px;\n width: 100%;\n height: 100%;\n display: block;\n animation: 1.6s linear 0.5s infinite normal none running move;\n transform: translateX(-100%);\n background: linear-gradient(\n 90deg,\n transparent,\n ",",\n transparent\n );\n }\n\n @keyframes move {\n 0% {\n transform: translateX(-100%);\n }\n 100% {\n transform: translateX(100%);\n }\n }\n"])),function(props){return props.circle?"10px":"4rem"},function(props){return props.circle?"999999px":"2px"},function(props){return props.theme.colors.neutral.neutral1},function(props){return props.theme.colors.neutral.neutral2});exports.BadgeSkeleton=BadgeSkeleton;
|
|
@@ -1,154 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _testUtils = require("../../shared/tests/test-utils");
|
|
4
|
-
var _react = require("@testing-library/react");
|
|
5
|
-
require("@testing-library/jest-dom");
|
|
6
|
-
var _ = _interopRequireDefault(require("."));
|
|
7
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
8
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
10
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
11
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
12
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
13
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
14
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
15
|
-
describe('Button', function () {
|
|
16
|
-
var setup = function setup(props) {
|
|
17
|
-
var utils = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, _objectSpread(_objectSpread({}, props), {}, {
|
|
18
|
-
children: "Button test"
|
|
19
|
-
})));
|
|
20
|
-
var getSkeleton = function getSkeleton() {
|
|
21
|
-
return utils.getAllByTestId('skeleton')[0];
|
|
22
|
-
};
|
|
23
|
-
var getLeftIcon = function getLeftIcon() {
|
|
24
|
-
return utils.getAllByTestId('leftIconId')[0];
|
|
25
|
-
};
|
|
26
|
-
var getRightIcon = function getRightIcon() {
|
|
27
|
-
return utils.getAllByTestId('rightIconId')[0];
|
|
28
|
-
};
|
|
29
|
-
return _objectSpread({
|
|
30
|
-
getSkeleton: getSkeleton,
|
|
31
|
-
getLeftIcon: getLeftIcon,
|
|
32
|
-
getRightIcon: getRightIcon
|
|
33
|
-
}, utils);
|
|
34
|
-
};
|
|
35
|
-
it('should be rendered', function () {
|
|
36
|
-
var _setup = setup({
|
|
37
|
-
bgColor: '#fff',
|
|
38
|
-
variant: 'solid'
|
|
39
|
-
}),
|
|
40
|
-
container = _setup.container;
|
|
41
|
-
expect(container).toBeInTheDocument();
|
|
42
|
-
});
|
|
43
|
-
it('should call onClick function when clicked', function () {
|
|
44
|
-
var handleClick = jest.fn();
|
|
45
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
46
|
-
variant: "solid",
|
|
47
|
-
bgColor: "#fff",
|
|
48
|
-
onClick: handleClick,
|
|
49
|
-
children: "Click Me"
|
|
50
|
-
}));
|
|
51
|
-
_react.fireEvent.click(_react.screen.getByRole('button'));
|
|
52
|
-
expect(handleClick).toHaveBeenCalledTimes(1);
|
|
53
|
-
});
|
|
54
|
-
it('should render a disabled button', function () {
|
|
55
|
-
var handleClick = jest.fn();
|
|
56
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
57
|
-
disabled: true,
|
|
58
|
-
variant: "solid",
|
|
59
|
-
bgColor: "#fff",
|
|
60
|
-
onClick: handleClick,
|
|
61
|
-
children: "Click Me"
|
|
62
|
-
}));
|
|
63
|
-
expect(_react.screen.getByRole('button')).toBeDisabled();
|
|
64
|
-
expect(_react.screen.getByRole('button')).not.toHaveStyle('cursor: pointer');
|
|
65
|
-
});
|
|
66
|
-
it('should render a ghost variant button', function () {
|
|
67
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
68
|
-
variant: "ghost",
|
|
69
|
-
children: "Click Me"
|
|
70
|
-
}));
|
|
71
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('background-color: transparent');
|
|
72
|
-
});
|
|
73
|
-
it('should render a link variant button', function () {
|
|
74
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
75
|
-
variant: "link",
|
|
76
|
-
children: "Click Me"
|
|
77
|
-
}));
|
|
78
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('background-color: transparent');
|
|
79
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('text-decoration: underline');
|
|
80
|
-
});
|
|
81
|
-
it('should render an outline variant button', function () {
|
|
82
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
83
|
-
variant: "outline",
|
|
84
|
-
textColor: "#ff00ff",
|
|
85
|
-
children: "Click Me"
|
|
86
|
-
}));
|
|
87
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('background-color: transparent');
|
|
88
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('color: #ff00ff');
|
|
89
|
-
});
|
|
90
|
-
it('should render a button that takes full width (boolean)', function () {
|
|
91
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
92
|
-
fullWidth: true,
|
|
93
|
-
variant: "solid",
|
|
94
|
-
children: "Click Me"
|
|
95
|
-
}));
|
|
96
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('width: 100%');
|
|
97
|
-
});
|
|
98
|
-
it('should render a button that takes full width (Responsive Object)', function () {
|
|
99
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
100
|
-
fullWidth: {
|
|
101
|
-
base: true
|
|
102
|
-
},
|
|
103
|
-
variant: "solid",
|
|
104
|
-
bgColor: "#fff",
|
|
105
|
-
children: "Click Me"
|
|
106
|
-
}));
|
|
107
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('width: 100%');
|
|
108
|
-
});
|
|
109
|
-
it('should not render a button that takes full width (Responsive Object)', function () {
|
|
110
|
-
var handleClick = jest.fn();
|
|
111
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
112
|
-
fullWidth: {
|
|
113
|
-
base: false,
|
|
114
|
-
sm: true
|
|
115
|
-
},
|
|
116
|
-
variant: "solid",
|
|
117
|
-
bgColor: "#fff",
|
|
118
|
-
onClick: handleClick,
|
|
119
|
-
children: "Click Me"
|
|
120
|
-
}));
|
|
121
|
-
expect(_react.screen.getByRole('button')).not.toHaveStyle('width: 100%');
|
|
122
|
-
});
|
|
123
|
-
it('should render a button with a leftIcon', function () {
|
|
124
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
125
|
-
leftIcon: "airplay",
|
|
126
|
-
variant: "solid",
|
|
127
|
-
children: "Click Me"
|
|
128
|
-
}));
|
|
129
|
-
var _setup2 = setup({
|
|
130
|
-
leftIcon: 'airplay'
|
|
131
|
-
}),
|
|
132
|
-
getLeftIcon = _setup2.getLeftIcon;
|
|
133
|
-
expect(getLeftIcon()).toBeInTheDocument();
|
|
134
|
-
});
|
|
135
|
-
it('should render a button with a rightIcon', function () {
|
|
136
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
137
|
-
rightIcon: "airplay",
|
|
138
|
-
variant: "solid",
|
|
139
|
-
children: "Click Me"
|
|
140
|
-
}));
|
|
141
|
-
var _setup3 = setup({
|
|
142
|
-
rightIcon: 'airplay'
|
|
143
|
-
}),
|
|
144
|
-
getRightIcon = _setup3.getRightIcon;
|
|
145
|
-
expect(getRightIcon()).toBeInTheDocument();
|
|
146
|
-
});
|
|
147
|
-
it('should render a button with a grey textColor', function () {
|
|
148
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
149
|
-
textColor: "#8b7e8b",
|
|
150
|
-
children: "Click Me"
|
|
151
|
-
}));
|
|
152
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('color: #8b7e8b');
|
|
153
|
-
});
|
|
154
|
-
});
|
|
1
|
+
"use strict";var _testUtils=require("../../shared/tests/test-utils"),_react=require("@testing-library/react");require("@testing-library/jest-dom");var _=_interopRequireDefault(require(".")),_jsxRuntime=require("react/jsx-runtime");function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},_typeof(obj)}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})),keys.push.apply(keys,symbols)}return keys}function _objectSpread(target){for(var source,i=1;i<arguments.length;i++)source=null==arguments[i]?{}:arguments[i],i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key])}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))});return target}function _defineProperty(obj,key,value){return key=_toPropertyKey(key),key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}function _toPropertyKey(arg){var key=_toPrimitive(arg,"string");return"symbol"===_typeof(key)?key:key+""}function _toPrimitive(input,hint){if("object"!==_typeof(input)||null===input)return input;var prim=input[Symbol.toPrimitive];if(prim!==void 0){var res=prim.call(input,hint||"default");if("object"!==_typeof(res))return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}describe("Button",function(){var setup=function(props){var utils=(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,_objectSpread(_objectSpread({},props),{},{children:"Button test"})));return _objectSpread({getSkeleton:function getSkeleton(){return utils.getAllByTestId("skeleton")[0]},getLeftIcon:function getLeftIcon(){return utils.getAllByTestId("leftIconId")[0]},getRightIcon:function getRightIcon(){return utils.getAllByTestId("rightIconId")[0]}},utils)};it("should be rendered",function(){var _setup=setup({bgColor:"#fff",variant:"solid"}),container=_setup.container;expect(container).toBeInTheDocument()}),it("should call onClick function when clicked",function(){var handleClick=jest.fn();(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{variant:"solid",bgColor:"#fff",onClick:handleClick,children:"Click Me"})),_react.fireEvent.click(_react.screen.getByRole("button")),expect(handleClick).toHaveBeenCalledTimes(1)}),it("should render a disabled button",function(){var handleClick=jest.fn();(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{disabled:!0,variant:"solid",bgColor:"#fff",onClick:handleClick,children:"Click Me"})),expect(_react.screen.getByRole("button")).toBeDisabled(),expect(_react.screen.getByRole("button")).not.toHaveStyle("cursor: pointer")}),it("should render a ghost variant button",function(){(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{variant:"ghost",children:"Click Me"})),expect(_react.screen.getByRole("button")).toHaveStyle("background-color: transparent")}),it("should render a link variant button",function(){(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{variant:"link",children:"Click Me"})),expect(_react.screen.getByRole("button")).toHaveStyle("background-color: transparent"),expect(_react.screen.getByRole("button")).toHaveStyle("text-decoration: underline")}),it("should render an outline variant button",function(){(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{variant:"outline",textColor:"#ff00ff",children:"Click Me"})),expect(_react.screen.getByRole("button")).toHaveStyle("background-color: transparent"),expect(_react.screen.getByRole("button")).toHaveStyle("color: #ff00ff")}),it("should render a button that takes full width (boolean)",function(){(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{fullWidth:!0,variant:"solid",children:"Click Me"})),expect(_react.screen.getByRole("button")).toHaveStyle("width: 100%")}),it("should render a button that takes full width (Responsive Object)",function(){(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{fullWidth:{base:!0},variant:"solid",bgColor:"#fff",children:"Click Me"})),expect(_react.screen.getByRole("button")).toHaveStyle("width: 100%")}),it("should not render a button that takes full width (Responsive Object)",function(){var handleClick=jest.fn();(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{fullWidth:{base:!1,sm:!0},variant:"solid",bgColor:"#fff",onClick:handleClick,children:"Click Me"})),expect(_react.screen.getByRole("button")).not.toHaveStyle("width: 100%")}),it("should render a button with a leftIcon",function(){(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{leftIcon:"airplay",variant:"solid",children:"Click Me"}));var _setup2=setup({leftIcon:"airplay"}),getLeftIcon=_setup2.getLeftIcon;expect(getLeftIcon()).toBeInTheDocument()}),it("should render a button with a rightIcon",function(){(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{rightIcon:"airplay",variant:"solid",children:"Click Me"}));var _setup3=setup({rightIcon:"airplay"}),getRightIcon=_setup3.getRightIcon;expect(getRightIcon()).toBeInTheDocument()}),it("should render a button with a grey textColor",function(){(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.default,{textColor:"#8b7e8b",children:"Click Me"})),expect(_react.screen.getByRole("button")).toHaveStyle("color: #8b7e8b")})});
|
|
@@ -1,87 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = Button;
|
|
8
|
-
var _Icon = _interopRequireDefault(require("../Icon"));
|
|
9
|
-
var _index = require("../../shared/theme/index");
|
|
10
|
-
var _getColorValue = require("../../utils/getColorValue");
|
|
11
|
-
var _styles = require("./styles");
|
|
12
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
-
var _excluded = ["children", "leftIcon", "rightIcon", "variant", "bgColor", "size", "fullWidth", "textColor", "type", "iconColor"];
|
|
14
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
18
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
19
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
20
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
21
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
22
|
-
function Button(_ref) {
|
|
23
|
-
var children = _ref.children,
|
|
24
|
-
leftIcon = _ref.leftIcon,
|
|
25
|
-
rightIcon = _ref.rightIcon,
|
|
26
|
-
_ref$variant = _ref.variant,
|
|
27
|
-
variant = _ref$variant === void 0 ? 'solid' : _ref$variant,
|
|
28
|
-
_ref$bgColor = _ref.bgColor,
|
|
29
|
-
bgColor = _ref$bgColor === void 0 ? '' : _ref$bgColor,
|
|
30
|
-
_ref$size = _ref.size,
|
|
31
|
-
size = _ref$size === void 0 ? 'md' : _ref$size,
|
|
32
|
-
fullWidth = _ref.fullWidth,
|
|
33
|
-
_ref$textColor = _ref.textColor,
|
|
34
|
-
textColor = _ref$textColor === void 0 ? '' : _ref$textColor,
|
|
35
|
-
_ref$type = _ref.type,
|
|
36
|
-
type = _ref$type === void 0 ? 'button' : _ref$type,
|
|
37
|
-
_ref$iconColor = _ref.iconColor,
|
|
38
|
-
iconColor = _ref$iconColor === void 0 ? '' : _ref$iconColor,
|
|
39
|
-
props = _objectWithoutProperties(_ref, _excluded);
|
|
40
|
-
var _useTheme = (0, _index.useTheme)(),
|
|
41
|
-
theme = _useTheme.theme;
|
|
42
|
-
var parsedBgColor = (0, _getColorValue.getColorValue)(bgColor, theme, 'success.default');
|
|
43
|
-
var parsedTextColor = (0, _getColorValue.getColorValue)(textColor, theme, 'neutral.white');
|
|
44
|
-
var parsedIconColor = (0, _getColorValue.getColorValue)(iconColor, theme, 'neutral.white');
|
|
45
|
-
var iconSize = {
|
|
46
|
-
xs: '16px',
|
|
47
|
-
sm: '18px',
|
|
48
|
-
md: '20px',
|
|
49
|
-
lg: '24px',
|
|
50
|
-
xl: '26px'
|
|
51
|
-
}[size];
|
|
52
|
-
if (parsedBgColor.includes('.')) {
|
|
53
|
-
parsedBgColor = (0, _getColorValue.getThemeHex)(parsedBgColor, theme);
|
|
54
|
-
}
|
|
55
|
-
if (parsedTextColor.includes('.')) {
|
|
56
|
-
parsedTextColor = (0, _getColorValue.getThemeHex)(parsedTextColor, theme);
|
|
57
|
-
}
|
|
58
|
-
if (parsedIconColor.includes('.')) {
|
|
59
|
-
parsedIconColor = (0, _getColorValue.getThemeHex)(parsedIconColor, theme);
|
|
60
|
-
}
|
|
61
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ButtonContainer, _objectSpread(_objectSpread({
|
|
62
|
-
bgColor: parsedBgColor,
|
|
63
|
-
textColor: parsedTextColor,
|
|
64
|
-
fullWidth: fullWidth,
|
|
65
|
-
variant: variant,
|
|
66
|
-
size: size,
|
|
67
|
-
type: type
|
|
68
|
-
}, props), {}, {
|
|
69
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.IconContainer, {
|
|
70
|
-
children: [leftIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
|
|
71
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
|
|
72
|
-
color: parsedIconColor,
|
|
73
|
-
name: leftIcon,
|
|
74
|
-
size: iconSize,
|
|
75
|
-
"data-testid": "leftIconId"
|
|
76
|
-
})
|
|
77
|
-
}), children, !leftIcon && rightIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
|
|
78
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
|
|
79
|
-
name: rightIcon,
|
|
80
|
-
color: parsedIconColor,
|
|
81
|
-
size: iconSize,
|
|
82
|
-
"data-testid": "rightIconId"
|
|
83
|
-
})
|
|
84
|
-
})]
|
|
85
|
-
})
|
|
86
|
-
}));
|
|
87
|
-
}
|
|
1
|
+
"use strict";function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},_typeof(obj)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=Button;var _Icon=_interopRequireDefault(require("../Icon")),_index=require("../../shared/theme/index"),_getColorValue=require("../../utils/getColorValue"),_styles=require("./styles"),_jsxRuntime=require("react/jsx-runtime"),_excluded=["children","leftIcon","rightIcon","variant","bgColor","size","fullWidth","textColor","type","iconColor"];function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})),keys.push.apply(keys,symbols)}return keys}function _objectSpread(target){for(var source,i=1;i<arguments.length;i++)source=null==arguments[i]?{}:arguments[i],i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key])}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))});return target}function _defineProperty(obj,key,value){return key=_toPropertyKey(key),key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}function _toPropertyKey(arg){var key=_toPrimitive(arg,"string");return"symbol"===_typeof(key)?key:key+""}function _toPrimitive(input,hint){if("object"!==_typeof(input)||null===input)return input;var prim=input[Symbol.toPrimitive];if(prim!==void 0){var res=prim.call(input,hint||"default");if("object"!==_typeof(res))return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}function _objectWithoutProperties(source,excluded){if(null==source)return{};var key,i,target=_objectWithoutPropertiesLoose(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],0<=excluded.indexOf(key)||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}function _objectWithoutPropertiesLoose(source,excluded){if(null==source)return{};var key,i,target={},sourceKeys=Object.keys(source);for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],0<=excluded.indexOf(key)||(target[key]=source[key]);return target}function Button(_ref){var children=_ref.children,leftIcon=_ref.leftIcon,rightIcon=_ref.rightIcon,_ref$variant=_ref.variant,variant=void 0===_ref$variant?"solid":_ref$variant,_ref$bgColor=_ref.bgColor,bgColor=void 0===_ref$bgColor?"":_ref$bgColor,_ref$size=_ref.size,size=void 0===_ref$size?"md":_ref$size,fullWidth=_ref.fullWidth,_ref$textColor=_ref.textColor,textColor=void 0===_ref$textColor?"":_ref$textColor,_ref$type=_ref.type,type=void 0===_ref$type?"button":_ref$type,_ref$iconColor=_ref.iconColor,iconColor=void 0===_ref$iconColor?"":_ref$iconColor,props=_objectWithoutProperties(_ref,_excluded),_useTheme=(0,_index.useTheme)(),theme=_useTheme.theme,parsedBgColor=(0,_getColorValue.getColorValue)(bgColor,theme,"success.default"),parsedTextColor=(0,_getColorValue.getColorValue)(textColor,theme,"neutral.white"),parsedIconColor=(0,_getColorValue.getColorValue)(iconColor,theme,"neutral.white"),iconSize={xs:"16px",sm:"18px",md:"20px",lg:"24px",xl:"26px"}[size];return parsedBgColor.includes(".")&&(parsedBgColor=(0,_getColorValue.getThemeHex)(parsedBgColor,theme)),parsedTextColor.includes(".")&&(parsedTextColor=(0,_getColorValue.getThemeHex)(parsedTextColor,theme)),parsedIconColor.includes(".")&&(parsedIconColor=(0,_getColorValue.getThemeHex)(parsedIconColor,theme)),/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles.ButtonContainer,_objectSpread(_objectSpread({bgColor:parsedBgColor,textColor:parsedTextColor,fullWidth:fullWidth,variant:variant,size:size,type:type},props),{},{children:/*#__PURE__*/(0,_jsxRuntime.jsxs)(_styles.IconContainer,{children:[leftIcon&&/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles.IconWrapper,{children:/*#__PURE__*/(0,_jsxRuntime.jsx)(_Icon.default,{color:parsedIconColor,name:leftIcon,size:iconSize,"data-testid":"leftIconId"})}),children,!leftIcon&&rightIcon&&/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles.IconWrapper,{children:/*#__PURE__*/(0,_jsxRuntime.jsx)(_Icon.default,{name:rightIcon,color:parsedIconColor,size:iconSize,"data-testid":"rightIconId"})})]})}))}
|
|
@@ -1,112 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.IconWrapper = exports.IconContainer = exports.ButtonContainer = void 0;
|
|
7
|
-
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
8
|
-
var _react = require("@emotion/react");
|
|
9
|
-
var _invertColor = require("../../utils/invertColor");
|
|
10
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
|
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
13
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
14
|
-
var ButtonContainer = _styled.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-family: inherit;\n font-weight: ", ";\n font-size: ", ";\n border-radius: 8px;\n border: 0px;\n cursor: pointer;\n padding: ", ";\n\n --button-brightness: brightness(0.85);\n\n transition: all 0.15s ease-in-out;\n\n color: ", ";\n\n background-color: ", ";\n\n width: ", ";\n\n &:disabled {\n filter: opacity(0.5);\n cursor: default;\n pointer-events: none;\n }\n\n ", "\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n"])), function (_ref) {
|
|
15
|
-
var theme = _ref.theme;
|
|
16
|
-
return theme.fontWeight[600];
|
|
17
|
-
}, function (_ref2) {
|
|
18
|
-
var theme = _ref2.theme;
|
|
19
|
-
return theme.fontSizes.xs;
|
|
20
|
-
}, function (_ref3) {
|
|
21
|
-
var size = _ref3.size;
|
|
22
|
-
switch (size) {
|
|
23
|
-
case 'xs':
|
|
24
|
-
return '4px 8px';
|
|
25
|
-
case 'sm':
|
|
26
|
-
return '8px 16px';
|
|
27
|
-
case 'md':
|
|
28
|
-
return '12px 24px';
|
|
29
|
-
case 'lg':
|
|
30
|
-
return '16px 32px';
|
|
31
|
-
case 'xl':
|
|
32
|
-
return '20px 40px';
|
|
33
|
-
default:
|
|
34
|
-
return '12px 24px';
|
|
35
|
-
}
|
|
36
|
-
}, function (_ref4) {
|
|
37
|
-
var theme = _ref4.theme,
|
|
38
|
-
textColor = _ref4.textColor;
|
|
39
|
-
return textColor || theme.lightColors.neutral.white;
|
|
40
|
-
}, function (_ref5) {
|
|
41
|
-
var theme = _ref5.theme,
|
|
42
|
-
bgColor = _ref5.bgColor;
|
|
43
|
-
return bgColor !== null && bgColor !== void 0 ? bgColor : theme.colors.primary.default;
|
|
44
|
-
}, function (_ref6) {
|
|
45
|
-
var fullWidth = _ref6.fullWidth;
|
|
46
|
-
if (fullWidth) {
|
|
47
|
-
if (_typeof(fullWidth) === 'object' && fullWidth !== undefined) {
|
|
48
|
-
return fullWidth.base && '100%';
|
|
49
|
-
}
|
|
50
|
-
return '100%';
|
|
51
|
-
}
|
|
52
|
-
}, function (_ref7) {
|
|
53
|
-
var theme = _ref7.theme,
|
|
54
|
-
variant = _ref7.variant,
|
|
55
|
-
textColor = _ref7.textColor,
|
|
56
|
-
bgColor = _ref7.bgColor;
|
|
57
|
-
switch (variant) {
|
|
58
|
-
case 'solid':
|
|
59
|
-
return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n color: ", ";\n svg,\n path {\n color: ", ";\n fill: ", ";\n }\n &:is(&:hover, &:focus):not(:disabled) {\n box-shadow: inset 0 0 40px 40px rgba(0, 0, 0, 0.08);\n }\n "])), (0, _invertColor.invertColor)(bgColor !== null && bgColor !== void 0 ? bgColor : theme.colors.primary.default, true), (0, _invertColor.invertColor)(bgColor !== null && bgColor !== void 0 ? bgColor : theme.colors.primary.default, true), (0, _invertColor.invertColor)(bgColor !== null && bgColor !== void 0 ? bgColor : theme.colors.primary.default, true));
|
|
60
|
-
case 'outline':
|
|
61
|
-
return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n background-color: transparent;\n color: ", ";\n border: 3px ", " solid;\n box-shadow: none;\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), textColor || bgColor || theme.colors.primary.default, bgColor || textColor || theme.colors.primary.default);
|
|
62
|
-
case 'ghost':
|
|
63
|
-
return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), bgColor || textColor || theme.colors.primary.default);
|
|
64
|
-
case 'link':
|
|
65
|
-
return (0, _react.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n text-decoration: underline;\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), bgColor || textColor || theme.colors.primary.default);
|
|
66
|
-
}
|
|
67
|
-
}, function (_ref8) {
|
|
68
|
-
var theme = _ref8.theme;
|
|
69
|
-
return theme.breakpoints.sm;
|
|
70
|
-
}, function (_ref9) {
|
|
71
|
-
var fullWidth = _ref9.fullWidth;
|
|
72
|
-
if (_typeof(fullWidth) === 'object') {
|
|
73
|
-
var widthWasNotSet = fullWidth.sm === undefined;
|
|
74
|
-
if (widthWasNotSet) return;
|
|
75
|
-
return fullWidth.sm ? '100%' : 'fit-content';
|
|
76
|
-
}
|
|
77
|
-
}, function (_ref10) {
|
|
78
|
-
var theme = _ref10.theme;
|
|
79
|
-
return theme.breakpoints.md;
|
|
80
|
-
}, function (_ref11) {
|
|
81
|
-
var fullWidth = _ref11.fullWidth;
|
|
82
|
-
if (_typeof(fullWidth) === 'object') {
|
|
83
|
-
var widthWasNotSet = fullWidth.md === undefined;
|
|
84
|
-
if (widthWasNotSet) return;
|
|
85
|
-
return fullWidth.md ? '100%' : 'fit-content';
|
|
86
|
-
}
|
|
87
|
-
}, function (_ref12) {
|
|
88
|
-
var theme = _ref12.theme;
|
|
89
|
-
return theme.breakpoints.lg;
|
|
90
|
-
}, function (_ref13) {
|
|
91
|
-
var fullWidth = _ref13.fullWidth;
|
|
92
|
-
if (_typeof(fullWidth) === 'object') {
|
|
93
|
-
var widthWasNotSet = fullWidth.lg === undefined;
|
|
94
|
-
if (widthWasNotSet) return;
|
|
95
|
-
return fullWidth.lg ? '100%' : 'fit-content';
|
|
96
|
-
}
|
|
97
|
-
}, function (_ref14) {
|
|
98
|
-
var theme = _ref14.theme;
|
|
99
|
-
return theme.breakpoints.xl;
|
|
100
|
-
}, function (_ref15) {
|
|
101
|
-
var fullWidth = _ref15.fullWidth;
|
|
102
|
-
if (_typeof(fullWidth) === 'object') {
|
|
103
|
-
var widthWasNotSet = fullWidth.xl === undefined;
|
|
104
|
-
if (widthWasNotSet) return;
|
|
105
|
-
return fullWidth.xl ? '100%' : 'fit-content';
|
|
106
|
-
}
|
|
107
|
-
});
|
|
108
|
-
exports.ButtonContainer = ButtonContainer;
|
|
109
|
-
var IconContainer = _styled.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 0.45em;\n"])));
|
|
110
|
-
exports.IconContainer = IconContainer;
|
|
111
|
-
var IconWrapper = _styled.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
|
|
112
|
-
exports.IconWrapper = IconWrapper;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.IconWrapper=exports.IconContainer=exports.ButtonContainer=void 0;var _templateObject,_templateObject2,_templateObject3,_templateObject4,_templateObject5,_templateObject6,_templateObject7,_styled=_interopRequireDefault(require("@emotion/styled")),_react=require("@emotion/react"),_invertColor=require("../../utils/invertColor");function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},_typeof(obj)}function _taggedTemplateLiteral(strings,raw){return raw||(raw=strings.slice(0)),Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}))}var ButtonContainer=_styled.default.button(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n font-family: inherit;\n font-weight: ",";\n font-size: ",";\n border-radius: 8px;\n border: 0px;\n cursor: pointer;\n padding: ",";\n\n --button-brightness: brightness(0.85);\n\n transition: all 0.15s ease-in-out;\n\n color: ",";\n\n background-color: ",";\n\n width: ",";\n\n &:disabled {\n filter: opacity(0.5);\n cursor: default;\n pointer-events: none;\n }\n\n ","\n\n @media screen and (min-width: ",") {\n width: ",";\n }\n\n @media screen and (min-width: ",") {\n width: ",";\n }\n\n @media screen and (min-width: ",") {\n width: ",";\n }\n\n @media screen and (min-width: ",") {\n width: ",";\n }\n"])),function(_ref){var theme=_ref.theme;return theme.fontWeight[600]},function(_ref2){var theme=_ref2.theme;return theme.fontSizes.xs},function(_ref3){var size=_ref3.size;return"xs"===size?"4px 8px":"sm"===size?"8px 16px":"md"===size?"12px 24px":"lg"===size?"16px 32px":"xl"===size?"20px 40px":"12px 24px"},function(_ref4){var theme=_ref4.theme,textColor=_ref4.textColor;return textColor||theme.lightColors.neutral.white},function(_ref5){var theme=_ref5.theme,bgColor=_ref5.bgColor;return null!==bgColor&&void 0!==bgColor?bgColor:theme.colors.primary.default},function(_ref6){var fullWidth=_ref6.fullWidth;if(fullWidth)return"object"===_typeof(fullWidth)&&void 0!==fullWidth?fullWidth.base&&"100%":"100%"},function(_ref7){var theme=_ref7.theme,variant=_ref7.variant,textColor=_ref7.textColor,bgColor=_ref7.bgColor;return"solid"===variant?(0,_react.css)(_templateObject2||(_templateObject2=_taggedTemplateLiteral(["\n color: ",";\n svg,\n path {\n color: ",";\n fill: ",";\n }\n &:is(&:hover, &:focus):not(:disabled) {\n box-shadow: inset 0 0 40px 40px rgba(0, 0, 0, 0.08);\n }\n "])),(0,_invertColor.invertColor)(null!==bgColor&&void 0!==bgColor?bgColor:theme.colors.primary.default,!0),(0,_invertColor.invertColor)(null!==bgColor&&void 0!==bgColor?bgColor:theme.colors.primary.default,!0),(0,_invertColor.invertColor)(null!==bgColor&&void 0!==bgColor?bgColor:theme.colors.primary.default,!0)):"outline"===variant?(0,_react.css)(_templateObject3||(_templateObject3=_taggedTemplateLiteral(["\n background-color: transparent;\n color: ",";\n border: 3px "," solid;\n box-shadow: none;\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])),textColor||bgColor||theme.colors.primary.default,bgColor||textColor||theme.colors.primary.default):"ghost"===variant?(0,_react.css)(_templateObject4||(_templateObject4=_taggedTemplateLiteral(["\n background-color: transparent;\n color: ",";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])),bgColor||textColor||theme.colors.primary.default):"link"===variant?(0,_react.css)(_templateObject5||(_templateObject5=_taggedTemplateLiteral(["\n text-decoration: underline;\n background-color: transparent;\n color: ",";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])),bgColor||textColor||theme.colors.primary.default):void 0},function(_ref8){var theme=_ref8.theme;return theme.breakpoints.sm},function(_ref9){var fullWidth=_ref9.fullWidth;if("object"===_typeof(fullWidth)){var widthWasNotSet=fullWidth.sm===void 0;return widthWasNotSet?void 0:fullWidth.sm?"100%":"fit-content"}},function(_ref10){var theme=_ref10.theme;return theme.breakpoints.md},function(_ref11){var fullWidth=_ref11.fullWidth;if("object"===_typeof(fullWidth)){var widthWasNotSet=fullWidth.md===void 0;return widthWasNotSet?void 0:fullWidth.md?"100%":"fit-content"}},function(_ref12){var theme=_ref12.theme;return theme.breakpoints.lg},function(_ref13){var fullWidth=_ref13.fullWidth;if("object"===_typeof(fullWidth)){var widthWasNotSet=fullWidth.lg===void 0;return widthWasNotSet?void 0:fullWidth.lg?"100%":"fit-content"}},function(_ref14){var theme=_ref14.theme;return theme.breakpoints.xl},function(_ref15){var fullWidth=_ref15.fullWidth;if("object"===_typeof(fullWidth)){var widthWasNotSet=fullWidth.xl===void 0;return widthWasNotSet?void 0:fullWidth.xl?"100%":"fit-content"}});exports.ButtonContainer=ButtonContainer;var IconContainer=_styled.default.div(_templateObject6||(_templateObject6=_taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 0.45em;\n"])));exports.IconContainer=IconContainer;var IconWrapper=_styled.default.div(_templateObject7||(_templateObject7=_taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n"])));exports.IconWrapper=IconWrapper;
|
|
@@ -1,30 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _testUtils = require("../../shared/tests/test-utils");
|
|
4
|
-
require("@testing-library/jest-dom");
|
|
5
|
-
var _ = require(".");
|
|
6
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
7
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
8
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
9
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
10
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
11
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
12
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
13
|
-
var setup = function setup(props) {
|
|
14
|
-
var utils = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Card, _objectSpread({}, props)));
|
|
15
|
-
return utils;
|
|
16
|
-
};
|
|
17
|
-
describe('Card', function () {
|
|
18
|
-
it('Should render a empty card', function () {
|
|
19
|
-
var _setup = setup({}),
|
|
20
|
-
container = _setup.container;
|
|
21
|
-
expect(container).toBeInTheDocument();
|
|
22
|
-
});
|
|
23
|
-
it('Should render a card with padding', function () {
|
|
24
|
-
var _setup2 = setup({
|
|
25
|
-
cardPadding: '32px'
|
|
26
|
-
}),
|
|
27
|
-
container = _setup2.container;
|
|
28
|
-
expect(container).toBeInTheDocument();
|
|
29
|
-
});
|
|
30
|
-
});
|
|
1
|
+
"use strict";var _testUtils=require("../../shared/tests/test-utils");require("@testing-library/jest-dom");var _=require("."),_jsxRuntime=require("react/jsx-runtime");function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},_typeof(obj)}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})),keys.push.apply(keys,symbols)}return keys}function _objectSpread(target){for(var source,i=1;i<arguments.length;i++)source=null==arguments[i]?{}:arguments[i],i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key])}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))});return target}function _defineProperty(obj,key,value){return key=_toPropertyKey(key),key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}function _toPropertyKey(arg){var key=_toPrimitive(arg,"string");return"symbol"===_typeof(key)?key:key+""}function _toPrimitive(input,hint){if("object"!==_typeof(input)||null===input)return input;var prim=input[Symbol.toPrimitive];if(prim!==void 0){var res=prim.call(input,hint||"default");if("object"!==_typeof(res))return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}var setup=function(props){var utils=(0,_testUtils.render)(/*#__PURE__*/(0,_jsxRuntime.jsx)(_.Card,_objectSpread({},props)));return utils};describe("Card",function(){it("Should render a empty card",function(){var _setup=setup({}),container=_setup.container;expect(container).toBeInTheDocument()}),it("Should render a card with padding",function(){var _setup2=setup({cardPadding:"32px"}),container=_setup2.container;expect(container).toBeInTheDocument()})});
|
|
@@ -1,44 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.Card = Card;
|
|
8
|
-
var _theme = require("../../shared/theme");
|
|
9
|
-
var _styles = require("./styles");
|
|
10
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
-
var _excluded = ["cardPadding", "borderRadius", "variant", "boxShadow", "bgColor", "children"];
|
|
12
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
13
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
14
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
15
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
16
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
17
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
18
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
19
|
-
function Card(_ref) {
|
|
20
|
-
var _ref$cardPadding = _ref.cardPadding,
|
|
21
|
-
cardPadding = _ref$cardPadding === void 0 ? '10px' : _ref$cardPadding,
|
|
22
|
-
_ref$borderRadius = _ref.borderRadius,
|
|
23
|
-
borderRadius = _ref$borderRadius === void 0 ? '0.5rem' : _ref$borderRadius,
|
|
24
|
-
_ref$variant = _ref.variant,
|
|
25
|
-
variant = _ref$variant === void 0 ? 'solid' : _ref$variant,
|
|
26
|
-
_ref$boxShadow = _ref.boxShadow,
|
|
27
|
-
boxShadow = _ref$boxShadow === void 0 ? 'shadow.level1' : _ref$boxShadow,
|
|
28
|
-
bgColor = _ref.bgColor,
|
|
29
|
-
children = _ref.children,
|
|
30
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
31
|
-
var _useTheme = (0, _theme.useTheme)(),
|
|
32
|
-
theme = _useTheme.theme;
|
|
33
|
-
var splitBoxShadow = boxShadow && boxShadow.indexOf('shadow') > -1 ? boxShadow.split('.') : null;
|
|
34
|
-
var boxShadowValue = splitBoxShadow ? theme.shadow[splitBoxShadow[1]] : boxShadow;
|
|
35
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.CardBody, _objectSpread(_objectSpread({
|
|
36
|
-
cardPadding: cardPadding,
|
|
37
|
-
borderRadius: borderRadius,
|
|
38
|
-
variant: variant,
|
|
39
|
-
boxShadow: boxShadowValue,
|
|
40
|
-
bgColor: bgColor
|
|
41
|
-
}, rest), {}, {
|
|
42
|
-
children: children
|
|
43
|
-
}));
|
|
44
|
-
}
|
|
1
|
+
"use strict";function _typeof(obj){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},_typeof(obj)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.Card=Card;var _theme=require("../../shared/theme"),_styles=require("./styles"),_jsxRuntime=require("react/jsx-runtime"),_excluded=["cardPadding","borderRadius","variant","boxShadow","bgColor","children"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})),keys.push.apply(keys,symbols)}return keys}function _objectSpread(target){for(var source,i=1;i<arguments.length;i++)source=null==arguments[i]?{}:arguments[i],i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key])}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))});return target}function _defineProperty(obj,key,value){return key=_toPropertyKey(key),key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}function _toPropertyKey(arg){var key=_toPrimitive(arg,"string");return"symbol"===_typeof(key)?key:key+""}function _toPrimitive(input,hint){if("object"!==_typeof(input)||null===input)return input;var prim=input[Symbol.toPrimitive];if(prim!==void 0){var res=prim.call(input,hint||"default");if("object"!==_typeof(res))return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}function _objectWithoutProperties(source,excluded){if(null==source)return{};var key,i,target=_objectWithoutPropertiesLoose(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],0<=excluded.indexOf(key)||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}function _objectWithoutPropertiesLoose(source,excluded){if(null==source)return{};var key,i,target={},sourceKeys=Object.keys(source);for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],0<=excluded.indexOf(key)||(target[key]=source[key]);return target}function Card(_ref){var _ref$cardPadding=_ref.cardPadding,cardPadding=void 0===_ref$cardPadding?"10px":_ref$cardPadding,_ref$borderRadius=_ref.borderRadius,borderRadius=void 0===_ref$borderRadius?"0.5rem":_ref$borderRadius,_ref$variant=_ref.variant,variant=void 0===_ref$variant?"solid":_ref$variant,_ref$boxShadow=_ref.boxShadow,boxShadow=void 0===_ref$boxShadow?"shadow.level1":_ref$boxShadow,bgColor=_ref.bgColor,children=_ref.children,rest=_objectWithoutProperties(_ref,_excluded),_useTheme=(0,_theme.useTheme)(),theme=_useTheme.theme,splitBoxShadow=boxShadow&&-1<boxShadow.indexOf("shadow")?boxShadow.split("."):null,boxShadowValue=splitBoxShadow?theme.shadow[splitBoxShadow[1]]:boxShadow;return/*#__PURE__*/(0,_jsxRuntime.jsx)(_styles.CardBody,_objectSpread(_objectSpread({cardPadding:cardPadding,borderRadius:borderRadius,variant:variant,boxShadow:boxShadowValue,bgColor:bgColor},rest),{},{children:children}))}
|
|
@@ -1,16 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.CardBody = void 0;
|
|
7
|
-
var _react = require("@emotion/react");
|
|
8
|
-
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
9
|
-
var _colorCheck = require("../../utils/colorCheck");
|
|
10
|
-
var _templateObject;
|
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
13
|
-
var CardBody = _styled.default.div(function (props) {
|
|
14
|
-
return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n padding: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n width: 100%;\n background-color: ", ";\n border: ", ";\n color: ", ";\n "])), props.cardPadding, props.borderRadius, props.variant === 'outlined' ? '' : props.boxShadow, props.variant === 'outlined' ? 'transparent' : (0, _colorCheck.stripThemeColors)(props.bgColor || '', props.theme.colors) || props.bgColor, props.variant === 'outlined' ? "2px solid ".concat(props.theme.colors.neutral.neutral1) : '', props.theme.colors.neutral.black);
|
|
15
|
-
});
|
|
16
|
-
exports.CardBody = CardBody;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.CardBody=void 0;var _templateObject,_react=require("@emotion/react"),_styled=_interopRequireDefault(require("@emotion/styled")),_colorCheck=require("../../utils/colorCheck");function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _taggedTemplateLiteral(strings,raw){return raw||(raw=strings.slice(0)),Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}))}var CardBody=_styled.default.div(function(props){return(0,_react.css)(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n padding: ",";\n border-radius: ",";\n box-shadow: ",";\n width: 100%;\n background-color: ",";\n border: ",";\n color: ",";\n "])),props.cardPadding,props.borderRadius,"outlined"===props.variant?"":props.boxShadow,"outlined"===props.variant?"transparent":(0,_colorCheck.stripThemeColors)(props.bgColor||"",props.theme.colors)||props.bgColor,"outlined"===props.variant?"2px solid ".concat(props.theme.colors.neutral.neutral1):"",props.theme.colors.neutral.black)});exports.CardBody=CardBody;
|