docs: Update Storybook default theme#4021
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
📝 WalkthroughWalkthroughStorybook heads now load local Sana Sans assets and a shared type stylesheet. The stylesheet defines Roboto, Roboto Mono, and Sana Sans faces plus a ChangesStorybook font and theme wiring
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
| font-family: 'Roboto', sans-serif; | ||
| } | ||
|
|
||
| /* Hide the theme toggle button in docs view as it cannot toggle individual stories' themes */ |
There was a problem hiding this comment.
This is a bit of a hack but does hide the theme toggle in docs view. We could also just leave this out if preferred.
There was a problem hiding this comment.
Actionable comments posted: 6
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In @.storybook/preview-head.html:
- Around line 8-12: The default Canvas theme is using
var(--cnvs-sys-font-family-default) without that variable being defined when
CanvasProviderDecorator.tsx does not set a data-theme. Fix this by either adding
a default --cnvs-sys-font-family-default value in updated-type.css for the
standard theme, or by scoping the html/body font-family rule in
preview-head.html to [data-theme='sana-canvas'] so it only applies when the
variable is present.
In @.storybook/updated-type.css:
- Line 2: Stylelint is flagging unnecessary quotes around the font family name
in the updated type stylesheet. Update the `font-family` declarations in
`updated-type.css` to use `Roboto` without quotes wherever it appears, including
the repeated rules referenced by the reviewer. Keep the rest of the typography
styles unchanged and ensure the `font-family-name-quotes` violations are
removed.
In `@modules/codemod/lib/v16/utils/getImportRenameMap.ts`:
- Around line 36-43: The `root.find` predicate in `getImportRenameMap` is unsafe
because it reads `node.arguments[0].type` before confirming any arguments exist,
so a bare `styled()` call can crash the codemod. Update the `CallExpression`
guard to first verify `node.arguments` is non-empty before checking the first
argument’s `type`, while keeping the existing `styled` identifier match and
`Identifier` argument requirement.
In `@modules/react/fonts/lib/fonts.ts`:
- Line 1: The `fontWeight` range used in the font-face CSSObject is being
serialized incorrectly, so update the font definition in `fonts.ts` to use the
proper space-separated variable font range syntax instead of an array that
becomes a comma-separated string. Keep `CSSObject` imported from
`@emotion/styled` and adjust the `@font-face` object to match the rest of the
font declarations in this module, using the relevant font-face helper/constant
names to locate the affected entry.
In `@package.json`:
- Line 143: The dependency pin in package.json is using the pre-release
`@workday/canvas-tokens-web` 4.4.0-beta.0, so verify that this beta version is
intentional for the release and keep it aligned across package.json,
modules/docs/package.json, modules/labs-react/package.json, and
modules/preview-react/package.json. If this is temporary, update the shared
dependency entries together when the beta is finalized or replaced so all
packages stay in lockstep.
- Line 6: The listed .js files are still using CommonJS syntax even though the
repo root is ESM via package.json’s type setting, so update each affected module
to be compatible by either converting the file to ESM import/export, renaming it
to .cjs, or adding a nested package.json with type commonjs. Focus on the
identified files such as eslint.config.js, modules/docs/utils/build-docs.js,
modules/docs/webpack/extract-exports.js, and utils/update-changelog.js, and
remove any require/module.exports usage so build and lint can run without
require being undefined.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 445e7e98-5d1c-4e70-bf12-2ebb0c1bfea4
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (37)
.storybook/manager-head.html.storybook/preview-head.html.storybook/preview.js.storybook/theme.js.storybook/updated-type.csscypress/support/component-index.htmlmodules/codemod/index.jsmodules/codemod/lib/v16/index.tsmodules/codemod/lib/v16/spec/expectTransformFactory.tsmodules/codemod/lib/v16/utils/getImportRenameMap.tsmodules/docs/lib/stackblitzFiles/main.tsxmodules/docs/mdx/16.0-UPGRADE-GUIDE.mdxmodules/docs/package.jsonmodules/labs-react/package.jsonmodules/preview-react/package.jsonmodules/react/card/lib/Card.tsxmodules/react/card/lib/CardHeading.tsxmodules/react/common/lib/styles/cornerShape.tsmodules/react/common/lib/styles/index.tsmodules/react/fonts/README.mdmodules/react/fonts/index.tsmodules/react/fonts/lib/fonts.tsmodules/react/fonts/stories/mdx/Fonts.mdxmodules/react/fonts/stories/tsconfig.jsonmodules/react/icon/lib/AccentIcon.tsxmodules/react/icon/stories/examples/AccentIconList.tsxmodules/react/package.jsonmodules/react/popup/lib/Popup.tsxmodules/react/popup/lib/PopupHeading.tsxmodules/react/side-panel/stories/examples/AlwaysOpen.tsxmodules/react/side-panel/stories/examples/Basic.tsxmodules/styling-transform/package.jsonmodules/styling/package.jsonpackage.jsonutils/download-fonts.jsutils/forward-merge.jsutils/storybook/CanvasProviderDecorator.tsx
There was a problem hiding this comment.
Caution
Inline review comments failed to post. This is likely due to GitHub's internal server error or limits when posting large numbers of comments. If you are seeing this consistently it is likely a permissions issue. Please check "Moderation" -> "Code review limits" under your organization settings.
Actionable comments posted: 6
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In @.storybook/preview-head.html:
- Around line 8-12: The default Canvas theme is using
var(--cnvs-sys-font-family-default) without that variable being defined when
CanvasProviderDecorator.tsx does not set a data-theme. Fix this by either adding
a default --cnvs-sys-font-family-default value in updated-type.css for the
standard theme, or by scoping the html/body font-family rule in
preview-head.html to [data-theme='sana-canvas'] so it only applies when the
variable is present.
In @.storybook/updated-type.css:
- Line 2: Stylelint is flagging unnecessary quotes around the font family name
in the updated type stylesheet. Update the `font-family` declarations in
`updated-type.css` to use `Roboto` without quotes wherever it appears, including
the repeated rules referenced by the reviewer. Keep the rest of the typography
styles unchanged and ensure the `font-family-name-quotes` violations are
removed.
In `@modules/codemod/lib/v16/utils/getImportRenameMap.ts`:
- Around line 36-43: The `root.find` predicate in `getImportRenameMap` is unsafe
because it reads `node.arguments[0].type` before confirming any arguments exist,
so a bare `styled()` call can crash the codemod. Update the `CallExpression`
guard to first verify `node.arguments` is non-empty before checking the first
argument’s `type`, while keeping the existing `styled` identifier match and
`Identifier` argument requirement.
In `@modules/react/fonts/lib/fonts.ts`:
- Line 1: The `fontWeight` range used in the font-face CSSObject is being
serialized incorrectly, so update the font definition in `fonts.ts` to use the
proper space-separated variable font range syntax instead of an array that
becomes a comma-separated string. Keep `CSSObject` imported from
`@emotion/styled` and adjust the `@font-face` object to match the rest of the
font declarations in this module, using the relevant font-face helper/constant
names to locate the affected entry.
In `@package.json`:
- Line 143: The dependency pin in package.json is using the pre-release
`@workday/canvas-tokens-web` 4.4.0-beta.0, so verify that this beta version is
intentional for the release and keep it aligned across package.json,
modules/docs/package.json, modules/labs-react/package.json, and
modules/preview-react/package.json. If this is temporary, update the shared
dependency entries together when the beta is finalized or replaced so all
packages stay in lockstep.
- Line 6: The listed .js files are still using CommonJS syntax even though the
repo root is ESM via package.json’s type setting, so update each affected module
to be compatible by either converting the file to ESM import/export, renaming it
to .cjs, or adding a nested package.json with type commonjs. Focus on the
identified files such as eslint.config.js, modules/docs/utils/build-docs.js,
modules/docs/webpack/extract-exports.js, and utils/update-changelog.js, and
remove any require/module.exports usage so build and lint can run without
require being undefined.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 445e7e98-5d1c-4e70-bf12-2ebb0c1bfea4
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (37)
.storybook/manager-head.html.storybook/preview-head.html.storybook/preview.js.storybook/theme.js.storybook/updated-type.csscypress/support/component-index.htmlmodules/codemod/index.jsmodules/codemod/lib/v16/index.tsmodules/codemod/lib/v16/spec/expectTransformFactory.tsmodules/codemod/lib/v16/utils/getImportRenameMap.tsmodules/docs/lib/stackblitzFiles/main.tsxmodules/docs/mdx/16.0-UPGRADE-GUIDE.mdxmodules/docs/package.jsonmodules/labs-react/package.jsonmodules/preview-react/package.jsonmodules/react/card/lib/Card.tsxmodules/react/card/lib/CardHeading.tsxmodules/react/common/lib/styles/cornerShape.tsmodules/react/common/lib/styles/index.tsmodules/react/fonts/README.mdmodules/react/fonts/index.tsmodules/react/fonts/lib/fonts.tsmodules/react/fonts/stories/mdx/Fonts.mdxmodules/react/fonts/stories/tsconfig.jsonmodules/react/icon/lib/AccentIcon.tsxmodules/react/icon/stories/examples/AccentIconList.tsxmodules/react/package.jsonmodules/react/popup/lib/Popup.tsxmodules/react/popup/lib/PopupHeading.tsxmodules/react/side-panel/stories/examples/AlwaysOpen.tsxmodules/react/side-panel/stories/examples/Basic.tsxmodules/styling-transform/package.jsonmodules/styling/package.jsonpackage.jsonutils/download-fonts.jsutils/forward-merge.jsutils/storybook/CanvasProviderDecorator.tsx
🛑 Comments failed to post (6)
.storybook/preview-head.html (1)
8-12: 🎯 Functional Correctness | 🟡 Minor
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash # Verify where --cnvs-sys-font-family-default is declared and whether a default (e.g., :root/body/canvas wrapper) exists. rg -n -- '--cnvs-sys-font-family-default' .storybook modules utils # Inspect preview/theme wiring files for default theme variable assignment paths. fd -i 'preview.js|theme.js|CanvasProviderDecorator.tsx' .storybook utils modules | xargs -I{} sh -c 'echo "=== {} ==="; sed -n "1,220p" "{}"'Repository: Workday/canvas-kit
Length of output: 7290
Fix missing font-family fallback for default Canvas theme
The variable
--cnvs-sys-font-family-defaultis declared only under[data-theme='sana-canvas']inupdated-type.css, butpreview-head.htmlappliesvar(--cnvs-sys-font-family-default)unconditionally to thehtmlandbodyelements.For the default 'Canvas' theme,
CanvasProviderDecorator.tsxdoes not set adata-themeattribute, leaving the variable undefined. This results in the font family falling back to browser defaults rather than the expected Workday font stack.Please either:
- Add a default definition for
--cnvs-sys-font-family-defaultinupdated-type.css(unscoped or:root) for the standard Canvas theme, or- Scope the font-family rule in
preview-head.htmlto[data-theme='sana-canvas'].🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In @.storybook/preview-head.html around lines 8 - 12, The default Canvas theme is using var(--cnvs-sys-font-family-default) without that variable being defined when CanvasProviderDecorator.tsx does not set a data-theme. Fix this by either adding a default --cnvs-sys-font-family-default value in updated-type.css for the standard theme, or by scoping the html/body font-family rule in preview-head.html to [data-theme='sana-canvas'] so it only applies when the variable is present..storybook/updated-type.css (1)
2-2: 📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win
Fix Stylelint violations for
font-familyquoting.Stylelint reports errors on Line 2, Line 9, Line 17, and Line 24 (
font-family-name-quotes). Remove unnecessary quotes aroundRoboto.Proposed fix
- font-family: 'Roboto'; + font-family: Roboto; ... - font-family: 'Roboto'; + font-family: Roboto; ... - font-family: 'Roboto'; + font-family: Roboto; ... - font-family: 'Roboto'; + font-family: Roboto;Also applies to: 9-9, 17-17, 24-24
🧰 Tools
🪛 Stylelint (17.13.0)
[error] 2-2: Expected no quotes around "Roboto" (font-family-name-quotes)
(font-family-name-quotes)
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In @.storybook/updated-type.css at line 2, Stylelint is flagging unnecessary quotes around the font family name in the updated type stylesheet. Update the `font-family` declarations in `updated-type.css` to use `Roboto` without quotes wherever it appears, including the repeated rules referenced by the reviewer. Keep the rest of the typography styles unchanged and ensure the `font-family-name-quotes` violations are removed.Source: Linters/SAST tools
modules/codemod/lib/v16/utils/getImportRenameMap.ts (1)
36-43: 🩺 Stability & Availability | 🟡 Minor
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash # Inspect existing getImportRenameMap implementations across codemod versions fd getImportRenameMap.ts modules/codemod --exec sh -c 'echo "=== {} ==="; sed -n "30,60p" "{}"'Repository: Workday/canvas-kit
Length of output: 10033
Guard against zero-argument
styled()callsThe find predicate evaluates
node.arguments[0].typewithout first ensuring the arguments array is non-empty. A barestyled()call in the source code causesnode.arguments[0]to beundefined, leading to aTypeErrorwhen accessing.typeand crashing the codemod. This unsafe pattern is historically consistent across v5–v15 but requires fixing here to ensure stability.Proposed Fix
.find( j.CallExpression, (node: CallExpression) => node.callee.type === 'Identifier' && node.callee.name === 'styled' && + node.arguments.length > 0 && node.arguments[0].type === 'Identifier' )📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.root .find( j.CallExpression, (node: CallExpression) => node.callee.type === 'Identifier' && node.callee.name === 'styled' && node.arguments.length > 0 && node.arguments[0].type === 'Identifier' )🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@modules/codemod/lib/v16/utils/getImportRenameMap.ts` around lines 36 - 43, The `root.find` predicate in `getImportRenameMap` is unsafe because it reads `node.arguments[0].type` before confirming any arguments exist, so a bare `styled()` call can crash the codemod. Update the `CallExpression` guard to first verify `node.arguments` is non-empty before checking the first argument’s `type`, while keeping the existing `styled` identifier match and `Identifier` argument requirement.modules/react/fonts/lib/fonts.ts (1)
1-1: 🎯 Functional Correctness | 🟡 Minor
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash # Verify existing project contract for CSSObject import and `@font-face` weight style usage rg -n "import\s+\{CSSObject\}\s+from\s+'`@emotion/`(react|styled)'" modules rg -n "fontWeight:\s*\[[^]]+\]" modules/react/fonts rg -n "fontWeight:\s*'100 700'|font-weight:\s*100 700" modules .storybook cypressRepository: Workday/canvas-kit
Length of output: 1184
Fix
@font-facefont-weight range syntax.The CSS Object literal
fontWeight: [100, 700]for variable fonts is incorrect for Emotion; it serializes to a comma-separated string (e.g.,"100, 700") rather than the required space-separated CSS range syntax ("100 700"). Consistent with the rest of the codebase,CSSObjectshould be imported from@emotion/styled.--- a/modules/react/fonts/lib/fonts.ts @@ -7,7 +7,7 @@ const face = { fontFamily: '"Work Sans", sans-serif', fontStyle: 'normal', fontWeight: [100, 700], fontDisplay: 'swap', @@ -15,7 +15,7 @@ const face = { fontFamily: '"Work Sans", sans-serif', fontStyle: 'normal', fontWeight: [100, 700], fontDisplay: 'swap',🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@modules/react/fonts/lib/fonts.ts` at line 1, The `fontWeight` range used in the font-face CSSObject is being serialized incorrectly, so update the font definition in `fonts.ts` to use the proper space-separated variable font range syntax instead of an array that becomes a comma-separated string. Keep `CSSObject` imported from `@emotion/styled` and adjust the `@font-face` object to match the rest of the font declarations in this module, using the relevant font-face helper/constant names to locate the affected entry.package.json (2)
6-6: 🩺 Stability & Availability | 🔴 Critical
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash # Find .js files that still use CommonJS constructs and would break under "type":"module". # Excludes .cjs (already opted out) and vendored dirs. rg -nP --type=js -g '!**/node_modules/**' -g '!**/dist/**' \ '\b(module\.exports|exports\.[A-Za-z_]|require\s*\(|__dirname|__filename)\b' \ | head -200 echo "----- nested package.json type overrides -----" fd -t f 'package.json' -E node_modules | xargs -I{} sh -c 'echo "== {} =="; jq -r ".type // \"(none)\"" {} 2>/dev/null'Repository: Workday/canvas-kit
Length of output: 156
🏁 Script executed:
#!/bin/bash # 1. Check for CJS-like usage in .js files, ignoring node_modules/dist echo "=== Potential CJS usage in .js files ===" rg --type=js -g '!**/node_modules/**' -g '!**/dist/**' '\b(module\.exports|exports\.|require\(|__dirname|__filename)\b' -l --max-count 50 || echo "No matches found or limit reached." echo -e "\n=== Nested package.json type overrides (looking for commonjs) ===" # Find all package.json files, extract type, and filter for commonjs fd -t f 'package.json' --exclude node_modules | while read -r file; do type=$(jq -r '.type // empty' "$file" 2>/dev/null) if [ "$type" = "commonjs" ]; then echo "$file (type: commonjs)" fi done | head -20 echo -e "\n=== Checking specific config files ===" rg --files --glob '*.config.js' | while read -r file; do if grep -q "module.exports\|require(" "$file" 2>/dev/null; then echo "Config file $file contains CJS syntax" head -5 "$file" fi done 2>/dev/null | head -10Repository: Workday/canvas-kit
Length of output: 205
🏁 Script executed:
#!/bin/bash # Read the log file generated in the previous turn LOGFILE="/tmp/coderabbit-shell-logs/shell-output-HDZB1s" echo "=== First 50 lines of log file ===" head -n 100 "$LOGFILE" echo -e "\n=== Checking for matches in the log ===" grep -A 1 "Potential CJS" "$LOGFILE" | tail -n +2 | grep -E "\.(js)" | head -20Repository: Workday/canvas-kit
Length of output: 281
🏁 Script executed:
python3 - <<'PY' import os import re # Directories to exclude exclusions = {'node_modules', 'dist', '.git', 'storybook-static', 'coverage', 'build'} # Pattern for CommonJS keywords pattern = re.compile(r'\b(module\.exports|exports\.|require\s*\(|__dirname|__filename)\b') js_cjs_files = [] js_commonjs_overrides = [] # Traverse repository for root, dirs, files in os.walk('.'): # Prune exclusion dirs dirs[:] = [d for d in dirs if d not in exclusions] for file in files: if file.endswith('.js'): filepath = os.path.join(root, file) try: with open(filepath, 'r', encoding='utf-8', errors='ignore') as f: content = f.read(10000) # Read first 10k chars to catch imports/exports at top if pattern.search(content): js_cjs_files.append(filepath) except Exception: pass if file == 'package.json': filepath = os.path.join(root, file) try: with open(filepath, 'r', encoding='utf-8') as f: import json try: pkg = json.load(f) if pkg.get('type') == 'commonjs': js_commonjs_overrides.append(filepath) except json.JSONDecodeError: pass except Exception: pass print(f"Total .js files with CJS syntax found: {len(js_cjs_files)}") print(f"Total nested package.json with 'type: commonjs': {len(js_commonjs_overrides)}") if js_cjs_files: print("\n--- Found CJS .js files (Potential issues if root is 'type: module') ---") for f in js_cjs_files[:50]: # Limit to first 50 print(f) if len(js_cjs_files) > 50: print(f"... and {len(js_cjs_files) - 50} more files.") if js_commonjs_overrides: print("\n--- Found nested 'type: commonjs' overrides ---") for f in js_commonjs_overrides[:20]: print(f) PYRepository: Workday/canvas-kit
Length of output: 843
Fix CommonJS syntax compatibility issues in 15
.jsfiles.The root
package.jsonsets"type": "module", but the following 15 files contain CommonJS syntax (e.g.,require,module.exports) and lack corresponding"type": "commonjs"overrides or.cjsextensions. These will fail withReferenceError: require is not definedduring build or lint steps../eslint.config.js ./cypress/plugins/index.js ./modules/codemod/index.js ./modules/docs/docgen/createDocProgram.js ./modules/docs/utils/build-docs.js ./modules/docs/utils/build-mdx.js ./modules/docs/utils/build-specifications.js ./modules/docs/utils/get-component-prop-map.js ./modules/docs/utils/get-specifications.js ./modules/docs/webpack/extract-exports.js ./modules/docs/webpack/inject-module-name-loader.js ./utils/check-lockfile.js ./utils/download-fonts.js ./utils/replace-version.js ./utils/update-changelog.jsEnsure these are migrated to ESM (using
import/export), renamed to.cjs, or protected by a nestedpackage.jsonwith"type": "commonjs".🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@package.json` at line 6, The listed .js files are still using CommonJS syntax even though the repo root is ESM via package.json’s type setting, so update each affected module to be compatible by either converting the file to ESM import/export, renaming it to .cjs, or adding a nested package.json with type commonjs. Focus on the identified files such as eslint.config.js, modules/docs/utils/build-docs.js, modules/docs/webpack/extract-exports.js, and utils/update-changelog.js, and remove any require/module.exports usage so build and lint can run without require being undefined.
143-143: 🔒 Security & Privacy | 🟡 Minor
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash # Confirm the version exists on the registry and list any newer GA/beta. curl -s https://registry.npmjs.org/@workday/canvas-tokens-web | jq '{latest: .["dist-tags"], hasVersion: (.versions["4.4.0-beta.0"] != null)}'Repository: Workday/canvas-kit
Length of output: 280
🏁 Script executed:
#!/bin/bash # Verify if the version 4.4.0-beta.0 is present in the other package.json files mentioned echo "Checking modules/docs/package.json:" cat modules/docs/package.json | grep "`@workday/canvas-tokens-web`" || echo "Not found" echo "Checking modules/labs-react/package.json:" cat modules/labs-react/package.json | grep "`@workday/canvas-tokens-web`" || echo "Not found" echo "Checking modules/preview-react/package.json:" cat modules/preview-react/package.json | grep "`@workday/canvas-tokens-web`" || echo "Not found"Repository: Workday/canvas-kit
Length of output: 429
Pinning to a pre-release version (
4.4.0-beta.0) of@workday/canvas-tokens-web.Beta versions are not guaranteed for production and may contain breaking changes. Confirm this is intentional for the release. Ensure this version remains in lockstep across
package.json,modules/docs/package.json,modules/labs-react/package.json, andmodules/preview-react/package.jsonwhen the beta is eventually finalized or replaced.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@package.json` at line 143, The dependency pin in package.json is using the pre-release `@workday/canvas-tokens-web` 4.4.0-beta.0, so verify that this beta version is intentional for the release and keep it aligned across package.json, modules/docs/package.json, modules/labs-react/package.json, and modules/preview-react/package.json. If this is temporary, update the shared dependency entries together when the beta is finalized or replaced so all packages stay in lockstep.
|
@jamesfan I think your enhancement of adding a theme toggle button next to the "Show Code" button in the docs view would fit well in this PR if you want to add it in. |
Workday/canvas-kit
|
||||||||||||||||||||||||||||||||||||||||
| Project |
Workday/canvas-kit
|
| Branch Review |
update-storybook-default-theme
|
| Run status |
|
| Run duration | 02m 32s |
| Commit |
|
| Committer | Sheelah Brennan |
| View all properties for this run ↗︎ | |
| Test results | |
|---|---|
|
|
0
|
|
|
0
|
|
|
17
|
|
|
0
|
|
|
809
|
| View all changes introduced in this branch ↗︎ | |
UI Coverage
19.55%
|
|
|---|---|
|
|
1537
|
|
|
371
|
Accessibility
99.41%
|
|
|---|---|
|
|
5 critical
5 serious
0 moderate
2 minor
|
|
|
68
|
Suspending this work since it sounds like the Sana Theme will be the defacto theme for v16. |
|
Maybe we can close that, as we go without theme |
|
Just noting here that testing the |
Summary
Fixes: #4020.
Updates Storybook to use Roboto by default, instead of Sana Sans, and not set
data-theme=*on Storybook chrome (sidebar, component canvas, etc). For now on,data-themeis only set on the Storybook canvas (wrapper for each component story) when the user toggles the theme to "Sana Canvas".Also includes a bit of a hack to hide the Sana Canvas theme toggle in docs view of Storybook.
Release Category
Documentation
Release Note
Optional release note message. Changelog and release summaries will contain a pull request title. This section will add additional notes under that title. This section is not a summary, but something extra to point out in release notes. An example might be calling out breaking changes in a labs component or minor visual changes that need visual regression updates. Remove this section if no additional release notes are required.
BREAKING CHANGES
Optional breaking changes message. If your PR includes breaking changes. It is extremely rare to put breaking changes outside a
prerelease/majorbranch. Anything in this section will show up in release notes. Remove this section if no breaking changes are present.Checklist
ready for reviewhas been added to PRFor the Reviewer
Where Should the Reviewer Start?
Areas for Feedback? (optional)
Testing Manually
Screenshots or GIFs (if applicable)
Thank You Gif (optional)
Summary by CodeRabbit