Add DataClearFilters component #7025

taysea · 2023-11-20T22:32:07Z

What does this PR do?

DataClearFilters

Adds DataClearFilters component. The component allows the caller to drive where the "Clear Filters" button renders. This is useful in cases where the caller might have an exposed filter in a toolbar/elsewhere in the layout and isn't leveraging the default DataFilters behavior.
DataClearFilters accepts any button props. The only default behavior is that onClick it will call the clearFilters handler in DataContext.

DataClearFilters

// any Button props

Data

Added filtersCleared, setFiltersCleared to DataContext to allow DataFilters to know if it should clear out any filters as a result of the "DataClearFilters" control being clicked.
Removed updateOn prop. For clarity, this should just be managed by DataFilters which establishes a DataForm around a set of inputs.

Data

(removed prop)
- updateOn?: 'change' | 'submit';

DataFilters

If a user is rendering DataClearFilters somewhere in their layout, they may want the ability to "turn off" the automatic DataClearFilters that renders as part of DataFilters. This is handled by showClearFilters.
If a user is composing their own filters using multiple DataFilters, such as a use case with one exposed filter and the rest behind a layer panel, it is useful to be able to define the "updateOn" behavior per DataFilters (as opposed to just on the parent Data component).

DataFilters

+ showClearFilters?: boolean;
+ updateOn?: 'change' | 'submit';

Where should the reviewer start?

src/js/components/DataClearFilters/DataClearFilters.js

What testing has been done on this PR?

Tested locally with storybook + added unit tests.

How should this be manually tested?

With storybook.

Do Jest tests follow these best practices?

screen is used for querying.
The correct query is used. (Refer to this list of queries)
asFragment() is used for snapshot testing.

Any background context you want to provide?

What are the relevant issues?

Closes #6660

Screenshots (if appropriate)

Do the grommet docs need to be updated?

Yes.

Should this PR be mentioned in the release notes?

Yes.

Is this change backwards compatible or is it a breaking change?

Breaking change with removal of updateOn from Data. However, this is fine because the components are still in "beta".

taysea · 2023-11-21T17:38:57Z

src/js/components/DataFilters/DataFilters.js

+export const DataFilters = ({
+  drop,
+  children,
+  showClearFilters = true,


@halocline @jcfilben @MikeKingdom thoughts on this prop name?

any reason not to do something simple like clear?

Some of the initial thinking was the prop is really around whether or not to "show" the control -- sort of similar to Calendar's showAdjacentDays prop or SelectMultiple showSelectedInline. Even though the prop name is a bit more verbose, it feels like it's a little more clear on what it means. My worry with something like clear is that it's unclear if it's functioning as an action (if set to true, does it clear out the filters?) etc.

Would like to hear @jcfilben and @MikeKingdom 's reaction to this rationale.

Agree with leaning towards being more verbose/increased clarity rather than having a shorter prop name. I'm good with showClearFilters

After discussion, we will rename to clearFilters and remove show language. In general, grommet tries to avoid use of verbs/leading words in variable names to keep them simple. It also allows us better flexibility in the future if we want to extend this prop to accept more than just a boolean. Updated to reflected this.

taysea · 2023-11-21T17:40:14Z

src/js/components/DataClearFilters/stories/Simple.js

+          />
+        </DataFilter>
+      </DataFilters>
+      {filteredTotal !== total ? <DataClearFilters kind="toolbar" /> : null}


@halocline @MikeKingdom @jcfilben I have applied kind="toolbar" here but that's not the default treatment for the one in DataFilters. What treatment do we want? If toolbar, how should we adjust the one built-in to DataFilters?

I think we want the toolbar styling for both from what I recall

Agree to wanting it on both. Grommet doesn't currently have a toolbar button kind, that's just an HPE theme thing. Some questions I have then:

Should we introduce a toolbar kind into Grommet theme so we can automatically apply it to the built-in DataFilters?

If so, how do we do that since the base.js theme doesn't currently operate on the newer kind logic?

If we don't actually add a toolbar kind to base theme, is it still appropriate to add the prop internally to Grommet so the HPE theme can pick up on it?

@taysea can you schedule call to discuss? I'd like to brainstorm some options. One of which might be a theme property accepting any button props and getting spread onto the button ...buttonProps

Great, I scheduled a call for tomorrow.

After discussion, we will have a theme object that accepts kind which can be any button kind.

Added this in this commit: ca740f5

jcfilben · 2023-11-28T22:28:45Z

src/js/components/DataFilters/DataFilters.js

+  showClearFilters = true,
+  heading,
+  layer,
+  updateOn,


We already have an updateOn prop on Data that seems to only be applied to DataFilters. When I tested filters that were outside of DataFilters they did not seem to be affected by Data's updateOn prop. This is a little confusing if we have both updateOn on Data and on DataFilters and they are trying both to control DataFilters. I think I would want to chat through the updateOn prop a bit more and how we envision it being applied to different fields. Related PR that would also be good to discuss within this context: #7029

Good question. Summarizing our offline discussion here. Proposing that we remove updateOn at the global level since it doesn't provide much utility as soon as the caller enters into a compositional mode. And, it also doesn't provide much utility from the "configurable" standpoint either since toolbar determines the updateOn behavior. It's also a bit cleaner to keep the property "close" to what it's effecting. In the case of updateOn it only affects DataFilters.

Updating the PR to reflect this.

Pushed changes in this commit: e323f36

@halocline @MikeKingdom tagging to loop you in on this discussion and get any thoughts or concerns

jcfilben

This could be handled in a separate issue because I think it was already a problem before this PR, but if I have a defaultView set on Data I don't get an indication that a filter is applied and the 'clear filters' button doesn't show up

jcfilben

The DataSort/Simple story isn't working. We may need to add updateOn to DataSort as well.

Other than that and fixing the jest test snapshot I think everything looks good

jcfilben

Looks good!

britt6612 · 2023-12-08T20:24:09Z

src/js/components/Data/Data.js

@@ -28,7 +28,6 @@ export const Data = ({
  properties,
  toolbar,
  total,
-  updateOn = 'submit',


So there is no updateOn anymore for Data we will need to update
DataSearch/stories/simple.js
DataTableColumns/stories/simple.js

Good call, done.

britt6612 · 2023-12-08T20:38:21Z

src/js/components/DataClearFilters/stories/Simple.js

+          property="location"
+          // override theme margin to align with search + filter
+          contentProps={{ margin: { bottom: 'none', top: 'xsmall' } }}
+          margin="none"


Suggested change

margin="none"

Is this margin needed?

Kind of weird setup but margin="none" is for Grommet theme, contentProps is for HPE theme. I'll add a comment.

oh okay no wonder I didnt see a difference hence my questioning why it was there but thank you for clarifying

britt6612 · 2023-12-08T20:41:16Z

src/js/components/DataClearFilters/stories/Simple.js

+        <DataFilter
+          property="location"
+          // override theme margin to align with search + filter
+          contentProps={{ margin: { bottom: 'none', top: 'xsmall' } }}


feels like we could improve here with when the label is used then adjust margin so a user does not have to mess with passing something like this for margin

Yeah I think that could be an enhancement in future. Kind of tricky in terms of how we might handle because we don't always know how someone's theme is set up/what they'd want to override or not.

At least for MVP, someone can do this but agree it's not ideal.

agree thank you for adding that comment

britt6612

Looks good 🙌

* Gets the remove icon from theme (#6960) * Gets the remove icon from theme * Update src/js/components/Tag/Tag.js Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> --------- Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Improve event handler typings for Box (#6983) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Prevent row focus style for unclickable rows with onSelect (#6719) (#6985) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Improve event handler typings for Chart (#6984) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Updated v2.34.0 * upgrade dependencies (#7004) * Remove unnecessary useEffect (#7011) * Stop form submit event from bubbling up (#7005) * Stop form submit event from bubbling up * Add unit test * Use fireEvent * Use formRef to determine submission, let event bubble * Remove unneccessary .contains --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Updated v2.34.1 * Allow caller to specify step for DataFilter range (#6942) * Allow caller to specify step * Update PropTypes * Remove unnecessary snapshot * Fix sort * Use variable to be self documenting --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Remove suggestion to use UserEvent over FireEvent (#7023) * Update CONTRIBUTING.md * Update PULL_REQUEST_TEMPLATE.md * Update prop types and typescript types (#7028) * Update DataSummary messages object (#7022) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Align DataFilters layer to Design System best practices (#7021) * Align DataFilters layer to Design System best practices * Update snapshots * Update snapshots * Update test * Make DataFilter range inclusive of bounds (#7026) * Make datafilter range inclusive of bounds * adjust test with feedback from review * Enhance Data screen reader announcements and add search debounce (#7010) * Enhance Data screen reader announcements and add search debounce * Fix Data tests * Use fireEvent to fix timeout * Update src/js/components/Data/Data.js Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * Fix lint error --------- Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * add aria-label for inputs (#7038) * add aria-label for inputs * only for no form example * add updated snapshot * use undefined instead * add label to select --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * [Type] remove `onClick` from types of Box props (#7018) * remove onClick from types of Box props `onClick` type is inherited generically from IntrinsicElements and grommet is currently limiting the type. * remove onClick type dependency --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * upgrade minor dependencies (#7040) * upgrade major dependencies * revert testcafe * remove carrot on typsscript * remove carrot on testcafe --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Adjust NameValueList to account for xsmall screen size (#7047) * Adjust NameValueList to account for xsmall screen size * create isSmall util function * Fix Select focus when opening drop with search (#6901) (#6982) * Fix Select focus when opening drop with search (#6901) * Adjust bundle size for Select focus fix (#6901) --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Improve DataFilter and RangeSelector handling of floating point values (#7033) * Improve DataFilter range default label * Improve default behavior of DataFilter range label * When RangeSelector is reset to min/max set value to undefined * revert changes from previous commit * Fix floating point calculations * Remove arbitrary precision, calculate in integer math * Remove unused function --------- Co-authored-by: Jessica Filben <jessica.filben@gmail.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * add check if values are arrays (#7045) * add check if values are arrays * Update Form.js * add taylor suggestions * fix condition --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Update README.md (#7050) * Update README.md Update readme * Update README.md * Update README.md Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Update README.md * Update README.md Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Fixed handling of multi-level property names that are used as RangeSelectors in filters (#7049) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Add DataClearFilters component (#7025) * Add DataClearFilters component * Update snapshots * Rename showClearFilters to clearFilters * Remove onUpdate from Data, make associated refinements * Add data.button.kind to theme, remove hard coded kind=toolbar * Add updateOn change to noForm DataSort, fix test * Update snapshot * Remove updateOn on Data from stories --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * change datafilters default presentation with toolbar prop to layer (#7057) * add dataFormContext (#7053) * add dataFormContext * update test * Update src/js/components/DataSearch/DataSearch.js Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * fix package --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Adjust Data properties to add filter, sort, and search booleans (#7046) * Adjust Data properties to add filterable, sortable, and searchable * Based on discussion with dev team removed '-able' suffix from prop names to allow for future enhancements beyond boolean value * fix bundlesize * add test for sub objects with rangeselector (#7065) * add test for sub objects with rangeselector * Update src/js/components/DataFilters/__tests__/DataFilters-test.tsx Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Fix toolbar story (#7062) * fix toolbar story * fix toolbar story --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * Updated v2.34.2 * update dependencies (#7067) Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * Fix images accessibility violations (#7061) * fix: images accessibility violations * Update Simple.js * fix: starRating - typescript issues (#7073) * fix: starRating - typescript issues * Update index.d.ts * Remove use of `hoverIndicator` within Data (#7078) * Remove use of within Data * Resolve snapshots * SelectMultiple new options on search (#7079) * SelectMultiple new options on search * Incorporate feedback from review * remove story * update chromatic token (#7086) * Decouple DataFilters and DataSort, refine toolbar layout (#7080) * Decouple DataFilters and DataSort, refine toolbar layout * Make refinements to clear filters, toolbar * Refine clearFilters logic --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Refine DataFilters badge behavior for RangeSelector reset to min/max (#7083) * Refine DataFilters badge behavior for RangeSelector * Generalize event name * Alter approach to be more resilient to changing RangeSelector values * fix: Resolve hover styling and tooltip issue for DataSort control (#7069) * fix: Resolve hover styling and tooltip issue for DataSort control * fix: Resolve hover styling and tooltip issue for DataSort control * Removed undo changes button from DataForm (#7088) * remove undo changes button * remove undo changes button --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * update npm token name (#7087) * Fix groupHeader theming properties for DataTable (#6925) (#6986) * Fix groupHeader theming properties for DataTable (#6925) Had to update all existing DataTable test snapshots that involve the use of table grouping. They would have been created during states where row group header theme properties were not being passed through at all. * Update default groupHeader theme for backward compatibility (#6925) Test snapshots involving row groups for DataTable needed to be updated once more to reflect the change in default theme, which should ensure least surprise to any users of the component. --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Set min-width of DataFilters layer (#7094) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * DataSearch: Removed dependence on form (#7091) * Removed dependence on form for DataSearch * wrap search in a Box for sizing * Move debounce to utils and clear search on named view * update Data-test snapshots * Fixed a dependency cycle * Clear name view on search change if it has search term --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * fix: starRating - form value not synched (#7077) * fix: starRating - form value not synched * fix: starRating - form value not synched * add: new test case for start rating default value * reverted StarRating.js default value state * DataFilters -- display badge when view applied (#7084) * Display badge with view * Incorporate badge configuration * Removed dependence on form for DataSearch * Remove unused onTouched * Fix bug when range selector reset was still contributing to badge count * Include RangeSelector in clearEmpty logic to standardize when filters are removed from view object * Flatten to match filter name structure * Update src/js/components/Data/__tests__/Data-test.tsx * Update snapshots * Fix untouched Toolbar snapshot --------- Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Add jest tests for Data features (#7100) * Add jest tests for Data features * Fix test based on latest view badge work --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Adjust logic in DataClearFilters story (#7108) * Fix undefined case for DataFilter (#7111) * Fix undefined case for DataFilter * Update src/js/components/DataFilter/DataFilter.js Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Add test for adding additional options to SelectMultiple within onSearch (#7105) * Add test for adding additional options to SelectMultiple within onSearch * change test to use fireEvent instead of userEvent * move faketimers to additional options onSearch test * Implement DataSearch updateOn property (#7110) * Implement DataSearch updateOn property * Address review feedback * Address review feedback * Removed UpdateOnSubmit story from chromatic * fix missing props and typings for tag component (#7099) * fix missing props and typings for tag component * fix missing props and typings for tag component --------- Co-authored-by: sthpe <sulaymon.tajudeen@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * SelectMultiple i18n enhancements (#7104) * feat: add internationalization to selectMultiple * fix: spelling selectedCount * fix: spelling selectedCount * feat: update SelectionSummary with PR commetns * feat: add jest Test for custommessages * fix: remove messages from Basic Props * fix: add PR fix * Feat: add localization to aria text * feat: fix all PR commetnts * fix: Test * fix: update failing test snapshot * update snapshot * fix: pr comments & try fixing ci tests * fix: snapshots * remove comment * remove useless $ in locales * select messages key in alphabetical order * Removed dependence on form for DataSearch * selecMultiple.summarizedValue * selectMultiple.clearAll keys * selectMultiple.selectAll keys * selectMultiple.selected key * selectMultiple.selectedOfTotal key + fix dat-filter test selectAllA11y * selectMultiple.open key + fix clearAllA11y * selectMultiple.search key * SelectMultiple props/locales keys in alphabetical order * last multiple => summarizedValue * alphabetical order for selectMultiple proptypes * Update snapshots * Small refinements to SelectMultiple i18n work * Remove unsupported message * Refine Typescript/propTypes for backwards compatibility * Update src/js/components/SelectMultiple/index.d.ts Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> * Update src/js/components/SelectMultiple/propTypes.js * Alphabetize * selectDropDown --> selectDrop * Fix snapshots --------- Co-authored-by: jboeckle <jboeckle@imaschelling.com> Co-authored-by: dbo2019 <dominikpboeckle@gmail.com> Co-authored-by: Thibault Ollivier <thibault.ollivier@anyti.me> Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: tol-any <108674993+tol-any@users.noreply.github.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> * fix: Remove 'label' attribute from <label> tag (#7101) * Remove 'label' attribute from <label> tag * fix: Remove 'label' attribute from <label> tag * Reverted Simple.js * Align Data+friends propTypes/index.d.ts to latest behavior (#7116) * Remove unused Dataform message * misc cleanups * Fix * Add missing messages * Update src/js/components/Data/index.d.ts * Fix PropTypes syntax * Enhance DataSummary with selected messages (#7114) * Enhance DataSummary with selected messages * Increase bundlesize * Add propTypes/index.d.ts --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Fix DataTableColumns undefined case (#7117) * Check properties length before displaying data clear filters button (#7119) * Updated v2.35.0 * remove stable notification from storybook for data components (#7113) * remove stable notification from storybook for data components * Update src/js/components/DataView/stories/Simple.js Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * upgrade dependencies (#7124) Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * upgrade remaining dependencies (#7126) Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * Align Data + friends storybook examples with best practices (#7132) * Align storybook examples with best practices * Rename composed toolbar file * Add primaryKey to List theme (#7136) * fix(range): enables range wheel event override (#7130) * component(range input): adds wheel override to theme * Update src/js/components/RangeInput/__tests__/RangeInput-test.tsx Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * cr: removes unused import * fix(range): renames theme context variable * fix(range): address PR feedback --------- Co-authored-by: Tanner B. Hess Webber <tb@hesswebber.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Form field add max and threshold to validation (#6550) * feat: first commit * test: update snapshots * chore: updata README.md * chore: code review * chore: update validate threshold structure * chore: update story * test: update snapshot * feat: add default threshold * feat: update storybook * fix: FormField.js * chore: minor fixes * chore: change bundle maxSize to 160 kB * chore: minor changes * refactor: add format message * chore: update bundlesize * style: remove comment line * feat: update FormField threshold message * chore: update bundlesize * chore: fix bundlesize * feat: last changes * chore: update bundlesize * Adjust naming of messages * refactor: Form Threshold validation * refactor: minor changes * increase bundlesize --------- Co-authored-by: Jessica Filben <jessica.filben@gmail.com> Co-authored-by: Matt Glissmann <mdglissmann@gmail.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Upgrade Node Engine From 16 to 18 (#6937) * update node engine version * Updating Engine Version Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Remove engine-strict: true from package.json (#7141) * revert node version back to 16 (#7142) * fix: onOrder buttons should be selectable by hitting the 'Space' key (#7140) * fix: onOrder buttons should be selectable by hitting the 'Space' key * ref: added event.preventDefault onSpace * enhancement : preventDefault added to OnDown and OnUp calls (#7144) * fix: preventDefault added to OnDown and OnUp calls * revered changes package.json * Update package.json * Run form submit validation when submit is fired directly on input (#7148) * Run form submit validation when submit is fired directly on input * Add jest test * Remove .only * Add test workflow (#7150) * Remove chromatic token from package.json (#7151) * Remove chromatic token from package.json * Remove test workflow * Add CircleCI context for release and publish jobs (#7152) * Enhance Box `gap` to accept object with `row` and `column` (#7147) * add code to account for row and columngap * Update src/js/components/Box/__tests__/Box-layout-test.tsx Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Update src/js/components/Box/__tests__/Box-layout-test.tsx Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Update src/js/components/Box/propTypes.js Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Update src/js/components/Box/index.d.ts Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * fix feedback * address feedback * fix object passing through * fix if statement * Update src/js/components/Box/index.d.ts Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Readonly enhancement for TextInput and DateInput (#7123) * read only accessibility test * add readOnly styling and readOnlyCopy prop to DateInput and TextInput * update bundlesize * add tests * Remove icon from TextInput when in readOnly mode and ensure readonly styling is contained to TextInput and DateInput * incorporate review feedback * remove unnecessary aria-readonly prop * feedback from review * Refine styling and increase button click target * Fix SelectMultiple snapshosts * Remove extra readOnly prop * Fix formfield readOnlyCopy styling * Update src/js/components/TextInput/TextInput.js Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Anchor icon and icon-text has extra space fixed (#6534) * fix: Anchor icon fixed * fix: Anchor alignment fixed * refactor: box property Added Box styled as InlineBox for Anchro component only. * refactor: unused snippet removed. * test: Snapshot updated. * clean up unnessicary changes * Update propTypes.js * Update DropContainer.js * Update LayerContainer.js * Update RenderedList.js * Update Simple.tsx * Update index.d.ts * change inline box to icon only * needs vertical align bottom * fix: Anchor Icon and its alignment. * test: Snapshot updated * refactor: property position updated * test: Snapshots updated --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * fix: focus indicator for Layer's hidden anchor in Firefox (#7146) * fix: List focus via keyboard (#7143) * fix: List focus via keyboard * test: Update Snapshots * reafactor: item focus removed * test: Snapshot updated --------- Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * ensure window is available for when SSR (#7156) * Fix dropHeight of DataFilter SelectMultiple (#7157) * List keyboard behavior test and fix lint issues (#7158) * test list keyboard behavior with space and fix lint issues * Update src/js/components/List/__tests__/List-test.js * Pagination — Add `summary` and `stepOptions` (#7133) * add draft of stepselector * clean up code * add summary to one PR * add default value for when stepselector is boolean * add feedback set up points for disscussion for demo * add feedback set up points for disscussion for demo * take out unneeded comment * update code based on team feedback * fix feedback * Update src/js/languages/default.json Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * fix feedback * update values * add tests * change value name * add gap * add edgecase for 0 items * fix namig * clean up code logic * Update src/js/components/Pagination/Pagination.js Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * update tests * Update src/js/components/Pagination/__tests__/Pagination-test.tsx Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Update src/js/components/Pagination/PaginationStep.js Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * add valueLabel * incorporate Matts feedback * fix story * align gap with figma * Update src/js/components/Pagination/stories/Steps.js Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * update story * Update src/js/components/Pagination/stories/Steps.js Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * update bundle size * merge master --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * Updated v2.36.0 * test npm token (#7162) Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * update bundlesize --------- Co-authored-by: Vinod Krishna Vellampalli <vinodkv2511@gmail.com> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: jainex <jainexp017@gmail.com> Co-authored-by: Michael Huynh <43751307+miqh@users.noreply.github.com> Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Shimi <shimrit.yacobi@gmail.com> Co-authored-by: Basith <134603758+abdulbasithqb@users.noreply.github.com> Co-authored-by: Sulaymon333 <tjsulaymon@gmail.com> Co-authored-by: sthpe <sulaymon.tajudeen@hpe.com> Co-authored-by: jboeckle <jboeckle@imaschelling.com> Co-authored-by: dbo2019 <dominikpboeckle@gmail.com> Co-authored-by: Thibault Ollivier <thibault.ollivier@anyti.me> Co-authored-by: tol-any <108674993+tol-any@users.noreply.github.com> Co-authored-by: kid-icarus <ryan.kois@gmail.com> Co-authored-by: Tanner B. Hess Webber <tb@hesswebber.com> Co-authored-by: Gabriel Quaresma <j.quaresmasantos_98@hotmail.com> Co-authored-by: Joelo <82491084+phoenix-clauster@users.noreply.github.com> Co-authored-by: Umesh Verma <umeshiscreative@gmail.com>

* Styled components v6 (#6947) * Initial setup for styled components config approach * Add config to styled components * update snapshots * change additional component to use styled box instead of as={box} * RadioButton, CheckBox, and RangeInput fixes * Filter out kind from button and elevation from layer * adjust package.json to support styled components 5 or 6 * increase bundlesize * remove stylis from peerDependencies * remove stylis dependency * enable vendor prefixes * added grommet wrapper to tests * revert default props test * move styleSheetManager above themeContext * remove StyleSheetManager from Grommet component * update snapshots * update snapshots * Merge master * Dont run chromatic on styled-components-beta (#6990) * Sc fix a (#6993) * Add comment * Alter comment * Add comment 2 (#6992) * Add comment 2 * Align config to master * Update styled-components branch with master and add webkit-user-select to CheckBox (#6999) * Gets the remove icon from theme (#6960) * Gets the remove icon from theme * Update src/js/components/Tag/Tag.js Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> --------- Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Improve event handler typings for Box (#6983) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Prevent row focus style for unclickable rows with onSelect (#6719) (#6985) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Improve event handler typings for Chart (#6984) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Updated v2.34.0 * add webkit user select to CheckBox --------- Co-authored-by: Vinod Krishna Vellampalli <vinodkv2511@gmail.com> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: jainex <jainexp017@gmail.com> Co-authored-by: Michael Huynh <43751307+miqh@users.noreply.github.com> * Styled components beta minor change to trigger circleci (#7000) * minor change to trigger circleci * add comment to circleci config * Updated v2.35.0-alpha.1 * Update styled-components branch with master (#7163) * Gets the remove icon from theme (#6960) * Gets the remove icon from theme * Update src/js/components/Tag/Tag.js Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> --------- Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Improve event handler typings for Box (#6983) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Prevent row focus style for unclickable rows with onSelect (#6719) (#6985) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Improve event handler typings for Chart (#6984) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Updated v2.34.0 * upgrade dependencies (#7004) * Remove unnecessary useEffect (#7011) * Stop form submit event from bubbling up (#7005) * Stop form submit event from bubbling up * Add unit test * Use fireEvent * Use formRef to determine submission, let event bubble * Remove unneccessary .contains --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Updated v2.34.1 * Allow caller to specify step for DataFilter range (#6942) * Allow caller to specify step * Update PropTypes * Remove unnecessary snapshot * Fix sort * Use variable to be self documenting --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Remove suggestion to use UserEvent over FireEvent (#7023) * Update CONTRIBUTING.md * Update PULL_REQUEST_TEMPLATE.md * Update prop types and typescript types (#7028) * Update DataSummary messages object (#7022) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Align DataFilters layer to Design System best practices (#7021) * Align DataFilters layer to Design System best practices * Update snapshots * Update snapshots * Update test * Make DataFilter range inclusive of bounds (#7026) * Make datafilter range inclusive of bounds * adjust test with feedback from review * Enhance Data screen reader announcements and add search debounce (#7010) * Enhance Data screen reader announcements and add search debounce * Fix Data tests * Use fireEvent to fix timeout * Update src/js/components/Data/Data.js Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * Fix lint error --------- Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * add aria-label for inputs (#7038) * add aria-label for inputs * only for no form example * add updated snapshot * use undefined instead * add label to select --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * [Type] remove `onClick` from types of Box props (#7018) * remove onClick from types of Box props `onClick` type is inherited generically from IntrinsicElements and grommet is currently limiting the type. * remove onClick type dependency --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * upgrade minor dependencies (#7040) * upgrade major dependencies * revert testcafe * remove carrot on typsscript * remove carrot on testcafe --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Adjust NameValueList to account for xsmall screen size (#7047) * Adjust NameValueList to account for xsmall screen size * create isSmall util function * Fix Select focus when opening drop with search (#6901) (#6982) * Fix Select focus when opening drop with search (#6901) * Adjust bundle size for Select focus fix (#6901) --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Improve DataFilter and RangeSelector handling of floating point values (#7033) * Improve DataFilter range default label * Improve default behavior of DataFilter range label * When RangeSelector is reset to min/max set value to undefined * revert changes from previous commit * Fix floating point calculations * Remove arbitrary precision, calculate in integer math * Remove unused function --------- Co-authored-by: Jessica Filben <jessica.filben@gmail.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * add check if values are arrays (#7045) * add check if values are arrays * Update Form.js * add taylor suggestions * fix condition --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Update README.md (#7050) * Update README.md Update readme * Update README.md * Update README.md Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Update README.md * Update README.md Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Fixed handling of multi-level property names that are used as RangeSelectors in filters (#7049) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Add DataClearFilters component (#7025) * Add DataClearFilters component * Update snapshots * Rename showClearFilters to clearFilters * Remove onUpdate from Data, make associated refinements * Add data.button.kind to theme, remove hard coded kind=toolbar * Add updateOn change to noForm DataSort, fix test * Update snapshot * Remove updateOn on Data from stories --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * change datafilters default presentation with toolbar prop to layer (#7057) * add dataFormContext (#7053) * add dataFormContext * update test * Update src/js/components/DataSearch/DataSearch.js Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * fix package --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Adjust Data properties to add filter, sort, and search booleans (#7046) * Adjust Data properties to add filterable, sortable, and searchable * Based on discussion with dev team removed '-able' suffix from prop names to allow for future enhancements beyond boolean value * fix bundlesize * add test for sub objects with rangeselector (#7065) * add test for sub objects with rangeselector * Update src/js/components/DataFilters/__tests__/DataFilters-test.tsx Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Fix toolbar story (#7062) * fix toolbar story * fix toolbar story --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * Updated v2.34.2 * update dependencies (#7067) Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * Fix images accessibility violations (#7061) * fix: images accessibility violations * Update Simple.js * fix: starRating - typescript issues (#7073) * fix: starRating - typescript issues * Update index.d.ts * Remove use of `hoverIndicator` within Data (#7078) * Remove use of within Data * Resolve snapshots * SelectMultiple new options on search (#7079) * SelectMultiple new options on search * Incorporate feedback from review * remove story * update chromatic token (#7086) * Decouple DataFilters and DataSort, refine toolbar layout (#7080) * Decouple DataFilters and DataSort, refine toolbar layout * Make refinements to clear filters, toolbar * Refine clearFilters logic --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Refine DataFilters badge behavior for RangeSelector reset to min/max (#7083) * Refine DataFilters badge behavior for RangeSelector * Generalize event name * Alter approach to be more resilient to changing RangeSelector values * fix: Resolve hover styling and tooltip issue for DataSort control (#7069) * fix: Resolve hover styling and tooltip issue for DataSort control * fix: Resolve hover styling and tooltip issue for DataSort control * Removed undo changes button from DataForm (#7088) * remove undo changes button * remove undo changes button --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * update npm token name (#7087) * Fix groupHeader theming properties for DataTable (#6925) (#6986) * Fix groupHeader theming properties for DataTable (#6925) Had to update all existing DataTable test snapshots that involve the use of table grouping. They would have been created during states where row group header theme properties were not being passed through at all. * Update default groupHeader theme for backward compatibility (#6925) Test snapshots involving row groups for DataTable needed to be updated once more to reflect the change in default theme, which should ensure least surprise to any users of the component. --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Set min-width of DataFilters layer (#7094) Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * DataSearch: Removed dependence on form (#7091) * Removed dependence on form for DataSearch * wrap search in a Box for sizing * Move debounce to utils and clear search on named view * update Data-test snapshots * Fixed a dependency cycle * Clear name view on search change if it has search term --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * fix: starRating - form value not synched (#7077) * fix: starRating - form value not synched * fix: starRating - form value not synched * add: new test case for start rating default value * reverted StarRating.js default value state * DataFilters -- display badge when view applied (#7084) * Display badge with view * Incorporate badge configuration * Removed dependence on form for DataSearch * Remove unused onTouched * Fix bug when range selector reset was still contributing to badge count * Include RangeSelector in clearEmpty logic to standardize when filters are removed from view object * Flatten to match filter name structure * Update src/js/components/Data/__tests__/Data-test.tsx * Update snapshots * Fix untouched Toolbar snapshot --------- Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Add jest tests for Data features (#7100) * Add jest tests for Data features * Fix test based on latest view badge work --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Adjust logic in DataClearFilters story (#7108) * Fix undefined case for DataFilter (#7111) * Fix undefined case for DataFilter * Update src/js/components/DataFilter/DataFilter.js Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Add test for adding additional options to SelectMultiple within onSearch (#7105) * Add test for adding additional options to SelectMultiple within onSearch * change test to use fireEvent instead of userEvent * move faketimers to additional options onSearch test * Implement DataSearch updateOn property (#7110) * Implement DataSearch updateOn property * Address review feedback * Address review feedback * Removed UpdateOnSubmit story from chromatic * fix missing props and typings for tag component (#7099) * fix missing props and typings for tag component * fix missing props and typings for tag component --------- Co-authored-by: sthpe <sulaymon.tajudeen@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * SelectMultiple i18n enhancements (#7104) * feat: add internationalization to selectMultiple * fix: spelling selectedCount * fix: spelling selectedCount * feat: update SelectionSummary with PR commetns * feat: add jest Test for custommessages * fix: remove messages from Basic Props * fix: add PR fix * Feat: add localization to aria text * feat: fix all PR commetnts * fix: Test * fix: update failing test snapshot * update snapshot * fix: pr comments & try fixing ci tests * fix: snapshots * remove comment * remove useless $ in locales * select messages key in alphabetical order * Removed dependence on form for DataSearch * selecMultiple.summarizedValue * selectMultiple.clearAll keys * selectMultiple.selectAll keys * selectMultiple.selected key * selectMultiple.selectedOfTotal key + fix dat-filter test selectAllA11y * selectMultiple.open key + fix clearAllA11y * selectMultiple.search key * SelectMultiple props/locales keys in alphabetical order * last multiple => summarizedValue * alphabetical order for selectMultiple proptypes * Update snapshots * Small refinements to SelectMultiple i18n work * Remove unsupported message * Refine Typescript/propTypes for backwards compatibility * Update src/js/components/SelectMultiple/index.d.ts Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> * Update src/js/components/SelectMultiple/propTypes.js * Alphabetize * selectDropDown --> selectDrop * Fix snapshots --------- Co-authored-by: jboeckle <jboeckle@imaschelling.com> Co-authored-by: dbo2019 <dominikpboeckle@gmail.com> Co-authored-by: Thibault Ollivier <thibault.ollivier@anyti.me> Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: tol-any <108674993+tol-any@users.noreply.github.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> * fix: Remove 'label' attribute from <label> tag (#7101) * Remove 'label' attribute from <label> tag * fix: Remove 'label' attribute from <label> tag * Reverted Simple.js * Align Data+friends propTypes/index.d.ts to latest behavior (#7116) * Remove unused Dataform message * misc cleanups * Fix * Add missing messages * Update src/js/components/Data/index.d.ts * Fix PropTypes syntax * Enhance DataSummary with selected messages (#7114) * Enhance DataSummary with selected messages * Increase bundlesize * Add propTypes/index.d.ts --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Fix DataTableColumns undefined case (#7117) * Check properties length before displaying data clear filters button (#7119) * Updated v2.35.0 * remove stable notification from storybook for data components (#7113) * remove stable notification from storybook for data components * Update src/js/components/DataView/stories/Simple.js Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * upgrade dependencies (#7124) Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * upgrade remaining dependencies (#7126) Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * Align Data + friends storybook examples with best practices (#7132) * Align storybook examples with best practices * Rename composed toolbar file * Add primaryKey to List theme (#7136) * fix(range): enables range wheel event override (#7130) * component(range input): adds wheel override to theme * Update src/js/components/RangeInput/__tests__/RangeInput-test.tsx Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * cr: removes unused import * fix(range): renames theme context variable * fix(range): address PR feedback --------- Co-authored-by: Tanner B. Hess Webber <tb@hesswebber.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Form field add max and threshold to validation (#6550) * feat: first commit * test: update snapshots * chore: updata README.md * chore: code review * chore: update validate threshold structure * chore: update story * test: update snapshot * feat: add default threshold * feat: update storybook * fix: FormField.js * chore: minor fixes * chore: change bundle maxSize to 160 kB * chore: minor changes * refactor: add format message * chore: update bundlesize * style: remove comment line * feat: update FormField threshold message * chore: update bundlesize * chore: fix bundlesize * feat: last changes * chore: update bundlesize * Adjust naming of messages * refactor: Form Threshold validation * refactor: minor changes * increase bundlesize --------- Co-authored-by: Jessica Filben <jessica.filben@gmail.com> Co-authored-by: Matt Glissmann <mdglissmann@gmail.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Upgrade Node Engine From 16 to 18 (#6937) * update node engine version * Updating Engine Version Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Remove engine-strict: true from package.json (#7141) * revert node version back to 16 (#7142) * fix: onOrder buttons should be selectable by hitting the 'Space' key (#7140) * fix: onOrder buttons should be selectable by hitting the 'Space' key * ref: added event.preventDefault onSpace * enhancement : preventDefault added to OnDown and OnUp calls (#7144) * fix: preventDefault added to OnDown and OnUp calls * revered changes package.json * Update package.json * Run form submit validation when submit is fired directly on input (#7148) * Run form submit validation when submit is fired directly on input * Add jest test * Remove .only * Add test workflow (#7150) * Remove chromatic token from package.json (#7151) * Remove chromatic token from package.json * Remove test workflow * Add CircleCI context for release and publish jobs (#7152) * Enhance Box `gap` to accept object with `row` and `column` (#7147) * add code to account for row and columngap * Update src/js/components/Box/__tests__/Box-layout-test.tsx Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Update src/js/components/Box/__tests__/Box-layout-test.tsx Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Update src/js/components/Box/propTypes.js Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Update src/js/components/Box/index.d.ts Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * fix feedback * address feedback * fix object passing through * fix if statement * Update src/js/components/Box/index.d.ts Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Readonly enhancement for TextInput and DateInput (#7123) * read only accessibility test * add readOnly styling and readOnlyCopy prop to DateInput and TextInput * update bundlesize * add tests * Remove icon from TextInput when in readOnly mode and ensure readonly styling is contained to TextInput and DateInput * incorporate review feedback * remove unnecessary aria-readonly prop * feedback from review * Refine styling and increase button click target * Fix SelectMultiple snapshosts * Remove extra readOnly prop * Fix formfield readOnlyCopy styling * Update src/js/components/TextInput/TextInput.js Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> --------- Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * Anchor icon and icon-text has extra space fixed (#6534) * fix: Anchor icon fixed * fix: Anchor alignment fixed * refactor: box property Added Box styled as InlineBox for Anchro component only. * refactor: unused snippet removed. * test: Snapshot updated. * clean up unnessicary changes * Update propTypes.js * Update DropContainer.js * Update LayerContainer.js * Update RenderedList.js * Update Simple.tsx * Update index.d.ts * change inline box to icon only * needs vertical align bottom * fix: Anchor Icon and its alignment. * test: Snapshot updated * refactor: property position updated * test: Snapshots updated --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * fix: focus indicator for Layer's hidden anchor in Firefox (#7146) * fix: List focus via keyboard (#7143) * fix: List focus via keyboard * test: Update Snapshots * reafactor: item focus removed * test: Snapshot updated --------- Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * ensure window is available for when SSR (#7156) * Fix dropHeight of DataFilter SelectMultiple (#7157) * List keyboard behavior test and fix lint issues (#7158) * test list keyboard behavior with space and fix lint issues * Update src/js/components/List/__tests__/List-test.js * Pagination — Add `summary` and `stepOptions` (#7133) * add draft of stepselector * clean up code * add summary to one PR * add default value for when stepselector is boolean * add feedback set up points for disscussion for demo * add feedback set up points for disscussion for demo * take out unneeded comment * update code based on team feedback * fix feedback * Update src/js/languages/default.json Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> * fix feedback * update values * add tests * change value name * add gap * add edgecase for 0 items * fix namig * clean up code logic * Update src/js/components/Pagination/Pagination.js Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * update tests * Update src/js/components/Pagination/__tests__/Pagination-test.tsx Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> * Update src/js/components/Pagination/PaginationStep.js Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * add valueLabel * incorporate Matts feedback * fix story * align gap with figma * Update src/js/components/Pagination/stories/Steps.js Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * update story * Update src/js/components/Pagination/stories/Steps.js Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * update bundle size * merge master --------- Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Jessica Filben <54560994+jcfilben@users.noreply.github.com> Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> * Updated v2.36.0 * test npm token (#7162) Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> * update bundlesize --------- Co-authored-by: Vinod Krishna Vellampalli <vinodkv2511@gmail.com> Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: jainex <jainexp017@gmail.com> Co-authored-by: Michael Huynh <43751307+miqh@users.noreply.github.com> Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Shimi <shimrit.yacobi@gmail.com> Co-authored-by: Basith <134603758+abdulbasithqb@users.noreply.github.com> Co-authored-by: Sulaymon333 <tjsulaymon@gmail.com> Co-authored-by: sthpe <sulaymon.tajudeen@hpe.com> Co-authored-by: jboeckle <jboeckle@imaschelling.com> Co-authored-by: dbo2019 <dominikpboeckle@gmail.com> Co-authored-by: Thibault Ollivier <thibault.ollivier@anyti.me> Co-authored-by: tol-any <108674993+tol-any@users.noreply.github.com> Co-authored-by: kid-icarus <ryan.kois@gmail.com> Co-authored-by: Tanner B. Hess Webber <tb@hesswebber.com> Co-authored-by: Gabriel Quaresma <j.quaresmasantos_98@hotmail.com> Co-authored-by: Joelo <82491084+phoenix-clauster@users.noreply.github.com> Co-authored-by: Umesh Verma <umeshiscreative@gmail.com> * add context to release styled components stable * remove beta steps from config * Merge master into styled-components-beta * increase bundlesize --------- Co-authored-by: Taylor Seamans <taylor.seamans@yahoo.com> Co-authored-by: Vinod Krishna Vellampalli <vinodkv2511@gmail.com> Co-authored-by: Mike Kingdom <michael.kingdom@hpe.com> Co-authored-by: jainex <jainexp017@gmail.com> Co-authored-by: Michael Huynh <43751307+miqh@users.noreply.github.com> Co-authored-by: Matthew Glissmann <mdglissmann@gmail.com> Co-authored-by: Brittany <42451602+britt6612@users.noreply.github.com> Co-authored-by: Brittany Archibeque <brittanyarchibeque@Brittanys-MacBook-Pro-2.local> Co-authored-by: Shimi <shimrit.yacobi@gmail.com> Co-authored-by: Basith <134603758+abdulbasithqb@users.noreply.github.com> Co-authored-by: Sulaymon333 <tjsulaymon@gmail.com> Co-authored-by: sthpe <sulaymon.tajudeen@hpe.com> Co-authored-by: jboeckle <jboeckle@imaschelling.com> Co-authored-by: dbo2019 <dominikpboeckle@gmail.com> Co-authored-by: Thibault Ollivier <thibault.ollivier@anyti.me> Co-authored-by: tol-any <108674993+tol-any@users.noreply.github.com> Co-authored-by: kid-icarus <ryan.kois@gmail.com> Co-authored-by: Tanner B. Hess Webber <tb@hesswebber.com> Co-authored-by: Gabriel Quaresma <j.quaresmasantos_98@hotmail.com> Co-authored-by: Joelo <82491084+phoenix-clauster@users.noreply.github.com> Co-authored-by: Umesh Verma <umeshiscreative@gmail.com>

taysea added 2 commits November 20, 2023 14:20

Add DataClearFilters component

c97a531

Update snapshots

d22c248

taysea requested review from halocline, jcfilben and MikeKingdom November 20, 2023 22:32

taysea commented Nov 21, 2023

View reviewed changes

jcfilben reviewed Nov 28, 2023

View reviewed changes

taysea added 3 commits November 29, 2023 11:56

Merge branch 'master' into 6660-clearfilters

087c683

Rename showClearFilters to clearFilters

a3877fe

Remove onUpdate from Data, make associated refinements

e323f36

jcfilben added the PRty Biweekly PR reviews by grommet team with hoping of closing such PRs label Nov 30, 2023

Add data.button.kind to theme, remove hard coded kind=toolbar

ca740f5

taysea requested a review from jcfilben December 1, 2023 18:26

Merge branch 'master' into 6660-clearfilters

df5a71f

jcfilben reviewed Dec 1, 2023

View reviewed changes

jcfilben removed the PRty Biweekly PR reviews by grommet team with hoping of closing such PRs label Dec 1, 2023

taysea added 2 commits December 6, 2023 15:14

Merge branch 'master' into 6660-clearfilters

411ad45

Add updateOn change to noForm DataSort, fix test

4740f3d

taysea requested a review from jcfilben December 6, 2023 23:19

taysea added 2 commits December 7, 2023 08:50

Merge branch 'master' into 6660-clearfilters

2b931a8

Update snapshot

66e1011

taysea requested a review from britt6612 December 7, 2023 17:34

jcfilben approved these changes Dec 7, 2023

View reviewed changes

britt6612 reviewed Dec 8, 2023

View reviewed changes

Remove updateOn on Data from stories

c37d3c5

taysea requested a review from britt6612 December 9, 2023 00:14

britt6612 approved these changes Dec 9, 2023

View reviewed changes

Merge branch 'master' into 6660-clearfilters

0fe143d

jcfilben merged commit 2bceabd into grommet:master Dec 9, 2023

taysea mentioned this pull request Dec 12, 2023

Add toolbar kind to data object grommet/grommet-theme-hpe#374

Merged

jcfilben mentioned this pull request Dec 13, 2023

Added DataClearFilters component grommet/grommet-designer#132

Merged

Add DataClearFilters component #7025

Add DataClearFilters component #7025

Uh oh!

Conversation

taysea commented Nov 20, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What does this PR do?

Where should the reviewer start?

What testing has been done on this PR?

How should this be manually tested?

Do Jest tests follow these best practices?

Any background context you want to provide?

What are the relevant issues?

Screenshots (if appropriate)

Do the grommet docs need to be updated?

Should this PR be mentioned in the release notes?

Is this change backwards compatible or is it a breaking change?

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

taysea Nov 29, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jcfilben left a comment

Choose a reason for hiding this comment

Uh oh!

jcfilben left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jcfilben left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

taysea commented Nov 20, 2023 •

edited

Loading

taysea Nov 29, 2023 •

edited

Loading

jcfilben left a comment •

edited

Loading