@payloadcms/ui 4.0.0-internal.af6aad0 → 4.0.0-internal.b8a92d2

package/dist/elements/Hierarchy/ColumnBrowser/Column/index.js

@@ -12,16 +12,15 @@ import { ColumnItem } from '../ColumnItem/index.js';
 import './index.css';
 const baseClass = 'hierarchy-column';
 export const Column = t0 => {
-  const $ = _c(44);
+  const $ = _c(37);
   const {
+    ancestorsWithSelections,
     canCreate,
     collectionLabel,
-    collectionLabelPlural,
     disabled,
     disabledIds,
     expandedId,
     filterByCollection,
-    hasMany,
     hasNextPage,
     isLoading,
     items,
@@ -32,9 +31,6 @@ export const Column = t0 => {
     parentId,
     parentTitle,
     pathToColumn,
-    revealedId,
-    revealToken,
-    selectedDescendantCounts,
     selectedIds,
     totalDocs
   } = t0;
@@ -42,13 +38,10 @@ export const Column = t0 => {
     t
   } = useTranslation();
   let t1;
-  if ($[0] !== canCreate || $[1] !== collectionLabel || $[2] !== collectionLabelPlural || $[3] !== disabled || $[4] !== disabledIds || $[5] !== expandedId || $[6] !== filterByCollection || $[7] !== hasMany || $[8] !== hasNextPage || $[9] !== isLoading || $[10] !== items || $[11] !== onCreateNew || $[12] !== onExpand || $[13] !== onLoadMore || $[14] !== onSelect || $[15] !== parentId || $[16] !== parentTitle || $[17] !== pathToColumn || $[18] !== revealToken || $[19] !== revealedId || $[20] !== selectedDescendantCounts || $[21] !== selectedIds || $[22] !== t || $[23] !== totalDocs) {
+  if ($[0] !== ancestorsWithSelections || $[1] !== canCreate || $[2] !== collectionLabel || $[3] !== disabled || $[4] !== disabledIds || $[5] !== expandedId || $[6] !== filterByCollection || $[7] !== hasNextPage || $[8] !== isLoading || $[9] !== items || $[10] !== onCreateNew || $[11] !== onExpand || $[12] !== onLoadMore || $[13] !== onSelect || $[14] !== parentId || $[15] !== parentTitle || $[16] !== pathToColumn || $[17] !== selectedIds || $[18] !== t || $[19] !== totalDocs) {
     const headerTitle = parentTitle || (parentId === null ? t("general:all") : "");
-    const newItemLabel = `New ${collectionLabel}`;
-    const isEmpty = !disabled && !isLoading && items.length === 0;
-    const emptyLabel = parentId === null ? `No ${collectionLabelPlural}` : `No other ${collectionLabelPlural}`;
     let t2;
-    if ($[25] !== items || $[26] !== onSelect || $[27] !== pathToColumn) {
+    if ($[21] !== items || $[22] !== onSelect || $[23] !== pathToColumn) {
       t2 = t3 => {
         const {
           id
@@ -63,56 +56,51 @@ export const Column = t0 => {
           path: fullPath
         });
       };
-      $[25] = items;
-      $[26] = onSelect;
-      $[27] = pathToColumn;
-      $[28] = t2;
+      $[21] = items;
+      $[22] = onSelect;
+      $[23] = pathToColumn;
+      $[24] = t2;
     } else {
-      t2 = $[28];
+      t2 = $[24];
     }
     const handleSelect = t2;
     let t3;
-    if ($[29] !== onCreateNew || $[30] !== parentId) {
+    if ($[25] !== onCreateNew || $[26] !== parentId) {
       t3 = () => {
         onCreateNew({
           parentId
         });
       };
-      $[29] = onCreateNew;
-      $[30] = parentId;
-      $[31] = t3;
+      $[25] = onCreateNew;
+      $[26] = parentId;
+      $[27] = t3;
     } else {
-      t3 = $[31];
+      t3 = $[27];
     }
     const handleCreateNew = t3;
     let t4;
-    if ($[32] !== disabled || $[33] !== disabledIds || $[34] !== expandedId || $[35] !== filterByCollection || $[36] !== handleSelect || $[37] !== hasMany || $[38] !== onExpand || $[39] !== revealToken || $[40] !== revealedId || $[41] !== selectedDescendantCounts || $[42] !== selectedIds) {
+    if ($[28] !== ancestorsWithSelections || $[29] !== disabled || $[30] !== disabledIds || $[31] !== expandedId || $[32] !== filterByCollection || $[33] !== handleSelect || $[34] !== onExpand || $[35] !== selectedIds) {
       t4 = item_0 => _jsx(ColumnItem, {
         disabled: Boolean(disabled || disabledIds?.has(item_0.id)),
         filterByCollection,
-        hasMany,
+        hasSelectedDescendants: ancestorsWithSelections.has(item_0.id),
         isExpanded: expandedId === item_0.id,
         isSelected: selectedIds.has(item_0.id),
         item: item_0,
         onExpand,
-        onSelect: handleSelect,
-        revealToken: revealedId === item_0.id ? revealToken : undefined,
-        selectedDescendantCount: selectedDescendantCounts.get(item_0.id) ?? 0
+        onSelect: handleSelect
       }, String(item_0.id));
-      $[32] = disabled;
-      $[33] = disabledIds;
-      $[34] = expandedId;
-      $[35] = filterByCollection;
-      $[36] = handleSelect;
-      $[37] = hasMany;
-      $[38] = onExpand;
-      $[39] = revealToken;
-      $[40] = revealedId;
-      $[41] = selectedDescendantCounts;
-      $[42] = selectedIds;
-      $[43] = t4;
+      $[28] = ancestorsWithSelections;
+      $[29] = disabled;
+      $[30] = disabledIds;
+      $[31] = expandedId;
+      $[32] = filterByCollection;
+      $[33] = handleSelect;
+      $[34] = onExpand;
+      $[35] = selectedIds;
+      $[36] = t4;
     } else {
-      t4 = $[43];
+      t4 = $[36];
     }
     t1 = _jsxs("div", {
       className: baseClass,
@@ -121,18 +109,18 @@ export const Column = t0 => {
         children: [_jsx("span", {
           className: `${baseClass}__header-title`,
           children: headerTitle
-        }), canCreate && _jsx(Button, {
-          "aria-label": newItemLabel,
+        }), canCreate && _jsxs(Button, {
           buttonStyle: "ghost",
           className: `${baseClass}__add-button`,
           disabled,
           icon: _jsx(PlusIcon, {
-            size: 24
+            size: 16
           }),
+          iconPosition: "left",
           margin: false,
           onClick: handleCreateNew,
           size: "medium",
-          tooltip: newItemLabel
+          children: ["New ", collectionLabel]
         })]
       }), _jsxs("div", {
         className: `${baseClass}__items`,
@@ -142,9 +130,6 @@ export const Column = t0 => {
             loadingText: null,
             size: "sm"
           })
-        }), isEmpty && _jsx("div", {
-          className: `${baseClass}__empty`,
-          children: emptyLabel
         }), !disabled && !isLoading && totalDocs > 0 && _jsx(LoadMoreRow, {
           className: `${baseClass}__load-more`,
           currentCount: items.length,
@@ -154,33 +139,29 @@ export const Column = t0 => {
         })]
       })]
     });
-    $[0] = canCreate;
-    $[1] = collectionLabel;
-    $[2] = collectionLabelPlural;
+    $[0] = ancestorsWithSelections;
+    $[1] = canCreate;
+    $[2] = collectionLabel;
     $[3] = disabled;
     $[4] = disabledIds;
     $[5] = expandedId;
     $[6] = filterByCollection;
-    $[7] = hasMany;
-    $[8] = hasNextPage;
-    $[9] = isLoading;
-    $[10] = items;
-    $[11] = onCreateNew;
-    $[12] = onExpand;
-    $[13] = onLoadMore;
-    $[14] = onSelect;
-    $[15] = parentId;
-    $[16] = parentTitle;
-    $[17] = pathToColumn;
-    $[18] = revealToken;
-    $[19] = revealedId;
-    $[20] = selectedDescendantCounts;
-    $[21] = selectedIds;
-    $[22] = t;
-    $[23] = totalDocs;
-    $[24] = t1;
+    $[7] = hasNextPage;
+    $[8] = isLoading;
+    $[9] = items;
+    $[10] = onCreateNew;
+    $[11] = onExpand;
+    $[12] = onLoadMore;
+    $[13] = onSelect;
+    $[14] = parentId;
+    $[15] = parentTitle;
+    $[16] = pathToColumn;
+    $[17] = selectedIds;
+    $[18] = t;
+    $[19] = totalDocs;
+    $[20] = t1;
   } else {
-    t1 = $[24];
+    t1 = $[20];
   }
   return t1;
 };

package/dist/elements/Hierarchy/ColumnBrowser/Column/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useCallback","PlusIcon","useTranslation","Button","LoadMoreRow","Spinner","ColumnItem","baseClass","Column","t0","$","canCreate","collectionLabel","collectionLabelPlural","disabled","disabledIds","expandedId","filterByCollection","hasMany","hasNextPage","isLoading","items","onCreateNew","onExpand","onLoadMore","onSelect","parentId","parentTitle","pathToColumn","revealedId","revealToken","selectedDescendantCounts","selectedIds","totalDocs","t","t1","headerTitle","newItemLabel","isEmpty","length","emptyLabel","t2","t3","id","item","find","i","fullPath","title","path","handleSelect","handleCreateNew","t4","item_0","_jsx","Boolean","has","isExpanded","isSelected","undefined","selectedDescendantCount","get","String","_jsxs","className","children","buttonStyle","icon","size","tooltip","map","loadingText","currentCount","hasMore"],"sources":["../../../../../src/elements/Hierarchy/ColumnBrowser/Column/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback } from 'react'\n\nimport type { ColumnProps } from '../types.js'\n\nimport { PlusIcon } from '../../../../icons/Plus/index.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport { Button } from '../../../Button/index.js'\nimport { LoadMoreRow } from '../../../LoadMoreRow/index.js'\nimport { Spinner } from '../../../Spinner/index.js'\nimport { ColumnItem } from '../ColumnItem/index.js'\nimport './index.css'\n\nconst baseClass = 'hierarchy-column'\n\nexport const Column: React.FC<ColumnProps> = ({\n  canCreate,\n  collectionLabel,\n  collectionLabelPlural,\n  disabled,\n  disabledIds,\n  expandedId,\n  filterByCollection,\n  hasMany,\n  hasNextPage,\n  isLoading,\n  items,\n  onCreateNew,\n  onExpand,\n  onLoadMore,\n  onSelect,\n  parentId,\n  parentTitle,\n  pathToColumn,\n  revealedId,\n  revealToken,\n  selectedDescendantCounts,\n  selectedIds,\n  totalDocs,\n}) => {\n  const { t } = useTranslation()\n\n  const headerTitle = parentTitle || (parentId === null ? t('general:all') : '')\n  const newItemLabel = `New ${collectionLabel}`\n  const isEmpty = !disabled && !isLoading && items.length === 0\n\n  // TODO: replace with translation keys once the hierarchy strings are finalized. The closest\n  // existing string, `version:noRowsFound`, belongs to the version-diff tables.\n  const emptyLabel =\n    parentId === null ? `No ${collectionLabelPlural}` : `No other ${collectionLabelPlural}`\n\n  const handleSelect = useCallback(\n    ({ id }: { id: number | string }) => {\n      const item = items.find((i) => i.id === id)\n      const fullPath = item ? [...pathToColumn, { id: item.id, title: item.title }] : pathToColumn\n      onSelect({ id, path: fullPath })\n    },\n    [items, onSelect, pathToColumn],\n  )\n\n  const handleCreateNew = useCallback(() => {\n    onCreateNew({ parentId })\n  }, [onCreateNew, parentId])\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__header`}>\n        <span className={`${baseClass}__header-title`}>{headerTitle}</span>\n        {canCreate && (\n          <Button\n            aria-label={newItemLabel}\n            buttonStyle=\"ghost\"\n            className={`${baseClass}__add-button`}\n            disabled={disabled}\n            icon={<PlusIcon size={24} />}\n            margin={false}\n            onClick={handleCreateNew}\n            size=\"medium\"\n            tooltip={newItemLabel}\n          />\n        )}\n      </div>\n\n      <div className={`${baseClass}__items`}>\n        {items.map((item) => (\n          <ColumnItem\n            disabled={Boolean(disabled || disabledIds?.has(item.id))}\n            filterByCollection={filterByCollection}\n            hasMany={hasMany}\n            isExpanded={expandedId === item.id}\n            isSelected={selectedIds.has(item.id)}\n            item={item}\n            key={String(item.id)}\n            onExpand={onExpand}\n            onSelect={handleSelect}\n            revealToken={revealedId === item.id ? revealToken : undefined}\n            selectedDescendantCount={selectedDescendantCounts.get(item.id) ?? 0}\n          />\n        ))}\n\n        {isLoading && (\n          <div className={`${baseClass}__loading`}>\n            <Spinner loadingText={null} size=\"sm\" />\n          </div>\n        )}\n\n        {isEmpty && <div className={`${baseClass}__empty`}>{emptyLabel}</div>}\n\n        {!disabled && !isLoading && totalDocs > 0 && (\n          <LoadMoreRow\n            className={`${baseClass}__load-more`}\n            currentCount={items.length}\n            hasMore={hasNextPage}\n            onLoadMore={onLoadMore}\n            totalDocs={totalDocs}\n          />\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useCallback","PlusIcon","useTranslation","Button","LoadMoreRow","Spinner","ColumnItem","baseClass","Column","t0","$","ancestorsWithSelections","canCreate","collectionLabel","disabled","disabledIds","expandedId","filterByCollection","hasNextPage","isLoading","items","onCreateNew","onExpand","onLoadMore","onSelect","parentId","parentTitle","pathToColumn","selectedIds","totalDocs","t","t1","headerTitle","t2","t3","id","item","find","i","fullPath","title","path","handleSelect","handleCreateNew","t4","item_0","_jsx","Boolean","has","hasSelectedDescendants","isExpanded","isSelected","String","_jsxs","className","children","buttonStyle","icon","size","margin","onClick","map","loadingText","currentCount","length","hasMore"],"sources":["../../../../../src/elements/Hierarchy/ColumnBrowser/Column/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback } from 'react'\n\nimport type { ColumnProps } from '../types.js'\n\nimport { PlusIcon } from '../../../../icons/Plus/index.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport { Button } from '../../../Button/index.js'\nimport { LoadMoreRow } from '../../../LoadMoreRow/index.js'\nimport { Spinner } from '../../../Spinner/index.js'\nimport { ColumnItem } from '../ColumnItem/index.js'\nimport './index.css'\n\nconst baseClass = 'hierarchy-column'\n\nexport const Column: React.FC<ColumnProps> = ({\n  ancestorsWithSelections,\n  canCreate,\n  collectionLabel,\n  disabled,\n  disabledIds,\n  expandedId,\n  filterByCollection,\n  hasNextPage,\n  isLoading,\n  items,\n  onCreateNew,\n  onExpand,\n  onLoadMore,\n  onSelect,\n  parentId,\n  parentTitle,\n  pathToColumn,\n  selectedIds,\n  totalDocs,\n}) => {\n  const { t } = useTranslation()\n\n  const headerTitle = parentTitle || (parentId === null ? t('general:all') : '')\n\n  const handleSelect = useCallback(\n    ({ id }: { id: number | string }) => {\n      const item = items.find((i) => i.id === id)\n      const fullPath = item ? [...pathToColumn, { id: item.id, title: item.title }] : pathToColumn\n      onSelect({ id, path: fullPath })\n    },\n    [items, onSelect, pathToColumn],\n  )\n\n  const handleCreateNew = useCallback(() => {\n    onCreateNew({ parentId })\n  }, [onCreateNew, parentId])\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__header`}>\n        <span className={`${baseClass}__header-title`}>{headerTitle}</span>\n        {canCreate && (\n          <Button\n            buttonStyle=\"ghost\"\n            className={`${baseClass}__add-button`}\n            disabled={disabled}\n            icon={<PlusIcon size={16} />}\n            iconPosition=\"left\"\n            margin={false}\n            onClick={handleCreateNew}\n            size=\"medium\"\n          >\n            New {collectionLabel}\n          </Button>\n        )}\n      </div>\n\n      <div className={`${baseClass}__items`}>\n        {items.map((item) => (\n          <ColumnItem\n            disabled={Boolean(disabled || disabledIds?.has(item.id))}\n            filterByCollection={filterByCollection}\n            hasSelectedDescendants={ancestorsWithSelections.has(item.id)}\n            isExpanded={expandedId === item.id}\n            isSelected={selectedIds.has(item.id)}\n            item={item}\n            key={String(item.id)}\n            onExpand={onExpand}\n            onSelect={handleSelect}\n          />\n        ))}\n\n        {isLoading && (\n          <div className={`${baseClass}__loading`}>\n            <Spinner loadingText={null} size=\"sm\" />\n          </div>\n        )}\n\n        {!disabled && !isLoading && totalDocs > 0 && (\n          <LoadMoreRow\n            className={`${baseClass}__load-more`}\n            currentCount={items.length}\n            hasMore={hasNextPage}\n            onLoadMore={onLoadMore}\n            totalDocs={totalDocs}\n          />\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Hierarchy/ColumnBrowser/ColumnItem/index.css

@@ -1,16 +1,13 @@
 @layer payload-default {
   .hierarchy-column-item {
-    position: relative;
     display: flex;
     align-items: center;
     padding: var(--spacer-1) var(--spacer-2);
-    padding-inline-end: var(--spacer-1);
+    cursor: pointer;
     user-select: none;
     gap: var(--spacer-2-5);
     border-radius: var(--button-radius);
     margin-inline: var(--spacer-1);
-    outline: var(--stroke-width-small) solid transparent;
-    outline-offset: calc(var(--stroke-width-small) * -1);
 
     &:first-child {
       margin-top: var(--spacer-1);
@@ -23,54 +20,23 @@
     &:hover {
       background-color: var(--color-bg-hover);
     }
-
-    &:has(.hierarchy-column-item__select:focus-visible) {
-      outline: var(--accessibility-outline);
-      outline-offset: var(--accessibility-outline-offset);
-    }
   }
 
-  /*
-   * Row-wide click target for the row's primary action, sitting under the checkbox and chevron.
-   * It is the topmost element across the row, so its cursor is the one the pointer shows.
-   */
-  .hierarchy-column-item__select {
-    position: absolute;
-    inset: 0;
-    padding: 0;
-    border: none;
-    background: transparent;
-    border-radius: inherit;
-    cursor: pointer;
-
-    &:focus-visible {
-      outline: none;
-    }
+  .hierarchy-column-item--expanded {
+    background-color: var(--color-bg-tertiary);
 
-    &:disabled {
-      cursor: not-allowed;
+    &:hover {
+      background-color: var(--color-bg-tertiary);
     }
   }
 
-  /* Shares the hover fill, so pointing at a row previews how an open folder reads */
-  .hierarchy-column-item--expanded {
-    background-color: var(--color-bg-hover);
-  }
-
-  /*
-   * Only single-select rows carry a selected style. There is no checkbox in that mode, so the fill
-   * and ring are the only signal. In multi-select the checkbox already says what is picked, and
-   * filling those rows as well drowns out the `--expanded` fill that marks the current path.
-   *
-   * The ring is an inset outline rather than a border so the row's height does not shift when it
-   * becomes selected.
-   */
-  .hierarchy-column-item--selected:not(.hierarchy-column-item--multi-select) {
+  .hierarchy-column-item--selected {
     background-color: var(--color-bg-selected);
-    outline-color: var(--color-border-selected);
 
-    /* Selection outranks hover - the fill holds while the pointer is over the row */
-    &:hover,
+    &:hover {
+      background-color: var(--color-bg-selected);
+    }
+
     &.hierarchy-column-item--expanded {
       background-color: var(--color-bg-selected);
     }
@@ -89,33 +55,20 @@
     }
   }
 
-  /*
-   * Raised above the select overlay so it takes its own clicks - in multi-select the checkbox is
-   * the only thing that toggles selection, while the overlay behind it opens children.
-   */
   .hierarchy-column-item__checkbox {
-    position: relative;
-    z-index: 1;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
-    cursor: pointer;
 
     input[type='checkbox'] {
       width: 100%;
       height: 100%;
       margin: 0;
-      cursor: inherit;
-
-      &:disabled {
-        cursor: not-allowed;
-      }
     }
   }
 
   .hierarchy-column-item__title {
-    position: relative;
     flex: 1;
     min-width: 0;
     overflow: hidden;
@@ -123,59 +76,21 @@
     white-space: nowrap;
     color: var(--color-text);
     font-weight: 500;
-    pointer-events: none;
   }
 
-  /* Keeps the count badge tucked against the chevron rather than at the row's wider gap */
-  .hierarchy-column-item__trail {
+  .hierarchy-column-item__descendant-indicator {
+    width: var(--spacer-1);
+    height: var(--spacer-1);
+    border-radius: 50%;
+    background-color: var(--color-bg-success);
     flex-shrink: 0;
-    display: flex;
-    align-items: center;
-    gap: var(--spacer-1);
-  }
-
-  /* Count of selected items nested under a row, so a collapsed branch still reads as having picks */
-  .hierarchy-column-item__descendant-count {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    height: var(--spacer-3);
-    min-width: var(--spacer-3);
-    padding-inline: var(--spacer-1);
-    border-radius: var(--radius-medium);
-    background-color: var(--color-bg-tertiary);
-    color: var(--color-text);
-    font-family: var(--text-body-medium-font-family);
-    font-size: var(--text-body-medium-font-size);
-    font-weight: var(--text-body-medium-font-weight);
-    line-height: var(--text-body-medium-line-height);
-    letter-spacing: var(--text-body-medium-letter-spacing);
-    pointer-events: none;
   }
 
   .hierarchy-column-item__chevron {
-    position: relative;
-    z-index: 1;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
-    width: var(--spacer-4);
-    height: var(--spacer-4);
-    padding: 0;
-    border: none;
-    background: transparent;
-    border-radius: var(--radius-small);
     color: var(--color-icon-tertiary);
-    cursor: pointer;
-
-    &:focus-visible {
-      outline: var(--accessibility-outline);
-      outline-offset: var(--accessibility-outline-offset);
-    }
-
-    &:disabled {
-      cursor: not-allowed;
-    }
   }
 }

package/dist/elements/Hierarchy/ColumnBrowser/ColumnItem/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/Hierarchy/ColumnBrowser/ColumnItem/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAEtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAKlD,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAiIhD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/Hierarchy/ColumnBrowser/ColumnItem/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+B,MAAM,OAAO,CAAA;AAEnD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAKlD,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAoGhD,CAAA"}