Outsource custom GUI class components to dashgui library

Move reusable GUI primitives (PanelTile, EditablePanelTile, base Tile,
ElevatedPill, SingleLineTextEdit) into the shared dashgui package and
consume them via a file: dependency. EditablePanelTile now accepts an
onError prop so error notification stays app-side.

src/components/article/ArticlePhotoTile.jsx

@@ -2,7 +2,7 @@ import { PureComponent, createRef } from 'react';
 import ContentPasteIcon from '@mui/icons-material/ContentPaste';
 import EditOutlinedIcon from '@mui/icons-material/EditOutlined';
 import { StorageManagerContext } from '../../api/storageManagerContext';
-import { PanelTile } from '../panels';
+import { PanelTile } from 'dashgui/panels';
 import { requireObject } from '../../utils/apiShape';
 import { notifyError } from '../../utils/notify';
 import { prepareArticlePhoto } from '../../utils/prepareArticlePhoto';

src/components/article/ArticleTileTab.jsx

@@ -24,8 +24,8 @@ import {
 } from '../../pages/artikel/articleRoute';
 import { router } from '../../appRouter';
 import { matchPath } from 'react-router-dom';
-import { PanelTile } from '../panels';
-import { PANEL_TILE_BORDER_RADIUS, responsiveColumnSpan } from '../panels/panelTileLayout';
+import { PanelTile } from 'dashgui/panels';
+import { PANEL_TILE_BORDER_RADIUS, responsiveColumnSpan } from 'dashgui/panels/panelTileLayout';
 import ArticleAttributesTab from './tabs/ArticleAttributesTab';
 import ArticleCompoundTab from './tabs/ArticleCompoundTab';
 import ArticleHistoryTab from './tabs/ArticleHistoryTab';

src/components/article/ArticleView.jsx

@@ -1,5 +1,5 @@
 import { PureComponent } from 'react';
-import { PanelTileGrid } from '../panels';
+import { PanelTileGrid } from 'dashgui/panels';
 import { StorageManagerContext } from '../../api/storageManagerContext';
 import withNavigate from '../withNavigate';
 import {

src/components/article/boxes/ArticleViewBrand.jsx

@@ -3,7 +3,7 @@ import Autocomplete from '@mui/material/Autocomplete';
 import TextField from '@mui/material/TextField';
 import Typography from '@mui/material/Typography';
 import Box from '@mui/material/Box';
-import { EditablePanelTile } from '../../panels';
+import { EditablePanelTile } from 'dashgui/panels';
 import { StorageManagerContext } from '../../../api/storageManagerContext';
 import { requireDefined, requireObject } from '../../../utils/apiShape';
 import { notifyError } from '../../../utils/notify';
@@ -150,6 +150,7 @@ export default class ArticleViewBrand extends PureComponent {
         color="#e9d5ff"
         value={value}
         onSave={this.handleSave}
+        onError={notifyError}
         isDirty={brandDraftDirty}
         canSave={brandDraftValid}
         display={<PanelValue>{value.name || null}</PanelValue>}

src/components/article/boxes/ArticleViewEANs.jsx

@@ -3,10 +3,11 @@ import Autocomplete from '@mui/material/Autocomplete';
 import TextField from '@mui/material/TextField';
 import Typography from '@mui/material/Typography';
 import Box from '@mui/material/Box';
-import { EditablePanelTile } from '../../panels';
+import { EditablePanelTile } from 'dashgui/panels';
 import { StorageManagerContext } from '../../../api/storageManagerContext';
 import { requireObject } from '../../../utils/apiShape';
 import { articleEans } from '../../../utils/articleDetail';
+import { notifyError } from '../../../utils/notify';
 class PanelValue extends Component {
   render() {
     const { label, children } = this.props;
@@ -115,6 +116,7 @@ export default class ArticleViewEANs extends PureComponent {
         contentAlignItems="flex-start"
         value={value}
         onSave={this.handleSave}
+        onError={notifyError}
         isDirty={eansDraftDirty}
         canSave={eansDraftValid}
         display={<EansDisplay sku={articleData.sku} eans={value.eans} />}

src/components/article/boxes/ArticleViewLists.jsx

@@ -2,7 +2,7 @@ import { Component, PureComponent } from 'react';
 import { Link as RouterLink } from 'react-router-dom';
 import Link from '@mui/material/Link';
 import Typography from '@mui/material/Typography';
-import { PanelTile } from '../../panels';
+import { PanelTile } from 'dashgui/panels';
 import { artikelDetailPath } from '../../../pages/artikel/articleRoute';
 
 class CountLine extends Component {

src/components/article/boxes/ArticleViewName.jsx

@@ -1,11 +1,12 @@
 import { Component, PureComponent } from 'react';
-import { EditablePanelTile } from '../../panels';
-import SingleLineTextEdit from '../../SingleLineTextEdit';
+import { EditablePanelTile } from 'dashgui/panels';
+import SingleLineTextEdit from 'dashgui/SingleLineTextEdit';
 import { StorageManagerContext } from '../../../api/storageManagerContext';
 import { getCategoryBreadcrumbs } from '../../../store/categorySlice';
 import { Box, Chip, IconButton } from '@mui/material';
 import AddIcon from '@mui/icons-material/Add';
 import CategoryPickerDialog from '../CategoryPickerDialog';
+import { notifyError } from '../../../utils/notify';
 
 const articleNameTextSx = {
   fontWeight: 700,
@@ -288,6 +289,7 @@ export default class ArticleViewName extends PureComponent {
         color="#ffffff"
         value={value}
         onSave={this.handleSave}
+        onError={notifyError}
         isDirty={() => draft != null && draftDirty(draft, value)}
         canSave={() => draft != null && draftValid(draft)}
         display={

src/components/article/boxes/ArticleViewPrice.jsx

@@ -3,7 +3,7 @@ import Box from '@mui/material/Box';
 import InputAdornment from '@mui/material/InputAdornment';
 import TextField from '@mui/material/TextField';
 import Typography from '@mui/material/Typography';
-import { EditablePanelTile } from '../../panels';
+import { EditablePanelTile } from 'dashgui/panels';
 import ArticlePriceTiersDialog from '../ArticlePriceTiersDialog';
 import ArticleUnitEditorDialog from '../ArticleUnitEditorDialog';
 import { StorageManagerContext } from '../../../api/storageManagerContext';
@@ -510,6 +510,7 @@ export default class ArticleViewPrice extends PureComponent {
         contentAlignItems="flex-start"
         value={priceValue}
         onSave={this.handleSave}
+        onError={notifyError}
         isDirty={priceDraftDirty}
         canSave={priceDraftValid}
         overlay={({ editing, draft, onChange }) => (

src/components/article/boxes/ArticleViewStock.jsx

@@ -1,7 +1,7 @@
 import { Component, PureComponent } from 'react';
 import Box from '@mui/material/Box';
 import Typography from '@mui/material/Typography';
-import { PanelTile } from '../../panels';
+import { PanelTile } from 'dashgui/panels';
 import { formatStock } from '../../../pages/artikel/searchFormat';
 
 class PanelValue extends Component {