@rei/cedar 15.0.0 → 15.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/README.md +6 -39
  2. package/dist/cdr-fonts.css +12 -0
  3. package/dist/cdr-reset.css +1 -1
  4. package/dist/cdr-style.css +1 -1
  5. package/dist/cedar.umd.js +5 -5
  6. package/dist/component-docgen.json +2215 -2215
  7. package/dist/icon-component-docgen.json +667 -667
  8. package/dist/src/components/abstract/styles/CdrAbstract.module.scss.mjs +1 -1
  9. package/dist/src/components/accordion/styles/CdrAccordion.module.scss.mjs +29 -29
  10. package/dist/src/components/accordion/styles/CdrAccordionGroup.module.scss.mjs +2 -2
  11. package/dist/src/components/banner/styles/CdrBanner.module.scss.mjs +14 -14
  12. package/dist/src/components/breadcrumb/styles/CdrBreadcrumb.module.scss.mjs +7 -7
  13. package/dist/src/components/button/styles/CdrButton.module.scss.mjs +31 -31
  14. package/dist/src/components/caption/styles/CdrCaption.module.scss.mjs +2 -2
  15. package/dist/src/components/card/styles/CdrCard.module.scss.mjs +1 -1
  16. package/dist/src/components/checkbox/styles/CdrCheckbox.module.scss.mjs +27 -27
  17. package/dist/src/components/chip/styles/CdrChip.module.scss.mjs +4 -4
  18. package/dist/src/components/chip/styles/CdrChipGroup.module.scss.mjs +4 -4
  19. package/dist/src/components/choreographer/styles/CdrChoreographer.module.scss.mjs +4 -4
  20. package/dist/src/components/container/styles/CdrContainer.module.scss.mjs +2 -2
  21. package/dist/src/components/formError/styles/CdrFormError.module.scss.mjs +2 -2
  22. package/dist/src/components/formGroup/styles/CdrFormGroup.module.scss.mjs +8 -8
  23. package/dist/src/components/grid/styles/CdrGrid.module.scss.mjs +21 -21
  24. package/dist/src/components/icon/styles/CdrIcon.module.scss.mjs +12 -12
  25. package/dist/src/components/image/styles/CdrImg.module.scss.mjs +1 -1
  26. package/dist/src/components/input/styles/CdrInput.module.scss.mjs +32 -32
  27. package/dist/src/components/kicker/styles/CdrKicker.module.scss.mjs +1 -1
  28. package/dist/src/components/labelStandalone/styles/CdrLabelStandalone.module.scss.mjs +12 -12
  29. package/dist/src/components/labelWrapper/styles/CdrLabelWrapper.module.scss.mjs +25 -25
  30. package/dist/src/components/landingLead/styles/CdrHeadingSubheadingBlock.module.scss.mjs +4 -4
  31. package/dist/src/components/landingLead/styles/CdrLandingLead.module.scss.mjs +8 -3
  32. package/dist/src/components/link/styles/CdrLink.module.scss.mjs +3 -3
  33. package/dist/src/components/list/styles/CdrList.module.scss.mjs +5 -5
  34. package/dist/src/components/modal/styles/CdrModal.module.scss.mjs +12 -12
  35. package/dist/src/components/pagination/styles/CdrPagination.module.scss.mjs +53 -53
  36. package/dist/src/components/picture/styles/CdrPicture.module.scss.mjs +2 -2
  37. package/dist/src/components/popover/styles/CdrPopover.module.scss.mjs +63 -63
  38. package/dist/src/components/popup/styles/CdrPopup.module.scss.mjs +14 -14
  39. package/dist/src/components/quote/styles/CdrQuote.module.scss.mjs +4 -4
  40. package/dist/src/components/radio/styles/CdrRadio.module.scss.mjs +27 -27
  41. package/dist/src/components/rating/styles/CdrRating.module.scss.mjs +44 -44
  42. package/dist/src/components/select/styles/CdrSelect.module.scss.mjs +42 -42
  43. package/dist/src/components/skeleton/styles/CdrSkeleton.module.scss.mjs +1 -1
  44. package/dist/src/components/skeleton/styles/CdrSkeletonBone.module.scss.mjs +7 -7
  45. package/dist/src/components/splitSurface/styles/CdrSplitSurface.module.scss.mjs +5 -5
  46. package/dist/src/components/switch/styles/CdrSwitch.module.scss.mjs +8 -8
  47. package/dist/src/components/table/styles/CdrTable.module.scss.mjs +13 -13
  48. package/dist/src/components/tabs/styles/CdrTabPanel.module.scss.mjs +5 -5
  49. package/dist/src/components/tabs/styles/CdrTabs.module.scss.mjs +28 -28
  50. package/dist/src/components/text/presets/styles/CdrBody.module.scss.mjs +1 -1
  51. package/dist/src/components/text/presets/styles/CdrEyebrow.module.scss.mjs +1 -1
  52. package/dist/src/components/text/presets/styles/CdrHeadingDisplay.module.scss.mjs +1 -1
  53. package/dist/src/components/text/presets/styles/CdrHeadingSans.module.scss.mjs +1 -1
  54. package/dist/src/components/text/presets/styles/CdrHeadingSerif.module.scss.mjs +1 -1
  55. package/dist/src/components/text/presets/styles/CdrSubheadingSans.module.scss.mjs +1 -1
  56. package/dist/src/components/text/presets/styles/CdrUtilitySans.module.scss.mjs +1 -1
  57. package/dist/src/components/text/presets/styles/CdrUtilitySerif.module.scss.mjs +1 -1
  58. package/dist/src/components/text/styles/CdrText.module.scss.mjs +1 -1
  59. package/dist/src/components/title/styles/CdrTitle.module.scss.mjs +1 -1
  60. package/dist/src/components/toast/styles/CdrToast.module.scss.mjs +57 -57
  61. package/dist/src/components/toggleButton/styles/CdrToggleButton.module.scss.mjs +2 -2
  62. package/dist/src/components/toggleButton/styles/CdrToggleGroup.module.scss.mjs +5 -5
  63. package/dist/src/components/tooltip/styles/CdrTooltip.module.scss.mjs +16 -16
  64. package/dist/style/cdr-abstract.css +1 -1
  65. package/dist/style/cdr-accordion-group.css +1 -1
  66. package/dist/style/cdr-accordion.css +1 -1
  67. package/dist/style/cdr-banner.css +1 -1
  68. package/dist/style/cdr-body.css +1 -1
  69. package/dist/style/cdr-breadcrumb.css +1 -1
  70. package/dist/style/cdr-button.css +1 -1
  71. package/dist/style/cdr-caption.css +1 -1
  72. package/dist/style/cdr-card.css +1 -1
  73. package/dist/style/cdr-checkbox.css +1 -1
  74. package/dist/style/cdr-chip-group.css +1 -1
  75. package/dist/style/cdr-chip.css +1 -1
  76. package/dist/style/cdr-choreographer.css +1 -1
  77. package/dist/style/cdr-container.css +1 -1
  78. package/dist/style/cdr-eyebrow.css +1 -1
  79. package/dist/style/cdr-form-error.css +1 -1
  80. package/dist/style/cdr-form-group.css +1 -1
  81. package/dist/style/cdr-grid.css +1 -1
  82. package/dist/style/cdr-heading-display.css +1 -1
  83. package/dist/style/cdr-heading-sans.css +1 -1
  84. package/dist/style/cdr-heading-serif.css +1 -1
  85. package/dist/style/cdr-heading-subheading-block.css +1 -1
  86. package/dist/style/cdr-icon.css +1 -1
  87. package/dist/style/cdr-img.css +1 -1
  88. package/dist/style/cdr-input.css +1 -1
  89. package/dist/style/cdr-kicker.css +1 -1
  90. package/dist/style/cdr-label-standalone.css +1 -1
  91. package/dist/style/cdr-label-wrapper.css +1 -1
  92. package/dist/style/cdr-landing-lead.css +1 -1
  93. package/dist/style/cdr-link.css +1 -1
  94. package/dist/style/cdr-list.css +1 -1
  95. package/dist/style/cdr-modal.css +1 -1
  96. package/dist/style/cdr-pagination.css +1 -1
  97. package/dist/style/cdr-picture.css +1 -1
  98. package/dist/style/cdr-popover.css +1 -1
  99. package/dist/style/cdr-popup.css +1 -1
  100. package/dist/style/cdr-quote.css +1 -1
  101. package/dist/style/cdr-radio.css +1 -1
  102. package/dist/style/cdr-rating.css +1 -1
  103. package/dist/style/cdr-select.css +1 -1
  104. package/dist/style/cdr-skeleton-bone.css +1 -1
  105. package/dist/style/cdr-skeleton.css +1 -1
  106. package/dist/style/cdr-split-surface.css +1 -1
  107. package/dist/style/cdr-subheading-sans.css +1 -1
  108. package/dist/style/cdr-switch.css +1 -1
  109. package/dist/style/cdr-tab-panel.css +1 -1
  110. package/dist/style/cdr-table.css +1 -1
  111. package/dist/style/cdr-tabs.css +1 -1
  112. package/dist/style/cdr-text.css +1 -1
  113. package/dist/style/cdr-title.css +1 -1
  114. package/dist/style/cdr-toast.css +1 -1
  115. package/dist/style/cdr-toggle-button.css +1 -1
  116. package/dist/style/cdr-toggle-group.css +1 -1
  117. package/dist/style/cdr-tooltip.css +1 -1
  118. package/dist/style/cdr-utility-sans.css +1 -1
  119. package/dist/style/cdr-utility-serif.css +1 -1
  120. package/package.json +3 -3
package/README.md CHANGED
@@ -9,13 +9,9 @@ and a set of themes that build on this scaffolding. We started this project in 2
9
9
  The project has evolved into what it is today, and will continue to grow to fit our expanding needs. Feel free to watch
10
10
  the Cedar grow and learn from what we are doing, or jump in and provide some recommendations.
11
11
 
12
- ### Vue 3 Migration Status
13
-
14
- Cedar has been fully migrated to Vue 3 using the composition API and is using [vite](https://vitejs.dev/) for its build system. Additionally, [vitest](https://vitest.dev/) is now being used as our testing framework.
15
-
16
12
  ## Using Cedar
17
13
 
18
- See the [Cedar docs](https://rei.github.io/rei-cedar-docs/) for usage instructions.
14
+ See the [Cedar docs](https://cedar.rei.com) for usage instructions.
19
15
 
20
16
  ## Getting Started
21
17
 
@@ -31,12 +27,6 @@ Clone the project.
31
27
 
32
28
  Runs locally for development. Has hot reloading, and other nice things related to development.
33
29
 
34
- Sometimes the liveReload server will hang in the background, do the following...
35
-
36
- Works on MacOS:
37
-
38
- `kill -9 $(lsof -ti tcp:35729)`
39
-
40
30
  ## Testing
41
31
 
42
32
  ### Code Tests
@@ -45,40 +35,17 @@ Works on MacOS:
45
35
 
46
36
  Runs unit tests.
47
37
 
38
+ `npm run watch`
39
+
40
+ Runs unit tests in watch mode. This also allows you to inspect snapshot discrepancies and regenerate the snapshots if appropriate.
41
+
48
42
  `npm run e2e`
49
43
 
50
44
  Runs [Nightwatch](http://nightwatchjs.org/) end-to-end tests and Axe a11y tests.
51
45
 
52
46
  `npm run test`
53
47
 
54
- Runs both unit and e2e/accesibility tests.
55
-
56
- ### Visual Regression Testing
57
-
58
- > [!NOTE]
59
- > this has been temporarily disabled due to Vue3 compatibility issues.
60
-
61
- Check [backstop](https://github.com/garris/BackstopJS) for general configuration questions.
62
-
63
- Our visual regressions audits can be performed against all patterns documented within the project's component proving grounds. To do so, follow the steps below:
64
-
65
- 1. Run the project locally with `npm run dev`
66
- 2. `npm run reference` will create a base set of images providing coverage for all defined patterns. Ensure this is run against a clean build prior to any edits.
67
- 3. `npm run compare` after making changes to the markup or css. This will create another set of test images and compare them against those generated in the previous step.
68
- 4. Review the generated report that should open in your browser. Make sure all changes are what you expect.
69
- 5. `npm run approve` if everything looks good. This will promote the latest test images to be the new reference images that future tests will be compared against.
70
-
71
- If you want to do backstop tests against a single scenario you can do `npm run compare -- --filter=<Label>`
72
-
73
- The config (`backstop.js`) looks through `src/` for all __*.backstop.js__ and generates a proper backstop scenario object for each.
74
-
75
- __*.backstop.js__ files will export an array of objects that are standard backstop scenario objects and support all the same options noted in the docs with the following exceptions:
76
-
77
- - `responsive`: Boolean, configures whether or not the scenario runs against all 4 breakpoints. If not present or false it will only run against the largest breakpoint. Note that running responsive tests against specific selectors can often lead to incorrect screenshots, and it is better to set up a separate responsive scenario that targets the entire document, for example: `{ url: 'http://localhost:3000/#/EXAMPLE', label: 'EXAMPLE', responsive: true }`
78
- - `focusSelectors`: Array, list of selectors that will have `focus` applied before screenshotting
79
- - `hoverSelectors`: Array, list of selectors that will have `hover` applied before screenshotting
80
- - `wait`: Number, if using `focusSelectors` or `hoverSelectors` this will insert a delay in milliseconds between the element interaction and the screenshot
81
-
48
+ Runs both unit and e2e/accessibility tests.
82
49
 
83
50
  ## Publishing Prerelease Components
84
51
 
@@ -4,6 +4,12 @@
4
4
  font-weight: 1 999;
5
5
  src: url("//www.rei.com/satchel/media/font-optimized/Stuart/REIStuart-VF-Web-Subset.woff2") format("woff2-variations"), url("//www.rei.com/satchel/media/font-optimized/Stuart/REIStuart-VF-Web-Subset.woff2") format("woff2"); }
6
6
 
7
+ @font-face {
8
+ font-family: "Stuart fallback";
9
+ src: local("Georgia");
10
+ size-adjust: 106%
11
+ }
12
+
7
13
  @font-face {
8
14
  font-display: swap;
9
15
  font-family: Stuart;
@@ -17,6 +23,12 @@
17
23
  font-weight: 1 999;
18
24
  src: url("//www.rei.com/satchel/media/font-optimized/Graphik/Graphik-VF-Web-Subset.woff2") format("woff2-variations"), url("//www.rei.com/satchel/media/font-optimized/Graphik/Graphik-VF-Web-Subset.woff2") format("woff2"); }
19
25
 
26
+ @font-face {
27
+ font-family: "Graphik fallback";
28
+ src: local("Verdana");
29
+ size-adjust: 92%;
30
+ }
31
+
20
32
  @font-face {
21
33
  font-display: swap;
22
34
  font-family: Graphik;
@@ -25,7 +25,7 @@ html {
25
25
 
26
26
  body {
27
27
  /* cdr-text-default */
28
- font-family: Graphik, "Helvetica Neue", sans-serif;
28
+ font-family: Graphik, "Graphik fallback", "Helvetica Neue", sans-serif;
29
29
  font-style: normal;
30
30
  font-weight: 400;
31
31
  letter-spacing: -0.16px;