Commit graph

9 commits

Author SHA1 Message Date
Rajat Talesra
47ec373f16
Updated story book annotations (#18562)
* Updated story book annotations

* Updated story book annotations

* Storybook code updated for css

* Nit fix
2022-10-11 19:43:40 +05:30
Ridhwana
abeff25ec0
BETA version 2 of the Storybook Multi Input (Editing and Accessibility) (#17894)
* refactor: use the DefaultSelectionTemplate to list out the items

* refactor: rename function so that we map it to the deselect item event

* feat: first pass of adding edit functionality

* feat: update the name of the function from clearSelection to clearInput

* feat: setup the edit state by ensuring that we set the editValue and the inputPosition and then use useEffect to monitor changes

* chore: remove the old method in favour of a shared component

* feat: set the order of the items

* refactor: rename handleBlur function name to handleInputBlur

* feat: ensure that the edit field gets resized according to its current input

* feat: oops add inputSizerRef

* feat: when an item is being edited we need to ensure that it gets set back into the correct position and that we clear the previous state

* feat: handle the actual resizing fo the field on an input edit

* feat: use a shared DefaultSelectionTemplate for both the multiautocomplete and the multiinput component

* feat: make the defaultSelectionTemplate customizable based on the variant adn the classname

* feat: pressing backspace will start editing a previous selection if there is one

* feat: read out the selected items as its removed or edited

* feat: pass the regex through as a prop

* feat: move the functions around

* feat: add screen-reader only class

* Update app/javascript/crayons/MultiInput/__stories__/MultiInput.stories.jsx

Co-authored-by: Julianna Tetreault <32834804+juliannatetreault@users.noreply.github.com>

* Update app/javascript/crayons/MultiInput/MultiInput.jsx

Co-authored-by: Suzanne Aitchison <suzanne@forem.com>

* feat: add the props to JSDoc

Co-authored-by: Julianna Tetreault <32834804+juliannatetreault@users.noreply.github.com>
Co-authored-by: Suzanne Aitchison <suzanne@forem.com>
2022-06-23 15:41:45 +02:00
Suzanne Aitchison
648c86c612
Add prop for user-defined selections in MultiSelectAutocomplete (#17402)
* add new prop and update specs

* update storybook
2022-04-29 09:39:25 +01:00
Suzanne Aitchison
e6c4e3ba2e
ignore fetched suggestions if input already cleared (#17419) 2022-04-25 16:03:36 +01:00
dependabot[bot]
3f3b13f382
Bump @testing-library/user-event from 13.5.0 to 14.1.0 (#17253)
* Bump @testing-library/user-event from 13.5.0 to 14.1.0

Bumps [@testing-library/user-event](https://github.com/testing-library/user-event) from 13.5.0 to 14.1.0.
- [Release notes](https://github.com/testing-library/user-event/releases)
- [Changelog](https://github.com/testing-library/user-event/blob/main/CHANGELOG.md)
- [Commits](https://github.com/testing-library/user-event/compare/v13.5.0...v14.1)

---
updated-dependencies:
- dependency-name: "@testing-library/user-event"
  dependency-type: direct:development
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* refactor to account for breaking changes

* remove redundant cleanup

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Suzanne Aitchison <suzanne@forem.com>
2022-04-13 10:41:08 -06:00
Miguel Nieto A
148f242892
Replace listings tag component (#16855)
* wip

* feat:  Use MultiSelectAutocomplete for Tags

* feat:  Add additional tags for listings

* refactor: ♻️ Use preact/hooks and refactor propTypes

* fix: 🐛 Fix addiional tags support depending on the selected category

- Add slug to returned array in select_options_for_categories helper
- Differentiate the fields categoryId and categorySlug

* fix: 🐛 Adjust propTypes

* test: 🚨 Change test for select_options_for_categories helper

* refactor: ♻️ Apply requested changes

* refactor: ♻️ Remove border prop - default is true

* test: 🚨 Add test suite for ListingTagsField component

* refactor: ♻️ Apply requested changes

* refactor: ♻️ Remove unnecessary forEach + Improve code legibility

* docs: 📚 Remove topTags from hook documentation

* refactor: ♻️ Use the alias for crayons folder + Use loclaCompare in sort

* test: 🚨 Clean up mock response

* fix: 🐛 Reorder styles

* style: 🎨 Add comment to TagAutocompleteOption/Selection components
2022-03-30 16:51:40 +01:00
Nick Taylor
d227bbf770
Now <viewbox /> is preserved in SVGs when using the inline-react-svg plugin (#16287) 2022-01-24 16:25:14 -05:00
Suzanne Aitchison
222ce06f0f
Add new tag autocomplete to editor (#16025)
* add default placeholder, remove focus on first load

* fix some bugs re autofocus and mouse click to select

* allow custom selected styles to be passed in

* operate on objects with name property rather than plain strings

* WIP main functionality in place

* set default selections, allow a max to be placed on selections

* switch help context

* bug fixes to edit mode, static suggestions

* make sure suggestion resumes when edit begins

* cleanup and docs

* update existing form test

* add component tests

* add more component test cases

* refactor max selections flow, ensure default tag data only loads once

* stop removing combobox properties now the input stays visible

* add max selections test

* refactor

* make sure input refocus happens after blur event

* update cypress tests

* some small renames and doc changes

* only fetch exact matches from added tags

* fix test, update dark theme background

* set a max height on the popover, and ensure options can be scrolled into view

* woops - max height

* Update app/javascript/article-form/components/TagsField.jsx

Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>

* refactors

* stop dropdown from flickering

* use ButtonNew

* remove redundant variant

* nudge PR checks

Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>
2022-01-21 08:58:05 +00:00
Suzanne Aitchison
528bd2baa6
Tag autocomplete: storybook multi-select autocomplete component (#15796)
* core functionality in place

* fix dark theme background issues

* separate list for aria-live, add delete and blur functionality

* fix issue with input resize on edit

* handle input blur, prevent special characters, tweak keyup to keydown to ensure runs before change event

* group buttons and add default styles

* style tweaks

* fix logic error with insert index

* refactors

* clear suggestions on blur, even if no input value

* tweaks
2022-01-05 15:01:07 +00:00