@pega/lists-react 9.0.0-build.9.9 → 9.0.0

package/lib/Core/Utils/index.js

@@ -76,7 +76,9 @@ export const getFieldIcon = (type) => {
         case FieldType.DATE:
         case FieldType.TIME:
             return 'dataviz-datetime-field';
+        // TODO: FieldType.OBJECT should have its own icon to represent it as a complex type instead of custom.
         case FieldType.CUSTOM:
+        case FieldType.OBJECT:
             return 'distribute-item-center';
         case FieldType.URL:
         case FieldType.TEXT:
@@ -91,6 +93,26 @@ export function isAccessibleValue(value) {
 export const isRowReorderFieldEnabled = (meta) => {
     return meta.dragHandle || !!meta.rowReorderField;
 };
+export const hasColumnById = (columns, columnId) => {
+    return Boolean(columns?.some(column => column.field.id === columnId));
+};
+export const ACTION_COLUMN_TYPES = {
+    ROW_REORDER: 'RowReorder',
+    ROW_DELETE: 'RowDeleteAction'
+};
+/**
+ * Resolves the frame-local `document` and `window` from the owning frame of the
+ * given element ref. Use instead of the globals `document`/`window` whenever the
+ * component may be rendered inside an iframe — e.g. when attaching document-level
+ * event listeners, dispatching synthetic events, or querying the DOM.
+ */
+export function getBrowserContext(element) {
+    const ownerDocument = element?.ownerDocument ?? document;
+    return {
+        document: ownerDocument,
+        window: ownerDocument.defaultView ?? window
+    };
+}
 /**
  * Indicates if any of the filters (filterExpression, searchText, externalFilters) is applied on the view.
  * @param view View object

package/lib/Core/Utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../Core/Utils/index.ts"],"names":[],"mappings":"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","sourcesContent":["import fastDeepEqual from 'fast-deep-equal/es6';\n\nimport type { IconName } from '@pega/cosmos-react-core';\nimport { FieldType, type RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport type { RSTypes } from '../../types';\n\n/**\n * Performs a deep comparison between two values to determine if they are equivalent.\n * A wrapper on fast-deep-equal\n */\nexport function deepEqual(x: any, y: any) {\n  return fastDeepEqual(x, y);\n}\n\nexport function deepCopy<T>(oldObj: T): T {\n  let newObj: any = oldObj;\n\n  if (oldObj && typeof oldObj === 'object') {\n    newObj = Array.isArray(oldObj) ? [] : ({} as T);\n\n    Object.keys(oldObj).forEach(key => {\n      if (Object.hasOwn(oldObj, key)) {\n        newObj[key] = deepCopy(oldObj[key as keyof T]);\n      }\n    });\n  }\n\n  return newObj;\n}\n\nexport function debounced(delay: number, fn: (...arg: any) => void) {\n  let timerId: any;\n  return function inner(...args: any) {\n    if (timerId) {\n      clearTimeout(timerId);\n    }\n    timerId = setTimeout(() => {\n      fn(...args);\n      timerId = null;\n    }, delay);\n  };\n}\n\nexport function isFunction(obj: any) {\n  return typeof obj === 'function';\n}\n\nexport function isArray(obj: any) {\n  return Array.isArray(obj);\n}\n\nexport function isObject(obj: any) {\n  return obj === Object(obj) && !(isFunction(obj) || isArray(obj));\n}\n\n// Concat CSS classes\nexport function createClassName(...args: any) {\n  const classes = args.reduce((arr: [], arg: any) => {\n    let val;\n\n    if (isArray(arg)) {\n      val = createClassName(...arg);\n    } else if (typeof arg === 'string' && /\\S/.test(arg)) {\n      val = arg.replace(/ \\s+/g, ' ').trim();\n    } else if (isFunction(arg)) {\n      val = createClassName(arg());\n    } else if (isObject(arg)) {\n      val = Object.keys(arg).filter(key => !!arg[key] && key);\n    }\n\n    return val ? arr.concat(val) : arr;\n  }, []);\n\n  return classes.length ? classes.join(' ') : undefined;\n}\n\nexport function keyFrom(...args: (string | number | null | undefined)[]): string {\n  return args.map(val => `${val}`).join('-');\n}\n\nexport const allowToggle = (visibleColumns: string | any[]) => {\n  return !(visibleColumns.length === 1);\n};\n\nexport const getFieldIcon = (type: RSTypes.FieldDef['type']): IconName => {\n  switch (type) {\n    case FieldType.NUMBER:\n      return 'dataviz-numeric-field';\n    case FieldType.BOOLEAN:\n      return 'circle-mixed-left';\n    case FieldType.DATE_TIME:\n    case FieldType.DATE:\n    case FieldType.TIME:\n      return 'dataviz-datetime-field';\n    case FieldType.CUSTOM:\n      return 'distribute-item-center';\n    case FieldType.URL:\n    case FieldType.TEXT:\n    default:\n      return 'dataviz-string-field';\n  }\n};\n\nexport function isAccessibleValue(value: any) {\n  return value !== null && value !== undefined && value !== '––';\n}\n\n// TODO: temporary method, till meta.dragHandle is completely removed.\nexport const isRowReorderFieldEnabled = (meta: RSTypes.Meta): boolean => {\n  return meta.dragHandle || !!meta.rowReorderField;\n};\n\n/**\n * Indicates if any of the filters (filterExpression, searchText, externalFilters) is applied on the view.\n * @param view View object\n * @returns true if any filter is applied, false otherwise.\n */\nexport const isFilterApplied = (\n  {\n    filterExpression,\n    searchText,\n    externalState\n  }: {\n    filterExpression: RsCoreTypes.View['state']['filterExpression'];\n    searchText: RsCoreTypes.View['state']['searchText'];\n    externalState: RsCoreTypes.View['state']['externalState'];\n  },\n  externalFilters: RsCoreTypes.Meta['externalFilters']\n): boolean => {\n  const isExternalFiltersExist =\n    externalFilters &&\n    externalState?.[externalFilters] &&\n    Object.keys(externalState[externalFilters]).length > 0;\n\n  return Boolean(filterExpression || searchText || isExternalFiltersExist);\n};\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../Core/Utils/index.ts"],"names":[],"mappings":"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","sourcesContent":["import fastDeepEqual from 'fast-deep-equal/es6';\n\nimport type { IconName } from '@pega/cosmos-react-core';\nimport { FieldType, type RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport type { RSTypes } from '../../types';\n\n/**\n * Performs a deep comparison between two values to determine if they are equivalent.\n * A wrapper on fast-deep-equal\n */\nexport function deepEqual(x: any, y: any) {\n  return fastDeepEqual(x, y);\n}\n\nexport function deepCopy<T>(oldObj: T): T {\n  let newObj: any = oldObj;\n\n  if (oldObj && typeof oldObj === 'object') {\n    newObj = Array.isArray(oldObj) ? [] : ({} as T);\n\n    Object.keys(oldObj).forEach(key => {\n      if (Object.hasOwn(oldObj, key)) {\n        newObj[key] = deepCopy(oldObj[key as keyof T]);\n      }\n    });\n  }\n\n  return newObj;\n}\n\nexport function debounced(delay: number, fn: (...arg: any) => void) {\n  let timerId: any;\n  return function inner(...args: any) {\n    if (timerId) {\n      clearTimeout(timerId);\n    }\n    timerId = setTimeout(() => {\n      fn(...args);\n      timerId = null;\n    }, delay);\n  };\n}\n\nexport function isFunction(obj: any) {\n  return typeof obj === 'function';\n}\n\nexport function isArray(obj: any) {\n  return Array.isArray(obj);\n}\n\nexport function isObject(obj: any) {\n  return obj === Object(obj) && !(isFunction(obj) || isArray(obj));\n}\n\n// Concat CSS classes\nexport function createClassName(...args: any) {\n  const classes = args.reduce((arr: [], arg: any) => {\n    let val;\n\n    if (isArray(arg)) {\n      val = createClassName(...arg);\n    } else if (typeof arg === 'string' && /\\S/.test(arg)) {\n      val = arg.replace(/ \\s+/g, ' ').trim();\n    } else if (isFunction(arg)) {\n      val = createClassName(arg());\n    } else if (isObject(arg)) {\n      val = Object.keys(arg).filter(key => !!arg[key] && key);\n    }\n\n    return val ? arr.concat(val) : arr;\n  }, []);\n\n  return classes.length ? classes.join(' ') : undefined;\n}\n\nexport function keyFrom(...args: (string | number | null | undefined)[]): string {\n  return args.map(val => `${val}`).join('-');\n}\n\nexport const allowToggle = (visibleColumns: string | any[]) => {\n  return !(visibleColumns.length === 1);\n};\n\nexport const getFieldIcon = (type: RSTypes.FieldDef['type']): IconName => {\n  switch (type) {\n    case FieldType.NUMBER:\n      return 'dataviz-numeric-field';\n    case FieldType.BOOLEAN:\n      return 'circle-mixed-left';\n    case FieldType.DATE_TIME:\n    case FieldType.DATE:\n    case FieldType.TIME:\n      return 'dataviz-datetime-field';\n    // TODO: FieldType.OBJECT should have its own icon to represent it as a complex type instead of custom.\n    case FieldType.CUSTOM:\n    case FieldType.OBJECT:\n      return 'distribute-item-center';\n    case FieldType.URL:\n    case FieldType.TEXT:\n    default:\n      return 'dataviz-string-field';\n  }\n};\n\nexport function isAccessibleValue(value: any) {\n  return value !== null && value !== undefined && value !== '––';\n}\n\n// TODO: temporary method, till meta.dragHandle is completely removed.\nexport const isRowReorderFieldEnabled = (meta: RSTypes.Meta): boolean => {\n  return meta.dragHandle || !!meta.rowReorderField;\n};\n\nexport const hasColumnById = (columns: RsCoreTypes.View['columns'], columnId: string): boolean => {\n  return Boolean(columns?.some(column => column.field.id === columnId));\n};\n\nexport const ACTION_COLUMN_TYPES = {\n  ROW_REORDER: 'RowReorder',\n  ROW_DELETE: 'RowDeleteAction'\n} as const;\n\n/**\n * Resolves the frame-local `document` and `window` from the owning frame of the\n * given element ref. Use instead of the globals `document`/`window` whenever the\n * component may be rendered inside an iframe — e.g. when attaching document-level\n * event listeners, dispatching synthetic events, or querying the DOM.\n */\nexport function getBrowserContext(element: Element | null): {\n  document: Document;\n  window: Window & typeof globalThis;\n} {\n  const ownerDocument = element?.ownerDocument ?? document;\n  return {\n    document: ownerDocument,\n    window: ownerDocument.defaultView ?? window\n  };\n}\n\n/**\n * Indicates if any of the filters (filterExpression, searchText, externalFilters) is applied on the view.\n * @param view View object\n * @returns true if any filter is applied, false otherwise.\n */\nexport const isFilterApplied = (\n  {\n    filterExpression,\n    searchText,\n    externalState\n  }: {\n    filterExpression: RsCoreTypes.View['state']['filterExpression'];\n    searchText: RsCoreTypes.View['state']['searchText'];\n    externalState: RsCoreTypes.View['state']['externalState'];\n  },\n  externalFilters: RsCoreTypes.Meta['externalFilters']\n): boolean => {\n  const isExternalFiltersExist =\n    externalFilters &&\n    externalState?.[externalFilters] &&\n    Object.keys(externalState[externalFilters]).length > 0;\n\n  return Boolean(filterExpression || searchText || isExternalFiltersExist);\n};\n"]}

package/lib/Core/Utils/styles.d.ts

@@ -2,6 +2,6 @@ import type { RsCoreTypes } from 'pega-repeating-structures-core';
 export declare const generateRSHeightStyles: ({ view, isFullscreen }: {
     view: RsCoreTypes.View;
     isFullscreen: boolean;
-}) => import("styled-components").FlattenSimpleInterpolation;
-export declare const generateRSDataContainerHeightStyles: () => import("styled-components").FlattenSimpleInterpolation;
+}) => import("styled-components").RuleSet<object>;
+export declare const generateRSDataContainerHeightStyles: () => import("styled-components").RuleSet<object>;
 //# sourceMappingURL=styles.d.ts.map

package/lib/Core/Utils/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../Core/Utils/styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAgElE,eAAO,MAAM,sBAAsB,GAAI,wBAGpC;IACD,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;CACvB,2DAUA,CAAC;AAGF,eAAO,MAAM,mCAAmC,8DAM/C,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../Core/Utils/styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAgElE,eAAO,MAAM,sBAAsB,GAAI,wBAGpC;IACD,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;CACvB,gDAUA,CAAC;AAGF,eAAO,MAAM,mCAAmC,mDAM/C,CAAC"}

package/lib/Core/Views/Gallery/Components/GalleryCard.d.ts

@@ -0,0 +1,4 @@
+import type { GalleryCardProps } from '../Gallery.types';
+declare const GalleryCard: import("react").MemoExoticComponent<({ headerColumn, row, meta, visibleColumns }: GalleryCardProps) => import("react/jsx-runtime").JSX.Element>;
+export default GalleryCard;
+//# sourceMappingURL=GalleryCard.d.ts.map

package/lib/Core/Views/Gallery/Components/GalleryCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryCard.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryCard.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAIzD,QAAA,MAAM,WAAW,oFAAsD,gBAAgB,6CA2CrF,CAAC;AAEH,eAAe,WAAW,CAAC"}

package/lib/Core/Views/Gallery/Components/GalleryCard.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import { SelectionCardDisplay } from '@pega/cosmos-react-core';
+import { getCardData, getCardUIProps } from '../utils';
+import useRowActions from '../hooks/useRowActions';
+const GalleryCard = memo(({ headerColumn, row, meta, visibleColumns }) => {
+    const { label, image, footer, fields, 'aria-label': ariaLabel } = getCardData({
+        row,
+        visibleColumns,
+        meta,
+        headerColumn
+    });
+    const uiProps = getCardUIProps({ row });
+    const fetchActionsCb = useRowActions({ row, meta });
+    const { onCardClick } = meta.galleryConfig ?? {};
+    const rowData = onCardClick ? row.getContext().getValue() : undefined;
+    return (_jsx(SelectionCardDisplay, { "aria-label": ariaLabel, label: label, headingTag: 'h3', image: image, fields: fields, "data-gallery-card": true, actions: fetchActionsCb, ...uiProps, footer: footer, ...(onCardClick &&
+            rowData && {
+            onClick: () => onCardClick(rowData),
+            onKeyDown: (e) => {
+                if (e.key === 'Enter' || e.key === ' ') {
+                    e.preventDefault();
+                    onCardClick(rowData);
+                }
+            }
+        }) }));
+});
+export default GalleryCard;
+//# sourceMappingURL=GalleryCard.js.map

package/lib/Core/Views/Gallery/Components/GalleryCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryCard.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAG7B,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAG/D,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,aAAa,MAAM,wBAAwB,CAAC;AAEnD,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC,EAAE,YAAY,EAAE,GAAG,EAAE,IAAI,EAAE,cAAc,EAAoB,EAAE,EAAE;IACzF,MAAM,EACJ,KAAK,EACL,KAAK,EACL,MAAM,EACN,MAAM,EACN,YAAY,EAAE,SAAS,EACxB,GAAG,WAAW,CAAC;QACd,GAAG;QACH,cAAc;QACd,IAAI;QACJ,YAAY;KACb,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,cAAc,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IACxC,MAAM,cAAc,GAAG,aAAa,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC;IACpD,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC;IAEjD,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,UAAU,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IAEtE,OAAO,CACL,KAAC,oBAAoB,kBACP,SAAS,EACrB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAC,IAAI,EACf,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,6BAEd,OAAO,EAAE,cAAc,KACnB,OAAO,EACX,MAAM,EAAE,MAAM,KACV,CAAC,WAAW;YACd,OAAO,IAAI;YACT,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,CAAC;YACnC,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE;gBAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;oBACvC,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,WAAW,CAAC,OAAO,CAAC,CAAC;gBACvB,CAAC;YACH,CAAC;SACF,CAAC,GACJ,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC","sourcesContent":["import { memo } from 'react';\nimport type { KeyboardEvent } from 'react';\n\nimport { SelectionCardDisplay } from '@pega/cosmos-react-core';\n\nimport type { GalleryCardProps } from '../Gallery.types';\nimport { getCardData, getCardUIProps } from '../utils';\nimport useRowActions from '../hooks/useRowActions';\n\nconst GalleryCard = memo(({ headerColumn, row, meta, visibleColumns }: GalleryCardProps) => {\n  const {\n    label,\n    image,\n    footer,\n    fields,\n    'aria-label': ariaLabel\n  } = getCardData({\n    row,\n    visibleColumns,\n    meta,\n    headerColumn\n  });\n\n  const uiProps = getCardUIProps({ row });\n  const fetchActionsCb = useRowActions({ row, meta });\n  const { onCardClick } = meta.galleryConfig ?? {};\n\n  const rowData = onCardClick ? row.getContext().getValue() : undefined;\n\n  return (\n    <SelectionCardDisplay\n      aria-label={ariaLabel}\n      label={label}\n      headingTag='h3'\n      image={image}\n      fields={fields}\n      data-gallery-card\n      actions={fetchActionsCb}\n      {...uiProps}\n      footer={footer}\n      {...(onCardClick &&\n        rowData && {\n          onClick: () => onCardClick(rowData),\n          onKeyDown: (e: KeyboardEvent) => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault();\n              onCardClick(rowData);\n            }\n          }\n        })}\n    />\n  );\n});\n\nexport default GalleryCard;\n"]}

package/lib/Core/Views/Gallery/Components/GalleryCheckboxCard.d.ts

@@ -0,0 +1,8 @@
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+import type { GalleryCardProps } from '../Gallery.types';
+interface GalleryCheckboxCardProps extends GalleryCardProps {
+    selectionColumn: RsCoreTypes.Column;
+}
+declare const GalleryCheckboxCard: import("react").MemoExoticComponent<({ headerColumn, selectionColumn, row, meta, visibleColumns }: GalleryCheckboxCardProps) => import("react/jsx-runtime").JSX.Element>;
+export default GalleryCheckboxCard;
+//# sourceMappingURL=GalleryCheckboxCard.d.ts.map

package/lib/Core/Views/Gallery/Components/GalleryCheckboxCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryCheckboxCard.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryCheckboxCard.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAGlE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAIzD,UAAU,wBAAyB,SAAQ,gBAAgB;IACzD,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC;CACrC;AAED,QAAA,MAAM,mBAAmB,qGACwC,wBAAwB,6CA6CxF,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/lib/Core/Views/Gallery/Components/GalleryCheckboxCard.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo, useCallback } from 'react';
+import { CheckboxCard } from '@pega/cosmos-react-core';
+import { getCardData, getCardUIProps } from '../utils';
+import useRowActions from '../hooks/useRowActions';
+const GalleryCheckboxCard = memo(({ headerColumn, selectionColumn, row, meta, visibleColumns }) => {
+    const { label, image, fields, 'aria-label': ariaLabel } = getCardData({
+        row,
+        visibleColumns,
+        meta,
+        headerColumn
+    });
+    const uiProps = getCardUIProps({ row });
+    const { selectRow, getContext } = row;
+    const disableSelectionOnLoad = selectionColumn
+        .getContext()
+        ?.getRsMeta()?.disableSelectionOnLoad;
+    // TODO: identify the usecase for column.disableSelection. Keeping it for now to keep the behavior in sync with RowSelectionColumn in table.
+    const disableSelection = selectionColumn.disableSelection ?? disableSelectionOnLoad;
+    const handleChange = useCallback((event) => selectRow(event.target.checked), [row, selectRow]);
+    const fetchActionsCb = useRowActions({ row, meta });
+    return (_jsx(CheckboxCard, { "aria-label": ariaLabel, label: label, headingTag: 'h3', image: image, fields: fields, "data-gallery-card": true, onChange: handleChange, checked: getContext()?.$selected, readOnly: disableSelection, ...uiProps, actions: fetchActionsCb }));
+});
+export default GalleryCheckboxCard;
+//# sourceMappingURL=GalleryCheckboxCard.js.map

package/lib/Core/Views/Gallery/Components/GalleryCheckboxCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryCheckboxCard.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryCheckboxCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAoB,MAAM,OAAO,CAAC;AAG5D,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAGvD,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,aAAa,MAAM,wBAAwB,CAAC;AAMnD,MAAM,mBAAmB,GAAG,IAAI,CAC9B,CAAC,EAAE,YAAY,EAAE,eAAe,EAAE,GAAG,EAAE,IAAI,EAAE,cAAc,EAA4B,EAAE,EAAE;IACzF,MAAM,EACJ,KAAK,EACL,KAAK,EACL,MAAM,EACN,YAAY,EAAE,SAAS,EACxB,GAAG,WAAW,CAAC;QACd,GAAG;QACH,cAAc;QACd,IAAI;QACJ,YAAY;KACb,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,cAAc,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IAExC,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,GAAG,CAAC;IACtC,MAAM,sBAAsB,GAAG,eAAe;SAC3C,UAAU,EAAE;QACb,EAAE,SAAS,EAAE,EAAE,sBAAsB,CAAC;IACxC,4IAA4I;IAC5I,MAAM,gBAAgB,GAAG,eAAe,CAAC,gBAAgB,IAAI,sBAAsB,CAAC;IAEpF,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,KAAoC,EAAE,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,EACzE,CAAC,GAAG,EAAE,SAAS,CAAC,CACjB,CAAC;IAEF,MAAM,cAAc,GAAG,aAAa,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC;IAEpD,OAAO,CACL,KAAC,YAAY,kBACC,SAAS,EACrB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAC,IAAI,EACf,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,6BAEd,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,UAAU,EAAE,EAAE,SAAS,EAChC,QAAQ,EAAE,gBAAgB,KACtB,OAAO,EACX,OAAO,EAAE,cAAc,GACvB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,mBAAmB,CAAC","sourcesContent":["import { memo, useCallback, type ChangeEvent } from 'react';\n\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport { CheckboxCard } from '@pega/cosmos-react-core';\n\nimport type { GalleryCardProps } from '../Gallery.types';\nimport { getCardData, getCardUIProps } from '../utils';\nimport useRowActions from '../hooks/useRowActions';\n\ninterface GalleryCheckboxCardProps extends GalleryCardProps {\n  selectionColumn: RsCoreTypes.Column;\n}\n\nconst GalleryCheckboxCard = memo(\n  ({ headerColumn, selectionColumn, row, meta, visibleColumns }: GalleryCheckboxCardProps) => {\n    const {\n      label,\n      image,\n      fields,\n      'aria-label': ariaLabel\n    } = getCardData({\n      row,\n      visibleColumns,\n      meta,\n      headerColumn\n    });\n\n    const uiProps = getCardUIProps({ row });\n\n    const { selectRow, getContext } = row;\n    const disableSelectionOnLoad = selectionColumn\n      .getContext()\n      ?.getRsMeta()?.disableSelectionOnLoad;\n    // TODO: identify the usecase for column.disableSelection. Keeping it for now to keep the behavior in sync with RowSelectionColumn in table.\n    const disableSelection = selectionColumn.disableSelection ?? disableSelectionOnLoad;\n\n    const handleChange = useCallback(\n      (event: ChangeEvent<HTMLInputElement>) => selectRow(event.target.checked),\n      [row, selectRow]\n    );\n\n    const fetchActionsCb = useRowActions({ row, meta });\n\n    return (\n      <CheckboxCard\n        aria-label={ariaLabel}\n        label={label}\n        headingTag='h3'\n        image={image}\n        fields={fields}\n        data-gallery-card\n        onChange={handleChange}\n        checked={getContext()?.$selected}\n        readOnly={disableSelection}\n        {...uiProps}\n        actions={fetchActionsCb}\n      />\n    );\n  }\n);\n\nexport default GalleryCheckboxCard;\n"]}

package/lib/Core/Views/Gallery/Components/GalleryFieldValue.d.ts

@@ -0,0 +1,8 @@
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+interface GalleryFieldValueProps {
+    column: RsCoreTypes.Column;
+    row: RsCoreTypes.Row;
+}
+declare function GalleryFieldValue({ column, row }: GalleryFieldValueProps): import("react/jsx-runtime").JSX.Element;
+export default GalleryFieldValue;
+//# sourceMappingURL=GalleryFieldValue.d.ts.map

package/lib/Core/Views/Gallery/Components/GalleryFieldValue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryFieldValue.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryFieldValue.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAIlE,UAAU,sBAAsB;IAC9B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC;IAC3B,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC;CACtB;AAED,iBAAS,iBAAiB,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,sBAAsB,2CAIjE;AAED,eAAe,iBAAiB,CAAC"}

package/lib/Core/Views/Gallery/Components/GalleryFieldValue.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import RenderingEngine from '../../../Components/RenderingEngine/RenderCell';
+function GalleryFieldValue({ column, row }) {
+    column.setExecutionContext(row);
+    return _jsx(RenderingEngine, { ...column.getRenderingEngineProps(), highlighter: true });
+}
+export default GalleryFieldValue;
+//# sourceMappingURL=GalleryFieldValue.js.map

package/lib/Core/Views/Gallery/Components/GalleryFieldValue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryFieldValue.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryFieldValue.tsx"],"names":[],"mappings":";AAEA,OAAO,eAAe,MAAM,gDAAgD,CAAC;AAO7E,SAAS,iBAAiB,CAAC,EAAE,MAAM,EAAE,GAAG,EAA0B;IAChE,MAAM,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC;IAEhC,OAAO,KAAC,eAAe,OAAK,MAAM,CAAC,uBAAuB,EAAE,EAAE,WAAW,SAAG,CAAC;AAC/E,CAAC;AAED,eAAe,iBAAiB,CAAC","sourcesContent":["import type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport RenderingEngine from '../../../Components/RenderingEngine/RenderCell';\n\ninterface GalleryFieldValueProps {\n  column: RsCoreTypes.Column;\n  row: RsCoreTypes.Row;\n}\n\nfunction GalleryFieldValue({ column, row }: GalleryFieldValueProps) {\n  column.setExecutionContext(row);\n\n  return <RenderingEngine {...column.getRenderingEngineProps()} highlighter />;\n}\n\nexport default GalleryFieldValue;\n"]}

package/lib/Core/Views/Gallery/Components/GalleryHeader.d.ts

@@ -0,0 +1,8 @@
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+type GalleryHeaderProps = {
+    headerColumn?: RsCoreTypes.Column;
+    row: RsCoreTypes.Row;
+};
+declare function GalleryHeader({ headerColumn, row }: GalleryHeaderProps): import("react/jsx-runtime").JSX.Element | null;
+export default GalleryHeader;
+//# sourceMappingURL=GalleryHeader.d.ts.map

package/lib/Core/Views/Gallery/Components/GalleryHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryHeader.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAIlE,KAAK,kBAAkB,GAAG;IACxB,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC;IAClC,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC;CACtB,CAAC;AAMF,iBAAS,aAAa,CAAC,EAAE,YAAY,EAAE,GAAG,EAAE,EAAE,kBAAkB,kDAY/D;AAED,eAAe,aAAa,CAAC"}

package/lib/Core/Views/Gallery/Components/GalleryHeader.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import styled from 'styled-components';
+import RenderingEngine from '../../../Components/RenderingEngine/RenderCell';
+const StyledHeaderContainer = styled.div `
+  word-break: break-word;
+`;
+function GalleryHeader({ headerColumn, row }) {
+    if (!headerColumn) {
+        return null;
+    }
+    headerColumn?.setExecutionContext(row);
+    return (_jsx(StyledHeaderContainer, { children: _jsx(RenderingEngine, { ...headerColumn.getRenderingEngineProps() }) }));
+}
+export default GalleryHeader;
+//# sourceMappingURL=GalleryHeader.js.map

package/lib/Core/Views/Gallery/Components/GalleryHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryHeader.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAIvC,OAAO,eAAe,MAAM,gDAAgD,CAAC;AAO7E,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEvC,CAAC;AAEF,SAAS,aAAa,CAAC,EAAE,YAAY,EAAE,GAAG,EAAsB;IAC9D,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,YAAY,EAAE,mBAAmB,CAAC,GAAG,CAAC,CAAC;IAEvC,OAAO,CACL,KAAC,qBAAqB,cACpB,KAAC,eAAe,OAAK,YAAY,CAAC,uBAAuB,EAAE,GAAI,GACzC,CACzB,CAAC;AACJ,CAAC;AAED,eAAe,aAAa,CAAC","sourcesContent":["import styled from 'styled-components';\n\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport RenderingEngine from '../../../Components/RenderingEngine/RenderCell';\n\ntype GalleryHeaderProps = {\n  headerColumn?: RsCoreTypes.Column;\n  row: RsCoreTypes.Row;\n};\n\nconst StyledHeaderContainer = styled.div`\n  word-break: break-word;\n`;\n\nfunction GalleryHeader({ headerColumn, row }: GalleryHeaderProps) {\n  if (!headerColumn) {\n    return null;\n  }\n\n  headerColumn?.setExecutionContext(row);\n\n  return (\n    <StyledHeaderContainer>\n      <RenderingEngine {...headerColumn.getRenderingEngineProps()} />\n    </StyledHeaderContainer>\n  );\n}\n\nexport default GalleryHeader;\n"]}

package/lib/Core/Views/Gallery/Gallery.types.d.ts

@@ -0,0 +1,8 @@
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+export interface GalleryCardProps {
+    headerColumn?: RsCoreTypes.Column;
+    row: RsCoreTypes.Row;
+    meta: RsCoreTypes.Meta;
+    visibleColumns: RsCoreTypes.Column[];
+}
+//# sourceMappingURL=Gallery.types.d.ts.map

package/lib/Core/Views/Gallery/Gallery.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Gallery.types.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/Gallery.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAElE,MAAM,WAAW,gBAAgB;IAC/B,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC;IAClC,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC;IACrB,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;IACvB,cAAc,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;CACtC"}

package/lib/Core/Views/Gallery/Gallery.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Gallery.types.js.map

package/lib/Core/Views/Gallery/Gallery.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Gallery.types.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/Gallery.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nexport interface GalleryCardProps {\n  headerColumn?: RsCoreTypes.Column;\n  row: RsCoreTypes.Row;\n  meta: RsCoreTypes.Meta;\n  visibleColumns: RsCoreTypes.Column[];\n}\n"]}

package/lib/Core/Views/Gallery/GalleryA11y.d.ts

@@ -1,13 +1,15 @@
 import { BaseA11y } from 'pega-repeating-structures-core';
+import type { useLiveLog } from '@pega/cosmos-react-core';
 export type Selectors = {
     focusElementSelector: string;
-    parentElementSelector?: string;
+    belowLoader: string;
 };
+type AnnounceMethod = ReturnType<typeof useLiveLog>['announceAssertive'];
 declare class GalleryA11y extends BaseA11y {
-    constructor(selectors: Selectors, focusableSelectors: string[], container: HTMLElement, customKeys?: Record<string, number>);
-    doesCardContainFocusableElement(element: HTMLElement): boolean;
-    galleryContainerEventHandlers(event: KeyboardEvent, currentCol: HTMLElement): void;
-    a11yHandler(event: KeyboardEvent): void;
+    #private;
+    constructor(selectors: Selectors, focusableSelectors: string[], container: HTMLElement, announceAssertive: AnnounceMethod, announcePolite: AnnounceMethod, translate: (key: string) => string);
+    onFocusHandler(event?: Event): void;
+    itemsLoadedCallback(): void;
 }
 export default GalleryA11y;
 //# sourceMappingURL=GalleryA11y.d.ts.map

package/lib/Core/Views/Gallery/GalleryA11y.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryA11y.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryA11y.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,MAAM,MAAM,SAAS,GAAG;IACtB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAQF,cAAM,WAAY,SAAQ,QAAQ;gBAE9B,SAAS,EAAE,SAAS,EACpB,kBAAkB,EAAE,MAAM,EAAE,EAC5B,SAAS,EAAE,WAAW,EACtB,UAAU,GAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAM;IAKzC,+BAA+B,CAAC,OAAO,EAAE,WAAW;IAMpD,6BAA6B,CAAC,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,WAAW;IA6BlE,WAAW,CAAC,KAAK,EAAE,aAAa;CAe1C;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"GalleryA11y.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryA11y.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAI1D,MAAM,MAAM,SAAS,GAAG;IACtB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC,mBAAmB,CAAC,CAAC;AAEzE,cAAM,WAAY,SAAQ,QAAQ;;gBAI9B,SAAS,EAAE,SAAS,EACpB,kBAAkB,EAAE,MAAM,EAAE,EAC5B,SAAS,EAAE,WAAW,EACtB,iBAAiB,EAAE,cAAc,EACjC,cAAc,EAAE,cAAc,EAC9B,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM;IAY3B,cAAc,CAAC,KAAK,CAAC,EAAE,KAAK;IAIrC,mBAAmB;CAGpB;AAED,eAAe,WAAW,CAAC"}

package/lib/Core/Views/Gallery/GalleryA11y.js

@@ -1,59 +1,16 @@
 import { BaseA11y } from 'pega-repeating-structures-core';
-function gainFocus(element) {
-    if (!element)
-        return;
-    element.tabIndex = 0;
-    element.focus();
-}
+import createLoadingAnnouncementBehavior from '../../a11y/loadingAnnouncementBehavior';
 class GalleryA11y extends BaseA11y {
-    constructor(selectors, focusableSelectors, container, customKeys = {}) {
-        super(selectors, focusableSelectors, customKeys, container);
-    }
-    doesCardContainFocusableElement(element) {
-        const colItem = element.closest(this.selectors.focusElementSelector);
-        if (!colItem)
-            return false;
-        return element.matches(this.focusableSelectors.join(','));
+    #loadingAnnouncement;
+    constructor(selectors, focusableSelectors, container, announceAssertive, announcePolite, translate) {
+        super(selectors, focusableSelectors, {}, container);
+        this.#loadingAnnouncement = createLoadingAnnouncementBehavior(selectors, container, announceAssertive, announcePolite, translate);
     }
-    galleryContainerEventHandlers(event, currentCol) {
-        const { keyCode, shiftKey } = event;
-        if (this.stopEventHandler(event)) {
-            return;
-        }
-        let nextItem;
-        const sortedColumns = this.getSortedColumns(currentCol.closest(this.selectors.parentElementSelector));
-        if (keyCode === this.keys.UP || keyCode === this.keys.LEFT) {
-            nextItem = sortedColumns[sortedColumns.indexOf(currentCol) - 1];
-        }
-        else if (keyCode === this.keys.RIGHT || keyCode === this.keys.DOWN) {
-            nextItem = sortedColumns[sortedColumns.indexOf(currentCol) + 1];
-        }
-        else if (keyCode === this.keys.TAB) {
-            this.containerTabHandler(event, currentCol, shiftKey);
-        }
-        if (nextItem && currentCol) {
-            event.preventDefault();
-            const focusableElements = this.getFocusableElementsInCell(nextItem);
-            currentCol.tabIndex = -1;
-            if (focusableElements.length === 1) {
-                gainFocus(focusableElements[0]);
-            }
-            else {
-                gainFocus(nextItem);
-            }
-        }
+    onFocusHandler(event) {
+        this.#loadingAnnouncement.onFocus(event);
     }
-    a11yHandler(event) {
-        const rootNode = this.container.getRootNode();
-        if (!(rootNode instanceof Document || rootNode instanceof ShadowRoot))
-            return;
-        const currentCol = rootNode.activeElement?.closest(this.selectors.focusElementSelector);
-        if (rootNode.activeElement instanceof HTMLElement &&
-            currentCol instanceof HTMLElement &&
-            (currentCol === rootNode.activeElement ||
-                this.doesCardContainFocusableElement(rootNode.activeElement))) {
-            this.galleryContainerEventHandlers(event, currentCol);
-        }
+    itemsLoadedCallback() {
+        this.#loadingAnnouncement.onItemsLoaded();
     }
 }
 export default GalleryA11y;

package/lib/Core/Views/Gallery/GalleryA11y.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryA11y.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryA11y.ts"],"names":[],"mappings":"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","sourcesContent":["import { BaseA11y } from 'pega-repeating-structures-core';\n\nexport type Selectors = {\n  focusElementSelector: string;\n  parentElementSelector?: string;\n};\n\nfunction gainFocus(element: HTMLElement | undefined): void {\n  if (!element) return;\n  element.tabIndex = 0;\n  element.focus();\n}\n\nclass GalleryA11y extends BaseA11y {\n  constructor(\n    selectors: Selectors,\n    focusableSelectors: string[],\n    container: HTMLElement,\n    customKeys: Record<string, number> = {}\n  ) {\n    super(selectors, focusableSelectors, customKeys, container);\n  }\n\n  doesCardContainFocusableElement(element: HTMLElement) {\n    const colItem = element.closest(this.selectors.focusElementSelector);\n    if (!colItem) return false;\n    return element.matches(this.focusableSelectors.join(','));\n  }\n\n  galleryContainerEventHandlers(event: KeyboardEvent, currentCol: HTMLElement) {\n    const { keyCode, shiftKey } = event;\n    if (this.stopEventHandler(event)) {\n      return;\n    }\n    let nextItem: Element | undefined | null;\n    const sortedColumns = this.getSortedColumns(\n      currentCol.closest(this.selectors.parentElementSelector!)\n    );\n\n    if (keyCode === this.keys.UP || keyCode === this.keys.LEFT) {\n      nextItem = sortedColumns[sortedColumns.indexOf(currentCol) - 1];\n    } else if (keyCode === this.keys.RIGHT || keyCode === this.keys.DOWN) {\n      nextItem = sortedColumns[sortedColumns.indexOf(currentCol) + 1];\n    } else if (keyCode === this.keys.TAB) {\n      this.containerTabHandler(event, currentCol, shiftKey);\n    }\n    if (nextItem && currentCol) {\n      event.preventDefault();\n      const focusableElements = this.getFocusableElementsInCell(nextItem);\n      currentCol.tabIndex = -1;\n      if (focusableElements.length === 1) {\n        gainFocus(focusableElements[0]);\n      } else {\n        gainFocus(nextItem as HTMLElement);\n      }\n    }\n  }\n\n  override a11yHandler(event: KeyboardEvent) {\n    const rootNode = this.container.getRootNode();\n\n    if (!(rootNode instanceof Document || rootNode instanceof ShadowRoot)) return;\n\n    const currentCol = rootNode.activeElement?.closest(this.selectors.focusElementSelector);\n    if (\n      rootNode.activeElement instanceof HTMLElement &&\n      currentCol instanceof HTMLElement &&\n      (currentCol === rootNode.activeElement ||\n        this.doesCardContainFocusableElement(rootNode.activeElement as HTMLElement))\n    ) {\n      this.galleryContainerEventHandlers(event, currentCol);\n    }\n  }\n}\n\nexport default GalleryA11y;\n"]}
+{"version":3,"file":"GalleryA11y.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryA11y.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAG1D,OAAO,iCAAiC,MAAM,wCAAwC,CAAC;AASvF,MAAM,WAAY,SAAQ,QAAQ;IAChC,oBAAoB,CAAuD;IAE3E,YACE,SAAoB,EACpB,kBAA4B,EAC5B,SAAsB,EACtB,iBAAiC,EACjC,cAA8B,EAC9B,SAAkC;QAElC,KAAK,CAAC,SAAS,EAAE,kBAAkB,EAAE,EAAE,EAAE,SAAS,CAAC,CAAC;QACpD,IAAI,CAAC,oBAAoB,GAAG,iCAAiC,CAC3D,SAAS,EACT,SAAS,EACT,iBAAiB,EACjB,cAAc,EACd,SAAS,CACV,CAAC;IACJ,CAAC;IAEQ,cAAc,CAAC,KAAa;QACnC,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC3C,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,oBAAoB,CAAC,aAAa,EAAE,CAAC;IAC5C,CAAC;CACF;AAED,eAAe,WAAW,CAAC","sourcesContent":["import { BaseA11y } from 'pega-repeating-structures-core';\nimport type { useLiveLog } from '@pega/cosmos-react-core';\n\nimport createLoadingAnnouncementBehavior from '../../a11y/loadingAnnouncementBehavior';\n\nexport type Selectors = {\n  focusElementSelector: string;\n  belowLoader: string;\n};\n\ntype AnnounceMethod = ReturnType<typeof useLiveLog>['announceAssertive'];\n\nclass GalleryA11y extends BaseA11y {\n  #loadingAnnouncement: ReturnType<typeof createLoadingAnnouncementBehavior>;\n\n  constructor(\n    selectors: Selectors,\n    focusableSelectors: string[],\n    container: HTMLElement,\n    announceAssertive: AnnounceMethod,\n    announcePolite: AnnounceMethod,\n    translate: (key: string) => string\n  ) {\n    super(selectors, focusableSelectors, {}, container);\n    this.#loadingAnnouncement = createLoadingAnnouncementBehavior(\n      selectors,\n      container,\n      announceAssertive,\n      announcePolite,\n      translate\n    );\n  }\n\n  override onFocusHandler(event?: Event) {\n    this.#loadingAnnouncement.onFocus(event);\n  }\n\n  itemsLoadedCallback() {\n    this.#loadingAnnouncement.onItemsLoaded();\n  }\n}\n\nexport default GalleryA11y;\n"]}

package/lib/Core/Views/Gallery/GalleryContainer.d.ts

@@ -0,0 +1,23 @@
+import { type ReactNode } from 'react';
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+import type { ImageSize, WithAttributes } from '@pega/cosmos-react-core';
+interface GalleryContainerProps {
+    children?: ReactNode;
+    view: RsCoreTypes.View;
+    isFullscreen: boolean;
+    className?: string;
+    image?: {
+        placement?: RsCoreTypes.HeroImagePlacement;
+        size?: ImageSize;
+    };
+    tile?: {
+        placement?: RsCoreTypes.HeroImagePlacement;
+        size?: ImageSize;
+    };
+    isStackLayout?: boolean;
+}
+declare const GalleryContainer: import("react").ForwardRefExoticComponent<Omit<WithAttributes<"div", GalleryContainerProps>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export default GalleryContainer;
+declare const StyledVirtualizeContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export { StyledVirtualizeContainer };
+//# sourceMappingURL=GalleryContainer.d.ts.map

package/lib/Core/Views/Gallery/GalleryContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASnD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAYzE,UAAU,qBAAqB;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE;QACN,SAAS,CAAC,EAAE,WAAW,CAAC,kBAAkB,CAAC;QAC3C,IAAI,CAAC,EAAE,SAAS,CAAC;KAClB,CAAC;IACF,IAAI,CAAC,EAAE;QACL,SAAS,CAAC,EAAE,WAAW,CAAC,kBAAkB,CAAC;QAC3C,IAAI,CAAC,EAAE,SAAS,CAAC;KAClB,CAAC;IACF,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AA6DD,QAAA,MAAM,gBAAgB,sJAoBrB,CAAC;AAIF,eAAe,gBAAgB,CAAC;AAEhC,QAAA,MAAM,yBAAyB,6NAG9B,CAAC;AAGF,OAAO,EAAE,yBAAyB,EAAE,CAAC"}

package/lib/Core/Views/Gallery/GalleryContainer.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import styled, { css } from 'styled-components';
+import { getBaseCardContainerStyles, getInlineImageCardContainerStyles, StyledHeader, StyledSelectionCard } from '@pega/cosmos-react-core/lib/components/SelectionCard/SelectionCard.styles';
+import { defaultThemeProp } from '@pega/cosmos-react-core';
+import { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';
+import { DEFAULT_IMAGE_PLACEMENT, DEFAULT_IMAGE_SIZE, GALLERY_IMAGE_PLACEMENT_MAP, isInlinePlacement } from './utils';
+const StyledGalleryContainer = styled.div(({ view, isFullscreen, isStackLayout, theme }) => {
+    return css `
+      ${generateRSHeightStyles({ view, isFullscreen })}
+
+      .grid-container {
+        position: absolute;
+        width: 100%;
+        padding: 0.2rem;
+        ${getBaseCardContainerStyles(theme)}
+        ${isStackLayout &&
+        css `
+          grid-template-columns: 1fr;
+        `}
+        ${StyledSelectionCard} ${StyledHeader} {
+          min-height: auto;
+        }
+      }
+    `;
+});
+StyledGalleryContainer.defaultProps = defaultThemeProp;
+const StyledInlineImageGalleryContainer = styled(StyledGalleryContainer)(({ theme, imageSize, imagePlacement, isStackLayout }) => {
+    return css `
+    *:has(> .grid-container) {
+      container-type: inline-size;
+    }
+
+    .grid-container {
+      ${!isStackLayout &&
+        getInlineImageCardContainerStyles(theme, {
+            placement: GALLERY_IMAGE_PLACEMENT_MAP[imagePlacement],
+            size: imageSize
+        })}
+
+      ${StyledSelectionCard} ${StyledHeader} {
+        min-height: auto;
+      }
+    }
+  `;
+});
+StyledInlineImageGalleryContainer.defaultProps = defaultThemeProp;
+const GalleryContainer = forwardRef(({ image, tile, isStackLayout, ...props }, ref) => {
+    const layoutSource = image ?? tile;
+    if (layoutSource) {
+        const { placement = DEFAULT_IMAGE_PLACEMENT, size = DEFAULT_IMAGE_SIZE } = layoutSource;
+        if (isInlinePlacement(placement)) {
+            return (_jsx(StyledInlineImageGalleryContainer, { ref: ref, isStackLayout: isStackLayout, imageSize: size, imagePlacement: placement, ...props }));
+        }
+    }
+    return _jsx(StyledGalleryContainer, { ref: ref, isStackLayout: isStackLayout, ...props });
+});
+GalleryContainer.displayName = 'GalleryContainer';
+export default GalleryContainer;
+const StyledVirtualizeContainer = styled.div `
+  ${generateRSDataContainerHeightStyles};
+  position: relative;
+`;
+StyledVirtualizeContainer.defaultProps = defaultThemeProp;
+export { StyledVirtualizeContainer };
+//# sourceMappingURL=GalleryContainer.js.map

package/lib/Core/Views/Gallery/GalleryContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryContainer.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AACnD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,0BAA0B,EAC1B,iCAAiC,EACjC,YAAY,EACZ,mBAAmB,EACpB,MAAM,2EAA2E,CAAC;AAGnF,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,OAAO,EAAE,mCAAmC,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAEjG,OAAO,EACL,uBAAuB,EACvB,kBAAkB,EAClB,2BAA2B,EAC3B,iBAAiB,EAClB,MAAM,SAAS,CAAC;AA6BjB,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CACvC,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,aAAa,EAAE,KAAK,EAAE,EAAE,EAAE;IAC/C,OAAO,GAAG,CAAA;QACN,sBAAsB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC;;;;;;UAM5C,0BAA0B,CAAC,KAAK,CAAC;UACjC,aAAa;QACf,GAAG,CAAA;;SAEF;UACC,mBAAmB,IAAI,YAAY;;;;KAIxC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,iCAAiC,GAAG,MAAM,CAAC,sBAAsB,CAAC,CAEtE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,aAAa,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;;;;;;QAMJ,CAAC,aAAa;QAChB,iCAAiC,CAAC,KAAK,EAAE;YACvC,SAAS,EAAE,2BAA2B,CAAC,cAAc,CAAC;YACtD,IAAI,EAAE,SAAS;SAChB,CAAC;;QAEA,mBAAmB,IAAI,YAAY;;;;GAIxC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iCAAiC,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElE,MAAM,gBAAgB,GAAG,UAAU,CACjC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,aAAa,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAChD,MAAM,YAAY,GAAG,KAAK,IAAI,IAAI,CAAC;IACnC,IAAI,YAAY,EAAE,CAAC;QACjB,MAAM,EAAE,SAAS,GAAG,uBAAuB,EAAE,IAAI,GAAG,kBAAkB,EAAE,GAAG,YAAY,CAAC;QACxF,IAAI,iBAAiB,CAAC,SAAS,CAAC,EAAE,CAAC;YACjC,OAAO,CACL,KAAC,iCAAiC,IAChC,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,aAAa,EAC5B,SAAS,EAAE,IAAI,EACf,cAAc,EAAE,SAAS,KACrB,KAAK,GACT,CACH,CAAC;QACJ,CAAC;IACH,CAAC;IAED,OAAO,KAAC,sBAAsB,IAAC,GAAG,EAAE,GAAG,EAAE,aAAa,EAAE,aAAa,KAAM,KAAK,GAAI,CAAC;AACvF,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAC;AAElD,eAAe,gBAAgB,CAAC;AAEhC,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAA;IACxC,mCAAmC;;CAEtC,CAAC;AAEF,yBAAyB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,CAAC","sourcesContent":["import { forwardRef, type ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  getBaseCardContainerStyles,\n  getInlineImageCardContainerStyles,\n  StyledHeader,\n  StyledSelectionCard\n} from '@pega/cosmos-react-core/lib/components/SelectionCard/SelectionCard.styles';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { ImageSize, WithAttributes } from '@pega/cosmos-react-core';\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nimport { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';\n\nimport {\n  DEFAULT_IMAGE_PLACEMENT,\n  DEFAULT_IMAGE_SIZE,\n  GALLERY_IMAGE_PLACEMENT_MAP,\n  isInlinePlacement\n} from './utils';\n\ninterface GalleryContainerProps {\n  children?: ReactNode;\n  view: RsCoreTypes.View;\n  isFullscreen: boolean;\n  className?: string;\n  image?: {\n    placement?: RsCoreTypes.HeroImagePlacement;\n    size?: ImageSize;\n  };\n  tile?: {\n    placement?: RsCoreTypes.HeroImagePlacement;\n    size?: ImageSize;\n  };\n  isStackLayout?: boolean;\n}\n\ninterface StyledGalleryContainerProps {\n  view: RsCoreTypes.View;\n  isFullscreen: boolean;\n  isStackLayout?: boolean;\n}\n\ninterface StyledInlineImageGalleryContainerProps extends StyledGalleryContainerProps {\n  imagePlacement: Extract<RsCoreTypes.HeroImagePlacement, 'left' | 'right'>;\n  imageSize: ImageSize;\n}\n\nconst StyledGalleryContainer = styled.div<StyledGalleryContainerProps>(\n  ({ view, isFullscreen, isStackLayout, theme }) => {\n    return css`\n      ${generateRSHeightStyles({ view, isFullscreen })}\n\n      .grid-container {\n        position: absolute;\n        width: 100%;\n        padding: 0.2rem;\n        ${getBaseCardContainerStyles(theme)}\n        ${isStackLayout &&\n        css`\n          grid-template-columns: 1fr;\n        `}\n        ${StyledSelectionCard} ${StyledHeader} {\n          min-height: auto;\n        }\n      }\n    `;\n  }\n);\n\nStyledGalleryContainer.defaultProps = defaultThemeProp;\n\nconst StyledInlineImageGalleryContainer = styled(StyledGalleryContainer)<\n  Pick<StyledInlineImageGalleryContainerProps, 'imageSize' | 'imagePlacement'>\n>(({ theme, imageSize, imagePlacement, isStackLayout }) => {\n  return css`\n    *:has(> .grid-container) {\n      container-type: inline-size;\n    }\n\n    .grid-container {\n      ${!isStackLayout &&\n      getInlineImageCardContainerStyles(theme, {\n        placement: GALLERY_IMAGE_PLACEMENT_MAP[imagePlacement],\n        size: imageSize\n      })}\n\n      ${StyledSelectionCard} ${StyledHeader} {\n        min-height: auto;\n      }\n    }\n  `;\n});\n\nStyledInlineImageGalleryContainer.defaultProps = defaultThemeProp;\n\nconst GalleryContainer = forwardRef<HTMLDivElement, WithAttributes<'div', GalleryContainerProps>>(\n  ({ image, tile, isStackLayout, ...props }, ref) => {\n    const layoutSource = image ?? tile;\n    if (layoutSource) {\n      const { placement = DEFAULT_IMAGE_PLACEMENT, size = DEFAULT_IMAGE_SIZE } = layoutSource;\n      if (isInlinePlacement(placement)) {\n        return (\n          <StyledInlineImageGalleryContainer\n            ref={ref}\n            isStackLayout={isStackLayout}\n            imageSize={size}\n            imagePlacement={placement}\n            {...props}\n          />\n        );\n      }\n    }\n\n    return <StyledGalleryContainer ref={ref} isStackLayout={isStackLayout} {...props} />;\n  }\n);\n\nGalleryContainer.displayName = 'GalleryContainer';\n\nexport default GalleryContainer;\n\nconst StyledVirtualizeContainer = styled.div`\n  ${generateRSDataContainerHeightStyles};\n  position: relative;\n`;\n\nStyledVirtualizeContainer.defaultProps = defaultThemeProp;\nexport { StyledVirtualizeContainer };\n"]}