@procore/data-table 14.46.0 → 14.46.1

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Change Log
 
+## 14.46.1
+
+### Patch Changes
+
+- 1f5e905: Add aria-label for search input of data-table
+- c361714: Fix multiple SuperSelect quick filter not being keyboard focusable, aria attributes to the trigger container, and clear button layout location
+
 ## 14.46.0
 
 ### Minor Changes

package/dist/legacy/index.cjs

@@ -57890,6 +57890,7 @@ var ServerSideSearch = ({
   const { updateServerSideDataSource } = useInternalTableContext();
   const hasNoContent = useTableHasNoContent();
   const I18n = coreReact.useI18nContext();
+  const resolvedPlaceholder = placeholder || I18n.t("dataTable.search");
   const debouncedSetSearchValue = React80__default.default.useCallback(
     debounce5__default.default((value) => {
       updateServerSideDataSource({ search: value });
@@ -57914,7 +57915,8 @@ var ServerSideSearch = ({
       value: internalValue,
       className: cx17("search", { "search--empty": !internalValue.length }),
       onChange,
-      placeholder: placeholder || I18n.t("dataTable.search")
+      placeholder: resolvedPlaceholder,
+      "aria-label": resolvedPlaceholder
     }
   ));
 };
@@ -107384,158 +107386,158 @@ var nb_NO_default = {
   dataTable: {
     emptyState: {
       noFilteredResults: {
-        description: "Kontroller staving og filteralternativer, eller s\xF8k etter et annet n\xF8kkelord.",
-        title: "Ingen enheter samsvarer med s\xF8ket ditt",
-        itemsTitle: "No %{itemsLabel} Match Your Search"
+        description: "Sjekk stavem\xE5ten og filteralternativene dine, eller s\xF8k etter et annet n\xF8kkelord.",
+        title: "Ingen elementer samsvarer med s\xF8ket ditt",
+        itemsTitle: "Ingen %{itemsLabel} samsvarer med s\xF8ket ditt"
       },
       noResults: {
-        description: "Once your team creates these items, you can access them here. ",
-        title: "Ingen enheter kan vises akkurat n\xE5",
-        itemsTitle: "There Are No %{itemsLabel} to Display Right Now",
-        tooltip: "The %{featureName} button will be enabled once you add information to the %{tableName}",
-        searchTooltip: "Search will be enabled once you add information to the %{tableName}",
+        description: "N\xE5r teamet ditt har opprettet disse elementene, kan du f\xE5 tilgang til dem her. ",
+        title: "Det er ingen elementer \xE5 vise akkurat n\xE5",
+        itemsTitle: "Det er ingen %{itemsLabel} \xE5 vise akkurat n\xE5",
+        tooltip: "%{featureName} -knappen vil bli aktivert n\xE5r du legger til informasjon i %{tableName}",
+        searchTooltip: "S\xF8k vil bli aktivert n\xE5r du legger til informasjon i %{tableName}",
         featureFilter: "Filter",
-        featureQuickFilter: "Quick Filter",
-        featureGroupBy: "Group By",
-        featureConfigure: "Configure",
-        tableNameFallback: "table"
+        featureQuickFilter: "Hurtigfilter",
+        featureGroupBy: "Grupper etter",
+        featureConfigure: "Konfigurer",
+        tableNameFallback: "bord"
       }
     },
     bulkActions: {
-      apply: "Apply",
-      bulkEdit: "Bulk Edit",
+      apply: "S\xF8k",
+      bulkEdit: "Masseendring",
       cancel: "Avbryt",
-      editValues: "Edit Values",
-      error: "Sorry, the items couldn't be updated. Try again.",
-      placeholderForField: "Enter %{fieldName}",
-      selection: "%{count} %{number} selected",
+      editValues: "Rediger verdier",
+      error: "Beklager, elementene kunne ikke oppdateres. Pr\xF8v igjen.",
+      placeholderForField: "Skriv inn %{fieldName}",
+      selection: "%{count} %{number} valgt",
       selection_count: {
-        zero: "%{count} items selected",
-        one: "%{count} item selected",
-        other: "%{count} items selected"
+        zero: "%{count} elementer valgt",
+        one: "%{count} element valgt",
+        other: "%{count} elementer valgt"
       },
-      success: "The items were successfully updated.",
-      one: "item",
-      many: "Enheter"
+      success: "Elementene ble oppdatert.",
+      one: "element",
+      many: "gjenstander"
     },
-    exporting: "Exporting...",
+    exporting: "Eksporterer...",
     filters: {
       filters: "Filtre",
       allFilters: "Alle filtre",
       moreFilters: "More Filters",
       clearAllFilters: "Fjern alle filtre",
-      close: "Close",
+      close: "Lukk",
       removeFilterToken: "Fjern %{name}",
       locationFilter: {
         selectAll: "Velg alle",
-        includeSublocations: "Include sublocations",
-        searchLocations: "Search locations",
-        locations: "Locations"
+        includeSublocations: "Inkluder underlokasjoner",
+        searchLocations: "S\xF8k etter steder",
+        locations: "Steder"
       },
       numberFilter: {
         labels: {
-          and: "OG",
-          input_placeholder: "Enter Value",
-          placeholder: "Select an item"
+          and: "og",
+          input_placeholder: "Angi verdi",
+          placeholder: "Velg et element"
         },
         options: {
-          any_value: "Any Value",
-          is_between: "Is Between",
-          is_equal_to: "Is Equal To",
-          greater_than: "Is Greater Than",
-          greater_than_equal_to: "Is Greater Than or Equal To",
-          less_than: "Is Less Than",
-          less_than_equal_to: "Is Less Than or Equal To",
-          no_value: "No Value"
+          any_value: "Enhver verdi",
+          is_between: "Er mellom",
+          is_equal_to: "Er lik",
+          greater_than: "Er st\xF8rre enn",
+          greater_than_equal_to: "Er st\xF8rre enn eller lik",
+          less_than: "Er mindre enn",
+          less_than_equal_to: "Er mindre enn eller lik",
+          no_value: "Ingen verdi"
         }
       },
       singleSelectFilter: {
-        placeholder: "Select a Value"
+        placeholder: "Velg en verdi"
       },
       multiSelectQuickFilter: {
-        ariaLabel: "Quick filter: Select multiple options"
+        ariaLabel: "Hurtigfilter: Velg flere alternativer"
       },
       singleSelectQuickFilter: {
-        ariaLabel: "Quick filter: Select an option"
+        ariaLabel: "Hurtigfilter: Velg et alternativ"
       }
     },
     loading: {
-      initial: "Information loading.",
-      secondary: "Information loading, thanks for your patience."
+      initial: "Laster inn informasjon.",
+      secondary: "Informasjon lastes, takk for t\xE5lmodigheten."
     },
     menuOptions: {
       ariaMenuColumn: "Trykk p\xE5 Alt/Option og pil ned for \xE5 \xE5pne kolonnemenyen.",
       sortMenuItem: {
-        label: "Sort By This Column",
-        sortAscItem: "Sort Column Ascending",
-        sortDescItem: "Sort Column Descending",
-        sortResetItem: "Column Not Sorted",
-        sortAscending: "sorted ascending",
-        sortDescending: "sorted descending",
-        sortCleared: "Sorting cleared"
-      },
-      expandAllGroups: "Expand All Groups",
-      collapseAllGroups: "Collapse All Groups",
-      pinColumn: "Pin Column",
-      pinLeft: "Pin Left",
-      pinRight: "Pin Right",
-      noPin: "No Pin",
-      autoSizeThisColumn: "Autosize This Column",
-      autoSizeAllColumns: "Autosize All Columns",
-      hideColumn: "Hide Column",
+        label: "Sorter etter denne kolonnen",
+        sortAscItem: "Sorter kolonne stigende",
+        sortDescItem: "Sorter kolonne synkende",
+        sortResetItem: "Kolonne ikke sortert",
+        sortAscending: "sortert stigende",
+        sortDescending: "sortert synkende",
+        sortCleared: "Sortering fjernet"
+      },
+      expandAllGroups: "Utvid alle grupper",
+      collapseAllGroups: "Skjul alle grupper",
+      pinColumn: "Fest kolonne",
+      pinLeft: "Fest til venstre",
+      pinRight: "Fest til h\xF8yre",
+      noPin: "Ingen PIN",
+      autoSizeThisColumn: "Tilpass kolonnebredden automatisk",
+      autoSizeAllColumns: "Tilpass alle kolonner automatisk",
+      hideColumn: "Skjul kolonne",
       resetColumns: "Tilbakestill kolonner",
-      unGroupBy: "Un-Group by {{label}}",
-      groupBy: "Group by {{label}}"
+      unGroupBy: "Fjern gruppering etter {{label}}",
+      groupBy: "Grupper etter {{label}}"
     },
-    grandTotals: "Grand Totals",
+    grandTotals: "Totale summer",
     search: "S\xF8k",
-    subtotals: "Subtotals",
+    subtotals: "Delsummer",
     tableSettings: {
-      configureColumns: "Configure Columns",
-      resetToDefault: "Show All",
-      rowHeight: "Row Height",
-      small: "Small",
-      medium: "Medium",
-      large: "Large",
-      tableSettings: "Table Settings",
-      groupBy: "Group by:",
+      configureColumns: "Konfigurer kolonner",
+      resetToDefault: "Vis alle",
+      rowHeight: "Radh\xF8yde",
+      small: "Liten",
+      medium: "Middels",
+      large: "Stor",
+      tableSettings: "Borddekking",
+      groupBy: "Grupper etter:",
       reset: "Tilbakestill",
-      selectColumnGroup: "Select a column to group",
-      configure: "Configure"
+      selectColumnGroup: "Velg en kolonne \xE5 gruppere",
+      configure: "Konfigurer"
     },
     rowGroupToggle: {
-      expandTierOne: "Open first groups in the table.",
-      expandAll: "Open all groups in the table.",
-      collapseAll: "Close all groups in the table."
+      expandTierOne: "\xC5pne de f\xF8rste gruppene i tabellen.",
+      expandAll: "\xC5pne alle grupper i tabellen.",
+      collapseAll: "Lukk alle grupper i tabellen."
     },
     columnGroupToggle: {
-      collapse: "Collapse column group",
-      expand: "Expand column group"
+      collapse: "Skjul kolonnegruppe",
+      expand: "Utvid kolonnegruppe"
     },
     cells: {
       textCell: {
-        placeholder: "Enter text"
+        placeholder: "Skriv inn tekst"
       },
       currencyCell: {
-        placeholder: "Enter currency"
+        placeholder: "Angi valuta"
       },
       linkCell: {
         externalLabel: "\xC5pne ekstern kobling"
       },
       numberCell: {
-        placeholder: "Enter number"
+        placeholder: "Skriv inn nummer"
       },
       percentCell: {
-        placeholder: "Enter %"
+        placeholder: "Skriv inn %"
       },
       pillCell: {
-        placeholder: "Select {{label}}"
+        placeholder: "Velg {{label}}"
       },
       selectCell: {
-        placeholder: "Select {{label}}"
+        placeholder: "Velg {{label}}"
       },
       multiSelectCell: {
-        placeholder: "Select Values"
+        placeholder: "Velg verdier"
       },
       booleanCell: {
         options: {
@@ -107546,16 +107548,16 @@ var nb_NO_default = {
     },
     filterRenders: {
       dateFilter: {
-        single: "Single",
-        range: "Range"
+        single: "Enslig",
+        range: "Rekkevidde"
       }
     },
     groupCell: {
-      expand: "Expand group",
-      collapse: "Collapse group"
+      expand: "Utvid gruppe",
+      collapse: "Skjul gruppe"
     },
     rowCheckbox: {
-      ariaLabel: "Select Row"
+      ariaLabel: "Velg rad"
     }
   }
 };
@@ -107984,7 +107986,7 @@ var pt_BR_default = {
         options: {
           any_value: "Qualquer Valor",
           is_between: "Est\xE1 entre",
-          is_equal_to: "\xC9 igual a",
+          is_equal_to: "\xC9 Igual a",
           greater_than: "\xC9 Maior Que",
           greater_than_equal_to: "\xC9 Maior Que ou Igual a",
           less_than: "\xC9 Menor Que",
@@ -108116,8 +108118,8 @@ var pt_PT_default = {
         description: "Assim que a sua equipa criar estes itens, poder\xE1 aceder aos mesmos aqui. ",
         title: "N\xE3o h\xE1 itens para apresentar neste momento",
         itemsTitle: "N\xE3o h\xE1 %{itemsLabel} para apresentar neste momento",
-        tooltip: "O bot\xE3o %{featureName} ser\xE1 ativado quando adicionar informa\xE7\xF5es \xE0 tabela %{tableName}",
-        searchTooltip: "A pesquisa ser\xE1 ativada quando adicionar informa\xE7\xF5es a %{tableName}",
+        tooltip: "O bot\xE3o %{featureName} ser\xE1 ativado quando adicionar informa\xE7\xF5es a %{tableName}",
+        searchTooltip: "A pesquisa ser\xE1 ativada quando adicionar informa\xE7\xF5es a: %{tableName}",
         featureFilter: "Filtro",
         featureQuickFilter: "Filtro r\xE1pido",
         featureGroupBy: "Agrupar por",
@@ -108218,8 +108220,8 @@ var pt_PT_default = {
       configureColumns: "Configurar colunas",
       resetToDefault: "Mostrar tudo",
       rowHeight: "Altura da linha",
-      small: "Pequeno",
-      medium: "M\xE9dio",
+      small: "Pequena",
+      medium: "M\xE9dia",
       large: "Grande",
       tableSettings: "Defini\xE7\xF5es de tabela",
       groupBy: "Agrupar por:",
@@ -112191,6 +112193,21 @@ var LocationQuickFilterRenderer_default = LocationQuickFilterRenderer;
 var StyledFilterPresetPopoverContent = styled4__default.default(coreReact.Popover.Content)`
   padding: ${coreReact.spacing.sm}px ${coreReact.spacing.lg}px;
 `;
+var StyledClearButton = styled4__default.default(coreReact.Button)`
+  position: absolute;
+  right: ${coreReact.spacing.md + coreReact.spacing.lg}px;
+  top: calc(36px / 2);
+  transform: translateY(-50%);
+  color: ${coreReact.colors.blue45};
+  &:hover,
+  &:focus {
+    color: ${coreReact.colors.blue45};
+    background: ${coreReact.colors.white};
+  }
+`;
+var StyledTriggerContainerWrapper = styled4__default.default.div`
+  position: relative;
+`;
 var getValueLabel = (isValueEmpty, value, placeholder, filterName) => {
   const prefixLabel = isValueEmpty ? placeholder || filterName : filterName;
   const valueLabel = value ? `${prefixLabel ? ": " : ""}${value}` : "";
@@ -112212,7 +112229,7 @@ var getSuperSelectFilterPreset = (columnDefinition) => {
         const ctx = coreReact.UNSAFE_useSuperSelectContext();
         const I18n = coreReact.useI18nContext();
         return /* @__PURE__ */ React80__default.default.createElement(
-          coreReact.Button,
+          StyledClearButton,
           {
             ...ctx.props.clear(),
             "aria-label": I18n.t("dataTable.filters.removeFilterToken", {
@@ -112237,6 +112254,11 @@ var getSuperSelectFilterPreset = (columnDefinition) => {
           filterName
         )));
       }),
+      TriggerContainerWrapper: React80__default.default.forwardRef(
+        (props, ref) => {
+          return /* @__PURE__ */ React80__default.default.createElement(StyledTriggerContainerWrapper, { ref, ...props });
+        }
+      ),
       TriggerContainer: React80__default.default.forwardRef(
         (props, ref) => {
           const ctx = coreReact.UNSAFE_useSuperSelectContext();
@@ -112250,11 +112272,31 @@ var getSuperSelectFilterPreset = (columnDefinition) => {
               }
             );
           }
+          const {
+            "aria-activedescendant": ariaActivedescendant,
+            "aria-controls": ariaControls,
+            "aria-expanded": ariaExpanded,
+            "aria-haspopup": ariaHaspopup,
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledby,
+            role,
+            tabIndex
+          } = ctx.props.multiInput();
+          const a11yProps = {
+            "aria-activedescendant": ariaActivedescendant,
+            "aria-controls": ariaControls,
+            "aria-expanded": ariaExpanded,
+            "aria-haspopup": ariaHaspopup,
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledby,
+            role,
+            tabIndex
+          };
           return /* @__PURE__ */ React80__default.default.createElement(
             coreReact.Popover,
             {
               placement: "top",
-              trigger: ctx.state.value.length > 1 ? "hover" : "none",
+              trigger: ctx.state.value.length > 1 ? ["hover", "focus"] : "none",
               overlay: /* @__PURE__ */ React80__default.default.createElement(StyledFilterPresetPopoverContent, null, /* @__PURE__ */ React80__default.default.createElement(coreReact.Typography, null, ctx.state.value.map((v) => {
                 const option = ctx.state.options.find(
                   (option2) => ctx.option.value(option2) === v
@@ -112267,6 +112309,7 @@ var getSuperSelectFilterPreset = (columnDefinition) => {
               {
                 $block: ctx.config.block,
                 ...props,
+                ...a11yProps,
                 ref
               }
             )
@@ -113112,6 +113155,7 @@ var ClientSideSearch = ({
   const { tableRef } = useInternalTableContext();
   const hasNoContent = useTableHasNoContent();
   const I18n = coreReact.useI18nContext();
+  const resolvedPlaceholder = placeholder || I18n.t("dataTable.search");
   const debouncedSetSearchValue = React80__default.default.useCallback(
     debounce5__default.default((value) => {
       var _a2;
@@ -113140,7 +113184,8 @@ var ClientSideSearch = ({
         "search--empty": !internalValue.length
       }),
       onChange,
-      placeholder: placeholder || I18n.t("dataTable.search")
+      placeholder: resolvedPlaceholder,
+      "aria-label": resolvedPlaceholder
     }
   ));
 };