Skip to content

Commit

Permalink
added mint-values
Browse files Browse the repository at this point in the history
  • Loading branch information
@harshpathakzz
harshpathakzz committed Dec 30, 2024
1 parent 14c7825 commit 511db21
Show file tree
Hide file tree
Showing 2 changed files with 210 additions and 3 deletions.
5 changes: 2 additions & 3 deletions packages/stylelint-config/custom-plugins/no-primitive-vars.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,13 @@ const stylelint = require('stylelint');

const ruleName = 'mint/no-primitive-color-variables';

const {primitiveTokens} =require('../mint-values/index.js');
const messages = stylelint.utils.ruleMessages(ruleName, {
rejected: (variable) => `The primitive color variable "${variable}" is not allowed. Use a semantic token or a utility class instead. Using a utility class is preferred.`
});

// List of banned primitive color variables
const bannedVariables = [
'--green500',
'--gray900'
...primitiveTokens
];

const plugin = stylelint.createPlugin(ruleName, function (enabled) {
Expand Down
208 changes: 208 additions & 0 deletions packages/stylelint-config/mint-values/index.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,208 @@
export const primitiveTokens = [
'--black',
'--white',
'--gray900',
'--gray800',
'--gray700',
'--gray600',
'--gray500',
'--gray400',
'--gray300',
'--gray200',
'--gray150',
'--gray100',
'--gray50',
'--green500',
'--green300',
'--green100',
'--purple500',
'--purple300',
'--purple100',
'--yellow500',
'--yellow100',
'--red500',
'--red100',
'--overlay00',
'--overlay30',
'--overlay70',
'--dangerouslySetPrimaryBg',
'--tempNbtPink',
'--tempNbtYellow',
'--tempNbtBlue',
'--tempNbtGray',
'--tempNbtRed',
];


export const backgroundTokens = [
'--background-primary',
'--background-secondary',
'--background-tertiary',
'--background-transparent',
'--background-surface-primary',
'--background-surface-secondary',
'--background-inverse-primary',
'--background-overlay-primary',
'--background-overlay-secondary',
'--background-always-dark',
'--background-always-light',
'--background-accent',
'--background-positive',
'--background-negative',
'--background-warning',
'--background-accent-subtle',
'--background-positive-subtle',
'--background-negative-subtle',
'--background-warning-subtle',
'--background-accent-secondary',
'--background-accent-secondary-subtle',
];


export const borderTokens = [
'--border-primary',
'--border-disabled',
'--border-accent',
'--border-positive',
'--border-negative',
'--border-neutral',
];


export const contentTokens = [
'--content-primary',
'--content-secondary',
'--content-tertiary',
'--content-inverse-primary',
'--content-inverse-secondary',
'--content-disabled',
'--content-on-colour',
'--content-on-colour-inverse',
'--content-accent',
'--content-negative',
'--content-warning',
'--content-positive',
'--content-accent-secondary',
'--content-accent-secondary-subtle',
];


export const interactionTokens = [
'--bg-transparent-hover',
'--bg-accent-hover',
'--bg-accent-subtle-hover',
'--bg-transparent-accent-hover',
'--bg-positive-hover',
'--bg-positive-subtle-hover',
'--bg-transparent-positive-hover',
'--bg-negative-hover',
'--bg-negative-subtle-hover',
'--bg-transparent-negative-hover',
'--bg-transparent-selected',
'--bg-accent-selected',
'--bg-accent-subtle-selected',
'--bg-transparent-accent-selected',
'--bg-positive-selected',
'--bg-positive-subtle-selected',
'--bg-transparent-positive-selected',
'--bg-negative-selected',
'--bg-negative-subtle-selected',
'--bg-transparent-negative-selected',
];

export const semanticTokens = [
...backgroundTokens,
...contentTokens,
...borderTokens,
...interactionTokens,
];


export const backgroundUtilClasses = [
'backgroundPrimary',
'backgroundSecondary',
'backgroundTertiary',
'backgroundTransparent',
'backgroundSurfacePrimary',
'backgroundSurfaceSecondary',
'backgroundInversePrimary',
'backgroundOverlayPrimary',
'backgroundOverlaySecondary',
'backgroundAlwaysDark',
'backgroundAlwaysLight',
'backgroundAccent',
'backgroundPositive',
'backgroundNegative',
'backgroundWarning',
'backgroundAccentSubtle',
'backgroundPositiveSubtle',
'backgroundNegativeSubtle',
'backgroundWarningSubtle',
'backgroundAccentSecondary',
'backgroundAccentSecondarySubtle',
];

export const borderUtilClasses = [
'borderPrimary',
'borderDisabled',
'borderAccent',
'borderPositive',
'borderNegative',
'borderNeutral',
];

export const contentUtilClasses = [
'contentPrimary',
'contentSecondary',
'contentTertiary',
'contentInversePrimary',
'contentInverseSecondary',
'contentAccent',
'contentNegative',
'contentWarning',
'contentPositive',
'contentDisabled',
'contentOnColour',
'contentOnColourInverse',
'contentAccentSecondary',
'contentAccentSecondarySubtle',
];

export const interactionUtilClasses = [
'backgroundTransparentHover',
'backgroundAccentHover',
'backgroundAccentSubtleHover',
'backgroundTransparentAccentHover',
'backgroundPositiveHover',
'backgroundPositiveSubtleHover',
'backgroundTransparentPositiveHover',
'backgroundNegativeHover',
'backgroundNegativeSubtleHover',
'backgroundTransparentNegativeHover',
'backgroundTransparentSelected',
'backgroundAccentSelected',
'backgroundAccentSubtleSelected',
'backgroundTransparentAccentSelected',
'backgroundPositiveSelected',
'backgroundPositiveSubtleSelected',
'backgroundTransparentPositiveSelected',
'backgroundNegativeSelected',
'backgroundNegativeSubtleSelected',
'backgroundTransparentNegativeSelected',
];
export const tempPodUtilClasses = [
'tempNbtBackgroundPink',
'tempNbtBackgroundYellow',
'tempNbtBackgroundBlue',
'tempNbtBackgroundGray',
'tempNbtBackgroundRed',
];

export const allUtilClasses = [
...backgroundUtilClasses,
...borderUtilClasses,
...contentUtilClasses,
...interactionUtilClasses,
...tempPodUtilClasses,
];

0 comments on commit 511db21

Please sign in to comment.