Esri / calcite-design-system

A monorepo containing the packages for Esri's Calcite Design System
https://developers.arcgis.com/calcite-design-system/
Other
289 stars 76 forks source link

Respect hidden attribute added by end users on components #8623

Open driskull opened 10 months ago

driskull commented 10 months ago

Check existing issues

Actual Behavior

Some components toggle the hidden attribute which will override any user set hidden attribute on a component.

Expected Behavior

User added hidden attributes are respected on a component

Reproduction Sample

N/A Multiple components affected

Reproduction Steps

  1. See following components usage below

Reproduction Version

2.2.0

Relevant Info

Blocked issues: https://github.com/Esri/calcite-design-system/issues/8623

src/components/combobox/combobox.tsx:
  1041          const hidden = !find(item, filteredData);
  1042:         item.hidden = hidden;
  1043          const [parent, grandparent] = item.ancestors;

  1045          if (find(parent, filteredData) || find(grandparent, filteredData)) {
  1046:           item.hidden = false;
  1047          }

  1049          if (!hidden) {
  1050:           item.ancestors.forEach((ancestor) => (ancestor.hidden = false));
  1051          }

src/components/flow/flow.tsx:
  164          itemNode.showBackButton = itemNode === activeItem && newItemCount > 1;
  165:         itemNode.hidden = itemNode !== activeItem;
  166        });

src/components/stepper/stepper.tsx:
  412          if (index !== activePosition) {
  413:           item.hidden = true;
  414          } else {
  415:           item.hidden = false;
  416            item.multipleViewMode = false;

  426        this.items.forEach((item: HTMLCalciteStepperItemElement) => {
  427:         item.hidden = false;
  428          item.multipleViewMode = true;

src/components/table/table.tsx:
  355        const inView = rowPos >= this.pageStartRow && rowPos < this.pageStartRow + this.pageSize;
  356:       row.hidden = this.pageSize > 0 && !inView && !this.footRows.includes(row);
  357        row.lastVisibleRow =

src/components/tip-manager/tip-manager.tsx:
  201        tip.selected = isSelected;
  202:       tip.hidden = !isSelected;
  203      });

Regression?

No response

Priority impact

p2 - want for current milestone

Impact

No response

Calcite package

Esri team

N/A

jcfranco commented 8 months ago

Per our triage session, this can be converted into an epic if we need to split up component updates.

josercarcamo commented 6 months ago

For combobox.tsx, would the following be the correct logic when the hidden attribute is applied, regardless of the combobox logic to display/hide elements?

image

In other words, if the ancestor of an item has the "hidden" attribute, then the item is also hidden.

driskull commented 6 months ago

In other words, if the ancestor of an item has the "hidden" attribute, then the item is also hidden.

Yes, that is correct.