@dxc-technology/halstack-react 0.0.0-7d46b9f → 0.0.0-7da4003
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/ThemeContext.js +6 -6
- package/dist/V3Textarea/V3Textarea.js +264 -0
- package/dist/alert/Alert.js +4 -4
- package/dist/button/Button.js +1 -1
- package/dist/common/variables.js +199 -74
- package/dist/date/Date.js +6 -6
- package/dist/{new-date/NewDate.js → date-input/DateInput.js} +36 -36
- package/dist/{new-date → date-input}/index.d.ts +3 -3
- package/dist/file-input/FileInput.js +2 -2
- package/dist/file-input/index.d.ts +1 -1
- package/dist/footer/Footer.js +44 -18
- package/dist/footer/Icons.js +77 -0
- package/dist/header/Header.js +80 -49
- package/dist/header/Icons.js +59 -0
- package/dist/input-text/Icons.js +22 -0
- package/dist/input-text/InputText.js +7 -9
- package/dist/layout/ApplicationLayout.js +4 -8
- package/dist/layout/Icons.js +55 -0
- package/dist/main.d.ts +6 -5
- package/dist/main.js +29 -21
- package/dist/new-select/NewSelect.js +836 -0
- package/dist/new-select/index.d.ts +53 -0
- package/dist/{number/Number.js → number-input/NumberInput.js} +8 -8
- package/dist/{number/NumberContext.js → number-input/NumberInputContext.js} +2 -2
- package/dist/{number → number-input}/index.d.ts +3 -3
- package/dist/paginator/Icons.js +66 -0
- package/dist/paginator/Paginator.js +5 -11
- package/dist/{password/Password.js → password-input/PasswordInput.js} +8 -10
- package/dist/{password → password-input}/index.d.ts +5 -5
- package/dist/slider/Slider.js +104 -19
- package/dist/{new-input-text/NewInputText.js → text-input/TextInput.js} +36 -32
- package/dist/{new-input-text → text-input}/index.d.ts +1 -1
- package/dist/textarea/Textarea.js +227 -122
- package/dist/{new-textarea → textarea}/index.d.ts +1 -1
- package/dist/toggle-group/ToggleGroup.js +132 -28
- package/dist/upload/Upload.js +3 -3
- package/dist/upload/buttons-upload/ButtonsUpload.js +7 -11
- package/dist/upload/buttons-upload/Icons.js +40 -0
- package/dist/upload/dragAndDropArea/DragAndDropArea.js +14 -14
- package/dist/upload/dragAndDropArea/Icons.js +39 -0
- package/dist/upload/file-upload/FileToUpload.js +26 -21
- package/dist/upload/file-upload/Icons.js +66 -0
- package/dist/upload/readme.md +2 -2
- package/dist/upload/transaction/Icons.js +160 -0
- package/dist/upload/transaction/Transaction.js +11 -38
- package/dist/wizard/Icons.js +65 -0
- package/dist/wizard/Wizard.js +3 -9
- package/package.json +1 -1
- package/test/Date.test.js +48 -44
- package/test/{NewDate.test.js → DateInput.test.js} +33 -23
- package/test/Footer.test.js +2 -7
- package/test/Header.test.js +5 -10
- package/test/InputText.test.js +24 -16
- package/test/{Number.test.js → NumberInput.test.js} +47 -45
- package/test/PasswordInput.test.js +83 -0
- package/test/Slider.test.js +9 -17
- package/test/{NewInputText.test.js → TextInput.test.js} +46 -48
- package/test/{NewTextarea.test.js → Textarea.test.js} +16 -18
- package/test/ToggleGroup.test.js +5 -1
- package/test/Upload.test.js +5 -5
- package/test/{TextArea.test.js → V3TextArea.test.js} +6 -7
- package/dist/footer/Footer.stories.js +0 -94
- package/dist/footer/dxc_logo.svg +0 -15
- package/dist/footer/readme.md +0 -41
- package/dist/header/Header.stories.js +0 -176
- package/dist/header/close_icon.svg +0 -1
- package/dist/header/dxc_logo_black.svg +0 -8
- package/dist/header/hamb_menu_black.svg +0 -1
- package/dist/header/hamb_menu_white.svg +0 -1
- package/dist/header/readme.md +0 -33
- package/dist/input-text/InputText.stories.js +0 -209
- package/dist/input-text/error.svg +0 -1
- package/dist/input-text/readme.md +0 -91
- package/dist/layout/facebook.svg +0 -45
- package/dist/layout/linkedin.svg +0 -50
- package/dist/layout/twitter.svg +0 -53
- package/dist/new-textarea/NewTextarea.js +0 -365
- package/dist/paginator/images/next.svg +0 -3
- package/dist/paginator/images/nextPage.svg +0 -3
- package/dist/paginator/images/previous.svg +0 -3
- package/dist/paginator/images/previousPage.svg +0 -3
- package/dist/paginator/readme.md +0 -50
- package/dist/password/styles.css +0 -3
- package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
- package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
- package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
- package/dist/slider/Slider.stories.js +0 -241
- package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
- package/dist/upload/buttons-upload/upload-button.svg +0 -1
- package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
- package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
- package/dist/upload/file-upload/audio-icon.svg +0 -4
- package/dist/upload/file-upload/close.svg +0 -4
- package/dist/upload/file-upload/file-icon.svg +0 -4
- package/dist/upload/file-upload/video-icon.svg +0 -4
- package/dist/upload/transaction/audio-icon-err.svg +0 -4
- package/dist/upload/transaction/audio-icon.svg +0 -4
- package/dist/upload/transaction/error-icon.svg +0 -4
- package/dist/upload/transaction/file-icon-err.svg +0 -4
- package/dist/upload/transaction/file-icon.svg +0 -4
- package/dist/upload/transaction/image-icon-err.svg +0 -4
- package/dist/upload/transaction/image-icon.svg +0 -4
- package/dist/upload/transaction/success-icon.svg +0 -4
- package/dist/upload/transaction/video-icon-err.svg +0 -4
- package/dist/upload/transaction/video-icon.svg +0 -4
- package/dist/wizard/invalid_icon.svg +0 -5
- package/dist/wizard/valid_icon.svg +0 -5
- package/dist/wizard/validation-wrong.svg +0 -6
- package/test/Password.test.js +0 -83
package/dist/common/variables.js
CHANGED
|
@@ -7,9 +7,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.typeface = exports.responsiveSizes = exports.spaces = exports.componentTokens = exports.globalTokens = void 0;
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _Icons = require("../header/Icons");
|
|
11
11
|
|
|
12
|
-
var
|
|
12
|
+
var _Icons2 = _interopRequireDefault(require("../footer/Icons"));
|
|
13
13
|
|
|
14
14
|
var globalTokens = {
|
|
15
15
|
// Color
|
|
@@ -25,6 +25,7 @@ var globalTokens = {
|
|
|
25
25
|
hal_black: "#000000",
|
|
26
26
|
color_grey_800: "#4d4d4d",
|
|
27
27
|
color_grey_600: "#808080",
|
|
28
|
+
color_grey_50: "#fafafa",
|
|
28
29
|
hal_purple_l_95: "#f2eafa",
|
|
29
30
|
hal_purple_l_90: "#e5d5f6",
|
|
30
31
|
hal_purple_l_65: "#a46ede",
|
|
@@ -32,6 +33,7 @@ var globalTokens = {
|
|
|
32
33
|
hal_purple_d_30: "#4b1c7d",
|
|
33
34
|
hal_purple_d_20: "#321353",
|
|
34
35
|
color_purple_600: "#7D2FD0",
|
|
36
|
+
color_purple_300: "#cbacec",
|
|
35
37
|
hal_blue_l_95: "#e6f4ff",
|
|
36
38
|
hal_blue_l_80: "#99d5ff",
|
|
37
39
|
hal_blue_l_50: "#0095ff",
|
|
@@ -123,7 +125,7 @@ var globalTokens = {
|
|
|
123
125
|
type_leading_compact_02: "1.25em",
|
|
124
126
|
type_leading_compact_01: "1.365em",
|
|
125
127
|
type_leading_normal: "1.5em",
|
|
126
|
-
type_leading_loose_01: "1.
|
|
128
|
+
type_leading_loose_01: "1.715em",
|
|
127
129
|
type_leading_loose_02: "2em",
|
|
128
130
|
fontSize10: "10px",
|
|
129
131
|
// Spacing
|
|
@@ -154,10 +156,7 @@ var globalTokens = {
|
|
|
154
156
|
border_radius_full: "9999px",
|
|
155
157
|
border_solid: "solid",
|
|
156
158
|
border_dashed: "dashed",
|
|
157
|
-
border_none: "none"
|
|
158
|
-
// Padding
|
|
159
|
-
padding_08: "8px",
|
|
160
|
-
padding_16: "16px"
|
|
159
|
+
border_none: "none"
|
|
161
160
|
};
|
|
162
161
|
exports.globalTokens = globalTokens;
|
|
163
162
|
var componentTokens = {
|
|
@@ -274,10 +273,10 @@ var componentTokens = {
|
|
|
274
273
|
button: {
|
|
275
274
|
labelFontLineHeight: globalTokens.type_leading_normal,
|
|
276
275
|
labelLetterSpacing: globalTokens.type_spacing_wide_01,
|
|
277
|
-
paddingLeft: globalTokens.
|
|
278
|
-
paddingRight: globalTokens.
|
|
279
|
-
paddingTop: globalTokens.
|
|
280
|
-
paddingBottom: globalTokens.
|
|
276
|
+
paddingLeft: globalTokens.spacing_03,
|
|
277
|
+
paddingRight: globalTokens.spacing_03,
|
|
278
|
+
paddingTop: globalTokens.spacing_03,
|
|
279
|
+
paddingBottom: globalTokens.spacing_03,
|
|
281
280
|
focusBorderColor: globalTokens.hal_blue_l_50,
|
|
282
281
|
focusBorderColorOnDark: globalTokens.hal_blue_l_50,
|
|
283
282
|
primaryBackgroundColor: globalTokens.hal_purple_s_38,
|
|
@@ -413,7 +412,7 @@ var componentTokens = {
|
|
|
413
412
|
pickerHeight: "316px",
|
|
414
413
|
pickerWidth: "290px"
|
|
415
414
|
},
|
|
416
|
-
|
|
415
|
+
dateInput: {
|
|
417
416
|
pickerFontFamily: globalTokens.type_sans,
|
|
418
417
|
pickerBackgroundColor: globalTokens.hal_white,
|
|
419
418
|
pickerHoverDateFontColor: globalTokens.hal_black,
|
|
@@ -527,7 +526,7 @@ var componentTokens = {
|
|
|
527
526
|
helperTextFontFamily: globalTokens.type_sans,
|
|
528
527
|
helperTextFontSize: globalTokens.type_scale_01,
|
|
529
528
|
helperTextFontWeight: globalTokens.type_regular,
|
|
530
|
-
helperTextLineHeight: globalTokens.
|
|
529
|
+
helperTextLineHeight: globalTokens.type_leading_normal,
|
|
531
530
|
dropLabelFontFamily: globalTokens.type_sans,
|
|
532
531
|
dropLabelFontSize: globalTokens.type_scale_03,
|
|
533
532
|
dropLabelFontWeight: globalTokens.type_regular,
|
|
@@ -560,7 +559,7 @@ var componentTokens = {
|
|
|
560
559
|
copyrightFontStyle: globalTokens.type_normal,
|
|
561
560
|
copyrightFontWeight: globalTokens.type_regular,
|
|
562
561
|
copyrightFontColor: globalTokens.hal_white,
|
|
563
|
-
logo:
|
|
562
|
+
logo: _Icons2["default"],
|
|
564
563
|
logoHeight: "32px",
|
|
565
564
|
logoWidth: "auto",
|
|
566
565
|
socialLinksSize: "24px",
|
|
@@ -578,8 +577,8 @@ var componentTokens = {
|
|
|
578
577
|
hamburguerTextTransform: globalTokens.type_uppercase,
|
|
579
578
|
hamburguerIconColor: globalTokens.hal_black,
|
|
580
579
|
hamburguerHoverColor: globalTokens.mediumGreyBlack,
|
|
581
|
-
logo:
|
|
582
|
-
logoResponsive:
|
|
580
|
+
logo: _Icons.dxcLogo,
|
|
581
|
+
logoResponsive: _Icons.dxcLogo,
|
|
583
582
|
logoHeight: "40px",
|
|
584
583
|
logoWidth: "auto",
|
|
585
584
|
menuBackgroundColor: globalTokens.hal_white,
|
|
@@ -694,7 +693,7 @@ var componentTokens = {
|
|
|
694
693
|
underlineFocusColorOnDark: globalTokens.white,
|
|
695
694
|
underlineThickness: "1px"
|
|
696
695
|
},
|
|
697
|
-
|
|
696
|
+
textInput: {
|
|
698
697
|
fontFamily: globalTokens.type_sans,
|
|
699
698
|
enabledBorderColor: globalTokens.hal_black,
|
|
700
699
|
enabledBorderColorOnDark: globalTokens.hal_white,
|
|
@@ -719,6 +718,7 @@ var componentTokens = {
|
|
|
719
718
|
labelFontSize: globalTokens.type_scale_02,
|
|
720
719
|
labelFontStyle: globalTokens.type_normal,
|
|
721
720
|
labelFontWeight: globalTokens.type_semibold,
|
|
721
|
+
labelLineHeight: globalTokens.type_leading_loose_01,
|
|
722
722
|
disabledLabelFontColor: globalTokens.hal_grey_l_60,
|
|
723
723
|
disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
|
|
724
724
|
optionalLabelFontWeight: globalTokens.type_regular,
|
|
@@ -727,6 +727,7 @@ var componentTokens = {
|
|
|
727
727
|
helperTextFontSize: globalTokens.type_scale_01,
|
|
728
728
|
helperTextFontStyle: globalTokens.type_normal,
|
|
729
729
|
helperTextFontWeight: globalTokens.type_regular,
|
|
730
|
+
helperTextLineHeight: globalTokens.type_leading_normal,
|
|
730
731
|
disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
|
|
731
732
|
disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
|
|
732
733
|
prefixColor: globalTokens.hal_grey_s_40,
|
|
@@ -923,6 +924,90 @@ var componentTokens = {
|
|
|
923
924
|
focusColor: globalTokens.hal_blue_l_50,
|
|
924
925
|
focusColorOnDark: globalTokens.hal_blue_l_50
|
|
925
926
|
},
|
|
927
|
+
newSelect: {
|
|
928
|
+
fontFamily: globalTokens.type_sans,
|
|
929
|
+
enabledBorderColor: globalTokens.hal_black,
|
|
930
|
+
enabledBorderColorOnDark: globalTokens.hal_white,
|
|
931
|
+
hoverBorderColor: globalTokens.hal_purple_l_65,
|
|
932
|
+
hoverBorderColorOnDark: globalTokens.hal_purple_l_65,
|
|
933
|
+
focusBorderColor: globalTokens.hal_blue_l_50,
|
|
934
|
+
focusBorderColorOnDark: globalTokens.hal_blue_l_50,
|
|
935
|
+
disabledBorderColor: globalTokens.hal_grey_l_60,
|
|
936
|
+
disabledBorderColorOnDark: globalTokens.hal_grey_l_60,
|
|
937
|
+
disabledContainerFillColor: globalTokens.hal_grey_l_95,
|
|
938
|
+
disabledContainerFillColorOnDark: globalTokens.hal_grey_s_40,
|
|
939
|
+
errorBorderColor: globalTokens.hal_red_s_41,
|
|
940
|
+
errorBorderColorOnDark: globalTokens.hal_red_l_60,
|
|
941
|
+
hoverErrorBorderColor: "#fe0123",
|
|
942
|
+
hoverErrorBorderColorOnDark: "#fe677b",
|
|
943
|
+
errorMessageColor: globalTokens.hal_red_s_41,
|
|
944
|
+
errorMessageColorOnDark: globalTokens.hal_red_l_60,
|
|
945
|
+
errorIconColor: globalTokens.hal_red_s_41,
|
|
946
|
+
errorIconColorOnDark: globalTokens.hal_red_l_60,
|
|
947
|
+
labelFontColor: globalTokens.hal_black,
|
|
948
|
+
labelFontColorOnDark: globalTokens.hal_white,
|
|
949
|
+
labelFontSize: globalTokens.type_scale_02,
|
|
950
|
+
labelFontStyle: globalTokens.type_normal,
|
|
951
|
+
labelFontWeight: globalTokens.type_semibold,
|
|
952
|
+
disabledLabelFontColor: globalTokens.hal_grey_l_60,
|
|
953
|
+
disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
|
|
954
|
+
optionalLabelFontWeight: globalTokens.type_regular,
|
|
955
|
+
helperTextFontColor: globalTokens.hal_black,
|
|
956
|
+
helperTextFontColorOnDark: globalTokens.hal_white,
|
|
957
|
+
helperTextFontSize: globalTokens.type_scale_01,
|
|
958
|
+
helperTextFontStyle: globalTokens.type_normal,
|
|
959
|
+
helperTextFontWeight: globalTokens.type_regular,
|
|
960
|
+
disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
|
|
961
|
+
disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
|
|
962
|
+
placeholderFontColor: "#808080",
|
|
963
|
+
placeholderFontColorOnDark: globalTokens.hal_grey_l_95,
|
|
964
|
+
disabledPlaceholderFontColor: globalTokens.hal_grey_l_60,
|
|
965
|
+
disabledPlaceholderFontColorOnDark: globalTokens.hal_grey_l_60,
|
|
966
|
+
valueFontColor: globalTokens.hal_black,
|
|
967
|
+
valueFontColorOnDark: globalTokens.hal_white,
|
|
968
|
+
valueFontSize: globalTokens.type_scale_03,
|
|
969
|
+
valueFontStyle: globalTokens.type_normal,
|
|
970
|
+
valueFontWeight: globalTokens.type_regular,
|
|
971
|
+
disabledValueFontColor: globalTokens.hal_grey_l_60,
|
|
972
|
+
disabledValueFontColorOnDark: globalTokens.hal_grey_l_60,
|
|
973
|
+
actionIconColor: globalTokens.hal_black,
|
|
974
|
+
actionIconColorOnDark: globalTokens.hal_white,
|
|
975
|
+
disabledActionIconColor: globalTokens.hal_grey_l_60,
|
|
976
|
+
disabledActionIconColorOnDark: globalTokens.hal_grey_l_60,
|
|
977
|
+
hoverActionIconColor: globalTokens.hal_black,
|
|
978
|
+
hoverActionIconColorOnDark: globalTokens.hal_white,
|
|
979
|
+
focusActionIconColor: globalTokens.hal_black,
|
|
980
|
+
focusActionIconColorOnDark: globalTokens.hal_white,
|
|
981
|
+
activeActionIconColor: globalTokens.hal_black,
|
|
982
|
+
activeActionIconColorOnDark: globalTokens.hal_black,
|
|
983
|
+
actionBackgroundColor: globalTokens.transparent,
|
|
984
|
+
actionBackgroundColorOnDark: globalTokens.transparent,
|
|
985
|
+
disabledActionBackgroundColor: globalTokens.transparent,
|
|
986
|
+
disabledActionBackgroundColorOnDark: globalTokens.transparent,
|
|
987
|
+
hoverActionBackgroundColor: globalTokens.hal_grey_l_95,
|
|
988
|
+
hoverActionBackgroundColorOnDark: globalTokens.hal_grey_s_40,
|
|
989
|
+
focusActionBorderColor: globalTokens.hal_blue_l_50,
|
|
990
|
+
focusActionBorderColorOnDark: globalTokens.hal_blue_l_50,
|
|
991
|
+
activeActionBackgroundColor: globalTokens.hal_grey_l_80,
|
|
992
|
+
activeActionBackgroundColorOnDark: globalTokens.hal_grey_l_60,
|
|
993
|
+
listOptionFontColor: globalTokens.hal_black,
|
|
994
|
+
listOptionFontSize: globalTokens.type_scale_02,
|
|
995
|
+
listOptionFontStyle: globalTokens.type_normal,
|
|
996
|
+
listOptionFontWeight: globalTokens.type_regular,
|
|
997
|
+
systemMessageFontColor: globalTokens.hal_grey_s_40,
|
|
998
|
+
errorMessageBorderColor: globalTokens.hal_red_s_41,
|
|
999
|
+
errorMessageBackgroundColor: globalTokens.hal_red_l_95,
|
|
1000
|
+
hoverListOptionBackgroundColor: globalTokens.hal_grey_l_95,
|
|
1001
|
+
activeListOptionBackgroundColor: globalTokens.hal_grey_l_90,
|
|
1002
|
+
// NUEVO
|
|
1003
|
+
arrowColor: globalTokens.hal_black,
|
|
1004
|
+
arrowColorOnDark: globalTokens.hal_white,
|
|
1005
|
+
disabledArrowColor: globalTokens.hal_grey_l_60,
|
|
1006
|
+
disabledArrowColorOnDark: globalTokens.hal_grey_l_60,
|
|
1007
|
+
enabledListBorderColor: globalTokens.hal_grey_l_80,
|
|
1008
|
+
listOptionBorderBottomColor: globalTokens.hal_grey_l_90,
|
|
1009
|
+
selectedListOptionBackgroundColor: globalTokens.hal_grey_l_90
|
|
1010
|
+
},
|
|
926
1011
|
sidenav: {
|
|
927
1012
|
backgroundColor: globalTokens.hal_grey_l_95,
|
|
928
1013
|
arrowContainerColor: globalTokens.hal_grey_l_90,
|
|
@@ -962,13 +1047,28 @@ var componentTokens = {
|
|
|
962
1047
|
fontSize: globalTokens.type_scale_03,
|
|
963
1048
|
fontStyle: globalTokens.type_normal,
|
|
964
1049
|
fontWeight: globalTokens.type_regular,
|
|
1050
|
+
labelFontFamily: globalTokens.type_sans,
|
|
1051
|
+
labelFontSize: globalTokens.type_scale_02,
|
|
1052
|
+
labelFontStyle: globalTokens.type_normal,
|
|
1053
|
+
labelFontWeight: globalTokens.type_semibold,
|
|
1054
|
+
labelLineHeight: globalTokens.type_leading_loose_01,
|
|
1055
|
+
helperTextFontFamily: globalTokens.type_sans,
|
|
1056
|
+
helperTextFontSize: globalTokens.type_scale_01,
|
|
1057
|
+
helperTextFontStyle: globalTokens.type_normal,
|
|
1058
|
+
helperTextFontWeight: globalTokens.type_regular,
|
|
1059
|
+
helperTextLineHeight: globalTokens.type_leading_normal,
|
|
965
1060
|
fontColor: globalTokens.hal_black,
|
|
966
1061
|
fontColorOnDark: globalTokens.hal_white,
|
|
1062
|
+
labelFontColor: globalTokens.hal_black,
|
|
1063
|
+
helperTextFontColor: globalTokens.hal_black,
|
|
967
1064
|
disabledFontColor: globalTokens.hal_grey_l_60,
|
|
968
1065
|
fontLetterSpacing: globalTokens.type_spacing_normal,
|
|
969
1066
|
thumbHeight: "12px",
|
|
970
1067
|
thumbWidth: "12px",
|
|
1068
|
+
hoverThumbHeight: "14px",
|
|
1069
|
+
hoverThumbWidth: "14px",
|
|
971
1070
|
thumbVerticalPosition: "12px",
|
|
1071
|
+
hoverThumbVerticalPosition: "11px",
|
|
972
1072
|
thumbBackgroundColor: globalTokens.hal_blue_s_35,
|
|
973
1073
|
thumbBackgroundColorOnDark: globalTokens.hal_blue_l_50,
|
|
974
1074
|
hoverThumbScale: "1.166666",
|
|
@@ -1003,7 +1103,10 @@ var componentTokens = {
|
|
|
1003
1103
|
disabledTotalLineColor: globalTokens.hal_grey_l_95,
|
|
1004
1104
|
disabledTotalLineColorOnDark: globalTokens.hal_grey_s_40,
|
|
1005
1105
|
focusColor: globalTokens.hal_blue_l_50,
|
|
1006
|
-
focusColorOnDark: globalTokens.hal_blue_l_50
|
|
1106
|
+
focusColorOnDark: globalTokens.hal_blue_l_50,
|
|
1107
|
+
floorLabelMarginRight: globalTokens.type_scale_03,
|
|
1108
|
+
ceilLabelMarginLeft: globalTokens.type_scale_03,
|
|
1109
|
+
inputMarginLeft: globalTokens.type_scale_06
|
|
1007
1110
|
},
|
|
1008
1111
|
spinner: {
|
|
1009
1112
|
trackCircleColor: "#5f249f",
|
|
@@ -1096,7 +1199,7 @@ var componentTokens = {
|
|
|
1096
1199
|
rowSeparatorColor: globalTokens.lightGrey,
|
|
1097
1200
|
dataBackgroundColor: globalTokens.white,
|
|
1098
1201
|
dataFontFamily: globalTokens.type_sans,
|
|
1099
|
-
dataFontSize: globalTokens.
|
|
1202
|
+
dataFontSize: globalTokens.type_scale_02,
|
|
1100
1203
|
dataFontStyle: globalTokens.type_normal,
|
|
1101
1204
|
dataFontWeight: globalTokens.type_regular,
|
|
1102
1205
|
dataFontColor: globalTokens.black,
|
|
@@ -1164,41 +1267,6 @@ var componentTokens = {
|
|
|
1164
1267
|
badgeRadiusWithNotificationNumber: "10px"
|
|
1165
1268
|
},
|
|
1166
1269
|
textarea: {
|
|
1167
|
-
fontFamily: globalTokens.type_sans,
|
|
1168
|
-
assistiveTextFontSize: globalTokens.type_scale_01,
|
|
1169
|
-
assistiveTextFontStyle: globalTokens.type_normal,
|
|
1170
|
-
assistiveTextFontWeight: globalTokens.type_regular,
|
|
1171
|
-
assistiveTextFontColor: globalTokens.black,
|
|
1172
|
-
assistiveTextFontColorOnDark: globalTokens.white,
|
|
1173
|
-
assistiveTextLetterSpacing: "0.03333em",
|
|
1174
|
-
disabledColor: globalTokens.lighterBlack,
|
|
1175
|
-
disabledColorOnDark: "#575757",
|
|
1176
|
-
errorColor: globalTokens.red,
|
|
1177
|
-
errorColorOnDark: globalTokens.hal_red_l_60,
|
|
1178
|
-
scrollBarThumbColor: globalTokens.darkGrey,
|
|
1179
|
-
scrollBarThumbColorOnDark: globalTokens.white,
|
|
1180
|
-
scrollBarTrackColor: globalTokens.lightGrey,
|
|
1181
|
-
scrollBarTrackColorOnDark: "#999999",
|
|
1182
|
-
labelFontSize: globalTokens.type_scale_03,
|
|
1183
|
-
labelFontStyle: globalTokens.type_normal,
|
|
1184
|
-
labelFontWeight: globalTokens.type_regular,
|
|
1185
|
-
labelFontColor: globalTokens.black,
|
|
1186
|
-
labelFontColorOnDark: globalTokens.white,
|
|
1187
|
-
labelLetterSpacing: "0.00938em",
|
|
1188
|
-
valueFontSize: globalTokens.type_scale_03,
|
|
1189
|
-
valueFontStyle: globalTokens.type_normal,
|
|
1190
|
-
valueFontWeight: globalTokens.type_regular,
|
|
1191
|
-
valueFontColor: globalTokens.black,
|
|
1192
|
-
valueFontColorOnDark: globalTokens.white,
|
|
1193
|
-
valueLetterSpacing: globalTokens.type_spacing_normal,
|
|
1194
|
-
valueLineHeight: "1.1875em",
|
|
1195
|
-
underlineColor: globalTokens.black,
|
|
1196
|
-
underlineColorOnDark: globalTokens.white,
|
|
1197
|
-
underlineFocusColor: globalTokens.black,
|
|
1198
|
-
underlineFocusColorOnDark: globalTokens.white,
|
|
1199
|
-
underlineThickness: "1px"
|
|
1200
|
-
},
|
|
1201
|
-
newTextarea: {
|
|
1202
1270
|
fontFamily: globalTokens.type_sans,
|
|
1203
1271
|
enabledBorderColor: globalTokens.hal_black,
|
|
1204
1272
|
enabledBorderColorOnDark: globalTokens.hal_white,
|
|
@@ -1221,6 +1289,7 @@ var componentTokens = {
|
|
|
1221
1289
|
labelFontSize: globalTokens.type_scale_02,
|
|
1222
1290
|
labelFontStyle: globalTokens.type_normal,
|
|
1223
1291
|
labelFontWeight: globalTokens.type_semibold,
|
|
1292
|
+
labelLineHeight: globalTokens.type_leading_loose_01,
|
|
1224
1293
|
disabledLabelFontColor: globalTokens.hal_grey_l_60,
|
|
1225
1294
|
disabledLabelFontColorOnDark: globalTokens.hal_grey_l_60,
|
|
1226
1295
|
optionalLabelFontWeight: globalTokens.type_regular,
|
|
@@ -1229,6 +1298,7 @@ var componentTokens = {
|
|
|
1229
1298
|
helperTextFontSize: globalTokens.type_scale_01,
|
|
1230
1299
|
helperTextFontStyle: globalTokens.type_normal,
|
|
1231
1300
|
helperTextFontWeight: globalTokens.type_regular,
|
|
1301
|
+
helperTextLineHeight: globalTokens.type_leading_normal,
|
|
1232
1302
|
disabledHelperTextFontColor: globalTokens.hal_grey_l_60,
|
|
1233
1303
|
disabledHelperTextFontColorOnDark: globalTokens.hal_grey_l_60,
|
|
1234
1304
|
placeholderFontColor: "#808080",
|
|
@@ -1244,32 +1314,52 @@ var componentTokens = {
|
|
|
1244
1314
|
disabledValueFontColorOnDark: globalTokens.hal_grey_l_60
|
|
1245
1315
|
},
|
|
1246
1316
|
toggleGroup: {
|
|
1247
|
-
|
|
1248
|
-
|
|
1249
|
-
|
|
1250
|
-
|
|
1251
|
-
|
|
1252
|
-
|
|
1253
|
-
selectedActiveBackgroundColor: globalTokens.hal_purple_d_20,
|
|
1254
|
-
selectedDisabledBackgroundColor: globalTokens.hal_purple_l_95,
|
|
1255
|
-
selectedFontColor: globalTokens.hal_white,
|
|
1256
|
-
selectedDisabledFontColor: "#cbacec",
|
|
1317
|
+
containerBackgroundColor: globalTokens.color_grey_50,
|
|
1318
|
+
containerBorderColor: globalTokens.hal_grey_l_60,
|
|
1319
|
+
labelFontColor: globalTokens.hal_black,
|
|
1320
|
+
disabledLabelFontColor: globalTokens.hal_grey_l_60,
|
|
1321
|
+
helperTextFontColor: globalTokens.hal_black,
|
|
1322
|
+
disabledHelperTextFontcolor: globalTokens.hal_grey_l_60,
|
|
1257
1323
|
unselectedBackgroundColor: globalTokens.hal_grey_l_90,
|
|
1258
1324
|
unselectedHoverBackgroundColor: globalTokens.hal_grey_l_80,
|
|
1259
1325
|
unselectedActiveBackgroundColor: globalTokens.hal_purple_s_38,
|
|
1260
1326
|
unselectedDisabledBackgroundColor: globalTokens.hal_grey_l_95,
|
|
1261
1327
|
unselectedFontColor: globalTokens.hal_black,
|
|
1262
1328
|
unselectedDisabledFontColor: globalTokens.hal_grey_l_60,
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
|
|
1329
|
+
selectedBackgroundColor: globalTokens.hal_purple_s_38,
|
|
1330
|
+
selectedHoverBackgroundColor: globalTokens.hal_purple_d_30,
|
|
1331
|
+
selectedActiveBackgroundColor: globalTokens.hal_purple_d_20,
|
|
1332
|
+
selectedDisabledBackgroundColor: globalTokens.hal_purple_l_95,
|
|
1333
|
+
selectedFontColor: globalTokens.hal_white,
|
|
1334
|
+
selectedDisabledFontColor: globalTokens.color_purple_300,
|
|
1335
|
+
focusColor: globalTokens.hal_blue_l_50,
|
|
1336
|
+
labelFontFamily: globalTokens.type_sans,
|
|
1337
|
+
labelFontSize: globalTokens.type_scale_02,
|
|
1338
|
+
labelFontStyle: globalTokens.type_normal,
|
|
1339
|
+
labelFontWeight: globalTokens.type_semibold,
|
|
1340
|
+
labelLineHeight: globalTokens.type_leading_loose_01,
|
|
1341
|
+
helperTextFontFamily: globalTokens.type_sans,
|
|
1342
|
+
helperTextFontSize: globalTokens.type_scale_01,
|
|
1343
|
+
helperTextFontStyle: globalTokens.type_normal,
|
|
1344
|
+
helperTextFontWeight: globalTokens.type_regular,
|
|
1345
|
+
helperTextLineHeight: globalTokens.type_leading_normal,
|
|
1346
|
+
optionLabelFontFamily: globalTokens.type_sans,
|
|
1347
|
+
optionLabelFontSize: globalTokens.type_scale_03,
|
|
1348
|
+
optionLabelFontStyle: globalTokens.type_normal,
|
|
1349
|
+
optionLabelFontWeight: globalTokens.type_regular,
|
|
1350
|
+
iconPaddingRight: globalTokens.spacing_03,
|
|
1351
|
+
iconPaddingLeft: globalTokens.spacing_03,
|
|
1352
|
+
labelPaddingLeft: globalTokens.spacing_06,
|
|
1353
|
+
labelPaddingRight: globalTokens.spacing_06,
|
|
1354
|
+
iconMarginRight: globalTokens.spacing_03,
|
|
1355
|
+
containerMarginTop: globalTokens.spacing_02,
|
|
1356
|
+
optionBorderThickness: globalTokens.border_width_0,
|
|
1357
|
+
optionBorderStyle: globalTokens.border_none,
|
|
1358
|
+
optionBorderRadius: globalTokens.border_radius_medium,
|
|
1359
|
+
containerBorderThickness: globalTokens.border_width_1,
|
|
1360
|
+
containerBorderStyle: globalTokens.border_solid,
|
|
1361
|
+
containerBorderRadius: globalTokens.border_radius_large,
|
|
1362
|
+
optionFocusBorderThickness: globalTokens.border_width_2
|
|
1273
1363
|
},
|
|
1274
1364
|
upload: {
|
|
1275
1365
|
fontFamily: globalTokens.type_sans,
|
|
@@ -1334,6 +1424,41 @@ var componentTokens = {
|
|
|
1334
1424
|
uploadedFilesSubtitleFontColor: globalTokens.darkGrey,
|
|
1335
1425
|
uploadedFilesNumberFontWeight: globalTokens.type_bold
|
|
1336
1426
|
},
|
|
1427
|
+
V3Textarea: {
|
|
1428
|
+
fontFamily: globalTokens.type_sans,
|
|
1429
|
+
assistiveTextFontSize: globalTokens.type_scale_01,
|
|
1430
|
+
assistiveTextFontStyle: globalTokens.type_normal,
|
|
1431
|
+
assistiveTextFontWeight: globalTokens.type_regular,
|
|
1432
|
+
assistiveTextFontColor: globalTokens.black,
|
|
1433
|
+
assistiveTextFontColorOnDark: globalTokens.white,
|
|
1434
|
+
assistiveTextLetterSpacing: "0.03333em",
|
|
1435
|
+
disabledColor: globalTokens.lighterBlack,
|
|
1436
|
+
disabledColorOnDark: "#575757",
|
|
1437
|
+
errorColor: globalTokens.red,
|
|
1438
|
+
errorColorOnDark: globalTokens.hal_red_l_60,
|
|
1439
|
+
scrollBarThumbColor: globalTokens.darkGrey,
|
|
1440
|
+
scrollBarThumbColorOnDark: globalTokens.white,
|
|
1441
|
+
scrollBarTrackColor: globalTokens.lightGrey,
|
|
1442
|
+
scrollBarTrackColorOnDark: "#999999",
|
|
1443
|
+
labelFontSize: globalTokens.type_scale_03,
|
|
1444
|
+
labelFontStyle: globalTokens.type_normal,
|
|
1445
|
+
labelFontWeight: globalTokens.type_regular,
|
|
1446
|
+
labelFontColor: globalTokens.black,
|
|
1447
|
+
labelFontColorOnDark: globalTokens.white,
|
|
1448
|
+
labelLetterSpacing: "0.00938em",
|
|
1449
|
+
valueFontSize: globalTokens.type_scale_03,
|
|
1450
|
+
valueFontStyle: globalTokens.type_normal,
|
|
1451
|
+
valueFontWeight: globalTokens.type_regular,
|
|
1452
|
+
valueFontColor: globalTokens.black,
|
|
1453
|
+
valueFontColorOnDark: globalTokens.white,
|
|
1454
|
+
valueLetterSpacing: globalTokens.type_spacing_normal,
|
|
1455
|
+
valueLineHeight: "1.1875em",
|
|
1456
|
+
underlineColor: globalTokens.black,
|
|
1457
|
+
underlineColorOnDark: globalTokens.white,
|
|
1458
|
+
underlineFocusColor: globalTokens.black,
|
|
1459
|
+
underlineFocusColorOnDark: globalTokens.white,
|
|
1460
|
+
underlineThickness: "1px"
|
|
1461
|
+
},
|
|
1337
1462
|
wizard: {
|
|
1338
1463
|
disabledBackgroundColor: globalTokens.lightGrey,
|
|
1339
1464
|
disabledFontColor: globalTokens.darkGrey,
|
package/dist/date/Date.js
CHANGED
|
@@ -41,7 +41,7 @@ var _variables = require("../common/variables.js");
|
|
|
41
41
|
|
|
42
42
|
var _useTheme = _interopRequireDefault(require("../useTheme.js"));
|
|
43
43
|
|
|
44
|
-
var
|
|
44
|
+
var _V3DxcDate$propTypes;
|
|
45
45
|
|
|
46
46
|
function _templateObject() {
|
|
47
47
|
var data = (0, _taggedTemplateLiteral2["default"])([""]);
|
|
@@ -53,7 +53,7 @@ function _templateObject() {
|
|
|
53
53
|
return data;
|
|
54
54
|
}
|
|
55
55
|
|
|
56
|
-
var
|
|
56
|
+
var V3DxcDate = function V3DxcDate(_ref) {
|
|
57
57
|
var value = _ref.value,
|
|
58
58
|
_ref$format = _ref.format,
|
|
59
59
|
format = _ref$format === void 0 ? "dd-MM-yyyy" : _ref$format,
|
|
@@ -356,7 +356,7 @@ var sizes = {
|
|
|
356
356
|
|
|
357
357
|
var StyledDPicker = _styledComponents["default"].div(_templateObject());
|
|
358
358
|
|
|
359
|
-
|
|
359
|
+
V3DxcDate.propTypes = (_V3DxcDate$propTypes = {
|
|
360
360
|
value: _propTypes["default"].string,
|
|
361
361
|
format: _propTypes["default"].string,
|
|
362
362
|
label: _propTypes["default"].string,
|
|
@@ -369,11 +369,11 @@ DxcDate.propTypes = (_DxcDate$propTypes = {
|
|
|
369
369
|
invalid: _propTypes["default"].bool,
|
|
370
370
|
onChange: _propTypes["default"].func,
|
|
371
371
|
onBlur: _propTypes["default"].func
|
|
372
|
-
}, (0, _defineProperty2["default"])(
|
|
372
|
+
}, (0, _defineProperty2["default"])(_V3DxcDate$propTypes, "onChange", _propTypes["default"].func), (0, _defineProperty2["default"])(_V3DxcDate$propTypes, "size", _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes)))), (0, _defineProperty2["default"])(_V3DxcDate$propTypes, "margin", _propTypes["default"].oneOfType([_propTypes["default"].shape({
|
|
373
373
|
top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
374
374
|
bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
375
375
|
left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
|
|
376
376
|
right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
|
|
377
|
-
}), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])), (0, _defineProperty2["default"])(
|
|
378
|
-
var _default =
|
|
377
|
+
}), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])), (0, _defineProperty2["default"])(_V3DxcDate$propTypes, "tabIndex", _propTypes["default"].number), _V3DxcDate$propTypes);
|
|
378
|
+
var _default = V3DxcDate;
|
|
379
379
|
exports["default"] = _default;
|
|
@@ -37,7 +37,7 @@ var _variables = require("../common/variables.js");
|
|
|
37
37
|
|
|
38
38
|
var _useTheme = _interopRequireDefault(require("../useTheme.js"));
|
|
39
39
|
|
|
40
|
-
var
|
|
40
|
+
var _TextInput = _interopRequireDefault(require("../text-input/TextInput"));
|
|
41
41
|
|
|
42
42
|
function _templateObject() {
|
|
43
43
|
var data = (0, _taggedTemplateLiteral2["default"])([""]);
|
|
@@ -49,7 +49,7 @@ function _templateObject() {
|
|
|
49
49
|
return data;
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
var
|
|
52
|
+
var DxcDateInput = _react["default"].forwardRef(function (_ref, ref) {
|
|
53
53
|
var _ref$label = _ref.label,
|
|
54
54
|
label = _ref$label === void 0 ? "" : _ref$label,
|
|
55
55
|
_ref$name = _ref.name,
|
|
@@ -175,12 +175,12 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
|
|
|
175
175
|
overrides: {
|
|
176
176
|
MuiTypography: {
|
|
177
177
|
root: {
|
|
178
|
-
fontFamily: "".concat(colorsTheme.
|
|
178
|
+
fontFamily: "".concat(colorsTheme.dateInput.pickerFontFamily, " !important")
|
|
179
179
|
}
|
|
180
180
|
},
|
|
181
181
|
MuiPickersYearSelection: {
|
|
182
182
|
container: {
|
|
183
|
-
color: colorsTheme.
|
|
183
|
+
color: colorsTheme.dateInput.pickerYearFontColor,
|
|
184
184
|
"&::-webkit-scrollbar": {
|
|
185
185
|
width: "3px"
|
|
186
186
|
},
|
|
@@ -196,8 +196,8 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
|
|
|
196
196
|
},
|
|
197
197
|
MuiPickersToolbar: {
|
|
198
198
|
toolbar: {
|
|
199
|
-
backgroundColor: colorsTheme.
|
|
200
|
-
color: colorsTheme.
|
|
199
|
+
backgroundColor: colorsTheme.dateInput.pickerBackgroundColor,
|
|
200
|
+
color: colorsTheme.dateInput.pickerDayFontColor
|
|
201
201
|
}
|
|
202
202
|
},
|
|
203
203
|
MuiIconButton: {
|
|
@@ -215,7 +215,7 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
|
|
|
215
215
|
MuiButtonBase: {
|
|
216
216
|
root: {
|
|
217
217
|
"&:focus": {
|
|
218
|
-
outline: colorsTheme.
|
|
218
|
+
outline: colorsTheme.dateInput.pickerFocusColor + " solid 2px"
|
|
219
219
|
}
|
|
220
220
|
}
|
|
221
221
|
},
|
|
@@ -225,38 +225,38 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
|
|
|
225
225
|
maxWidth: "unset",
|
|
226
226
|
minHeight: "unset",
|
|
227
227
|
padding: "0px 10px",
|
|
228
|
-
height: colorsTheme.
|
|
229
|
-
width: colorsTheme.
|
|
230
|
-
backgroundColor: colorsTheme.
|
|
231
|
-
fontFamily: colorsTheme.
|
|
228
|
+
height: colorsTheme.dateInput.pickerHeight,
|
|
229
|
+
width: colorsTheme.dateInput.pickerWidth,
|
|
230
|
+
backgroundColor: colorsTheme.dateInput.pickerBackgroundColor,
|
|
231
|
+
fontFamily: colorsTheme.dateInput.pickerFontFamily
|
|
232
232
|
}
|
|
233
233
|
},
|
|
234
234
|
MuiPickersToolbarText: {
|
|
235
235
|
toolbarTxt: {
|
|
236
|
-
color: colorsTheme.
|
|
237
|
-
fontFamily: colorsTheme.
|
|
236
|
+
color: colorsTheme.dateInput.pickerActualDateFontColor,
|
|
237
|
+
fontFamily: colorsTheme.dateInput.pickerFontFamily,
|
|
238
238
|
fontSize: "2rem"
|
|
239
239
|
},
|
|
240
240
|
toolbarBtnSelected: {
|
|
241
|
-
color: colorsTheme.
|
|
241
|
+
color: colorsTheme.dateInput.pickerActualDateFontColor
|
|
242
242
|
}
|
|
243
243
|
},
|
|
244
244
|
MuiPickersCalendarHeader: {
|
|
245
245
|
transitionContainer: {
|
|
246
|
-
color: colorsTheme.
|
|
246
|
+
color: colorsTheme.dateInput.pickerMonthFontColor
|
|
247
247
|
},
|
|
248
248
|
dayLabel: {
|
|
249
|
-
color: colorsTheme.
|
|
250
|
-
fontFamily: colorsTheme.
|
|
249
|
+
color: colorsTheme.dateInput.pickerWeekFontColor,
|
|
250
|
+
fontFamily: colorsTheme.dateInput.pickerFontFamily
|
|
251
251
|
},
|
|
252
252
|
switchHeader: {
|
|
253
253
|
backgroundColor: "#ffffff",
|
|
254
|
-
color: colorsTheme.
|
|
254
|
+
color: colorsTheme.dateInput.pickerDayFontColor
|
|
255
255
|
},
|
|
256
256
|
iconButton: {
|
|
257
|
-
backgroundColor: colorsTheme.
|
|
257
|
+
backgroundColor: colorsTheme.dateInput.pickerMonthArrowsBackgroundColor,
|
|
258
258
|
"&:hover": {
|
|
259
|
-
backgroundColor: colorsTheme.
|
|
259
|
+
backgroundColor: colorsTheme.dateInput.pickerMonthArrowsBackgroundColor
|
|
260
260
|
}
|
|
261
261
|
}
|
|
262
262
|
},
|
|
@@ -267,37 +267,37 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
|
|
|
267
267
|
},
|
|
268
268
|
MuiPickersDay: {
|
|
269
269
|
current: {
|
|
270
|
-
color: colorsTheme.
|
|
270
|
+
color: colorsTheme.dateInput.pickerDayFontColor
|
|
271
271
|
},
|
|
272
272
|
day: {
|
|
273
|
-
fontFamily: colorsTheme.
|
|
274
|
-
color: colorsTheme.
|
|
273
|
+
fontFamily: colorsTheme.dateInput.pickerFontFamily,
|
|
274
|
+
color: colorsTheme.dateInput.pickerDayFontColor,
|
|
275
275
|
"&:hover": {
|
|
276
|
-
backgroundColor: colorsTheme.
|
|
277
|
-
color: colorsTheme.
|
|
276
|
+
backgroundColor: colorsTheme.dateInput.pickerHoverDateBackgroundColor,
|
|
277
|
+
color: colorsTheme.dateInput.pickerHoverDateFontColor
|
|
278
278
|
}
|
|
279
279
|
},
|
|
280
280
|
daySelected: {
|
|
281
|
-
backgroundColor: colorsTheme.
|
|
282
|
-
color: colorsTheme.
|
|
281
|
+
backgroundColor: colorsTheme.dateInput.pickerSelectedDateBackgroundColor,
|
|
282
|
+
color: colorsTheme.dateInput.pickerSelectedDateColor,
|
|
283
283
|
"&:hover": {
|
|
284
|
-
backgroundColor: colorsTheme.
|
|
285
|
-
color: colorsTheme.
|
|
284
|
+
backgroundColor: colorsTheme.dateInput.pickerSelectedDateBackgroundColor,
|
|
285
|
+
color: colorsTheme.dateInput.pickerSelectedDateColor,
|
|
286
286
|
opacity: "1"
|
|
287
287
|
}
|
|
288
288
|
}
|
|
289
289
|
},
|
|
290
290
|
MuiPickersYear: {
|
|
291
291
|
yearSelected: {
|
|
292
|
-
color: colorsTheme.
|
|
293
|
-
backgroundColor: colorsTheme.
|
|
292
|
+
color: colorsTheme.dateInput.pickerSelectedDateColor,
|
|
293
|
+
backgroundColor: colorsTheme.dateInput.pickerSelectedDateBackgroundColor,
|
|
294
294
|
margin: "0px 100px",
|
|
295
295
|
borderRadius: "20px"
|
|
296
296
|
},
|
|
297
297
|
root: {
|
|
298
298
|
"&:focus": {
|
|
299
|
-
color: colorsTheme.
|
|
300
|
-
backgroundColor: colorsTheme.
|
|
299
|
+
color: colorsTheme.dateInput.pickerHoverDateFontColor,
|
|
300
|
+
backgroundColor: colorsTheme.dateInput.pickerHoverDateBackgroundColor
|
|
301
301
|
}
|
|
302
302
|
}
|
|
303
303
|
},
|
|
@@ -314,7 +314,7 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
|
|
|
314
314
|
theme: dateTheme
|
|
315
315
|
}, _react["default"].createElement(_pickers.MuiPickersUtilsProvider, {
|
|
316
316
|
utils: _dateFns["default"]
|
|
317
|
-
}, _react["default"].createElement(StyledDPicker, null, _react["default"].createElement(
|
|
317
|
+
}, _react["default"].createElement(StyledDPicker, null, _react["default"].createElement(_TextInput["default"], {
|
|
318
318
|
label: label,
|
|
319
319
|
name: name,
|
|
320
320
|
value: value !== null && value !== void 0 ? value : innerValue,
|
|
@@ -373,7 +373,7 @@ var sizes = {
|
|
|
373
373
|
|
|
374
374
|
var StyledDPicker = _styledComponents["default"].div(_templateObject());
|
|
375
375
|
|
|
376
|
-
|
|
376
|
+
DxcDateInput.propTypes = {
|
|
377
377
|
label: _propTypes["default"].string,
|
|
378
378
|
name: _propTypes["default"].string,
|
|
379
379
|
value: _propTypes["default"].string,
|
|
@@ -396,5 +396,5 @@ DxcNewDate.propTypes = {
|
|
|
396
396
|
}), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
|
|
397
397
|
tabIndex: _propTypes["default"].number
|
|
398
398
|
};
|
|
399
|
-
var _default =
|
|
399
|
+
var _default = DxcDateInput;
|
|
400
400
|
exports["default"] = _default;
|