@auth0/quantum-product 2.4.1 → 2.4.3

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/card/card.js CHANGED
@@ -84,7 +84,12 @@ var Root = (0, styled_1.styled)(Card_1.default, {
84
84
  boxShadow: 'none',
85
85
  },
86
86
  };
87
- return __assign(__assign(__assign(__assign(__assign({}, (ownerState.button && __assign({
87
+ var defaultBorderStyle = {
88
+ '&:hover': theme.palette.mode === 'dark' && {
89
+ borderColor: theme.tokens.color_border_bold,
90
+ },
91
+ };
92
+ return __assign(__assign(__assign(__assign(__assign(__assign({}, defaultBorderStyle), (ownerState.button && __assign({
88
93
  borderColor: theme.tokens.color_border_default,
89
94
  cursor: 'pointer',
90
95
  transition: theme.transitions.create(['box-shadow', 'border-color'], {
@@ -97,6 +102,7 @@ var Root = (0, styled_1.styled)(Card_1.default, {
97
102
  : {
98
103
  backgroundColor: (0, color_manipulator_1.fade)(theme.palette.action.hoverBackground, 0.1),
99
104
  boxShadow: theme.shadows[1],
105
+ borderColor: theme.tokens.color_border_bold,
100
106
  },
101
107
  '&:focus': __assign({ outlineOffset: 2 }, theme.mixins.focusRing()),
102
108
  }))), (ownerState.selectableButton && {
@@ -112,7 +112,7 @@ exports.ColorTextField = React.forwardRef(function (props, ref) {
112
112
  }, [value, defaultValue, placeholder]);
113
113
  return (React.createElement(Root, __assign({ ref: ref }, rootProps, { InputProps: {
114
114
  startAdornment: (React.createElement(input_1.InputAdornment, __assign({ position: "start" }, inputAdornmentProps),
115
- React.createElement(ColorPicker, { id: props.id ? "".concat(props.id, "-color-input") : undefined, name: props.name, type: "color", disabled: props.disabled || props.readOnly, value: color, onChange: handleColorChange }))),
115
+ React.createElement(ColorPicker, { id: props.id ? "".concat(props.id, "-color-input") : undefined, name: props.name, type: "color", disabled: props.disabled, readOnly: props.readOnly, value: color, onChange: handleColorChange }))),
116
116
  value: value,
117
117
  placeholder: placeholder,
118
118
  } })));
package/esm/card/card.js CHANGED
@@ -55,7 +55,12 @@ var Root = styled(MuiCard, {
55
55
  boxShadow: 'none',
56
56
  },
57
57
  };
58
- return __assign(__assign(__assign(__assign(__assign({}, (ownerState.button && __assign({
58
+ var defaultBorderStyle = {
59
+ '&:hover': theme.palette.mode === 'dark' && {
60
+ borderColor: theme.tokens.color_border_bold,
61
+ },
62
+ };
63
+ return __assign(__assign(__assign(__assign(__assign(__assign({}, defaultBorderStyle), (ownerState.button && __assign({
59
64
  borderColor: theme.tokens.color_border_default,
60
65
  cursor: 'pointer',
61
66
  transition: theme.transitions.create(['box-shadow', 'border-color'], {
@@ -68,6 +73,7 @@ var Root = styled(MuiCard, {
68
73
  : {
69
74
  backgroundColor: fade(theme.palette.action.hoverBackground, 0.1),
70
75
  boxShadow: theme.shadows[1],
76
+ borderColor: theme.tokens.color_border_bold,
71
77
  },
72
78
  '&:focus': __assign({ outlineOffset: 2 }, theme.mixins.focusRing()),
73
79
  }))), (ownerState.selectableButton && {
@@ -86,7 +86,7 @@ export var ColorTextField = React.forwardRef(function (props, ref) {
86
86
  }, [value, defaultValue, placeholder]);
87
87
  return (React.createElement(Root, __assign({ ref: ref }, rootProps, { InputProps: {
88
88
  startAdornment: (React.createElement(InputAdornment, __assign({ position: "start" }, inputAdornmentProps),
89
- React.createElement(ColorPicker, { id: props.id ? "".concat(props.id, "-color-input") : undefined, name: props.name, type: "color", disabled: props.disabled || props.readOnly, value: color, onChange: handleColorChange }))),
89
+ React.createElement(ColorPicker, { id: props.id ? "".concat(props.id, "-color-input") : undefined, name: props.name, type: "color", disabled: props.disabled, readOnly: props.readOnly, value: color, onChange: handleColorChange }))),
90
90
  value: value,
91
91
  placeholder: placeholder,
92
92
  } })));
@@ -38,7 +38,7 @@ export var FormField = React.forwardRef(function (props, ref) {
38
38
  var controlId = "".concat(id, "-control");
39
39
  var helperTextId = helperText ? "".concat(id, "-helperText") : undefined;
40
40
  var errorTextId = error ? "".concat(id, "-feedback") : undefined;
41
- return (React.createElement(FormControl, __assign({ className: clsx(classes.root, className), disabled: readOnly || disabled, error: !!error }, rootProps, { sx: sx, ref: ref }),
41
+ return (React.createElement(FormControl, __assign({ className: clsx(classes.root, className), disabled: disabled, error: !!error }, rootProps, { sx: sx, ref: ref }),
42
42
  label && !hiddenLabel && (React.createElement(InputLabel, __assign({ className: classes.label, htmlFor: controlId }, InputLabelProps), label)),
43
43
  isFormControlRenderer(children)
44
44
  ? children({ controlId: controlId, helperTextId: helperTextId, errorTextId: errorTextId })
@@ -51,7 +51,7 @@ export var FormField = React.forwardRef(function (props, ref) {
51
51
  }
52
52
  return React.cloneElement(child, {
53
53
  id: controlId,
54
- readOnly: readOnly || disabled,
54
+ readOnly: readOnly,
55
55
  'aria-label': hiddenLabel ? label : '',
56
56
  'aria-describedby': clsx(helperTextId, errorTextId),
57
57
  });
@@ -4,6 +4,7 @@ To update this output make changes to `scripts/svgr/illustration-index-template.
4
4
  */
5
5
  export { IllustrationExperiencedUser } from './experienced-user';
6
6
  export { IllustrationNewAuth0UserA } from './new-auth0-user-a';
7
+ export { IllustrationNoContent } from './no-content';
7
8
  export { IllustrationNotifications } from './notifications';
8
9
  export { IllustrationRoles } from './roles';
9
10
  export { IllustrationSingleSignOn } from './single-sign-on';
@@ -0,0 +1,80 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ /*
24
+ This file is generated with the "illustrations" script.
25
+ To update this output make changes to `scripts/svgr/illustration-icon-template.js
26
+ */
27
+ import * as React from 'react';
28
+ import { illustrationComponentName } from '../common';
29
+ import { styled } from '../../styled';
30
+ export var IllustrationNoContent = styled(function (_a) {
31
+ var props = __rest(_a, []);
32
+ return (React.createElement("svg", __assign({ width: "1em", height: "1em", viewBox: "0 0 250 250", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
33
+ React.createElement("g", { clipPath: "url(#no-content_svg__clip0_3554_6896)", stroke: "#000", strokeWidth: 0.4 },
34
+ React.createElement("path", { d: "M232.75 216.1l-33.4-33.4H50.65l-33.4 33.4h215.5z", fill: "#BDC4CF", strokeMiterlimit: 10 }),
35
+ React.createElement("path", { d: "M50.65 182.7v33.4M199.25 182.7v33.4", strokeMiterlimit: 10 }),
36
+ React.createElement("path", { d: "M182.45 197.3H67.25V42.9h77l38.2 38.2v116.2z", fill: "url(#no-content_svg__paint0_linear_3554_6896)", strokeMiterlimit: 10 }),
37
+ React.createElement("path", { d: "M182.45 194.3H67.25V39.9h77l38.2 38.2v116.2z", fill: "url(#no-content_svg__paint1_linear_3554_6896)", strokeMiterlimit: 10 }),
38
+ React.createElement("path", { d: "M182.45 191.3H67.25V36.9h77l38.2 38.2v116.2z", fill: "url(#no-content_svg__paint2_linear_3554_6896)", strokeMiterlimit: 10 }),
39
+ React.createElement("path", { d: "M182.45 188.3H67.25V33.9h77l38.2 38.2v116.2z", fill: "url(#no-content_svg__paint3_linear_3554_6896)", strokeMiterlimit: 10 }),
40
+ React.createElement("path", { d: "M182.45 72.1h-38.2V33.9l38.2 38.2z", fill: "url(#no-content_svg__paint4_linear_3554_6896)", strokeLinejoin: "bevel" }),
41
+ React.createElement("path", { d: "M108.05 44.6h-29v28.99h29V44.6z", fill: "url(#no-content_svg__paint5_linear_3554_6896)", strokeLinejoin: "round" }),
42
+ React.createElement("path", { d: "M104.25 50.5l-2.4-2.3-8.5 8.5-8.5-8.5-2.3 2.3 8.5 8.5-8.5 8.5 2.3 2.4 8.5-8.5 8.5 8.5 2.4-2.4-8.5-8.5 8.5-8.5z", fill: "url(#no-content_svg__paint6_linear_3554_6896)", strokeMiterlimit: 10 }),
43
+ React.createElement("path", { d: "M170.65 82.4h-91.6v94.2h91.6V82.4z", fill: "url(#no-content_svg__paint7_linear_3554_6896)", strokeLinejoin: "round" }),
44
+ React.createElement("path", { d: "M85.65 88.9l78.5 81.2M164.15 88.9l-78.5 81.2", strokeMiterlimit: 10 }),
45
+ React.createElement("path", { d: "M79.05 102.3h-22.4a24.602 24.602 0 01-23.032-24.55A24.6 24.6 0 0156.65 53.2h10.7v11.6h-10.7a13 13 0 000 25.9h22.4v11.6z", fill: "url(#no-content_svg__paint8_linear_3554_6896)", strokeMiterlimit: 10 }),
46
+ React.createElement("path", { d: "M79.05 87.3h-8.2v18.42h8.2V87.3z", fill: "#000", strokeMiterlimit: 10 }),
47
+ React.createElement("path", { d: "M70.75 88.9h-8.2v15.28h8.2V88.9z", fill: "#BDC4CF", strokeMiterlimit: 10 })),
48
+ React.createElement("defs", null,
49
+ React.createElement("linearGradient", { id: "no-content_svg__paint0_linear_3554_6896", x1: 67.28, y1: 120.11, x2: 182.46, y2: 120.11, gradientUnits: "userSpaceOnUse" },
50
+ React.createElement("stop", { stopColor: "#E8EBED" }),
51
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
52
+ React.createElement("linearGradient", { id: "no-content_svg__paint1_linear_3554_6896", x1: 5888.31, y1: 12915.3, x2: 19157, y2: 12915.3, gradientUnits: "userSpaceOnUse" },
53
+ React.createElement("stop", { stopColor: "#E8EBED" }),
54
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
55
+ React.createElement("linearGradient", { id: "no-content_svg__paint2_linear_3554_6896", x1: 5888.31, y1: 12453.7, x2: 19157, y2: 12453.7, gradientUnits: "userSpaceOnUse" },
56
+ React.createElement("stop", { stopColor: "#E8EBED" }),
57
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
58
+ React.createElement("linearGradient", { id: "no-content_svg__paint3_linear_3554_6896", x1: 5888.31, y1: 11982.9, x2: 19157, y2: 11982.9, gradientUnits: "userSpaceOnUse" },
59
+ React.createElement("stop", { stopColor: "#E8EBED" }),
60
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
61
+ React.createElement("linearGradient", { id: "no-content_svg__paint4_linear_3554_6896", x1: 5015.9, y1: 770.778, x2: 6474.37, y2: 770.778, gradientUnits: "userSpaceOnUse" },
62
+ React.createElement("stop", { stopColor: "#E8EBED" }),
63
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
64
+ React.createElement("linearGradient", { id: "no-content_svg__paint5_linear_3554_6896", x1: 79.054, y1: 59.094, x2: 108.054, y2: 59.094, gradientUnits: "userSpaceOnUse" },
65
+ React.createElement("stop", { stopColor: "#635DFF" }),
66
+ React.createElement("stop", { offset: 1, stopColor: "#3885FF" })),
67
+ React.createElement("linearGradient", { id: "no-content_svg__paint6_linear_3554_6896", x1: 1509.32, y1: 597.644, x2: 1980.87, y2: 597.644, gradientUnits: "userSpaceOnUse" },
68
+ React.createElement("stop", { stopColor: "#E8EBED" }),
69
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
70
+ React.createElement("linearGradient", { id: "no-content_svg__paint7_linear_3554_6896", x1: 79.046, y1: 129.498, x2: 170.645, y2: 129.498, gradientUnits: "userSpaceOnUse" },
71
+ React.createElement("stop", { stopColor: "#FF4F40" }),
72
+ React.createElement("stop", { offset: 1, stopColor: "#F4D" })),
73
+ React.createElement("linearGradient", { id: "no-content_svg__paint8_linear_3554_6896", x1: 26.877, y1: 55.072, x2: 59.794, y2: 115.027, gradientUnits: "userSpaceOnUse" },
74
+ React.createElement("stop", { stopColor: "#3EC6EB" }),
75
+ React.createElement("stop", { offset: 0.999, stopColor: "#1BC99F" })),
76
+ React.createElement("clipPath", { id: "no-content_svg__clip0_3554_6896" },
77
+ React.createElement("path", { fill: "#fff", transform: "translate(16.75 33.7)", d: "M0 0h216.5v182.6H0z" })))));
78
+ }, {
79
+ name: illustrationComponentName,
80
+ })({});
@@ -38,7 +38,9 @@ export var getMaskedInputProps = function (masked, inputProps) {
38
38
  };
39
39
  var Root = styled(MuiOutlinedInput, { slot: 'Root', name: 'QuantumInput' })(function (_a) {
40
40
  var theme = _a.theme, multiline = _a.multiline, ownerState = _a.ownerState;
41
- return __assign({}, (ownerState.code && __assign(__assign({}, theme.typography.code1), { lineHeight: !multiline ? theme.typography.input.lineHeight : undefined })));
41
+ return __assign(__assign({}, (ownerState.code && __assign(__assign({}, theme.typography.code1), { lineHeight: !multiline ? theme.typography.input.lineHeight : undefined }))), (ownerState.readOnly && {
42
+ backgroundColor: theme.tokens.color_bg_disabled,
43
+ }));
42
44
  });
43
45
  export var Input = React.forwardRef(function (props, ref) {
44
46
  var actions = props.actions, icon = props.icon, code = props.code, masked = props.masked, multiline = props.multiline, _a = props.inputProps, inputPropsProp = _a === void 0 ? {} : _a, min = props.min, max = props.max, readOnly = props.readOnly, disabled = props.disabled, size = props.size, margin = props.margin, suffix = props.suffix, endAdornmentProp = props.endAdornment, startAdornmentProp = props.startAdornment,
@@ -50,5 +52,5 @@ export var Input = React.forwardRef(function (props, ref) {
50
52
  var startAdornment = startAdornmentProp || (icon && React.createElement(InputAdornment, { position: "start" }, icon));
51
53
  var maskedProps = getMaskedInputProps(masked, rootProps);
52
54
  var inputProps = __assign({ min: min, max: max, readOnly: readOnly }, inputPropsProp);
53
- return (React.createElement(Root, __assign({ ownerState: { code: code }, size: size, disabled: disabled || readOnly, multiline: multiline, endAdornment: endAdornment, startAdornment: startAdornment, inputProps: inputProps }, rootProps, maskedProps, { ref: ref })));
55
+ return (React.createElement(Root, __assign({ ownerState: { code: code, readOnly: readOnly }, size: size, disabled: disabled, multiline: multiline, endAdornment: endAdornment, startAdornment: startAdornment, inputProps: inputProps }, rootProps, maskedProps, { ref: ref })));
54
56
  });
@@ -23,8 +23,10 @@ export interface IFormFieldProps extends Omit<IFormControlProps, 'onChange' | 'd
23
23
  label?: React.ReactNode;
24
24
  /** error message content */
25
25
  error?: React.ReactNode;
26
- /** currently an alternative to disabled. This may be styled different in the future. Mainly used for RBAC right now. */
26
+ /** readOnly applied to formfields to make them read only */
27
27
  readOnly?: boolean;
28
+ /** disabled applied to formControl to make the form disabled */
29
+ disabled?: boolean;
28
30
  /** the control. Supports a render function for non-standard controls. */
29
31
  children?: React.ReactNode | FormControlRenderer;
30
32
  classes?: Partial<FormFieldClasses>;
@@ -67,7 +67,7 @@ exports.FormField = React.forwardRef(function (props, ref) {
67
67
  var controlId = "".concat(id, "-control");
68
68
  var helperTextId = helperText ? "".concat(id, "-helperText") : undefined;
69
69
  var errorTextId = error ? "".concat(id, "-feedback") : undefined;
70
- return (React.createElement(form_control_1.FormControl, __assign({ className: (0, clsx_1.default)(classes.root, className), disabled: readOnly || disabled, error: !!error }, rootProps, { sx: sx, ref: ref }),
70
+ return (React.createElement(form_control_1.FormControl, __assign({ className: (0, clsx_1.default)(classes.root, className), disabled: disabled, error: !!error }, rootProps, { sx: sx, ref: ref }),
71
71
  label && !hiddenLabel && (React.createElement(input_1.InputLabel, __assign({ className: classes.label, htmlFor: controlId }, InputLabelProps), label)),
72
72
  isFormControlRenderer(children)
73
73
  ? children({ controlId: controlId, helperTextId: helperTextId, errorTextId: errorTextId })
@@ -80,7 +80,7 @@ exports.FormField = React.forwardRef(function (props, ref) {
80
80
  }
81
81
  return React.cloneElement(child, {
82
82
  id: controlId,
83
- readOnly: readOnly || disabled,
83
+ readOnly: readOnly,
84
84
  'aria-label': hiddenLabel ? label : '',
85
85
  'aria-describedby': (0, clsx_1.default)(helperTextId, errorTextId),
86
86
  });
@@ -1,5 +1,6 @@
1
1
  export { IllustrationExperiencedUser } from './experienced-user';
2
2
  export { IllustrationNewAuth0UserA } from './new-auth0-user-a';
3
+ export { IllustrationNoContent } from './no-content';
3
4
  export { IllustrationNotifications } from './notifications';
4
5
  export { IllustrationRoles } from './roles';
5
6
  export { IllustrationSingleSignOn } from './single-sign-on';
@@ -4,11 +4,13 @@ This file is generated. Any changes made to this file will be lost.
4
4
  To update this output make changes to `scripts/svgr/illustration-index-template.js`
5
5
  */
6
6
  Object.defineProperty(exports, "__esModule", { value: true });
7
- exports.IllustrationUsers = exports.IllustrationStreamsLogs = exports.IllustrationSingleSignOn = exports.IllustrationRoles = exports.IllustrationNotifications = exports.IllustrationNewAuth0UserA = exports.IllustrationExperiencedUser = void 0;
7
+ exports.IllustrationUsers = exports.IllustrationStreamsLogs = exports.IllustrationSingleSignOn = exports.IllustrationRoles = exports.IllustrationNotifications = exports.IllustrationNoContent = exports.IllustrationNewAuth0UserA = exports.IllustrationExperiencedUser = void 0;
8
8
  var experienced_user_1 = require("./experienced-user");
9
9
  Object.defineProperty(exports, "IllustrationExperiencedUser", { enumerable: true, get: function () { return experienced_user_1.IllustrationExperiencedUser; } });
10
10
  var new_auth0_user_a_1 = require("./new-auth0-user-a");
11
11
  Object.defineProperty(exports, "IllustrationNewAuth0UserA", { enumerable: true, get: function () { return new_auth0_user_a_1.IllustrationNewAuth0UserA; } });
12
+ var no_content_1 = require("./no-content");
13
+ Object.defineProperty(exports, "IllustrationNoContent", { enumerable: true, get: function () { return no_content_1.IllustrationNoContent; } });
12
14
  var notifications_1 = require("./notifications");
13
15
  Object.defineProperty(exports, "IllustrationNotifications", { enumerable: true, get: function () { return notifications_1.IllustrationNotifications; } });
14
16
  var roles_1 = require("./roles");
@@ -0,0 +1,3 @@
1
+ import * as React from 'react';
2
+ import { IIllustrationProps } from '../common';
3
+ export declare const IllustrationNoContent: import("styled-components").StyledComponent<({ ...props }: IIllustrationProps) => React.JSX.Element, import("../..").ITheme, import("@mui/system").MUIStyledCommonProps<import("../..").ITheme>, never>;
@@ -0,0 +1,106 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
14
+ if (k2 === undefined) k2 = k;
15
+ var desc = Object.getOwnPropertyDescriptor(m, k);
16
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
17
+ desc = { enumerable: true, get: function() { return m[k]; } };
18
+ }
19
+ Object.defineProperty(o, k2, desc);
20
+ }) : (function(o, m, k, k2) {
21
+ if (k2 === undefined) k2 = k;
22
+ o[k2] = m[k];
23
+ }));
24
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
25
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
26
+ }) : function(o, v) {
27
+ o["default"] = v;
28
+ });
29
+ var __importStar = (this && this.__importStar) || function (mod) {
30
+ if (mod && mod.__esModule) return mod;
31
+ var result = {};
32
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
33
+ __setModuleDefault(result, mod);
34
+ return result;
35
+ };
36
+ var __rest = (this && this.__rest) || function (s, e) {
37
+ var t = {};
38
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
39
+ t[p] = s[p];
40
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
41
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
42
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
43
+ t[p[i]] = s[p[i]];
44
+ }
45
+ return t;
46
+ };
47
+ Object.defineProperty(exports, "__esModule", { value: true });
48
+ exports.IllustrationNoContent = void 0;
49
+ /*
50
+ This file is generated with the "illustrations" script.
51
+ To update this output make changes to `scripts/svgr/illustration-icon-template.js
52
+ */
53
+ var React = __importStar(require("react"));
54
+ var common_1 = require("../common");
55
+ var styled_1 = require("../../styled");
56
+ exports.IllustrationNoContent = (0, styled_1.styled)(function (_a) {
57
+ var props = __rest(_a, []);
58
+ return (React.createElement("svg", __assign({ width: "1em", height: "1em", viewBox: "0 0 250 250", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
59
+ React.createElement("g", { clipPath: "url(#no-content_svg__clip0_3554_6896)", stroke: "#000", strokeWidth: 0.4 },
60
+ React.createElement("path", { d: "M232.75 216.1l-33.4-33.4H50.65l-33.4 33.4h215.5z", fill: "#BDC4CF", strokeMiterlimit: 10 }),
61
+ React.createElement("path", { d: "M50.65 182.7v33.4M199.25 182.7v33.4", strokeMiterlimit: 10 }),
62
+ React.createElement("path", { d: "M182.45 197.3H67.25V42.9h77l38.2 38.2v116.2z", fill: "url(#no-content_svg__paint0_linear_3554_6896)", strokeMiterlimit: 10 }),
63
+ React.createElement("path", { d: "M182.45 194.3H67.25V39.9h77l38.2 38.2v116.2z", fill: "url(#no-content_svg__paint1_linear_3554_6896)", strokeMiterlimit: 10 }),
64
+ React.createElement("path", { d: "M182.45 191.3H67.25V36.9h77l38.2 38.2v116.2z", fill: "url(#no-content_svg__paint2_linear_3554_6896)", strokeMiterlimit: 10 }),
65
+ React.createElement("path", { d: "M182.45 188.3H67.25V33.9h77l38.2 38.2v116.2z", fill: "url(#no-content_svg__paint3_linear_3554_6896)", strokeMiterlimit: 10 }),
66
+ React.createElement("path", { d: "M182.45 72.1h-38.2V33.9l38.2 38.2z", fill: "url(#no-content_svg__paint4_linear_3554_6896)", strokeLinejoin: "bevel" }),
67
+ React.createElement("path", { d: "M108.05 44.6h-29v28.99h29V44.6z", fill: "url(#no-content_svg__paint5_linear_3554_6896)", strokeLinejoin: "round" }),
68
+ React.createElement("path", { d: "M104.25 50.5l-2.4-2.3-8.5 8.5-8.5-8.5-2.3 2.3 8.5 8.5-8.5 8.5 2.3 2.4 8.5-8.5 8.5 8.5 2.4-2.4-8.5-8.5 8.5-8.5z", fill: "url(#no-content_svg__paint6_linear_3554_6896)", strokeMiterlimit: 10 }),
69
+ React.createElement("path", { d: "M170.65 82.4h-91.6v94.2h91.6V82.4z", fill: "url(#no-content_svg__paint7_linear_3554_6896)", strokeLinejoin: "round" }),
70
+ React.createElement("path", { d: "M85.65 88.9l78.5 81.2M164.15 88.9l-78.5 81.2", strokeMiterlimit: 10 }),
71
+ React.createElement("path", { d: "M79.05 102.3h-22.4a24.602 24.602 0 01-23.032-24.55A24.6 24.6 0 0156.65 53.2h10.7v11.6h-10.7a13 13 0 000 25.9h22.4v11.6z", fill: "url(#no-content_svg__paint8_linear_3554_6896)", strokeMiterlimit: 10 }),
72
+ React.createElement("path", { d: "M79.05 87.3h-8.2v18.42h8.2V87.3z", fill: "#000", strokeMiterlimit: 10 }),
73
+ React.createElement("path", { d: "M70.75 88.9h-8.2v15.28h8.2V88.9z", fill: "#BDC4CF", strokeMiterlimit: 10 })),
74
+ React.createElement("defs", null,
75
+ React.createElement("linearGradient", { id: "no-content_svg__paint0_linear_3554_6896", x1: 67.28, y1: 120.11, x2: 182.46, y2: 120.11, gradientUnits: "userSpaceOnUse" },
76
+ React.createElement("stop", { stopColor: "#E8EBED" }),
77
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
78
+ React.createElement("linearGradient", { id: "no-content_svg__paint1_linear_3554_6896", x1: 5888.31, y1: 12915.3, x2: 19157, y2: 12915.3, gradientUnits: "userSpaceOnUse" },
79
+ React.createElement("stop", { stopColor: "#E8EBED" }),
80
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
81
+ React.createElement("linearGradient", { id: "no-content_svg__paint2_linear_3554_6896", x1: 5888.31, y1: 12453.7, x2: 19157, y2: 12453.7, gradientUnits: "userSpaceOnUse" },
82
+ React.createElement("stop", { stopColor: "#E8EBED" }),
83
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
84
+ React.createElement("linearGradient", { id: "no-content_svg__paint3_linear_3554_6896", x1: 5888.31, y1: 11982.9, x2: 19157, y2: 11982.9, gradientUnits: "userSpaceOnUse" },
85
+ React.createElement("stop", { stopColor: "#E8EBED" }),
86
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
87
+ React.createElement("linearGradient", { id: "no-content_svg__paint4_linear_3554_6896", x1: 5015.9, y1: 770.778, x2: 6474.37, y2: 770.778, gradientUnits: "userSpaceOnUse" },
88
+ React.createElement("stop", { stopColor: "#E8EBED" }),
89
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
90
+ React.createElement("linearGradient", { id: "no-content_svg__paint5_linear_3554_6896", x1: 79.054, y1: 59.094, x2: 108.054, y2: 59.094, gradientUnits: "userSpaceOnUse" },
91
+ React.createElement("stop", { stopColor: "#635DFF" }),
92
+ React.createElement("stop", { offset: 1, stopColor: "#3885FF" })),
93
+ React.createElement("linearGradient", { id: "no-content_svg__paint6_linear_3554_6896", x1: 1509.32, y1: 597.644, x2: 1980.87, y2: 597.644, gradientUnits: "userSpaceOnUse" },
94
+ React.createElement("stop", { stopColor: "#E8EBED" }),
95
+ React.createElement("stop", { offset: 1, stopColor: "#fff" })),
96
+ React.createElement("linearGradient", { id: "no-content_svg__paint7_linear_3554_6896", x1: 79.046, y1: 129.498, x2: 170.645, y2: 129.498, gradientUnits: "userSpaceOnUse" },
97
+ React.createElement("stop", { stopColor: "#FF4F40" }),
98
+ React.createElement("stop", { offset: 1, stopColor: "#F4D" })),
99
+ React.createElement("linearGradient", { id: "no-content_svg__paint8_linear_3554_6896", x1: 26.877, y1: 55.072, x2: 59.794, y2: 115.027, gradientUnits: "userSpaceOnUse" },
100
+ React.createElement("stop", { stopColor: "#3EC6EB" }),
101
+ React.createElement("stop", { offset: 0.999, stopColor: "#1BC99F" })),
102
+ React.createElement("clipPath", { id: "no-content_svg__clip0_3554_6896" },
103
+ React.createElement("path", { fill: "#fff", transform: "translate(16.75 33.7)", d: "M0 0h216.5v182.6H0z" })))));
104
+ }, {
105
+ name: common_1.illustrationComponentName,
106
+ })({});
package/input/input.js CHANGED
@@ -68,7 +68,9 @@ var getMaskedInputProps = function (masked, inputProps) {
68
68
  exports.getMaskedInputProps = getMaskedInputProps;
69
69
  var Root = (0, styled_1.styled)(OutlinedInput_1.default, { slot: 'Root', name: 'QuantumInput' })(function (_a) {
70
70
  var theme = _a.theme, multiline = _a.multiline, ownerState = _a.ownerState;
71
- return __assign({}, (ownerState.code && __assign(__assign({}, theme.typography.code1), { lineHeight: !multiline ? theme.typography.input.lineHeight : undefined })));
71
+ return __assign(__assign({}, (ownerState.code && __assign(__assign({}, theme.typography.code1), { lineHeight: !multiline ? theme.typography.input.lineHeight : undefined }))), (ownerState.readOnly && {
72
+ backgroundColor: theme.tokens.color_bg_disabled,
73
+ }));
72
74
  });
73
75
  exports.Input = React.forwardRef(function (props, ref) {
74
76
  var actions = props.actions, icon = props.icon, code = props.code, masked = props.masked, multiline = props.multiline, _a = props.inputProps, inputPropsProp = _a === void 0 ? {} : _a, min = props.min, max = props.max, readOnly = props.readOnly, disabled = props.disabled, size = props.size, margin = props.margin, suffix = props.suffix, endAdornmentProp = props.endAdornment, startAdornmentProp = props.startAdornment,
@@ -80,5 +82,5 @@ exports.Input = React.forwardRef(function (props, ref) {
80
82
  var startAdornment = startAdornmentProp || (icon && React.createElement(input_adornment_1.InputAdornment, { position: "start" }, icon));
81
83
  var maskedProps = (0, exports.getMaskedInputProps)(masked, rootProps);
82
84
  var inputProps = __assign({ min: min, max: max, readOnly: readOnly }, inputPropsProp);
83
- return (React.createElement(Root, __assign({ ownerState: { code: code }, size: size, disabled: disabled || readOnly, multiline: multiline, endAdornment: endAdornment, startAdornment: startAdornment, inputProps: inputProps }, rootProps, maskedProps, { ref: ref })));
85
+ return (React.createElement(Root, __assign({ ownerState: { code: code, readOnly: readOnly }, size: size, disabled: disabled, multiline: multiline, endAdornment: endAdornment, startAdornment: startAdornment, inputProps: inputProps }, rootProps, maskedProps, { ref: ref })));
84
86
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@auth0/quantum-product",
3
- "version": "2.4.1",
3
+ "version": "2.4.3",
4
4
  "sideEffects": false,
5
5
  "license": "Apache-2.0",
6
6
  "publishConfig": {