[ { "path": ".changeset/README.md", "content": "# Changesets\n\nHello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works\nwith multi-package repos, or single-package repos to help you version and publish your code. You can\nfind the full documentation for it [in our repository](https://github.com/changesets/changesets)\n\nWe have a quick list of common questions to get you started engaging with this project in\n[our documentation](https://github.com/changesets/changesets/blob/master/docs/common-questions.md)\n" }, { "path": ".changeset/config.json", "content": "{\n \"$schema\": \"https://unpkg.com/@changesets/config@1.5.0/schema.json\",\n \"changelog\": [\"@changesets/changelog-github\", {\"repo\": \"primer/css\"}],\n \"commit\": false,\n \"linked\": [],\n \"access\": \"public\",\n \"baseBranch\": \"main\",\n \"updateInternalDependencies\": \"patch\",\n \"ignore\": []\n}\n" }, { "path": ".github/CODEOWNERS", "content": "* @primer/design-reviewers @primer/engineer-reviewers\npackage.json @primer/design-reviewers @primer/engineer-reviewers\npackage-lock.json @primer/design-reviewers @primer/engineer-reviewers\n" }, { "path": ".github/ISSUE_TEMPLATE/primer-bug-report.md", "content": "---\nname: Primer CSS bug report\nabout: Create a report to help us improve Primer CSS\n\n---\n\n**Describe the bug**\nA clear and concise description of what the bug is.\n\n**To Reproduce**\nSteps to reproduce the behavior:\n1. Go to '...'\n2. Click on '....'\n3. Scroll down to '....'\n4. See error\n\n**Expected behavior**\nA clear and concise description of what you expected to happen.\n\n**Screenshots**\nIf applicable, add screenshots to help explain your problem.\n\n**Desktop (please complete the following information):**\n - OS: [e.g. iOS]\n - Browser [e.g. chrome, safari]\n - Version [e.g. 22]\n\n**Smartphone (please complete the following information):**\n - Device: [e.g. iPhone6]\n - OS: [e.g. iOS8.1]\n - Browser [e.g. stock browser, safari]\n - Version [e.g. 22]\n\n**Additional context**\nAdd any other context about the problem here.\n" }, { "path": ".github/ISSUE_TEMPLATE/primer-feature-request.md", "content": "---\nname: Primer CSS feature request\nabout: Suggest an idea for this project\n\n---\n\n**Is your feature request related to a problem? Please describe.**\nA clear and concise description of what the problem is. Ex. I'm always frustrated when [...]\n\n**Describe the solution you'd like**\nA clear and concise description of what you want to happen.\n\n**Describe alternatives you've considered**\nA clear and concise description of any alternative solutions or features you've considered.\n\n**Additional context**\nAdd any other context or screenshots about the feature request here.\n" }, { "path": ".github/ISSUE_TEMPLATE/style-guide-bug-report.md", "content": "---\nname: Style guide bug report\nabout: Create a report to help us improve\n\n---\n\n**Describe the bug**\nA clear and concise description of what the bug is.\n\n**To Reproduce**\nSteps to reproduce the behavior:\n1. Go to '...'\n2. Click on '....'\n3. Scroll down to '....'\n4. See error\n\n**Expected behavior**\nA clear and concise description of what you expected to happen.\n\n**Screenshots**\nIf applicable, add screenshots to help explain your problem.\n\n**Desktop (please complete the following information):**\n - OS: [e.g. iOS]\n - Browser [e.g. chrome, safari]\n - Version [e.g. 22]\n\n**Smartphone (please complete the following information):**\n - Device: [e.g. iPhone6]\n - OS: [e.g. iOS8.1]\n - Browser [e.g. stock browser, safari]\n - Version [e.g. 22]\n\n**Additional context**\nAdd any other context about the problem here.\n" }, { "path": ".github/dependabot.yml", "content": "# To get started with Dependabot version updates, you'll need to specify which\n# package ecosystems to update and where the package manifests are located.\n# Please see the documentation for all configuration options:\n# https://help.github.com/github/administering-a-repository/configuration-options-for-dependency-updates\n\nversion: 2\nupdates:\n # Maintain dependencies for GitHub Actions\n - package-ecosystem: \"github-actions\"\n directory: \"/\"\n schedule:\n interval: \"daily\"\n groups:\n all:\n patterns:\n - \"*\"\n\n # Maintain dependencies for npm\n - package-ecosystem: \"npm\"\n directory: \"/\"\n schedule:\n interval: \"daily\"\n groups:\n all:\n patterns:\n - \"*\"\n" }, { "path": ".github/pull_request_template.md", "content": "### What are you trying to accomplish?\n\n\n\n### What approach did you choose and why?\n\n\n\n### What should reviewers focus on?\n\n\n\n### Can these changes ship as is?\n\n\n\n- [ ] Yes, this PR does not depend on additional changes. 🚢 \n" }, { "path": ".github/release_template.md", "content": "Preparing for a release.\n\n### Checklist\n\nMake sure these items are checked before merging.\n\n- [ ] Preview the docs change.\n- [ ] Preview npm release candidate.\n- [ ] CI passes on the release PR.\n\n\n\n\n" }, { "path": ".github/workflows/axe.yml", "content": "name: axe\non:\n push:\n branches:\n - main\n pull_request:\n branches:\n - main\njobs:\n axe:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v6\n with:\n fetch-depth: 0\n - name: Get changed files\n id: changed-files\n uses: tj-actions/changed-files@e0021407031f5be11a464abee9a0776171c79891\n with:\n files: |\n docs/content/components/**/*.md\n docs/content/utilities/**/*.md\n files_ignore: |\n docs/content/components/index.md\n docs/content/utilities/index.md\n - name: Save changed files\n run: |\n echo \"STRING_OF_PATHS_WE_CARE_ABOUT=${{ steps.changed-files.outputs.all_changed_files }}\" >> $GITHUB_ENV\n - name: Use Node.js\n if: steps.changed-files.outputs.any_changed == 'true'\n uses: actions/setup-node@v6\n with:\n node-version: 20\n cache: 'npm'\n - run: npm ci\n if: steps.changed-files.outputs.any_changed == 'true'\n - run: npm run dist\n if: steps.changed-files.outputs.any_changed == 'true'\n - name: Run docs site\n if: steps.changed-files.outputs.any_changed == 'true'\n run: |\n npm run dev & npx wait-on http://localhost:8000\n - name: Run axe script\n if: steps.changed-files.outputs.any_changed == 'true'\n run: |\n script/axe-docs $STRING_OF_PATHS_WE_CARE_ABOUT\n" }, { "path": ".github/workflows/ci.yml", "content": "name: CI\non:\n push:\n branches:\n - main\n pull_request:\njobs:\n stylelint:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v6\n - uses: actions/setup-node@v6\n with:\n node-version: 20\n cache: 'npm'\n - run: npm ci\n - run: npm run dist\n - name: Lint source files\n run: npm run stylelint:fix\n - name: Push up any fixes\n if: ${{ github.event_name == 'pull_request' }}\n uses: stefanzweifel/git-auto-commit-action@v7\n with:\n commit_message: Fixing stylelint issues\n commit_user_name: GitHub Design Engineering Bot\n commit_user_email: primer-css@users.noreply.github.com\n commit_author: primer-css \n file_pattern: src/**/*.scss\n\n eslint:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v6\n - uses: actions/setup-node@v6\n with:\n node-version: 20\n cache: 'npm'\n - run: npm ci\n - name: Lint workflow files\n run: npm run eslint\n\n test:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v6\n - uses: actions/setup-node@v6\n with:\n node-version: 20\n cache: 'npm'\n - run: npm ci\n - name: Jest\n run: npm test\n" }, { "path": ".github/workflows/codeql.yml", "content": "# For most projects, this workflow file will not need changing; you simply need\n# to commit it to your repository.\n#\n# You may wish to alter this file to override the set of languages analyzed,\n# or to provide custom queries or build logic.\n#\n# ******** NOTE ********\n# We have attempted to detect the languages in your repository. Please check\n# the `language` matrix defined below to confirm you have the correct set of\n# supported CodeQL languages.\n#\nname: \"CodeQL\"\n\non:\n push:\n branches: [ main, next_major ]\n pull_request:\n # The branches below must be a subset of the branches above\n branches: [ main ]\n schedule:\n - cron: '34 14 * * 0'\n\njobs:\n analyze:\n name: Analyze\n runs-on: ubuntu-latest\n permissions:\n actions: read\n contents: read\n security-events: write\n\n strategy:\n fail-fast: false\n matrix:\n language: [ 'javascript' ]\n # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]\n # Learn more about CodeQL language support at https://git.io/codeql-language-support\n\n steps:\n - name: Checkout repository\n uses: actions/checkout@v6\n\n # Initializes the CodeQL tools for scanning.\n - name: Initialize CodeQL\n uses: github/codeql-action/init@v4\n with:\n languages: ${{ matrix.language }}\n # If you wish to specify custom queries, you can do so here or in a config file.\n # By default, queries listed here will override any specified in a config file.\n # Prefix the list here with \"+\" to use these queries and those in the config file.\n # queries: ./path/to/local/query, your-org/your-repo/queries@main\n\n # Autobuild attempts to build any compiled languages (C/C++, C#, or Java).\n # If this step fails, then you should remove it and run the build manually (see below)\n - name: Autobuild\n uses: github/codeql-action/autobuild@v4\n\n # ℹ️ Command-line programs to run using the OS shell.\n # 📚 https://git.io/JvXDl\n\n # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines\n # and modify them (or add more) to build your code if your project\n # uses a compiled language\n\n #- run: |\n # make bootstrap\n # make release\n\n - name: Perform CodeQL Analysis\n uses: github/codeql-action/analyze@v4\n" }, { "path": ".github/workflows/deploy_preview.yml", "content": "name: Deploy\non:\n pull_request:\n\npermissions:\n contents: write\n pages: write\n id-token: write\n deployments: write\n issues: write\n statuses: write\n checks: write\n\njobs:\n deploy:\n if: ${{ github.repository == 'primer/css' }}\n uses: primer/.github/.github/workflows/deploy_preview.yml@v2.4.0\n name: Deploy preview\n secrets:\n gh_token: ${{ secrets.GITHUB_TOKEN }}\n with:\n node_version: 20\n install: npm i && cd docs && npm i && cd ..\n build: npm run build:docs:preview\n output_dir: docs/public\n\n deploy-storybook:\n if: ${{ github.repository == 'primer/css' }}\n name: Preview Storybook\n runs-on: ubuntu-latest\n needs: deploy\n steps:\n - uses: actions/checkout@v6\n\n - uses: chrnorm/deployment-action@v2.0.7\n name: Create GitHub deployment for storybook\n id: storybook\n with:\n token: ${{ secrets.GITHUB_TOKEN }}\n environment: Storybook Preview\n environment_url: '${{ needs.deploy.outputs.deployment_url }}/storybook'\n\n - name: Update storybook deployment status (success)\n if: success()\n uses: chrnorm/deployment-status@v2.0.3\n with:\n token: ${{ secrets.GITHUB_TOKEN }}\n environment-url: '${{ needs.deploy.outputs.deployment_url }}/storybook'\n state: 'success'\n deployment-id: ${{ steps.storybook.outputs.deployment_id }}\n\n - name: Update storybook deployment status (failure)\n if: failure()\n uses: chrnorm/deployment-status@v2.0.3\n with:\n token: ${{ secrets.GITHUB_TOKEN }}\n state: 'failure'\n deployment-id: ${{ steps.storybook.outputs.deployment_id }}\n" }, { "path": ".github/workflows/deploy_production.yml", "content": "name: Deploy\non:\n push:\n branches:\n - 'main'\n workflow_dispatch:\n\npermissions:\n contents: write\n pages: write\n id-token: write\n deployments: write\n issues: write\n statuses: write\n checks: write\n\njobs:\n guard:\n name: Guard\n runs-on: ubuntu-latest\n outputs:\n # To avoid deploying documentation for unrelease changes, we check the number of changeset files.\n # If it's 0, we deploy.\n should_deploy: ${{ steps.changeset-count.outputs.change_count == 0 }}\n steps:\n - uses: actions/checkout@v6\n\n - id: changeset-count\n run: echo \"::set-output name=change_count::$(ls .changeset/*.md | grep -v README | wc -l | xargs)\"\n\n # Log changeset count for debugging purposes\n - name: Log changeset count\n run: echo ${{ steps.changeset-count.outputs.change_count }}\n\n # Log guard output for debugging purposes\n - name: Log guard output\n run: echo ${{ needs.guard.outputs.should_deploy }}\n deploy:\n if: ${{ github.repository == 'primer/css' }}\n name: Production\n needs: [guard]\n uses: primer/.github/.github/workflows/deploy.yml@v2.4.0\n secrets:\n gh_token: ${{ secrets.GITHUB_TOKEN }}\n with:\n node_version: 20\n install: npm i && cd docs && npm i && cd ..\n build: npm run build:docs\n output_dir: docs/public\n" }, { "path": ".github/workflows/release.yml", "content": "name: Release\non:\n push:\n\nconcurrency:\n group: ${{ github.workflow }}-${{ github.ref }}\n cancel-in-progress: true\n\npermissions:\n id-token: write # Required for OIDC\n contents: read\n checks: write\n statuses: write\n\njobs:\n release-main:\n name: Main\n if: ${{ github.repository == 'primer/css' && github.ref_name == 'main' }}\n\n runs-on: ubuntu-latest\n steps:\n - name: Checkout repository\n uses: actions/checkout@v6\n with:\n # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits\n fetch-depth: 0\n persist-credentials: false\n\n - name: Set up Node.js\n uses: actions/setup-node@v6\n with:\n node-version: 24\n cache: 'npm'\n\n - name: Install dependencies\n run: npm ci\n\n - id: get-access-token\n uses: camertron/github-app-installation-auth-action@v1\n with:\n app-id: ${{ vars.PRIMER_APP_ID_SHARED }}\n private-key: ${{ secrets.PRIMER_APP_PRIVATE_KEY_SHARED }}\n client-id: ${{ vars.PRIMER_APP_CLIENT_ID_SHARED }}\n client-secret: ${{ secrets.PRIMER_APP_CLIENT_SECRET_SHARED }}\n installation-id: ${{ vars.PRIMER_APP_INSTALLATION_ID_SHARED }}\n\n - name: Create release pull request or publish to npm\n id: changesets\n uses: changesets/action@master\n with:\n title: Release Tracking\n # This expects you to have a script called release which does a build for your packages and calls changeset publish\n publish: npm run release\n env:\n GITHUB_TOKEN: ${{ steps.get-access-token.outputs.access-token }}\n\n release-candidate:\n name: Candidate\n if: ${{ github.repository == 'primer/css' && github.ref_name == 'changeset-release/main' }}\n\n runs-on: ubuntu-latest\n steps:\n - name: Checkout repository\n uses: actions/checkout@v6\n with:\n # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits\n fetch-depth: 0\n\n - name: Set up Node.js\n uses: actions/setup-node@v6\n with:\n node-version: 24\n cache: 'npm'\n\n - name: Install dependencies\n run: npm ci\n\n - name: Publish release candidate\n run: |\n version=$(jq -r .version package.json)\n echo \"$( jq \".version = \\\"$(echo $version)-rc.$(git rev-parse --short HEAD)\\\"\" package.json )\" > package.json\n npm publish --tag next\n env:\n GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}\n\n - name: Output candidate version number\n uses: actions/github-script@v8\n with:\n script: |\n const package = require(`${process.env.GITHUB_WORKSPACE}/package.json`)\n github.rest.repos.createCommitStatus({\n owner: context.repo.owner,\n repo: context.repo.repo,\n sha: context.sha,\n state: 'success',\n context: `Published ${package.name}`,\n description: package.version,\n target_url: `https://unpkg.com/${package.name}@${package.version}/`\n })\n\n - name: Upload versions json file\n uses: primer/.github/.github/actions/upload-versions@main\n\n release-canary:\n name: Canary\n if: ${{ github.repository == 'primer/css' && github.ref_name != 'main' && github.ref_name != 'changeset-release/main' }}\n uses: primer/.github/.github/workflows/release_canary.yml@v2.4.0\n with:\n install: npm ci\n secrets:\n gh_token: ${{ secrets.GITHUB_TOKEN }}\n" }, { "path": ".github/workflows/release_tracking.yml", "content": "name: Release Event Tracking\n# Measure a datadog event every time a release occurs\n\non:\n pull_request:\n types:\n - closed\n - opened\n - reopened\n\n release:\n types: [published]\n\njobs:\n release-tracking:\n name: Release Tracking\n uses: primer/.github/.github/workflows/release_tracking.yml@v2.4.0\n secrets:\n datadog_api_key: ${{ secrets.DATADOG_API_KEY }}\n" }, { "path": ".github/workflows/stale.yml", "content": "name: Stale\non:\n schedule:\n - cron: '0 * * * *'\n\njobs:\n stale:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/stale@v10\n with:\n \n # General settings\n days-before-stale: 60\n days-before-close: 7\n enable-statistics: true\n operations-per-run: 100\n remove-stale-when-updated: true\n \n # PR specific settings\n delete-branch: true\n stale-pr-message: \"Hi! This pull request has been marked as stale because it has been open with no activity for 60 days. You can comment on the pull request or remove the stale label to keep it open. If you do nothing, this pull request will be closed in 7 days.\"\n \n # Issue specific settings\n days-before-issue-stale: 180\n stale-issue-message: \"Hi! This issue has been marked as stale because it has been open with no activity for 180 days. You can comment on the issue or remove the stale label to keep it open. If you do nothing, this issue will be closed in 7 days.\"\n\n" }, { "path": ".github/workflows/welcome.yml", "content": "name: Welcome\non:\n pull_request:\n types:\n # On by default if you specify no types.\n - \"opened\"\n - \"reopened\"\n - \"synchronize\"\n # For `skip-label` only.\n - \"labeled\"\n - \"unlabeled\"\n\njobs:\n release-template:\n if: ${{ github.head_ref == 'changeset-release/main' || github.head_ref == 'changeset-release/next_major' }}\n runs-on: ubuntu-latest\n steps:\n - name: Checkout repository\n uses: actions/checkout@v6\n\n - name: Set up Node.js\n uses: actions/setup-node@v6\n with:\n node-version: 18.x\n cache: 'npm'\n\n - name: Get or Create Comment\n uses: actions/github-script@v8\n with:\n github-token: ${{ secrets.GITHUB_TOKEN }}\n script: |\n const fs = require('fs')\n const body = await fs.readFileSync('.github/release_template.md', 'utf8')\n const result = await github.rest.issues.listComments({\n issue_number: context.issue.number,\n owner: context.repo.owner,\n repo: context.repo.repo\n });\n console.log(result.data)\n const primerComments = result.data.filter(c => c.user.login == 'github-actions[bot]')\n if (!primerComments.length) {\n await github.rest.issues.createComment({\n issue_number: context.issue.number,\n owner: context.repo.owner,\n repo: context.repo.repo,\n body: body.replace('{{PR_AUTHOR}}', context.payload.sender.login)\n })\n }\n\n check-for-changeset:\n name: Check for changeset\n runs-on: ubuntu-latest\n env:\n SKIP_LABEL: \"skip changeset\"\n steps:\n - if: \"contains(github.event.pull_request.labels.*.name, 'skip changeset')\"\n run: echo \"passed\"; exit 0;\n - if: \"!contains(github.event.pull_request.labels.*.name, 'skip changeset')\"\n uses: actions/checkout@v6\n with:\n ref: ${{ github.event.pull_request.head.sha }}\n - if: \"!contains(github.event.pull_request.labels.*.name, 'skip changeset')\"\n name: \"Check for changeset\"\n run: script/check-for-changeset\n \n bundle-stats:\n needs: release-template\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v6\n - uses: actions/setup-node@v6\n with:\n node-version: 18\n cache: 'npm'\n - run: npm ci\n - run: npm run pretest\n - name: Reporting bundle sizes\n uses: primer/comment-token-update@main\n env:\n GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}\n GITHUB_USER: github-actions[bot]\n with:\n comment-token: 'bundle_table'\n script: |\n bundles=$(script/bundle-size-report.js)\n if [[ $bundles ]]; then\n echo \"### Bundles with a size change since [latest release](https://github.com/primer/css/releases/latest)\"\n echo \"\"\n echo \"$bundles\"\n fi\n\n - name: Reporting selector diffs\n uses: primer/comment-token-update@main\n env:\n GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}\n GITHUB_USER: github-actions[bot]\n with:\n comment-token: 'diff_report'\n script: |\n diff=$(script/selector-diff-report)\n if [[ $diff ]]; then\n echo \"### Selectors added/removed since [latest release](https://github.com/primer/css/releases/latest)\"\n echo \"\"\n echo \"\\`\\`\\`diff\"\n echo \"$diff\"\n echo \"\\`\\`\\`\"\n fi\n\n label-release:\n if: ${{ github.repository == 'primer/css' }}\n name: Semantic Version Label\n runs-on: ubuntu-latest\n steps:\n - uses: actions/github-script@v8\n id: version-result\n with:\n github-token: \"${{ secrets.GITHUB_TOKEN }}\"\n result-encoding: string\n script: |\n const diff_url = context.payload.pull_request.diff_url\n const result = await github.request(diff_url)\n const match = [...result.data.matchAll(/^\\+['\"]@primer\\/css['\"]:\\s(patch|minor|major)/mg)]\n if (match && match[0]) {\n return match[0][1]\n }\n\n - uses: actions/github-script@v8\n env:\n RELEASE: ${{ steps.version-result.outputs.result }}\n with:\n github-token: ${{secrets.GITHUB_TOKEN}}\n script: |\n if (process.env.RELEASE == 'undefined') { return }\n const issue = await github.rest.issues.get({\n owner: context.repo.owner,\n repo: context.repo.repo,\n issue_number: context.issue.number\n })\n const currentLabels = issue.data.labels.map( l => l.name)\n const newLabel = `${process.env.RELEASE} release`\n if (!currentLabels.includes(newLabel)) {\n const otherReleaseLabels = currentLabels.filter( l => l.endsWith(' release'))\n if (otherReleaseLabels.length) {\n github.rest.issues.removeLabel({\n issue_number: context.issue.number,\n owner: context.repo.owner,\n repo: context.repo.repo,\n name: [otherReleaseLabels]\n })\n }\n github.rest.issues.addLabels({\n issue_number: context.issue.number,\n owner: context.repo.owner,\n repo: context.repo.repo,\n labels: [newLabel]\n })\n }\n" }, { "path": ".gitignore", "content": "*.log\n*.tgz\n.DS_Store\n.cache/\n.changelog/\n.next/\n.sass-cache\n.storybuild/\n.stylelintcache\n_site\ndist/\ndocs/dist\nnode_modules/\npublic/\nsearchIndex.js\ntmp\nyarn.lock\n" }, { "path": ".npmignore", "content": "__tests__/\n.changeset/\n.github/\ndocs/\nscript/\n# we ignore this because everything in src/ is copied out in script/prepublish\nsrc/\ntmp/\ndocs.scss\n.*\n*.log\nvercel.json\n*.config.js\n" }, { "path": ".npmrc", "content": "git-tag-version=false\nlegacy-peer-deps=true\nno-audit=true\nno-fund=true\n" }, { "path": ".vercelignore", "content": ".*.sw?\n.changelog/\ndist/\ndocs/dist\ndocs/public/\n" }, { "path": ".vscode/story-template.code-snippets", "content": "{\n \"story-template\": {\n \"prefix\": \"story-template\",\n \"body\": [\n \"import React from 'react'\",\n \"import clsx from 'clsx'\",\n \"// import { StoryTemplateName } from './OtherStoryFile.stories' // import stories for component compositions\",\n \"\",\n \"export default {\",\n \" title: 'Components/ComponentName',\",\n \" excludeStories: ['ComponentTemplateName'],\",\n \" layout: 'padded',\",\n \" argTypes: {\",\n \" booleanExample: {\",\n \" control: {type: 'boolean'},\",\n \" description: 'true/false toggle to controls',\",\n \" table: {\",\n \" category: 'Pick one: CSS, HTML, Interactive'\",\n \" }\",\n \" },\",\n \" radioExample: {\",\n \" options: ['string1', 'string2', 'string3', 'string4'],\",\n \" control: {\",\n \" type: 'inline-radio',\",\n \" },\",\n \" description: 'radio buttons mapping to strings (example: use for variant class names)',\",\n \" table: {\",\n \" category: 'Pick one: CSS, HTML, Interactive'\",\n \" }\",\n \" },\",\n \" stringExample: {\",\n \" name: 'stringExample',\",\n \" type: 'string',\",\n \" description: 'text box control',\",\n \" table: {\",\n \" category: 'Pick one: CSS, HTML, Interactive'\",\n \" }\",\n \" },\",\n \" children: {\",\n \" description: 'creates a slot for children',\",\n \" table: {\",\n \" category: 'HTML'\",\n \" }\",\n \" }\",\n \" }\",\n \"}\",\n \"\",\n \"// build every component case here in the template (private api)\",\n \"export const ComponentTemplateName = ({booleanExample, radioExample, stringExample, children}) => (\",\n \" \",\n \" {/* use {children} for wrapper component templates */}\",\n \" <>\",\n \" {stringExample}\",\n \" {children}\",\n \" \",\n \" \",\n \")\",\n \"\",\n \"// create a \\\"playground\\\" demo page that may set some defaults and allow story to access component controls\",\n \"export const Playground = ComponentTemplateName.bind({})\",\n \"Playground.args = {\",\n \" stringExample: 'Default text',\",\n \" booleanExample: false\",\n \" // children: (\",\n \" // <>\",\n \" // \",\n \" // \",\n \" // )\",\n \"}\",\n \"\"\n ],\n \"description\": \"Basic component story jsx template\"\n }\n}\n" }, { "path": "CHANGELOG.md", "content": "# @primer/css\n\n## 22.1.1\n\n### Patch Changes\n\n- [#3012](https://github.com/primer/css/pull/3012) [`31df244`](https://github.com/primer/css/commit/31df2449f00048c949811b4b4dbe51665567811c) Thanks [@francinelucca](https://github.com/francinelucca)! - Add max-width to kbd styles\n\n- [#2811](https://github.com/primer/css/pull/2811) [`0de15b2`](https://github.com/primer/css/commit/0de15b2e32a741908a4a8d1e8126a891b3d74e07) Thanks [@FloEdelmann](https://github.com/FloEdelmann)! - Reduce spacing between consecutive `
` elements\n\n## 22.1.0\n\n### Minor Changes\n\n- [#2907](https://github.com/primer/css/pull/2907) [`67109bd`](https://github.com/primer/css/commit/67109bda0dcd7e191c3071f5eb58006fdbe4e3c8) Thanks [@langermank](https://github.com/langermank)! - Change `contrast` input background to `bgColor-default`\n\n## 22.0.2\n\n### Patch Changes\n\n- [#2866](https://github.com/primer/css/pull/2866) [`d43c856`](https://github.com/primer/css/commit/d43c85624326770d91e8239c0c5e6693700e4481) Thanks [@lukasoppermann](https://github.com/lukasoppermann)! - Update @primer/primitives peerDependencies to 10.x || 11.x\n\n- [#2871](https://github.com/primer/css/pull/2871) [`0d2eb58`](https://github.com/primer/css/commit/0d2eb58fbf18092c2ef4ba252522fea98a6aaa1f) Thanks [@lukasoppermann](https://github.com/lukasoppermann)! - Add default font weight (--base-text-weight-normal, 400) to body\n\n## 22.0.1\n\n### Patch Changes\n\n- [#2864](https://github.com/primer/css/pull/2864) [`0311c08`](https://github.com/primer/css/commit/0311c0849cdfc0fcb18ee0ed96ce2a3ba5c136d6) Thanks [@lukasoppermann](https://github.com/lukasoppermann)! - Add --fontStack-sansSerif to $body-font variable\n\n## 22.0.0\n\n### Major Changes\n\n- [#2789](https://github.com/primer/css/pull/2789) [`4113637`](https://github.com/primer/css/commit/4113637b3bb60cad1e2dca82e70d92ad05694399) Thanks [@jonrohan](https://github.com/jonrohan)! - Remove @primer/view-components imports for styles moved to primer/view_components\n\n## 21.5.1\n\n### Patch Changes\n\n- [#2727](https://github.com/primer/css/pull/2727) [`7d4cd40`](https://github.com/primer/css/commit/7d4cd4061a0ffb70355944d33ea49883819da26a) Thanks [@kawakamimoeki](https://github.com/kawakamimoeki)! - Removed .css extension from @import and modified @primer/primitives to be output as Sass code.\n\n- [#2728](https://github.com/primer/css/pull/2728) [`7eaba91`](https://github.com/primer/css/commit/7eaba91768f8e31cf6b0c5538230ce2d04e9bfec) Thanks [@lukasoppermann](https://github.com/lukasoppermann)! - Update primer/primitives to allow for version 9 and 10\n\n- [#2680](https://github.com/primer/css/pull/2680) [`1eb467e`](https://github.com/primer/css/commit/1eb467e9edb3d9ddb84c47bfbf9a21cb9950bf06) Thanks [@robinwhittleton](https://github.com/robinwhittleton)! - Use tabular numbers in tables\n\n## 21.5.0\n\n### Minor Changes\n\n- [#2724](https://github.com/primer/css/pull/2724) [`30d144b`](https://github.com/primer/css/commit/30d144b507d75e5b5ef6d4ec156978acaeb9fad4) Thanks [@camertron](https://github.com/camertron)! - Move prod @primer/\\* dependencies to dev\n\n## 21.4.0\n\n### Minor Changes\n\n- [#2691](https://github.com/primer/css/pull/2691) [`5097430`](https://github.com/primer/css/commit/50974300dfe8cf636e1b15b5fbd5b0dc5adf4f2e) Thanks [@dylanatsmith](https://github.com/dylanatsmith)! - Remove background behind images in markdown-body\n\n### Patch Changes\n\n- [#2710](https://github.com/primer/css/pull/2710) [`3017831`](https://github.com/primer/css/commit/30178319550ecbf318ecbfa36675c80b6e95e3ba) Thanks [@smockle](https://github.com/smockle)! - Replace deprecated CSS properties in '.sr-only'\n\n## 21.3.6\n\n### Patch Changes\n\n- [#2624](https://github.com/primer/css/pull/2624) [`7e62532`](https://github.com/primer/css/commit/7e6253292c3de10a1f333cfc4e6e3216e6a53ab8) Thanks [@sideshowbarker](https://github.com/sideshowbarker)! - drop “display: none” from details element contents styling\n\n## 21.3.5\n\n### Patch Changes\n\n- [#2657](https://github.com/primer/css/pull/2657) [`b87c379`](https://github.com/primer/css/commit/b87c3796fbb7b2127c98e3fda086f9f1cfd8bc9b) Thanks [@jonrohan](https://github.com/jonrohan)! - Import `primitives/index.scss` in the main `primer.css` file.\n\n## 21.3.4\n\n### Patch Changes\n\n- [#2651](https://github.com/primer/css/pull/2651) [`e329973`](https://github.com/primer/css/commit/e329973d4d788b8b6d2688a907f88c8458b6db7a) Thanks [@jonrohan](https://github.com/jonrohan)! - Bug fix: Removing complex padding calc on kbd\n\n## 21.3.3\n\n### Patch Changes\n\n- [#2644](https://github.com/primer/css/pull/2644) [`eba2b2c`](https://github.com/primer/css/commit/eba2b2c157efc2e16a7bf36db0882c6f330b7bd4) Thanks [@camertron](https://github.com/camertron)! - Fix 'clac' -> 'calc' typo\n\n## 21.3.2\n\n### Patch Changes\n\n- [#2643](https://github.com/primer/css/pull/2643) [`ab6076c`](https://github.com/primer/css/commit/ab6076c62bac967d5d0c805744e50cc8d73d4171) Thanks [@langermank](https://github.com/langermank)! - Use `control` borders for subnav + disabled button fix\n\n- [#2634](https://github.com/primer/css/pull/2634) [`af3ab76`](https://github.com/primer/css/commit/af3ab76454fd3045315082a14cdc5bdfcabd860a) Thanks [@jonrohan](https://github.com/jonrohan)! - Upgrade to @primer/primtives@8.2.0 and @primer/stylelint-config@13.0.0-rc\n\n## 21.3.1\n\n### Patch Changes\n\n- [#2613](https://github.com/primer/css/pull/2613) [`2eabfde`](https://github.com/primer/css/commit/2eabfdea85667c041e86e13376f1d2823b64fcb1) Thanks [@stamat](https://github.com/stamat)! - removing !important from letter-spacing marketing typography\n\n- [#2611](https://github.com/primer/css/pull/2611) [`e867934`](https://github.com/primer/css/commit/e8679348ca29c85b470a6b04a821d7143d4acf16) Thanks [@keithamus](https://github.com/keithamus)! - drop !important from details styling\n\n## 21.3.0\n\n### Minor Changes\n\n- [#2598](https://github.com/primer/css/pull/2598) [`434fcac`](https://github.com/primer/css/commit/434fcac6c296ddd3155945420f785a6b48eb693c) Thanks [@langermank](https://github.com/langermank)! - Remove marketing icon variables\n\n- [#2596](https://github.com/primer/css/pull/2596) [`9896c79`](https://github.com/primer/css/commit/9896c79a846cbaa633d21573be252b8e4812e79d) Thanks [@jonrohan](https://github.com/jonrohan)! - Move native color styles from the color-modes bundle to the base bundle\n\n### Patch Changes\n\n- [#2606](https://github.com/primer/css/pull/2606) [`a03827b`](https://github.com/primer/css/commit/a03827b0a0c76c6df8d15d04ea2ec7976799cc92) Thanks [@langermank](https://github.com/langermank)! - Cleanup old Primitive imports\n\n## 21.2.2\n\n### Patch Changes\n\n- [#2590](https://github.com/primer/css/pull/2590) [`d75a512`](https://github.com/primer/css/commit/d75a512298f087e49cac1787fd131501cc308f07) Thanks [@langermank](https://github.com/langermank)! - Use legacy shadow for all floating shadows\n\n## 21.2.1\n\n### Patch Changes\n\n- [#2581](https://github.com/primer/css/pull/2581) [`5d8a030`](https://github.com/primer/css/commit/5d8a030319fa64c99f0d3bed85079884d7086474) Thanks [@langermank](https://github.com/langermank)! - Update shadow utils\n\n- [#2588](https://github.com/primer/css/pull/2588) [`7a25839`](https://github.com/primer/css/commit/7a2583942001decfa3d8172833a5f6b55469c56b) Thanks [@langermank](https://github.com/langermank)! - Bump Primitives + fix selectmenu box-shadow\n\n## 21.2.0\n\n### Minor Changes\n\n- [#2532](https://github.com/primer/css/pull/2532) [`51666ea3`](https://github.com/primer/css/commit/51666ea3b4a00239ff60e420782b5b647484b264) Thanks [@langermank](https://github.com/langermank)! - Tooltip visual refresh\n\n### Patch Changes\n\n- [#2566](https://github.com/primer/css/pull/2566) [`407c5676`](https://github.com/primer/css/commit/407c5676d61985d9061adb77ed2de5bfcc0312ec) Thanks [@langermank](https://github.com/langermank)! - Add `monospace` CSS var to global scss var\n\n## 21.1.1\n\n### Patch Changes\n\n- [#2563](https://github.com/primer/css/pull/2563) [`41952457`](https://github.com/primer/css/commit/4195245722defddf9563fe32b0cbe5c9ae5d42d4) Thanks [@langermank](https://github.com/langermank)! - fix backdrop selector\n\n- [#2564](https://github.com/primer/css/pull/2564) [`8757be58`](https://github.com/primer/css/commit/8757be584db2ddda8153566dc1906451832d3833) Thanks [@langermank](https://github.com/langermank)! - Add new color utility classes\n\n## 21.1.0\n\n### Minor Changes\n\n- [#2554](https://github.com/primer/css/pull/2554) [`f0b0d208`](https://github.com/primer/css/commit/f0b0d208cf04cbf77bfc46b40d65d5f53b109aaa) Thanks [@jonrohan](https://github.com/jonrohan)! - Remove primitives css tokens import from support package\n\n## 21.0.10\n\n### Patch Changes\n\n- [#2549](https://github.com/primer/css/pull/2549) [`df764e1a`](https://github.com/primer/css/commit/df764e1a617d13af34d97bd7b4f06b8a478facd2) Thanks [@keithamus](https://github.com/keithamus)! - Fix styles for ::backdrop\n\n## 21.0.9\n\n### Patch Changes\n\n- [#2520](https://github.com/primer/css/pull/2520) [`7e2622fe`](https://github.com/primer/css/commit/7e2622fe9679969dd195438f5dd7108d2e8991c5) Thanks [@langermank](https://github.com/langermank)! - Use `control` border on default btn in an input group\n\n## 21.0.8\n\n### Patch Changes\n\n- [#2510](https://github.com/primer/css/pull/2510) [`49e81506`](https://github.com/primer/css/commit/49e81506a99bd83c05a8459a49f1fd3ae60da20b) Thanks [@langermank](https://github.com/langermank)! - Use `control` tokens for legacy form CSS border-color\n\n- [#2508](https://github.com/primer/css/pull/2508) [`a8b1bed2`](https://github.com/primer/css/commit/a8b1bed2ead5824fb6332f61c6728f324b51d32c) Thanks [@langermank](https://github.com/langermank)! - Bump Primitive v7.12.0\n\n- [#2443](https://github.com/primer/css/pull/2443) [`e1b3f4f4`](https://github.com/primer/css/commit/e1b3f4f4bd041c6858b275142b8321c383c6aa54) Thanks [@jonrohan](https://github.com/jonrohan)! - Remove yarn in favor of npm\n\n## 21.0.7\n\n### Patch Changes\n\n- [#2472](https://github.com/primer/css/pull/2472) [`3ee117e1`](https://github.com/primer/css/commit/3ee117e1bd67675a5bdc2739bbe4d05f4e297c30) Thanks [@simurai](https://github.com/simurai)! - Add `::selection` to `color-mode-theme()` mixin\n\n## 21.0.6\n\n### Patch Changes\n\n- [#2470](https://github.com/primer/css/pull/2470) [`03e1a26c`](https://github.com/primer/css/commit/03e1a26c0d4fcc85450998f0f1f8120a1db48acc) Thanks [@langermank](https://github.com/langermank)! - Revert #2461 default selection color\n\n## 21.0.5\n\n### Patch Changes\n\n- [#2468](https://github.com/primer/css/pull/2468) [`c6d5d1df`](https://github.com/primer/css/commit/c6d5d1dfd3eafe44197ddc262f605dc5373437ac) Thanks [@keithamus](https://github.com/keithamus)! - Fix bug with `color-mode` mixin not applying correctly due to `::selection`\n\n## 21.0.4\n\n### Patch Changes\n\n- [#2466](https://github.com/primer/css/pull/2466) [`92047014`](https://github.com/primer/css/commit/9204701416b547255a1ebaeb2bd8a20056ffb8d4) Thanks [@langermank](https://github.com/langermank)! - Use `@primer/primitives` v8 colors with fallbacks\n\n## 21.0.3\n\n### Patch Changes\n\n- [#2461](https://github.com/primer/css/pull/2461) [`abc89659`](https://github.com/primer/css/commit/abc8965913313bbb969db9e1148fb5add9327ec9) Thanks [@langermank](https://github.com/langermank)! - Add default `::selection` color\n\n- [#2410](https://github.com/primer/css/pull/2410) [`344224fc`](https://github.com/primer/css/commit/344224fccdef2f3a37ed931c512e400b47301ea2) Thanks [@dylanatsmith](https://github.com/dylanatsmith)! - Add width utility to limit line length for readability\n\n- [#2457](https://github.com/primer/css/pull/2457) [`352ed7b7`](https://github.com/primer/css/commit/352ed7b75585c686c996a5e7c2c29e20e41d0672) Thanks [@langermank](https://github.com/langermank)! - Add new PostCSS fallback config\n\n## 21.0.2\n\n### Patch Changes\n\n- [#2439](https://github.com/primer/css/pull/2439) [`fe17ba05`](https://github.com/primer/css/commit/fe17ba05ac4372fb1d49edc08c8c036c2da54dce) Thanks [@langermank](https://github.com/langermank)! - Bump primitives v7.11.10\n\n- [#2437](https://github.com/primer/css/pull/2437) [`616c8935`](https://github.com/primer/css/commit/616c89354bf8571488674b44f431361d66e9eae3) Thanks [@langermank](https://github.com/langermank)! - Add `::selection` to root color vars\n\n- [#2438](https://github.com/primer/css/pull/2438) [`abdb3a93`](https://github.com/primer/css/commit/abdb3a93f10705472cea773473eb3ada6b918d31) Thanks [@langermank](https://github.com/langermank)! - Add utility typography CSS vars to main bundle\n\n- [#2426](https://github.com/primer/css/pull/2426) [`713d9a59`](https://github.com/primer/css/commit/713d9a5921e565baf39fe522dfa73eb603b850e2) Thanks [@langermank](https://github.com/langermank)! - Add `mktg` CSS vars to PCSS\n\n- [#2430](https://github.com/primer/css/pull/2430) [`c415172f`](https://github.com/primer/css/commit/c415172fca56a7f22d21f66a79e49da7dd443f96) Thanks [@langermank](https://github.com/langermank)! - Remove duplicate `font-weight` fallbacks from utilities\n\n## 21.0.1\n\n### Patch Changes\n\n- [#2421](https://github.com/primer/css/pull/2421) [`7dfcb0c5`](https://github.com/primer/css/commit/7dfcb0c595881439c15a38389168272da5aab59d) Thanks [@simurai](https://github.com/simurai)! - Bump @primer/primitives to `7.11.5`\n\n- [#2404](https://github.com/primer/css/pull/2404) [`ae9d71b1`](https://github.com/primer/css/commit/ae9d71b117bf37e8f618db4474efd87c75a2f531) Thanks [@langermank](https://github.com/langermank)! - Add `font-size` to `html` tag to make rem units \"safe\"\n\n- [#2418](https://github.com/primer/css/pull/2418) [`bce38dee`](https://github.com/primer/css/commit/bce38dee01027c6ac6dd3dbcec644eec153fd2ba) Thanks [@simurai](https://github.com/simurai)! - Make list type selector case sensitive\n\n- [#2425](https://github.com/primer/css/pull/2425) [`718f1aa6`](https://github.com/primer/css/commit/718f1aa6a6f8b5823e55b6b2616a729f59392e83) Thanks [@langermank](https://github.com/langermank)! - - Bump primitives to v7.11.7\n - Update size tokens to Primitives pre-v8 release\n\n## 21.0.0\n\n### Major Changes\n\n- [#2403](https://github.com/primer/css/pull/2403) [`256affcf`](https://github.com/primer/css/commit/256affcf3404c97d3db199a0b3cf32d3b864627c) Thanks [@lukasoppermann](https://github.com/lukasoppermann)! - ## Removed DiffStat component\n - the diffStat component is removed from primer/css\n - the component is very specific to this use-case, it is not generic enough to be part of the primer design system and was thus chosen for removal\n - the component will be added to the github codebase directly so that it is still available\n - if you are working within github.com you should be ale to use diffStat just like before. On other projects you will need to copy the diffStat code and add it to your codebase\n\n- [#2402](https://github.com/primer/css/pull/2402) [`c6e214b7`](https://github.com/primer/css/commit/c6e214b75b5a25d3ebb7f41ca922c93d395ac109) Thanks [@simurai](https://github.com/simurai)! - Remove `form-validation` styles\n\n- [#2405](https://github.com/primer/css/pull/2405) [`85f31cc8`](https://github.com/primer/css/commit/85f31cc8f8d4423a712fda166421eb0ac7d6d562) Thanks [@simurai](https://github.com/simurai)! - Remove `ActionList`\n\n### Patch Changes\n\n- [#2407](https://github.com/primer/css/pull/2407) [`607337cc`](https://github.com/primer/css/commit/607337cce57e59c7bee00486b63fa43ce845aff2) Thanks [@simurai](https://github.com/simurai)! - Bump @primer/primitives to `7.11.2`\n\n- [#2409](https://github.com/primer/css/pull/2409) [`cf38a932`](https://github.com/primer/css/commit/cf38a932e76e00a8c83c351bbb5f1ae23649d1b4) Thanks [@simurai](https://github.com/simurai)! - Bump @primer/primitives to `7.11.3`\n\n- [#2391](https://github.com/primer/css/pull/2391) [`95ab0d0f`](https://github.com/primer/css/commit/95ab0d0f48fde360a9f0b0f6a8af0323b3e891da) Thanks [@simurai](https://github.com/simurai)! - Prevent `.show-on-focus` to change width/height\n\n## 20.8.3\n\n### Patch Changes\n\n- [#2390](https://github.com/primer/css/pull/2390) [`73ae8ec4`](https://github.com/primer/css/commit/73ae8ec45bc7d92ecfe58226d233176856f7bca9) Thanks [@simurai](https://github.com/simurai)! - Remove `autocheck` + `status-indicator` styles\n\n- [#2388](https://github.com/primer/css/pull/2388) [`3ceb1964`](https://github.com/primer/css/commit/3ceb19648b651f2a5b2f571d066aa895af8f443e) Thanks [@arelia](https://github.com/arelia)! - update default for flex wrap styles\n\n- [#2378](https://github.com/primer/css/pull/2378) [`55f35e1d`](https://github.com/primer/css/commit/55f35e1d0fc9a441f14f29b61ac5fbefbf3c4884) Thanks [@simurai](https://github.com/simurai)! - Fix code block color inside a `
`\n\n- [#2386](https://github.com/primer/css/pull/2386) [`1b53e23e`](https://github.com/primer/css/commit/1b53e23ed39fc2c001b07d810ebe516f2957f325) Thanks [@josepmartins](https://github.com/josepmartins)! - Add responsive `border-radius` story\n\n## 20.8.2\n\n### Patch Changes\n\n- [#2380](https://github.com/primer/css/pull/2380) [`3010e199`](https://github.com/primer/css/commit/3010e199bb5068838eb46e73e748d1e5e2f0143c) Thanks [@langermank](https://github.com/langermank)! - Bump Primitives v7.11.1\n\n## 20.8.1\n\n### Patch Changes\n\n- [#2365](https://github.com/primer/css/pull/2365) [`4b94fbb7`](https://github.com/primer/css/commit/4b94fbb759e163abb9495777973b5a6e700769f7) Thanks [@jackbrewer](https://github.com/jackbrewer)! - Remove trailing margin from last-child within a markdown table cell\n\n- [#2351](https://github.com/primer/css/pull/2351) [`1b6694c4`](https://github.com/primer/css/commit/1b6694c40903eae4e107cd9d59faf5020a42f944) Thanks [@jonrohan](https://github.com/jonrohan)! - Updating to primer view components 0.0.117\n\n## 20.8.0\n\n### Minor Changes\n\n- [`d7a4c343`](https://github.com/primer/css/commit/d7a4c343ab1bc0d7f55ff85d735c93d9825419ae) Thanks [@jonrohan](https://github.com/jonrohan)! - Importing more styles from Primer View Components\n - https://github.com/primer/view_components/pull/1587\n - https://github.com/primer/view_components/pull/1590\n - https://github.com/primer/view_components/pull/1592\n - https://github.com/primer/view_components/pull/1593\n - https://github.com/primer/view_components/pull/1594\n - https://github.com/primer/view_components/pull/1598\n - https://github.com/primer/view_components/pull/1599\n - https://github.com/primer/view_components/pull/1600\n - https://github.com/primer/view_components/pull/1601\n - https://github.com/primer/view_components/pull/1607\n - https://github.com/primer/view_components/pull/1609\n - https://github.com/primer/view_components/pull/1618\n - https://github.com/primer/view_components/pull/1626\n\n- [#2318](https://github.com/primer/css/pull/2318) [`aee4b6f5`](https://github.com/primer/css/commit/aee4b6f571d88f391fcf98170857c4eed7b1ae82) Thanks [@jonrohan](https://github.com/jonrohan)! - Import blankslate styles from primer/view-components\n\n### Patch Changes\n\n- [#2309](https://github.com/primer/css/pull/2309) [`f76e7858`](https://github.com/primer/css/commit/f76e785807d9c9c64530201f858798e67668afe2) Thanks [@jdanyow](https://github.com/jdanyow)! - Use `--color-fg-default` for `mark`\n\n- [#2330](https://github.com/primer/css/pull/2330) [`83250f82`](https://github.com/primer/css/commit/83250f82751092cc9ad3a8fb46262a0f0f2a3a96) Thanks [@stevenlaidlaw](https://github.com/stevenlaidlaw)! - Fix collapsing spaces within inline code blocks\n\n- [#2327](https://github.com/primer/css/pull/2327) [`8cf13e98`](https://github.com/primer/css/commit/8cf13e984ca27a286a706fd2b7243980d3de7985) Thanks [@simurai](https://github.com/simurai)! - Move `fieldset` + `label` styles to `base.scss`\n\n- [#2340](https://github.com/primer/css/pull/2340) [`ecbcbb1b`](https://github.com/primer/css/commit/ecbcbb1b04e72fc2006be7ea8211aae0732d3530) Thanks [@simurai](https://github.com/simurai)! - Import `Layout` from PVC\n\n## 20.7.1\n\n### Patch Changes\n\n- [#2322](https://github.com/primer/css/pull/2322) [`1259ddd4`](https://github.com/primer/css/commit/1259ddd408a415a74b740992a8d64197b48bf1f4) Thanks [@langermank](https://github.com/langermank)! - Use correct weight token for typography utilities\n\n## 20.7.0\n\n### Minor Changes\n\n- [#2311](https://github.com/primer/css/pull/2311) [`3b397d98`](https://github.com/primer/css/commit/3b397d985c23592d0e18d14fe75d71ea7572aa18) Thanks [@langermank](https://github.com/langermank)! - [WIP] Convert margin utilities to rem units with fallbacks\n\n- [`46016601`](https://github.com/primer/css/commit/46016601e89d8b777e06dc7d6cd4a272dba17f7d) Thanks [@langermank](https://github.com/langermank)! - Convert padding and border utilities to use `rem` units with `px` fallbacks\n\n- [#2302](https://github.com/primer/css/pull/2302) [`412d7820`](https://github.com/primer/css/commit/412d78208ba76e7a1cdc0872a2adcadabc3d0414) Thanks [@langermank](https://github.com/langermank)! - Convert typography to use `rem` units with `px` fallbacks\n\n## 20.6.1\n\n### Patch Changes\n\n- [#2305](https://github.com/primer/css/pull/2305) [`12355f87`](https://github.com/primer/css/commit/12355f87ac8955da0707f6be6fa06a936c26b2fd) Thanks [@vdepizzol](https://github.com/vdepizzol)! - Add upper-roman and upper-alpha list types\n\n- [#2307](https://github.com/primer/css/pull/2307) [`0370244f`](https://github.com/primer/css/commit/0370244f49322863534c62b5b5589128c551ccc7) Thanks [@jonrohan](https://github.com/jonrohan)! - Bugfix: Adding `white-space: normal` to Overlay compontn to reset wrapping.\n\n- [#2316](https://github.com/primer/css/pull/2316) [`f3acb2b1`](https://github.com/primer/css/commit/f3acb2b116f10955e1ba4f1a35aa874eed019ceb) Thanks [@langermank](https://github.com/langermank)! - Increase Checkbox/Radio border contrast\n\n- [#2314](https://github.com/primer/css/pull/2314) [`c8100be7`](https://github.com/primer/css/commit/c8100be771634093fe3a4d36481fc43c0d966015) Thanks [@langermank](https://github.com/langermank)! - [Bug] Radio checked + focus state fixes\n\n- [#2310](https://github.com/primer/css/pull/2310) [`551492eb`](https://github.com/primer/css/commit/551492ebf420b3ea8872e9a101bd874d8b4e8a1d) Thanks [@jdanyow](https://github.com/jdanyow)! - Update dropdown hover selector\n\n## 20.6.0\n\n### Minor Changes\n\n- [#2300](https://github.com/primer/css/pull/2300) [`5a0b9b29`](https://github.com/primer/css/commit/5a0b9b2939c1428430d249aeeb9adb0ba8bc18ce) Thanks [@simurai](https://github.com/simurai)! - Add `Noto Sans` to the body font stack\n\n## 20.5.1\n\n### Patch Changes\n\n- [#2292](https://github.com/primer/css/pull/2292) [`9a4f2ff7`](https://github.com/primer/css/commit/9a4f2ff78073be69127664b36d469c4b1ddf0c7c) Thanks [@camertron](https://github.com/camertron)! - Add additional :not selectors for flash classes\n\n## 20.5.0\n\n### Minor Changes\n\n- [#2289](https://github.com/primer/css/pull/2289) [`c23346b9`](https://github.com/primer/css/commit/c23346b9a401beb3c2b0cbc853574a5259db42a5) Thanks [@camertron](https://github.com/camertron)! - Don't apply flash\\* classes to banners\n\n## 20.4.8\n\n### Patch Changes\n\n- [#2284](https://github.com/primer/css/pull/2284) [`8336334d`](https://github.com/primer/css/commit/8336334d12ba3a1dac323c853b9fdcaacd480b68) Thanks [@koddsson](https://github.com/koddsson)! - Remove action list item animation\n\n## 20.4.7\n\n### Patch Changes\n\n- [#2228](https://github.com/primer/css/pull/2228) [`b087282e`](https://github.com/primer/css/commit/b087282e5040a53a48b707bd94151a3b896659db) Thanks [@simurai](https://github.com/simurai)! - Improve `AvatarStack` when hovering\n\n* [#2269](https://github.com/primer/css/pull/2269) [`27266fcd`](https://github.com/primer/css/commit/27266fcd212af6256511a912fb85c303e1b3a4d9) Thanks [@vdepizzol](https://github.com/vdepizzol)! - Fix Overlay easing animation\n\n- [#2260](https://github.com/primer/css/pull/2260) [`6569fb3a`](https://github.com/primer/css/commit/6569fb3a048e324fea63674077fee587b6b9912a) Thanks [@simurai](https://github.com/simurai)! - Fix nested `