npm - @pega/lists-react - Versions diffs - 9.0.0-build.18.8 → 9.0.0-build.19.0 - Mend

@pega/lists-react 9.0.0-build.18.8 → 9.0.0-build.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (82) hide show

package/lib/Core/Views/Gallery/StyledGalleryContainer.js CHANGED Viewed

@@ -1,51 +1,40 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import styled, { css } from 'styled-components';
-import { generateRSHeightStyles } from '../../Utils/styles';
-const StyledGalleryContainer = styled(forwardRef((props, ref) => _jsx("div", { ref: ref, ...props })))(() => {
+import { StyledSelectionCard } from '@pega/cosmos-react-core/lib/components/SelectionCard/SelectionCard.styles';
+import { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';
+const StyledGalleryContainer = styled(forwardRef((props, ref) => (_jsx("div", { ref: ref, ...props }))))(({ theme, isInlineImage }) => {
     return css `
-      ${({ view, isFullscreen }) => generateRSHeightStyles({ view, isFullscreen })}
+    ${({ view, isFullscreen }) => generateRSHeightStyles({ view, isFullscreen })}
-      .card-item-grid-container {
-        display: grid;
-        /* stylelint-disable-next-line unit-allowed-list */
-        grid-gap: 10px;
-        grid-template-columns: repeat(auto-fit, minmax(18.75rem, 1fr));
-        width: 100%;
-      }
-      .flex-container {
-        display: flex;
-        flex-wrap: wrap;
-        /* stylelint-disable-next-line unit-allowed-list */
-        gap: 10px;
-      }
-      /* Gallery view CSS START */
-      .icon-ph > button {
-        cursor: pointer;
-        margin-right: 0.437rem;
-      }
-      .icon-ph {
-        margin: 0.625rem 0;
-      }
-      .field-value > li {
-        padding-bottom: 0.25rem;
-      }
+    .grid-container {
+      position: absolute;
+      display: grid;
+      grid-gap: 1rem;
+      grid-template-columns: repeat(
+        auto-fit,
+        minmax(
+          min(
+            ${isInlineImage
+        ? theme?.base?.['content-width']?.md
+        : theme?.base?.['content-width']?.sm},
+            100%
+          ),
+          1fr
+        )
+      );
+      width: 100%;
+      padding: 0.2rem;
-      .row-container {
-        position: absolute;
-        justify-content: space-evenly;
+      ${StyledSelectionCard} {
+        max-width: 100%;
       }
-      &.animate {
-        .row-container > span {
-          transition: transform 0.5s cubic-bezier(0.4, 0.6, 0.1, 1);
-        }
-      }
-      /* Gallery view CSS END */
-    `;
+    }
+  `;
 });
 export default StyledGalleryContainer;
+export const StyledVirtualizeContainer = styled.div `
+  ${() => generateRSDataContainerHeightStyles()};
+  position: relative;
+`;
 //# sourceMappingURL=StyledGalleryContainer.js.map

package/lib/Core/Views/Gallery/StyledGalleryContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StyledGalleryContainer.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/StyledGalleryContainer.~~jsx~~"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,~~EAAE~~,MAAM,OAAO,CAAC;~~AACnC~~,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;~~AAE5D~~,MAAM,sBAAsB,GAAG,MAAM,~~CAAC~~,UAAU,~~CAAC~~,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,cAAK,GAAG,EAAE,GAAG,KAAM,KAAK,GAAI,CAAC,CAAC,~~CAC7F~~,~~GAAG~~,EAAE;~~IACH~~,OAAO,GAAG,CAAA;~~QACN~~,CAAC,EAAE,IAAI,EAAE,YAAY,~~EAAE~~,EAAE,EAAE,~~CAAC~~,sBAAsB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAyC7E~~,CAAC;AACJ,CAAC,~~CACF~~,CAAC;~~AAEF~~,eAAe,sBAAsB,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { generateRSHeightStyles } from '../../Utils/styles';\n\nconst StyledGalleryContainer = styled(forwardRef((props, ref) => <div ref={ref} {...props} />))(\n () => {\n return css`\n ${({ view, isFullscreen }) => generateRSHeightStyles({ view, isFullscreen })}\n\n .~~card-item-~~grid-container {\n display: grid;\n ~~/* stylelint-disable-next-line unit-allowed-list /\n~~ grid-gap: ~~10px~~;\n grid-template-columns: repeat(auto-fit, minmax(~~18.75rem, 1fr));\n width: 100%;\n }~~\n\n ~~.flex-container~~ {\n ~~display:~~ ~~flex;\~~n ~~flex-wrap~~: ~~wrap;\n / stylelint~~-~~disable-next-line unit-allowed-list /\~~n ~~gap: 10px;\~~n }\n\n ~~/ Gallery view CSS START /\~~n ~~.icon-ph > button {\n cursor~~: ~~pointer;\~~n ~~margin-right~~: 0.~~437rem~~;\n }\n ~~.icon-ph~~ {~~\n margin: 0.625rem 0;\n~~ }~~\n .field-value~~ ~~> li~~ {\n ~~padding~~-~~bottom~~: ~~0.25rem;\~~n }\n\n ~~.row-container {\~~n ~~position: absolute~~;\n ~~justify-content:~~ ~~space-evenly~~;\n }\~~n\n &.animate~~ ~~{\n .row-container~~ > ~~span~~ {~~\n transition:~~ ~~transform~~ ~~0.5s cubic-bezier~~(~~0.4, 0.6, 0.1, 1~~);\n }\n }\n\n / ~~Gallery view CSS END */\~~n `;\n ~~}\n);\n\nexport default StyledGalleryContainer;\n~~"]}
1	+ {"version":3,"file":"StyledGalleryContainer.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/StyledGalleryContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AACnD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,mBAAmB,EAAE,MAAM,2EAA2E,CAAC;AAGhH,OAAO,EAAE,mCAAmC,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAUjG,MAAM,sBAAsB,GAAG,MAAM,CACnC,UAAU,CAA8C,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,CACtE,cAAK,GAAG,EAAE,GAAG,KAAM,KAAK,GAAI,CAC7B,CAAC,CACH,CAAC,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE,EAAE;IAC7B,OAAO,GAAG,CAAA;MACN,CAAC,EAAE,IAAI,EAAE,YAAY,EAA+B,EAAE,EAAE,CACxD,sBAAsB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC;;;;;;;;;;cAUtC,aAAa;QACb,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,eAAe,CAAC,EAAE,EAAE;QACpC,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,eAAe,CAAC,EAAE,EAAE;;;;;;;;;QAS1C,mBAAmB;;;;GAIxB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,sBAAsB,CAAC;AAEtC,MAAM,CAAC,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAA;IAC/C,GAAG,EAAE,CAAC,mCAAmC,EAAE;;CAE9C,CAAC","sourcesContent":["import { forwardRef, type ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { StyledSelectionCard } from '@pega/cosmos-react-core/lib/components/SelectionCard/SelectionCard.styles';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';\n\ninterface StyledGalleryContainerProps {\n children?: ReactNode;\n view: RsCoreTypes.View;\n isFullscreen: boolean;\n isInlineImage: boolean;\n className?: string;\n}\n\nconst StyledGalleryContainer = styled(\n forwardRef<HTMLDivElement, StyledGalleryContainerProps>((props, ref) => (\n <div ref={ref} {...props} />\n ))\n)(({ theme, isInlineImage }) => {\n return css`\n ${({ view, isFullscreen }: StyledGalleryContainerProps) =>\n generateRSHeightStyles({ view, isFullscreen })}\n\n .grid-container {\n position: absolute;\n display: grid;\n grid-gap: 1rem;\n grid-template-columns: repeat(\n auto-fit,\n minmax(\n min(\n ${isInlineImage\n ? theme?.base?.['content-width']?.md\n : theme?.base?.['content-width']?.sm},\n 100%\n ),\n 1fr\n )\n );\n width: 100%;\n padding: 0.2rem;\n\n ${StyledSelectionCard} {\n max-width: 100%;\n }\n }\n `;\n});\n\nexport default StyledGalleryContainer;\n\nexport const StyledVirtualizeContainer = styled.div`\n ${() => generateRSDataContainerHeightStyles()};\n position: relative;\n`;\n"]}

package/lib/Core/Views/Gallery/_tests_/Samples/GalleryA11ySample.js CHANGED Viewed

@@ -1,7 +1,7 @@
 // cspell:disable
 export default function createGalleryA11yContainer(containerName) {
     const galleryElement = document.createElement('div');
-    galleryElement.innerHTML = `<div class="sc-dYwHd kWBYTH rs-wrapper" style="--col-display-35959765: unset; --col-width-35959765: undefinedpx; --col-left-35959765: 0px; --col-order-35959765: 66; --col-display-1767309340: unset; --col-width-1767309340: undefinedpx; --col-left-1767309340: 0px; --col-order-1767309340: 67; --col-display-65290051: unset; --col-width-65290051: undefinedpx; --col-left-65290051: 0px; --col-order-65290051: 68; --col-display--974557166: unset; --col-width--974557166: undefinedpx; --col-left--974557166: 0px; --col-order--974557166: 69; --col-width--679626225: 32px; --col-left--679626225: 0px; --col-order--679626225: 131; --col-display--679626225: unset;"><div class="sc-LnnfE gElHPn rv-gallery" data-test-id="Gallery"><div class="rv-gallery-header"><div class="sc-bmjVWh fQdTIz"><div data-testid=":list-toolbar:" class="sc-eYWdgt sc-eCApGN jFXPJ"><div class="sc-eCApGN jSYNRl sc-eqLlAf crOphF"><div class="sc-eCApGN iMYeSJ"><div class="sc-eCApGN fGEyeG sc-dprmOr fwxzUF"><h3 data-testid=":list-toolbar:heading" class="sc-hKFyIo biwFTG sc-enTpxJ cvLBAg">List of Used Cars</h3><span data-testid=":list-toolbar:count" class="sc-hKFyIo cAQnkh sc-vMGFs gLcAwe">5 results</span></div><div class="sc-eCApGN fGEyeG"><button data-testid=":list-toolbar:search-button" as="button" type="button" aria-label="Search" class="sc-bqGHjH bZirob" data-popover-target=""><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="m18.513 17.115 4.754 4.755.047.14c.14.232.186.42.186.512 0 .653-.326.979-.979.979-.186 0-.42-.094-.652-.28l-4.708-4.708c-1.77 1.445-3.776 2.144-6.06 2.144-2.656 0-4.894-.932-6.758-2.797-1.91-1.91-2.843-4.148-2.843-6.758 0-2.61.932-4.848 2.843-6.759C6.253 2.433 8.491 1.5 11.102 1.5c2.61 0 4.847.932 6.758 2.843 1.865 1.864 2.797 4.102 2.797 6.759 0 2.237-.7 4.242-2.144 6.013Zm-7.365 1.631c2.098 0 3.869-.746 5.36-2.237 1.492-1.492 2.238-3.263 2.238-5.36 0-2.099-.746-3.916-2.237-5.408-1.492-1.492-3.263-2.237-5.36-2.237-2.099 0-3.916.745-5.408 2.237-1.492 1.492-2.237 3.31-2.237 5.407 0 2.098.745 3.869 2.237 5.36 1.492 1.492 3.31 2.238 5.407 2.238Z"></path></svg></button><button data-testid=":list-toolbar:create-new" as="button" type="button" aria-label="Add" class="sc-bqGHjH bZirob" data-popover-target=""><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="m13.43 2.5-.001 9.069H22.5v1.861h-9.071v9.07h-1.906l-.001-9.07H2.5v-1.86l9.022-.001V2.5h1.907Z"></path></svg></button><button class="sc-bqGHjH bZirob sc-hLiUrC" as="button" type="button" aria-label="Enter fullscreen" data-popover-target=""><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M11.492 13.5a1 1 0 0 1 0 1.414L6.406 20H10.5a1 1 0 0 1 0 2H3v-7.5a1 1 0 0 1 2 0v4.078l5.078-5.078a1 1 0 0 1 1.414 0ZM22 3v7.5a1 1 0 0 1-2 0V6.32l-5.179 5.18a1 1 0 0 1-1.414-1.414L18.492 5H14.5a1 1 0 0 1 0-2H22Z"></path></svg></button><button data-testid=":menu-button:" id="_0xg1ojqk8" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - List of Used Cars" class="sc-dPaNSN jnYJHI sc-bqGHjH bZirob" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></div></div></div></div></div><div data-test-id="externalFilters" class="sc-kLIdoS Gwrfp"></div><input class="sc-jftIyx QkTco top" type="text" aria-hidden="true"><div class="sc-cYftwm XIXxf"><div data-total-records="5" class="sc-dYlJdf hRdTqi pContainer"><div class="bContainer" style="height: 338px; --above-loader-top: -80px; --below-loader-top: 338px;"><div class="${containerName} card-item-grid-container short-height row-container" role="rowgroup" style="width: var(--container-width); top: 0px; --container-width: 1140px;"><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="0"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Kodia</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Red</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_7pwvndydg" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Kodia" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Kodia</span></li><li><span class="sc-dwgyss jgoxJL cell-content">SUV</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Red</span></li><li><span class="sc-dwgyss jgoxJL cell-content">1c25a1fe-43be-461b-9960-677d063039c2</span></li></ul></div></article></div><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="1"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Superb</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Black</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_pvly48ela" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Superb" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Superb</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Seda</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Black</span></li><li><span class="sc-dwgyss jgoxJL cell-content">1d95527b-8625-480e-968c-f1f18a03676b</span></li></ul></div></article></div><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="2"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Slavia</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Red</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_eowwpx2jv" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Slavia" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Slavia</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Sedan</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Red</span></li><li><span class="sc-dwgyss jgoxJL cell-content">730150f3-1d79-4d8f-8705-37c4a0c1082e</span></li></ul></div></article></div><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="3"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Octavia</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Blue</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_pul2sp8vu" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Octavia" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Octavia</span></li><li><span class="sc-dwgyss jgoxJL cell-content">SUV</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Blue</span></li><li><span class="sc-dwgyss jgoxJL cell-content">a207de37-08ab-4713-b6c5-9105a7c24145</span></li></ul></div></article></div><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="4"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Kushaq</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Grey</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_tout3gs6r" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Kushaq" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Kushaq</span></li><li><span class="sc-dwgyss jgoxJL cell-content">SUV</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Grey</span></li><li><span class="sc-dwgyss jgoxJL cell-content">d470b095-d497-482d-8010-00bc381d75a4</span></li></ul></div></article></div></div></div></div></div><input class="sc-jftIyx QkTco bottom" type="text" aria-hidden="true"></div></div>`;
+    galleryElement.innerHTML = `<div class="sc-dYwHd kWBYTH rs-wrapper" style="--col-display-35959765: unset; --col-width-35959765: undefinedpx; --col-left-35959765: 0px; --col-order-35959765: 66; --col-display-1767309340: unset; --col-width-1767309340: undefinedpx; --col-left-1767309340: 0px; --col-order-1767309340: 67; --col-display-65290051: unset; --col-width-65290051: undefinedpx; --col-left-65290051: 0px; --col-order-65290051: 68; --col-display--974557166: unset; --col-width--974557166: undefinedpx; --col-left--974557166: 0px; --col-order--974557166: 69; --col-width--679626225: 32px; --col-left--679626225: 0px; --col-order--679626225: 131; --col-display--679626225: unset;"><div class="sc-LnnfE gElHPn rv-gallery" data-test-id="Gallery"><div class="rv-gallery-header"><div class="sc-bmjVWh fQdTIz"><div data-testid=":list-toolbar:" class="sc-eYWdgt sc-eCApGN jFXPJ"><div class="sc-eCApGN jSYNRl sc-eqLlAf crOphF"><div class="sc-eCApGN iMYeSJ"><div class="sc-eCApGN fGEyeG sc-dprmOr fwxzUF"><h3 data-testid=":list-toolbar:heading" class="sc-hKFyIo biwFTG sc-enTpxJ cvLBAg">List of Used Cars</h3><span data-testid=":list-toolbar:count" class="sc-hKFyIo cAQnkh sc-vMGFs gLcAwe">5 results</span></div><div class="sc-eCApGN fGEyeG"><button data-testid=":list-toolbar:search-button" as="button" type="button" aria-label="Search" class="sc-bqGHjH bZirob" data-popover-target=""><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="m18.513 17.115 4.754 4.755.047.14c.14.232.186.42.186.512 0 .653-.326.979-.979.979-.186 0-.42-.094-.652-.28l-4.708-4.708c-1.77 1.445-3.776 2.144-6.06 2.144-2.656 0-4.894-.932-6.758-2.797-1.91-1.91-2.843-4.148-2.843-6.758 0-2.61.932-4.848 2.843-6.759C6.253 2.433 8.491 1.5 11.102 1.5c2.61 0 4.847.932 6.758 2.843 1.865 1.864 2.797 4.102 2.797 6.759 0 2.237-.7 4.242-2.144 6.013Zm-7.365 1.631c2.098 0 3.869-.746 5.36-2.237 1.492-1.492 2.238-3.263 2.238-5.36 0-2.099-.746-3.916-2.237-5.408-1.492-1.492-3.263-2.237-5.36-2.237-2.099 0-3.916.745-5.408 2.237-1.492 1.492-2.237 3.31-2.237 5.407 0 2.098.745 3.869 2.237 5.36 1.492 1.492 3.31 2.238 5.407 2.238Z"></path></svg></button><button data-testid=":list-toolbar:create-new" as="button" type="button" aria-label="Add" class="sc-bqGHjH bZirob" data-popover-target=""><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="m13.43 2.5-.001 9.069H22.5v1.861h-9.071v9.07h-1.906l-.001-9.07H2.5v-1.86l9.022-.001V2.5h1.907Z"></path></svg></button><button class="sc-bqGHjH bZirob sc-hLiUrC" as="button" type="button" aria-label="Enter fullscreen" data-popover-target=""><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M11.492 13.5a1 1 0 0 1 0 1.414L6.406 20H10.5a1 1 0 0 1 0 2H3v-7.5a1 1 0 0 1 2 0v4.078l5.078-5.078a1 1 0 0 1 1.414 0ZM22 3v7.5a1 1 0 0 1-2 0V6.32l-5.179 5.18a1 1 0 0 1-1.414-1.414L18.492 5H14.5a1 1 0 0 1 0-2H22Z"></path></svg></button><button data-testid=":menu-button:" id="_0xg1ojqk8" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - List of Used Cars" class="sc-dPaNSN jnYJHI sc-bqGHjH bZirob" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></div></div></div></div></div><div data-test-id="externalFilters" class="sc-kLIdoS Gwrfp"></div><input class="sc-jftIyx QkTco top" type="text" aria-hidden="true"><div class="sc-cYftwm XIXxf"><div data-total-records="5" class="sc-dYlJdf hRdTqi pContainer"><div class="bContainer" style="height: 338px; --above-loader-top: -80px; --below-loader-top: 338px;"><div class="${containerName} short-height row-container" role="rowgroup" style="width: var(--container-width); top: 0px; --container-width: 1140px;"><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="0"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Kodia</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Red</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_7pwvndydg" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Kodia" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Kodia</span></li><li><span class="sc-dwgyss jgoxJL cell-content">SUV</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Red</span></li><li><span class="sc-dwgyss jgoxJL cell-content">1c25a1fe-43be-461b-9960-677d063039c2</span></li></ul></div></article></div><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="1"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Superb</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Black</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_pvly48ela" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Superb" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Superb</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Seda</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Black</span></li><li><span class="sc-dwgyss jgoxJL cell-content">1d95527b-8625-480e-968c-f1f18a03676b</span></li></ul></div></article></div><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="2"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Slavia</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Red</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_eowwpx2jv" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Slavia" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Slavia</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Sedan</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Red</span></li><li><span class="sc-dwgyss jgoxJL cell-content">730150f3-1d79-4d8f-8705-37c4a0c1082e</span></li></ul></div></article></div><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="3"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Octavia</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Blue</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_pul2sp8vu" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Octavia" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Octavia</span></li><li><span class="sc-dwgyss jgoxJL cell-content">SUV</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Blue</span></li><li><span class="sc-dwgyss jgoxJL cell-content">a207de37-08ab-4713-b6c5-9105a7c24145</span></li></ul></div></article></div><div data-key="" class="sc-jjtVRN hMaPCw tile" data-index="4"><article role="none" class="sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu"><header class="sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader"><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Kushaq</span></h4><h4 class="sc-hKFyIo himqoU sc-hGEFff fDSzKM"><span class="sc-dwgyss jgoxJL cell-content">Grey</span></h4><div class="cardRowAction"><span class="sc-dwgyss jgoxJL cell-content"><div class="sc-eaLsfz eUweZY row-action-menu"><button data-testid=":menu-button:" tabindex="-1" id="_tout3gs6r" aria-expanded="false" aria-haspopup="menu" type="button" aria-label="Actions - Kushaq" class="sc-dPaNSN jnYJHI sc-bqGHjH nmaHv" data-popover-target=""><span class="sc-bBjRzc cykSxr sc-eCApGN fGEyeG"><svg role="presentation" viewBox="0 0 25 25" class="sc-crzoUp jgPGeN"><path d="M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z"></path></svg></span></button></div></span></div></header><div class="sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent"><ul class="sc-bJqgKO fuTtkF"><li><span class="sc-dwgyss jgoxJL cell-content">Kushaq</span></li><li><span class="sc-dwgyss jgoxJL cell-content">SUV</span></li><li><span class="sc-dwgyss jgoxJL cell-content">Grey</span></li><li><span class="sc-dwgyss jgoxJL cell-content">d470b095-d497-482d-8010-00bc381d75a4</span></li></ul></div></article></div></div></div></div></div><input class="sc-jftIyx QkTco bottom" type="text" aria-hidden="true"></div></div>`;
     document.body.appendChild(galleryElement);
     return galleryElement.querySelector(`.${containerName}`);
 }

package/lib/Core/Views/Gallery/_tests_/Samples/GalleryA11ySample.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GalleryA11ySample.js","sourceRoot":"","sources":["../../../../../../Core/Views/Gallery/_tests_/Samples/GalleryA11ySample.ts"],"names":[],"mappings":"AAAA,iBAAiB;AACjB,MAAM,CAAC,OAAO,UAAU,0BAA0B,CAAC,aAAqB;IACtE,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAmB,CAAC;IAEvE,cAAc,CAAC,SAAS,GAAG,ktIAAktI,aAAa,uxUAAuxU,CAAC;IAElhd,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;IAE1C,OAAO,cAAc,CAAC,aAAa,CAAC,IAAI,aAAa,EAAE,CAAC,CAAC;AAC3D,CAAC","sourcesContent":["// cspell:disable\nexport default function createGalleryA11yContainer(containerName: string) {\n const galleryElement = document.createElement('div') as HTMLDivElement;\n\n galleryElement.innerHTML = `<div class=\"sc-dYwHd kWBYTH rs-wrapper\" style=\"--col-display-35959765: unset; --col-width-35959765: undefinedpx; --col-left-35959765: 0px; --col-order-35959765: 66; --col-display-1767309340: unset; --col-width-1767309340: undefinedpx; --col-left-1767309340: 0px; --col-order-1767309340: 67; --col-display-65290051: unset; --col-width-65290051: undefinedpx; --col-left-65290051: 0px; --col-order-65290051: 68; --col-display--974557166: unset; --col-width--974557166: undefinedpx; --col-left--974557166: 0px; --col-order--974557166: 69; --col-width--679626225: 32px; --col-left--679626225: 0px; --col-order--679626225: 131; --col-display--679626225: unset;\"><div class=\"sc-LnnfE gElHPn rv-gallery\" data-test-id=\"Gallery\"><div class=\"rv-gallery-header\"><div class=\"sc-bmjVWh fQdTIz\"><div data-testid=\":list-toolbar:\" class=\"sc-eYWdgt sc-eCApGN jFXPJ\"><div class=\"sc-eCApGN jSYNRl sc-eqLlAf crOphF\"><div class=\"sc-eCApGN iMYeSJ\"><div class=\"sc-eCApGN fGEyeG sc-dprmOr fwxzUF\"><h3 data-testid=\":list-toolbar:heading\" class=\"sc-hKFyIo biwFTG sc-enTpxJ cvLBAg\">List of Used Cars</h3><span data-testid=\":list-toolbar:count\" class=\"sc-hKFyIo cAQnkh sc-vMGFs gLcAwe\">5 results</span></div><div class=\"sc-eCApGN fGEyeG\"><button data-testid=\":list-toolbar:search-button\" as=\"button\" type=\"button\" aria-label=\"Search\" class=\"sc-bqGHjH bZirob\" data-popover-target=\"\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"m18.513 17.115 4.754 4.755.047.14c.14.232.186.42.186.512 0 .653-.326.979-.979.979-.186 0-.42-.094-.652-.28l-4.708-4.708c-1.77 1.445-3.776 2.144-6.06 2.144-2.656 0-4.894-.932-6.758-2.797-1.91-1.91-2.843-4.148-2.843-6.758 0-2.61.932-4.848 2.843-6.759C6.253 2.433 8.491 1.5 11.102 1.5c2.61 0 4.847.932 6.758 2.843 1.865 1.864 2.797 4.102 2.797 6.759 0 2.237-.7 4.242-2.144 6.013Zm-7.365 1.631c2.098 0 3.869-.746 5.36-2.237 1.492-1.492 2.238-3.263 2.238-5.36 0-2.099-.746-3.916-2.237-5.408-1.492-1.492-3.263-2.237-5.36-2.237-2.099 0-3.916.745-5.408 2.237-1.492 1.492-2.237 3.31-2.237 5.407 0 2.098.745 3.869 2.237 5.36 1.492 1.492 3.31 2.238 5.407 2.238Z\"></path></svg></button><button data-testid=\":list-toolbar:create-new\" as=\"button\" type=\"button\" aria-label=\"Add\" class=\"sc-bqGHjH bZirob\" data-popover-target=\"\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"m13.43 2.5-.001 9.069H22.5v1.861h-9.071v9.07h-1.906l-.001-9.07H2.5v-1.86l9.022-.001V2.5h1.907Z\"></path></svg></button><button class=\"sc-bqGHjH bZirob sc-hLiUrC\" as=\"button\" type=\"button\" aria-label=\"Enter fullscreen\" data-popover-target=\"\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M11.492 13.5a1 1 0 0 1 0 1.414L6.406 20H10.5a1 1 0 0 1 0 2H3v-7.5a1 1 0 0 1 2 0v4.078l5.078-5.078a1 1 0 0 1 1.414 0ZM22 3v7.5a1 1 0 0 1-2 0V6.32l-5.179 5.18a1 1 0 0 1-1.414-1.414L18.492 5H14.5a1 1 0 0 1 0-2H22Z\"></path></svg></button><button data-testid=\":menu-button:\" id=\"_0xg1ojqk8\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - List of Used Cars\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH bZirob\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></div></div></div></div></div><div data-test-id=\"externalFilters\" class=\"sc-kLIdoS Gwrfp\"></div><input class=\"sc-jftIyx QkTco top\" type=\"text\" aria-hidden=\"true\"><div class=\"sc-cYftwm XIXxf\"><div data-total-records=\"5\" class=\"sc-dYlJdf hRdTqi pContainer\"><div class=\"bContainer\" style=\"height: 338px; --above-loader-top: -80px; --below-loader-top: 338px;\"><div class=\"${containerName} card-item-grid-container short-height row-container\" role=\"rowgroup\" style=\"width: var(--container-width); top: 0px; --container-width: 1140px;\"><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"0\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Kodia</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Red</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_7pwvndydg\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Kodia\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Kodia</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">SUV</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Red</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">1c25a1fe-43be-461b-9960-677d063039c2</span></li></ul></div></article></div><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"1\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Superb</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Black</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_pvly48ela\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Superb\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Superb</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Seda</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Black</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">1d95527b-8625-480e-968c-f1f18a03676b</span></li></ul></div></article></div><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"2\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Slavia</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Red</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_eowwpx2jv\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Slavia\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Slavia</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Sedan</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Red</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">730150f3-1d79-4d8f-8705-37c4a0c1082e</span></li></ul></div></article></div><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"3\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Octavia</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Blue</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_pul2sp8vu\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Octavia\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Octavia</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">SUV</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Blue</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">a207de37-08ab-4713-b6c5-9105a7c24145</span></li></ul></div></article></div><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"4\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Kushaq</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Grey</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_tout3gs6r\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Kushaq\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Kushaq</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">SUV</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Grey</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">d470b095-d497-482d-8010-00bc381d75a4</span></li></ul></div></article></div></div></div></div></div><input class=\"sc-jftIyx QkTco bottom\" type=\"text\" aria-hidden=\"true\"></div></div>`;\n\n document.body.appendChild(galleryElement);\n\n return galleryElement.querySelector(`.${containerName}`);\n}\n"]}
1	+ {"version":3,"file":"GalleryA11ySample.js","sourceRoot":"","sources":["../../../../../../Core/Views/Gallery/_tests_/Samples/GalleryA11ySample.ts"],"names":[],"mappings":"AAAA,iBAAiB;AACjB,MAAM,CAAC,OAAO,UAAU,0BAA0B,CAAC,aAAqB;IACtE,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAmB,CAAC;IAEvE,cAAc,CAAC,SAAS,GAAG,ktIAAktI,aAAa,8vUAA8vU,CAAC;IAEz/c,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;IAE1C,OAAO,cAAc,CAAC,aAAa,CAAC,IAAI,aAAa,EAAE,CAAC,CAAC;AAC3D,CAAC","sourcesContent":["// cspell:disable\nexport default function createGalleryA11yContainer(containerName: string) {\n const galleryElement = document.createElement('div') as HTMLDivElement;\n\n galleryElement.innerHTML = `<div class=\"sc-dYwHd kWBYTH rs-wrapper\" style=\"--col-display-35959765: unset; --col-width-35959765: undefinedpx; --col-left-35959765: 0px; --col-order-35959765: 66; --col-display-1767309340: unset; --col-width-1767309340: undefinedpx; --col-left-1767309340: 0px; --col-order-1767309340: 67; --col-display-65290051: unset; --col-width-65290051: undefinedpx; --col-left-65290051: 0px; --col-order-65290051: 68; --col-display--974557166: unset; --col-width--974557166: undefinedpx; --col-left--974557166: 0px; --col-order--974557166: 69; --col-width--679626225: 32px; --col-left--679626225: 0px; --col-order--679626225: 131; --col-display--679626225: unset;\"><div class=\"sc-LnnfE gElHPn rv-gallery\" data-test-id=\"Gallery\"><div class=\"rv-gallery-header\"><div class=\"sc-bmjVWh fQdTIz\"><div data-testid=\":list-toolbar:\" class=\"sc-eYWdgt sc-eCApGN jFXPJ\"><div class=\"sc-eCApGN jSYNRl sc-eqLlAf crOphF\"><div class=\"sc-eCApGN iMYeSJ\"><div class=\"sc-eCApGN fGEyeG sc-dprmOr fwxzUF\"><h3 data-testid=\":list-toolbar:heading\" class=\"sc-hKFyIo biwFTG sc-enTpxJ cvLBAg\">List of Used Cars</h3><span data-testid=\":list-toolbar:count\" class=\"sc-hKFyIo cAQnkh sc-vMGFs gLcAwe\">5 results</span></div><div class=\"sc-eCApGN fGEyeG\"><button data-testid=\":list-toolbar:search-button\" as=\"button\" type=\"button\" aria-label=\"Search\" class=\"sc-bqGHjH bZirob\" data-popover-target=\"\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"m18.513 17.115 4.754 4.755.047.14c.14.232.186.42.186.512 0 .653-.326.979-.979.979-.186 0-.42-.094-.652-.28l-4.708-4.708c-1.77 1.445-3.776 2.144-6.06 2.144-2.656 0-4.894-.932-6.758-2.797-1.91-1.91-2.843-4.148-2.843-6.758 0-2.61.932-4.848 2.843-6.759C6.253 2.433 8.491 1.5 11.102 1.5c2.61 0 4.847.932 6.758 2.843 1.865 1.864 2.797 4.102 2.797 6.759 0 2.237-.7 4.242-2.144 6.013Zm-7.365 1.631c2.098 0 3.869-.746 5.36-2.237 1.492-1.492 2.238-3.263 2.238-5.36 0-2.099-.746-3.916-2.237-5.408-1.492-1.492-3.263-2.237-5.36-2.237-2.099 0-3.916.745-5.408 2.237-1.492 1.492-2.237 3.31-2.237 5.407 0 2.098.745 3.869 2.237 5.36 1.492 1.492 3.31 2.238 5.407 2.238Z\"></path></svg></button><button data-testid=\":list-toolbar:create-new\" as=\"button\" type=\"button\" aria-label=\"Add\" class=\"sc-bqGHjH bZirob\" data-popover-target=\"\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"m13.43 2.5-.001 9.069H22.5v1.861h-9.071v9.07h-1.906l-.001-9.07H2.5v-1.86l9.022-.001V2.5h1.907Z\"></path></svg></button><button class=\"sc-bqGHjH bZirob sc-hLiUrC\" as=\"button\" type=\"button\" aria-label=\"Enter fullscreen\" data-popover-target=\"\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M11.492 13.5a1 1 0 0 1 0 1.414L6.406 20H10.5a1 1 0 0 1 0 2H3v-7.5a1 1 0 0 1 2 0v4.078l5.078-5.078a1 1 0 0 1 1.414 0ZM22 3v7.5a1 1 0 0 1-2 0V6.32l-5.179 5.18a1 1 0 0 1-1.414-1.414L18.492 5H14.5a1 1 0 0 1 0-2H22Z\"></path></svg></button><button data-testid=\":menu-button:\" id=\"_0xg1ojqk8\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - List of Used Cars\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH bZirob\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></div></div></div></div></div><div data-test-id=\"externalFilters\" class=\"sc-kLIdoS Gwrfp\"></div><input class=\"sc-jftIyx QkTco top\" type=\"text\" aria-hidden=\"true\"><div class=\"sc-cYftwm XIXxf\"><div data-total-records=\"5\" class=\"sc-dYlJdf hRdTqi pContainer\"><div class=\"bContainer\" style=\"height: 338px; --above-loader-top: -80px; --below-loader-top: 338px;\"><div class=\"${containerName} short-height row-container\" role=\"rowgroup\" style=\"width: var(--container-width); top: 0px; --container-width: 1140px;\"><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"0\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Kodia</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Red</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_7pwvndydg\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Kodia\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Kodia</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">SUV</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Red</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">1c25a1fe-43be-461b-9960-677d063039c2</span></li></ul></div></article></div><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"1\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Superb</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Black</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_pvly48ela\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Superb\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Superb</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Seda</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Black</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">1d95527b-8625-480e-968c-f1f18a03676b</span></li></ul></div></article></div><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"2\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Slavia</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Red</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_eowwpx2jv\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Slavia\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Slavia</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Sedan</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Red</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">730150f3-1d79-4d8f-8705-37c4a0c1082e</span></li></ul></div></article></div><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"3\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Octavia</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Blue</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_pul2sp8vu\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Octavia\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Octavia</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">SUV</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Blue</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">a207de37-08ab-4713-b6c5-9105a7c24145</span></li></ul></div></article></div><div data-key=\"\" class=\"sc-jjtVRN hMaPCw tile\" data-index=\"4\"><article role=\"none\" class=\"sc-hGwdws kgCqDP sc-eCApGN fBSTzb sc-dGzUNk QCwsu\"><header class=\"sc-dwxYxt eGAfOL sc-eCApGN hOizZD sc-fKTzBO iUJquN cardHeader\"><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Kushaq</span></h4><h4 class=\"sc-hKFyIo himqoU sc-hGEFff fDSzKM\"><span class=\"sc-dwgyss jgoxJL cell-content\">Grey</span></h4><div class=\"cardRowAction\"><span class=\"sc-dwgyss jgoxJL cell-content\"><div class=\"sc-eaLsfz eUweZY row-action-menu\"><button data-testid=\":menu-button:\" tabindex=\"-1\" id=\"_tout3gs6r\" aria-expanded=\"false\" aria-haspopup=\"menu\" type=\"button\" aria-label=\"Actions - Kushaq\" class=\"sc-dPaNSN jnYJHI sc-bqGHjH nmaHv\" data-popover-target=\"\"><span class=\"sc-bBjRzc cykSxr sc-eCApGN fGEyeG\"><svg role=\"presentation\" viewBox=\"0 0 25 25\" class=\"sc-crzoUp jgPGeN\"><path d=\"M13.914 6.41c-.39.39-.877.586-1.414.586a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.537.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.876.586 1.413 0 .536-.195 1.023-.586 1.413Zm0 7.503c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585A1.95 1.95 0 0 1 10.5 12.5c0-.536.195-1.022.586-1.413.39-.389.877-.584 1.414-.584a1.95 1.95 0 0 1 1.414.584c.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Zm0 7.502c-.39.39-.877.585-1.414.585a1.953 1.953 0 0 1-1.414-.585 1.95 1.95 0 0 1-.586-1.413c0-.536.195-1.023.586-1.413.39-.39.877-.585 1.414-.585.537 0 1.024.195 1.414.585.39.39.586.877.586 1.413 0 .537-.195 1.023-.586 1.413Z\"></path></svg></span></button></div></span></div></header><div class=\"sc-EhVdS jdaToo sc-eCApGN fBSTzb sc-jDOthB iVzQtp cardContent\"><ul class=\"sc-bJqgKO fuTtkF\"><li><span class=\"sc-dwgyss jgoxJL cell-content\">Kushaq</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">SUV</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">Grey</span></li><li><span class=\"sc-dwgyss jgoxJL cell-content\">d470b095-d497-482d-8010-00bc381d75a4</span></li></ul></div></article></div></div></div></div></div><input class=\"sc-jftIyx QkTco bottom\" type=\"text\" aria-hidden=\"true\"></div></div>`;\n\n document.body.appendChild(galleryElement);\n\n return galleryElement.querySelector(`.${containerName}`);\n}\n"]}

package/lib/Core/Views/Gallery/index.d.ts CHANGED Viewed

@@ -1,13 +1,9 @@
-export default Gallery;
+import { type RsCoreTypes } from 'pega-repeating-structures-core';
 declare function Gallery({ view }: {
-    view: any;
+    view: RsCoreTypes.View;
 }): import("react/jsx-runtime").JSX.Element;
 declare namespace Gallery {
-    namespace propTypes {
-        let view: PropTypes.Validator<{
-            [x: string]: any;
-        }>;
-    }
+    var displayName: string;
 }
-import PropTypes from 'prop-types';
+export default Gallery;
 //# sourceMappingURL=index.d.ts.map

package/lib/Core/Views/Gallery/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/index.~~jsx~~"],"names":[],"mappings":";~~AA6BA;;4CA0GC;;;;;;;;sBAvIqB~~,~~YAAY~~"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAa7E,iBAAS,OAAO,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,WAAW,CAAC,IAAI,CAAA;CAAE,2CA2DpD;kBA3DQ,OAAO;;;AA+DhB,eAAe,OAAO,CAAC"}

package/lib/Core/Views/Gallery/index.js CHANGED Viewed

@@ -1,76 +1,30 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import PropTypes from 'prop-types';
-import { useCallback, useRef, useEffect } from 'react';
-import styled from 'styled-components';
+import { useMemo } from 'react';
+import { FieldType } from 'pega-repeating-structures-core';
 import { useFullscreenContext } from '@pega/cosmos-react-core';
-import LoadingIndicator from '../../Components/LoadingIndicator';
-import GalleryFooter from '../../Components/Footer';
 import Virtualiser from '../Table/VirtualizeWrapper';
 import Toolbar from '../../Components/Toolbar';
 import RenderView from '../../Components/RenderingEngine/RenderView';
 import { EXTERNAL_FILTERS } from '../../constants';
-import { resolveViewComponent } from '../../Components/RenderingEngine/ComponentResolverFactory';
-import RepeatingStructureA11y from '../../Components/A11y/RepeatingStructureA11y';
-import useTranslate from '../../Hooks/useTranslate';
 import RsCardWrapper from '../RsCardWrapper';
-import { generateRSDataContainerHeightStyles } from '../../Utils/styles';
-import EmptyContainer from '../../Components/DefaultComponents/EmptyContainer';
-import { isFilterApplied } from '../../Utils';
-import StyledGalleryContainer from './StyledGalleryContainer';
-import ItemWrapper from './ItemWrapper';
-import GalleryA11y from './GalleryA11y';
-const StyledGVirtualizeContainer = styled.div `
-  ${() => generateRSDataContainerHeightStyles()};
-  position: relative;
-`;
+import GalleryCard from './Components/GalleryCard';
+import StyledGalleryContainer, { StyledVirtualizeContainer } from './StyledGalleryContainer';
+import { isInlineImage } from './utils';
 function Gallery({ view }) {
     const isFullscreen = !!useFullscreenContext()?.[0];
-    const { rows, columns = [], meta, renderFactory, getContext, state: { filterExpression, searchText, externalState } = {}, domContainer, hasNoRecords } = view;
-    const { cardHeader, secondaryText, externalFilters } = meta;
-    const headerColumn = columns.find(({ field }) => field.name === cardHeader?.name);
-    const secondaryTextColumn = columns.find(({ field }) => field.name === secondaryText?.name);
-    const filteredColumns = columns.filter(c => c.field.name !== 'RowActionMenu');
-    const rowActionMenuColumn = columns.find(c => c.field.name === 'RowActionMenu');
-    const containerRef = useRef(null);
-    const [translate] = useTranslate();
-    const a11yRef = useRef(new GalleryA11y({
-        topFocusRef: '.top',
-        bottomFocusRef: '.bottom',
-        focusElementSelector: '.tile',
-        parentElementSelector: '.grid-container'
-    },
-    // TODO: consider additional focusbales: input elements, checkbox, radios, etc...
-    [`button[aria-label^=${translate('Actions')}]`], {
-        TAB: 9,
-        LEFT: 37,
-        UP: 38,
-        RIGHT: 39,
-        DOWN: 40
-    }, null));
-    useEffect(() => {
-        a11yRef.current.setContainer(containerRef.current);
-        return () => {
-            containerRef.current = null;
-            a11yRef.current = null;
-        };
-    }, [a11yRef, containerRef]);
-    const keyDownHandler = useCallback(e => {
-        a11yRef.current.a11yHandler(e);
-    }, [a11yRef]);
-    return (_jsx(RsCardWrapper, { children: _jsxs(StyledGalleryContainer, { className: 'rv-gallery', "data-test-id": 'Gallery', view: view, isFullscreen: isFullscreen, children: [_jsx(Toolbar, { view: view }), _jsx(RenderView, { view: view, type: EXTERNAL_FILTERS }), _jsx(RepeatingStructureA11y, { view: view, a11yRef: a11yRef, children: _jsxs(StyledGVirtualizeContainer, { ref: containerRef, onKeyDown: keyDownHandler, className: 'container', children: [_jsx(Virtualiser, { id: 'rootVirtualiser', rowContainerClass: 'grid-container card-item-grid-container', view: view, children: rows &&
-                                    rows.map(row => (_jsx(ItemWrapper, { ...row.getUIProps(), children: resolveViewComponent('CardItemRenderer', renderFactory, {
-                                            row,
-                                            headerColumn,
-                                            secondaryTextColumn,
-                                            filteredColumns,
-                                            rowActionMenuColumn,
-                                            ...getContext()
-                                        }) }, row.reactKey))) }), _jsx(GalleryFooter, { view: view }), _jsx(LoadingIndicator, { view: view, show: !rows || !!view.isLoading }), domContainer && hasNoRecords && (_jsx(EmptyContainer, { message: isFilterApplied({ filterExpression, searchText, externalState }, externalFilters)
-                                    ? translate('No records found')
-                                    : translate('No records') }))] }) })] }) }));
+    const { columns = [], meta, rows } = view;
+    const { galleryConfig: { heroImage, header } = {} } = meta;
+    const headerColumn = useMemo(() => (header?.field ? columns.find(col => col.field.name === header.field) : undefined), [header, columns]);
+    const actionColumn = useMemo(() => columns.find(col => col.field.name === 'RowActionMenu'), [columns]);
+    const visibleColumns = useMemo(() => {
+        const cols = [...columns].filter(col => !col.hidden && col.field.type !== FieldType.ACTION_FIELD_TYPE);
+        cols.sort((colA, colB) => (colA.order ?? 0) - (colB.order ?? 0));
+        return cols;
+    }, [columns]);
+    return (_jsx(RsCardWrapper, { children: _jsxs(StyledGalleryContainer, { "data-test-id": 'gallery', "data-testid": 'gallery', view: view, isFullscreen: isFullscreen, isInlineImage: isInlineImage(heroImage), children: [_jsx(Toolbar, { view: view }), _jsx(RenderView, { view: view, type: EXTERNAL_FILTERS }), _jsx(StyledVirtualizeContainer, { className: 'container', children: _jsx(Virtualiser, { id: 'rootVirtualiser', rowContainerClass: 'grid-container', view: view, bufferMultiplier: 0.6, children: rows?.length
+                            ? rows.map(row => (_jsx(GalleryCard, { meta: meta, row: row, visibleColumns: visibleColumns, headerColumn: headerColumn, actionColumn: actionColumn }, row.reactKey)))
+                            : [] }) })] }) }));
 }
-Gallery.propTypes = {
-    view: PropTypes.objectOf(PropTypes.any).isRequired
-};
+Gallery.displayName = 'Gallery';
 export default Gallery;
 //# sourceMappingURL=index.js.map

package/lib/Core/Views/Gallery/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/index.~~jsx~~"],"names":[],"mappings":";AAAA,OAAO,~~SAAS~~,~~MAAM,YAAY,CAAC;AACnC,~~OAAO,EAAE,~~WAAW,EAAE,~~MAAM,~~EAAE,SAAS,EAAE,MAAM,~~OAAO,CAAC;~~AACvD~~,OAAO,~~MAAM~~,MAAM,~~mBAAmB~~,CAAC;~~AAEvC~~,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAE/D,OAAO,~~gBAAgB,MAAM,mCAAmC,CAAC;AACjE,OAAO,aAAa,MAAM,yBAAyB,CAAC;AACpD,OAAO,~~WAAW,MAAM,4BAA4B,CAAC;AACrD,OAAO,OAAO,MAAM,0BAA0B,CAAC;AAC/C,OAAO,UAAU,MAAM,6CAA6C,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,~~EAAE~~,~~oBAAoB,EAAE,~~MAAM,~~2DAA2D~~,CAAC;~~AACjG~~,OAAO,~~sBAAsB~~,MAAM,~~8CAA8C,CAAC;AAClF,OAAO,YAAY,MAAM,~~0BAA0B,CAAC;~~AACpD~~,OAAO,~~aAAa~~,~~MAAM~~,~~kBAAkB,CAAC;AAC7C,OAAO,~~EAAE,~~mCAAmC~~,EAAE,MAAM,~~oBAAoB~~,CAAC;~~AACzE~~,OAAO,~~cAAc,MAAM,mDAAmD,CAAC;AAC/E,OAAO,~~EAAE,~~eAAe~~,EAAE,MAAM,~~aAAa~~,CAAC;~~AAE9C,OAAO,sBAAsB,MAAM,0BAA0B,CAAC;AAC9D,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,WAAW,MAAM,eAAe,CAAC;~~AAExC,~~MAAM,0BAA0B,GAAG,MAAM,CAAC,GAAG,CAAA;IACzC,GAAG,EAAE,CAAC,mCAAmC,EAAE;;CAE9C,CAAC;AAEF,~~SAAS,OAAO,CAAC,EAAE,IAAI,~~EAAE~~;~~IACvB~~,MAAM,YAAY,GAAG,CAAC,CAAC,oBAAoB,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;~~IACnD~~,MAAM,~~EACJ~~,~~IAAI,EACJ,~~OAAO,GAAG,EAAE,~~EACZ~~,IAAI,~~EACJ~~,~~aAAa~~,~~EACb,UAAU,EACV,KAAK,~~EAAE,~~EAAE~~,~~gBAAgB~~,~~EAAE~~,~~UAAU~~,EAAE,aAAa,EAAE,~~GAAG,~~EAAE,~~EAC3D~~,~~YAAY~~,~~EACZ,YAAY,EACb,GAAG,IAAI,CAAC;IACT,~~MAAM,EAAE,~~UAAU~~,EAAE,~~aAAa,~~EAAE,~~eAAe,EAAE,~~GAAG,IAAI,CAAC;~~IAC5D~~,MAAM,YAAY,GAAG,OAAO,~~CAAC~~,~~IAAI~~,CAAC,CAAC,~~EAAE~~,~~KAAK,~~EAAE,~~EAAE,EAAE,CAAC,~~KAAK,CAAC,~~IAAI,KAAK,UAAU,EAAE,IAAI,~~CAAC,CAAC~~;IAClF~~,~~MAAM,mBAAmB,GAAG,~~OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,~~KAAK~~,~~EAAE~~,~~EAAE,EAAE,~~CAAC,KAAK,CAAC,IAAI,KAAK,~~aAAa,EAAE,IAAI,CAAC,CAAC;IAC5F,~~MAAM,~~eAAe,GAAG,OAAO,~~CAAC,~~MAAM~~,CAAC,CAAC,CAAC,~~EAAE,~~CAAC,~~CAAC~~,CAAC,~~KAAK~~,CAAC,~~IAAI~~,~~KAAK~~,~~eAAe~~,CAAC,CAAC;~~IAC9E~~,MAAM,~~mBAAmB~~,GAAG,OAAO,CAAC,~~IAAI~~,CAAC,CAAC,CAAC,EAAE,CAAC,~~CAAC~~,CAAC,KAAK,CAAC,IAAI,KAAK,eAAe,CAAC,CAAC~~;IAChF~~,~~MAAM~~,~~YAAY,GAAG,MAAM,~~CAAC,~~IAAI~~,CAAC~~,CAAC~~;~~IAClC~~,MAAM,~~CAAC~~,~~SAAS~~,CAAC,GAAG,~~YAAY,~~EAAE~~,CAAC~~;~~IACnC~~,MAAM,~~OAAO~~,GAAG,~~MAAM~~,~~CACpB~~,~~IAAI~~,~~WAAW~~,~~CACb;QACE~~,~~WAAW,EAAE,~~MAAM~~;QACnB~~,~~cAAc~~,~~EAAE~~,~~SAAS;QACzB~~,~~oBAAoB,~~EAAE,~~OAAO;QAC7B~~,~~qBAAqB,EAAE,iBAAiB;KACzC;IACD,iFAAiF;IACjF,~~CAAC,~~sBAAsB~~,~~SAAS,~~CAAC,~~SAAS~~,~~CAAC~~,GAAG,CAAC,~~EAC/C;QACE~~,~~GAAG,EAAE,~~CAAC~~;QACN~~,IAAI,~~EAAE~~,~~EAAE;QACR~~,~~EAAE~~,~~EAAE~~,~~EAAE;QACN~~,~~KAAK,EAAE,EAAE~~;~~QACT~~,IAAI,~~EAAE~~,~~EAAE;KACT,EACD,~~IAAI,~~CACL~~,~~CACF,~~CAAC~~;IAEF~~,~~SAAS~~,~~CAAC~~,~~GAAG~~,EAAE~~;QACb~~,~~OAAO~~,CAAC,~~OAAO,~~CAAC,~~YAAY~~,CAAC,~~YAAY~~,~~CAAC~~,~~OAAO,~~CAAC,CAAC~~;QACnD~~,~~OAAO,~~GAAG,~~EAAE;YACV,YAAY,~~CAAC,~~OAAO,GAAG,~~IAAI,CAAC~~;YAC5B~~,~~OAAO~~,~~CAAC,OAAO,GAAG,~~IAAI,CAAC~~;QACzB~~,CAAC,CAAC~~;IACJ~~,CAAC,~~EAAE,CAAC,~~OAAO,~~EAAE~~,~~YAAY,~~CAAC~~,CAAC,CAAC~~;~~IAE5B~~,~~MAAM,cAAc,GAAG,WAAW,CAChC,~~CAAC,~~CAAC,~~EAAE~~;QACF~~,~~OAAO,~~CAAC,OAAO,CAAC,~~WAAW,~~CAAC,CAAC~~,CAAC,CAAC~~;~~IACjC~~,~~CAAC,EACD,CAAC,~~OAAO,~~CAAC,CACV,CAAC;IAEF,OAAO,~~CACL,KAAC,aAAa,cACZ,MAAC,sBAAsB,~~IACrB~~,SAAS,~~EAAC~~,~~YAAY,kBACT,~~SAAS,~~EACtB~~,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,YAAY,~~aAE1B~~,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,GAAI,EACvB,KAAC,UAAU,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,gBAAgB,GAAI,EAClD,KAAC,~~sBAAsB~~,IAAC,~~IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,YAClD,MAAC,0BAA0B,IACzB,GAAG,EAAE,YAAY,EACjB,~~SAAS,~~EAAE,cAAc,EACzB,SAAS,~~EAAC,WAAW,~~aAErB~~,KAAC,WAAW,IACV,EAAE,EAAC,iBAAiB,EACpB,iBAAiB,EAAC,~~yCAAyC~~,~~EAC3D~~,IAAI,EAAE,IAAI,~~YAET~~,~~IAAI;oCACH~~,~~IAAI~~,~~CAAC,~~GAAG,~~CAAC~~,~~GAAG~~,~~CAAC,~~EAAE,CAAC,~~CACd,KAAC,WAAW,OAAwB,GAAG,~~CAAC,~~UAAU~~,~~EAAE,YACjD,oBAAoB,~~CAAC,~~kBAAkB,EAAE,aAAa,EAAE;4CACvD,~~GAAG~~;4CACH~~,~~YAAY;4CACZ,mBAAmB;4CACnB,eAAe;4CACf,mBAAmB;4CACnB,GAAG,UAAU,EAAE;yCAChB,~~CAAC,~~IARc,~~GAAG,CAAC,~~QAAQ~~,~~CAShB,CACf,~~CAAC,~~GACQ~~,~~EACd,~~KAAC,~~aAAa~~,~~IAAC~~,IAAI,EAAE,IAAI,~~GAAI~~,~~EAC7B~~,~~KAAC~~,~~gBAAgB~~,~~IAAC~~,~~IAAI~~,EAAE,~~IAAI~~,~~EAAE~~,~~IAAI~~,EAAE,~~CAAC,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,GAAI,EAChE,~~YAAY,~~IAAI~~,YAAY,~~IAAI,CAC/B,KAAC,cAAc,IACb,OAAO,EACL,eAAe,CAAC,~~EAAE,~~gBAAgB~~,~~EAAE~~,~~UAAU~~,~~EAAE,aAAa,EAAE,EAAE,eAAe,~~CAAC~~;oCAC/E~~,~~CAAC~~,~~CAAC~~,~~SAAS~~,CAAC~~,kBAAkB,CAAC~~;~~oCAC/B~~,CAAC,CAAC,~~SAAS~~,~~CAAC~~,~~YAAY~~,~~CAAC~~,~~GAE7B,CACH,IAC0B,GACN,IACF,~~GACX,CACjB,CAAC;AACJ,CAAC;AAED,OAAO,CAAC,~~SAAS~~,GAAG~~;IAClB~~,~~IAAI,EAAE,~~SAAS,CAAC~~,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU~~;~~CACnD~~,~~CAAC;AAEF,~~eAAe,OAAO,CAAC","sourcesContent":["import ~~PropTypes~~ from '~~prop-types~~';\nimport { ~~useCallback~~, ~~useRef,~~ ~~useEffect~~ } from '~~react';\nimport styled from 'styled~~-~~components~~';\n\nimport { useFullscreenContext } from '@pega/cosmos-react-core';\n\nimport ~~LoadingIndicator from '../../Components/LoadingIndicator';\nimport GalleryFooter from '../../Components/Footer';\nimport~~ Virtualiser from '../Table/VirtualizeWrapper';\nimport Toolbar from '../../Components/Toolbar';\nimport RenderView from '../../Components/RenderingEngine/RenderView';\nimport { EXTERNAL_FILTERS } from '../../constants';\nimport { resolveViewComponent } from '../../Components/RenderingEngine/ComponentResolverFactory';\nimport RepeatingStructureA11y from '../../Components/A11y/RepeatingStructureA11y';\nimport useTranslate from '../../Hooks/useTranslate';\nimport RsCardWrapper from '../RsCardWrapper';\nimport { ~~generateRSDataContainerHeightStyles }~~ from '~~../../Utils~~/~~styles~~';\nimport ~~EmptyContainer~~ ~~from '../../Components/DefaultComponents/EmptyContainer';\nimport~~ { ~~isFilterApplied~~ } from '~~../../Utils';\n\nimport StyledGalleryContainer from '~~./StyledGalleryContainer';\nimport ~~ItemWrapper~~ ~~from~~ ~~'./ItemWrapper';\nimport~~ ~~GalleryA11y~~ from './~~GalleryA11y~~';\n\~~nconst~~ ~~StyledGVirtualizeContainer = styled.div`\n $~~{() => ~~generateRSDataContainerHeightStyles()~~}~~;\n position~~: ~~relative;\n`;\n\nfunction Gallery(~~{ view }) {\n const isFullscreen = !!useFullscreenContext()?.[0];\n const {~~\n rows,\n~~ columns = []~~,\n meta,\n renderFactory,\n getContext,\n state: { filterExpression~~, ~~searchText~~, ~~externalState~~ } = ~~{},\n domContainer,\n hasNoRecords\n } =~~ view;\n const { ~~cardHeader,~~ ~~secondaryText~~, ~~externalFilters~~ } = meta;\n const headerColumn = ~~columns.find~~((~~{ field }~~) => field~~.name~~ ~~===~~ ~~cardHeader?.name);\n const secondaryTextColumn =~~ columns.find(({ ~~field })~~ => field.name === ~~secondaryText?.name~~)~~;\n const~~ ~~filteredColumns~~ = columns~~.filter(c => c.field.name !== 'RowActionMenu'~~);\n const ~~rowActionMenuColumn~~ = columns.find(c => c.field.name === 'RowActionMenu');\n ~~const containerRef = useRef(null~~);\n const ~~[translate]~~ = ~~useTranslate~~();\n const ~~a11yRef~~ = ~~useRef~~(\n ~~new GalleryA11y(\n~~ ~~{\n topFocusRef:~~ ~~'.top',\n bottomFocusRef:~~ '.~~bottom',\n focusElementSelector:~~ ~~'.tile',\n parentElementSelector:~~ '.~~grid-container'\n },\n //~~ ~~TODO:~~ ~~consider additional focusbales: input elements, checkbox, radios, etc...\n [`button[aria-label^=${translate('Actions')}]`],\n {~~\n ~~TAB: 9,\n LEFT: 37,\n UP: 38,\n RIGHT: 39,\n DOWN: 40\n },\n null\n~~ )~~\n )~~;\n~~\n useEffect~~(() => ~~{\n a11yRef.current.setContainer~~(~~containerRef~~.~~current);\n return~~ () => ~~{\n containerRef~~.~~current~~ = ~~null~~;\n ~~a11yRef.current~~ ~~= null~~;\n ~~};\n~~ }, [~~a11yRef, containerRef~~]);\n\n ~~const keyDownHandler = useCallback(\n e => {\n a11yRef.current.a11yHandler(e);\n },\n [a11yRef]\n );\n\n~~ return (\n <RsCardWrapper>\n <StyledGalleryContainer\n ~~className~~='~~rv-~~gallery'\n data-~~test-id~~='~~Gallery~~'\n view={view}\n isFullscreen={isFullscreen}\n >\n <Toolbar view={view} />\n <RenderView view={view} type={EXTERNAL_FILTERS} />\n <~~RepeatingStructureA11y~~ ~~view={view} a11yRef={a11yRef}>\n <StyledGVirtualizeContainer\n ref={containerRef}\n onKeyDown={keyDownHandler}\n~~ className='container'\n ~~>\n~~ <Virtualiser\n id='rootVirtualiser'\n rowContainerClass='grid-container ~~card-item-grid-container~~'\n view={view}\n >\n {rows ~~&&\n~~ rows.map(row => (\n <~~ItemWrapper~~ key={row.reactKey} ~~{...row.getUIProps()}>\~~n {~~resolveViewComponent('CardItemRenderer', renderFactory, {~~\n row,\n headerColumn,\n secondaryTextColumn,\n filteredColumns,\n rowActionMenuColumn,\n ...getContext()\n ~~})}\n </ItemWrapper>\n ))}\n </Virtualiser>\n <GalleryFooter view~~={~~view~~} ~~/>\~~n ~~<LoadingIndicator view~~={~~view~~} ~~show={!rows \|\| !!view.isLoading} />\n {domContainer && hasNoRecords && (~~\n ~~<EmptyContainer\n message~~={\n ~~isFilterApplied({ filterExpression, searchText, externalState }, externalFilters)\~~n ~~? translate('No records found'~~)\n : ~~translate('No records')\n~~ }\n ~~/>\n )}\n~~ </~~StyledGVirtualizeContainer~~>\n </~~RepeatingStructureA11y~~>\n </StyledGalleryContainer>\n </RsCardWrapper>\n );\n}\n\nGallery.~~propTypes~~ = ~~{\n view: PropTypes.objectOf(PropTypes.any).isRequired\n}~~;\n\nexport default Gallery;\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react';\n\nimport { FieldType, type RsCoreTypes } from 'pega-repeating-structures-core';\nimport { useFullscreenContext } from '@pega/cosmos-react-core';\n\nimport Virtualiser from '../Table/VirtualizeWrapper';\nimport Toolbar from '../../Components/Toolbar';\nimport RenderView from '../../Components/RenderingEngine/RenderView';\nimport { EXTERNAL_FILTERS } from '../../constants';\nimport RsCardWrapper from '../RsCardWrapper';\n\nimport GalleryCard from './Components/GalleryCard';\nimport StyledGalleryContainer, { StyledVirtualizeContainer } from './StyledGalleryContainer';\nimport { isInlineImage } from './utils';\n\nfunction Gallery({ view }: { view: RsCoreTypes.View }) {\n const isFullscreen = !!useFullscreenContext()?.[0];\n\n const { columns = [], meta, rows } = view;\n const { galleryConfig: { heroImage, header } = {} } = meta;\n\n const headerColumn = useMemo(\n () => (header?.field ? columns.find(col => col.field.name === header.field) : undefined),\n [header, columns]\n );\n\n const actionColumn = useMemo(\n () => columns.find(col => col.field.name === 'RowActionMenu'),\n [columns]\n );\n\n const visibleColumns = useMemo(() => {\n const cols = [...columns].filter(\n col => !col.hidden && col.field.type !== FieldType.ACTION_FIELD_TYPE\n );\n cols.sort((colA, colB) => (colA.order ?? 0) - (colB.order ?? 0));\n return cols;\n }, [columns]);\n\n return (\n <RsCardWrapper>\n <StyledGalleryContainer\n data-test-id='gallery'\n data-testid='gallery'\n view={view}\n isFullscreen={isFullscreen}\n isInlineImage={isInlineImage(heroImage)}\n >\n <Toolbar view={view} />\n <RenderView view={view} type={EXTERNAL_FILTERS} />\n <StyledVirtualizeContainer className='container'>\n <Virtualiser\n id='rootVirtualiser'\n rowContainerClass='grid-container'\n view={view}\n bufferMultiplier={0.6}\n >\n {rows?.length\n ? rows.map(row => (\n <GalleryCard\n key={row.reactKey}\n meta={meta}\n row={row}\n visibleColumns={visibleColumns}\n headerColumn={headerColumn}\n actionColumn={actionColumn}\n />\n ))\n : []}\n </Virtualiser>\n </StyledVirtualizeContainer>\n </StyledGalleryContainer>\n </RsCardWrapper>\n );\n}\n\nGallery.displayName = 'Gallery';\n\nexport default Gallery;\n"]}

package/lib/Core/Views/Gallery/utils.d.ts ADDED Viewed

@@ -0,0 +1,23 @@
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+import type { SelectionCardDisplayProps } from '@pega/cosmos-react-core';
+import type { GalleryCardProps } from './Gallery.types';
+/**
+ * Determines if the provided hero image should be displayed inline based on its placement.
+ *
+ * @param heroImage - The hero image object.
+ * @returns `true` if the image's placement is considered inline; otherwise, `false`.
+ */
+export declare function isInlineImage(heroImage?: RsCoreTypes.HeroImage): boolean;
+/**
+ * Generates the data required to display a card in the gallery view.
+ *
+ * @param props - The properties required to generate the card data.
+ * @param props.row - The data for the current row.
+ * @param props.visibleColumns - The columns that are visible in the gallery.
+ * @param props.meta - Metadata including gallery configuration.
+ * @param props.headerColumn - The column used for the card header.
+ * @param props.actionColumn - The column used for card actions.
+ * @returns An object containing the card's label, image, and fields to be displayed.
+ */
+export declare function getCardData({ row, visibleColumns, meta, headerColumn, actionColumn }: GalleryCardProps): Pick<SelectionCardDisplayProps, 'label' | 'image' | 'fields'>;
+//# sourceMappingURL=utils.d.ts.map

package/lib/Core/Views/Gallery/utils.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/utils.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAA6B,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAEpG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAmDxD;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,GAAG,OAAO,CAKxE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,cAAc,EACd,IAAI,EACJ,YAAY,EACZ,YAAY,EACb,EAAE,gBAAgB,GAAG,IAAI,CAAC,yBAAyB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,CAelF"}

package/lib/Core/Views/Gallery/utils.js ADDED Viewed

@@ -0,0 +1,73 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import GalleryFieldValue from './Components/GalleryFieldValue';
+import GalleryHeader from './Components/GalleryHeader';
+const GALLERY_IMAGE_PLACEMENT_MAP = {
+    left: 'inline-start',
+    right: 'inline-end',
+    top: 'block-start'
+};
+const INLINE_PLACEMENTS = ['left', 'right'];
+const DEFAULT_IMAGE_PLACEMENT = 'left';
+const DEFAULT_IMAGE_SIZE = 'flexible';
+/**
+ * Extracts image data from the provided metadata and row context.
+ *
+ * @param meta - The metadata object containing gallery configuration.
+ * @param row - The row object providing context and data values.
+ * @returns An object containing:
+ *   - `src`: The image source URL.
+ *   - `alt`: The alternative text for the image.
+ *   - `placement`: The placement of the image within the gallery.
+ *   - `size`: The size of the image.
+ */
+function getImageData(meta, row) {
+    const { galleryConfig: { heroImage: { source, altText, placement, size } = {} } = {} } = meta;
+    const rowData = row.getContext().getValue();
+    let altTextValue = '';
+    if (altText && 'field' in altText) {
+        altTextValue = altText.field in rowData ? String(rowData[altText.field]) : '';
+    }
+    else if (altText && 'value' in altText) {
+        altTextValue = altText.value;
+    }
+    const imageUrl = source?.field && source?.field in rowData ? String(rowData[source.field]) : '';
+    const imagePlacement = GALLERY_IMAGE_PLACEMENT_MAP[placement ?? DEFAULT_IMAGE_PLACEMENT];
+    const imageSize = size || DEFAULT_IMAGE_SIZE;
+    return { src: imageUrl, alt: altTextValue, placement: imagePlacement, size: imageSize };
+}
+/**
+ * Determines if the provided hero image should be displayed inline based on its placement.
+ *
+ * @param heroImage - The hero image object.
+ * @returns `true` if the image's placement is considered inline; otherwise, `false`.
+ */
+export function isInlineImage(heroImage) {
+    if (!heroImage?.source)
+        return false;
+    const placement = heroImage.placement ?? DEFAULT_IMAGE_PLACEMENT;
+    return INLINE_PLACEMENTS.includes(placement);
+}
+/**
+ * Generates the data required to display a card in the gallery view.
+ *
+ * @param props - The properties required to generate the card data.
+ * @param props.row - The data for the current row.
+ * @param props.visibleColumns - The columns that are visible in the gallery.
+ * @param props.meta - Metadata including gallery configuration.
+ * @param props.headerColumn - The column used for the card header.
+ * @param props.actionColumn - The column used for card actions.
+ * @returns An object containing the card's label, image, and fields to be displayed.
+ */
+export function getCardData({ row, visibleColumns, meta, headerColumn, actionColumn }) {
+    const { galleryConfig: { heroImage, showFieldLabels = true } = {} } = meta;
+    const fields = visibleColumns.map(col => ({
+        id: col.field.id,
+        ...(showFieldLabels && { name: col.field.label }),
+        value: _jsx(GalleryFieldValue, { column: col, row: row })
+    }));
+    const image = heroImage ? getImageData(meta, row) : undefined;
+    const label = _jsx(GalleryHeader, { headerColumn: headerColumn, actionColumn: actionColumn, row: row });
+    // @ts-expect-error it will be removed once SelectionCardDisplay supports ReactNode for label
+    return { fields, image, label };
+}
+//# sourceMappingURL=utils.js.map

package/lib/Core/Views/Gallery/utils.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/utils.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { ImagePlacement, ImageSize, SelectionCardDisplayProps } from '@pega/cosmos-react-core';\n\nimport type { GalleryCardProps } from './Gallery.types';\nimport GalleryFieldValue from './Components/GalleryFieldValue';\nimport GalleryHeader from './Components/GalleryHeader';\n\nconst GALLERY_IMAGE_PLACEMENT_MAP: Record<RsCoreTypes.HeroImagePlacement, ImagePlacement> = {\n left: 'inline-start',\n right: 'inline-end',\n top: 'block-start'\n} as const;\n\nconst INLINE_PLACEMENTS: RsCoreTypes.HeroImagePlacement[] = ['left', 'right'] as const;\nconst DEFAULT_IMAGE_PLACEMENT: RsCoreTypes.HeroImagePlacement = 'left';\nconst DEFAULT_IMAGE_SIZE: ImageSize = 'flexible';\n\n/**\n * Extracts image data from the provided metadata and row context.\n *\n * @param meta - The metadata object containing gallery configuration.\n * @param row - The row object providing context and data values.\n * @returns An object containing:\n * - `src`: The image source URL.\n * - `alt`: The alternative text for the image.\n * - `placement`: The placement of the image within the gallery.\n * - `size`: The size of the image.\n */\nfunction getImageData(\n meta: RsCoreTypes.Meta,\n row: RsCoreTypes.Row\n): {\n src: string;\n alt: string;\n placement: ImagePlacement;\n size: ImageSize;\n} {\n const { galleryConfig: { heroImage: { source, altText, placement, size } = {} } = {} } = meta;\n const rowData = row.getContext().getValue();\n\n let altTextValue = '';\n if (altText && 'field' in altText) {\n altTextValue = altText.field in rowData ? String(rowData[altText.field]) : '';\n } else if (altText && 'value' in altText) {\n altTextValue = altText.value;\n }\n\n const imageUrl = source?.field && source?.field in rowData ? String(rowData[source.field]) : '';\n const imagePlacement = GALLERY_IMAGE_PLACEMENT_MAP[placement ?? DEFAULT_IMAGE_PLACEMENT];\n const imageSize = size || DEFAULT_IMAGE_SIZE;\n\n return { src: imageUrl, alt: altTextValue, placement: imagePlacement, size: imageSize };\n}\n\n/**\n * Determines if the provided hero image should be displayed inline based on its placement.\n *\n * @param heroImage - The hero image object.\n * @returns `true` if the image's placement is considered inline; otherwise, `false`.\n */\nexport function isInlineImage(heroImage?: RsCoreTypes.HeroImage): boolean {\n if (!heroImage?.source) return false;\n\n const placement = heroImage.placement ?? DEFAULT_IMAGE_PLACEMENT;\n return INLINE_PLACEMENTS.includes(placement);\n}\n\n/**\n * Generates the data required to display a card in the gallery view.\n *\n * @param props - The properties required to generate the card data.\n * @param props.row - The data for the current row.\n * @param props.visibleColumns - The columns that are visible in the gallery.\n * @param props.meta - Metadata including gallery configuration.\n * @param props.headerColumn - The column used for the card header.\n * @param props.actionColumn - The column used for card actions.\n * @returns An object containing the card's label, image, and fields to be displayed.\n */\nexport function getCardData({\n row,\n visibleColumns,\n meta,\n headerColumn,\n actionColumn\n}: GalleryCardProps): Pick<SelectionCardDisplayProps, 'label' | 'image' | 'fields'> {\n const { galleryConfig: { heroImage, showFieldLabels = true } = {} } = meta;\n\n const fields = visibleColumns.map(col => ({\n id: col.field.id,\n ...(showFieldLabels && { name: col.field.label }),\n value: <GalleryFieldValue column={col} row={row} />\n }));\n\n const image = heroImage ? getImageData(meta, row) : undefined;\n\n const label = <GalleryHeader headerColumn={headerColumn} actionColumn={actionColumn} row={row} />;\n\n // @ts-expect-error it will be removed once SelectionCardDisplay supports ReactNode for label\n return { fields, image, label };\n}\n"]}

package/lib/Core/Views/Table/StyledTableContainer.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StyledTableContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":";~~AAwBA~~,~~oNAi5BG~~"}
1	+ {"version":3,"file":"StyledTableContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":";AAyBA,oNA8gCG"}