mypresta.rocks/prestashop-entity-selector
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add hierarchical tree view for category selection

Browse Source 
Features:
- Tree view mode for categories with expand/collapse
- Product count badges with clickable preview popover
- Select parent with all children button
- Client-side tree filtering (refine search)
- Keyboard shortcuts: Ctrl+A (select all), Ctrl+D (clear)
- View mode switching between tree/list/columns
- Tree view as default for categories, respects user preference

Backend:
- Add previewCategoryProducts and previewCategoryPages AJAX handlers
- Support pagination and filtering in category previews

Styling:
- Consistent count-badge styling across tree and other views
- Loading and popover-open states for count badges

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
myprestarocks
2026-01-31 15:03:51 +01:00
parent b79a89bbb4
commit 7d79273743
37 changed files with 4620 additions and 1913 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
sources/scss/_variables.scss
View File

@@ -1,8 +1,14 @@
/**
* Entity Selector Variables
* Bootstrap 4 compatible values for PrestaShop admin theme
*
* Imports shared variables from prestashop-admin package
* and maps them to $es-* prefixed aliases for this package
*/
// Import shared variables from prestashop-admin
@use '../../../prestashop-admin/assets/scss/variables' as admin;
// =============================================================================
// Base Colors
// =============================================================================
@@ -10,38 +16,38 @@
$es-white: #ffffff !default;
$es-black: #000000 !default;
// Primary (PrestaShop admin accent)
$es-primary: #25b9d7 !default;
// Primary (from prestashop-admin)
$es-primary: admin.$primary !default;
$es-primary-hover: #1a9ab7 !default;
$es-primary-light: rgba(37, 185, 215, 0.1) !default;
// Semantic colors (Bootstrap 4 aligned)
$es-success: #28a745 !default;
// Semantic colors (from prestashop-admin)
$es-success: admin.$success !default;
$es-success-light: #d4edda !default;
$es-success-dark: #1e7e34 !default;
$es-danger: #dc3545 !default;
$es-danger: admin.$danger !default;
$es-danger-light: #f8d7da !default;
$es-danger-dark: #bd2130 !default;
$es-warning: #ffc107 !default;
$es-warning: admin.$warning !default;
$es-warning-light: #fff3cd !default;
$es-info: #17a2b8 !default;
$es-info: admin.$info !default;
$es-info-light: #d1ecf1 !default;
// =============================================================================
// Gray Scale (Bootstrap 4)
// =============================================================================
$es-gray-100: #f8f9fa !default;
$es-gray-100: admin.$light !default;
$es-gray-200: #e9ecef !default;
$es-gray-300: #dee2e6 !default;
$es-gray-300: admin.$border-color !default;
$es-gray-400: #ced4da !default;
$es-gray-500: #adb5bd !default;
$es-gray-600: #6c757d !default;
$es-gray-600: admin.$secondary !default;
$es-gray-700: #495057 !default;
$es-gray-800: #343a40 !default;
$es-gray-800: admin.$dark !default;
$es-gray-900: #212529 !default;
// Slate (subtle variations)
@@ -73,7 +79,7 @@ $es-bg-hover: $es-gray-200 !default;
$es-bg-active: $es-gray-200 !default;
$es-bg-body: $es-white !default;
$es-border-color: $es-gray-300 !default;
$es-border-color: admin.$border-color !default;
$es-border-light: $es-gray-200 !default;
$es-border-dark: $es-gray-400 !default;
@@ -83,22 +89,22 @@ $es-text-muted: $es-gray-600 !default;
$es-text-light: $es-gray-500 !default;
// =============================================================================
// Spacing (Bootstrap 4 compatible)
// Spacing (Bootstrap 4 compatible, derived from admin.$spacer)
// =============================================================================
$es-spacing-xs: 0.25rem !default; // 4px
$es-spacing-sm: 0.5rem !default; // 8px
$es-spacing-md: 1rem !default; // 16px
$es-spacing-lg: 1.5rem !default; // 24px
$es-spacing-xl: 2rem !default; // 32px
$es-spacing-xs: admin.$spacer * 0.25 !default; // 4px
$es-spacing-sm: admin.$spacer * 0.5 !default; // 8px
$es-spacing-md: admin.$spacer !default; // 16px
$es-spacing-lg: admin.$spacer * 1.5 !default; // 24px
$es-spacing-xl: admin.$spacer * 2 !default; // 32px
// =============================================================================
// Border Radius (Bootstrap 4 compatible)
// Border Radius (from prestashop-admin)
// =============================================================================
$es-radius-sm: 0.2rem !default;
$es-radius-md: 0.25rem !default;
$es-radius-lg: 0.3rem !default;
$es-radius-sm: admin.$border-radius-sm !default;
$es-radius-md: admin.$border-radius !default;
$es-radius-lg: admin.$border-radius-lg !default;
$es-radius-xl: 0.5rem !default;
$es-radius-full: 50rem !default;