@commercetools-uikit/input-utils 19.0.0 → 19.1.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.
|
@@ -149,7 +149,7 @@ const getInputBackgroundColor = props => {
|
|
|
149
149
|
return designSystem.designTokens.backgroundColorForInput;
|
|
150
150
|
};
|
|
151
151
|
const getInputStyles = props => {
|
|
152
|
-
return /*#__PURE__*/react.css("appearance:none;background-color:", getInputBackgroundColor(props), ";border:", designSystem.designTokens.borderWidth1, " solid ", getInputBorderColor(props), ";border-radius:", designSystem.designTokens.borderRadiusForInput, ";box-sizing:border-box;box-shadow:", getInputBoxShadow(props), ";color:", getInputFontColor(props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", designSystem.designTokens.fontSize30, ";height:", designSystem.designTokens.heightForInput, ";min-height:", designSystem.designTokens.heightForInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:", designSystem.designTokens.paddingForInput, ";transition:border-color ", designSystem.designTokens.transitionStandard, ",background-color ", designSystem.designTokens.transitionStandard, ",color ", designSystem.designTokens.transitionStandard, ",box-shadow ", designSystem.designTokens.transitionStandard, ";width:100%;&::placeholder{color:", designSystem.designTokens.colorNeutral60, ";}:active:not(:disabled):not(:read-only),:hover:not(:disabled):not(:read-only):not(:focus){border-color:", getInputBorderColor(props, designSystem.designTokens.borderColorForInputWhenHovered), ";background-color:", designSystem.designTokens.backgroundColorForInputWhenHovered, ";}:focus:not(:read-only){box-shadow:", designSystem.designTokens.shadowForInputWhenFocused, ";border-color:", designSystem.designTokens.borderColorForInputWhenFocused, ";background-color:", designSystem.designTokens.backgroundColorForInputWhenFocused, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
152
|
+
return /*#__PURE__*/react.css("appearance:none;background-color:", getInputBackgroundColor(props), ";border:", designSystem.designTokens.borderWidth1, " solid ", getInputBorderColor(props), ";border-radius:", designSystem.designTokens.borderRadiusForInput, ";box-sizing:border-box;box-shadow:", getInputBoxShadow(props), ";color:", getInputFontColor(props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", props.isCondensed ? "".concat(designSystem.designTokens.fontSize20) : "".concat(designSystem.designTokens.fontSize30), ";height:", props.isCondensed ? "".concat(designSystem.designTokens.heightForInputAsSmall) : "".concat(designSystem.designTokens.heightForInput), ";min-height:", props.isCondensed ? "".concat(designSystem.designTokens.heightForInputAsSmall) : "".concat(designSystem.designTokens.heightForInput), ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:", designSystem.designTokens.paddingForInput, ";transition:border-color ", designSystem.designTokens.transitionStandard, ",background-color ", designSystem.designTokens.transitionStandard, ",color ", designSystem.designTokens.transitionStandard, ",box-shadow ", designSystem.designTokens.transitionStandard, ";width:100%;&::placeholder{color:", designSystem.designTokens.colorNeutral60, ";}:active:not(:disabled):not(:read-only),:hover:not(:disabled):not(:read-only):not(:focus){border-color:", getInputBorderColor(props, designSystem.designTokens.borderColorForInputWhenHovered), ";background-color:", designSystem.designTokens.backgroundColorForInputWhenHovered, ";}:focus:not(:read-only){box-shadow:", designSystem.designTokens.shadowForInputWhenFocused, ";border-color:", designSystem.designTokens.borderColorForInputWhenFocused, ";background-color:", designSystem.designTokens.backgroundColorForInputWhenFocused, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxRVkiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgZGVzaWduVG9rZW5zIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5cbnR5cGUgVElucHV0UHJvcHMgPSB7XG4gIGlzQ29uZGVuc2VkPzogYm9vbGVhbjtcbiAgaXNEaXNhYmxlZD86IGJvb2xlYW47XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgaGFzRXJyb3I/OiBib29sZWFuO1xuICBoYXNXYXJuaW5nPzogYm9vbGVhbjtcbiAgaXNSZWFkT25seT86IGJvb2xlYW47XG4gIHJlYWRPbmx5PzogYm9vbGVhbjtcbn07XG5cbmNvbnN0IGdldElucHV0Qm9yZGVyQ29sb3IgPSAoXG4gIHByb3BzOiBUSW5wdXRQcm9wcyxcbiAgZGVmYXVsdEJvcmRlckNvbG9yOiBzdHJpbmcgPSBkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFxuKSA9PiB7XG4gIGlmIChwcm9wcy5pc0Rpc2FibGVkIHx8IHByb3BzLmRpc2FibGVkKSB7XG4gICAgcmV0dXJuIGRlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlbkRpc2FibGVkO1xuICB9XG4gIGlmIChwcm9wcy5oYXNFcnJvcikge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5FcnJvcjtcbiAgfVxuICBpZiAocHJvcHMuaGFzV2FybmluZykge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5XYXJuaW5nO1xuICB9XG4gIGlmIChwcm9wcy5pc1JlYWRPbmx5IHx8IHByb3BzLnJlYWRPbmx5KSB7XG4gICAgcmV0dXJuIGRlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlblJlYWRvbmx5O1xuICB9XG4gIHJldHVybiBkZWZhdWx0Qm9yZGVyQ29sb3I7XG59O1xuXG5jb25zdCBnZXRJbnB1dEZvbnRDb2xvciA9IChwcm9wczogVElucHV0UHJvcHMpID0+IHtcbiAgaWYgKHByb3BzLmlzRGlzYWJsZWQgfHwgcHJvcHMuZGlzYWJsZWQpIHtcbiAgICByZXR1cm4gZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlbkRpc2FibGVkO1xuICB9XG4gIGlmIChwcm9wcy5oYXNFcnJvcikge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9ySW5wdXRXaGVuRXJyb3I7XG4gIH1cbiAgaWYgKHByb3BzLmhhc1dhcm5pbmcpIHtcbiAgICByZXR1cm4gZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlbldhcm5pbmc7XG4gIH1cbiAgaWYgKHByb3BzLmlzUmVhZE9ubHkgfHwgcHJvcHMucmVhZE9ubHkpIHtcbiAgICByZXR1cm4gZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlblJlYWRvbmx5O1xuICB9XG4gIHJldHVybiBkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9ySW5wdXQ7XG59O1xuXG5jb25zdCBnZXRJbnB1dEJveFNoYWRvdyA9IChwcm9wczogVElucHV0UHJvcHMpID0+IHtcbiAgaWYgKHByb3BzLmhhc0Vycm9yKSB7XG4gICAgcmV0dXJuIGRlc2lnblRva2Vucy5zaGFkb3dGb3JJbnB1dFdoZW5FcnJvcjtcbiAgfVxuICBpZiAocHJvcHMuaGFzV2FybmluZykge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuc2hhZG93Rm9ySW5wdXRXaGVuV2FybmluZztcbiAgfVxuICByZXR1cm4gZGVzaWduVG9rZW5zLnNoYWRvd0ZvcklucHV0O1xufTtcblxuY29uc3QgZ2V0SW5wdXRCYWNrZ3JvdW5kQ29sb3IgPSAocHJvcHM6IFRJbnB1dFByb3BzKSA9PiB7XG4gIGlmIChwcm9wcy5pc0Rpc2FibGVkIHx8IHByb3BzLmRpc2FibGVkKSB7XG4gICAgcmV0dXJuIGRlc2lnblRva2Vucy5iYWNrZ3JvdW5kQ29sb3JGb3JJbnB1dFdoZW5EaXNhYmxlZDtcbiAgfVxuICBpZiAocHJvcHMuaXNSZWFkT25seSkge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuYmFja2dyb3VuZENvbG9yRm9ySW5wdXRXaGVuUmVhZG9ubHk7XG4gIH1cbiAgcmV0dXJuIGRlc2lnblRva2Vucy5iYWNrZ3JvdW5kQ29sb3JGb3JJbnB1dDtcbn07XG5cbmNvbnN0IGdldElucHV0U3R5bGVzID0gKHByb3BzOiBUSW5wdXRQcm9wcykgPT4ge1xuICByZXR1cm4gY3NzYFxuICAgIGFwcGVhcmFuY2U6IG5vbmU7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRJbnB1dEJhY2tncm91bmRDb2xvcihwcm9wcyl9O1xuICAgIGJvcmRlcjogJHtkZXNpZ25Ub2tlbnMuYm9yZGVyV2lkdGgxfSBzb2xpZCAke2dldElucHV0Qm9yZGVyQ29sb3IocHJvcHMpfTtcbiAgICBib3JkZXItcmFkaXVzOiAke2Rlc2lnblRva2Vucy5ib3JkZXJSYWRpdXNGb3JJbnB1dH07XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICBib3gtc2hhZG93OiAke2dldElucHV0Qm94U2hhZG93KHByb3BzKX07XG4gICAgY29sb3I6ICR7Z2V0SW5wdXRGb250Q29sb3IocHJvcHMpfTtcbiAgICBjdXJzb3I6ICR7cHJvcHMuaXNEaXNhYmxlZCA/ICdub3QtYWxsb3dlZCcgOiAnZGVmYXVsdCd9O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleDogMTtcbiAgICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgICBmb250LXNpemU6ICR7cHJvcHMuaXNDb25kZW5zZWRcbiAgICAgID8gYCR7ZGVzaWduVG9rZW5zLmZvbnRTaXplMjB9YFxuICAgICAgOiBgJHtkZXNpZ25Ub2tlbnMuZm9udFNpemUzMH1gfTtcbiAgICBoZWlnaHQ6ICR7cHJvcHMuaXNDb25kZW5zZWRcbiAgICAgID8gYCR7ZGVzaWduVG9rZW5zLmhlaWdodEZvcklucHV0QXNTbWFsbH1gXG4gICAgICA6IGAke2Rlc2lnblRva2Vucy5oZWlnaHRGb3JJbnB1dH1gfTtcbiAgICBtaW4taGVpZ2h0OiAke3Byb3BzLmlzQ29uZGVuc2VkXG4gICAgICA/IGAke2Rlc2lnblRva2Vucy5oZWlnaHRGb3JJbnB1dEFzU21hbGx9YFxuICAgICAgOiBgJHtkZXNpZ25Ub2tlbnMuaGVpZ2h0Rm9ySW5wdXR9YH07XG4gICAgb3BhY2l0eTogJHtwcm9wcy5pc0Rpc2FibGVkIHx8IHByb3BzLmRpc2FibGVkXG4gICAgICA/ICcxJ1xuICAgICAgOiAndW5zZXQnfTsgLyogZml4IGZvciBtb2JpbGUgc2FmYXJpICovXG4gICAgb3V0bGluZTogbm9uZTtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHBhZGRpbmc6ICR7ZGVzaWduVG9rZW5zLnBhZGRpbmdGb3JJbnB1dH07XG4gICAgdHJhbnNpdGlvbjogYm9yZGVyLWNvbG9yICR7ZGVzaWduVG9rZW5zLnRyYW5zaXRpb25TdGFuZGFyZH0sXG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yICR7ZGVzaWduVG9rZW5zLnRyYW5zaXRpb25TdGFuZGFyZH0sXG4gICAgICBjb2xvciAke2Rlc2lnblRva2Vucy50cmFuc2l0aW9uU3RhbmRhcmR9LFxuICAgICAgYm94LXNoYWRvdyAke2Rlc2lnblRva2Vucy50cmFuc2l0aW9uU3RhbmRhcmR9O1xuICAgIHdpZHRoOiAxMDAlO1xuXG4gICAgJjo6cGxhY2Vob2xkZXIge1xuICAgICAgY29sb3I6ICR7ZGVzaWduVG9rZW5zLmNvbG9yTmV1dHJhbDYwfTtcbiAgICB9XG4gICAgOmFjdGl2ZTpub3QoOmRpc2FibGVkKTpub3QoOnJlYWQtb25seSksXG4gICAgOmhvdmVyOm5vdCg6ZGlzYWJsZWQpOm5vdCg6cmVhZC1vbmx5KTpub3QoOmZvY3VzKSB7XG4gICAgICBib3JkZXItY29sb3I6ICR7Z2V0SW5wdXRCb3JkZXJDb2xvcihcbiAgICAgICAgcHJvcHMsXG4gICAgICAgIGRlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlbkhvdmVyZWRcbiAgICAgICl9O1xuICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHtkZXNpZ25Ub2tlbnMuYmFja2dyb3VuZENvbG9yRm9ySW5wdXRXaGVuSG92ZXJlZH07XG4gICAgfVxuICAgIDpmb2N1czpub3QoOnJlYWQtb25seSkge1xuICAgICAgYm94LXNoYWRvdzogJHtkZXNpZ25Ub2tlbnMuc2hhZG93Rm9ySW5wdXRXaGVuRm9jdXNlZH07XG4gICAgICBib3JkZXItY29sb3I6ICR7ZGVzaWduVG9rZW5zLmJvcmRlckNvbG9yRm9ySW5wdXRXaGVuRm9jdXNlZH07XG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke2Rlc2lnblRva2Vucy5iYWNrZ3JvdW5kQ29sb3JGb3JJbnB1dFdoZW5Gb2N1c2VkfTtcbiAgICB9XG4gIGA7XG59O1xuXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgaW1wb3J0L3ByZWZlci1kZWZhdWx0LWV4cG9ydFxuZXhwb3J0IHsgZ2V0SW5wdXRTdHlsZXMgfTtcbiJdfQ== */");
|
|
153
153
|
};
|
|
154
154
|
|
|
155
155
|
/* we need this line-height to achieve 32px height when the component has only one row */
|
|
@@ -274,7 +274,7 @@ const accessibleHiddenInputStyles = process.env.NODE_ENV === "production" ? {
|
|
|
274
274
|
var accessibleHiddenInputStyles$1 = accessibleHiddenInputStyles;
|
|
275
275
|
|
|
276
276
|
// NOTE: This string will be replaced on build time with the package version.
|
|
277
|
-
var version = "19.
|
|
277
|
+
var version = "19.1.0";
|
|
278
278
|
|
|
279
279
|
exports.LocalizedInputToggle = LocalizedInputToggle$1;
|
|
280
280
|
exports.MultilineInput = MultilineInput$1;
|
|
@@ -134,7 +134,7 @@ const getInputBackgroundColor = props => {
|
|
|
134
134
|
return designSystem.designTokens.backgroundColorForInput;
|
|
135
135
|
};
|
|
136
136
|
const getInputStyles = props => {
|
|
137
|
-
return /*#__PURE__*/react.css("appearance:none;background-color:", getInputBackgroundColor(props), ";border:", designSystem.designTokens.borderWidth1, " solid ", getInputBorderColor(props), ";border-radius:", designSystem.designTokens.borderRadiusForInput, ";box-sizing:border-box;box-shadow:", getInputBoxShadow(props), ";color:", getInputFontColor(props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", designSystem.designTokens.fontSize30, ";height:", designSystem.designTokens.heightForInput, ";min-height:", designSystem.designTokens.heightForInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:", designSystem.designTokens.paddingForInput, ";transition:border-color ", designSystem.designTokens.transitionStandard, ",background-color ", designSystem.designTokens.transitionStandard, ",color ", designSystem.designTokens.transitionStandard, ",box-shadow ", designSystem.designTokens.transitionStandard, ";width:100%;&::placeholder{color:", designSystem.designTokens.colorNeutral60, ";}:active:not(:disabled):not(:read-only),:hover:not(:disabled):not(:read-only):not(:focus){border-color:", getInputBorderColor(props, designSystem.designTokens.borderColorForInputWhenHovered), ";background-color:", designSystem.designTokens.backgroundColorForInputWhenHovered, ";}:focus:not(:read-only){box-shadow:", designSystem.designTokens.shadowForInputWhenFocused, ";border-color:", designSystem.designTokens.borderColorForInputWhenFocused, ";background-color:", designSystem.designTokens.backgroundColorForInputWhenFocused, ";}" + ("" ), "" );
|
|
137
|
+
return /*#__PURE__*/react.css("appearance:none;background-color:", getInputBackgroundColor(props), ";border:", designSystem.designTokens.borderWidth1, " solid ", getInputBorderColor(props), ";border-radius:", designSystem.designTokens.borderRadiusForInput, ";box-sizing:border-box;box-shadow:", getInputBoxShadow(props), ";color:", getInputFontColor(props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", props.isCondensed ? "".concat(designSystem.designTokens.fontSize20) : "".concat(designSystem.designTokens.fontSize30), ";height:", props.isCondensed ? "".concat(designSystem.designTokens.heightForInputAsSmall) : "".concat(designSystem.designTokens.heightForInput), ";min-height:", props.isCondensed ? "".concat(designSystem.designTokens.heightForInputAsSmall) : "".concat(designSystem.designTokens.heightForInput), ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:", designSystem.designTokens.paddingForInput, ";transition:border-color ", designSystem.designTokens.transitionStandard, ",background-color ", designSystem.designTokens.transitionStandard, ",color ", designSystem.designTokens.transitionStandard, ",box-shadow ", designSystem.designTokens.transitionStandard, ";width:100%;&::placeholder{color:", designSystem.designTokens.colorNeutral60, ";}:active:not(:disabled):not(:read-only),:hover:not(:disabled):not(:read-only):not(:focus){border-color:", getInputBorderColor(props, designSystem.designTokens.borderColorForInputWhenHovered), ";background-color:", designSystem.designTokens.backgroundColorForInputWhenHovered, ";}:focus:not(:read-only){box-shadow:", designSystem.designTokens.shadowForInputWhenFocused, ";border-color:", designSystem.designTokens.borderColorForInputWhenFocused, ";background-color:", designSystem.designTokens.backgroundColorForInputWhenFocused, ";}" + ("" ), "" );
|
|
138
138
|
};
|
|
139
139
|
|
|
140
140
|
/* we need this line-height to achieve 32px height when the component has only one row */
|
|
@@ -232,7 +232,7 @@ const accessibleHiddenInputStyles = {
|
|
|
232
232
|
var accessibleHiddenInputStyles$1 = accessibleHiddenInputStyles;
|
|
233
233
|
|
|
234
234
|
// NOTE: This string will be replaced on build time with the package version.
|
|
235
|
-
var version = "19.
|
|
235
|
+
var version = "19.1.0";
|
|
236
236
|
|
|
237
237
|
exports.LocalizedInputToggle = LocalizedInputToggle$1;
|
|
238
238
|
exports.MultilineInput = MultilineInput$1;
|
|
@@ -130,7 +130,7 @@ const getInputBackgroundColor = props => {
|
|
|
130
130
|
return designTokens.backgroundColorForInput;
|
|
131
131
|
};
|
|
132
132
|
const getInputStyles = props => {
|
|
133
|
-
return /*#__PURE__*/css("appearance:none;background-color:", getInputBackgroundColor(props), ";border:", designTokens.borderWidth1, " solid ", getInputBorderColor(props), ";border-radius:", designTokens.borderRadiusForInput, ";box-sizing:border-box;box-shadow:", getInputBoxShadow(props), ";color:", getInputFontColor(props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", designTokens.fontSize30, ";height:", designTokens.heightForInput, ";min-height:", designTokens.heightForInput, ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:", designTokens.paddingForInput, ";transition:border-color ", designTokens.transitionStandard, ",background-color ", designTokens.transitionStandard, ",color ", designTokens.transitionStandard, ",box-shadow ", designTokens.transitionStandard, ";width:100%;&::placeholder{color:", designTokens.colorNeutral60, ";}:active:not(:disabled):not(:read-only),:hover:not(:disabled):not(:read-only):not(:focus){border-color:", getInputBorderColor(props, designTokens.borderColorForInputWhenHovered), ";background-color:", designTokens.backgroundColorForInputWhenHovered, ";}:focus:not(:read-only){box-shadow:", designTokens.shadowForInputWhenFocused, ";border-color:", designTokens.borderColorForInputWhenFocused, ";background-color:", designTokens.backgroundColorForInputWhenFocused, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
133
|
+
return /*#__PURE__*/css("appearance:none;background-color:", getInputBackgroundColor(props), ";border:", designTokens.borderWidth1, " solid ", getInputBorderColor(props), ";border-radius:", designTokens.borderRadiusForInput, ";box-sizing:border-box;box-shadow:", getInputBoxShadow(props), ";color:", getInputFontColor(props), ";cursor:", props.isDisabled ? 'not-allowed' : 'default', ";display:flex;flex:1;font-family:inherit;font-size:", props.isCondensed ? "".concat(designTokens.fontSize20) : "".concat(designTokens.fontSize30), ";height:", props.isCondensed ? "".concat(designTokens.heightForInputAsSmall) : "".concat(designTokens.heightForInput), ";min-height:", props.isCondensed ? "".concat(designTokens.heightForInputAsSmall) : "".concat(designTokens.heightForInput), ";opacity:", props.isDisabled || props.disabled ? '1' : 'unset', ";outline:none;overflow:hidden;padding:", designTokens.paddingForInput, ";transition:border-color ", designTokens.transitionStandard, ",background-color ", designTokens.transitionStandard, ",color ", designTokens.transitionStandard, ",box-shadow ", designTokens.transitionStandard, ";width:100%;&::placeholder{color:", designTokens.colorNeutral60, ";}:active:not(:disabled):not(:read-only),:hover:not(:disabled):not(:read-only):not(:focus){border-color:", getInputBorderColor(props, designTokens.borderColorForInputWhenHovered), ";background-color:", designTokens.backgroundColorForInputWhenHovered, ";}:focus:not(:read-only){box-shadow:", designTokens.shadowForInputWhenFocused, ";border-color:", designTokens.borderColorForInputWhenFocused, ";background-color:", designTokens.backgroundColorForInputWhenFocused, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getInputStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxRVkiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgZGVzaWduVG9rZW5zIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5cbnR5cGUgVElucHV0UHJvcHMgPSB7XG4gIGlzQ29uZGVuc2VkPzogYm9vbGVhbjtcbiAgaXNEaXNhYmxlZD86IGJvb2xlYW47XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgaGFzRXJyb3I/OiBib29sZWFuO1xuICBoYXNXYXJuaW5nPzogYm9vbGVhbjtcbiAgaXNSZWFkT25seT86IGJvb2xlYW47XG4gIHJlYWRPbmx5PzogYm9vbGVhbjtcbn07XG5cbmNvbnN0IGdldElucHV0Qm9yZGVyQ29sb3IgPSAoXG4gIHByb3BzOiBUSW5wdXRQcm9wcyxcbiAgZGVmYXVsdEJvcmRlckNvbG9yOiBzdHJpbmcgPSBkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFxuKSA9PiB7XG4gIGlmIChwcm9wcy5pc0Rpc2FibGVkIHx8IHByb3BzLmRpc2FibGVkKSB7XG4gICAgcmV0dXJuIGRlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlbkRpc2FibGVkO1xuICB9XG4gIGlmIChwcm9wcy5oYXNFcnJvcikge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5FcnJvcjtcbiAgfVxuICBpZiAocHJvcHMuaGFzV2FybmluZykge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuYm9yZGVyQ29sb3JGb3JJbnB1dFdoZW5XYXJuaW5nO1xuICB9XG4gIGlmIChwcm9wcy5pc1JlYWRPbmx5IHx8IHByb3BzLnJlYWRPbmx5KSB7XG4gICAgcmV0dXJuIGRlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlblJlYWRvbmx5O1xuICB9XG4gIHJldHVybiBkZWZhdWx0Qm9yZGVyQ29sb3I7XG59O1xuXG5jb25zdCBnZXRJbnB1dEZvbnRDb2xvciA9IChwcm9wczogVElucHV0UHJvcHMpID0+IHtcbiAgaWYgKHByb3BzLmlzRGlzYWJsZWQgfHwgcHJvcHMuZGlzYWJsZWQpIHtcbiAgICByZXR1cm4gZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlbkRpc2FibGVkO1xuICB9XG4gIGlmIChwcm9wcy5oYXNFcnJvcikge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9ySW5wdXRXaGVuRXJyb3I7XG4gIH1cbiAgaWYgKHByb3BzLmhhc1dhcm5pbmcpIHtcbiAgICByZXR1cm4gZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlbldhcm5pbmc7XG4gIH1cbiAgaWYgKHByb3BzLmlzUmVhZE9ubHkgfHwgcHJvcHMucmVhZE9ubHkpIHtcbiAgICByZXR1cm4gZGVzaWduVG9rZW5zLmZvbnRDb2xvckZvcklucHV0V2hlblJlYWRvbmx5O1xuICB9XG4gIHJldHVybiBkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9ySW5wdXQ7XG59O1xuXG5jb25zdCBnZXRJbnB1dEJveFNoYWRvdyA9IChwcm9wczogVElucHV0UHJvcHMpID0+IHtcbiAgaWYgKHByb3BzLmhhc0Vycm9yKSB7XG4gICAgcmV0dXJuIGRlc2lnblRva2Vucy5zaGFkb3dGb3JJbnB1dFdoZW5FcnJvcjtcbiAgfVxuICBpZiAocHJvcHMuaGFzV2FybmluZykge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuc2hhZG93Rm9ySW5wdXRXaGVuV2FybmluZztcbiAgfVxuICByZXR1cm4gZGVzaWduVG9rZW5zLnNoYWRvd0ZvcklucHV0O1xufTtcblxuY29uc3QgZ2V0SW5wdXRCYWNrZ3JvdW5kQ29sb3IgPSAocHJvcHM6IFRJbnB1dFByb3BzKSA9PiB7XG4gIGlmIChwcm9wcy5pc0Rpc2FibGVkIHx8IHByb3BzLmRpc2FibGVkKSB7XG4gICAgcmV0dXJuIGRlc2lnblRva2Vucy5iYWNrZ3JvdW5kQ29sb3JGb3JJbnB1dFdoZW5EaXNhYmxlZDtcbiAgfVxuICBpZiAocHJvcHMuaXNSZWFkT25seSkge1xuICAgIHJldHVybiBkZXNpZ25Ub2tlbnMuYmFja2dyb3VuZENvbG9yRm9ySW5wdXRXaGVuUmVhZG9ubHk7XG4gIH1cbiAgcmV0dXJuIGRlc2lnblRva2Vucy5iYWNrZ3JvdW5kQ29sb3JGb3JJbnB1dDtcbn07XG5cbmNvbnN0IGdldElucHV0U3R5bGVzID0gKHByb3BzOiBUSW5wdXRQcm9wcykgPT4ge1xuICByZXR1cm4gY3NzYFxuICAgIGFwcGVhcmFuY2U6IG5vbmU7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRJbnB1dEJhY2tncm91bmRDb2xvcihwcm9wcyl9O1xuICAgIGJvcmRlcjogJHtkZXNpZ25Ub2tlbnMuYm9yZGVyV2lkdGgxfSBzb2xpZCAke2dldElucHV0Qm9yZGVyQ29sb3IocHJvcHMpfTtcbiAgICBib3JkZXItcmFkaXVzOiAke2Rlc2lnblRva2Vucy5ib3JkZXJSYWRpdXNGb3JJbnB1dH07XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICBib3gtc2hhZG93OiAke2dldElucHV0Qm94U2hhZG93KHByb3BzKX07XG4gICAgY29sb3I6ICR7Z2V0SW5wdXRGb250Q29sb3IocHJvcHMpfTtcbiAgICBjdXJzb3I6ICR7cHJvcHMuaXNEaXNhYmxlZCA/ICdub3QtYWxsb3dlZCcgOiAnZGVmYXVsdCd9O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleDogMTtcbiAgICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgICBmb250LXNpemU6ICR7cHJvcHMuaXNDb25kZW5zZWRcbiAgICAgID8gYCR7ZGVzaWduVG9rZW5zLmZvbnRTaXplMjB9YFxuICAgICAgOiBgJHtkZXNpZ25Ub2tlbnMuZm9udFNpemUzMH1gfTtcbiAgICBoZWlnaHQ6ICR7cHJvcHMuaXNDb25kZW5zZWRcbiAgICAgID8gYCR7ZGVzaWduVG9rZW5zLmhlaWdodEZvcklucHV0QXNTbWFsbH1gXG4gICAgICA6IGAke2Rlc2lnblRva2Vucy5oZWlnaHRGb3JJbnB1dH1gfTtcbiAgICBtaW4taGVpZ2h0OiAke3Byb3BzLmlzQ29uZGVuc2VkXG4gICAgICA/IGAke2Rlc2lnblRva2Vucy5oZWlnaHRGb3JJbnB1dEFzU21hbGx9YFxuICAgICAgOiBgJHtkZXNpZ25Ub2tlbnMuaGVpZ2h0Rm9ySW5wdXR9YH07XG4gICAgb3BhY2l0eTogJHtwcm9wcy5pc0Rpc2FibGVkIHx8IHByb3BzLmRpc2FibGVkXG4gICAgICA/ICcxJ1xuICAgICAgOiAndW5zZXQnfTsgLyogZml4IGZvciBtb2JpbGUgc2FmYXJpICovXG4gICAgb3V0bGluZTogbm9uZTtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHBhZGRpbmc6ICR7ZGVzaWduVG9rZW5zLnBhZGRpbmdGb3JJbnB1dH07XG4gICAgdHJhbnNpdGlvbjogYm9yZGVyLWNvbG9yICR7ZGVzaWduVG9rZW5zLnRyYW5zaXRpb25TdGFuZGFyZH0sXG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yICR7ZGVzaWduVG9rZW5zLnRyYW5zaXRpb25TdGFuZGFyZH0sXG4gICAgICBjb2xvciAke2Rlc2lnblRva2Vucy50cmFuc2l0aW9uU3RhbmRhcmR9LFxuICAgICAgYm94LXNoYWRvdyAke2Rlc2lnblRva2Vucy50cmFuc2l0aW9uU3RhbmRhcmR9O1xuICAgIHdpZHRoOiAxMDAlO1xuXG4gICAgJjo6cGxhY2Vob2xkZXIge1xuICAgICAgY29sb3I6ICR7ZGVzaWduVG9rZW5zLmNvbG9yTmV1dHJhbDYwfTtcbiAgICB9XG4gICAgOmFjdGl2ZTpub3QoOmRpc2FibGVkKTpub3QoOnJlYWQtb25seSksXG4gICAgOmhvdmVyOm5vdCg6ZGlzYWJsZWQpOm5vdCg6cmVhZC1vbmx5KTpub3QoOmZvY3VzKSB7XG4gICAgICBib3JkZXItY29sb3I6ICR7Z2V0SW5wdXRCb3JkZXJDb2xvcihcbiAgICAgICAgcHJvcHMsXG4gICAgICAgIGRlc2lnblRva2Vucy5ib3JkZXJDb2xvckZvcklucHV0V2hlbkhvdmVyZWRcbiAgICAgICl9O1xuICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHtkZXNpZ25Ub2tlbnMuYmFja2dyb3VuZENvbG9yRm9ySW5wdXRXaGVuSG92ZXJlZH07XG4gICAgfVxuICAgIDpmb2N1czpub3QoOnJlYWQtb25seSkge1xuICAgICAgYm94LXNoYWRvdzogJHtkZXNpZ25Ub2tlbnMuc2hhZG93Rm9ySW5wdXRXaGVuRm9jdXNlZH07XG4gICAgICBib3JkZXItY29sb3I6ICR7ZGVzaWduVG9rZW5zLmJvcmRlckNvbG9yRm9ySW5wdXRXaGVuRm9jdXNlZH07XG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke2Rlc2lnblRva2Vucy5iYWNrZ3JvdW5kQ29sb3JGb3JJbnB1dFdoZW5Gb2N1c2VkfTtcbiAgICB9XG4gIGA7XG59O1xuXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgaW1wb3J0L3ByZWZlci1kZWZhdWx0LWV4cG9ydFxuZXhwb3J0IHsgZ2V0SW5wdXRTdHlsZXMgfTtcbiJdfQ== */");
|
|
134
134
|
};
|
|
135
135
|
|
|
136
136
|
/* we need this line-height to achieve 32px height when the component has only one row */
|
|
@@ -255,6 +255,6 @@ const accessibleHiddenInputStyles = process.env.NODE_ENV === "production" ? {
|
|
|
255
255
|
var accessibleHiddenInputStyles$1 = accessibleHiddenInputStyles;
|
|
256
256
|
|
|
257
257
|
// NOTE: This string will be replaced on build time with the package version.
|
|
258
|
-
var version = "19.
|
|
258
|
+
var version = "19.1.0";
|
|
259
259
|
|
|
260
260
|
export { LocalizedInputToggle$1 as LocalizedInputToggle, MultilineInput$1 as MultilineInput, accessibleHiddenInputStyles$1 as accessibleHiddenInputStyles, getInputStyles, messages$1 as messagesLocalizedInput, messages as messagesMultilineInput, version };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@commercetools-uikit/input-utils",
|
|
3
3
|
"description": "Utilities for working with input components.",
|
|
4
|
-
"version": "19.
|
|
4
|
+
"version": "19.1.0",
|
|
5
5
|
"bugs": "https://github.com/commercetools/ui-kit/issues",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -21,10 +21,10 @@
|
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@babel/runtime": "^7.20.13",
|
|
23
23
|
"@babel/runtime-corejs3": "^7.20.13",
|
|
24
|
-
"@commercetools-uikit/design-system": "19.
|
|
25
|
-
"@commercetools-uikit/flat-button": "19.
|
|
26
|
-
"@commercetools-uikit/icons": "19.
|
|
27
|
-
"@commercetools-uikit/utils": "19.
|
|
24
|
+
"@commercetools-uikit/design-system": "19.1.0",
|
|
25
|
+
"@commercetools-uikit/flat-button": "19.1.0",
|
|
26
|
+
"@commercetools-uikit/icons": "19.1.0",
|
|
27
|
+
"@commercetools-uikit/utils": "19.1.0",
|
|
28
28
|
"@emotion/react": "^11.10.5",
|
|
29
29
|
"prop-types": "15.8.1",
|
|
30
30
|
"react-textarea-autosize": "8.4.0"
|