Commit Graph

7 Commits

Author SHA1 Message Date
b79a89bbb4 Add AJAX filtering for preview popover with width lock
- Convert preview filter from client-side JS to server-side AJAX
- Add debounce utility function for 300ms delayed AJAX calls
- Add filter handlers for all 4 preview types (tab, condition, group, filter-group)
- Add filterProductIdsByQuery() method to EntityPreviewHandler
- Update all AJAX handlers to support filter parameter
- Lock popover width when filtering to prevent resize
- Add loading overlay CSS for filter state

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-29 14:07:56 +01:00
6f248605a7 Refactor preview popover and fix dropdown header styling
- Refactor preview popover into reusable component with filter input and load more
- Fix sort controls: connect sort-field-select to btn-sort-dir (shared border)
- Fix refine controls: connect btn-refine-negate to refine-input
- Add flex-shrink: 0 and min-width to prevent button shrinking
- Fix grid view items: border on all 4 sides, no padding
- Add EXCEPT separator styling for selection groups
- Various button width and height fixes for consistency

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-29 12:13:13 +00:00
2988385acd Add debug console.log for filter preview popover 2026-01-28 10:35:15 +00:00
cbebb32af5 Fix filter toggle preview: use $dropdown.on() instead of $(document).on()
- Move toggle-count click handler next to filter-group-toggle handler
- Use this.$dropdown.on() for proper event delegation within dropdown context
- Ensures self reference is correctly captured for showFilterGroupPreviewPopover

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-28 10:32:44 +00:00
ea73b31e58 Fix filter toggle click propagation to preview badge
- Added check to ignore clicks on .toggle-count.clickable in filter-group-toggle handler
- Prevents parent button from expanding values when clicking preview badge
- Added .gitignore to exclude node_modules

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-28 10:23:59 +00:00
6ebf94e15b Add clickable preview popover to filter group toggles
- Add showFilterGroupPreviewPopover method in _preview.js
- Make toggle-count badges clickable with data attributes
- Add event binding for .toggle-count.clickable in _events.js
- Add hover/active/loading styles for clickable toggle-count
- Requires previewFilterGroupProducts AJAX handler in PHP backend

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-28 10:18:42 +00:00
aa9f28bb7e Refactor from Tailwind CSS to SCSS/Bootstrap
Major changes:
- Replace Tailwind with SCSS using Bootstrap-compatible variables
- Add Gulp build system for SCSS and JS compilation
- Split JS into modular partials (_events, _filters, _preview, etc.)

CSS fixes:
- Fix preview popover visibility (remove conflicting modal.scss rule)
- Fix search input max-width override for parent form styles
- Add filter panel styling (toggle buttons, chips, values row)
- Add group-body padding with negative margins on modifiers
- Style filter-group-toggle with eye icon for preview

JS additions:
- Add showGroupPreviewPopover for group count badge clicks
- Add showItemsPopover for rendering preview popover
- Add renderPreviewItems for product list rendering
- Add eye icon to filter toggle button generation

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-28 11:11:22 +01:00