Skip to content
Merged
Show file tree
Hide file tree
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 6 additions & 3 deletions .babelrc
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,11 @@
// Compiles sources, gulpfile and tests
{
"presets": [
["@babel/preset-env", {
"targets": {"node": "16.20.2"}
}]
[
"@babel/preset-env",
{
"targets": { "node": "16.20.2" }
}
]
]
}
12 changes: 12 additions & 0 deletions .eslintrc.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,16 @@
{
"root": true,
"rules": {
"quotes": "off",
"curly": "off",
"indent": "off",
"comma-dangle": "off",
"line-comment-position": "off",
"object-curly-spacing": "off",
"generator-star-spacing": "off",
"nonblock-statement-body-position": "off",
"newline-per-chained-call": "off",
"lines-between-class-members": "off"
},
"extends": "th0r"
}
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,4 @@
/samples
node_modules
npm-debug.log
.eslintcache
5 changes: 5 additions & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
test/bundles/**
test/stats/**
test/output/**
samples/**
CHANGELOG.md
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ _Note: Gaps between patch versions are faulty, broken or test releases._
* Add support for Zstandard compression ([#693](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/693) by [@bjohansebas](https://github.com/bjohansebas))

* **Internal**
* Prettier applied to the code base ([#693](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/694) by [@alexander-akait](https://github.com/alexander-akait))
* Update `sirv` dependency ([#692](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/692) by [@bjohansebas](https://github.com/bjohansebas))
* Update `ws` dependency ([#691](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/691) by [@bjohansebas](https://github.com/bjohansebas))

Expand Down
55 changes: 26 additions & 29 deletions README.md

Large diffs are not rendered by default.

5 changes: 1 addition & 4 deletions client/.eslintrc.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,5 @@
{
"extends": [
"th0r-react",
"../.eslintrc.json"
],
"extends": ["th0r-react", "../.eslintrc.json"],
"settings": {
"react": {
"version": "16.2"
Expand Down
5 changes: 4 additions & 1 deletion client/components/Button.css
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,10 @@
font: var(--main-font);
outline: none;
padding: 5px 7px;
transition: background .3s ease, border-color .3s ease, color .3s ease;
transition:
background 0.3s ease,
border-color 0.3s ease,
color 0.3s ease;
white-space: nowrap;
color: var(--text-primary);
}
Expand Down
27 changes: 13 additions & 14 deletions client/components/Button.jsx
Original file line number Diff line number Diff line change
@@ -1,39 +1,38 @@
import cls from 'classnames';
import s from './Button.css';
import PureComponent from '../lib/PureComponent';
import cls from "classnames";
import s from "./Button.css";
import PureComponent from "../lib/PureComponent";

export default class Button extends PureComponent {
render({active, toggle, className, children, ...props}) {
render({ active, toggle, className, children, ...props }) {
const classes = cls(className, {
[s.button]: true,
[s.active]: active,
[s.toggle]: toggle
[s.toggle]: toggle,
});

return (
<button {...props}
<button
{...props}
ref={this.saveRef}
type="button"
className={classes}
disabled={this.disabled}
onClick={this.handleClick}>
onClick={this.handleClick}
>
{children}
</button>
);
}

get disabled() {
const {props} = this;
return (
props.disabled ||
(props.active && !props.toggle)
);
const { props } = this;
return props.disabled || (props.active && !props.toggle);
}

handleClick = (event) => {
this.elem.blur();
this.props.onClick(event);
}
};

saveRef = elem => this.elem = elem;
saveRef = (elem) => (this.elem = elem);
}
22 changes: 10 additions & 12 deletions client/components/Checkbox.jsx
Original file line number Diff line number Diff line change
@@ -1,28 +1,26 @@
import {Component} from 'preact';
import cls from 'classnames';
import { Component } from "preact";
import cls from "classnames";

import s from './Checkbox.css';
import s from "./Checkbox.css";

export default class Checkbox extends Component {

render() {
const {checked, className, children} = this.props;
const { checked, className, children } = this.props;

return (
<label className={cls(s.label, className)}>
<input className={s.checkbox}
<input
className={s.checkbox}
type="checkbox"
checked={checked}
onChange={this.handleChange}/>
<span className={s.itemText}>
{children}
</span>
onChange={this.handleChange}
/>
<span className={s.itemText}>{children}</span>
</label>
);
}

handleChange = () => {
this.props.onChange(!this.props.checked);
}

};
}
58 changes: 31 additions & 27 deletions client/components/CheckboxList.jsx
Original file line number Diff line number Diff line change
@@ -1,83 +1,88 @@
import CheckboxListItem from './CheckboxListItem';
import s from './CheckboxList.css';
import PureComponent from '../lib/PureComponent';
import CheckboxListItem from "./CheckboxListItem";
import s from "./CheckboxList.css";
import PureComponent from "../lib/PureComponent";

const ALL_ITEM = Symbol('ALL_ITEM');
const ALL_ITEM = Symbol("ALL_ITEM");

export default class CheckboxList extends PureComponent {

static ALL_ITEM = ALL_ITEM;

constructor(props) {
super(props);
this.state = {
checkedItems: props.checkedItems || props.items
checkedItems: props.checkedItems || props.items,
};
}

componentWillReceiveProps(newProps) {
if (newProps.items !== this.props.items) {
if (this.isAllChecked()) {
// Preserving `all checked` state
this.setState({checkedItems: newProps.items});
this.setState({ checkedItems: newProps.items });
this.informAboutChange(newProps.items);
} else if (this.state.checkedItems.length) {
// Checking only items that are in the new `items` array
const checkedItems = newProps.items.filter(item =>
this.state.checkedItems.find(checkedItem => checkedItem.label === item.label)
const checkedItems = newProps.items.filter((item) =>
this.state.checkedItems.find(
(checkedItem) => checkedItem.label === item.label,
),
);

this.setState({checkedItems});
this.setState({ checkedItems });
this.informAboutChange(checkedItems);
}
} else if (newProps.checkedItems !== this.props.checkedItems) {
this.setState({checkedItems: newProps.checkedItems});
this.setState({ checkedItems: newProps.checkedItems });
}
}

render() {
const {label, items, renderLabel} = this.props;
const { label, items, renderLabel } = this.props;

return (
<div className={s.container}>
<div className={s.label}>
{label}:
</div>
<div className={s.label}>{label}:</div>
<div>
<CheckboxListItem item={ALL_ITEM}
<CheckboxListItem
item={ALL_ITEM}
checked={this.isAllChecked()}
onChange={this.handleToggleAllCheck}>
onChange={this.handleToggleAllCheck}
>
{renderLabel}
</CheckboxListItem>
{items.map(item =>
<CheckboxListItem key={item.label}
{items.map((item) => (
<CheckboxListItem
key={item.label}
item={item}
checked={this.isItemChecked(item)}
onChange={this.handleItemCheck}>
onChange={this.handleItemCheck}
>
{renderLabel}
</CheckboxListItem>
)}
))}
</div>
</div>
);
}

handleToggleAllCheck = () => {
const checkedItems = this.isAllChecked() ? [] : this.props.items;
this.setState({checkedItems});
this.setState({ checkedItems });
this.informAboutChange(checkedItems);
};

handleItemCheck = item => {
handleItemCheck = (item) => {
let checkedItems;

if (this.isItemChecked(item)) {
checkedItems = this.state.checkedItems.filter(checkedItem => checkedItem !== item);
checkedItems = this.state.checkedItems.filter(
(checkedItem) => checkedItem !== item,
);
} else {
checkedItems = [...this.state.checkedItems, item];
}

this.setState({checkedItems});
this.setState({ checkedItems });
this.informAboutChange(checkedItems);
};

Expand All @@ -86,11 +91,10 @@ export default class CheckboxList extends PureComponent {
}

isAllChecked() {
return (this.props.items.length === this.state.checkedItems.length);
return this.props.items.length === this.state.checkedItems.length;
}

informAboutChange(checkedItems) {
setTimeout(() => this.props.onChange(checkedItems));
}

}
19 changes: 8 additions & 11 deletions client/components/CheckboxListItem.jsx
Original file line number Diff line number Diff line change
@@ -1,34 +1,31 @@
import {Component} from 'preact';
import { Component } from "preact";

import Checkbox from './Checkbox';
import CheckboxList from './CheckboxList';
import s from './CheckboxList.css';
import Checkbox from "./Checkbox";
import CheckboxList from "./CheckboxList";
import s from "./CheckboxList.css";

export default class CheckboxListItem extends Component {

render() {
return (
<div className={s.item}>
<Checkbox {...this.props}
onChange={this.handleChange}>
<Checkbox {...this.props} onChange={this.handleChange}>
{this.renderLabel()}
</Checkbox>
</div>
);
}

renderLabel() {
const {children, item} = this.props;
const { children, item } = this.props;

if (children) {
return children(item);
}

return (item === CheckboxList.ALL_ITEM) ? 'All' : item.label;
return item === CheckboxList.ALL_ITEM ? "All" : item.label;
}

handleChange = () => {
this.props.onChange(this.props.item);
}

};
}
4 changes: 3 additions & 1 deletion client/components/ContextMenu.css
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,9 @@
opacity: 1;
white-space: nowrap;
visibility: visible;
transition: opacity .2s ease, visibility .2s ease;
transition:
opacity 0.2s ease,
visibility 0.2s ease;
}

.hidden {
Expand Down
Loading
Loading