@elastic/eui 70.2.1 → 70.2.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/es/components/button/button.js +1 -0
- package/es/components/button/button_display/_button_display.js +3 -3
- package/es/components/button/button_display/_button_display.styles.js +2 -1
- package/es/components/date_picker/super_date_picker/super_update_button.js +1 -1
- package/es/components/facet/facet_button.js +55 -1
- package/es/global_styling/mixins/_helpers.js +1 -1
- package/eui.d.ts +4 -3
- package/lib/components/button/button.js +1 -0
- package/lib/components/button/button_display/_button_display.js +3 -3
- package/lib/components/button/button_display/_button_display.styles.js +2 -1
- package/lib/components/date_picker/super_date_picker/super_update_button.js +1 -1
- package/lib/components/facet/facet_button.js +56 -2
- package/lib/global_styling/mixins/_helpers.js +1 -1
- package/optimize/es/components/button/button.js +1 -0
- package/optimize/es/components/button/button_display/_button_display.js +2 -2
- package/optimize/es/components/button/button_display/_button_display.styles.js +2 -1
- package/optimize/es/components/date_picker/super_date_picker/super_update_button.js +1 -1
- package/optimize/es/global_styling/mixins/_helpers.js +1 -1
- package/optimize/lib/components/button/button.js +1 -0
- package/optimize/lib/components/button/button_display/_button_display.js +2 -2
- package/optimize/lib/components/button/button_display/_button_display.styles.js +2 -1
- package/optimize/lib/components/date_picker/super_date_picker/super_update_button.js +1 -1
- package/optimize/lib/global_styling/mixins/_helpers.js +1 -1
- package/package.json +1 -1
- package/test-env/components/button/button.js +1 -0
- package/test-env/components/button/button_display/_button_display.js +3 -3
- package/test-env/components/button/button_display/_button_display.styles.js +2 -1
- package/test-env/components/date_picker/super_date_picker/super_update_button.js +1 -1
- package/test-env/components/facet/facet_button.js +56 -2
- package/test-env/global_styling/mixins/_helpers.js +1 -1
|
@@ -212,6 +212,7 @@ export var EuiButtonDisplayDeprecated = /*#__PURE__*/forwardRef(function (_ref,
|
|
|
212
212
|
|
|
213
213
|
if (minWidth !== undefined || minWidth !== null) {
|
|
214
214
|
calculatedStyle = _objectSpread(_objectSpread({}, calculatedStyle), {}, {
|
|
215
|
+
// @ts-ignore - deprecated component
|
|
215
216
|
minWidth: minWidth
|
|
216
217
|
});
|
|
217
218
|
}
|
|
@@ -74,7 +74,7 @@ export var EuiButtonDisplay = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
|
74
74
|
var theme = useEuiTheme();
|
|
75
75
|
var styles = euiButtonDisplayStyles(theme);
|
|
76
76
|
var buttonRadiusStyle = useEuiButtonRadiusCSS()[size];
|
|
77
|
-
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
77
|
+
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, minWidth == null && styles.defaultMinWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
78
78
|
|
|
79
79
|
var innerNode = ___EmotionJSX(EuiButtonDisplayContent, _extends({
|
|
80
80
|
isLoading: isLoading,
|
|
@@ -111,7 +111,7 @@ export var EuiButtonDisplay = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
|
111
111
|
|
|
112
112
|
return createElement(element, _objectSpread(_objectSpread(_objectSpread({
|
|
113
113
|
css: cssStyles,
|
|
114
|
-
style: minWidth
|
|
114
|
+
style: minWidth ? _objectSpread(_objectSpread({}, style), {}, {
|
|
115
115
|
minInlineSize: minWidth
|
|
116
116
|
}) : style,
|
|
117
117
|
ref: ref
|
|
@@ -150,7 +150,7 @@ EuiButtonDisplay.propTypes = {
|
|
|
150
150
|
/**
|
|
151
151
|
* Override the default minimum width
|
|
152
152
|
*/
|
|
153
|
-
minWidth: PropTypes.any,
|
|
153
|
+
minWidth: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.oneOf([false])]),
|
|
154
154
|
|
|
155
155
|
/**
|
|
156
156
|
* Force disables the button and changes the icon to a loading spinner
|
|
@@ -32,10 +32,11 @@ export var euiButtonDisplayStyles = function euiButtonDisplayStyles(euiThemeCont
|
|
|
32
32
|
var euiTheme = euiThemeContext.euiTheme;
|
|
33
33
|
return {
|
|
34
34
|
// Base
|
|
35
|
-
euiButtonDisplay: /*#__PURE__*/css(euiButtonBaseCSS(), ";
|
|
35
|
+
euiButtonDisplay: /*#__PURE__*/css(euiButtonBaseCSS(), ";font-weight:", euiTheme.font.weight.medium, ";padding:0 ", euiTheme.size.m, ";&:hover:not(:disabled),&:focus{text-decoration:underline;};label:euiButtonDisplay;"),
|
|
36
36
|
// States
|
|
37
37
|
isDisabled: _ref,
|
|
38
38
|
fullWidth: /*#__PURE__*/css("display:block;", logicalCSS('width', '100%'), ";;label:fullWidth;"),
|
|
39
|
+
defaultMinWidth: /*#__PURE__*/css(logicalCSS('min-width', "".concat(euiTheme.base * 7, "px")), ";;label:defaultMinWidth;"),
|
|
39
40
|
// Sizes
|
|
40
41
|
xs: /*#__PURE__*/css(_buttonSize(euiTheme.size.l), euiFontSize(euiThemeContext, 'xs'), ";label:xs;"),
|
|
41
42
|
s: /*#__PURE__*/css(_buttonSize(euiTheme.size.xl), euiFontSize(euiThemeContext, 's'), ";label:s;"),
|
|
@@ -181,7 +181,7 @@ export var EuiSuperUpdateButton = /*#__PURE__*/function (_Component) {
|
|
|
181
181
|
sizes: responsive || 'none'
|
|
182
182
|
}, ___EmotionJSX(EuiButton, _extends({
|
|
183
183
|
className: classes,
|
|
184
|
-
minWidth:
|
|
184
|
+
minWidth: false
|
|
185
185
|
}, sharedButtonProps, {
|
|
186
186
|
fill: fill,
|
|
187
187
|
textProps: _objectSpread(_objectSpread({}, restTextProps), {}, {
|
|
@@ -105,7 +105,7 @@ EuiFacetButton.propTypes = {
|
|
|
105
105
|
/**
|
|
106
106
|
* ReactNode to render as this component's content
|
|
107
107
|
*/
|
|
108
|
-
children: PropTypes.node.isRequired,
|
|
108
|
+
children: PropTypes.oneOfType([PropTypes.node.isRequired, PropTypes.node]),
|
|
109
109
|
|
|
110
110
|
/**
|
|
111
111
|
* Any node, but preferably a `EuiIcon` or `EuiAvatar`
|
|
@@ -113,11 +113,20 @@ EuiFacetButton.propTypes = {
|
|
|
113
113
|
icon: PropTypes.node,
|
|
114
114
|
isDisabled: PropTypes.bool,
|
|
115
115
|
|
|
116
|
+
/**
|
|
117
|
+
* Force disables the button and changes the icon to a loading spinner
|
|
118
|
+
*/
|
|
119
|
+
|
|
116
120
|
/**
|
|
117
121
|
* Adds/swaps for loading spinner & disables
|
|
118
122
|
*/
|
|
119
123
|
isLoading: PropTypes.bool,
|
|
120
124
|
|
|
125
|
+
/**
|
|
126
|
+
* Applies the boolean state as the `aria-pressed` property to create a toggle button.
|
|
127
|
+
* *Only use when the readable text does not change between states.*
|
|
128
|
+
*/
|
|
129
|
+
|
|
121
130
|
/**
|
|
122
131
|
* Changes visual of button to indicate it's currently selected
|
|
123
132
|
*/
|
|
@@ -127,6 +136,51 @@ EuiFacetButton.propTypes = {
|
|
|
127
136
|
* Adds a notification indicator for displaying the quantity provided
|
|
128
137
|
*/
|
|
129
138
|
quantity: PropTypes.number,
|
|
139
|
+
size: PropTypes.any,
|
|
140
|
+
|
|
141
|
+
/**
|
|
142
|
+
* Extends the button to 100% width
|
|
143
|
+
*/
|
|
144
|
+
fullWidth: PropTypes.bool,
|
|
145
|
+
|
|
146
|
+
/**
|
|
147
|
+
* Override the default minimum width
|
|
148
|
+
*/
|
|
149
|
+
minWidth: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.oneOf([false])]),
|
|
150
|
+
|
|
151
|
+
/**
|
|
152
|
+
* Object of props passed to the <span/> wrapping the button's content
|
|
153
|
+
*/
|
|
154
|
+
contentProps: PropTypes.shape({
|
|
155
|
+
className: PropTypes.string,
|
|
156
|
+
"aria-label": PropTypes.string,
|
|
157
|
+
"data-test-subj": PropTypes.string,
|
|
158
|
+
css: PropTypes.any
|
|
159
|
+
}),
|
|
160
|
+
style: PropTypes.any,
|
|
161
|
+
|
|
162
|
+
/**
|
|
163
|
+
* Any `type` accepted by EuiIcon
|
|
164
|
+
*/
|
|
165
|
+
iconType: PropTypes.oneOfType([PropTypes.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "alert", "analyzeEvent", "annotation", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "asterisk", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "check", "checkInCircleFilled", "cheer", "classificationJob", "clock", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crossInACircleFilled", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "discoverApp", "document", "documentEdit", "documentation", "documents", "dot", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "eql", "eraser", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "mobile", "monitoringApp", "moon", "namespace", "nested", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipelineApp", "play", "playFilled", "plus", "plusInCircle", "plusInCircleFilled", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelionApp", "timeRefresh", "timeslider", "training", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "watchesApp", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenDenseVector", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable"]).isRequired, PropTypes.string.isRequired, PropTypes.elementType.isRequired]),
|
|
166
|
+
|
|
167
|
+
/**
|
|
168
|
+
* Can only be one side `left` or `right`
|
|
169
|
+
*/
|
|
170
|
+
iconSide: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.oneOf([undefined])]),
|
|
171
|
+
|
|
172
|
+
/**
|
|
173
|
+
* Object of props passed to the <span/> wrapping the content's text/children only (not icon)
|
|
174
|
+
*/
|
|
175
|
+
textProps: PropTypes.shape({
|
|
176
|
+
className: PropTypes.string,
|
|
177
|
+
"aria-label": PropTypes.string,
|
|
178
|
+
"data-test-subj": PropTypes.string,
|
|
179
|
+
css: PropTypes.any,
|
|
180
|
+
ref: PropTypes.any,
|
|
181
|
+
"data-text": PropTypes.string
|
|
182
|
+
}),
|
|
183
|
+
iconSize: PropTypes.any,
|
|
130
184
|
className: PropTypes.string,
|
|
131
185
|
"aria-label": PropTypes.string,
|
|
132
186
|
"data-test-subj": PropTypes.string,
|
|
@@ -55,7 +55,7 @@ var euiOverflowShadowStyles = function euiOverflowShadowStyles(_ref3) {
|
|
|
55
55
|
|
|
56
56
|
var direction = _direction || 'y';
|
|
57
57
|
var side = _side || 'both';
|
|
58
|
-
var hideHeight =
|
|
58
|
+
var hideHeight = size.s;
|
|
59
59
|
var gradientStart = "\n ".concat(transparentize('red', 0.1), " 0%,\n ").concat(transparentize('red', 1), " ").concat(hideHeight, "\n ");
|
|
60
60
|
var gradientEnd = "\n ".concat(transparentize('red', 1), " calc(100% - ").concat(hideHeight, "),\n ").concat(transparentize('red', 0.1), " 100%\n ");
|
|
61
61
|
var gradient = '';
|
package/eui.d.ts
CHANGED
|
@@ -1901,6 +1901,7 @@ declare module '@elastic/eui/src/components/button/button_display/_button_displa
|
|
|
1901
1901
|
euiButtonDisplay: import("@emotion/utils").SerializedStyles;
|
|
1902
1902
|
isDisabled: import("@emotion/utils").SerializedStyles;
|
|
1903
1903
|
fullWidth: import("@emotion/utils").SerializedStyles;
|
|
1904
|
+
defaultMinWidth: import("@emotion/utils").SerializedStyles;
|
|
1904
1905
|
xs: import("@emotion/utils").SerializedStyles;
|
|
1905
1906
|
s: import("@emotion/utils").SerializedStyles;
|
|
1906
1907
|
m: import("@emotion/utils").SerializedStyles;
|
|
@@ -2052,7 +2053,7 @@ declare module '@elastic/eui/src/components/button/button_display/_button_displa
|
|
|
2052
2053
|
/**
|
|
2053
2054
|
* Override the default minimum width
|
|
2054
2055
|
*/
|
|
2055
|
-
minWidth?: CSSProperties['minWidth'];
|
|
2056
|
+
minWidth?: CSSProperties['minWidth'] | false;
|
|
2056
2057
|
/**
|
|
2057
2058
|
* Force disables the button and changes the icon to a loading spinner
|
|
2058
2059
|
*/
|
|
@@ -14442,8 +14443,8 @@ declare module '@elastic/eui/src/components/facet/facet_button.styles' {
|
|
|
14442
14443
|
}
|
|
14443
14444
|
declare module '@elastic/eui/src/components/facet/facet_button' {
|
|
14444
14445
|
import { FunctionComponent, HTMLAttributes, ReactNode, RefCallback } from 'react';
|
|
14445
|
-
import {
|
|
14446
|
-
export interface EuiFacetButtonProps extends
|
|
14446
|
+
import { EuiButtonDisplayCommonProps } from '@elastic/eui/src/components/button/button_display/_button_display';
|
|
14447
|
+
export interface EuiFacetButtonProps extends EuiButtonDisplayCommonProps, HTMLAttributes<HTMLButtonElement> {
|
|
14447
14448
|
buttonRef?: RefCallback<HTMLButtonElement>;
|
|
14448
14449
|
/**
|
|
14449
14450
|
* ReactNode to render as this component's content
|
|
@@ -231,6 +231,7 @@ var EuiButtonDisplayDeprecated = /*#__PURE__*/(0, _react.forwardRef)(function (_
|
|
|
231
231
|
|
|
232
232
|
if (minWidth !== undefined || minWidth !== null) {
|
|
233
233
|
calculatedStyle = _objectSpread(_objectSpread({}, calculatedStyle), {}, {
|
|
234
|
+
// @ts-ignore - deprecated component
|
|
234
235
|
minWidth: minWidth
|
|
235
236
|
});
|
|
236
237
|
}
|
|
@@ -91,7 +91,7 @@ var EuiButtonDisplay = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref)
|
|
|
91
91
|
var theme = (0, _services.useEuiTheme)();
|
|
92
92
|
var styles = (0, _button_display.euiButtonDisplayStyles)(theme);
|
|
93
93
|
var buttonRadiusStyle = (0, _mixins.useEuiButtonRadiusCSS)()[size];
|
|
94
|
-
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
94
|
+
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, minWidth == null && styles.defaultMinWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
95
95
|
var innerNode = (0, _react2.jsx)(_button_display_content.EuiButtonDisplayContent, _extends({
|
|
96
96
|
isLoading: isLoading,
|
|
97
97
|
isDisabled: buttonIsDisabled,
|
|
@@ -126,7 +126,7 @@ var EuiButtonDisplay = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref)
|
|
|
126
126
|
|
|
127
127
|
return (0, _react2.createElement)(element, _objectSpread(_objectSpread(_objectSpread({
|
|
128
128
|
css: cssStyles,
|
|
129
|
-
style: minWidth
|
|
129
|
+
style: minWidth ? _objectSpread(_objectSpread({}, style), {}, {
|
|
130
130
|
minInlineSize: minWidth
|
|
131
131
|
}) : style,
|
|
132
132
|
ref: ref
|
|
@@ -166,7 +166,7 @@ EuiButtonDisplay.propTypes = {
|
|
|
166
166
|
/**
|
|
167
167
|
* Override the default minimum width
|
|
168
168
|
*/
|
|
169
|
-
minWidth: _propTypes.default.any,
|
|
169
|
+
minWidth: _propTypes.default.oneOfType([_propTypes.default.any.isRequired, _propTypes.default.oneOf([false])]),
|
|
170
170
|
|
|
171
171
|
/**
|
|
172
172
|
* Force disables the button and changes the icon to a loading spinner
|
|
@@ -36,10 +36,11 @@ var euiButtonDisplayStyles = function euiButtonDisplayStyles(euiThemeContext) {
|
|
|
36
36
|
var euiTheme = euiThemeContext.euiTheme;
|
|
37
37
|
return {
|
|
38
38
|
// Base
|
|
39
|
-
euiButtonDisplay: /*#__PURE__*/(0, _react.css)(euiButtonBaseCSS(), ";
|
|
39
|
+
euiButtonDisplay: /*#__PURE__*/(0, _react.css)(euiButtonBaseCSS(), ";font-weight:", euiTheme.font.weight.medium, ";padding:0 ", euiTheme.size.m, ";&:hover:not(:disabled),&:focus{text-decoration:underline;};label:euiButtonDisplay;"),
|
|
40
40
|
// States
|
|
41
41
|
isDisabled: _ref,
|
|
42
42
|
fullWidth: /*#__PURE__*/(0, _react.css)("display:block;", (0, _global_styling.logicalCSS)('width', '100%'), ";;label:fullWidth;"),
|
|
43
|
+
defaultMinWidth: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('min-width', "".concat(euiTheme.base * 7, "px")), ";;label:defaultMinWidth;"),
|
|
43
44
|
// Sizes
|
|
44
45
|
xs: /*#__PURE__*/(0, _react.css)(_buttonSize(euiTheme.size.l), (0, _global_styling.euiFontSize)(euiThemeContext, 'xs'), ";label:xs;"),
|
|
45
46
|
s: /*#__PURE__*/(0, _react.css)(_buttonSize(euiTheme.size.xl), (0, _global_styling.euiFontSize)(euiThemeContext, 's'), ";label:s;"),
|
|
@@ -194,7 +194,7 @@ var EuiSuperUpdateButton = /*#__PURE__*/function (_Component) {
|
|
|
194
194
|
sizes: responsive || 'none'
|
|
195
195
|
}, (0, _react2.jsx)(_button.EuiButton, _extends({
|
|
196
196
|
className: classes,
|
|
197
|
-
minWidth:
|
|
197
|
+
minWidth: false
|
|
198
198
|
}, sharedButtonProps, {
|
|
199
199
|
fill: fill,
|
|
200
200
|
textProps: _objectSpread(_objectSpread({}, restTextProps), {}, {
|
|
@@ -120,19 +120,28 @@ EuiFacetButton.propTypes = {
|
|
|
120
120
|
/**
|
|
121
121
|
* ReactNode to render as this component's content
|
|
122
122
|
*/
|
|
123
|
-
children: _propTypes.default.node.isRequired,
|
|
123
|
+
children: _propTypes.default.oneOfType([_propTypes.default.node.isRequired, _propTypes.default.node]),
|
|
124
124
|
|
|
125
125
|
/**
|
|
126
126
|
* Any node, but preferably a `EuiIcon` or `EuiAvatar`
|
|
127
127
|
*/
|
|
128
128
|
icon: _propTypes.default.node,
|
|
129
|
-
isDisabled: _propTypes.default.bool,
|
|
129
|
+
isDisabled: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.bool]),
|
|
130
|
+
|
|
131
|
+
/**
|
|
132
|
+
* Force disables the button and changes the icon to a loading spinner
|
|
133
|
+
*/
|
|
130
134
|
|
|
131
135
|
/**
|
|
132
136
|
* Adds/swaps for loading spinner & disables
|
|
133
137
|
*/
|
|
134
138
|
isLoading: _propTypes.default.bool,
|
|
135
139
|
|
|
140
|
+
/**
|
|
141
|
+
* Applies the boolean state as the `aria-pressed` property to create a toggle button.
|
|
142
|
+
* *Only use when the readable text does not change between states.*
|
|
143
|
+
*/
|
|
144
|
+
|
|
136
145
|
/**
|
|
137
146
|
* Changes visual of button to indicate it's currently selected
|
|
138
147
|
*/
|
|
@@ -142,6 +151,51 @@ EuiFacetButton.propTypes = {
|
|
|
142
151
|
* Adds a notification indicator for displaying the quantity provided
|
|
143
152
|
*/
|
|
144
153
|
quantity: _propTypes.default.number,
|
|
154
|
+
size: _propTypes.default.any,
|
|
155
|
+
|
|
156
|
+
/**
|
|
157
|
+
* Extends the button to 100% width
|
|
158
|
+
*/
|
|
159
|
+
fullWidth: _propTypes.default.bool,
|
|
160
|
+
|
|
161
|
+
/**
|
|
162
|
+
* Override the default minimum width
|
|
163
|
+
*/
|
|
164
|
+
minWidth: _propTypes.default.oneOfType([_propTypes.default.any.isRequired, _propTypes.default.oneOf([false])]),
|
|
165
|
+
|
|
166
|
+
/**
|
|
167
|
+
* Object of props passed to the <span/> wrapping the button's content
|
|
168
|
+
*/
|
|
169
|
+
contentProps: _propTypes.default.shape({
|
|
170
|
+
className: _propTypes.default.string,
|
|
171
|
+
"aria-label": _propTypes.default.string,
|
|
172
|
+
"data-test-subj": _propTypes.default.string,
|
|
173
|
+
css: _propTypes.default.any
|
|
174
|
+
}),
|
|
175
|
+
style: _propTypes.default.any,
|
|
176
|
+
|
|
177
|
+
/**
|
|
178
|
+
* Any `type` accepted by EuiIcon
|
|
179
|
+
*/
|
|
180
|
+
iconType: _propTypes.default.oneOfType([_propTypes.default.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "alert", "analyzeEvent", "annotation", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "asterisk", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "check", "checkInCircleFilled", "cheer", "classificationJob", "clock", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crossInACircleFilled", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "discoverApp", "document", "documentEdit", "documentation", "documents", "dot", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "eql", "eraser", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "mobile", "monitoringApp", "moon", "namespace", "nested", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipelineApp", "play", "playFilled", "plus", "plusInCircle", "plusInCircleFilled", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelionApp", "timeRefresh", "timeslider", "training", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "watchesApp", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenDenseVector", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable"]).isRequired, _propTypes.default.string.isRequired, _propTypes.default.elementType.isRequired]),
|
|
181
|
+
|
|
182
|
+
/**
|
|
183
|
+
* Can only be one side `left` or `right`
|
|
184
|
+
*/
|
|
185
|
+
iconSide: _propTypes.default.oneOfType([_propTypes.default.any.isRequired, _propTypes.default.oneOf([undefined])]),
|
|
186
|
+
|
|
187
|
+
/**
|
|
188
|
+
* Object of props passed to the <span/> wrapping the content's text/children only (not icon)
|
|
189
|
+
*/
|
|
190
|
+
textProps: _propTypes.default.shape({
|
|
191
|
+
className: _propTypes.default.string,
|
|
192
|
+
"aria-label": _propTypes.default.string,
|
|
193
|
+
"data-test-subj": _propTypes.default.string,
|
|
194
|
+
css: _propTypes.default.any,
|
|
195
|
+
ref: _propTypes.default.any,
|
|
196
|
+
"data-text": _propTypes.default.string
|
|
197
|
+
}),
|
|
198
|
+
iconSize: _propTypes.default.any,
|
|
145
199
|
className: _propTypes.default.string,
|
|
146
200
|
"aria-label": _propTypes.default.string,
|
|
147
201
|
"data-test-subj": _propTypes.default.string,
|
|
@@ -66,7 +66,7 @@ var euiOverflowShadowStyles = function euiOverflowShadowStyles(_ref3) {
|
|
|
66
66
|
|
|
67
67
|
var direction = _direction || 'y';
|
|
68
68
|
var side = _side || 'both';
|
|
69
|
-
var hideHeight =
|
|
69
|
+
var hideHeight = size.s;
|
|
70
70
|
var gradientStart = "\n ".concat((0, _color.transparentize)('red', 0.1), " 0%,\n ").concat((0, _color.transparentize)('red', 1), " ").concat(hideHeight, "\n ");
|
|
71
71
|
var gradientEnd = "\n ".concat((0, _color.transparentize)('red', 1), " calc(100% - ").concat(hideHeight, "),\n ").concat((0, _color.transparentize)('red', 0.1), " 100%\n ");
|
|
72
72
|
var gradient = '';
|
|
@@ -146,6 +146,7 @@ export var EuiButtonDisplayDeprecated = /*#__PURE__*/forwardRef(function (_ref,
|
|
|
146
146
|
|
|
147
147
|
if (minWidth !== undefined || minWidth !== null) {
|
|
148
148
|
calculatedStyle = _objectSpread(_objectSpread({}, calculatedStyle), {}, {
|
|
149
|
+
// @ts-ignore - deprecated component
|
|
149
150
|
minWidth: minWidth
|
|
150
151
|
});
|
|
151
152
|
}
|
|
@@ -68,7 +68,7 @@ export var EuiButtonDisplay = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
|
68
68
|
var theme = useEuiTheme();
|
|
69
69
|
var styles = euiButtonDisplayStyles(theme);
|
|
70
70
|
var buttonRadiusStyle = useEuiButtonRadiusCSS()[size];
|
|
71
|
-
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
71
|
+
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, minWidth == null && styles.defaultMinWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
72
72
|
|
|
73
73
|
var innerNode = ___EmotionJSX(EuiButtonDisplayContent, _extends({
|
|
74
74
|
isLoading: isLoading,
|
|
@@ -105,7 +105,7 @@ export var EuiButtonDisplay = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
|
105
105
|
|
|
106
106
|
return createElement(element, _objectSpread(_objectSpread(_objectSpread({
|
|
107
107
|
css: cssStyles,
|
|
108
|
-
style: minWidth
|
|
108
|
+
style: minWidth ? _objectSpread(_objectSpread({}, style), {}, {
|
|
109
109
|
minInlineSize: minWidth
|
|
110
110
|
}) : style,
|
|
111
111
|
ref: ref
|
|
@@ -32,10 +32,11 @@ export var euiButtonDisplayStyles = function euiButtonDisplayStyles(euiThemeCont
|
|
|
32
32
|
var euiTheme = euiThemeContext.euiTheme;
|
|
33
33
|
return {
|
|
34
34
|
// Base
|
|
35
|
-
euiButtonDisplay: /*#__PURE__*/css(euiButtonBaseCSS(), ";
|
|
35
|
+
euiButtonDisplay: /*#__PURE__*/css(euiButtonBaseCSS(), ";font-weight:", euiTheme.font.weight.medium, ";padding:0 ", euiTheme.size.m, ";&:hover:not(:disabled),&:focus{text-decoration:underline;};label:euiButtonDisplay;"),
|
|
36
36
|
// States
|
|
37
37
|
isDisabled: _ref,
|
|
38
38
|
fullWidth: /*#__PURE__*/css("display:block;", logicalCSS('width', '100%'), ";;label:fullWidth;"),
|
|
39
|
+
defaultMinWidth: /*#__PURE__*/css(logicalCSS('min-width', "".concat(euiTheme.base * 7, "px")), ";;label:defaultMinWidth;"),
|
|
39
40
|
// Sizes
|
|
40
41
|
xs: /*#__PURE__*/css(_buttonSize(euiTheme.size.l), euiFontSize(euiThemeContext, 'xs'), ";label:xs;"),
|
|
41
42
|
s: /*#__PURE__*/css(_buttonSize(euiTheme.size.xl), euiFontSize(euiThemeContext, 's'), ";label:s;"),
|
|
@@ -163,7 +163,7 @@ export var EuiSuperUpdateButton = /*#__PURE__*/function (_Component) {
|
|
|
163
163
|
sizes: responsive || 'none'
|
|
164
164
|
}, ___EmotionJSX(EuiButton, _extends({
|
|
165
165
|
className: classes,
|
|
166
|
-
minWidth:
|
|
166
|
+
minWidth: false
|
|
167
167
|
}, sharedButtonProps, {
|
|
168
168
|
fill: fill,
|
|
169
169
|
textProps: _objectSpread(_objectSpread({}, restTextProps), {}, {
|
|
@@ -55,7 +55,7 @@ var euiOverflowShadowStyles = function euiOverflowShadowStyles(_ref3) {
|
|
|
55
55
|
|
|
56
56
|
var direction = _direction || 'y';
|
|
57
57
|
var side = _side || 'both';
|
|
58
|
-
var hideHeight =
|
|
58
|
+
var hideHeight = size.s;
|
|
59
59
|
var gradientStart = "\n ".concat(transparentize('red', 0.1), " 0%,\n ").concat(transparentize('red', 1), " ").concat(hideHeight, "\n ");
|
|
60
60
|
var gradientEnd = "\n ".concat(transparentize('red', 1), " calc(100% - ").concat(hideHeight, "),\n ").concat(transparentize('red', 0.1), " 100%\n ");
|
|
61
61
|
var gradient = '';
|
|
@@ -168,6 +168,7 @@ var EuiButtonDisplayDeprecated = /*#__PURE__*/(0, _react.forwardRef)(function (_
|
|
|
168
168
|
|
|
169
169
|
if (minWidth !== undefined || minWidth !== null) {
|
|
170
170
|
calculatedStyle = _objectSpread(_objectSpread({}, calculatedStyle), {}, {
|
|
171
|
+
// @ts-ignore - deprecated component
|
|
171
172
|
minWidth: minWidth
|
|
172
173
|
});
|
|
173
174
|
}
|
|
@@ -86,7 +86,7 @@ var EuiButtonDisplay = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref)
|
|
|
86
86
|
var theme = (0, _services.useEuiTheme)();
|
|
87
87
|
var styles = (0, _button_display.euiButtonDisplayStyles)(theme);
|
|
88
88
|
var buttonRadiusStyle = (0, _mixins.useEuiButtonRadiusCSS)()[size];
|
|
89
|
-
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
89
|
+
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, minWidth == null && styles.defaultMinWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
90
90
|
var innerNode = (0, _react2.jsx)(_button_display_content.EuiButtonDisplayContent, (0, _extends2.default)({
|
|
91
91
|
isLoading: isLoading,
|
|
92
92
|
isDisabled: buttonIsDisabled,
|
|
@@ -121,7 +121,7 @@ var EuiButtonDisplay = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref)
|
|
|
121
121
|
|
|
122
122
|
return (0, _react2.createElement)(element, _objectSpread(_objectSpread(_objectSpread({
|
|
123
123
|
css: cssStyles,
|
|
124
|
-
style: minWidth
|
|
124
|
+
style: minWidth ? _objectSpread(_objectSpread({}, style), {}, {
|
|
125
125
|
minInlineSize: minWidth
|
|
126
126
|
}) : style,
|
|
127
127
|
ref: ref
|
|
@@ -36,10 +36,11 @@ var euiButtonDisplayStyles = function euiButtonDisplayStyles(euiThemeContext) {
|
|
|
36
36
|
var euiTheme = euiThemeContext.euiTheme;
|
|
37
37
|
return {
|
|
38
38
|
// Base
|
|
39
|
-
euiButtonDisplay: /*#__PURE__*/(0, _react.css)(euiButtonBaseCSS(), ";
|
|
39
|
+
euiButtonDisplay: /*#__PURE__*/(0, _react.css)(euiButtonBaseCSS(), ";font-weight:", euiTheme.font.weight.medium, ";padding:0 ", euiTheme.size.m, ";&:hover:not(:disabled),&:focus{text-decoration:underline;};label:euiButtonDisplay;"),
|
|
40
40
|
// States
|
|
41
41
|
isDisabled: _ref,
|
|
42
42
|
fullWidth: /*#__PURE__*/(0, _react.css)("display:block;", (0, _global_styling.logicalCSS)('width', '100%'), ";;label:fullWidth;"),
|
|
43
|
+
defaultMinWidth: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('min-width', "".concat(euiTheme.base * 7, "px")), ";;label:defaultMinWidth;"),
|
|
43
44
|
// Sizes
|
|
44
45
|
xs: /*#__PURE__*/(0, _react.css)(_buttonSize(euiTheme.size.l), (0, _global_styling.euiFontSize)(euiThemeContext, 'xs'), ";label:xs;"),
|
|
45
46
|
s: /*#__PURE__*/(0, _react.css)(_buttonSize(euiTheme.size.xl), (0, _global_styling.euiFontSize)(euiThemeContext, 's'), ";label:s;"),
|
|
@@ -178,7 +178,7 @@ var EuiSuperUpdateButton = /*#__PURE__*/function (_Component) {
|
|
|
178
178
|
sizes: responsive || 'none'
|
|
179
179
|
}, (0, _react2.jsx)(_button.EuiButton, (0, _extends2.default)({
|
|
180
180
|
className: classes,
|
|
181
|
-
minWidth:
|
|
181
|
+
minWidth: false
|
|
182
182
|
}, sharedButtonProps, {
|
|
183
183
|
fill: fill,
|
|
184
184
|
textProps: _objectSpread(_objectSpread({}, restTextProps), {}, {
|
|
@@ -66,7 +66,7 @@ var euiOverflowShadowStyles = function euiOverflowShadowStyles(_ref3) {
|
|
|
66
66
|
|
|
67
67
|
var direction = _direction || 'y';
|
|
68
68
|
var side = _side || 'both';
|
|
69
|
-
var hideHeight =
|
|
69
|
+
var hideHeight = size.s;
|
|
70
70
|
var gradientStart = "\n ".concat((0, _color.transparentize)('red', 0.1), " 0%,\n ").concat((0, _color.transparentize)('red', 1), " ").concat(hideHeight, "\n ");
|
|
71
71
|
var gradientEnd = "\n ".concat((0, _color.transparentize)('red', 1), " calc(100% - ").concat(hideHeight, "),\n ").concat((0, _color.transparentize)('red', 0.1), " 100%\n ");
|
|
72
72
|
var gradient = '';
|
package/package.json
CHANGED
|
@@ -218,6 +218,7 @@ var EuiButtonDisplayDeprecated = /*#__PURE__*/(0, _react.forwardRef)(function (_
|
|
|
218
218
|
|
|
219
219
|
if (minWidth !== undefined || minWidth !== null) {
|
|
220
220
|
calculatedStyle = _objectSpread(_objectSpread({}, calculatedStyle), {}, {
|
|
221
|
+
// @ts-ignore - deprecated component
|
|
221
222
|
minWidth: minWidth
|
|
222
223
|
});
|
|
223
224
|
}
|
|
@@ -88,7 +88,7 @@ var EuiButtonDisplay = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref)
|
|
|
88
88
|
var theme = (0, _services.useEuiTheme)();
|
|
89
89
|
var styles = (0, _button_display.euiButtonDisplayStyles)(theme);
|
|
90
90
|
var buttonRadiusStyle = (0, _mixins.useEuiButtonRadiusCSS)()[size];
|
|
91
|
-
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
91
|
+
var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, minWidth == null && styles.defaultMinWidth, buttonIsDisabled && styles.isDisabled, buttonRadiusStyle];
|
|
92
92
|
var innerNode = (0, _react2.jsx)(_button_display_content.EuiButtonDisplayContent, (0, _extends2.default)({
|
|
93
93
|
isLoading: isLoading,
|
|
94
94
|
isDisabled: buttonIsDisabled,
|
|
@@ -123,7 +123,7 @@ var EuiButtonDisplay = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref)
|
|
|
123
123
|
|
|
124
124
|
return (0, _react2.createElement)(element, _objectSpread(_objectSpread(_objectSpread({
|
|
125
125
|
css: cssStyles,
|
|
126
|
-
style: minWidth
|
|
126
|
+
style: minWidth ? _objectSpread(_objectSpread({}, style), {}, {
|
|
127
127
|
minInlineSize: minWidth
|
|
128
128
|
}) : style,
|
|
129
129
|
ref: ref
|
|
@@ -163,7 +163,7 @@ EuiButtonDisplay.propTypes = {
|
|
|
163
163
|
/**
|
|
164
164
|
* Override the default minimum width
|
|
165
165
|
*/
|
|
166
|
-
minWidth: _propTypes.default.any,
|
|
166
|
+
minWidth: _propTypes.default.oneOfType([_propTypes.default.any.isRequired, _propTypes.default.oneOf([false])]),
|
|
167
167
|
|
|
168
168
|
/**
|
|
169
169
|
* Force disables the button and changes the icon to a loading spinner
|
|
@@ -36,10 +36,11 @@ var euiButtonDisplayStyles = function euiButtonDisplayStyles(euiThemeContext) {
|
|
|
36
36
|
var euiTheme = euiThemeContext.euiTheme;
|
|
37
37
|
return {
|
|
38
38
|
// Base
|
|
39
|
-
euiButtonDisplay: /*#__PURE__*/(0, _react.css)(euiButtonBaseCSS(), ";
|
|
39
|
+
euiButtonDisplay: /*#__PURE__*/(0, _react.css)(euiButtonBaseCSS(), ";font-weight:", euiTheme.font.weight.medium, ";padding:0 ", euiTheme.size.m, ";&:hover:not(:disabled),&:focus{text-decoration:underline;};label:euiButtonDisplay;"),
|
|
40
40
|
// States
|
|
41
41
|
isDisabled: _ref,
|
|
42
42
|
fullWidth: /*#__PURE__*/(0, _react.css)("display:block;", (0, _global_styling.logicalCSS)('width', '100%'), ";;label:fullWidth;"),
|
|
43
|
+
defaultMinWidth: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('min-width', "".concat(euiTheme.base * 7, "px")), ";;label:defaultMinWidth;"),
|
|
43
44
|
// Sizes
|
|
44
45
|
xs: /*#__PURE__*/(0, _react.css)(_buttonSize(euiTheme.size.l), (0, _global_styling.euiFontSize)(euiThemeContext, 'xs'), ";label:xs;"),
|
|
45
46
|
s: /*#__PURE__*/(0, _react.css)(_buttonSize(euiTheme.size.xl), (0, _global_styling.euiFontSize)(euiThemeContext, 's'), ";label:s;"),
|
|
@@ -180,7 +180,7 @@ var EuiSuperUpdateButton = /*#__PURE__*/function (_Component) {
|
|
|
180
180
|
sizes: responsive || 'none'
|
|
181
181
|
}, (0, _react2.jsx)(_button.EuiButton, (0, _extends2.default)({
|
|
182
182
|
className: classes,
|
|
183
|
-
minWidth:
|
|
183
|
+
minWidth: false
|
|
184
184
|
}, sharedButtonProps, {
|
|
185
185
|
fill: fill,
|
|
186
186
|
textProps: _objectSpread(_objectSpread({}, restTextProps), {}, {
|
|
@@ -117,19 +117,28 @@ EuiFacetButton.propTypes = {
|
|
|
117
117
|
/**
|
|
118
118
|
* ReactNode to render as this component's content
|
|
119
119
|
*/
|
|
120
|
-
children: _propTypes.default.node.isRequired,
|
|
120
|
+
children: _propTypes.default.oneOfType([_propTypes.default.node.isRequired, _propTypes.default.node]),
|
|
121
121
|
|
|
122
122
|
/**
|
|
123
123
|
* Any node, but preferably a `EuiIcon` or `EuiAvatar`
|
|
124
124
|
*/
|
|
125
125
|
icon: _propTypes.default.node,
|
|
126
|
-
isDisabled: _propTypes.default.bool,
|
|
126
|
+
isDisabled: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.bool]),
|
|
127
|
+
|
|
128
|
+
/**
|
|
129
|
+
* Force disables the button and changes the icon to a loading spinner
|
|
130
|
+
*/
|
|
127
131
|
|
|
128
132
|
/**
|
|
129
133
|
* Adds/swaps for loading spinner & disables
|
|
130
134
|
*/
|
|
131
135
|
isLoading: _propTypes.default.bool,
|
|
132
136
|
|
|
137
|
+
/**
|
|
138
|
+
* Applies the boolean state as the `aria-pressed` property to create a toggle button.
|
|
139
|
+
* *Only use when the readable text does not change between states.*
|
|
140
|
+
*/
|
|
141
|
+
|
|
133
142
|
/**
|
|
134
143
|
* Changes visual of button to indicate it's currently selected
|
|
135
144
|
*/
|
|
@@ -139,6 +148,51 @@ EuiFacetButton.propTypes = {
|
|
|
139
148
|
* Adds a notification indicator for displaying the quantity provided
|
|
140
149
|
*/
|
|
141
150
|
quantity: _propTypes.default.number,
|
|
151
|
+
size: _propTypes.default.any,
|
|
152
|
+
|
|
153
|
+
/**
|
|
154
|
+
* Extends the button to 100% width
|
|
155
|
+
*/
|
|
156
|
+
fullWidth: _propTypes.default.bool,
|
|
157
|
+
|
|
158
|
+
/**
|
|
159
|
+
* Override the default minimum width
|
|
160
|
+
*/
|
|
161
|
+
minWidth: _propTypes.default.oneOfType([_propTypes.default.any.isRequired, _propTypes.default.oneOf([false])]),
|
|
162
|
+
|
|
163
|
+
/**
|
|
164
|
+
* Object of props passed to the <span/> wrapping the button's content
|
|
165
|
+
*/
|
|
166
|
+
contentProps: _propTypes.default.shape({
|
|
167
|
+
className: _propTypes.default.string,
|
|
168
|
+
"aria-label": _propTypes.default.string,
|
|
169
|
+
"data-test-subj": _propTypes.default.string,
|
|
170
|
+
css: _propTypes.default.any
|
|
171
|
+
}),
|
|
172
|
+
style: _propTypes.default.any,
|
|
173
|
+
|
|
174
|
+
/**
|
|
175
|
+
* Any `type` accepted by EuiIcon
|
|
176
|
+
*/
|
|
177
|
+
iconType: _propTypes.default.oneOfType([_propTypes.default.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "alert", "analyzeEvent", "annotation", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "asterisk", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "check", "checkInCircleFilled", "cheer", "classificationJob", "clock", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crossInACircleFilled", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "discoverApp", "document", "documentEdit", "documentation", "documents", "dot", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "eql", "eraser", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "mobile", "monitoringApp", "moon", "namespace", "nested", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipelineApp", "play", "playFilled", "plus", "plusInCircle", "plusInCircleFilled", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelionApp", "timeRefresh", "timeslider", "training", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "watchesApp", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenDenseVector", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable"]).isRequired, _propTypes.default.string.isRequired, _propTypes.default.elementType.isRequired]),
|
|
178
|
+
|
|
179
|
+
/**
|
|
180
|
+
* Can only be one side `left` or `right`
|
|
181
|
+
*/
|
|
182
|
+
iconSide: _propTypes.default.oneOfType([_propTypes.default.any.isRequired, _propTypes.default.oneOf([undefined])]),
|
|
183
|
+
|
|
184
|
+
/**
|
|
185
|
+
* Object of props passed to the <span/> wrapping the content's text/children only (not icon)
|
|
186
|
+
*/
|
|
187
|
+
textProps: _propTypes.default.shape({
|
|
188
|
+
className: _propTypes.default.string,
|
|
189
|
+
"aria-label": _propTypes.default.string,
|
|
190
|
+
"data-test-subj": _propTypes.default.string,
|
|
191
|
+
css: _propTypes.default.any,
|
|
192
|
+
ref: _propTypes.default.any,
|
|
193
|
+
"data-text": _propTypes.default.string
|
|
194
|
+
}),
|
|
195
|
+
iconSize: _propTypes.default.any,
|
|
142
196
|
className: _propTypes.default.string,
|
|
143
197
|
"aria-label": _propTypes.default.string,
|
|
144
198
|
"data-test-subj": _propTypes.default.string,
|
|
@@ -66,7 +66,7 @@ var euiOverflowShadowStyles = function euiOverflowShadowStyles(_ref3) {
|
|
|
66
66
|
|
|
67
67
|
var direction = _direction || 'y';
|
|
68
68
|
var side = _side || 'both';
|
|
69
|
-
var hideHeight =
|
|
69
|
+
var hideHeight = size.s;
|
|
70
70
|
var gradientStart = "\n ".concat((0, _color.transparentize)('red', 0.1), " 0%,\n ").concat((0, _color.transparentize)('red', 1), " ").concat(hideHeight, "\n ");
|
|
71
71
|
var gradientEnd = "\n ".concat((0, _color.transparentize)('red', 1), " calc(100% - ").concat(hideHeight, "),\n ").concat((0, _color.transparentize)('red', 0.1), " 100%\n ");
|
|
72
72
|
var gradient = '';
|