baseui 11.0.3 → 11.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/a11y/index.d.ts +1 -1
- package/accordion/index.d.ts +25 -28
- package/app-nav-bar/app-nav-bar.js +33 -40
- package/app-nav-bar/app-nav-bar.js.flow +46 -62
- package/app-nav-bar/index.d.ts +9 -8
- package/app-nav-bar/styled-components.js +83 -29
- package/app-nav-bar/styled-components.js.flow +59 -9
- package/app-nav-bar/types.js.flow +2 -0
- package/aspect-ratio-box/index.d.ts +2 -4
- package/avatar/index.d.ts +6 -12
- package/badge/badge.js +109 -0
- package/badge/badge.js.flow +91 -0
- package/badge/constants.js +54 -0
- package/badge/constants.js.flow +52 -0
- package/badge/hint-dot.js +96 -0
- package/badge/hint-dot.js.flow +68 -0
- package/badge/index.d.ts +97 -0
- package/badge/index.js +80 -0
- package/badge/index.js.flow +20 -0
- package/badge/notification-circle.js +103 -0
- package/badge/notification-circle.js.flow +81 -0
- package/badge/package.json +4 -0
- package/badge/styled-components.js +242 -0
- package/badge/styled-components.js.flow +325 -0
- package/badge/types.js +11 -0
- package/badge/types.js.flow +59 -0
- package/badge/utils.js +33 -0
- package/badge/utils.js.flow +23 -0
- package/banner/banner.js +283 -0
- package/banner/banner.js.flow +253 -0
- package/banner/constants.js +35 -0
- package/banner/constants.js.flow +33 -0
- package/banner/index.d.ts +75 -0
- package/banner/index.js +44 -0
- package/banner/index.js.flow +16 -0
- package/banner/package.json +4 -0
- package/banner/styled-components.js +131 -0
- package/banner/styled-components.js.flow +119 -0
- package/banner/types.js +11 -0
- package/banner/types.js.flow +66 -0
- package/block/index.d.ts +4 -4
- package/breadcrumbs/breadcrumbs.js +5 -1
- package/breadcrumbs/breadcrumbs.js.flow +2 -2
- package/breadcrumbs/index.d.ts +5 -5
- package/button/button.js +2 -1
- package/button/button.js.flow +1 -0
- package/button/index.d.ts +19 -29
- package/button-group/index.d.ts +18 -24
- package/card/index.d.ts +16 -14
- package/checkbox/index.d.ts +17 -21
- package/combobox/index.d.ts +7 -11
- package/data-table/index.d.ts +7 -10
- package/datepicker/index.d.ts +42 -63
- package/datepicker/utils/date-helpers.js +1 -1
- package/datepicker/utils/date-helpers.js.flow +1 -1
- package/dnd-list/index.d.ts +22 -35
- package/drawer/index.d.ts +22 -27
- package/es/app-nav-bar/app-nav-bar.js +9 -19
- package/es/app-nav-bar/styled-components.js +64 -13
- package/es/badge/badge.js +70 -0
- package/es/badge/constants.js +42 -0
- package/es/badge/hint-dot.js +55 -0
- package/es/badge/index.js +11 -0
- package/es/badge/notification-circle.js +65 -0
- package/es/badge/styled-components.js +296 -0
- package/es/badge/types.js +8 -0
- package/es/badge/utils.js +17 -0
- package/es/banner/banner.js +213 -0
- package/es/banner/constants.js +24 -0
- package/es/banner/index.js +9 -0
- package/es/banner/styled-components.js +122 -0
- package/es/banner/types.js +8 -0
- package/es/breadcrumbs/breadcrumbs.js +5 -1
- package/es/button/button.js +1 -0
- package/es/datepicker/utils/date-helpers.js +1 -1
- package/es/file-uploader/file-uploader.js +8 -5
- package/es/helper/helper-steps.js +3 -1
- package/es/input/base-input.js +18 -11
- package/es/input/input.js +15 -10
- package/es/input/masked-input.js +5 -2
- package/es/input/utils.js +4 -2
- package/es/locale/tr_TR.js +115 -0
- package/es/notification/notification.js +16 -1
- package/es/payment-card/custom-cards.config.js +22 -0
- package/es/payment-card/icons/uatp.js +52 -0
- package/es/payment-card/payment-card.js +8 -3
- package/es/popover/popover.js +2 -1
- package/es/popover/stateful-container.js +2 -0
- package/es/popover/styled-components.js +2 -1
- package/es/progress-steps/numbered-step.js +2 -2
- package/es/select/select-component.js +38 -21
- package/es/table-semantic/styled-components.js +14 -0
- package/es/table-semantic/table-builder.js +12 -5
- package/es/textarea/textarea.js +15 -9
- package/es/themes/dark-theme/color-component-tokens.js +8 -0
- package/es/themes/light-theme/color-component-tokens.js +8 -0
- package/es/tree-view/tree-label.js +9 -1
- package/esm/app-nav-bar/app-nav-bar.js +32 -38
- package/esm/app-nav-bar/styled-components.js +79 -28
- package/esm/badge/badge.js +97 -0
- package/esm/badge/constants.js +42 -0
- package/esm/badge/hint-dot.js +83 -0
- package/esm/badge/index.js +11 -0
- package/esm/badge/notification-circle.js +91 -0
- package/esm/badge/styled-components.js +235 -0
- package/esm/badge/types.js +8 -0
- package/esm/badge/utils.js +17 -0
- package/esm/banner/banner.js +271 -0
- package/esm/banner/constants.js +24 -0
- package/esm/banner/index.js +9 -0
- package/esm/banner/styled-components.js +113 -0
- package/esm/banner/types.js +8 -0
- package/esm/breadcrumbs/breadcrumbs.js +5 -1
- package/esm/button/button.js +2 -1
- package/esm/datepicker/utils/date-helpers.js +1 -1
- package/esm/file-uploader/file-uploader.js +23 -8
- package/esm/helper/helper-steps.js +3 -1
- package/esm/input/base-input.js +18 -11
- package/esm/input/input.js +15 -10
- package/esm/input/masked-input.js +6 -3
- package/esm/input/utils.js +4 -2
- package/esm/locale/tr_TR.js +115 -0
- package/esm/notification/notification.js +17 -1
- package/esm/payment-card/custom-cards.config.js +22 -0
- package/esm/payment-card/icons/uatp.js +53 -0
- package/esm/payment-card/payment-card.js +9 -7
- package/esm/popover/popover.js +2 -1
- package/esm/popover/stateful-container.js +2 -0
- package/esm/popover/styled-components.js +3 -2
- package/esm/progress-steps/numbered-step.js +2 -2
- package/esm/select/select-component.js +75 -57
- package/esm/table-semantic/styled-components.js +31 -18
- package/esm/table-semantic/table-builder.js +34 -23
- package/esm/textarea/textarea.js +15 -9
- package/esm/themes/dark-theme/color-component-tokens.js +8 -0
- package/esm/themes/light-theme/color-component-tokens.js +8 -0
- package/esm/tree-view/tree-label.js +10 -2
- package/file-uploader/file-uploader.js +23 -8
- package/file-uploader/file-uploader.js.flow +18 -5
- package/file-uploader/index.d.ts +11 -11
- package/file-uploader/types.js.flow +3 -0
- package/flex-grid/index.d.ts +3 -3
- package/form-control/index.d.ts +7 -19
- package/header-navigation/index.d.ts +8 -9
- package/heading/index.d.ts +3 -4
- package/helper/helper-steps.js +19 -13
- package/helper/helper-steps.js.flow +3 -1
- package/helper/index.d.ts +7 -7
- package/helpers/base-provider.d.ts +16 -0
- package/helpers/overrides.d.ts +23 -0
- package/icon/index.d.ts +32 -32
- package/index.d.ts +34 -99
- package/input/base-input.js +18 -11
- package/input/base-input.js.flow +18 -6
- package/input/index.d.ts +29 -32
- package/input/input.js +15 -10
- package/input/input.js.flow +10 -5
- package/input/masked-input.js +6 -3
- package/input/masked-input.js.flow +3 -0
- package/input/types.js.flow +4 -0
- package/input/utils.js +4 -2
- package/input/utils.js.flow +2 -1
- package/layer/index.d.ts +6 -11
- package/layout-grid/index.d.ts +25 -7
- package/link/index.d.ts +2 -2
- package/list/index.d.ts +26 -31
- package/{locale.ts → locale/index.d.ts} +8 -0
- package/locale/tr_TR.js +123 -0
- package/locale/tr_TR.js.flow +124 -0
- package/map-marker/index.d.ts +41 -47
- package/menu/index.d.ts +27 -37
- package/modal/index.d.ts +28 -38
- package/notification/index.d.ts +2 -3
- package/notification/notification.js +18 -1
- package/notification/notification.js.flow +15 -1
- package/overrides.ts +2 -22
- package/package.json +26 -17
- package/pagination/index.d.ts +22 -26
- package/payment-card/custom-cards.config.js +30 -0
- package/payment-card/custom-cards.config.js.flow +29 -0
- package/payment-card/icons/uatp.js +67 -0
- package/payment-card/icons/uatp.js.flow +62 -0
- package/payment-card/index.d.ts +8 -8
- package/payment-card/payment-card.js +12 -7
- package/payment-card/payment-card.js.flow +12 -0
- package/phone-input/index.d.ts +261 -269
- package/pin-code/index.d.ts +11 -18
- package/popover/index.d.ts +39 -55
- package/popover/popover.js +2 -1
- package/popover/popover.js.flow +2 -1
- package/popover/stateful-container.js +2 -0
- package/popover/stateful-container.js.flow +2 -0
- package/popover/styled-components.js +3 -2
- package/popover/styled-components.js.flow +2 -1
- package/popover/types.js.flow +1 -0
- package/progress-bar/index.d.ts +11 -12
- package/progress-steps/index.d.ts +16 -16
- package/progress-steps/numbered-step.js.flow +2 -2
- package/radio/index.d.ts +12 -15
- package/rating/index.d.ts +9 -12
- package/select/index.d.ts +33 -36
- package/select/select-component.js +72 -54
- package/select/select-component.js.flow +35 -30
- package/side-navigation/index.d.ts +11 -13
- package/skeleton/index.d.ts +1 -1
- package/slider/index.d.ts +17 -26
- package/snackbar/index.d.ts +8 -8
- package/spinner/index.d.ts +2 -2
- package/styles/index.d.ts +82 -2
- package/table/index.d.ts +16 -16
- package/table-grid/index.d.ts +6 -8
- package/table-semantic/index.d.ts +26 -32
- package/table-semantic/styled-components.js +33 -19
- package/table-semantic/styled-components.js.flow +12 -0
- package/table-semantic/table-builder.js +38 -22
- package/table-semantic/table-builder.js.flow +32 -17
- package/table-semantic/types.js.flow +1 -0
- package/tabs/index.d.ts +20 -23
- package/tabs-motion/index.d.ts +23 -23
- package/tag/index.d.ts +14 -18
- package/textarea/index.d.ts +11 -14
- package/textarea/textarea.js +15 -9
- package/textarea/textarea.js.flow +11 -5
- package/textarea/types.js.flow +1 -0
- package/theme.ts +36 -777
- package/themes/dark-theme/color-component-tokens.js +8 -0
- package/themes/dark-theme/color-component-tokens.js.flow +9 -0
- package/themes/index.d.ts +765 -0
- package/themes/light-theme/color-component-tokens.js +8 -0
- package/themes/light-theme/color-component-tokens.js.flow +9 -0
- package/themes/types.js.flow +9 -0
- package/timepicker/index.d.ts +5 -8
- package/timezonepicker/index.d.ts +5 -8
- package/toast/index.d.ts +26 -40
- package/tokens/index.d.ts +1 -1
- package/tooltip/index.d.ts +7 -9
- package/tree-view/index.d.ts +15 -19
- package/tree-view/tree-label.js +10 -2
- package/tree-view/tree-label.js.flow +4 -4
- package/typography/index.d.ts +37 -37
|
@@ -32,14 +32,16 @@ var MaskOverride = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
32
32
|
onBlur = _ref.onBlur,
|
|
33
33
|
value = _ref.value,
|
|
34
34
|
disabled = _ref.disabled,
|
|
35
|
-
|
|
35
|
+
readOnly = _ref.readOnly,
|
|
36
|
+
restProps = _objectWithoutProperties(_ref, ["startEnhancer", "endEnhancer", "error", "positive", "onChange", "onFocus", "onBlur", "value", "disabled", "readOnly"]);
|
|
36
37
|
|
|
37
38
|
return /*#__PURE__*/React.createElement(InputMask, _extends({
|
|
38
39
|
onChange: onChange,
|
|
39
40
|
onFocus: onFocus,
|
|
40
41
|
onBlur: onBlur,
|
|
41
42
|
value: value,
|
|
42
|
-
disabled: disabled
|
|
43
|
+
disabled: disabled,
|
|
44
|
+
readOnly: readOnly
|
|
43
45
|
}, restProps), function (props) {
|
|
44
46
|
return /*#__PURE__*/React.createElement(StyledInput, _extends({
|
|
45
47
|
ref: ref,
|
|
@@ -47,7 +49,8 @@ var MaskOverride = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
47
49
|
onFocus: onFocus,
|
|
48
50
|
onBlur: onBlur,
|
|
49
51
|
value: value,
|
|
50
|
-
disabled: disabled
|
|
52
|
+
disabled: disabled,
|
|
53
|
+
readOnly: readOnly
|
|
51
54
|
}, props));
|
|
52
55
|
});
|
|
53
56
|
});
|
package/esm/input/utils.js
CHANGED
|
@@ -10,7 +10,8 @@ export function getSharedProps(props, state) {
|
|
|
10
10
|
positive = props.positive,
|
|
11
11
|
adjoined = props.adjoined,
|
|
12
12
|
size = props.size,
|
|
13
|
-
required = props.required
|
|
13
|
+
required = props.required,
|
|
14
|
+
readOnly = props.readOnly;
|
|
14
15
|
var isFocused = state.isFocused;
|
|
15
16
|
return {
|
|
16
17
|
$isFocused: isFocused,
|
|
@@ -19,6 +20,7 @@ export function getSharedProps(props, state) {
|
|
|
19
20
|
$positive: positive,
|
|
20
21
|
$adjoined: adjoined,
|
|
21
22
|
$size: size,
|
|
22
|
-
$required: required
|
|
23
|
+
$required: required,
|
|
24
|
+
$isReadOnly: readOnly
|
|
23
25
|
};
|
|
24
26
|
}
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
/*
|
|
2
|
+
Copyright (c) Uber Technologies, Inc.
|
|
3
|
+
|
|
4
|
+
This source code is licensed under the MIT license found in the
|
|
5
|
+
LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
export default {
|
|
8
|
+
accordion: {
|
|
9
|
+
collapse: 'Daralt',
|
|
10
|
+
expand: 'Genişlet'
|
|
11
|
+
},
|
|
12
|
+
breadcrumbs: {
|
|
13
|
+
ariaLabel: 'Navigasyon'
|
|
14
|
+
},
|
|
15
|
+
datepicker: {
|
|
16
|
+
ariaLabel: 'Bir tarih seçin.',
|
|
17
|
+
ariaLabelRange: 'Bir tarih aralığı seçin',
|
|
18
|
+
ariaLabelCalendar: 'Takvim',
|
|
19
|
+
ariaRoleDescriptionCalendarMonth: 'Aylık Takvim',
|
|
20
|
+
previousMonth: 'Geçtiğimiz ay.',
|
|
21
|
+
nextMonth: 'Gelecek ay.',
|
|
22
|
+
pastWeek: 'Geçen Hafta',
|
|
23
|
+
pastMonth: 'Geçen Ay',
|
|
24
|
+
pastThreeMonths: 'Son 3 Ay',
|
|
25
|
+
pastSixMonths: 'Son 6 Ay',
|
|
26
|
+
pastYear: 'Geçen Yıl',
|
|
27
|
+
pastTwoYears: 'Son 2 Yıl',
|
|
28
|
+
screenReaderMessageInput: 'Takvimle etkileşim kurmak ve bir tarih seçmek için aşağı ok tuşuna basın. Takvimi kapatmak için kaçış (ESC) düğmesine basın.',
|
|
29
|
+
selectedDate: 'Seçilen tarih ${date}.',
|
|
30
|
+
selectedDateRange: 'Seçilen tarih aralığı ${startDate} ile ${endDate} arasındadır.',
|
|
31
|
+
selectSecondDatePrompt: 'İkinci tarihi seçin.',
|
|
32
|
+
quickSelectLabel: 'Bir tarih aralığı seçin',
|
|
33
|
+
quickSelectAriaLabel: 'Bir tarih aralığı seçin',
|
|
34
|
+
quickSelectPlaceholder: 'Hiçbiri',
|
|
35
|
+
timeSelectEndLabel: 'Bitiş zamanı',
|
|
36
|
+
timeSelectStartLabel: 'Başlangıç zamanı',
|
|
37
|
+
timePickerAriaLabel12Hour: 'Bir zaman seçin, 12-saat formatında.',
|
|
38
|
+
timePickerAriaLabel24Hour: 'Bir zaman seçin, 24-saat formatında.',
|
|
39
|
+
timezonePickerAriaLabel: 'Bir saat dilimi seçin.',
|
|
40
|
+
selectedStartDateLabel: 'Seçilen başlangıç tarihi.',
|
|
41
|
+
selectedEndDateLabel: 'Seçilen bitiş tarihi.',
|
|
42
|
+
dateNotAvailableLabel: 'Kullanılabilir değil.',
|
|
43
|
+
dateAvailableLabel: 'Kullanılabilir.',
|
|
44
|
+
selectedLabel: 'Seçildi.',
|
|
45
|
+
chooseLabel: 'Seç'
|
|
46
|
+
},
|
|
47
|
+
datatable: {
|
|
48
|
+
emptyState: 'Tanımlanan filtre kriterleriyle eşleşen satır yok. Daha fazla veri görüntülemek için lütfen bir veya daha fazla filtreyi kaldırın.',
|
|
49
|
+
loadingState: 'Satır yükleniyor.',
|
|
50
|
+
searchAriaLabel: 'Metne göre ara',
|
|
51
|
+
filterAdd: 'Filtre Ekle',
|
|
52
|
+
filterExclude: 'Dahil etme',
|
|
53
|
+
filterApply: 'Uygula',
|
|
54
|
+
filterExcludeRange: 'Exclude range',
|
|
55
|
+
filterExcludeValue: 'Exclude value',
|
|
56
|
+
filterAppliedTo: 'uygulanan filtre',
|
|
57
|
+
optionsLabel: 'Filtrelenecek sütunu seçin',
|
|
58
|
+
optionsSearch: 'Filtrelemek için bir sütun arayın...',
|
|
59
|
+
optionsEmpty: 'Sütun yok.',
|
|
60
|
+
categoricalFilterSelectAll: 'Tümünü Seç',
|
|
61
|
+
categoricalFilterSelectClear: 'Temizle',
|
|
62
|
+
categoricalFilterEmpty: 'Kategori bulunamadı',
|
|
63
|
+
datetimeFilterRange: 'Aralık',
|
|
64
|
+
datetimeFilterRangeDatetime: 'Tarih, Zaman',
|
|
65
|
+
datetimeFilterRangeDate: 'Tarih',
|
|
66
|
+
datetimeFilterRangeTime: 'Zaman',
|
|
67
|
+
datetimeFilterCategorical: 'Kategorik',
|
|
68
|
+
datetimeFilterCategoricalWeekday: 'Hafta içi',
|
|
69
|
+
datetimeFilterCategoricalMonth: 'Ay',
|
|
70
|
+
datetimeFilterCategoricalQuarter: 'Çeyrek',
|
|
71
|
+
datetimeFilterCategoricalHalf: 'Yarım',
|
|
72
|
+
datetimeFilterCategoricalFirstHalf: 'H1',
|
|
73
|
+
datetimeFilterCategoricalSecondHalf: 'H2',
|
|
74
|
+
datetimeFilterCategoricalYear: 'Yıl',
|
|
75
|
+
numericalFilterRange: 'Aralık',
|
|
76
|
+
numericalFilterSingleValue: 'Single Value',
|
|
77
|
+
booleanFilterTrue: 'doğru',
|
|
78
|
+
booleanFilterFalse: 'yanlış',
|
|
79
|
+
booleanColumnTrueShort: 'D',
|
|
80
|
+
booleanColumnFalseShort: 'Y'
|
|
81
|
+
},
|
|
82
|
+
buttongroup: {
|
|
83
|
+
ariaLabel: 'buton grup'
|
|
84
|
+
},
|
|
85
|
+
fileuploader: {
|
|
86
|
+
dropFilesToUpload: 'Dosyaları yüklemek için buraya bırakın...',
|
|
87
|
+
or: '',
|
|
88
|
+
browseFiles: 'Dosyalara göz atın',
|
|
89
|
+
retry: 'Yüklemeyi Yeniden Dene',
|
|
90
|
+
cancel: 'İptal'
|
|
91
|
+
},
|
|
92
|
+
menu: {
|
|
93
|
+
noResultsMsg: 'Sonuç yok',
|
|
94
|
+
parentMenuItemAriaLabel: 'Şu anda iç içe bir liste kutusu açan bir öğedesiniz. Bu öğeye girmek için sağ ok ve geri dönmek için sol ok tuşuna basın.'
|
|
95
|
+
},
|
|
96
|
+
modal: {
|
|
97
|
+
close: 'Kapat'
|
|
98
|
+
},
|
|
99
|
+
drawer: {
|
|
100
|
+
close: 'Kapat'
|
|
101
|
+
},
|
|
102
|
+
pagination: {
|
|
103
|
+
prev: 'Önceki',
|
|
104
|
+
next: 'Sonraki',
|
|
105
|
+
preposition: 'nın'
|
|
106
|
+
},
|
|
107
|
+
select: {
|
|
108
|
+
noResultsMsg: 'Sonuç bulunamadı',
|
|
109
|
+
placeholder: 'Seç...',
|
|
110
|
+
create: 'Oluştur'
|
|
111
|
+
},
|
|
112
|
+
toast: {
|
|
113
|
+
close: 'Kapat'
|
|
114
|
+
}
|
|
115
|
+
};
|
|
@@ -32,6 +32,7 @@ LICENSE file in the root directory of this source tree.
|
|
|
32
32
|
*/
|
|
33
33
|
import * as React from 'react';
|
|
34
34
|
import { Toast, TYPE } from '../toast/index.js';
|
|
35
|
+
import { mergeOverrides } from '../helpers/overrides.js';
|
|
35
36
|
|
|
36
37
|
var Notification = /*#__PURE__*/function (_React$Component) {
|
|
37
38
|
_inherits(Notification, _React$Component);
|
|
@@ -47,9 +48,24 @@ var Notification = /*#__PURE__*/function (_React$Component) {
|
|
|
47
48
|
_createClass(Notification, [{
|
|
48
49
|
key: "render",
|
|
49
50
|
value: function render() {
|
|
51
|
+
var overrides = mergeOverrides({
|
|
52
|
+
Body: {
|
|
53
|
+
style: function style(_ref) {
|
|
54
|
+
var $theme = _ref.$theme;
|
|
55
|
+
return {
|
|
56
|
+
marginTop: $theme.sizing.scale600,
|
|
57
|
+
marginRight: $theme.sizing.scale600,
|
|
58
|
+
marginBottom: $theme.sizing.scale600,
|
|
59
|
+
marginLeft: $theme.sizing.scale600
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
}, this.props.overrides);
|
|
50
64
|
return /*#__PURE__*/React.createElement(Toast, _extends({
|
|
51
65
|
"data-baseweb": "notification"
|
|
52
|
-
}, this.props
|
|
66
|
+
}, this.props, {
|
|
67
|
+
overrides: overrides
|
|
68
|
+
}));
|
|
53
69
|
}
|
|
54
70
|
}]);
|
|
55
71
|
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/*
|
|
2
|
+
Copyright (c) Uber Technologies, Inc.
|
|
3
|
+
|
|
4
|
+
This source code is licensed under the MIT license found in the
|
|
5
|
+
LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
/*
|
|
9
|
+
This file should be used for adding new card type configuration
|
|
10
|
+
*/
|
|
11
|
+
var UATP_CARD_TYPE_CONFIG = {
|
|
12
|
+
niceType: 'Uatp',
|
|
13
|
+
type: 'uatp',
|
|
14
|
+
patterns: [[1001, 1999]],
|
|
15
|
+
gaps: [4, 9],
|
|
16
|
+
lengths: [15],
|
|
17
|
+
code: {
|
|
18
|
+
name: 'CVV',
|
|
19
|
+
size: 0
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
export var CUSTOM_CARDS_CONFIGURATION = [UATP_CARD_TYPE_CONFIG];
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
/*
|
|
2
|
+
Copyright (c) Uber Technologies, Inc.
|
|
3
|
+
|
|
4
|
+
This source code is licensed under the MIT license found in the
|
|
5
|
+
LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
|
|
9
|
+
var UatpIcon = function UatpIcon(_ref) {
|
|
10
|
+
var size = _ref.size;
|
|
11
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
12
|
+
width: size,
|
|
13
|
+
height: size,
|
|
14
|
+
viewBox: "0 0 24 24",
|
|
15
|
+
fill: "none",
|
|
16
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
17
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
18
|
+
d: "M23 4H1V20H23V4Z",
|
|
19
|
+
fill: "#F0F0F0"
|
|
20
|
+
}), /*#__PURE__*/React.createElement("g", {
|
|
21
|
+
clipPath: "url(#clip0_90345_28085)"
|
|
22
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
23
|
+
d: "M10.5057 9.64723H10.1817H9.70679V10.9659L10.3044 12.6255L11.4708 12.133L10.5057 9.64723Z",
|
|
24
|
+
fill: "#0A2C1B"
|
|
25
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
26
|
+
d: "M6.34592 14.6471L6.34001 9.64723H5.07682V13.7451C4.94173 13.7928 4.80176 13.8253 4.65948 13.8421C4.38337 13.8743 3.9371 13.9265 3.60459 13.6339C3.27002 13.3394 3.26507 12.8846 3.26655 12.7802V9.64723H2.00336V12.7802C1.96122 13.7182 2.32658 14.1754 2.45948 14.3209C3.17638 15.1058 4.54287 14.9387 5.39513 14.8345C5.71171 14.7958 6.02491 14.7331 6.33204 14.6471L6.32786 14.6427L6.34592 14.6471Z",
|
|
27
|
+
fill: "#0A2C1B"
|
|
28
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
29
|
+
d: "M21.999 11.453C21.9951 11.2269 21.9447 10.4929 21.3738 10.0162C21.1483 9.82795 20.9283 9.75218 20.7469 9.6897C20.5867 9.63455 20.2633 9.54148 19.3754 9.58086C18.9585 9.59952 18.5429 9.64148 18.1306 9.70653V14.8388H19.3938V13.3179C19.4958 13.3263 19.6189 13.3331 19.7586 13.3337C19.9448 13.3351 20.1309 13.325 20.3158 13.3033C20.4802 13.2817 21.266 13.1786 21.709 12.5414C22.0104 12.1079 22.0024 11.6443 21.999 11.453ZM20.5118 11.9928C20.3546 12.1594 20.1557 12.1903 19.9414 12.2236C19.7608 12.2514 19.5768 12.2484 19.3972 12.2148V10.7433C19.4924 10.7303 19.5885 10.7245 19.6845 10.7259C19.9706 10.73 20.2799 10.7344 20.4943 10.9523C20.6881 11.1491 20.6983 11.4123 20.699 11.4747C20.6996 11.5392 20.6985 11.7948 20.5118 11.9928Z",
|
|
30
|
+
fill: "#0A2C1B"
|
|
31
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
32
|
+
d: "M10.4995 13.1673L11.1015 14.8388H12.5212L11.6926 12.7045C11.3054 12.8761 10.9077 13.0304 10.4995 13.1673Z",
|
|
33
|
+
fill: "#0A2C1B"
|
|
34
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
35
|
+
d: "M6.60772 13.6849C6.59882 13.6856 6.59 13.6828 6.58303 13.6773C6.57607 13.6717 6.57148 13.6637 6.57019 13.6548C6.56891 13.646 6.57102 13.637 6.5761 13.6297C6.58119 13.6223 6.58887 13.6172 6.59759 13.6153C7.44534 13.4378 8.27682 13.1899 9.08338 12.8742C12.0436 11.7142 12.5355 10.4597 14.7222 9.60822C17.2224 8.63467 19.7225 9.06335 20.7271 9.30762C20.7338 9.30921 20.7396 9.31329 20.7433 9.31903C20.7471 9.32476 20.7485 9.3317 20.7473 9.33844C20.746 9.34518 20.7423 9.35119 20.7368 9.35525C20.7313 9.35931 20.7244 9.3611 20.7176 9.36026C19.7189 9.24529 18.7085 9.28396 17.7216 9.47491C15.1767 9.96677 14.237 11.2345 11.9094 12.341C10.7268 12.9032 8.98995 13.517 6.60772 13.6849Z",
|
|
36
|
+
fill: "#3EB54A"
|
|
37
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
38
|
+
d: "M16.9918 9.64723H12.6013V10.7793H14.1649V14.8388H15.4281V10.7793H16.9918V9.64723Z",
|
|
39
|
+
fill: "#0A2C1B"
|
|
40
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
41
|
+
d: "M9.23192 9.64723H8.95198L6.93652 14.8388H8.31211L9.70682 10.9659V9.64723H9.23192Z",
|
|
42
|
+
fill: "#0A2C1B"
|
|
43
|
+
})), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
|
|
44
|
+
id: "clip0_90345_28085"
|
|
45
|
+
}, /*#__PURE__*/React.createElement("rect", {
|
|
46
|
+
width: "20",
|
|
47
|
+
height: "5.92493",
|
|
48
|
+
fill: "white",
|
|
49
|
+
transform: "translate(2 9)"
|
|
50
|
+
}))));
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
export default UatpIcon;
|
|
@@ -66,7 +66,9 @@ import MaestroIcon from './icons/maestro.js';
|
|
|
66
66
|
import MastercardIcon from './icons/mastercard.js';
|
|
67
67
|
import UnionPayIcon from './icons/unionpay.js';
|
|
68
68
|
import VisaIcon from './icons/visa.js';
|
|
69
|
+
import UatpIcon from './icons/uatp.js';
|
|
69
70
|
import { IconWrapper as StyledIconWrapper } from './styled-components.js';
|
|
71
|
+
import { CUSTOM_CARDS_CONFIGURATION } from './custom-cards.config.js';
|
|
70
72
|
var CardTypeToComponent = {
|
|
71
73
|
visa: VisaIcon,
|
|
72
74
|
mastercard: MastercardIcon,
|
|
@@ -77,7 +79,8 @@ var CardTypeToComponent = {
|
|
|
77
79
|
unionpay: UnionPayIcon,
|
|
78
80
|
maestro: MaestroIcon,
|
|
79
81
|
elo: EloIcon,
|
|
80
|
-
generic: GenericIcon
|
|
82
|
+
generic: GenericIcon,
|
|
83
|
+
uatp: UatpIcon
|
|
81
84
|
};
|
|
82
85
|
|
|
83
86
|
var PaymentCard = /*#__PURE__*/function (_React$Component) {
|
|
@@ -85,21 +88,20 @@ var PaymentCard = /*#__PURE__*/function (_React$Component) {
|
|
|
85
88
|
|
|
86
89
|
var _super = _createSuper(PaymentCard);
|
|
87
90
|
|
|
88
|
-
function PaymentCard() {
|
|
91
|
+
function PaymentCard(props) {
|
|
89
92
|
var _this;
|
|
90
93
|
|
|
91
94
|
_classCallCheck(this, PaymentCard);
|
|
92
95
|
|
|
93
|
-
|
|
94
|
-
args[_key] = arguments[_key];
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
_this = _super.call.apply(_super, [this].concat(args));
|
|
96
|
+
_this = _super.call(this, props); // For adding new custom card type, add card config to custom-cards.config.js
|
|
98
97
|
|
|
99
98
|
_defineProperty(_assertThisInitialized(_this), "caretPosition", 0);
|
|
100
99
|
|
|
101
100
|
_defineProperty(_assertThisInitialized(_this), "inRef", null);
|
|
102
101
|
|
|
102
|
+
CUSTOM_CARDS_CONFIGURATION.forEach(function (cardTypeConfig) {
|
|
103
|
+
return valid.creditCardType.addCard(cardTypeConfig);
|
|
104
|
+
});
|
|
103
105
|
return _this;
|
|
104
106
|
}
|
|
105
107
|
|
package/esm/popover/popover.js
CHANGED
|
@@ -398,6 +398,7 @@ var PopoverInner = /*#__PURE__*/function (_React$Component) {
|
|
|
398
398
|
$popoverOffset: popoverOffset,
|
|
399
399
|
$placement: placement,
|
|
400
400
|
$isAnimating: isAnimating,
|
|
401
|
+
$animationDuration: this.props.animateOutTime || ANIMATE_OUT_TIME,
|
|
401
402
|
$isOpen: isOpen,
|
|
402
403
|
$popoverMargin: popoverMargin,
|
|
403
404
|
$isHoverTrigger: this.isHoverTrigger()
|
|
@@ -469,7 +470,7 @@ var PopoverInner = /*#__PURE__*/function (_React$Component) {
|
|
|
469
470
|
value: function render() {
|
|
470
471
|
var _this4 = this;
|
|
471
472
|
|
|
472
|
-
var mountedAndOpen = this.state.isMounted && this.props.isOpen;
|
|
473
|
+
var mountedAndOpen = this.state.isMounted && (this.props.isOpen || this.state.isAnimating);
|
|
473
474
|
var rendered = [this.renderAnchor()];
|
|
474
475
|
var renderedContent = mountedAndOpen || this.props.renderAll ? this.renderContent() : null;
|
|
475
476
|
var defaultPopperOptions = {
|
|
@@ -187,6 +187,7 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
|
|
|
187
187
|
var _this$props = this.props,
|
|
188
188
|
accessibilityType = _this$props.accessibilityType,
|
|
189
189
|
autoFocus = _this$props.autoFocus,
|
|
190
|
+
animateOutTime = _this$props.animateOutTime,
|
|
190
191
|
dismissOnClickOutside = _this$props.dismissOnClickOutside,
|
|
191
192
|
dismissOnEsc = _this$props.dismissOnEsc,
|
|
192
193
|
focusLock = _this$props.focusLock,
|
|
@@ -210,6 +211,7 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
|
|
|
210
211
|
focusOptions = _this$props.focusOptions;
|
|
211
212
|
var popoverProps = {
|
|
212
213
|
accessibilityType: accessibilityType,
|
|
214
|
+
animateOutTime: animateOutTime,
|
|
213
215
|
autoFocus: autoFocus,
|
|
214
216
|
content: this.renderContent,
|
|
215
217
|
focusLock: focusLock,
|
|
@@ -18,7 +18,8 @@ import { getPopoverMarginStyles, getArrowPositionStyles, getStartPosition, getEn
|
|
|
18
18
|
* Main popover container element that gets positioned next to the anchor
|
|
19
19
|
*/
|
|
20
20
|
export function getBodyStyles(props) {
|
|
21
|
-
var $
|
|
21
|
+
var $animationDuration = props.$animationDuration,
|
|
22
|
+
$isOpen = props.$isOpen,
|
|
22
23
|
$isAnimating = props.$isAnimating,
|
|
23
24
|
$placement = props.$placement,
|
|
24
25
|
$popoverOffset = props.$popoverOffset,
|
|
@@ -37,7 +38,7 @@ export function getBodyStyles(props) {
|
|
|
37
38
|
borderBottomLeftRadius: $theme.borders.popoverBorderRadius,
|
|
38
39
|
boxShadow: $theme.lighting.shadow600,
|
|
39
40
|
transitionProperty: 'opacity,transform',
|
|
40
|
-
transitionDuration: $isAnimating ? '0.1s' : '0s',
|
|
41
|
+
transitionDuration: $isAnimating ? $isOpen ? '0.1s' : "".concat($animationDuration, "ms") : '0s',
|
|
41
42
|
transitionTimingFunction: $isOpen ? $theme.animation.easeOutCurve : $theme.animation.easeInCurve,
|
|
42
43
|
opacity: $isAnimating && $isOpen ? 1 : 0,
|
|
43
44
|
transform: $isAnimating && $isOpen ? getEndPosition($popoverOffset) : getStartPosition($popoverOffset, $placement, $showArrow ? ARROW_SIZE : 0, $popoverMargin)
|
|
@@ -21,7 +21,7 @@ LICENSE file in the root directory of this source tree.
|
|
|
21
21
|
import * as React from 'react';
|
|
22
22
|
import { getOverrides } from '../helpers/overrides.js';
|
|
23
23
|
import { StyledNumberStep, StyledNumberIcon, StyledContent, StyledContentTitle, StyledNumberContentTail, StyledContentDescription } from './styled-components.js';
|
|
24
|
-
import
|
|
24
|
+
import Check from '../icon/check.js';
|
|
25
25
|
|
|
26
26
|
function NumberedStep(_ref) {
|
|
27
27
|
var _ref$overrides = _ref.overrides,
|
|
@@ -63,7 +63,7 @@ function NumberedStep(_ref) {
|
|
|
63
63
|
Description = _getOverrides12[0],
|
|
64
64
|
descriptionProps = _getOverrides12[1];
|
|
65
65
|
|
|
66
|
-
var _getOverrides13 = getOverrides(overrides.Icon,
|
|
66
|
+
var _getOverrides13 = getOverrides(overrides.Icon, Check),
|
|
67
67
|
_getOverrides14 = _slicedToArray(_getOverrides13, 2),
|
|
68
68
|
CheckIcon = _getOverrides14[0],
|
|
69
69
|
checkIconProps = _getOverrides14[1];
|