mirror of
https://github.com/gravitational/teleport
synced 2024-10-20 01:03:40 +00:00
[2/3] Prettify shared, build, and teleport packages (#955)
* Update prettier ignore
This commit is contained in:
parent
631aa2f6e2
commit
b86c9bcdfe
|
@ -1,2 +1,7 @@
|
|||
# assets contains pre-generated files like iconmoon, fonts, svgs.
|
||||
packages/design/src/assets/*
|
||||
|
||||
# Ignore file types:
|
||||
packages/**/*.css
|
||||
packages/**/*.json
|
||||
packages/**/*.yaml
|
||||
|
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
|||
const path = require('path');
|
||||
|
||||
module.exports = {
|
||||
testEnvironment: "jsdom",
|
||||
testEnvironment: 'jsdom',
|
||||
moduleNameMapper: {
|
||||
// mock all imports to asset files
|
||||
'\\.(css|scss|stylesheet)$': path.join(__dirname, 'mockStyles.js'),
|
||||
|
|
|
@ -152,5 +152,4 @@ function createDefaultConfig() {
|
|||
};
|
||||
}
|
||||
|
||||
|
||||
module.exports = configFactory;
|
||||
module.exports = configFactory;
|
||||
|
|
|
@ -31,9 +31,7 @@ module.exports = {
|
|||
},
|
||||
devtool: false,
|
||||
mode: 'development',
|
||||
plugins: [
|
||||
configFactory.plugins.reactRefresh(),
|
||||
],
|
||||
plugins: [configFactory.plugins.reactRefresh()],
|
||||
module: {
|
||||
strictExportPresence: true,
|
||||
rules: [
|
||||
|
|
|
@ -10,4 +10,4 @@ Add `@gravitational/shared` to your package.json file.
|
|||
"devDependencies": {
|
||||
"@gravitational/shared": "^1.0.0",
|
||||
},
|
||||
```
|
||||
```
|
||||
|
|
|
@ -96,7 +96,7 @@ const StyledTextEditor = styled.div`
|
|||
|
||||
.ace-monokai .ace_marker-layer .ace_active-line {
|
||||
//background: #928787;
|
||||
}
|
||||
}
|
||||
|
||||
//.ace-monokai .ace_gutter,
|
||||
//.ace-monokai .ace_gutter-cell {
|
||||
|
|
|
@ -31,14 +31,15 @@ ace.define(
|
|||
const oop = acequire('../lib/oop');
|
||||
const TextMode = acequire('./text').Mode;
|
||||
const FoldMode = acequire('./folding/coffee').FoldMode;
|
||||
const MatchingBraceOutdent = acequire('./matching_brace_outdent')
|
||||
.MatchingBraceOutdent;
|
||||
const MatchingBraceOutdent = acequire(
|
||||
'./matching_brace_outdent'
|
||||
).MatchingBraceOutdent;
|
||||
|
||||
const GravitationalHighlightRules = acequire(
|
||||
'ace/mode/grv_bpf_highlight_rules'
|
||||
).GravitationalHighlightRules;
|
||||
|
||||
const Mode = function() {
|
||||
const Mode = function () {
|
||||
this.$outdent = new MatchingBraceOutdent();
|
||||
this.foldingRules = new FoldMode();
|
||||
this.HighlightRules = GravitationalHighlightRules;
|
||||
|
@ -55,8 +56,9 @@ ace.define(
|
|||
['require', 'exports', 'ace/lib/oop', 'ace/mode/text_highlight_rules'],
|
||||
(acequire, exports) => {
|
||||
const oop = acequire('ace/lib/oop');
|
||||
const TextHighlightRules = acequire('ace/mode/text_highlight_rules')
|
||||
.TextHighlightRules;
|
||||
const TextHighlightRules = acequire(
|
||||
'ace/mode/text_highlight_rules'
|
||||
).TextHighlightRules;
|
||||
|
||||
function GravitationalHighlightRules() {
|
||||
this.$rules = new TextHighlightRules().getRules(); // Use Text's rules as a base
|
||||
|
@ -88,7 +90,7 @@ ace.define(
|
|||
{
|
||||
token: 'string', // multi line string start
|
||||
regex: /[|>][-+\d]*(?:$|\s+(?:$|#))/,
|
||||
onMatch: function(val, state, stack, line) {
|
||||
onMatch: function (val, state, stack, line) {
|
||||
line = line.replace(/ #.*/, '');
|
||||
var indent = /^ *((:\s*)?-(\s*[^|>])?)?/
|
||||
.exec(line)[0]
|
||||
|
@ -122,7 +124,7 @@ ace.define(
|
|||
{
|
||||
token: 'indent',
|
||||
regex: /^ */,
|
||||
onMatch: function(val, state, stack) {
|
||||
onMatch: function (val, state, stack) {
|
||||
var curIndent = stack[1];
|
||||
|
||||
if (curIndent >= val.length) {
|
||||
|
@ -150,7 +152,7 @@ ace.define(
|
|||
{
|
||||
token: 'indent',
|
||||
regex: /^ */,
|
||||
onMatch: function(val, state, stack) {
|
||||
onMatch: function (val, state, stack) {
|
||||
var curIndent = stack[1];
|
||||
|
||||
if (curIndent >= val.length) {
|
||||
|
|
|
@ -60,14 +60,8 @@ const Pane = styled(Flex)`
|
|||
`;
|
||||
|
||||
export function PaneSide(props) {
|
||||
const {
|
||||
children,
|
||||
position,
|
||||
isDragging,
|
||||
split,
|
||||
defaultSize,
|
||||
hasTwoSides,
|
||||
} = props;
|
||||
const { children, position, isDragging, split, defaultSize, hasTwoSides } =
|
||||
props;
|
||||
|
||||
const compRef = React.useRef();
|
||||
|
||||
|
|
|
@ -14,27 +14,23 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
import {useEffect} from "react";
|
||||
import { useEffect } from 'react';
|
||||
|
||||
function useClickOutside(ref, handler) {
|
||||
|
||||
useEffect(
|
||||
() => {
|
||||
const listener = (e: MouseEvent) => {
|
||||
if (!ref.current || ref.current.contains(e.target)) {
|
||||
return;
|
||||
}
|
||||
handler(e);
|
||||
};
|
||||
document.addEventListener("mousedown", listener);
|
||||
document.addEventListener("touchstart", listener);
|
||||
return () => {
|
||||
document.removeEventListener("mousedown", listener);
|
||||
document.removeEventListener("touchstart", listener);
|
||||
};
|
||||
},
|
||||
[ref, handler]
|
||||
);
|
||||
useEffect(() => {
|
||||
const listener = (e: MouseEvent) => {
|
||||
if (!ref.current || ref.current.contains(e.target)) {
|
||||
return;
|
||||
}
|
||||
handler(e);
|
||||
};
|
||||
document.addEventListener('mousedown', listener);
|
||||
document.addEventListener('touchstart', listener);
|
||||
return () => {
|
||||
document.removeEventListener('mousedown', listener);
|
||||
document.removeEventListener('touchstart', listener);
|
||||
};
|
||||
}, [ref, handler]);
|
||||
}
|
||||
|
||||
export {useClickOutside};
|
||||
export { useClickOutside };
|
||||
|
|
|
@ -19,7 +19,7 @@ import { useEffect } from 'react';
|
|||
function useEscape(handler) {
|
||||
useEffect(() => {
|
||||
const listener = (e: KeyboardEvent) => {
|
||||
if (e.key === "Escape") {
|
||||
if (e.key === 'Escape') {
|
||||
handler(e);
|
||||
}
|
||||
};
|
||||
|
|
|
@ -25,7 +25,7 @@ if (typeof Promise !== 'function') {
|
|||
}
|
||||
|
||||
if (typeof Promise.prototype.finally !== 'function') {
|
||||
var speciesConstructor = function(O, defaultConstructor) {
|
||||
var speciesConstructor = function (O, defaultConstructor) {
|
||||
if (!O || (typeof O !== 'object' && typeof O !== 'function')) {
|
||||
throw new TypeError('Assertion failed: Type(O) is not Object');
|
||||
}
|
||||
|
|
|
@ -29,8 +29,5 @@ export function bufferToBase64url(buffer: ArrayBuffer): string {
|
|||
const base64str = arrayBufferToBase64(buffer);
|
||||
|
||||
// Assuming the base64str is a well-formed url.
|
||||
return base64str
|
||||
.replace(/\+/g, '-')
|
||||
.replace(/\//g, '_')
|
||||
.replace(/=/g, '');
|
||||
return base64str.replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
|
||||
}
|
||||
|
|
|
@ -9,4 +9,4 @@ then you can start your local development server:
|
|||
|
||||
```
|
||||
$ yarn run start --target=https://example.com:3080/web
|
||||
```
|
||||
```
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
const baseCfg = require('@gravitational/build/.babelrc');
|
||||
module.exports = function (api) {
|
||||
api.cache(true);
|
||||
return baseCfg
|
||||
}
|
||||
return baseCfg;
|
||||
};
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import EventDialog from './EventDialog';
|
||||
export default EventDialog;
|
||||
export default EventDialog;
|
||||
|
|
|
@ -34,11 +34,9 @@ storiesOf('Teleport/Console', module).add('Console', () => {
|
|||
});
|
||||
|
||||
export function TestLayout(props: PropType) {
|
||||
const [context] = React.useState(
|
||||
(): ConsoleContext => {
|
||||
return props.ctx || new ConsoleContext();
|
||||
}
|
||||
);
|
||||
const [context] = React.useState((): ConsoleContext => {
|
||||
return props.ctx || new ConsoleContext();
|
||||
});
|
||||
|
||||
const [history] = React.useState((): any => {
|
||||
const history =
|
||||
|
|
|
@ -16,4 +16,4 @@ limitations under the License.
|
|||
|
||||
import Terminal from './Terminal';
|
||||
|
||||
export default Terminal;
|
||||
export default Terminal;
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import DownloadForm from './DownloadForm';
|
||||
export default DownloadForm;
|
||||
export default DownloadForm;
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import FileList from './FileList';
|
||||
export default FileList;
|
||||
export default FileList;
|
||||
|
|
|
@ -105,7 +105,6 @@ const defaultFile = {
|
|||
location: '~test',
|
||||
id: '1547581437406~/test',
|
||||
url: '/v1/webapi/sites/one/nodes/',
|
||||
name:
|
||||
'~/test~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf',
|
||||
name: '~/test~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf~/mamaffsdfsdfdssdf',
|
||||
blob: [],
|
||||
};
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import UploadForm from './UploadForm';
|
||||
export default UploadForm;
|
||||
export default UploadForm;
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import StyledXterm from './StyledXterm';
|
||||
export default StyledXterm;
|
||||
export default StyledXterm;
|
||||
|
|
|
@ -46,10 +46,7 @@ export default function JoinedUsers(props) {
|
|||
|
||||
const $users = users.map((u, index) => {
|
||||
const name = u.user || '';
|
||||
const initial = name
|
||||
.trim()
|
||||
.charAt(0)
|
||||
.toUpperCase();
|
||||
const initial = name.trim().charAt(0).toUpperCase();
|
||||
return (
|
||||
<UserItem key={`${index}${u.user}`}>
|
||||
<StyledAvatar>{initial}</StyledAvatar>
|
||||
|
|
|
@ -66,7 +66,10 @@ export default function ConnectDialog({
|
|||
Step 2
|
||||
</Text>
|
||||
{' - Retrieve credentials for the database'}
|
||||
<TextSelectCopy mt="2" text={`tsh db login [--db-user=<user>] [--db-name=<name>] ${dbName}`} />
|
||||
<TextSelectCopy
|
||||
mt="2"
|
||||
text={`tsh db login [--db-user=<user>] [--db-name=<name>] ${dbName}`}
|
||||
/>
|
||||
</Box>
|
||||
<Box mb={4}>
|
||||
<Text bold as="span">
|
||||
|
|
|
@ -19,7 +19,4 @@ import LoginFailed from './LoginFailed';
|
|||
import LoginSuccess from './LoginSuccess';
|
||||
|
||||
export default Login;
|
||||
export {
|
||||
LoginFailed,
|
||||
LoginSuccess
|
||||
}
|
||||
export { LoginFailed, LoginSuccess };
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import Nodes from './Nodes';
|
||||
export default Nodes;
|
||||
export default Nodes;
|
||||
|
|
|
@ -43,14 +43,21 @@ THE SOFTWARE.
|
|||
|
||||
(function (root, factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
define(['react','prop-types','create-react-class'], factory);
|
||||
define(['react', 'prop-types', 'create-react-class'], factory);
|
||||
} else if (typeof exports === 'object') {
|
||||
module.exports = factory(require('react'),require('prop-types'),require('create-react-class'));
|
||||
module.exports = factory(
|
||||
require('react'),
|
||||
require('prop-types'),
|
||||
require('create-react-class')
|
||||
);
|
||||
} else {
|
||||
root.ReactSlider = factory(root.React,root.PropTypes,root.createReactClass);
|
||||
root.ReactSlider = factory(
|
||||
root.React,
|
||||
root.PropTypes,
|
||||
root.createReactClass
|
||||
);
|
||||
}
|
||||
}(this, function (React, PropTypes, createReactClass) {
|
||||
|
||||
})(this, function (React, PropTypes, createReactClass) {
|
||||
/**
|
||||
* To prevent text selection while dragging.
|
||||
* http://stackoverflow.com/questions/5429827/how-can-i-prevent-text-element-selection-with-cursor-drag
|
||||
|
@ -85,9 +92,11 @@ THE SOFTWARE.
|
|||
return x != null && x.length === 1 ? x[0] : x;
|
||||
}
|
||||
|
||||
var isArray = Array.isArray || function(x) {
|
||||
return Object.prototype.toString.call(x) === '[object Array]';
|
||||
};
|
||||
var isArray =
|
||||
Array.isArray ||
|
||||
function (x) {
|
||||
return Object.prototype.toString.call(x) === '[object Array]';
|
||||
};
|
||||
|
||||
// undoEnsureArray(ensureArray(x)) === x
|
||||
|
||||
|
@ -95,7 +104,6 @@ THE SOFTWARE.
|
|||
displayName: 'ReactSlider',
|
||||
|
||||
propTypes: {
|
||||
|
||||
/**
|
||||
* The minimum value of the slider.
|
||||
*/
|
||||
|
@ -129,7 +137,7 @@ THE SOFTWARE.
|
|||
*/
|
||||
defaultValue: PropTypes.oneOfType([
|
||||
PropTypes.number,
|
||||
PropTypes.arrayOf(PropTypes.number)
|
||||
PropTypes.arrayOf(PropTypes.number),
|
||||
]),
|
||||
|
||||
/**
|
||||
|
@ -137,7 +145,7 @@ THE SOFTWARE.
|
|||
*/
|
||||
value: PropTypes.oneOfType([
|
||||
PropTypes.number,
|
||||
PropTypes.arrayOf(PropTypes.number)
|
||||
PropTypes.arrayOf(PropTypes.number),
|
||||
]),
|
||||
|
||||
/**
|
||||
|
@ -215,7 +223,7 @@ THE SOFTWARE.
|
|||
* Callback called when the the slider is clicked (handle or bars).
|
||||
* Receives the value at the clicked position as argument.
|
||||
*/
|
||||
onSliderClick: PropTypes.func
|
||||
onSliderClick: PropTypes.func,
|
||||
},
|
||||
|
||||
getDefaultProps: function () {
|
||||
|
@ -234,12 +242,15 @@ THE SOFTWARE.
|
|||
pearling: false,
|
||||
disabled: false,
|
||||
snapDragDisabled: false,
|
||||
invert: false
|
||||
invert: false,
|
||||
};
|
||||
},
|
||||
|
||||
getInitialState: function () {
|
||||
var value = this._or(ensureArray(this.props.value), ensureArray(this.props.defaultValue));
|
||||
var value = this._or(
|
||||
ensureArray(this.props.value),
|
||||
ensureArray(this.props.defaultValue)
|
||||
);
|
||||
|
||||
// reused throughout the component to store results of iterations over `value`
|
||||
this.tempArray = value.slice();
|
||||
|
@ -258,7 +269,7 @@ THE SOFTWARE.
|
|||
upperBound: 0,
|
||||
sliderLength: 0,
|
||||
value: value,
|
||||
zIndices: zIndices
|
||||
zIndices: zIndices,
|
||||
};
|
||||
},
|
||||
|
||||
|
@ -299,7 +310,10 @@ THE SOFTWARE.
|
|||
return defaultValue;
|
||||
default:
|
||||
if (value.length !== count || defaultValue.length !== count) {
|
||||
window.console.warn(this.constructor.displayName + ": Number of values does not match number of children.");
|
||||
window.console.warn(
|
||||
this.constructor.displayName +
|
||||
': Number of values does not match number of children.'
|
||||
);
|
||||
}
|
||||
return linspace(this.props.min, this.props.max, count);
|
||||
}
|
||||
|
@ -333,23 +347,26 @@ THE SOFTWARE.
|
|||
upperBound: slider[size] - handle[size],
|
||||
sliderLength: Math.abs(sliderMax - sliderMin),
|
||||
handleSize: handle[size],
|
||||
sliderStart: this.props.invert ? sliderMax : sliderMin
|
||||
sliderStart: this.props.invert ? sliderMax : sliderMin,
|
||||
});
|
||||
},
|
||||
|
||||
_handleResize: function () {
|
||||
// setTimeout of 0 gives element enough time to have assumed its new size if it is being resized
|
||||
var resizeTimeout = window.setTimeout(function() {
|
||||
// drop this timeout from pendingResizeTimeouts to reduce memory usage
|
||||
this.pendingResizeTimeouts.shift();
|
||||
this._resize();
|
||||
}.bind(this), 0);
|
||||
var resizeTimeout = window.setTimeout(
|
||||
function () {
|
||||
// drop this timeout from pendingResizeTimeouts to reduce memory usage
|
||||
this.pendingResizeTimeouts.shift();
|
||||
this._resize();
|
||||
}.bind(this),
|
||||
0
|
||||
);
|
||||
|
||||
this.pendingResizeTimeouts.push(resizeTimeout);
|
||||
},
|
||||
|
||||
// clear all pending timeouts to avoid error messages after unmounting
|
||||
_clearPendingResizeTimeouts: function() {
|
||||
_clearPendingResizeTimeouts: function () {
|
||||
do {
|
||||
var nextTimeout = this.pendingResizeTimeouts.shift();
|
||||
|
||||
|
@ -377,7 +394,7 @@ THE SOFTWARE.
|
|||
var style = {
|
||||
position: 'absolute',
|
||||
willChange: this.state.index >= 0 ? this._posMinKey() : '',
|
||||
zIndex: this.state.zIndices.indexOf(i) + 1
|
||||
zIndex: this.state.zIndices.indexOf(i) + 1,
|
||||
};
|
||||
style[this._posMinKey()] = offset + 'px';
|
||||
return style;
|
||||
|
@ -386,7 +403,10 @@ THE SOFTWARE.
|
|||
_buildBarStyle: function (min, max) {
|
||||
var obj = {
|
||||
position: 'absolute',
|
||||
willChange: this.state.index >= 0 ? this._posMinKey() + ',' + this._posMaxKey() : ''
|
||||
willChange:
|
||||
this.state.index >= 0
|
||||
? this._posMinKey() + ',' + this._posMaxKey()
|
||||
: '',
|
||||
};
|
||||
obj[this._posMinKey()] = min;
|
||||
obj[this._posMaxKey()] = max;
|
||||
|
@ -414,8 +434,9 @@ THE SOFTWARE.
|
|||
|
||||
_calcOffsetFromPosition: function (position) {
|
||||
var pixelOffset = position - this.state.sliderStart;
|
||||
if (this.props.invert) pixelOffset = this.state.sliderLength - pixelOffset;
|
||||
pixelOffset -= (this.state.handleSize / 2);
|
||||
if (this.props.invert)
|
||||
pixelOffset = this.state.sliderLength - pixelOffset;
|
||||
pixelOffset -= this.state.handleSize / 2;
|
||||
return pixelOffset;
|
||||
},
|
||||
|
||||
|
@ -433,13 +454,13 @@ THE SOFTWARE.
|
|||
if (value[i + 1] - value[i] < this.props.minDistance) return;
|
||||
}
|
||||
|
||||
this.setState({value: value}, callback.bind(this, closestIndex));
|
||||
this.setState({ value: value }, callback.bind(this, closestIndex));
|
||||
},
|
||||
|
||||
_getMousePosition: function (e) {
|
||||
return [
|
||||
e['page' + this._axisKey()],
|
||||
e['page' + this._orthogonalAxisKey()]
|
||||
e['page' + this._orthogonalAxisKey()],
|
||||
];
|
||||
},
|
||||
|
||||
|
@ -447,29 +468,29 @@ THE SOFTWARE.
|
|||
var touch = e.touches[0];
|
||||
return [
|
||||
touch['page' + this._axisKey()],
|
||||
touch['page' + this._orthogonalAxisKey()]
|
||||
touch['page' + this._orthogonalAxisKey()],
|
||||
];
|
||||
},
|
||||
|
||||
_getKeyDownEventMap: function () {
|
||||
return {
|
||||
'keydown': this._onKeyDown,
|
||||
'focusout': this._onBlur
|
||||
}
|
||||
keydown: this._onKeyDown,
|
||||
focusout: this._onBlur,
|
||||
};
|
||||
},
|
||||
|
||||
_getMouseEventMap: function () {
|
||||
return {
|
||||
'mousemove': this._onMouseMove,
|
||||
'mouseup': this._onMouseUp
|
||||
}
|
||||
mousemove: this._onMouseMove,
|
||||
mouseup: this._onMouseUp,
|
||||
};
|
||||
},
|
||||
|
||||
_getTouchEventMap: function () {
|
||||
return {
|
||||
'touchmove': this._onTouchMove,
|
||||
'touchend': this._onTouchEnd
|
||||
}
|
||||
touchmove: this._onTouchMove,
|
||||
touchend: this._onTouchEnd,
|
||||
};
|
||||
},
|
||||
|
||||
// create the `keydown` handler for the i-th handle
|
||||
|
@ -537,9 +558,10 @@ THE SOFTWARE.
|
|||
this.setState(function (prevState) {
|
||||
return {
|
||||
startValue: this.state.value[i],
|
||||
startPosition: position !== undefined ? position : prevState.startPosition,
|
||||
startPosition:
|
||||
position !== undefined ? position : prevState.startPosition,
|
||||
index: i,
|
||||
zIndices: zIndices
|
||||
zIndices: zIndices,
|
||||
};
|
||||
});
|
||||
},
|
||||
|
@ -558,7 +580,10 @@ THE SOFTWARE.
|
|||
|
||||
_onEnd: function (eventMap) {
|
||||
this._removeHandlers(eventMap);
|
||||
this.setState({index: -1}, this._fireChangeEvent.bind(this, 'onAfterChange'));
|
||||
this.setState(
|
||||
{ index: -1 },
|
||||
this._fireChangeEvent.bind(this, 'onAfterChange')
|
||||
);
|
||||
},
|
||||
|
||||
_onMouseMove: function (e) {
|
||||
|
@ -580,7 +605,7 @@ THE SOFTWARE.
|
|||
}
|
||||
|
||||
if (this.isScrolling) {
|
||||
this.setState({index: -1});
|
||||
this.setState({ index: -1 });
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -595,17 +620,17 @@ THE SOFTWARE.
|
|||
_onKeyDown: function (e) {
|
||||
if (e.ctrlKey || e.shiftKey || e.altKey) return;
|
||||
switch (e.key) {
|
||||
case "ArrowLeft":
|
||||
case "ArrowUp":
|
||||
case 'ArrowLeft':
|
||||
case 'ArrowUp':
|
||||
e.preventDefault();
|
||||
return this._moveDownOneStep();
|
||||
case "ArrowRight":
|
||||
case "ArrowDown":
|
||||
case 'ArrowRight':
|
||||
case 'ArrowDown':
|
||||
e.preventDefault();
|
||||
return this._moveUpOneStep();
|
||||
case "Home":
|
||||
case 'Home':
|
||||
return this._move(this.props.min);
|
||||
case "End":
|
||||
case 'End':
|
||||
return this._move(this.props.max);
|
||||
default:
|
||||
return;
|
||||
|
@ -625,7 +650,9 @@ THE SOFTWARE.
|
|||
},
|
||||
|
||||
_getValueFromPosition: function (position) {
|
||||
var diffValue = position / (this.state.sliderLength - this.state.handleSize) * (this.props.max - this.props.min);
|
||||
var diffValue =
|
||||
(position / (this.state.sliderLength - this.state.handleSize)) *
|
||||
(this.props.max - this.props.min);
|
||||
return this._trimAlignValue(this.state.startValue + diffValue);
|
||||
},
|
||||
|
||||
|
@ -673,8 +700,7 @@ THE SOFTWARE.
|
|||
if (newValue > oldValue) {
|
||||
this._pushSucceeding(value, minDistance, index);
|
||||
this._trimSucceeding(length, value, minDistance, props.max);
|
||||
}
|
||||
else if (newValue < oldValue) {
|
||||
} else if (newValue < oldValue) {
|
||||
this._pushPreceding(value, minDistance, index);
|
||||
this._trimPreceding(length, value, minDistance, props.min);
|
||||
}
|
||||
|
@ -683,15 +709,20 @@ THE SOFTWARE.
|
|||
// Normally you would use `shouldComponentUpdate`, but since the slider is a low-level component,
|
||||
// the extra complexity might be worth the extra performance.
|
||||
if (newValue !== oldValue) {
|
||||
this.setState({value: value}, this._fireChangeEvent.bind(this, 'onChange'));
|
||||
this.setState(
|
||||
{ value: value },
|
||||
this._fireChangeEvent.bind(this, 'onChange')
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
_pushSucceeding: function (value, minDistance, index) {
|
||||
var i, padding;
|
||||
for (i = index, padding = value[i] + minDistance;
|
||||
value[i + 1] != null && padding > value[i + 1];
|
||||
i++, padding = value[i] + minDistance) {
|
||||
for (
|
||||
i = index, padding = value[i] + minDistance;
|
||||
value[i + 1] != null && padding > value[i + 1];
|
||||
i++, padding = value[i] + minDistance
|
||||
) {
|
||||
value[i + 1] = this._alignValue(padding);
|
||||
}
|
||||
},
|
||||
|
@ -707,9 +738,11 @@ THE SOFTWARE.
|
|||
|
||||
_pushPreceding: function (value, minDistance, index) {
|
||||
var i, padding;
|
||||
for (i = index, padding = value[i] - minDistance;
|
||||
value[i - 1] != null && padding < value[i - 1];
|
||||
i--, padding = value[i] - minDistance) {
|
||||
for (
|
||||
i = index, padding = value[i] - minDistance;
|
||||
value[i - 1] != null && padding < value[i - 1];
|
||||
i--, padding = value[i] - minDistance
|
||||
) {
|
||||
value[i - 1] = this._alignValue(padding);
|
||||
}
|
||||
},
|
||||
|
@ -737,14 +770,18 @@ THE SOFTWARE.
|
|||
|
||||
_posMinKey: function () {
|
||||
var orientation = this.props.orientation;
|
||||
if (orientation === 'horizontal') return this.props.invert ? 'right' : 'left';
|
||||
if (orientation === 'vertical') return this.props.invert ? 'bottom' : 'top';
|
||||
if (orientation === 'horizontal')
|
||||
return this.props.invert ? 'right' : 'left';
|
||||
if (orientation === 'vertical')
|
||||
return this.props.invert ? 'bottom' : 'top';
|
||||
},
|
||||
|
||||
_posMaxKey: function () {
|
||||
var orientation = this.props.orientation;
|
||||
if (orientation === 'horizontal') return this.props.invert ? 'left' : 'right';
|
||||
if (orientation === 'vertical') return this.props.invert ? 'top' : 'bottom';
|
||||
if (orientation === 'horizontal')
|
||||
return this.props.invert ? 'left' : 'right';
|
||||
if (orientation === 'vertical')
|
||||
return this.props.invert ? 'top' : 'bottom';
|
||||
},
|
||||
|
||||
_sizeKey: function () {
|
||||
|
@ -773,7 +810,7 @@ THE SOFTWARE.
|
|||
var alignValue = val - valModStep;
|
||||
|
||||
if (Math.abs(valModStep) * 2 >= props.step) {
|
||||
alignValue += (valModStep > 0) ? props.step : (-props.step);
|
||||
alignValue += valModStep > 0 ? props.step : -props.step;
|
||||
}
|
||||
|
||||
return parseFloat(alignValue.toFixed(5));
|
||||
|
@ -781,31 +818,36 @@ THE SOFTWARE.
|
|||
|
||||
_renderHandle: function (style, child, i) {
|
||||
var self = this;
|
||||
var className = this.props.handleClassName + ' ' +
|
||||
(this.props.handleClassName + '-' + i) + ' ' +
|
||||
var className =
|
||||
this.props.handleClassName +
|
||||
' ' +
|
||||
(this.props.handleClassName + '-' + i) +
|
||||
' ' +
|
||||
(this.state.index === i ? this.props.handleActiveClassName : '');
|
||||
|
||||
return (
|
||||
React.createElement('div', {
|
||||
ref: function (r) {
|
||||
self['handle' + i] = r;
|
||||
},
|
||||
key: 'handle' + i,
|
||||
className: className,
|
||||
style: style,
|
||||
onMouseDown: this._createOnMouseDown(i),
|
||||
onTouchStart: this._createOnTouchStart(i),
|
||||
onFocus: this._createOnKeyDown(i),
|
||||
tabIndex: 0,
|
||||
role: "slider",
|
||||
"aria-valuenow": this.state.value[i],
|
||||
"aria-valuemin": this.props.min,
|
||||
"aria-valuemax": this.props.max,
|
||||
"aria-label": isArray(this.props.ariaLabel) ? this.props.ariaLabel[i] : this.props.ariaLabel,
|
||||
"aria-valuetext": this.props.ariaValuetext,
|
||||
return React.createElement(
|
||||
'div',
|
||||
{
|
||||
ref: function (r) {
|
||||
self['handle' + i] = r;
|
||||
},
|
||||
child
|
||||
)
|
||||
key: 'handle' + i,
|
||||
className: className,
|
||||
style: style,
|
||||
onMouseDown: this._createOnMouseDown(i),
|
||||
onTouchStart: this._createOnTouchStart(i),
|
||||
onFocus: this._createOnKeyDown(i),
|
||||
tabIndex: 0,
|
||||
role: 'slider',
|
||||
'aria-valuenow': this.state.value[i],
|
||||
'aria-valuemin': this.props.min,
|
||||
'aria-valuemax': this.props.max,
|
||||
'aria-label': isArray(this.props.ariaLabel)
|
||||
? this.props.ariaLabel[i]
|
||||
: this.props.ariaLabel,
|
||||
'aria-valuetext': this.props.ariaValuetext,
|
||||
},
|
||||
child
|
||||
);
|
||||
},
|
||||
|
||||
|
@ -833,16 +875,18 @@ THE SOFTWARE.
|
|||
|
||||
_renderBar: function (i, offsetFrom, offsetTo) {
|
||||
var self = this;
|
||||
return (
|
||||
React.createElement('div', {
|
||||
key: 'bar' + i,
|
||||
ref: function (r) {
|
||||
self['bar' + i] = r;
|
||||
},
|
||||
className: this.props.barClassName + ' ' + this.props.barClassName + '-' + i,
|
||||
style: this._buildBarStyle(offsetFrom, this.state.upperBound - offsetTo)
|
||||
})
|
||||
);
|
||||
return React.createElement('div', {
|
||||
key: 'bar' + i,
|
||||
ref: function (r) {
|
||||
self['bar' + i] = r;
|
||||
},
|
||||
className:
|
||||
this.props.barClassName + ' ' + this.props.barClassName + '-' + i,
|
||||
style: this._buildBarStyle(
|
||||
offsetFrom,
|
||||
this.state.upperBound - offsetTo
|
||||
),
|
||||
});
|
||||
},
|
||||
|
||||
_renderBars: function (offset) {
|
||||
|
@ -855,7 +899,9 @@ THE SOFTWARE.
|
|||
bars.push(this._renderBar(i + 1, offset[i], offset[i + 1]));
|
||||
}
|
||||
|
||||
bars.push(this._renderBar(lastIndex + 1, offset[lastIndex], this.state.upperBound));
|
||||
bars.push(
|
||||
this._renderBar(lastIndex + 1, offset[lastIndex], this.state.upperBound)
|
||||
);
|
||||
|
||||
return bars;
|
||||
},
|
||||
|
@ -865,11 +911,14 @@ THE SOFTWARE.
|
|||
this.hasMoved = false;
|
||||
if (!this.props.snapDragDisabled) {
|
||||
var position = this._getMousePosition(e);
|
||||
this._forceValueFromPosition(position[0], function (i) {
|
||||
this._start(i, position[0]);
|
||||
this._fireChangeEvent('onChange');
|
||||
this._addHandlers(this._getMouseEventMap());
|
||||
}.bind(this));
|
||||
this._forceValueFromPosition(
|
||||
position[0],
|
||||
function (i) {
|
||||
this._start(i, position[0]);
|
||||
this._fireChangeEvent('onChange');
|
||||
this._addHandlers(this._getMouseEventMap());
|
||||
}.bind(this)
|
||||
);
|
||||
}
|
||||
|
||||
pauseEvent(e);
|
||||
|
@ -880,7 +929,9 @@ THE SOFTWARE.
|
|||
|
||||
if (this.props.onSliderClick && !this.hasMoved) {
|
||||
var position = this._getMousePosition(e);
|
||||
var valueAtPos = this._trimAlignValue(this._calcValue(this._calcOffsetFromPosition(position[0])));
|
||||
var valueAtPos = this._trimAlignValue(
|
||||
this._calcValue(this._calcOffsetFromPosition(position[0]))
|
||||
);
|
||||
this.props.onSliderClick(valueAtPos);
|
||||
}
|
||||
},
|
||||
|
@ -906,22 +957,22 @@ THE SOFTWARE.
|
|||
var bars = props.withBars ? this._renderBars(offset) : null;
|
||||
var handles = this._renderHandles(offset);
|
||||
|
||||
return (
|
||||
React.createElement('div', {
|
||||
ref: function (r) {
|
||||
self.slider = r;
|
||||
},
|
||||
style: {position: 'relative'},
|
||||
className: props.className + (props.disabled ? ' disabled' : ''),
|
||||
onMouseDown: this._onSliderMouseDown,
|
||||
onClick: this._onSliderClick
|
||||
return React.createElement(
|
||||
'div',
|
||||
{
|
||||
ref: function (r) {
|
||||
self.slider = r;
|
||||
},
|
||||
bars,
|
||||
handles
|
||||
)
|
||||
style: { position: 'relative' },
|
||||
className: props.className + (props.disabled ? ' disabled' : ''),
|
||||
onMouseDown: this._onSliderMouseDown,
|
||||
onClick: this._onSliderClick,
|
||||
},
|
||||
bars,
|
||||
handles
|
||||
);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
return ReactSlider;
|
||||
}));
|
||||
});
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import Slider from './Slider';
|
||||
export default Slider;
|
||||
export default Slider;
|
||||
|
|
|
@ -16,4 +16,4 @@ limitations under the License.
|
|||
|
||||
import Xterm from './Xterm';
|
||||
|
||||
export default Xterm;
|
||||
export default Xterm;
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -16,4 +16,3 @@ limitations under the License.
|
|||
|
||||
import SideNav from './SideNav';
|
||||
export default SideNav;
|
||||
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import CatchError from './CatchError';
|
||||
export default CatchError;
|
||||
export default CatchError;
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import CustomRange from './Custom';
|
||||
export default CustomRange;
|
||||
export default CustomRange;
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import InputSearch from './InputSearch';
|
||||
export default InputSearch;
|
||||
export default InputSearch;
|
||||
|
|
|
@ -18,16 +18,16 @@ import React from 'react';
|
|||
import Image from 'design/Image';
|
||||
import defaultLogoSvg from 'design/assets/images/teleport-medallion.svg';
|
||||
|
||||
const LogoHero = ({...rest}) => {
|
||||
return <Image {...rest}/>
|
||||
}
|
||||
const LogoHero = ({ ...rest }) => {
|
||||
return <Image {...rest} />;
|
||||
};
|
||||
|
||||
LogoHero.defaultProps = {
|
||||
src: defaultLogoSvg,
|
||||
maxHeight: "120px",
|
||||
maxWidth: "200px",
|
||||
maxHeight: '120px',
|
||||
maxWidth: '200px',
|
||||
my: 6,
|
||||
mx: "auto"
|
||||
}
|
||||
mx: 'auto',
|
||||
};
|
||||
|
||||
export default LogoHero;
|
||||
export default LogoHero;
|
||||
|
|
|
@ -15,4 +15,4 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import LogoHero from './LogoHero';
|
||||
export default LogoHero;
|
||||
export default LogoHero;
|
||||
|
|
|
@ -41,9 +41,8 @@ export default function ResourceEditor(props) {
|
|||
isNew,
|
||||
} = props;
|
||||
|
||||
const { attempt, attemptActions, content, isDirty, setContent } = useEditor(
|
||||
text
|
||||
);
|
||||
const { attempt, attemptActions, content, isDirty, setContent } =
|
||||
useEditor(text);
|
||||
|
||||
const onSave = () => {
|
||||
attemptActions.do(() => props.onSave(content)).then(() => onClose());
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -17,23 +17,23 @@ limitations under the License.
|
|||
export default class AddressResolver {
|
||||
_cfg = {
|
||||
ttyUrl: null,
|
||||
ttyParams: {}
|
||||
}
|
||||
ttyParams: {},
|
||||
};
|
||||
|
||||
constructor(cfg){
|
||||
constructor(cfg) {
|
||||
this._cfg = {
|
||||
...cfg,
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
getConnStr(w, h){
|
||||
getConnStr(w, h) {
|
||||
const { ttyParams, ttyUrl } = this._cfg;
|
||||
const params = JSON.stringify({
|
||||
...ttyParams,
|
||||
term: { h, w }
|
||||
term: { h, w },
|
||||
});
|
||||
|
||||
const encoded = window.encodeURI(params);
|
||||
return ttyUrl.replace(':params', encoded);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -14,8 +14,6 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
import service, { getUrlParameter } from './history';
|
||||
import service, { getUrlParameter } from './history';
|
||||
export default service;
|
||||
export {
|
||||
getUrlParameter
|
||||
}
|
||||
export { getUrlParameter };
|
||||
|
|
Loading…
Reference in a new issue