@elastic/eui 95.1.0 → 95.2.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.
Files changed (86) hide show
  1. package/dist/eui_theme_dark.css +0 -240
  2. package/dist/eui_theme_dark.min.css +1 -1
  3. package/dist/eui_theme_light.css +0 -240
  4. package/dist/eui_theme_light.min.css +1 -1
  5. package/es/components/combo_box/combo_box_input/combo_box_input.js +2 -1
  6. package/es/components/context_menu/context_menu_item.js +1 -1
  7. package/es/components/form/file_picker/file_picker.js +49 -35
  8. package/es/components/form/file_picker/file_picker.styles.js +98 -0
  9. package/es/components/icon/assets/app_cases.js +9 -7
  10. package/es/components/icon/assets/logo_elastic_stack.js +6 -12
  11. package/es/components/steps/step.js +5 -3
  12. package/es/components/steps/step.styles.js +13 -5
  13. package/es/components/steps/step_horizontal.js +8 -3
  14. package/es/components/steps/step_horizontal.styles.js +1 -0
  15. package/es/components/steps/step_number.js +48 -24
  16. package/es/components/steps/step_number.styles.js +4 -2
  17. package/es/components/steps/steps.js +3 -1
  18. package/es/components/steps/steps_horizontal.js +1 -1
  19. package/es/services/theme/warning.js +7 -2
  20. package/eui.d.ts +72 -20
  21. package/i18ntokens.json +16 -16
  22. package/lib/components/combo_box/combo_box_input/combo_box_input.js +2 -1
  23. package/lib/components/context_menu/context_menu_item.js +1 -1
  24. package/lib/components/form/file_picker/file_picker.js +51 -37
  25. package/lib/components/form/file_picker/file_picker.styles.js +102 -0
  26. package/lib/components/icon/assets/app_cases.js +9 -7
  27. package/lib/components/icon/assets/logo_elastic_stack.js +6 -12
  28. package/lib/components/icon/svgs/app_cases.svg +6 -5
  29. package/lib/components/icon/svgs/logo_elastic_stack.svg +4 -7
  30. package/lib/components/steps/step.js +5 -3
  31. package/lib/components/steps/step.styles.js +13 -5
  32. package/lib/components/steps/step_horizontal.js +8 -3
  33. package/lib/components/steps/step_horizontal.styles.js +1 -0
  34. package/lib/components/steps/step_number.js +48 -24
  35. package/lib/components/steps/step_number.styles.js +3 -1
  36. package/lib/components/steps/steps.js +3 -1
  37. package/lib/components/steps/steps_horizontal.js +1 -1
  38. package/lib/services/theme/warning.js +7 -2
  39. package/optimize/es/components/combo_box/combo_box_input/combo_box_input.js +2 -1
  40. package/optimize/es/components/form/file_picker/file_picker.js +40 -34
  41. package/optimize/es/components/form/file_picker/file_picker.styles.js +98 -0
  42. package/optimize/es/components/icon/assets/app_cases.js +9 -7
  43. package/optimize/es/components/icon/assets/logo_elastic_stack.js +6 -12
  44. package/optimize/es/components/steps/step.js +2 -2
  45. package/optimize/es/components/steps/step.styles.js +13 -5
  46. package/optimize/es/components/steps/step_horizontal.js +8 -3
  47. package/optimize/es/components/steps/step_horizontal.styles.js +1 -0
  48. package/optimize/es/components/steps/step_number.js +44 -22
  49. package/optimize/es/components/steps/step_number.styles.js +4 -2
  50. package/optimize/es/components/steps/steps_horizontal.js +1 -1
  51. package/optimize/es/services/theme/warning.js +7 -2
  52. package/optimize/lib/components/combo_box/combo_box_input/combo_box_input.js +2 -1
  53. package/optimize/lib/components/form/file_picker/file_picker.js +42 -36
  54. package/optimize/lib/components/form/file_picker/file_picker.styles.js +102 -0
  55. package/optimize/lib/components/icon/assets/app_cases.js +9 -7
  56. package/optimize/lib/components/icon/assets/logo_elastic_stack.js +6 -12
  57. package/optimize/lib/components/icon/svgs/app_cases.svg +6 -5
  58. package/optimize/lib/components/icon/svgs/logo_elastic_stack.svg +4 -7
  59. package/optimize/lib/components/steps/step.js +2 -2
  60. package/optimize/lib/components/steps/step.styles.js +13 -5
  61. package/optimize/lib/components/steps/step_horizontal.js +8 -3
  62. package/optimize/lib/components/steps/step_horizontal.styles.js +1 -0
  63. package/optimize/lib/components/steps/step_number.js +44 -22
  64. package/optimize/lib/components/steps/step_number.styles.js +3 -1
  65. package/optimize/lib/components/steps/steps_horizontal.js +1 -1
  66. package/optimize/lib/services/theme/warning.js +7 -2
  67. package/package.json +1 -1
  68. package/src/components/form/_index.scss +0 -1
  69. package/test-env/components/combo_box/combo_box_input/combo_box_input.js +2 -1
  70. package/test-env/components/context_menu/context_menu_item.js +1 -1
  71. package/test-env/components/form/file_picker/file_picker.js +46 -37
  72. package/test-env/components/form/file_picker/file_picker.styles.js +102 -0
  73. package/test-env/components/icon/assets/app_cases.js +9 -7
  74. package/test-env/components/icon/assets/logo_elastic_stack.js +6 -12
  75. package/test-env/components/steps/step.js +5 -3
  76. package/test-env/components/steps/step.styles.js +13 -5
  77. package/test-env/components/steps/step_horizontal.js +8 -3
  78. package/test-env/components/steps/step_horizontal.styles.js +1 -0
  79. package/test-env/components/steps/step_number.js +48 -24
  80. package/test-env/components/steps/step_number.styles.js +3 -1
  81. package/test-env/components/steps/steps.js +3 -1
  82. package/test-env/components/steps/steps_horizontal.js +1 -1
  83. package/test-env/services/theme/warning.js +7 -2
  84. package/src/components/form/file_picker/_file_picker.scss +0 -212
  85. package/src/components/form/file_picker/_index.scss +0 -2
  86. package/src/components/form/file_picker/_variables.scss +0 -1
@@ -2875,246 +2875,6 @@ The following files still use the Sass version:
2875
2875
  min-width: min(20rem, 50%);
2876
2876
  }
2877
2877
 
2878
- /**
2879
- * REMEMBER: --large modifiers must come last to override --compressed
2880
- */
2881
- .euiFilePicker {
2882
- max-width: 400px;
2883
- width: 100%;
2884
- height: 40px;
2885
- position: relative;
2886
- }
2887
- .euiFilePicker--fullWidth {
2888
- max-width: 100%;
2889
- }
2890
- .euiFilePicker--compressed {
2891
- height: 32px;
2892
- }
2893
- .euiFilePicker--inGroup {
2894
- height: 100%;
2895
- }
2896
- .euiFilePicker.euiFilePicker--large {
2897
- border-radius: 6px;
2898
- overflow: hidden;
2899
- height: auto;
2900
- }
2901
- .euiFilePicker.euiFilePicker--large.euiFilePicker--compressed {
2902
- border-radius: 4px;
2903
- }
2904
-
2905
- .euiFilePicker__input {
2906
- position: absolute;
2907
- left: 0;
2908
- top: 0;
2909
- width: 100%;
2910
- height: 100%;
2911
- opacity: 0;
2912
- overflow: hidden;
2913
- }
2914
- .euiFilePicker__input:hover {
2915
- cursor: pointer;
2916
- }
2917
- .euiFilePicker__input:hover:disabled {
2918
- cursor: not-allowed;
2919
- }
2920
- .euiFilePicker__input:disabled {
2921
- opacity: 0;
2922
- }
2923
- .euiFilePicker__input:disabled ~ .euiFilePicker__prompt {
2924
- color: #535966;
2925
- }
2926
-
2927
- .euiFilePicker__icon {
2928
- position: absolute;
2929
- left: 12px;
2930
- top: 12px;
2931
- transition: -webkit-transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);
2932
- transition: transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);
2933
- transition: transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1), -webkit-transform 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);
2934
- }
2935
- .euiFilePicker--compressed .euiFilePicker__icon {
2936
- top: 8px;
2937
- left: 8px;
2938
- }
2939
- .euiFilePicker--large .euiFilePicker__icon {
2940
- position: static;
2941
- margin-bottom: 16px;
2942
- }
2943
-
2944
- /**
2945
- * 1. Don't block the user from dropping files onto the filepicker.
2946
- * 2. Ensure space for import icon, loading spinner, and clear button (only if it has files)
2947
- * 4. Static height so that it doesn't shift its surrounding contents around
2948
- */
2949
- .euiFilePicker__prompt {
2950
- padding-left: 40px;
2951
- /* 2 */
2952
- height: 40px;
2953
- padding-top: 12px;
2954
- padding-right: 12px;
2955
- padding-bottom: 12px;
2956
- pointer-events: none; /* 1 */
2957
- border: 2px dashed #343741;
2958
- border-radius: 6px;
2959
- transition: border-color 150ms ease-in, background-color 150ms ease-in;
2960
- }
2961
- .euiFilePicker--compressed .euiFilePicker__prompt {
2962
- background-color: #16171c;
2963
- background-repeat: no-repeat;
2964
- background-size: 0% 100%;
2965
- box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
2966
- transition: box-shadow 150ms ease-in, background-image 150ms ease-in, background-size 150ms ease-in, background-color 150ms ease-in;
2967
- padding: 8px;
2968
- border-radius: 4px;
2969
- padding-left: 32px;
2970
- /* 2 */
2971
- height: 32px;
2972
- border-radius: 4px;
2973
- box-shadow: none;
2974
- }
2975
- @supports (-moz-appearance: none) {
2976
- .euiFilePicker--compressed .euiFilePicker__prompt {
2977
- transition-property: box-shadow, background-image, background-size;
2978
- }
2979
- }
2980
- .euiFilePicker--large .euiFilePicker__prompt {
2981
- height: 128px; /* 4 */
2982
- padding: 0 24px;
2983
- display: -webkit-flex;
2984
- display: flex;
2985
- -webkit-flex-direction: column;
2986
- flex-direction: column;
2987
- -webkit-align-items: center;
2988
- align-items: center;
2989
- -webkit-justify-content: center;
2990
- justify-content: center;
2991
- }
2992
- .euiFilePicker--large.euiFilePicker--compressed .euiFilePicker__prompt {
2993
- height: 104px; /* 4 */
2994
- }
2995
- .euiFilePicker-isInvalid:not(.euiFilePicker__showDrop) .euiFilePicker__input:not(:disabled):not(:focus) + .euiFilePicker__prompt {
2996
- border-color: #F86B63;
2997
- }
2998
-
2999
- .euiFilePicker__promptText {
3000
- font-size: 14px;
3001
- font-size: 1rem;
3002
- line-height: 1.7142857143rem;
3003
- max-width: 100%;
3004
- overflow: hidden !important;
3005
- text-overflow: ellipsis !important;
3006
- white-space: nowrap !important;
3007
- line-height: 16px;
3008
- }
3009
- .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) .euiFilePicker__promptText {
3010
- color: #36A2EF;
3011
- }
3012
- .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__promptText {
3013
- margin-top: -2px;
3014
- }
3015
-
3016
- .euiFilePicker__clearButton,
3017
- .euiFilePicker__loadingSpinner {
3018
- position: absolute;
3019
- right: 12px;
3020
- top: 12px;
3021
- }
3022
- .euiFilePicker--compressed .euiFilePicker__clearButton,
3023
- .euiFilePicker--compressed .euiFilePicker__loadingSpinner {
3024
- top: 8px;
3025
- }
3026
-
3027
- /**
3028
- * 1. Undo the pointer-events: none applied to the enclosing prompt.
3029
- */
3030
- .euiFilePicker__clearButton {
3031
- pointer-events: auto; /* 1 */
3032
- }
3033
- .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton {
3034
- width: 16px;
3035
- height: 16px;
3036
- pointer-events: all;
3037
- background-color: #98A2B3;
3038
- border-radius: 16px;
3039
- line-height: 0;
3040
- }
3041
- .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus {
3042
- outline: 2px solid currentColor;
3043
- }
3044
- .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:focus-visible {
3045
- outline-style: auto;
3046
- }
3047
- .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton:focus:not(:focus-visible) {
3048
- outline: none;
3049
- }
3050
- .euiFilePicker:not(.euiFilePicker--large) .euiFilePicker__clearButton .euiFilePicker__clearIcon {
3051
- width: 8px;
3052
- height: 8px;
3053
- fill: #1D1E24;
3054
- stroke: #1D1E24;
3055
- stroke-width: 2px;
3056
- }
3057
- .euiFilePicker--large .euiFilePicker__clearButton {
3058
- position: relative;
3059
- top: 0;
3060
- right: 0;
3061
- }
3062
-
3063
- .euiFilePicker__showDrop .euiFilePicker__prompt,
3064
- .euiFilePicker__input:focus + .euiFilePicker__prompt {
3065
- border-color: #36A2EF;
3066
- }
3067
-
3068
- .euiFilePicker__input:disabled + .euiFilePicker__prompt {
3069
- color: #535966;
3070
- -webkit-text-fill-color: #535966;
3071
- cursor: not-allowed;
3072
- background: #202128;
3073
- box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
3074
- box-shadow: none;
3075
- }
3076
- .euiFilePicker__input:disabled + .euiFilePicker__prompt::-webkit-input-placeholder {
3077
- color: #535966;
3078
- opacity: 1;
3079
- }
3080
- .euiFilePicker__input:disabled + .euiFilePicker__prompt::-moz-placeholder {
3081
- color: #535966;
3082
- opacity: 1;
3083
- }
3084
- .euiFilePicker__input:disabled + .euiFilePicker__prompt::placeholder {
3085
- color: #535966;
3086
- opacity: 1;
3087
- }
3088
-
3089
- .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-isLoading .euiFilePicker__prompt, .euiFilePicker:not(.euiFilePicker--large).euiFilePicker-hasFiles .euiFilePicker__prompt {
3090
- padding-right: 40px;
3091
- /* 2 */
3092
- }
3093
-
3094
- .euiFilePicker-hasFiles .euiFilePicker__promptText {
3095
- color: #DFE5EF;
3096
- }
3097
-
3098
- .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__promptText,
3099
- .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__promptText {
3100
- text-decoration: underline;
3101
- }
3102
- .euiFilePicker--large .euiFilePicker__input:hover:not(:disabled) + .euiFilePicker__prompt .euiFilePicker__icon,
3103
- .euiFilePicker--large .euiFilePicker__input:focus + .euiFilePicker__prompt .euiFilePicker__icon {
3104
- -webkit-transform: scale(1.1);
3105
- transform: scale(1.1);
3106
- }
3107
- .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__promptText {
3108
- text-decoration: underline;
3109
- }
3110
- .euiFilePicker--large.euiFilePicker__showDrop .euiFilePicker__prompt .euiFilePicker__icon {
3111
- -webkit-transform: scale(1.1);
3112
- transform: scale(1.1);
3113
- }
3114
- .euiFilePicker--large.euiFilePicker-hasFiles .euiFilePicker__promptText {
3115
- font-weight: 700;
3116
- }
3117
-
3118
2878
  .euiForm__error {
3119
2879
  font-size: 14px;
3120
2880
  font-size: 1rem;