docs/script/migrate-colors-primer-18.js

540 строки
16 KiB
JavaScript
Executable File

#!/usr/bin/env node
import walkSync from 'walk-sync'
import fs from 'fs/promises'
const colorMap = {
'color-text-primary': 'color-fg-default',
'color-text-secondary': 'color-fg-muted',
'color-text-tertiary': 'color-fg-muted',
'color-text-link': 'color-fg-accent',
'color-text-success': 'color-fg-success',
'color-text-warning': 'color-fg-attention',
'color-text-danger': 'color-fg-danger',
'color-text-inverse': 'color-fg-on-emphasis',
'color-text-white': '',
'color-icon-primary': 'color-fg-default',
'color-icon-secondary': 'color-fg-muted',
'color-icon-tertiary': 'color-fg-muted',
'color-icon-info': 'color-fg-accent',
'color-icon-danger': 'color-fg-danger',
'color-icon-success': 'color-fg-success',
'color-icon-warning': 'color-fg-attention',
'color-border-primary': 'color-border-default',
'color-border-secondary': 'color-border-muted',
'color-border-tertiary': 'color-border-default',
'color-border-inverse': '',
'color-border-info': 'color-border-accent-emphasis',
'color-border-warning': 'color-border-attention-emphasis',
'color-bg-canvas': 'color-bg-default',
'color-bg-canvas-inverse': 'color-bg-emphasis',
'color-bg-canvas-inset': 'color-bg-inset',
'color-bg-primary': 'color-bg-default',
'color-bg-secondary': 'color-bg-subtle',
'color-bg-tertiary': 'color-bg-subtle',
'color-bg-info': 'color-bg-accent',
'color-bg-info-inverse': 'color-bg-accent-emphasis',
'color-bg-danger-inverse': 'color-bg-danger-emphasis',
'color-bg-success-inverse': 'color-bg-success-emphasis',
'color-bg-warning': 'color-bg-attention',
'color-bg-warning-inverse': 'color-bg-attention-emphasis',
'text-inherit': 'color-fg-inherit',
}
/******************************************************************************/
async function readFiles(opts) {
const paths = walkSync('./', {
directories: false,
includeBasePath: true,
...opts,
})
return await Promise.all(paths.map(async (path) => [path, await fs.readFile(path, 'utf8')]))
}
function withAllFiles(files, fn) {
return files.map(([path, file]) => [path, fn(path, file)])
}
async function writeFiles(files) {
return await Promise.all(files.map(async ([path, file]) => await fs.writeFile(path, file)))
}
/******************************************************************************/
let files = await readFiles({
globs: [
'components/**',
'content/**',
'contributing/**',
'data/**',
'includes/**',
'lib/**',
'middleware/**',
'pages/**',
'stylesheets/**',
'tests/**',
// 'translations/**',
],
})
files = withAllFiles(files, (path, file) => {
Object.keys(colorMap)
.sort((a, b) => b.length - a.length)
.forEach((key) => {
file = file.replaceAll(key, colorMap[key])
})
return file
})
await writeFiles(files)
/****
check for allowed colors in vars
****/
const allowedVarColors = [
'color-canvas-default-transparent',
'color-marketing-icon-primary',
'color-marketing-icon-secondary',
'color-diff-blob-addition-num-text',
'color-diff-blob-addition-fg',
'color-diff-blob-addition-num-bg',
'color-diff-blob-addition-line-bg',
'color-diff-blob-addition-word-bg',
'color-diff-blob-deletion-num-text',
'color-diff-blob-deletion-fg',
'color-diff-blob-deletion-num-bg',
'color-diff-blob-deletion-line-bg',
'color-diff-blob-deletion-word-bg',
'color-diff-blob-hunk-num-bg',
'color-diff-blob-expander-icon',
'color-diff-blob-selected-line-highlight-mix-blend-mode',
'color-diffstat-deletion-border',
'color-diffstat-addition-border',
'color-diffstat-addition-bg',
'color-search-keyword-hl',
'color-prettylights-syntax-comment',
'color-prettylights-syntax-constant',
'color-prettylights-syntax-entity',
'color-prettylights-syntax-storage-modifier-import',
'color-prettylights-syntax-entity-tag',
'color-prettylights-syntax-keyword',
'color-prettylights-syntax-string',
'color-prettylights-syntax-variable',
'color-prettylights-syntax-brackethighlighter-unmatched',
'color-prettylights-syntax-invalid-illegal-text',
'color-prettylights-syntax-invalid-illegal-bg',
'color-prettylights-syntax-carriage-return-text',
'color-prettylights-syntax-carriage-return-bg',
'color-prettylights-syntax-string-regexp',
'color-prettylights-syntax-markup-list',
'color-prettylights-syntax-markup-heading',
'color-prettylights-syntax-markup-italic',
'color-prettylights-syntax-markup-bold',
'color-prettylights-syntax-markup-deleted-text',
'color-prettylights-syntax-markup-deleted-bg',
'color-prettylights-syntax-markup-inserted-text',
'color-prettylights-syntax-markup-inserted-bg',
'color-prettylights-syntax-markup-changed-text',
'color-prettylights-syntax-markup-changed-bg',
'color-prettylights-syntax-markup-ignored-text',
'color-prettylights-syntax-markup-ignored-bg',
'color-prettylights-syntax-meta-diff-range',
'color-prettylights-syntax-brackethighlighter-angle',
'color-prettylights-syntax-sublimelinter-gutter-mark',
'color-prettylights-syntax-constant-other-reference-link',
'color-codemirror-text',
'color-codemirror-bg',
'color-codemirror-gutters-bg',
'color-codemirror-guttermarker-text',
'color-codemirror-guttermarker-subtle-text',
'color-codemirror-linenumber-text',
'color-codemirror-cursor',
'color-codemirror-selection-bg',
'color-codemirror-activeline-bg',
'color-codemirror-matchingbracket-text',
'color-codemirror-lines-bg',
'color-codemirror-syntax-comment',
'color-codemirror-syntax-constant',
'color-codemirror-syntax-entity',
'color-codemirror-syntax-keyword',
'color-codemirror-syntax-storage',
'color-codemirror-syntax-string',
'color-codemirror-syntax-support',
'color-codemirror-syntax-variable',
'color-checks-bg',
'color-checks-run-border-width',
'color-checks-container-border-width',
'color-checks-text-primary',
'color-checks-text-secondary',
'color-checks-text-link',
'color-checks-btn-icon',
'color-checks-btn-hover-icon',
'color-checks-btn-hover-bg',
'color-checks-input-text',
'color-checks-input-placeholder-text',
'color-checks-input-focus-text',
'color-checks-input-bg',
'color-checks-input-shadow',
'color-checks-donut-error',
'color-checks-donut-pending',
'color-checks-donut-success',
'color-checks-donut-neutral',
'color-checks-dropdown-text',
'color-checks-dropdown-bg',
'color-checks-dropdown-border',
'color-checks-dropdown-shadow',
'color-checks-dropdown-hover-text',
'color-checks-dropdown-hover-bg',
'color-checks-dropdown-btn-hover-text',
'color-checks-dropdown-btn-hover-bg',
'color-checks-scrollbar-thumb-bg',
'color-checks-header-label-text',
'color-checks-header-label-open-text',
'color-checks-header-border',
'color-checks-header-icon',
'color-checks-line-text',
'color-checks-line-num-text',
'color-checks-line-timestamp-text',
'color-checks-line-hover-bg',
'color-checks-line-selected-bg',
'color-checks-line-selected-num-text',
'color-checks-line-dt-fm-text',
'color-checks-line-dt-fm-bg',
'color-checks-gate-bg',
'color-checks-gate-text',
'color-checks-gate-waiting-text',
'color-checks-step-header-open-bg',
'color-checks-step-error-text',
'color-checks-step-warning-text',
'color-checks-logline-text',
'color-checks-logline-num-text',
'color-checks-logline-debug-text',
'color-checks-logline-error-text',
'color-checks-logline-error-num-text',
'color-checks-logline-error-bg',
'color-checks-logline-warning-text',
'color-checks-logline-warning-num-text',
'color-checks-logline-warning-bg',
'color-checks-logline-command-text',
'color-checks-logline-section-text',
'color-checks-ansi-black',
'color-checks-ansi-black-bright',
'color-checks-ansi-white',
'color-checks-ansi-white-bright',
'color-checks-ansi-gray',
'color-checks-ansi-red',
'color-checks-ansi-red-bright',
'color-checks-ansi-green',
'color-checks-ansi-green-bright',
'color-checks-ansi-yellow',
'color-checks-ansi-yellow-bright',
'color-checks-ansi-blue',
'color-checks-ansi-blue-bright',
'color-checks-ansi-magenta',
'color-checks-ansi-magenta-bright',
'color-checks-ansi-cyan',
'color-checks-ansi-cyan-bright',
'color-project-header-bg',
'color-project-sidebar-bg',
'color-project-gradient-in',
'color-project-gradient-out',
'color-mktg-success',
'color-mktg-info',
'color-mktg-bg-shade-gradient-top',
'color-mktg-bg-shade-gradient-bottom',
'color-mktg-btn-bg-top',
'color-mktg-btn-bg-bottom',
'color-mktg-btn-bg-overlay-top',
'color-mktg-btn-bg-overlay-bottom',
'color-mktg-btn-text',
'color-mktg-btn-primary-bg-top',
'color-mktg-btn-primary-bg-bottom',
'color-mktg-btn-primary-bg-overlay-top',
'color-mktg-btn-primary-bg-overlay-bottom',
'color-mktg-btn-primary-text',
'color-mktg-btn-enterprise-bg-top',
'color-mktg-btn-enterprise-bg-bottom',
'color-mktg-btn-enterprise-bg-overlay-top',
'color-mktg-btn-enterprise-bg-overlay-bottom',
'color-mktg-btn-enterprise-text',
'color-mktg-btn-outline-text',
'color-mktg-btn-outline-border',
'color-mktg-btn-outline-hover-text',
'color-mktg-btn-outline-hover-border',
'color-mktg-btn-outline-focus-border',
'color-mktg-btn-outline-focus-border-inset',
'color-mktg-btn-dark-text',
'color-mktg-btn-dark-border',
'color-mktg-btn-dark-hover-text',
'color-mktg-btn-dark-hover-border',
'color-mktg-btn-dark-focus-border',
'color-mktg-btn-dark-focus-border-inset',
'color-avatar-bg',
'color-avatar-border',
'color-avatar-stack-fade',
'color-avatar-stack-fade-more',
'color-avatar-child-shadow',
'color-topic-tag-border',
'color-select-menu-backdrop-border',
'color-select-menu-tap-highlight',
'color-select-menu-tap-focus-bg',
'color-overlay-shadow',
'color-header-text',
'color-header-bg',
'color-header-logo',
'color-header-search-bg',
'color-header-search-border',
'color-sidenav-selected-bg',
'color-menu-bg-active',
'color-input-disabled-bg',
'color-timeline-badge-bg',
'color-ansi-black',
'color-ansi-black-bright',
'color-ansi-white',
'color-ansi-white-bright',
'color-ansi-gray',
'color-ansi-red',
'color-ansi-red-bright',
'color-ansi-green',
'color-ansi-green-bright',
'color-ansi-yellow',
'color-ansi-yellow-bright',
'color-ansi-blue',
'color-ansi-blue-bright',
'color-ansi-magenta',
'color-ansi-magenta-bright',
'color-ansi-cyan',
'color-ansi-cyan-bright',
'color-btn-text',
'color-btn-bg',
'color-btn-border',
'color-btn-shadow',
'color-btn-inset-shadow',
'color-btn-hover-bg',
'color-btn-hover-border',
'color-btn-active-bg',
'color-btn-active-border',
'color-btn-selected-bg',
'color-btn-focus-bg',
'color-btn-focus-border',
'color-btn-focus-shadow',
'color-btn-shadow-active',
'color-btn-shadow-input-focus',
'color-btn-counter-bg',
'color-btn-primary-text',
'color-btn-primary-bg',
'color-btn-primary-border',
'color-btn-primary-shadow',
'color-btn-primary-inset-shadow',
'color-btn-primary-hover-bg',
'color-btn-primary-hover-border',
'color-btn-primary-selected-bg',
'color-btn-primary-selected-shadow',
'color-btn-primary-disabled-text',
'color-btn-primary-disabled-bg',
'color-btn-primary-disabled-border',
'color-btn-primary-focus-bg',
'color-btn-primary-focus-border',
'color-btn-primary-focus-shadow',
'color-btn-primary-icon',
'color-btn-primary-counter-bg',
'color-btn-outline-text',
'color-btn-outline-hover-text',
'color-btn-outline-hover-bg',
'color-btn-outline-hover-border',
'color-btn-outline-hover-shadow',
'color-btn-outline-hover-inset-shadow',
'color-btn-outline-hover-counter-bg',
'color-btn-outline-selected-text',
'color-btn-outline-selected-bg',
'color-btn-outline-selected-border',
'color-btn-outline-selected-shadow',
'color-btn-outline-disabled-text',
'color-btn-outline-disabled-bg',
'color-btn-outline-disabled-counter-bg',
'color-btn-outline-focus-border',
'color-btn-outline-focus-shadow',
'color-btn-outline-counter-bg',
'color-btn-danger-text',
'color-btn-danger-hover-text',
'color-btn-danger-hover-bg',
'color-btn-danger-hover-border',
'color-btn-danger-hover-shadow',
'color-btn-danger-hover-inset-shadow',
'color-btn-danger-hover-counter-bg',
'color-btn-danger-selected-text',
'color-btn-danger-selected-bg',
'color-btn-danger-selected-border',
'color-btn-danger-selected-shadow',
'color-btn-danger-disabled-text',
'color-btn-danger-disabled-bg',
'color-btn-danger-disabled-counter-bg',
'color-btn-danger-focus-border',
'color-btn-danger-focus-shadow',
'color-btn-danger-counter-bg',
'color-btn-danger-icon',
'color-btn-danger-hover-icon',
'color-underlinenav-icon',
'color-underlinenav-border-hover',
'color-fg-default',
'color-fg-muted',
'color-fg-subtle',
'color-fg-on-emphasis',
'color-canvas-default',
'color-canvas-overlay',
'color-canvas-inset',
'color-canvas-subtle',
'color-border-default',
'color-border-muted',
'color-border-subtle',
'color-shadow-small',
'color-shadow-medium',
'color-shadow-large',
'color-shadow-extra-large',
'color-neutral-emphasis-plus',
'color-neutral-emphasis',
'color-neutral-muted',
'color-neutral-subtle',
'color-accent-fg',
'color-accent-emphasis',
'color-accent-muted',
'color-accent-subtle',
'color-success-fg',
'color-success-emphasis',
'color-success-muted',
'color-success-subtle',
'color-attention-fg',
'color-attention-emphasis',
'color-attention-muted',
'color-attention-subtle',
'color-severe-fg',
'color-severe-emphasis',
'color-severe-muted',
'color-severe-subtle',
'color-danger-fg',
'color-danger-emphasis',
'color-danger-muted',
'color-danger-subtle',
'color-done-fg',
'color-done-emphasis',
'color-done-muted',
'color-done-subtle',
'color-sponsors-fg',
'color-sponsors-emphasis',
'color-sponsors-muted',
'color-sponsors-subtle',
'color-primer-fg-disabled',
'color-primer-canvas-backdrop',
'color-primer-canvas-sticky',
'color-primer-border-active',
'color-primer-border-contrast',
'color-primer-shadow-highlight',
'color-primer-shadow-inset',
'color-primer-shadow-focus',
'color-scale-black',
'color-scale-white',
'color-scale-gray-0',
'color-scale-gray-1',
'color-scale-gray-2',
'color-scale-gray-3',
'color-scale-gray-4',
'color-scale-gray-5',
'color-scale-gray-6',
'color-scale-gray-7',
'color-scale-gray-8',
'color-scale-gray-9',
'color-scale-blue-0',
'color-scale-blue-1',
'color-scale-blue-2',
'color-scale-blue-3',
'color-scale-blue-4',
'color-scale-blue-5',
'color-scale-blue-6',
'color-scale-blue-7',
'color-scale-blue-8',
'color-scale-blue-9',
'color-scale-green-0',
'color-scale-green-1',
'color-scale-green-2',
'color-scale-green-3',
'color-scale-green-4',
'color-scale-green-5',
'color-scale-green-6',
'color-scale-green-7',
'color-scale-green-8',
'color-scale-green-9',
'color-scale-yellow-0',
'color-scale-yellow-1',
'color-scale-yellow-2',
'color-scale-yellow-3',
'color-scale-yellow-4',
'color-scale-yellow-5',
'color-scale-yellow-6',
'color-scale-yellow-7',
'color-scale-yellow-8',
'color-scale-yellow-9',
'color-scale-orange-0',
'color-scale-orange-1',
'color-scale-orange-2',
'color-scale-orange-3',
'color-scale-orange-4',
'color-scale-orange-5',
'color-scale-orange-6',
'color-scale-orange-7',
'color-scale-orange-8',
'color-scale-orange-9',
'color-scale-red-0',
'color-scale-red-1',
'color-scale-red-2',
'color-scale-red-3',
'color-scale-red-4',
'color-scale-red-5',
'color-scale-red-6',
'color-scale-red-7',
'color-scale-red-8',
'color-scale-red-9',
'color-scale-purple-0',
'color-scale-purple-1',
'color-scale-purple-2',
'color-scale-purple-3',
'color-scale-purple-4',
'color-scale-purple-5',
'color-scale-purple-6',
'color-scale-purple-7',
'color-scale-purple-8',
'color-scale-purple-9',
'color-scale-pink-0',
'color-scale-pink-1',
'color-scale-pink-2',
'color-scale-pink-3',
'color-scale-pink-4',
'color-scale-pink-5',
'color-scale-pink-6',
'color-scale-pink-7',
'color-scale-pink-8',
'color-scale-pink-9',
'color-scale-coral-0',
'color-scale-coral-1',
'color-scale-coral-2',
'color-scale-coral-3',
'color-scale-coral-4',
'color-scale-coral-5',
'color-scale-coral-6',
'color-scale-coral-7',
'color-scale-coral-8',
'color-scale-coral-9',
]
for (const [path, file] of files) {
for (const match of file.matchAll(/var\(--(.*?)\)/g)) {
if (!allowedVarColors.includes(match[1])) {
console.error(path, match[1])
}
}
}