@vectoriox/iox-ui 4.7.4 → 4.8.0

package/fesm2022/vectoriox-iox-ui.mjs

@@ -1497,6 +1497,10 @@ class ClientSliderContainerComponent {
     constructor(platformId) {
         this.platformId = platformId;
         this.nodeId = '';
+        /** Language (writing) direction. Rendered as the `dir` attribute so it survives SSR and drives
+         *  Swiper's RTL layout — must match the builder's app-slider-container, which had `dir` while
+         *  this engine-runtime component did not (RTL showed in the editor but never on the live site). */
+        this.dir = 'ltr';
         this.direction = 'horizontal';
         this.loop = false;
         this.slidesPerView = 1;
@@ -1576,6 +1580,9 @@ class ClientSliderContainerComponent {
         }
         const config = {
             modules,
+            // Swiper reads the container's `dir` attribute, but pass it explicitly so RTL is applied
+            // on init regardless of attribute timing.
+            dir: this.dir,
             direction: this.direction,
             loop: this.loop,
             slidesPerView: this.slidesPerView,
@@ -1606,8 +1613,8 @@ class ClientSliderContainerComponent {
         this.instanceRegistry.register(this.nodeId, this._swiper);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ClientSliderContainerComponent, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.11", type: ClientSliderContainerComponent, isStandalone: false, selector: "iox-slider-container", inputs: { nodeId: "nodeId", direction: "direction", loop: "loop", slidesPerView: "slidesPerView", spaceBetween: "spaceBetween", speed: "speed", effect: "effect", grabCursor: "grabCursor", centeredSlides: "centeredSlides", initialSlide: "initialSlide", enableNavigation: "enableNavigation", enablePagination: "enablePagination", enableScrollbar: "enableScrollbar", enableAutoplay: "enableAutoplay", enableKeyboard: "enableKeyboard", enableMousewheel: "enableMousewheel", enableZoom: "enableZoom", enableGrid: "enableGrid", enableParallax: "enableParallax", autoplayDelay: "autoplayDelay", autoplayPauseOnMouseEnter: "autoplayPauseOnMouseEnter", autoplayDisableOnInteraction: "autoplayDisableOnInteraction", paginationType: "paginationType", paginationClickable: "paginationClickable", gridRows: "gridRows", breakpoints: "breakpoints" }, viewQueries: [{ propertyName: "childrenHost", first: true, predicate: ["childrenHost"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "swiperEl", first: true, predicate: ["swiperEl"], descendants: true, static: true }], ngImport: i0, template: `
-        <div class="swiper" [class]="'iox-node-' + nodeId" #swiperEl>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.11", type: ClientSliderContainerComponent, isStandalone: false, selector: "iox-slider-container", inputs: { nodeId: "nodeId", dir: "dir", direction: "direction", loop: "loop", slidesPerView: "slidesPerView", spaceBetween: "spaceBetween", speed: "speed", effect: "effect", grabCursor: "grabCursor", centeredSlides: "centeredSlides", initialSlide: "initialSlide", enableNavigation: "enableNavigation", enablePagination: "enablePagination", enableScrollbar: "enableScrollbar", enableAutoplay: "enableAutoplay", enableKeyboard: "enableKeyboard", enableMousewheel: "enableMousewheel", enableZoom: "enableZoom", enableGrid: "enableGrid", enableParallax: "enableParallax", autoplayDelay: "autoplayDelay", autoplayPauseOnMouseEnter: "autoplayPauseOnMouseEnter", autoplayDisableOnInteraction: "autoplayDisableOnInteraction", paginationType: "paginationType", paginationClickable: "paginationClickable", gridRows: "gridRows", breakpoints: "breakpoints" }, viewQueries: [{ propertyName: "childrenHost", first: true, predicate: ["childrenHost"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "swiperEl", first: true, predicate: ["swiperEl"], descendants: true, static: true }], ngImport: i0, template: `
+        <div class="swiper" [class]="'iox-node-' + nodeId" [attr.dir]="dir" [style.direction]="dir" #swiperEl>
             <div class="swiper-wrapper">
                 <ng-container #childrenHost></ng-container>
             </div>
@@ -1621,7 +1628,7 @@ class ClientSliderContainerComponent {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: ClientSliderContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'iox-slider-container', template: `
-        <div class="swiper" [class]="'iox-node-' + nodeId" #swiperEl>
+        <div class="swiper" [class]="'iox-node-' + nodeId" [attr.dir]="dir" [style.direction]="dir" #swiperEl>
             <div class="swiper-wrapper">
                 <ng-container #childrenHost></ng-container>
             </div>
@@ -1636,6 +1643,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
                     args: [PLATFORM_ID]
                 }] }], propDecorators: { nodeId: [{
                 type: Input
+            }], dir: [{
+                type: Input
             }], direction: [{
                 type: Input
             }], loop: [{
@@ -2249,8 +2258,9 @@ function matchRouteParams(template, actual) {
 /**
  * Build the query filter for a data-source request from its filterByRouteParam / filterByQueryParams
  * config. `field` is filtered by the route-param value (falling back to `defaultId`); query filters
- * map each `field` to a query-param value (falling back to `defaultValue`). Empty values are omitted
- * so the source isn't accidentally filtered to nothing.
+ * map each `field` to a query-param value (falling back to `defaultValue`), and a filter with NO
+ * `queryParam` is a constant on `defaultValue`. Empty values are omitted so the source isn't
+ * accidentally filtered to nothing.
  */
 function buildDataSourceFilter(req, routeParams = {}, queryParams = {}) {
     const params = {};
@@ -2261,9 +2271,11 @@ function buildDataSourceFilter(req, routeParams = {}, queryParams = {}) {
             params[byRoute.field] = value;
     }
     for (const q of req?.filterByQueryParams ?? []) {
-        if (!q?.field || !q?.queryParam)
+        if (!q?.field)
             continue;
-        const value = queryParams[q.queryParam] ?? q.defaultValue;
+        // No queryParam → a CONSTANT filter: defaultValue is the value, in the builder preview and
+        // on the live site alike. With a queryParam the URL wins and defaultValue is the fallback.
+        const value = q.queryParam ? (queryParams[q.queryParam] ?? q.defaultValue) : q.defaultValue;
         if (value !== undefined && value !== null && value !== '')
             params[q.field] = value;
     }