diff --git a/resources/js/stimulus/index.js b/resources/js/stimulus/index.js index 1883e16..f9ed941 100644 --- a/resources/js/stimulus/index.js +++ b/resources/js/stimulus/index.js @@ -15,8 +15,8 @@ import ProductFormController from './product-form-controller' import ProductGalleryController from './product-gallery-controller' import QuantityController from './quantity-controller' import RangeSliderController from './range-slider-controller' -import ReviewCountController from './review-count-controller' import StarRatingController from './star-rating-controller' +import TabLinkController from './tab-link-controller' import TabsController from './tabs-controller' export function registerControllers(application) { @@ -32,7 +32,7 @@ export function registerControllers(application) { application.register('product-gallery', ProductGalleryController) application.register('quantity', QuantityController) application.register('range-slider', RangeSliderController) - application.register('review-count', ReviewCountController) application.register('star-rating', StarRatingController) + application.register('tab-link', TabLinkController) application.register('tabs', TabsController) } diff --git a/resources/js/stimulus/review-count-controller.js b/resources/js/stimulus/review-count-controller.js deleted file mode 100644 index 5091091..0000000 --- a/resources/js/stimulus/review-count-controller.js +++ /dev/null @@ -1,12 +0,0 @@ -import { Controller } from '@hotwired/stimulus' - -// The review count sits next to the star rating, outside the tabs markup — -// too far apart in the DOM for a plain data-action, hence the outlet. -export default class extends Controller { - static outlets = ['tabs'] - - activate() { - this.tabsOutlet.activate('reviews') - this.tabsOutlet.element.scrollIntoView({ block: 'start', behavior: 'smooth' }) - } -} diff --git a/resources/js/stimulus/tab-link-controller.js b/resources/js/stimulus/tab-link-controller.js new file mode 100644 index 0000000..9bfe268 --- /dev/null +++ b/resources/js/stimulus/tab-link-controller.js @@ -0,0 +1,15 @@ +import { Controller } from '@hotwired/stimulus' + +// Jumps to a tab panel from an element outside the tabs' own markup — the +// review count and the "read more" link both sit elsewhere in the DOM, too +// far apart from the tabs for a plain data-action, hence the outlet. +export default class extends Controller { + static outlets = ['tabs'] + static values = { panel: String } + + activate(event) { + event?.preventDefault() + this.tabsOutlet.activate(this.panelValue) + this.tabsOutlet.element.scrollIntoView({ block: 'start', behavior: 'smooth' }) + } +} diff --git a/resources/views/components/reviews-stars.blade.php b/resources/views/components/reviews-stars.blade.php index ca29a13..d7fcbbd 100644 --- a/resources/views/components/reviews-stars.blade.php +++ b/resources/views/components/reviews-stars.blade.php @@ -33,7 +33,7 @@ class="flex items-center gap-1.5 text-brand" @if ($linkable) diff --git a/resources/views/emails/layout.blade.php b/resources/views/emails/layout.blade.php index 3994053..2e10913 100644 --- a/resources/views/emails/layout.blade.php +++ b/resources/views/emails/layout.blade.php @@ -70,7 +70,7 @@ - +