add new S2 components to example apps #7111

reidbarber · 2024-09-27T16:54:37Z

Adds Table, Accordion/Disclosure, SegmentedControl to S2 example apps.

✅ Pull Request Checklist:

Included link to corresponding React Spectrum GitHub Issue.
Added/updated unit tests and storybook for this change (for new code or code which already has tests).
Filled out test instructions.
Updated documentation (if it already exists for this component).
Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

🧢 Your Project:

* Esbuild starter

Co-authored-by: Yihui Liao <[email protected]> Co-authored-by: Rob Snow <[email protected]>

Co-authored-by: Yihui Liao <[email protected]>

* add range slider * add slider and range slider * text align output value * export range slider props * export styles to range slider * implement thick track and precise thumb * fix thumb label in stories * add dragging styles * add slider to form stories * update hcm, export track, condense tracks * update disabled thumb hcm, add overrides, add stories, range slider form context * prevent thumbs from getting stuck at max/min * add pressStyle to slider thumb * update press scale, align output in form * remove optional * fix stories, prevent output from wiggling --------- Co-authored-by: Yihui Liao <[email protected]> Co-authored-by: Rob Snow <[email protected]>

* add license script * add license to files --------- Co-authored-by: Yihui Liao <[email protected]>

* initial ContextualHelp implementation * Adding ContextualHelp to FieldLabel * fix crash in textfield contextual help story * Updating ContextualHelp positioning in FieldLabel * field label and contextual help button sizes match * adding contextualhelp to monopackage for release * storybook autodocs working * Improving ContextualHelp positioning * adding combobox contextualhelp story * Improving popover focus * Improving popover focus * Improving contextual help placement in field and aria labeling * updating links to have hrefs * Fixing button context and popover style * updated useId and aria-label in field label --------- Co-authored-by: Kyle Taborski <[email protected]> Co-authored-by: danilu <[email protected]>

* Adding react-aria/i18n to package for Slider (build fix) * alphabetize --------- Co-authored-by: Kyle Taborski <[email protected]>

* initial Breadcrumbs work * improve link styles * simplify styles * add flex to macro * fix multiline * more style improvements * allow more link props * pass down link props * remove s2 link context and styles added * remove underline for disabled link * review follow-up * use marginStart: text-to-visual for chevron * remove design link * remove shorthand flex from theme * remove nav wrapper * update styles * spread props onto RAC breadcrumbs * add onAction story * add styles to Heading * ad Heading story to Breadcrumbs * fixing breadcrumb vertical padding when multiline only had to change the height, the gap between the top and current breadcrumb is already provided by the row gap of 4 which equals the breadcrumbs-start-edge-to-truncated-menu value in the spec. This value is also moreaccurate than the 9px they have for top-text-to-to-bottom-text since it starts at the bottom of the breadcrumb box * fix active style, chevron centering, and tentative styles for multiline see comments for uncertainties with margins and multiline in design * update default, wrapper padding, and isMultiLine sizing as per design feedback * review comments * fix Safari focus ring cut off * get rid of default heading styling for now --------- Co-authored-by: Reid Barber <[email protected]> Co-authored-by: danilu <[email protected]>

* slider follow-up from testing * add thumbStyle * pull shared styling out * use size * add size to more places * fix l sizing --------- Co-authored-by: Yihui Liao <[email protected]> Co-authored-by: Kyle Taborski <[email protected]>

Co-authored-by: Kyle Taborski <[email protected]>

* clean up storybook docs prop tables * remove designs addon * add Events category to CheckboxGroup --------- Co-authored-by: Reid Barber <[email protected]>

Co-authored-by: Reid Barber <[email protected]>

* Fix InlineAlert heading render in Dialog, use contexts from s2 where applicable * fix tag group

…er (#187) * Adding ContextualHelp to Slider, RangeSlider, TagGroup, and ColorSlider * removing thumbLabels from stories --------- Co-authored-by: Kyle Taborski <[email protected]>

* Fix menu zindex issue

* Numberfield initial work * feedback updates * mroe feedback updates * make expanded state the default state * update styles * quick color and size adjustments * fixes for safari bug --------- Co-authored-by: Rob Snow <[email protected]>

* Fix Checkbox default slot * fix lint

* Decrease chance of hitting timeouts on table tests * move throw outside of act * fix TS

* initialize github actions * update linting code * update comment * update wip regex * add link to pr naming guide * cache yarn? * update frozen-lockfile to immutable for yarn 4 * try caching node modules * remove hardened mode, testing to see yarn install time * remove action, use workflow only

cant use transparent for the default quiet row state, need a opaque color to hide scrolled text

* docs: add contributing Q & A section * Update CONTRIBUTING.md Try without specifying language * Apply suggestions from code review Co-authored-by: Robert Snow <[email protected]> --------- Co-authored-by: Reid Barber <[email protected]> Co-authored-by: Yihui Liao <[email protected]> Co-authored-by: Robert Snow <[email protected]>

* Ensure `Dialog` has the `data-rac` attribute * cleanup

Co-authored-by: Reid Barber <[email protected]>

…e header (#7179) * update s2 accordion api * fix lint * rename to disclosure title, context for action button * fix lint * remove console log * fix typscript * allow disclosure title to wrap header * add chromatic stories * make code more concise * fix lint * fix chromatic stories --------- Co-authored-by: Robert Snow <[email protected]>

* docs: disclosure hooks * docs types * move DisclosureGroup to useDisclosureGroupState docs page * add anatomy diagram from #7165 to useDisclosure docs * expand on hidden="until-found" * fix interface tables * Revert "move DisclosureGroup to useDisclosureGroupState docs page" This reverts commit 8216354.

…7166) * add tailwind starter for Disclosure and DisclosureGroup * fix focus ring border radius * update disabled chevron style * fix focus ring in group * cleanup variants and styles * fix text color * fix padding * move DisclosureGroup to it's own story --------- Co-authored-by: Robert Snow <[email protected]> Co-authored-by: Daniel Lu <[email protected]>

* initial accordion docs * more v3 disclosure docs * add rac disclosure and disclosure group docs * add anatomy diagrams and example cards * remove disclosure children to be required * edits * update wording * edits * add inline styles * use heading, couple edits * use title instead of label, add to advance customization section * add example to disclosure group

* Update linting * Update jest.config.js

* support hidden="until-found" in DisclosureGroup * typescript * cleanup * useLayoutEffect and RAF * add RAF/flushSync * lint * add comments * remove extra changes from merge * revert newlines * typescript * more typescript * use DisclosureTitle

* RAC Disclosure SSR tests * tests for nested disclosures and interactive adjacent elements * DisclosurePanel: add DOMProps and render props type/table * update v3 stories and chromatic * update v3 Accordion deps * add v3 Accordion SSR test * update DisclosureGroupProps type to remove collection in jsdoc * more v3 accordion tests * yarn.lock * lint * add isQuiet to v3 Accordion/Disclosure * add focus ring style * update stories/chromatic * lint * remove active outline * lint * add isQuiet to v3 docs

* fix: eslint speed up * use the kindly published fixed version

…dobe/react-spectrum into s2-example-apps-new-components

rspbot · 2024-10-23T15:47:44Z

Build successful! 🎉

reidbarber · 2024-10-23T20:08:04Z

Closed in favor of #7244

devongovett and others added 30 commits May 17, 2024 13:41

Update lightningcss (#155)

ae9c491

Update to latest Spectrum Tokens (#157)

a592dce

Fix custom field width (#146)

11fe2bb

Add color picker components (#158)

1048928

Esbuild starter (#112)

ef933d8

* Esbuild starter

Remove figma references (#164)

98dc37b

Update InlineAlert (#163)

438dddf

should be able to apply width to tag group + truncate behavior (#149)

7c39cdf

Co-authored-by: Yihui Liao <[email protected]> Co-authored-by: Rob Snow <[email protected]>

clean up stories (#166)

ee4eb6f

Co-authored-by: Yihui Liao <[email protected]>

Add license (#171)

dd306f9

* add license script * add license to files --------- Co-authored-by: Yihui Liao <[email protected]>

Fix inline alert notice variant icon color (#174)

386dcc4

Adding react-aria/i18n to package for Slider (build fix) (#179)

c401600

* Adding react-aria/i18n to package for Slider (build fix) * alphabetize --------- Co-authored-by: Kyle Taborski <[email protected]>

fix default size mentioned in description for ContextualHelp (#180)

34e3fa0

Slider follow-up from testing (#176)

601da3a

* slider follow-up from testing * add thumbStyle * pull shared styling out * use size * add size to more places * fix l sizing --------- Co-authored-by: Yihui Liao <[email protected]> Co-authored-by: Kyle Taborski <[email protected]>

Limit the ContextualHelp ActionButton size to S and XS (#183)

3a39778

Co-authored-by: Kyle Taborski <[email protected]>

Clean up docs build props tables (#182)

4386b21

* clean up storybook docs prop tables * remove designs addon * add Events category to CheckboxGroup --------- Co-authored-by: Reid Barber <[email protected]>

remove isMultiline variant from Breadcrumbs (#184)

208cfb4

Co-authored-by: Reid Barber <[email protected]>

Fix InlineAlert heading render in Dialog and use contexts from s2 (#185)

bd39f29

* Fix InlineAlert heading render in Dialog, use contexts from s2 where applicable * fix tag group

Adding ContextualHelp to Slider, RangeSlider, TagGroup, and ColorSlid…

60cdad6

…er (#187) * Adding ContextualHelp to Slider, RangeSlider, TagGroup, and ColorSlider * removing thumbLabels from stories --------- Co-authored-by: Kyle Taborski <[email protected]>

Update API diff (#186)

2bf4761

Fix output styles in ProgressBar and Meter (#188)

8409541

Fix field width with long labels (#189)

af3f5c4

Fix ColorSlider and RangeSlider bugs (#190)

d2d46ca

0.2.0

c360e01

Adding contextual help stories to docs build (#191)

7b0e2f8

Fix menu zindex issue (#194)

841928c

* Fix menu zindex issue

NumberField (#168)

371f22f

* Numberfield initial work * feedback updates * mroe feedback updates * make expanded state the default state * update styles * quick color and size adjustments * fixes for safari bug --------- Co-authored-by: Rob Snow <[email protected]>

snowystinger and others added 27 commits October 15, 2024 21:10

fix: add Checkbox default slot to GridList and Table (#7188)

f77152e

* Fix Checkbox default slot * fix lint

Fix NumberParser getSymbols rounding support (#7186)

f459c18

Decrease timeouts in test utils (#7102)

7a9c220

* Decrease chance of hitting timeouts on table tests * move throw outside of act * fix TS

Mask the contents of a scrolled row for a quiet table (#7193)

0d0e21b

cant use transparent for the default quiet row state, need a opaque color to hide scrolled text

fix: ensure Dialog has the data-rac attribute (#7189)

9152d83

* Ensure `Dialog` has the `data-rac` attribute * cleanup

Set default value for type parameter in SelectProps (#7014)

e1b72a7

Co-authored-by: Reid Barber <[email protected]>

chore: Update linting (#7201)

0ddbe6f

* Update linting * Update jest.config.js

fix(examples): s2 dialog's weren't closing (#7219)

a56a735

chore: eslint speed up (#7222)

cbac9c0

* fix: eslint speed up * use the kindly published fixed version

fix dialog codemod close function (#7233)

68e3057

add new components to example apps

3a941ab

remove branch filters

4d2ec4d

fix macro import

61859b0

update CarView styles

8619ac2

fix card pickers

71c8b97

fix cardview height and react import

46643d2

add branch filters back

dff1ca5

readme typos

9bbb6a3

Merge branch 's2-example-apps-new-components' of https://github.com/a…

7755138

…dobe/react-spectrum into s2-example-apps-new-components

reidbarber closed this Oct 23, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

add new S2 components to example apps #7111

add new S2 components to example apps #7111

reidbarber commented Sep 27, 2024

rspbot commented Oct 23, 2024

reidbarber commented Oct 23, 2024

add new S2 components to example apps #7111

add new S2 components to example apps #7111

Conversation

reidbarber commented Sep 27, 2024

✅ Pull Request Checklist:

📝 Test Instructions:

🧢 Your Project:

rspbot commented Oct 23, 2024

reidbarber commented Oct 23, 2024