@culur/config-stylelint 1.0.0 → 1.0.1

package/src/rules/declaration-block-no-redundant-longhand-properties.test.ts

@@ -1,38 +1,41 @@
-import { assert, expect } from 'vitest';
-import {
-  declarationBlockNoRedundantLonghandProperties,
-  declarationBlockNoRedundantLonghandPropertiesRule,
-} from './declaration-block-no-redundant-longhand-properties';
-import { css, testLintAndFix, testRuleValue } from '~/__tests__';
-
-testRuleValue(
-  declarationBlockNoRedundantLonghandPropertiesRule, //
-  rule => {
-    assert(Array.isArray(rule));
-    assert(typeof rule[1] === 'object');
-    expect(rule[1].ignoreShorthands).toHaveLength(1);
-  },
-);
-
-testLintAndFix(
-  {
-    rules: declarationBlockNoRedundantLonghandProperties,
-  },
-  [
-    {
-      code: css`
-        a {
-          margin-top: 1px;
-          margin-right: 2px;
-          margin-bottom: 3px;
-          margin-left: 4px;
-        }
-      `,
-      fixedCode: css`
-        a {
-          margin: 1px 2px 3px 4px;
-        }
-      `,
-    },
-  ],
-);
+import * as utilsPackages from '@culur/utils-packages';
+import { assert, expect } from 'vitest';
+import {
+  declarationBlockNoRedundantLonghandProperties,
+  declarationBlockNoRedundantLonghandPropertiesRule,
+} from './declaration-block-no-redundant-longhand-properties';
+import { css, describeLintAndFix, describeRule } from '~/__tests__';
+
+describeRule(
+  utilsPackages,
+  declarationBlockNoRedundantLonghandPropertiesRule,
+  rule => {
+    assert(Array.isArray(rule));
+    assert(typeof rule[1] === 'object');
+    expect(rule[1].ignoreShorthands).toHaveLength(1);
+  },
+);
+
+describeLintAndFix(
+  utilsPackages,
+  {
+    rules: declarationBlockNoRedundantLonghandProperties,
+  },
+  [
+    {
+      code: css`
+        a {
+          margin-top: 1px;
+          margin-right: 2px;
+          margin-bottom: 3px;
+          margin-left: 4px;
+        }
+      `,
+      fixedCode: css`
+        a {
+          margin: 1px 2px 3px 4px;
+        }
+      `,
+    },
+  ],
+);

package/src/rules/declaration-block-no-redundant-longhand-properties.ts

@@ -1,11 +1,11 @@
-import { defineRule, defineRules } from '~/utils';
-
-export const declarationBlockNoRedundantLonghandPropertiesRule = defineRule<
-  true,
-  { ignoreShorthands?: (string | RegExp)[] }
->([true, { ignoreShorthands: ['grid-template'] }]);
-
-export const declarationBlockNoRedundantLonghandProperties = defineRules({
-  'declaration-block-no-redundant-longhand-properties':
-    declarationBlockNoRedundantLonghandPropertiesRule,
-});
+import { defineRule, defineRules } from '~/utils';
+
+export const declarationBlockNoRedundantLonghandPropertiesRule = defineRule<
+  true,
+  { ignoreShorthands?: (string | RegExp)[] }
+>([true, { ignoreShorthands: ['grid-template'] }]);
+
+export const declarationBlockNoRedundantLonghandProperties = defineRules({
+  'declaration-block-no-redundant-longhand-properties':
+    declarationBlockNoRedundantLonghandPropertiesRule,
+});

package/src/rules/dollar-variable-pattern.test.ts

@@ -1,27 +1,26 @@
-import { assert, expectTypeOf } from 'vitest';
-import {
-  dollarVariablePatternRule,
-  dollarVariablePatternSCSS,
-} from './dollar-variable-pattern';
-import { scss, testLintAndFix, testRuleValue } from '~/__tests__';
-
-testRuleValue(
-  () => dollarVariablePatternRule,
-  rule => {
-    assert(Array.isArray(rule));
-    assert(typeof rule[1] === 'object');
-    expectTypeOf(rule[1].message).toBeString();
-  },
-);
-
-testLintAndFix(
-  {
-    extends: ['stylelint-config-standard-scss'],
-    rules: dollarVariablePatternSCSS,
-  }, //
-  [
-    { isError: false, code: scss`a { $kebab-case: 123; }` },
-    { isError: true, code: scss`a { $snake_case: 123; }` },
-    { isError: true, code: scss`a { $camelCase: 123; }` },
-  ],
-);
+import { assert, expectTypeOf } from 'vitest';
+import * as utilsPackages from '@culur/utils-packages';
+import {
+  dollarVariablePatternRule,
+  dollarVariablePatternSCSS,
+} from './dollar-variable-pattern';
+import { describeLintAndFix, describeRule, scss } from '~/__tests__';
+
+describeRule(utilsPackages, dollarVariablePatternRule, rule => {
+  assert(Array.isArray(rule));
+  assert(typeof rule[1] === 'object');
+  expectTypeOf(rule[1].message).toBeString();
+});
+
+describeLintAndFix(
+  utilsPackages,
+  {
+    extends: ['stylelint-config-standard-scss'],
+    rules: dollarVariablePatternSCSS,
+  },
+  [
+    { isError: false, code: scss`a { $kebab-case: 123; }` },
+    { isError: true, code: scss`a { $snake_case: 123; }` },
+    { isError: true, code: scss`a { $camelCase: 123; }` },
+  ],
+);

package/src/rules/dollar-variable-pattern.ts

@@ -1,18 +1,18 @@
-import { defineRule, defineRules } from '~/utils';
-
-type PrimaryOption = string;
-interface SecondaryOptions {
-  message: string;
-}
-
-export const dollarVariablePatternRule = defineRule<
-  PrimaryOption,
-  SecondaryOptions
->([
-  '^(-{0,2}?[a-z][a-z0-9]*)(-[a-z0-9]+)*$',
-  { message: 'Expected variable to be kebab-case' },
-]);
-
-export const dollarVariablePatternSCSS = defineRules({
-  'scss/dollar-variable-pattern': dollarVariablePatternRule,
-});
+import { defineRule, defineRules } from '~/utils';
+
+type PrimaryOption = string;
+interface SecondaryOptions {
+  message: string;
+}
+
+export const dollarVariablePatternRule = defineRule<
+  PrimaryOption,
+  SecondaryOptions
+>([
+  '^(-{0,2}?[a-z][a-z0-9]*)(-[a-z0-9]+)*$',
+  { message: 'Expected variable to be kebab-case' },
+]);
+
+export const dollarVariablePatternSCSS = defineRules({
+  'scss/dollar-variable-pattern': dollarVariablePatternRule,
+});

package/src/rules/function-no-unknown.test.ts

@@ -1,39 +1,43 @@
-import { assert, expect } from 'vitest';
-import { testLintAndFix, testRuleValue } from '~/__tests__';
-
-testRuleValue(
-  [
-    { hasTailwind: true, hasSass: false, hasVue: false, length: 2 },
-    { hasTailwind: false, hasSass: true, hasVue: false, length: 1 },
-    { hasTailwind: false, hasSass: false, hasVue: true, length: 1 },
-  ],
-  async () => {
-    const module = await import('./function-no-unknown');
-    return module.functionNoUnknownRule();
-  },
-  (rule, options) => {
-    assert(Array.isArray(rule));
-    assert(typeof rule[1] === 'object');
-    expect(rule[1].ignoreFunctions).toHaveLength(options.length);
-  },
-);
-
-testLintAndFix(async () => {
-  const module = await import('./function-no-unknown');
-  return { rules: module.functionNoUnknown() };
-}, [
-  {
-    isError: true,
-    code: 'a { color: unknown(1); }',
-  },
-  {
-    hasTailwind: true,
-    isError: false,
-    code: 'a { color: theme(colors.blue.500); }',
-  },
-  {
-    hasVue: true,
-    isError: false,
-    code: 'a { color: v-bind(colors); }',
-  },
-]);
+import { assert, expect } from 'vitest';
+import * as utilsPackages from '@culur/utils-packages';
+import {
+  functionNoUnknown,
+  functionNoUnknownRule,
+} from './function-no-unknown';
+import { describeLintAndFix, describeRule } from '~/__tests__';
+
+describeRule(
+  utilsPackages,
+  functionNoUnknownRule,
+  [
+    { hasTailwind: true, hasSass: false, hasVue: false, length: 2 },
+    { hasTailwind: false, hasSass: true, hasVue: false, length: 1 },
+    { hasTailwind: false, hasSass: false, hasVue: true, length: 1 },
+  ],
+  (rule, options) => {
+    assert(Array.isArray(rule));
+    assert(typeof rule[1] === 'object');
+    expect(rule[1].ignoreFunctions).toHaveLength(options.length);
+  },
+);
+
+describeLintAndFix(
+  utilsPackages, //
+  () => ({ rules: functionNoUnknown() }),
+  [
+    {
+      isError: true,
+      code: 'a { color: unknown(1); }',
+    },
+    {
+      hasTailwind: true,
+      isError: false,
+      code: 'a { color: theme(colors.blue.500); }',
+    },
+    {
+      hasVue: true,
+      isError: false,
+      code: 'a { color: v-bind(colors); }',
+    },
+  ],
+);

package/src/rules/function-no-unknown.ts

@@ -1,35 +1,35 @@
-import { hasSass, hasTailwind, hasVue } from '@culur/utils-packages';
-import { defineRule, defineRules } from '~/utils';
-
-export const functionNoUnknownRule = () => {
-  const ignoreFunctions = [
-    // https://tailwindcss.com/docs/functions-and-directives#functions
-    ...(hasTailwind() //
-      ? ['theme', 'screen']
-      : []),
-
-    // https://sass-lang.com/documentation/modules/list
-    // https://sass-lang.com/documentation/modules/math
-    // https://sass-lang.com/documentation/modules/color
-    ...(hasSass() //
-      ? [/^(list|math|color)\..+/]
-      : []),
-
-    // https://vuejs.org/api/sfc-css-features.html#v-bind-in-css
-    ...(hasVue() //
-      ? ['v-bind']
-      : []),
-  ];
-
-  return defineRule<boolean, { ignoreFunctions?: (string | RegExp)[] }>([
-    true,
-    ignoreFunctions.length > 0
-      ? { ignoreFunctions }
-      : { ignoreFunctions: undefined },
-  ]);
-};
-
-export const functionNoUnknown = () =>
-  defineRules({
-    'function-no-unknown': functionNoUnknownRule(),
-  });
+import { hasSass, hasTailwind, hasVue } from '@culur/utils-packages';
+import { defineRule, defineRules } from '~/utils';
+
+export function functionNoUnknownRule() {
+  const ignoreFunctions = [
+    // https://tailwindcss.com/docs/functions-and-directives#functions
+    ...(hasTailwind() //
+      ? ['theme', 'screen']
+      : []),
+
+    // https://sass-lang.com/documentation/modules/list
+    // https://sass-lang.com/documentation/modules/math
+    // https://sass-lang.com/documentation/modules/color
+    ...(hasSass() //
+      ? [/^(list|math|color)\..+/]
+      : []),
+
+    // https://vuejs.org/api/sfc-css-features.html#v-bind-in-css
+    ...(hasVue() //
+      ? ['v-bind']
+      : []),
+  ];
+
+  return defineRule<boolean, { ignoreFunctions?: (string | RegExp)[] }>([
+    true,
+    ignoreFunctions.length > 0
+      ? { ignoreFunctions }
+      : { ignoreFunctions: undefined },
+  ]);
+}
+
+export const functionNoUnknown = () =>
+  defineRules({
+    'function-no-unknown': functionNoUnknownRule(),
+  });

package/src/rules/order.test.ts

@@ -1,46 +1,47 @@
-import { assert, expect } from 'vitest';
-import { scss, testLintAndFix, testRuleValue } from '~/__tests__';
-
-testRuleValue(
-  [
-    { hasTailwind: false, hasSass: false, length: 8 },
-    { hasTailwind: true, hasSass: false, length: 15 },
-    { hasTailwind: false, hasSass: true, length: 16 },
-    { hasTailwind: true, hasSass: true, length: 23 },
-  ],
-  async () => {
-    const module = await import('./order');
-    return module.orderRule();
-  },
-  (rule, options) => {
-    assert(Array.isArray(rule));
-
-    assert(Array.isArray(rule[0]));
-    expect(rule[0]).toHaveLength(options.length);
-
-    assert(typeof rule[1] === 'object');
-    expect(rule[1]).toStrictEqual({ unspecified: 'bottom' });
-  },
-);
-
-testLintAndFix(async () => {
-  const module = await import('./order');
-  return {
-    plugins: ['stylelint-order'],
-    rules: module.order(),
-  };
-}, [
-  {
-    hasTailwind: false,
-    hasSass: false,
-    code: scss`
-      a {
-        $variable: 1px;
-        --property: 3px;
-        @variable: 2px;
-        width: 4px;
-      }
-    `,
-    isError: false,
-  },
-]);
+import * as utilsPackages from '@culur/utils-packages';
+import { assert, expect } from 'vitest';
+import { order, orderRule } from './order';
+import { describeLintAndFix, describeRule, scss } from '~/__tests__';
+
+describeRule(
+  utilsPackages,
+  orderRule,
+  [
+    { hasTailwind: false, hasSass: false, length: 8 },
+    { hasTailwind: true, hasSass: false, length: 15 },
+    { hasTailwind: false, hasSass: true, length: 16 },
+    { hasTailwind: true, hasSass: true, length: 23 },
+  ],
+  (rule, testCase) => {
+    assert(Array.isArray(rule));
+
+    assert(Array.isArray(rule[0]));
+    expect(rule[0]).toHaveLength(testCase.length);
+
+    assert(typeof rule[1] === 'object');
+    expect(rule[1]).toStrictEqual({ unspecified: 'bottom' });
+  },
+);
+
+describeLintAndFix(
+  utilsPackages,
+  async () => ({
+    plugins: ['stylelint-order'],
+    rules: order(),
+  }),
+  [
+    {
+      hasTailwind: false,
+      hasSass: false,
+      code: scss`
+        a {
+          $variable: 1px;
+          --property: 3px;
+          @variable: 2px;
+          width: 4px;
+        }
+      `,
+      isError: false,
+    },
+  ],
+);

package/src/rules/order.ts

@@ -1,108 +1,108 @@
-import { hasSass, hasTailwind } from '@culur/utils-packages';
-import { defineRule, defineRules } from '~/utils';
-
-// https://github.com/hudochenkov/stylelint-order/blob/master/rules/order/README.md#options
-
-type Keyword =
-  | 'custom-properties' /**/ // Custom properties (e.g. --property: 10px;)
-  | 'dollar-variables' /***/ // Dollar variables (e.g. $variable)
-  | 'at-variables' /*******/ // At-variables (e.g. @variable available in Less syntax)
-  | 'declarations' /*******/ // CSS declarations (e.g. display: block)
-  | 'rules' /**************/ // Nested rules (e.g. a { span {} })
-  | 'at-rules' /***********/ // Nested at-rules (e.g. div { @media () {} })
-  | 'less-mixins'; /*******/ // Mixins in Less syntax (e.g. .mixin();)
-
-interface AtRule {
-  type: 'at-rule';
-  name?: string;
-  parameter?: string | RegExp;
-  hasBlock?: boolean;
-}
-
-interface Rule {
-  type: 'rule';
-  selector?: string | RegExp;
-  name?: string;
-}
-
-type PrimaryOption = Array<Keyword | AtRule | Rule>;
-interface SecondaryOptions {
-  unspecified?: 'top' | 'bottom' | 'ignore';
-}
-
-/**
- * https://sass-lang.com/documentation/at-rules
- */
-const atRuleScssImport: PrimaryOption = [
-  { type: 'at-rule', name: 'use' },
-  { type: 'at-rule', name: 'forward' },
-  { type: 'at-rule', name: 'import' },
-];
-const atRuleScss: PrimaryOption = [
-  { type: 'at-rule', name: 'function' },
-  { type: 'at-rule', name: 'mixin' },
-  { type: 'at-rule', name: 'extend' },
-  { type: 'at-rule', name: 'include' },
-  { type: 'at-rule', name: 'at-root' },
-];
-
-const variables: PrimaryOption = [
-  'dollar-variables', // $variable
-  'at-variables', // @variable
-  'custom-properties', // --property: 10px
-];
-
-/**
- * https://tailwindcss.com/docs/functions-and-directives
- */
-const atRuleTailwind: PrimaryOption = [
-  { type: 'at-rule', name: 'tailwind' },
-  { type: 'at-rule', name: 'layer' },
-  { type: 'at-rule', name: 'apply' },
-  { type: 'at-rule', name: 'config' },
-];
-
-/**
- * https://v2.tailwindcss.com/docs/functions-and-directives
- *
- * backwards compatible for v2
- */
-const atRuleTailwindV2: PrimaryOption = [
-  { type: 'at-rule', name: 'variants' },
-  { type: 'at-rule', name: 'responsive' },
-  { type: 'at-rule', name: 'screen' },
-];
-
-/**
- * Nested rules (e.g. a { span {} })
- */
-const rules: PrimaryOption = [
-  {
-    type: 'rule',
-    selector: /^&::[\w-]+/,
-  },
-  'rules',
-];
-
-export const orderRule = () =>
-  defineRule<PrimaryOption, SecondaryOptions>([
-    [
-      ...(hasSass() ? atRuleScssImport : []),
-      ...(hasTailwind() ? atRuleTailwind : []),
-      ...variables,
-      ...(hasSass() ? atRuleScss : []),
-      ...(hasTailwind() ? atRuleTailwindV2 : []),
-      'at-rules',
-      'less-mixins',
-      'declarations',
-      ...rules,
-    ],
-    {
-      unspecified: 'bottom',
-    },
-  ]);
-
-export const order = () =>
-  defineRules({
-    'order/order': orderRule(),
-  });
+import { hasSass, hasTailwind } from '@culur/utils-packages';
+import { defineRule, defineRules } from '~/utils';
+
+// https://github.com/hudochenkov/stylelint-order/blob/master/rules/order/README.md#options
+
+type Keyword =
+  | 'custom-properties' /**/ // Custom properties (e.g. --property: 10px;)
+  | 'dollar-variables' /***/ // Dollar variables (e.g. $variable)
+  | 'at-variables' /*******/ // At-variables (e.g. @variable available in Less syntax)
+  | 'declarations' /*******/ // CSS declarations (e.g. display: block)
+  | 'rules' /**************/ // Nested rules (e.g. a { span {} })
+  | 'at-rules' /***********/ // Nested at-rules (e.g. div { @media () {} })
+  | 'less-mixins'; /*******/ // Mixins in Less syntax (e.g. .mixin();)
+
+interface AtRule {
+  type: 'at-rule';
+  name?: string;
+  parameter?: string | RegExp;
+  hasBlock?: boolean;
+}
+
+interface Rule {
+  type: 'rule';
+  selector?: string | RegExp;
+  name?: string;
+}
+
+type PrimaryOption = Array<Keyword | AtRule | Rule>;
+interface SecondaryOptions {
+  unspecified?: 'top' | 'bottom' | 'ignore';
+}
+
+/**
+ * https://sass-lang.com/documentation/at-rules
+ */
+const atRuleScssImport: PrimaryOption = [
+  { type: 'at-rule', name: 'use' },
+  { type: 'at-rule', name: 'forward' },
+  { type: 'at-rule', name: 'import' },
+];
+const atRuleScss: PrimaryOption = [
+  { type: 'at-rule', name: 'function' },
+  { type: 'at-rule', name: 'mixin' },
+  { type: 'at-rule', name: 'extend' },
+  { type: 'at-rule', name: 'include' },
+  { type: 'at-rule', name: 'at-root' },
+];
+
+const variables: PrimaryOption = [
+  'dollar-variables', // $variable
+  'at-variables', // @variable
+  'custom-properties', // --property: 10px
+];
+
+/**
+ * https://tailwindcss.com/docs/functions-and-directives
+ */
+const atRuleTailwind: PrimaryOption = [
+  { type: 'at-rule', name: 'tailwind' },
+  { type: 'at-rule', name: 'layer' },
+  { type: 'at-rule', name: 'apply' },
+  { type: 'at-rule', name: 'config' },
+];
+
+/**
+ * https://v2.tailwindcss.com/docs/functions-and-directives
+ *
+ * backwards compatible for v2
+ */
+const atRuleTailwindV2: PrimaryOption = [
+  { type: 'at-rule', name: 'variants' },
+  { type: 'at-rule', name: 'responsive' },
+  { type: 'at-rule', name: 'screen' },
+];
+
+/**
+ * Nested rules (e.g. a { span {} })
+ */
+const rules: PrimaryOption = [
+  {
+    type: 'rule',
+    selector: /^&::[\w-]+/,
+  },
+  'rules',
+];
+
+export const orderRule = () =>
+  defineRule<PrimaryOption, SecondaryOptions>([
+    [
+      ...(hasSass() ? atRuleScssImport : []),
+      ...(hasTailwind() ? atRuleTailwind : []),
+      ...variables,
+      ...(hasSass() ? atRuleScss : []),
+      ...(hasTailwind() ? atRuleTailwindV2 : []),
+      'at-rules',
+      'less-mixins',
+      'declarations',
+      ...rules,
+    ],
+    {
+      unspecified: 'bottom',
+    },
+  ]);
+
+export const order = () =>
+  defineRules({
+    'order/order': orderRule(),
+  });