144 lines
No EOL
4.1 KiB
JavaScript
144 lines
No EOL
4.1 KiB
JavaScript
"use strict";
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.default = Outline;
|
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
var React = _interopRequireWildcard(require("react"));
|
|
var _styles = require("@mui/material/styles");
|
|
var _createStyled = require("@mui/system/createStyled");
|
|
var _usePickerTextFieldOwnerState = require("../usePickerTextFieldOwnerState");
|
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
const _excluded = ["children", "className", "label", "notched", "shrink"];
|
|
const OutlineRoot = (0, _styles.styled)('fieldset', {
|
|
name: 'MuiPickersOutlinedInput',
|
|
slot: 'NotchedOutline'
|
|
})(({
|
|
theme
|
|
}) => {
|
|
const borderColor = theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)';
|
|
return {
|
|
textAlign: 'left',
|
|
position: 'absolute',
|
|
bottom: 0,
|
|
right: 0,
|
|
top: -5,
|
|
left: 0,
|
|
margin: 0,
|
|
padding: '0 8px',
|
|
pointerEvents: 'none',
|
|
borderRadius: 'inherit',
|
|
borderStyle: 'solid',
|
|
borderWidth: 1,
|
|
overflow: 'hidden',
|
|
minWidth: '0%',
|
|
borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
|
|
};
|
|
});
|
|
const OutlineLabel = (0, _styles.styled)('span')(({
|
|
theme
|
|
}) => ({
|
|
fontFamily: theme.typography.fontFamily,
|
|
fontSize: 'inherit'
|
|
}));
|
|
const OutlineLegend = (0, _styles.styled)('legend', {
|
|
shouldForwardProp: prop => (0, _createStyled.shouldForwardProp)(prop) && prop !== 'notched'
|
|
})(({
|
|
theme
|
|
}) => ({
|
|
float: 'unset',
|
|
// Fix conflict with bootstrap
|
|
width: 'auto',
|
|
// Fix conflict with bootstrap
|
|
overflow: 'hidden',
|
|
// Fix Horizontal scroll when label too long
|
|
variants: [{
|
|
props: {
|
|
inputHasLabel: false
|
|
},
|
|
style: {
|
|
padding: 0,
|
|
lineHeight: '11px',
|
|
// sync with `height` in `legend` styles
|
|
transition: theme.transitions.create('width', {
|
|
duration: 150,
|
|
easing: theme.transitions.easing.easeOut
|
|
})
|
|
}
|
|
}, {
|
|
props: {
|
|
inputHasLabel: true
|
|
},
|
|
style: {
|
|
display: 'block',
|
|
// Fix conflict with normalize.css and sanitize.css
|
|
padding: 0,
|
|
height: 11,
|
|
// sync with `lineHeight` in `legend` styles
|
|
fontSize: '0.75em',
|
|
visibility: 'hidden',
|
|
maxWidth: 0.01,
|
|
transition: theme.transitions.create('max-width', {
|
|
duration: 50,
|
|
easing: theme.transitions.easing.easeOut
|
|
}),
|
|
whiteSpace: 'nowrap',
|
|
'& > span': {
|
|
paddingLeft: 5,
|
|
paddingRight: 5,
|
|
display: 'inline-block',
|
|
opacity: 0,
|
|
visibility: 'visible'
|
|
}
|
|
}
|
|
}, {
|
|
props: {
|
|
inputHasLabel: true,
|
|
notched: true
|
|
},
|
|
style: {
|
|
maxWidth: '100%',
|
|
transition: theme.transitions.create('max-width', {
|
|
duration: 100,
|
|
easing: theme.transitions.easing.easeOut,
|
|
delay: 50
|
|
})
|
|
}
|
|
}]
|
|
}));
|
|
|
|
/**
|
|
* @ignore - internal component.
|
|
*/
|
|
function Outline(props) {
|
|
const {
|
|
className,
|
|
label,
|
|
notched
|
|
} = props,
|
|
other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
|
|
const ownerState = (0, _usePickerTextFieldOwnerState.usePickerTextFieldOwnerState)();
|
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(OutlineRoot, (0, _extends2.default)({
|
|
"aria-hidden": true,
|
|
className: className
|
|
}, other, {
|
|
ownerState: ownerState,
|
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(OutlineLegend, {
|
|
ownerState: ownerState,
|
|
notched: notched,
|
|
children: label ? /*#__PURE__*/(0, _jsxRuntime.jsx)(OutlineLabel, {
|
|
children: label
|
|
}) :
|
|
/*#__PURE__*/
|
|
// notranslate needed while Google Translate will not fix zero-width space issue
|
|
(0, _jsxRuntime.jsx)(OutlineLabel, {
|
|
className: "notranslate",
|
|
children: "\u200B"
|
|
})
|
|
})
|
|
}));
|
|
} |