From 34414eba8dfb858d55d76297d2956864ea74ec94 Mon Sep 17 00:00:00 2001 From: Tsuyoshi Yamaguchi Date: Wed, 1 Nov 2023 21:43:10 +0900 Subject: [PATCH] Add index.js (#2) * Add index.js * Add test workflow --- .github/workflows/test.yml | 28 ++++ .vscode/settings.json | 7 +- biome.json | 2 +- index.js | 290 +++++++++++++++++++++++++++++++++++++ package.json | 6 +- 5 files changed, 328 insertions(+), 5 deletions(-) create mode 100644 .github/workflows/test.yml create mode 100644 index.js diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml new file mode 100644 index 0000000..55c07ce --- /dev/null +++ b/.github/workflows/test.yml @@ -0,0 +1,28 @@ +name: test + +concurrency: + group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }} + cancel-in-progress: true + +on: + push: + branches: + - main + pull_request: + types: + - opened + - reopened + - synchronize + - ready_for_review + +jobs: + test: + name: Test + runs-on: ubuntu-latest + + steps: + - uses: actions/checkout@v4 + - uses: oven-sh/setup-bun@v1 + - run: bun install + - run: bun lint + - run: bun format:check diff --git a/.vscode/settings.json b/.vscode/settings.json index dc70ac3..638a494 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,5 +1,10 @@ { + "[javascript]": { + "editor.defaultFormatter": "biomejs.biome" + }, + "cSpell.words": ["biomejs", "stylelint"], "editor.codeActionsOnSave": { - "quickfix.biome": true + "quickfix.biome": true, + "source.organizeImports.biome": true } } diff --git a/biome.json b/biome.json index 410edee..f78bc32 100644 --- a/biome.json +++ b/biome.json @@ -13,7 +13,7 @@ "enabled": true, "formatWithErrors": false, "indentStyle": "tab", - "indentSize": 2, + "indentWidth": 2, "lineWidth": 100, "ignore": [] }, diff --git a/index.js b/index.js new file mode 100644 index 0000000..9e24694 --- /dev/null +++ b/index.js @@ -0,0 +1,290 @@ +// @ts-check + +/** + * @param {string | undefined} [name] + * @returns {string[]} + */ +function top_right_bottom_left(name) { + const _prefix = name !== undefined ? `${name}-` : '' + + return [ + name ?? [], + `${_prefix}top`, + `${_prefix}right`, + `${_prefix}bottom`, + `${_prefix}left`, + ].flat() +} + +/** + * @param {string | undefined} [name] + * @returns {string[]} + */ +function block_inline(name) { + const _prefix = name !== undefined ? `${name}-` : '' + + return [ + `${_prefix}block`, + `${_prefix}block-start`, + `${_prefix}block-end`, + `${_prefix}inline`, + `${_prefix}inline-start`, + `${_prefix}inline-end`, + ] +} + +/** + * @param {string} name + * @returns {string[]} + */ +function start_end(name) { + return [`${name}`, `${name}-start`, `${name}-end`] +} + +/** + * @param {string} name + * @returns {string[]} + */ +function size_with_min_max(name) { + return [name, `min-${name}`, `max-${name}`] +} + +/** + * @param {string | undefined} [name] + * @returns {string[]} + */ +function border(name) { + const _infix = name !== undefined ? `-${name}` : '' + + return [ + `border${_infix}`, + `border${_infix}-width`, + `border${_infix}-style`, + `border${_infix}-color`, + `border${_infix}-radius`, + ] +} + +const order = [ + 'composes', + 'all', + + // positioning + 'position', + 'z-index', + top_right_bottom_left(), + 'inset', + start_end('inset-block'), + start_end('inset-inline'), + + // display + 'display', + 'opacity', + 'visibility', + 'content', + + // flex / grid + 'flex', + 'flex-basis', + 'flex-direction', + 'flex-flow', + 'flex-grow', + 'flex-shrink', + 'flex-wrap', + 'grid', + 'grid-area', + 'grid-template-areas', + 'grid-template-columns', + 'grid-template-rows', + 'grid-auto-flow', + 'grid-auto-columns', + 'grid-auto-rows', + 'grid-gap', + 'grid-column', + 'grid-column-start', + 'grid-column-end', + 'grid-row', + 'grid-row-start', + 'grid-row-end', + 'align-content', + 'align-items', + 'align-self', + 'place-content', + 'place-items', + 'place-self', + 'justify-content', + 'justify-items', + 'justify-self', + 'order', + 'gap', + 'column-gap', + 'row-gap', + + // size + size_with_min_max('width'), + size_with_min_max('inline-size'), + size_with_min_max('height'), + size_with_min_max('block-size'), + 'aspect-ratio', + 'box-sizing', + + // margin + top_right_bottom_left('margin'), + block_inline('margin'), + + // padding + top_right_bottom_left('padding'), + block_inline('padding'), + + // border + border(), + border('top'), + border('right'), + border('bottom'), + border('left'), + border('block'), + border('block-start'), + border('block-end'), + border('inline'), + border('inline-start'), + border('inline-end'), + 'border-start-start-radius', + 'border-start-end-radius', + 'border-end-start-radius', + 'border-end-end-radius', + 'border-image', + 'border-image-outset', + 'border-image-repeat', + 'border-image-slice', + 'border-image-source', + 'border-image-width', + 'border-collapse', + 'border-spacing', + 'box-shadow', + + // outline + 'outline', + 'outline-color', + 'outline-offset', + 'outline-style', + 'outline-width', + + // flow control + 'overflow', + 'overflow-x', + 'overflow-y', + 'float', + 'clear', + + // font + 'color', + 'font', + 'font-family', + 'font-size', + 'font-size-adjust', + 'font-stretch', + 'font-style', + 'font-variant', + 'font-weight', + 'font-feature-settings', + 'font-kerning', + 'font-language-override', + 'font-optical-sizing', + 'font-palette', + 'font-synthesis', + 'font-variant-alternates', + 'font-variant-caps', + 'font-variant-east-asian', + 'font-variant-ligatures', + 'font-variant-numeric', + 'font-variant-position', + 'font-variation-settings', + 'font-display', + 'letter-spacing', + 'line-height', + 'text-align', + 'text-align-last', + 'text-decoration', + 'text-decoration-color', + 'text-decoration-line', + 'text-decoration-style', + 'text-indent', + 'text-justify', + 'text-shadow', + 'text-overflow', + 'text-rendering', + 'text-size-adjust', + 'text-transform', + 'text-underline-position', + 'text-emphasis', + 'text-emphasis-color', + 'text-emphasis-position', + 'text-emphasis-style', + 'text-combine-upright', + 'text-orientation', + 'text-overflow', + 'white-space', + 'word-spacing', + 'word-wrap', + 'word-break', + 'overflow-wrap', + 'tab-size', + 'hyphens', + + // background + 'background', + 'background-attachment', + 'background-blend-mode', + 'background-clip', + 'background-color', + 'background-image', + 'background-origin', + 'background-position', + 'background-position-x', + 'background-position-y', + 'background-size', + 'background-repeat', + + // mask + 'mask', + 'mask-clip', + 'mask-composite', + 'mask-image', + 'mask-mode', + 'mask-origin', + 'mask-position', + 'mask-repeat', + 'mask-size', + 'mask-type', + + // transform + 'translate', + 'rotate', + 'scale', + 'transform', + 'transform-origin', + 'transform-style', + 'transform-box', + + // animation / transition + 'animation', + 'animation-delay', + 'animation-direction', + 'animation-duration', + 'animation-fill-mode', + 'animation-iteration-count', + 'animation-name', + 'animation-play-state', + 'transition', + 'transition-delay', + 'transition-duration', + 'transition-property', + 'transition-timing-function', +].flat() + +module.exports = { + plugins: 'stylelint-order', + rules: { + 'order/properties-order': [order, { unspecified: 'bottomAlphabetical', severity: 'warning' }], + }, +} diff --git a/package.json b/package.json index 5bce423..c3561a3 100644 --- a/package.json +++ b/package.json @@ -4,9 +4,9 @@ "description": "Prettify CSS property order", "main": "index.js", "scripts": { - "lint": "biome check ./src", - "format": "biome format --write ./src", - "format:check": "biome format ./src" + "lint": "biome check index.js", + "format": "biome format --write index.js", + "format:check": "biome format index.js" }, "keywords": [ "stylelint",