rc0.3.0

public/mix-manifest.json

@@ -1,6 +1,6 @@
 {
-    "/js/app.js": "/js/app.js?id=78f77b681669277483b9635f804ad7c8",
+    "/js/app.js": "/js/app.js?id=626f11551f992300980bae0079a9e039",
     "/js/manifest.js": "/js/manifest.js?id=22bb55ce20c9c883a45b5c11d8eca703",
     "/js/vendor.js": "/js/vendor.js?id=a21c2dcb4fdd557ce1ec6c040ad40be4",
-    "/css/app.css": "/css/app.css?id=480082d086b2f1b7a2c82d4ec82767ac"
+    "/css/app.css": "/css/app.css?id=bdb490a0d24d6b79ea0fa78db22f211c"
 }

resources/js/actions/index.js

@@ -99,7 +99,7 @@ function Index(props) {
                         <div className="index__header-search">
                             <Search value={location.current.params.search} onSearch={keyword => search(keyword)}/>
                         </div>) : null)}
-                    {<FiltersTool filters={props.filters} data={location.current.params} onChange={params => filter(params)}/>}
+                    {<FiltersTool path={props.path} filters={props.filters} data={location.current.params} onChange={params => filter(params)}/>}
                 </div>
             </div>
         );
@@ -186,8 +186,8 @@ function Index(props) {
         });
 
         const indexRow = (
-            <div className={'index-row'+(props.action ? ' index-row--clickable' : '')} onClick={props.action ? () => onRowClick(row) : null}>
-                <div className="index-row__content" style={getRowStyle()}>
+            <div className={'index-row index-row--'+props.style+' '+(props.action ? ' index-row--clickable' : '')} onClick={props.action ? () => onRowClick(row) : null}>
+                <div className="index-row__content" style={props.style === 'default' ? getRowStyle() : {}}>
                     {rowContent}
                 </div>
                 <div className="index-row__actions">

resources/js/core/ui/context-menu/index.scss

@@ -38,6 +38,8 @@
 
 @include block(context-menu)
 {
+    width: 100%;
+
     @include element(menu)
     {
         animation: context-menu .25s;
@@ -56,6 +58,7 @@
 
     @include element(wrap)
     {
+        width: 100%;
         position: relative;
 
         @include block-modifier(open)

resources/js/core/ui/filters-tool.js

@@ -43,7 +43,7 @@ function FiltersTool(props) {
     }
 
     const renderFilters = () => {
-        const filterList = filters.renderFiltersWith(props.filters, props.data, {}, (filter, i) => {
+        const filterList = filters.renderFiltersWith(props.filters, props.data, props.path, (filter, i) => {
             return (
                 <div className="filters-tool__filter" key={i}>
                     {filter}
@@ -84,7 +84,8 @@ function FiltersTool(props) {
 
 FiltersTool.defaultProps = {
     onChange: () => {},
-    data: {}
+    data: {},
+    path: {}
 };
 
 export default FiltersTool;

resources/js/core/ui/icon.js

@@ -1,33 +1,40 @@
-import React from 'react';
+import React, {useEffect, useState} from 'react';
 import helpers from "../../util/helpers";
+import useOnMount from "../../hooks/use-on-mount";
 
-class Icon extends React.Component {
+function Icon(props) {
 
-    static defaultProps = {
-        'text': '',
-        'type': 'icon',
-        'style': [],
-        'name': 'fingerprint',
-        onClick: null
-    };
+    const [state, setState] = useState({
+        style: props.style
+    });
 
-    onClick(e) {
+    const onClick = e => {
         e.stopPropagation();
-        this.props.onClick();
-    }
-
-    render() {
+        props.onClick();
+    };
 
-        if (this.props.onClick !== null) {
-            this.props.style.push('clickable');
+    useOnMount(() => {
+        if (props.onClick) {
+            setState({
+                ...state,
+                style: [...state.style, 'icon--clickable']
+            });
         }
+    });
 
-        return (
-            <span className={helpers.className('icon', this.props.style)} onClick={this.props.onClick ? this.onClick.bind(this) : null}>
-                {this.props.name}
-            </span>
-        );
-    }
+    return (
+        <span className={helpers.className('icon', state.style)} onClick={props.onClick ? onClick : null}>
+            {props.name}
+        </span>
+    );
 }
 
+Icon.defaultProps = {
+    'text': '',
+    'type': 'icon',
+    'style': [],
+    'name': 'fingerprint',
+    onClick: null
+};
+
 export default Icon;

resources/js/core/ui/item-picker-widget.js

@@ -257,7 +257,7 @@ class ItemPickerWidget extends React.Component {
                 onClose={this.onCancel.bind(this)}
                 actions={[
                     (this.props.search ? <Search key={'search'} onSearch={keyword => this.search(keyword)} /> : null),
-                    <FiltersTool filters={this.props.filters} key={'filters'} data={this.state.filterParams} onChange={params => this.filter(params)}/>
+                    <FiltersTool path={this.props.path} filters={this.props.filters} key={'filters'} data={this.state.filterParams} onChange={params => this.filter(params)}/>
                 ]}
                 footer={[
                     <div className="item-picker-widget__footer" key={'footer'}>