@salesforce-ux/eslint-plugin-slds
Version:
ESLint plugin provides custom linting rules specifically built for Salesforce Lightning Design System 2 (SLDS 2 beta)
2,421 lines • 91.2 kB
JavaScript
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __esm = (fn, res) => function __init() {
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
};
var __commonJS = (cb, mod) => function __require() {
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
// src/utils/node.ts
function findAttr(node, key) {
return node.attributes.find(
(attr) => attr.key && attr.key.value.toLowerCase() === key.toLowerCase()
);
}
function isAttributesEmpty(node) {
return !node.attributes || node.attributes.length <= 0;
}
var import_parser, lineBreakPattern, lineEndingPattern;
var init_node = __esm({
"src/utils/node.ts"() {
import_parser = require("@html-eslint/parser");
lineBreakPattern = /\r\n|[\r\n\u2028\u2029]/u;
lineEndingPattern = new RegExp(lineBreakPattern.source, "gu");
}
});
// yaml-file:rule-messages.yml
var require_rule_messages = __commonJS({
"yaml-file:rule-messages.yml"(exports2, module2) {
module2.exports = {
"no-slds-class-overrides": {
"description": "Create new custom CSS classes instead of overriding SLDS selectors",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-slds-class-overrides",
"type": "problem",
"messages": {
"sldsClassOverride": "Overriding .{{className}} isn't supported. To differentiate SLDS and custom classes, create a CSS class in your namespace. Examples: myapp-input, myapp-button."
}
},
"no-deprecated-slds-classes": {
"description": "Please replace the deprecated classes with a modern equivalent",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-deprecated-slds-classes",
"type": "problem",
"messages": {
"deprecatedClass": "The class {{className}} is deprecated and not available in SLDS2. Please update to a supported class."
}
},
"no-deprecated-tokens-slds1": {
"description": "Update outdated design tokens to SLDS 2 styling hooks with similar values. For more information, see Styling Hooks on lightningdesignsystem.com.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-deprecated-tokens-slds1",
"type": "problem",
"messages": {
"deprecatedToken": "Consider removing {{oldValue}} or replacing it with {{newValue}}. Set the fallback to {{oldValue}}. For more info, see Styling Hooks on lightningdesignsystem.com.",
"noReplacement": "Update outdated design tokens to SLDS 2 styling hooks with similar values. For more information, see Styling Hooks on lightningdesignsystem.com."
}
},
"enforce-sds-to-slds-hooks": {
"description": "Convert your existing --sds styling hooks to --slds styling hooks. See lightningdesignsystem.com for more info.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#enforce-sds-to-slds-hooks",
"type": "problem",
"messages": {
"replaceSdsWithSlds": "Replace {{oldValue}} with {{suggestedMatch}} styling hook."
}
},
"enforce-bem-usage": {
"description": "Replace BEM double-dash syntax in class names with single underscore syntax",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#enforce-bem-usage",
"type": "problem",
"messages": {
"bemDoubleDash": "{{actual}} has been retired. Update it to the new name {{newValue}}.",
"fixBemNaming": "Update to correct BEM naming convention"
}
},
"modal-close-button-issue": {
"description": "Update component attributes or CSS classes for the modal close button to comply with the modal component blueprint",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#modal-close-button-issue",
"type": "problem",
"messages": {
"modalCloseButtonIssue": "Update component attributes or CSS classes for the modal close button to comply with the modal component blueprint.",
"removeClass": "Remove the slds-button_icon-inverse class from the modal close button in components that use the SLDS modal blueprint.",
"changeVariant": "Change the variant attribute value from bare-inverse to bare in <lightning-button-icon> or <lightning-icon>.",
"removeVariant": "Remove the variant attribute from the <lightning-icon> component inside the <button> element.",
"ensureButtonClasses": "Add or move slds-button and slds-button_icon to the class attribute of the <button> element or <lightning-button-icon> component.",
"ensureSizeAttribute": "To size icons properly, set the size attribute \u200Cto large in the <lightning-icon> and <lightning-button-icon> components."
}
},
"no-deprecated-classes-slds2": {
"description": "Replace classes that aren't available with SLDS 2 classes",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-deprecated-classes-slds2",
"type": "problem",
"messages": {
"deprecatedClass": "The class {{className}} isn't available in SLDS 2. Update it to a class supported in SLDS 2. See lightningdesignsystem.com for more information.",
"updateToModernClass": "Replace deprecated class with modern equivalent",
"checkDocumentation": "See lightningdesignsystem.com for SLDS 2 class alternatives"
}
},
"lwc-token-to-slds-hook": {
"description": "Replace the deprecated --lwc tokens with the latest --slds tokens. See lightningdesignsystem.com for more info.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#lwc-token-to-slds-hook",
"type": "problem",
"messages": {
"errorWithReplacement": "The '{{oldValue}}' design token is deprecated. Replace it with '{{newValue}}'. For more info, see Global Styling Hooks on lightningdesignsystem.com.",
"errorWithStyleHooks": "The '{{oldValue}}' design token is deprecated. Replace it with the SLDS 2 '{{newValue}}' styling hook and set the fallback to '{{oldValue}}'. For more info, see Global Styling Hooks on lightningdesignsystem.com.",
"errorWithNoRecommendation": "The '{{oldValue}}' design token is deprecated. For more info, see the New Global Styling Hook Guidance on lightningdesignsystem.com."
}
},
"no-sldshook-fallback-for-lwctoken": {
"description": "Avoid using --slds styling hooks as fallback values for --lwc tokens.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-sldshook-fallback-for-lwctoken",
"type": "problem",
"messages": {
"unsupportedFallback": "Remove the {{sldsToken}} styling hook that is used as a fallback value for {{lwcToken}}."
}
},
"no-unsupported-hooks-slds2": {
"description": "Identifies styling hooks that aren't present in SLDS 2. They must be replaced with styling hooks that have a similar effect, or they must be removed.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-unsupported-hooks-slds2",
"type": "problem",
"messages": {
"deprecated": "The {{token}} styling hook isn't present in SLDS 2 and there's no equivalent replacement. Remove it or replace it with a styling hook with a similar effect."
}
},
"no-slds-var-without-fallback": {
"description": "Add fallback values to SLDS styling hooks. The fallback values are used in Salesforce environments where styling hooks are unavailable.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-slds-var-without-fallback",
"type": "problem",
"messages": {
"varWithoutFallback": "Your code uses the {{cssVar}} styling hook without a fallback value. Styling hooks are unavailable in some Salesforce environments. To render your component correctly in all environments, add this fallback value: var({{cssVar}}, {{recommendation}}). To make this fallback value brand-aware, use a branded design token instead of a static value. See Design Tokens on v1.lightningdesignsystem.com."
}
},
"no-slds-namespace-for-custom-hooks": {
"description": "To differentiate custom styling hooks from SLDS styling hooks, create custom styling hooks in your namespace.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-slds-namespace-for-custom-hooks",
"type": "problem",
"messages": {
"customHookNamespace": "Using the --slds namespace for {{token}} isn't supported. Create the custom styling hook in your namespace. Example: --myapp-{{tokenWithoutNamespace}}"
}
},
"no-slds-private-var": {
"description": "Some SLDS styling hooks are private and reserved only for internal Salesforce use. Private SLDS styling hooks have prefixes --_slds- and --slds-s-. For more information, look up private CSS in lightningdesignsystem.com.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-slds-private-var",
"type": "problem",
"messages": {
"privateVar": "This styling hook is reserved for internal Salesforce use. Remove the --_slds- or \u2013slds-s private variable within selector {{prop}}. For more information, look up private CSS in lightningdesignsystem.com."
}
},
"enforce-component-hook-naming-convention": {
"description": "Replace component styling hooks that use a deprecated naming convention.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#enforce-component-hook-naming-convention",
"type": "problem",
"messages": {
"replace": "Replace the deprecated {{oldValue}} component styling hook with {{suggestedMatch}}."
}
},
"no-hardcoded-values-slds1": {
"description": "Replace static values with SLDS 1 design tokens. For more information, look up design tokens on lightningdesignsystem.com.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-hardcoded-value",
"type": "suggestion",
"messages": {
"hardcodedValue": "Replace the {{oldValue}} static value with an SLDS 1 styling hook: {{newValue}}.",
"noReplacement": "There's no replacement styling hook for the {{oldValue}} static value. Remove the static value."
}
},
"no-hardcoded-values-slds2": {
"description": "Replace static values with SLDS 2 styling hooks. For more information, look up design tokens on lightningdesignsystem.com.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#no-hardcoded-values-slds2",
"type": "suggestion",
"messages": {
"hardcodedValue": "Consider replacing the {{oldValue}} static value with an SLDS 2 styling hook that has a similar value: {{newValue}}.",
"noReplacement": "There's no replacement styling hook for the {{oldValue}} static value. Remove the static value."
}
},
"reduce-annotations": {
"description": "Remove your annotations and update your code.",
"url": "https://developer.salesforce.com/docs/platform/slds-linter/guide/reference-rules.html#reduce-annotations",
"type": "problem",
"messages": {
"removeAnnotation": "Remove this annotation and update the code to SLDS best practices. For help, file an issue at https://github.com/salesforce-ux/slds-linter/"
}
}
};
}
});
// src/rules/v9/enforce-bem-usage.ts
var import_sds_metadata, import_rule_messages, type, description, url, messages, bemMapping, enforce_bem_usage_default;
var init_enforce_bem_usage = __esm({
"src/rules/v9/enforce-bem-usage.ts"() {
import_sds_metadata = __toESM(require("@salesforce-ux/sds-metadata"));
import_rule_messages = __toESM(require_rule_messages());
({ type, description, url, messages } = import_rule_messages.default["enforce-bem-usage"]);
bemMapping = import_sds_metadata.default.bemNaming;
enforce_bem_usage_default = {
meta: {
type,
docs: {
description,
recommended: true,
url
},
fixable: "code",
messages
},
create(context) {
return {
// Check all class selectors for BEM usage
"SelectorList Selector ClassSelector"(node) {
const cssClassSelector = context.sourceCode.getText(node);
const className = cssClassSelector.substring(1);
if (className && className in bemMapping) {
const newValue = bemMapping[className];
if (typeof newValue === "string") {
context.report({
node,
messageId: "bemDoubleDash",
data: {
actual: className,
newValue
},
fix(fixer) {
return fixer.replaceText(node, `.${newValue}`);
}
});
}
}
}
};
}
};
}
});
// src/rules/enforce-bem-usage.ts
var require_enforce_bem_usage = __commonJS({
"src/rules/enforce-bem-usage.ts"(exports2, module2) {
init_node();
var import_sds_metadata14 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages16 = __toESM(require_rule_messages());
init_enforce_bem_usage();
var bemMapping2 = import_sds_metadata14.default.bemNaming;
var deprecatedClasses2 = import_sds_metadata14.default.deprecatedClasses;
var ruleConfig14 = import_rule_messages16.default["enforce-bem-usage"];
var { type: type15, description: description15, url: url15, messages: messages15 } = ruleConfig14;
var isDeprecatedClass = (className) => {
return deprecatedClasses2.includes(className) || deprecatedClasses2.includes(bemMapping2[className]);
};
var enforceBemUsageHtml = {
create(context) {
function check(node) {
if (isAttributesEmpty(node)) {
return;
}
const classAttr = findAttr(node, "class");
if (classAttr && classAttr.value) {
const classNames = classAttr.value.value.split(/\s+/);
classNames.forEach((className) => {
if (className && className in bemMapping2 && !isDeprecatedClass(className)) {
const classNameStart = classAttr.value.value.indexOf(className) + 7;
const classNameEnd = classNameStart + className.length;
const startLoc = {
line: classAttr.loc.start.line,
column: classAttr.loc.start.column + classNameStart
};
const endLoc = {
line: classAttr.loc.start.line,
column: classAttr.loc.start.column + classNameEnd
};
const newValue = bemMapping2[className];
context.report({
node,
loc: { start: startLoc, end: endLoc },
messageId: "bemDoubleDash",
data: {
actual: className,
newValue
},
fix(fixer) {
if (newValue) {
const newClassValue = classAttr.value.value.replace(
className,
newValue
);
return fixer.replaceTextRange(
[classAttr.value.range[0], classAttr.value.range[1]],
`${newClassValue}`
);
}
return null;
}
});
}
});
}
}
return {
Tag: check
};
}
};
var enforceBemUsage2 = {
meta: {
type: type15,
docs: {
recommended: true,
description: description15,
url: url15
},
fixable: "code",
messages: messages15
},
create(context) {
const filename = context.filename || context.getFilename();
if (filename.endsWith(".css") || filename.endsWith(".scss")) {
try {
return enforce_bem_usage_default.create(context);
} catch (error) {
return {};
}
} else {
return enforceBemUsageHtml.create(context);
}
}
};
module2.exports = enforceBemUsage2;
}
});
// src/rules/no-deprecated-classes-slds2.ts
var require_no_deprecated_classes_slds2 = __commonJS({
"src/rules/no-deprecated-classes-slds2.ts"(exports2, module2) {
init_node();
var import_sds_metadata14 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages16 = __toESM(require_rule_messages());
var deprecatedClasses2 = import_sds_metadata14.default.deprecatedClasses;
var ruleConfig14 = import_rule_messages16.default["no-deprecated-classes-slds2"];
module2.exports = {
meta: {
type: ruleConfig14.type,
docs: {
category: "Best Practices",
recommended: true,
description: ruleConfig14.description,
url: ruleConfig14.url
},
schema: [],
messages: ruleConfig14.messages
},
create(context) {
function check(node) {
if (isAttributesEmpty(node)) {
return;
}
const classAttr = findAttr(node, "class");
if (classAttr && classAttr.value) {
const classNames = classAttr.value.value.split(/\s+/);
classNames.forEach((className) => {
if (className && deprecatedClasses2.includes(className)) {
const classNameStart = classAttr.value.value.indexOf(className) + 7;
const classNameEnd = classNameStart + className.length;
const startLoc = {
line: classAttr.loc.start.line,
column: classAttr.loc.start.column + classNameStart
};
const endLoc = {
line: classAttr.loc.start.line,
column: classAttr.loc.start.column + classNameEnd
};
context.report({
node,
loc: { start: startLoc, end: endLoc },
messageId: "deprecatedClass",
data: {
className
}
});
}
});
}
}
return {
Tag: check
};
}
};
}
});
// src/rules/modal-close-button-issue.ts
var require_modal_close_button_issue = __commonJS({
"src/rules/modal-close-button-issue.ts"(exports2, module2) {
init_node();
var import_rule_messages16 = __toESM(require_rule_messages());
var ruleConfig14 = import_rule_messages16.default["modal-close-button-issue"];
module2.exports = {
meta: {
type: ruleConfig14.type,
docs: {
category: "Best Practices",
recommended: true,
description: ruleConfig14.description,
url: ruleConfig14.url
},
fixable: "code",
schema: [],
messages: ruleConfig14.messages
},
create(context) {
function check(node) {
if (isAttributesEmpty(node)) {
return;
}
const tagName = node.name;
if (tagName === "button") {
const classAttr = findAttr(node, "class");
if (classAttr && classAttr.value) {
const classList = classAttr.value.value.split(/\s+/);
if (!classList.includes("slds-modal__close")) {
return;
}
if (classList.includes("slds-button_icon-inverse") || classList.includes("slds-button--icon-inverse")) {
const newClassList = classList.filter((cls) => cls !== "slds-button_icon-inverse" && cls !== "slds-button--icon-inverse").join(" ");
context.report({
node,
loc: classAttr.loc,
messageId: "removeClass",
fix(fixer) {
return fixer.replaceText(
classAttr,
// Replace the full attribute
`class="${newClassList}"`
// Updated class list
);
}
});
}
}
}
if (tagName === "lightning-button-icon" || tagName === "lightning:buttonIcon") {
let validateClassAttr = function(attribute, attrName) {
if (attribute && attribute.value) {
const classList = attribute.value.value.split(/\s+/);
if (!classAttr?.value?.value?.includes("slds-modal__close")) {
return;
}
if (classList.includes("slds-button_icon-inverse") || classList.includes("slds-button--icon-inverse")) {
const newClassList = classList.filter((cls) => cls !== "slds-button_icon-inverse" && cls !== "slds-button--icon-inverse").join(" ");
context.report({
node,
loc: attribute.loc,
messageId: "removeClass",
fix(fixer) {
return fixer.replaceText(
attribute,
// Replace the full attribute
`${attrName}="${newClassList}"`
// Correctly modifies the respective attribute
);
}
});
}
if (!classList.includes("slds-button") || !classList.includes("slds-button_icon")) {
let newClassList;
if (attrName === "icon-class") {
newClassList = [
...classList.filter((cls) => cls !== "slds-button_icon-inverse")
].join(" ");
} else {
newClassList = [
"slds-button",
"slds-button_icon",
...classList.filter((cls) => cls !== "slds-button_icon-inverse")
].join(" ");
}
context.report({
node: attribute,
loc: attribute.value.loc,
messageId: "ensureButtonClasses",
fix(fixer) {
return fixer.replaceText(attribute.value, `${newClassList}`);
}
});
}
if (variantAttr && variantAttr.value && variantAttr.value.value === "bare-inverse") {
context.report({
node: variantAttr,
messageId: "changeVariant",
loc: variantAttr.value.loc,
fix(fixer) {
return fixer.replaceText(variantAttr.value, `bare`);
}
});
}
}
};
const variantAttr = findAttr(node, "variant");
const sizeAttr = findAttr(node, "size");
const classAttr = findAttr(node, "class");
const iconClassAttr = findAttr(node, "icon-class");
validateClassAttr(classAttr, "class");
validateClassAttr(iconClassAttr, "icon-class");
}
if ((tagName === "lightning-icon" || tagName === "lightning:icon") && node.parent?.name === "button") {
const parentClassAttr = findAttr(node.parent, "class");
if (parentClassAttr && parentClassAttr.value) {
const parentClassList = parentClassAttr.value.value.split(/\s+/);
if (!parentClassList.includes("slds-modal__close")) {
return;
}
const variantAttr = findAttr(node, "variant");
const sizeAttr = findAttr(node, "size");
if (variantAttr && variantAttr.value && variantAttr.value.value === "bare-inverse") {
context.report({
node: variantAttr,
messageId: "changeVariant",
loc: variantAttr.value.loc,
fix(fixer) {
return fixer.replaceText(variantAttr.value, `bare`);
}
});
}
}
}
}
return {
Tag: check
};
}
};
}
});
// src/index.ts
var import_enforce_bem_usage = __toESM(require_enforce_bem_usage());
var import_no_deprecated_classes_slds2 = __toESM(require_no_deprecated_classes_slds2());
var import_modal_close_button_issue = __toESM(require_modal_close_button_issue());
// src/rules/v9/no-slds-class-overrides.ts
var import_sds_metadata2 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages2 = __toESM(require_rule_messages());
var ruleConfig = import_rule_messages2.default["no-slds-class-overrides"];
var sldsClasses = import_sds_metadata2.default.sldsPlusClasses;
var sldsClassesSet = new Set(sldsClasses);
var no_slds_class_overrides_default = {
meta: {
type: ruleConfig.type,
docs: {
description: ruleConfig.description,
recommended: true,
//useful for plugin recommended configs
url: ruleConfig.url
},
fixable: null,
hasSuggestions: false,
schema: [],
messages: ruleConfig.messages
},
create(context) {
return {
// For no-slds-class-overrides: Only flags classes at selector end
"SelectorList Selector"(node) {
const classSelectorNode = node.children.filter((child) => child.type === "ClassSelector").at(-1);
if (classSelectorNode) {
const className = classSelectorNode.name;
if (className && className.startsWith("slds-") && sldsClassesSet.has(className)) {
context.report({
node: classSelectorNode,
messageId: "sldsClassOverride",
data: { className }
});
}
}
}
};
}
};
// src/rules/v9/no-deprecated-slds-classes.ts
var import_sds_metadata3 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages3 = __toESM(require_rule_messages());
var { type: type2, description: description2, url: url2, messages: messages2 } = import_rule_messages3.default["no-deprecated-slds-classes"];
var deprecatedClasses = import_sds_metadata3.default.deprecatedClasses;
var deprecatedClassesSet = new Set(deprecatedClasses);
var no_deprecated_slds_classes_default = {
meta: {
type: type2,
docs: {
description: description2,
recommended: true,
url: url2
},
messages: messages2
},
create(context) {
return {
// For no-deprecated-slds-classes: Check all class selectors for deprecated classes
"SelectorList Selector ClassSelector"(node) {
const cssClassSelector = context.sourceCode.getText(node);
const className = cssClassSelector.substring(1);
if (className && deprecatedClassesSet.has(className)) {
context.report({
node,
messageId: "deprecatedClass",
data: { className }
});
}
}
};
}
};
// src/rules/v9/no-deprecated-tokens-slds1.ts
var import_sds_metadata4 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages4 = __toESM(require_rule_messages());
var ruleConfig2 = import_rule_messages4.default["no-deprecated-tokens-slds1"];
var { type: type3, description: description3, url: url3, messages: messages3 } = ruleConfig2;
var tokenMapping = import_sds_metadata4.default.auraToLwcTokensMapping;
var no_deprecated_tokens_slds1_default = {
meta: {
type: type3,
docs: {
description: description3,
recommended: true,
url: url3
},
fixable: "code",
messages: messages3
},
create(context) {
function shouldIgnoreDetection6(token) {
return !(token in tokenMapping) || !tokenMapping[token].startsWith("--lwc-");
}
function generateReplacement(tokenName, originalFunctionCall) {
if (shouldIgnoreDetection6(tokenName)) {
return null;
}
const recommendation = tokenMapping[tokenName];
return `var(${recommendation}, ${originalFunctionCall})`;
}
function handleTokenFunction(node, functionName) {
const tokenName = context.sourceCode.getText(node);
if (shouldIgnoreDetection6(tokenName)) {
return;
}
const originalFunctionCall = `${functionName}(${tokenName})`;
const replacement = generateReplacement(tokenName, originalFunctionCall);
if (replacement) {
context.report({
node,
messageId: "deprecatedToken",
data: {
oldValue: originalFunctionCall,
newValue: replacement
},
fix(fixer) {
const sourceCode = context.sourceCode.getText();
const tokenFunctionCall = `${functionName}(${tokenName})`;
const nodeOffset = node.loc.start.offset;
const searchStart = Math.max(0, nodeOffset - functionName.length - 1);
const searchEnd = nodeOffset + tokenName.length + 1;
const searchArea = sourceCode.substring(searchStart, searchEnd);
const functionCallIndex = searchArea.indexOf(tokenFunctionCall);
if (functionCallIndex !== -1) {
const actualStart = searchStart + functionCallIndex;
const actualEnd = actualStart + tokenFunctionCall.length;
return fixer.replaceTextRange([actualStart, actualEnd], replacement);
}
return null;
}
});
} else {
context.report({
node,
messageId: "noReplacement"
});
}
}
return {
"Function[name='token'] Identifier"(node) {
handleTokenFunction(node, "token");
},
"Function[name='t'] Identifier"(node) {
handleTokenFunction(node, "t");
}
};
}
};
// src/rules/v9/lwc-token-to-slds-hook.ts
var import_sds_metadata5 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages5 = __toESM(require_rule_messages());
// src/utils/hardcoded-shared-utils.ts
var import_css_tree2 = require("@eslint/css-tree");
// src/utils/value-utils.ts
var ALLOWED_UNITS = ["px", "em", "rem", "%", "ch"];
function parseUnitValue(value) {
if (!value) return null;
const unitsPattern = ALLOWED_UNITS.join("|");
const regex = new RegExp(`^(-?\\d*\\.?\\d+)(${unitsPattern})?$`);
const match = value.match(regex);
if (!match) return null;
const number = parseFloat(match[1]);
const unit = match[2] ? match[2] : null;
if (isNaN(number)) return null;
return { number, unit };
}
function toAlternateUnitValue(numberVal, unitType) {
if (unitType === "px") {
let floatValue = parseFloat(`${numberVal / 16}`);
if (!isNaN(floatValue)) {
return {
unit: "rem",
number: parseFloat(floatValue.toFixed(4))
};
}
} else if (unitType === "rem") {
const intValue = parseInt(`${numberVal * 16}`);
if (!isNaN(intValue)) {
return {
unit: "px",
number: intValue
};
}
}
return null;
}
// src/utils/color-lib-utils.ts
var import_chroma_js = __toESM(require("chroma-js"));
var import_css_tree = require("@eslint/css-tree");
// src/utils/css-functions.ts
var CSS_FUNCTIONS = [
"attr",
"calc",
"color-mix",
"conic-gradient",
"counter",
"cubic-bezier",
"linear-gradient",
"max",
"min",
"radial-gradient",
"repeating-conic-gradient",
"repeating-linear-gradient",
"repeating-radial-gradient",
"var"
];
var CSS_MATH_FUNCTIONS = ["calc", "min", "max"];
var RGB_COLOR_FUNCTIONS = ["rgb", "rgba", "hsl", "hsla"];
var cssFunctionsRegex = new RegExp(`(?:${CSS_FUNCTIONS.join("|")})`);
var cssFunctionsExactRegex = new RegExp(`^(?:${CSS_FUNCTIONS.join("|")})$`);
var cssMathFunctionsRegex = new RegExp(`^(?:${CSS_MATH_FUNCTIONS.join("|")})$`);
function isCssFunction(value) {
return cssFunctionsExactRegex.test(value);
}
function isCssColorFunction(value) {
return RGB_COLOR_FUNCTIONS.includes(value);
}
// src/utils/color-lib-utils.ts
var LAB_THRESHOLD = 25;
var isHexCode = (color) => {
const hexPattern = /^#(?:[0-9a-fA-F]{3}){1,2}$/;
return hexPattern.test(color);
};
var convertToHex = (color) => {
try {
return (0, import_chroma_js.default)(color).hex();
} catch (e) {
return null;
}
};
var findClosestColorHook = (color, supportedColors, cssProperty) => {
const returnStylingHooks = [];
const closestHooksWithSameProperty = [];
const closestHooksWithoutSameProperty = [];
const closestHooksWithAllProperty = [];
const labColor = (0, import_chroma_js.default)(color).lab();
Object.entries(supportedColors).forEach(([sldsValue, data]) => {
if (sldsValue && isHexCode(sldsValue)) {
const hooks = data;
hooks.forEach((hook) => {
const labSupportedColor = (0, import_chroma_js.default)(sldsValue).lab();
const distance = JSON.stringify(labColor) === JSON.stringify(labSupportedColor) ? 0 : import_chroma_js.default.distance(import_chroma_js.default.lab(...labColor), import_chroma_js.default.lab(...labSupportedColor), "lab");
if (hook.properties.includes(cssProperty)) {
if (distance <= LAB_THRESHOLD) {
closestHooksWithSameProperty.push({ name: hook.name, distance });
}
} else if (hook.properties.includes("*")) {
if (distance <= LAB_THRESHOLD) {
closestHooksWithAllProperty.push({ name: hook.name, distance });
}
} else {
if (distance <= LAB_THRESHOLD) {
closestHooksWithoutSameProperty.push({ name: hook.name, distance });
}
}
});
}
});
const closesthookGroups = [
{ hooks: closestHooksWithSameProperty, distance: 0 },
{ hooks: closestHooksWithAllProperty, distance: 0 },
{ hooks: closestHooksWithSameProperty, distance: Infinity },
// For hooks with distance > 0
{ hooks: closestHooksWithAllProperty, distance: Infinity },
{ hooks: closestHooksWithoutSameProperty, distance: Infinity }
];
for (const group of closesthookGroups) {
const filteredHooks = group.hooks.filter(
(h) => group.distance === 0 ? h.distance === 0 : h.distance > 0
);
if (returnStylingHooks.length < 1 && filteredHooks.length > 0) {
filteredHooks.sort((a, b) => a.distance - b.distance);
returnStylingHooks.push(...filteredHooks.slice(0, 5).map((h) => h.name));
}
}
return Array.from(new Set(returnStylingHooks));
};
var isValidColor = (val) => import_chroma_js.default.valid(val);
var extractColorValue = (node) => {
let colorValue = null;
switch (node.type) {
case "Hash":
colorValue = `#${node.value}`;
break;
case "Identifier":
colorValue = node.name;
break;
case "Function":
if (isCssColorFunction(node.name)) {
colorValue = (0, import_css_tree.generate)(node);
}
break;
}
return colorValue && isValidColor(colorValue) ? colorValue : null;
};
// src/utils/hardcoded-shared-utils.ts
var FONT_WEIGHTS = [
"normal",
"bold",
"bolder",
"lighter",
"100",
"200",
"300",
"400",
"500",
"600",
"700",
"800",
"900"
];
function isKnownFontWeight(value) {
const stringValue = value.toString();
return FONT_WEIGHTS.includes(stringValue.toLowerCase());
}
function handleShorthandAutoFix(declarationNode, context, valueText, replacements) {
const sortedReplacements = replacements.sort((a, b) => a.start - b.start);
const hasAnyHooks = sortedReplacements.some((r) => r.hasHook);
const canAutoFix = hasAnyHooks;
sortedReplacements.forEach(({ start, end, replacement, displayValue, hasHook }) => {
const originalValue = valueText.substring(start, end);
const valueStartColumn = declarationNode.value.loc.start.column;
const valueColumn = valueStartColumn + start;
const { loc: { start: locStart, end: locEnd } } = declarationNode.value;
const reportNode = {
...declarationNode.value,
loc: {
...declarationNode.value.loc,
start: {
...locStart,
column: valueColumn
},
end: {
...locEnd,
column: valueColumn + originalValue.length
}
}
};
if (hasHook) {
const fix = canAutoFix ? (fixer) => {
let newValue = valueText;
for (let i = sortedReplacements.length - 1; i >= 0; i--) {
const { start: rStart, end: rEnd, replacement: rReplacement } = sortedReplacements[i];
newValue = newValue.substring(0, rStart) + rReplacement + newValue.substring(rEnd);
}
return fixer.replaceText(declarationNode.value, newValue);
} : void 0;
context.context.report({
node: reportNode,
messageId: "hardcodedValue",
data: {
oldValue: originalValue,
newValue: displayValue
},
fix
});
} else {
context.context.report({
node: reportNode,
messageId: "noReplacement",
data: {
oldValue: originalValue
}
});
}
});
}
function forEachValue(valueText, extractValue, shouldSkipNode, callback) {
if (!valueText || typeof valueText !== "string") {
return;
}
try {
const ast = (0, import_css_tree2.parse)(valueText, { context: "value", positions: true });
(0, import_css_tree2.walk)(ast, {
enter(node) {
if (shouldSkipNode(node)) {
return this.skip;
}
const value = extractValue(node);
if (value !== null) {
const positionInfo = {
start: node.loc?.start,
end: node.loc?.end
};
callback(value, positionInfo);
}
}
});
} catch (error) {
return;
}
}
function shouldSkipColorNode(node) {
return node.type === "Function" && isCssFunction(node.name);
}
function shouldSkipDimensionNode(node) {
return node.type === "Function";
}
function extractDimensionValue(valueNode, cssProperty) {
if (!valueNode) return null;
switch (valueNode.type) {
case "Dimension":
const numValue = Number(valueNode.value);
if (numValue === 0) return null;
const unit = valueNode.unit.toLowerCase();
if (!ALLOWED_UNITS.includes(unit)) return null;
return {
number: numValue,
unit
};
case "Number":
const numberValue = Number(valueNode.value);
if (numberValue === 0) return null;
return {
number: numberValue,
unit: null
};
case "Percentage":
const percentValue = Number(valueNode.value);
if (percentValue === 0) return null;
return {
number: percentValue,
unit: "%"
};
case "Value":
return valueNode.children?.[0] ? extractDimensionValue(valueNode.children[0], cssProperty) : null;
}
return null;
}
function forEachColorValue(valueText, callback) {
forEachValue(valueText, extractColorValue, shouldSkipColorNode, callback);
}
function forEachDensityValue(valueText, cssProperty, callback) {
forEachValue(
valueText,
(node) => extractDimensionValue(node, cssProperty),
shouldSkipDimensionNode,
callback
);
}
function extractFontValue(node) {
if (!node) return null;
switch (node.type) {
case "Dimension":
const numValue = Number(node.value);
if (numValue <= 0) return null;
const unit = node.unit.toLowerCase();
if (!ALLOWED_UNITS.includes(unit)) return null;
return {
number: numValue,
unit
};
case "Number":
const numberValue = Number(node.value);
if (numberValue <= 0) {
return null;
}
if (!isKnownFontWeight(numberValue)) {
return null;
}
return {
number: numberValue,
unit: null
};
case "Identifier":
const namedValue = node.name.toLowerCase();
if (!isKnownFontWeight(namedValue)) {
return null;
}
if (namedValue === "normal") {
return { number: 400, unit: null };
}
return { number: namedValue, unit: null };
case "Percentage":
const percentValue = Number(node.value);
if (percentValue === 0) return null;
return {
number: percentValue,
unit: "%"
};
case "Value":
return node.children?.[0] ? extractFontValue(node.children[0]) : null;
}
return null;
}
function shouldSkipFontNode(node) {
return node.type === "Function";
}
function forEachFontValue(valueText, callback) {
forEachValue(valueText, extractFontValue, shouldSkipFontNode, callback);
}
// src/utils/css-utils.ts
function extractCssVariable(node, filter) {
if (!node || node.type !== "Function" || node.name !== "var") {
return null;
}
if (!node.children) {
return null;
}
const childrenArray = Array.from(node.children);
if (childrenArray.length === 0) {
return null;
}
const firstChild = childrenArray[0];
if (!firstChild || firstChild.type !== "Identifier") {
return null;
}
const variableName = firstChild.name;
if (!variableName) {
return null;
}
return filter(variableName, childrenArray);
}
function forEachSldsVariable(valueText, callback) {
const extractor = (node) => extractCssVariable(node, (variableName, childrenArray) => {
if (!variableName.startsWith("--slds-")) {
return null;
}
const hasFallback = childrenArray.some(
(child) => child.type === "Operator" && child.value === ","
);
return { name: variableName, hasFallback };
});
forEachValue(valueText, extractor, () => false, callback);
}
function forEachNamespacedVariable(valueText, callback) {
const extractor = (node) => extractCssVariable(node, (variableName) => {
if (variableName.startsWith("--slds-") || variableName.startsWith("--sds-")) {
return { name: variableName, hasFallback: false };
}
return null;
});
forEachValue(valueText, extractor, () => false, callback);
}
function forEachLwcVariable(valueText, callback) {
const extractor = (node) => extractCssVariable(node, (variableName, childrenArray) => {
if (!variableName.startsWith("--lwc-")) {
return null;
}
const hasFallback = childrenArray.some(
(child) => child.type === "Operator" && child.value === ","
);
return { name: variableName, hasFallback };
});
forEachValue(valueText, extractor, () => false, callback);
}
function formatSuggestionHooks(hooks) {
if (hooks.length === 1) {
return `${hooks[0]}`;
}
return "\n" + hooks.map((hook, index) => `${index + 1}. ${hook}`).join("\n");
}
// src/rules/v9/lwc-token-to-slds-hook.ts
var ruleConfig3 = import_rule_messages5.default["lwc-token-to-slds-hook"];
var { type: type4, description: description4, url: url4, messages: messages4 } = ruleConfig3;
var lwcToSlds = import_sds_metadata5.default.lwcToSlds;
function shouldIgnoreDetection(lwcToken) {
return !lwcToken.startsWith("--lwc-") || !(lwcToken in lwcToSlds) || lwcToSlds[lwcToken].continueToUse;
}
function categorizeReplacement(recommendation) {
if (!recommendation || recommendation === "--") {
return "empty" /* EMPTY */;
}
if (Array.isArray(recommendation)) {
return "array" /* ARRAY */;
}
if (typeof recommendation === "string" && recommendation.startsWith("--slds-")) {
return "slds_token" /* SLDS_TOKEN */;
}
return "raw_value" /* RAW_VALUE */;
}
function getRecommendation(lwcToken) {
const oldValue = lwcToken;
const recommendation = lwcToSlds[oldValue]?.replacement || "";
const replacementCategory = categorizeReplacement(recommendation);
const hasRecommendation = oldValue in lwcToSlds && replacementCategory !== "empty" /* EMPTY */;
return { hasRecommendation, recommendation, replacementCategory };
}
function getReportMessage(cssVar, replacementCategory, recommendation) {
if (!recommendation) {
return {
messageId: "errorWithNoRecommendation",
data: { oldValue: cssVar }
};
} else if (replacementCategory === "array" /* ARRAY */) {
return {
messageId: "errorWithStyleHooks",
data: { oldValue: cssVar, newValue: formatSuggestionHooks(recommendation) }
};
} else if (replacementCategory === "slds_token" /* SLDS_TOKEN */) {
return {
messageId: "errorWithStyleHooks",
data: { oldValue: cssVar, newValue: recommendation }
};
} else {
return {
messageId: "errorWithReplacement",
data: { oldValue: cssVar, newValue: recommendation }
};
}
}
var lwc_token_to_slds_hook_default = {
meta: {
type: type4,
docs: {
description: description4,
recommended: true,
url: url4
},
fixable: "code",
messages: messages4
},
create(context) {
function reportAndFix(node, suggestedMatch, messageId, data, fixRange, loc) {
context.report({
node,
loc: loc || node.loc,
messageId,
data,
fix: suggestedMatch && fixRange ? (fixer) => {
return fixer.replaceTextRange(fixRange, suggestedMatch);
} : void 0
});
}
return {
// CSS custom property declarations: Check both property name and value
"Declaration"(node) {
const property = node.property;
if (property && property.startsWith("--lwc-")) {
if (!shouldIgnoreDetection(property)) {
const { hasRecommendation, recommendation, replacementCategory } = getRecommendation(property);
const { messageId, data } = getReportMessage(property, replacementCategory, recommendation);
const suggestedMatch = hasRecommendation && replacementCategory === "slds_token" /* SLDS_TOKEN */ ? recommendation : null;
const propertyStart = node.loc.start.offset;
const propertyEnd = propertyStart + property.length;
reportAndFix(node, suggestedMatch, messageId, data, [propertyStart, propertyEnd]);
}
}
const valueText = context.sourceCode.getText(node.value);
if (valueText) {
forEachLwcVariable(valueText, (variableInfo, positionInfo) => {
const { name: lwcToken, hasFallback } = variableInfo;
if (shouldIgnoreDetection(lwcToken)) {
return;
}
const { hasRecommendation, recommendation, replacementCategory } = getRecommendation(lwcToken);
const { messageId, data } = getReportMessage(lwcToken, replacementCategory, recommendation);
let suggestedMatch = null;
if (hasRecommendation) {
if (replacementCategory === "slds_token" /* SLDS_TOKEN */) {
let fallbackValue = null;
if (hasFallback && positionInfo.start && positionInfo.end && positionInfo.start.offset !== void 0 && positionInfo.end.offset !== void 0) {
const varCallText = valueText.substring(positionInfo.start.offset, positionInfo.end.offset);
const commaIndex = varCallText.indexOf(",");
if (commaIndex !== -1) {
fallbackValue = varCallText.substring(commaIndex + 1, varCallText.length - 1).trim();
}
}
const originalVarCall = fallbackValue ? `var(${lwcToken}, ${fallbackValue})` : `var(${lwcToken})`;
suggestedMatch = `var(${recommendation}, ${originalVarCall})`;
} else if (replacementCategory === "raw_value" /* RAW_VALUE */) {
suggestedMatch = recommendation;
}
}
const valueStartOffset = node.value.loc.start.offset;
const varStartOffset = valueStartOffset + (positionInfo.start?.offset || 0);
const varEndOffset = valueStartOffset + (positionInfo.end?.offset || valueText.length);
const preciseLoc = positionInfo.start && positionInfo.end && node.value.loc ? {
start: {
line: node.value.loc.start.line + positionInfo.start.line - 1,
column: node.value.loc.start.column + positionInfo.start.column - 1
},
end: {
line: node.value.loc.start.line + positionInfo.end.line - 1,
column: node.value.loc.start.column + positionInfo.end.column - 1
}
} : node.value.loc;
reportAndFix(node, suggestedMatch, messageId, data, [varStartOffset, varEndOffset], preciseLoc);
});
}
}
};
}
};
// src/rules/v9/enforce-sds-to-slds-hooks.ts
var import_sds_metadata6 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages6 = __toESM(require_rule_messages());
var ruleConfig4 = import_rule_messages6.default["enforce-sds-to-slds-hooks"];
var { type: type5, description: description5, url: url5, messages: messages5 } = ruleConfig4;
var sldsPlusStylingHooks = import_sds_metadata6.default.sldsPlusStylingHooks;
var allSldsHooks = [...sldsPlusStylingHooks.global, ...sldsPlusStylingHooks.component];
var toSldsToken = (sdsToken) => sdsToken.replace("--sds-", "--slds-");
function shouldIgnoreDetection2(sdsToken) {
return !sdsToken.startsWith("--sds-") || !allSldsHooks.includes(toSldsToken(sdsToken));
}
var enforce_sds_to_slds_hooks_default = {
meta: {
type: type5,
docs: {
description: description5,
recommended: true,
url: url5
},
fixable: "code",
messages: messages5
},
create(context) {
function reportAndFix(node, oldValue, suggestedMatch) {
context.report({
node,
messageId: "replaceSdsWithSlds",
data: { oldValue, suggestedMatch },
fix(fixer) {
if (node.type === "Declaration") {
const sourceCode = context.sourceCode;
const fullText = sourceCode.getText();
const nodeOffset = node.loc.start.offset;
const propertyStart = nodeOffset;
const propertyEnd = propertyStart + oldValue.length;
const textAtPosition = fullText.substring(propertyStart, propertyEnd);
if (textAtPosition === oldValue) {
return fixer.replaceTextRange([propertyStart, propertyEnd], suggestedMatch);
}
}
return fixer.replaceText(node, suggestedMatch);
}
});
}
return {
// CSS custom property declarations: --sds-* properties
"Declaration[property=/^--sds-/]"(node) {
const property = node.property;
if (shouldIgnoreDetection2(property)) {
return;
}
const suggestedMatch = toSldsToken(property);
reportAndFix(node, property, suggestedMatch);
},
// SDS tokens inside var() functions: var(--sds-*)
"Function[name='var'] Identifier[name=/^--sds-/]"(node) {
const tokenName = node.name;
if (shouldIgnoreDetection2(tokenName)) {
return;
}
const suggestedMatch = toSldsToken(tokenName);
reportAndFix(node, tokenName, suggestedMatch);
}
};
}
};
// src/rules/v9/no-sldshook-fallback-for-lwctoken.ts
var import_sds_metadata7 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages7 = __toESM(require_rule_messages());
var ruleConfig5 = import_rule_messages7.default["no-sldshook-fallback-for-lwctoken"];
var { type: type6, description: description6, url: url6, messages: messages6 } = ruleConfig5;
var sldsPlusStylingHooks2 = import_sds_metadata7.default.sldsPlusStylingHooks;
var allSldsHooks2 = [...sldsPlusStylingHooks2.global, ...sldsPlusStylingHooks2.component];
var allSldsHooksSet = new Set(allSldsHooks2);
function hasUnsupportedFallback(lwcToken, sldsToken) {
const normalizedSldsToken = sldsToken.replace("--sds-", "--slds-");
return lwcToken.startsWith("--lwc-") && normalizedSldsToken.startsWith("--slds-") && allSldsHooksSet.has(normalizedSldsToken);
}
var no_sldshook_fallback_for_lwctoken_default = {
meta: {
type: type6,
docs: {
description: description6,
recommended: true,
url: url6
},
messages: messages6
},
create(context) {
return {
// Handle LWC tokens inside var() functions: var(--lwc-*, ...)
"Function[name='var'] Identifier[name=/^--lwc-/]"(node) {
const lwcToken = node.name;
const varFunctionNode = context.sourceCode.getAncestors(node).at(-1);
if (!varFunctionNode) return;
const varFunctionChildren = varFunctionNode.children;
if (!varFunctionChildren) return;
let foundComma = false;
let fallbackRawNode = null;
for (const child of varFunctionChildren) {
if (child.type === "Operator" && child.value === ",") {
foundComma = true;
continue;
}
if (foundComma && child.type === "Raw") {
fallbackRawNode = child;
break;
}
}
if (!fallbackRawNode) return;
const fallbackValue = fallbackRawNode.value.trim();
const varMatch = fallbackValue.match(/var\(([^,)]+)/);
if (!varMatch) return;
const sldsToken = varMatch[1];
if (hasUnsupportedFallback(lwcToken, sldsToken)) {
context.report({
node,
messageId: "unsupportedFallback",
data: { lwcToken, sldsToken }
});
}
}
};
}
};
// src/rules/v9/no-unsupported-hooks-slds2.ts
var import_sds_metadata8 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages8 = __toESM(require_rule_messages());
var ruleConfig6 = import_rule_messages8.default["no-unsupported-hooks-slds2"];
var { type: type7, description: description7, url: url7, messages: messages7 } = ruleConfig6;
var deprecatedHooks = new Set(import_sds_metadata8.default.deprecatedStylingHooks);
function shouldIgnoreDetection3(sldsHook) {
return !deprecatedHooks.has(sldsHook);
}
var no_unsupported_hooks_slds2_default = {
meta: {
type: type7,
docs: {
description: description7,
recommended: true,
url: url7
},
messages: messages7
},
create(context) {
function reportDeprecatedHook(node, token) {
context.report({
node,
messageId: "deprecated",
data: { token }
});
}
return {
// Handle CSS custom property declarations (left-side usage): --slds-* properties
// Example: .THIS { --slds-g-link-color: #f73650; }
"Declaration[property=/^--s(lds|ds)-/]"(node) {
const property = node.property;
if (shouldIgnoreDetection3(property)) {
return;
}
reportDeprecatedHook(node, property);
},
// Handle SLDS/SDS hooks inside var() functions (right-side usage): var(--slds-*)
// Example: .THIS .demo { border-top: 1px solid var(--slds-g-color-border-brand-1); }
"Function[name='var'] Identifier[name=/^--s(lds|ds)-/]"(node) {
const tokenName = node.name;
if (shouldIgnoreDetection3(tokenName)) {
return;
}
reportDeprecatedHook(node, tokenName);
}
};
}
};
// src/rules/v9/no-slds-var-without-fallback.ts
var import_sds_metadata9 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages9 = __toESM(require_rule_messages());
var ruleConfig7 = import_rule_messages9.default["no-slds-var-without-fallback"];
var { type: type8, description: description8, url: url8, messages: messages8 } = ruleConfig7;
var sldsVariables = import_sds_metadata9.default.slds1ExcludedVars || {};
var no_slds_var_without_fallback_default = {
meta: {
type: type8,
docs: {
description: description8,
recommended: true,
url: url8
},
fixable: "code",
messages: messages8
},
create(context) {
return {
"Declaration"(node) {
const valueText = context.sourceCode.getText(node.value);
if (!valueText) return;
const variablesNeedingFallback = [];
forEachSldsVariable(valueText, (variableInfo, positionInfo) => {
const { name: cssVar, hasFallback } = variableInfo;
if (hasFallback) return;
const fallbackValue = sldsVariables[cssVar];
if (!fallbackValue) return;
variablesNeedingFallback.push({
cssVar,
fallbackValue,
start: positionInfo.start?.offset || 0,
end: positionInfo.end?.offset || 0
});
});
if (variablesNeedingFallback.length > 0) {
let newValue = valueText;
const sortedVariables = variablesNeedingFallback.sort((a, b) => b.start - a.start);
sortedVariables.forEach(({ cssVar, fallbackValue, start, end }) => {
const replacement = `var(${cssVar}, ${fallbackValue})`;
newValue = newValue.substring(0, start) + replacement + newValue.substring(end);
});
variablesNeedingFallback.forEach(({ cssVar, fallbackValue }) => {
context.report({
node,
messageId: "varWithoutFallback",
data: { cssVar, recommendation: fallbackValue },
fix: (fixer) => fixer.replaceText(node.value, newValue)
});
});
}
}
};
}
};
// src/rules/v9/no-slds-namespace-for-custom-hooks.ts
var import_sds_metadata10 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages10 = __toESM(require_rule_messages());
var ruleConfig8 = import_rule_messages10.default["no-slds-namespace-for-custom-hooks"];
var { type: type9, description: description9, url: url9, messages: messages9 } = ruleConfig8;
var sldsPlusStylingHooks3 = import_sds_metadata10.default.sldsPlusStylingHooks;
var allSldsHooks3 = [...sldsPlusStylingHooks3.global, ...sldsPlusStylingHooks3.component, ...sldsPlusStylingHooks3.shared];
var toSldsToken2 = (sdsToken) => sdsToken.replace("--sds-", "--slds-");
function shouldIgnoreDetection4(sdsToken) {
if (sdsToken.startsWith("--sds-") || sdsToken.startsWith("--slds-")) {
return allSldsHooks3.includes(toSldsToken2(sdsToken));
}
return true;
}
var no_slds_namespace_for_custom_hooks_default = {
meta: {
type: type9,
docs: {
description: description9,
recommended: true,
url: url9
},
messages: messages9
},
create(context) {
return {
"Declaration"(node) {
const property = node.property;
if (property && (property.startsWith("--slds-") || property.startsWith("--sds-")) && !shouldIgnoreDetection4(property)) {
const tokenWithoutNamespace = property.replace("--slds-", "").replace("--sds-", "");
context.report({
node,
loc: node.loc,
// Use full declaration loc which includes the property
messageId: "customHookNamespace",
data: {
token: property,
tokenWithoutNamespace
}
});
}
const valueText = context.sourceCode.getText(node.value);
if (valueText) {
forEachNamespacedVariable(valueText, (variableInfo, positionInfo) => {
const { name: tokenName } = variableInfo;
if (!shouldIgnoreDetection4(tokenName)) {
const tokenWithoutNamespace = tokenName.replace("--slds-", "").replace("--sds-", "");
if (positionInfo.start && positionInfo.end && node.value.loc) {
context.report({
node,
loc: {
start: {
line: node.value.loc.start.line + positionInfo.start.line - 1,
column: node.value.loc.start.column + positionInfo.start.column - 1
},
end: {
line: node.value.loc.start.line + positionInfo.end.line - 1,
column: node.value.loc.start.column + positionInfo.end.column - 1
}
},
messageId: "customHookNamespace",
data: { token: tokenName, tokenWithoutNamespace }
});
} else {
context.report({
node,
messageId: "customHookNamespace",
data: { token: tokenName, tokenWithoutNamespace }
});
}
}
});
}
}
};
}
};
// src/rules/v9/enforce-component-hook-naming-convention.ts
var import_sds_metadata11 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages11 = __toESM(require_rule_messages());
var ruleConfig9 = import_rule_messages11.default["enforce-component-hook-naming-convention"];
var { type: type10, description: description10, url: url10, messages: messages10 } = ruleConfig9;
var slds1DeprecatedComponentHooks = import_sds_metadata11.default.slds1DeprecatedComponentHooks;
function shouldIgnoreDetection5(hook) {
return !hook.startsWith("--slds-c-") || !(hook in slds1DeprecatedComponentHooks);
}
var enforce_component_hook_naming_convention_default = {
meta: {
type: type10,
docs: {
description: description10,
recommended: true,
url: url10
},
fixable: "code",
messages: messages10
},
create(context) {
return {
/*
* Handle component hooks in CSS declarations
* Limitation: For example:
* .testClass{
* --slds-c-accordion-section-color-background: var(--slds-c-accordion-section-color-border);
* }
* var in value is not detected, because eslint treats above statement as custom property assignment
* and value treated as raw string, not parsed into function nodes
*/
"Declaration[property=/^--slds-c-/], Function[name='var'] Identifier[name=/^--slds-c-/]"(node) {
let hookName;
let reportNode = node;
if (node.type === "Declaration") {
hookName = node.property;
} else if (node.type === "Identifier") {
hookName = node.name;
} else {
return;
}
if (shouldIgnoreDetection5(hookName)) {
return;
}
const suggestedMatch = slds1DeprecatedComponentHooks[hookName];
context.report({
node: reportNode,
messageId: "replace",
data: {
oldValue: hookName,
suggestedMatch
},
fix(fixer) {
if (node.type === "Declaration") {
const originalText = context.sourceCode.getText(node);
const colonIndex = originalText.indexOf(":");
const valuePartWithColon = originalText.substring(colonIndex);
return fixer.replaceText(node, `${suggestedMatch}${valuePartWithColon}`);
} else if (node.type === "Identifier") {
return fixer.replaceText(node, suggestedMatch);
}
return null;
}
});
}
};
}
};
// src/rules/v9/reduce-annotations.ts
var import_rule_messages12 = __toESM(require_rule_messages());
var ruleConfig10 = import_rule_messages12.default["reduce-annotations"];
var { type: type11, description: description11, url: url11, messages: messages11 } = ruleConfig10;
var SLDS_ANNOTATIONS = [
"@sldsValidatorIgnoreNextLine",
"@sldsValidatorAllow",
"@sldsValidatorIgnore"
];
var reduce_annotations_default = {
meta: {
type: type11,
docs: {
description: description11,
recommended: true,
url: url11
},
messages: messages11
},
create(context) {
return {
StyleSheet(node) {
const sourceCode = context.sourceCode;
let comments = sourceCode?.comments || [];
comments.forEach((comment) => {
const commentContent = comment.value.trim();
const matchingAnnotation = SLDS_ANNOTATIONS.find(
(annotation) => commentContent.startsWith(annotation)
);
if (matchingAnnotation) {
context.report({
node: comment,
messageId: "removeAnnotation"
});
}
});
}
};
}
};
// src/rules/v9/no-slds-private-var.ts
var import_rule_messages13 = __toESM(require_rule_messages());
var ruleConfig11 = import_rule_messages13.default["no-slds-private-var"];
var { type: type12, description: description12, url: url12, messages: messages12 } = ruleConfig11;
var no_slds_private_var_default = {
meta: {
type: type12,
docs: {
description: description12,
recommended: true,
url: url12
},
fixable: "code",
messages: messages12
},
create(context) {
return {
// Handle CSS custom properties (declarations starting with --)
"Declaration"(node) {
if (node.property && typeof node.property === "string" && node.property.startsWith("--_slds-")) {
context.report({
node,
messageId: "privateVar",
data: { prop: node.property },
fix(fixer) {
const newProperty = node.property.replace("--_slds-", "--slds-");
const sourceCode = context.sourceCode.getText(node);
const fixedCode = sourceCode.replace(node.property, newProperty);
return fixer.replaceText(node, fixedCode);
}
});
}
}
};
}
};
// src/rules/v9/no-hardcoded-values/no-hardcoded-values-slds1.ts
var import_sds_metadata12 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages14 = __toESM(require_rule_messages());
// src/utils/property-matcher.ts
var DIRECTION_VALUES = "(?:top|right|bottom|left|inline|block|inline-start|inline-end|start|end|block-start|block-end)";
var CORNER_VALUES = "(?:top-left|top-right|bottom-right|bottom-left|start-start|start-end|end-start|end-end)";
var INSET_VALUES = "(?:inline|block|inline-start|inline-end|block-start|block-end)";
var BORDER_COLOR_REGEX = new RegExp(`^border(?:-${DIRECTION_VALUES})?-color$`);
var BORDER_WIDTH_REGEX = new RegExp(`^border(?:-${DIRECTION_VALUES})?-width$`);
var MARGIN_REGEX = new RegExp(`^margin(?:-${DIRECTION_VALUES})?$`);
var PADDING_REGEX = new RegExp(`^padding(?:-${DIRECTION_VALUES})?$`);
var BORDER_RADIUS_REGEX = new RegExp(`^border(?:-${CORNER_VALUES})?-radius$`);
var INSET_REGEX = new RegExp(`^inset(?:-${INSET_VALUES})?$`);
function isBorderColorProperty(cssProperty) {
return BORDER_COLOR_REGEX.test(cssProperty);
}
function isBorderWidthProperty(cssProperty) {
return BORDER_WIDTH_REGEX.test(cssProperty);
}
function isMarginProperty(cssProperty) {
return MARGIN_REGEX.test(cssProperty);
}
function isPaddingProperty(cssProperty) {
return PADDING_REGEX.test(cssProperty);
}
function isBorderRadius(cssProperty) {
return BORDER_RADIUS_REGEX.test(cssProperty);
}
function isDimensionProperty(cssProperty) {
return ["width", "height", "min-width", "max-width", "min-height", "max-height"].includes(cssProperty);
}
function isInsetProperty(cssProperty) {
return INSET_REGEX.test(cssProperty);
}
var fontProperties = [
"font",
"font-size",
"font-weight"
];
var colorProperties = [
"color",
"fill",
"background",
"background-color",
"stroke",
"border",
"border*",
"border*-color",
"outline",
"outline-color"
];
var densificationProperties = [
"border*",
"margin*",
"padding*",
"width",
"height",
"min-width",
"max-width",
"min-height",
"max-height",
"inset",
"top",
"right",
"left",
"bottom",
"outline",
"outline-width",
"line-height"
];
function toSelector(properties) {
const selectorParts = properties.map((prop) => {
if (prop.includes("*")) {
const regexPattern = prop.replace(/\*/g, ".*");
return `Declaration[property=/^${regexPattern}$/]`;
} else {
return `Declaration[property='${prop}']`;
}
});
return selectorParts.join(", ");
}
function resolvePropertyToMatch(cssProperty) {
const propertyToMatch = cssProperty.toLowerCase();
if (propertyToMatch === "outline" || propertyToMatch === "outline-width" || isBorderWidthProperty(propertyToMatch)) {
return "border-width";
} else if (isMarginProperty(propertyToMatch)) {
return "margin";
} else if (isPaddingProperty(propertyToMatch)) {
return "padding";
} else if (isBorderRadius(propertyToMatch)) {
return "border-radius";
} else if (isDimensionProperty(propertyToMatch)) {
return "width";
} else if (isInsetProperty(propertyToMatch)) {
return "top";
} else if (cssProperty === "background" || cssProperty === "background-color") {
return "background-color";
} else if (cssProperty === "outline" || cssProperty === "outline-color" || isBorderColorProperty(cssProperty)) {
return "border-color";
}
return propertyToMatch;
}
// src/rules/v9/no-hardcoded-values/handlers/colorHandler.ts
var handleColorDeclaration = (node, context) => {
const cssProperty = node.property.toLowerCase();
const valueText = context.sourceCode.getText(node.value);
const replacements = [];
forEachColorValue(valueText, (colorValue, positionInfo) => {
if (colorValue !== "transparent" && isValidColor(colorValue)) {
const replacement = createColorReplacement(colorValue, cssProperty, context, positionInfo, valueText);
if (replacement) {
replacements.push(replacement);
}
}
});
handleShorthandAutoFix(node, context, valueText, replacements);
};
function createColorReplacement(colorValue, cssProperty, context, positionInfo, originalValueText) {
if (!positionInfo?.start) {
return null;
}
const hexValue = convertToHex(colorValue);
if (!hexValue) {
return null;
}
const propToMatch = resolvePropertyToMatch(cssProperty);
const closestHooks = findClosestColorHook(hexValue, context.valueToStylinghook, propToMatch);
const start = positionInfo.start.offset;
const end = positionInfo.end.offset;
const originalValue = originalValueText ? originalValueText.substring(start, end) : colorValue;
if (closestHooks.length === 1) {
return {
start,
end,
replacement: `var(${closestHooks[0]}, ${colorValue})`,
displayValue: closestHooks[0],
hasHook: true
};
} else if (closestHooks.length > 1) {
return {
start,
end,
replacement: originalValue,
// Use original value to preserve spacing
displayValue: formatSuggestionHooks(closestHooks),
hasHook: true
};
} else {
return {
start,
end,
replacement: originalValue,
// Use original value to preserve spacing
displayValue: originalValue,
hasHook: false
};
}
}
// src/utils/styling-hook-utils.ts
function isValueMatch(valueToMatch, sldsValue) {
if (!valueToMatch || !sldsValue) {
return false;
}
return valueToMatch.unit == sldsValue.unit && valueToMatch.number === sldsValue.number;
}
function getStylingHooksForDensityValue(parsedValue, supportedStylinghooks, cssProperty) {
if (!parsedValue) return [];
const alternateValue = toAlternateUnitValue(parsedValue.number, parsedValue.unit);
const matchedHooks = [];
for (const [sldsValue, hooks] of Object.entries(supportedStylinghooks)) {
const parsedSldsValue = parseUnitValue(sldsValue);
if (isValueMatch(parsedValue, parsedSldsValue) || alternateValue && isValueMatch(alternateValue, parsedSldsValue)) {
hooks.filter((hook) => hook.properties.includes(cssProperty)).forEach((hook) => matchedHooks.push(hook.name));
}
}
return matchedHooks;
}
// src/rules/v9/no-hardcoded-values/handlers/densityHandler.ts
var handleDensityDeclaration = (node, context) => {
const cssProperty = node.property.toLowerCase();
const valueText = context.sourceCode.getText(node.value);
const replacements = [];
forEachDensityValue(valueText, cssProperty, (parsedDimension, positionInfo) => {
if (parsedDimension) {
const replacement = createDimensionReplacement(parsedDimension, cssProperty, context, positionInfo);
if (replacement) {
replacements.push(replacement);
}
}
});
handleShorthandAutoFix(node, context, valueText, replacements);
};
function createDimensionReplacement(parsedDimension, cssProperty, context, positionInfo) {
if (!parsedDimension || !positionInfo?.start) {
return null;
}
const rawValue = parsedDimension.unit ? `${parsedDimension.number}${parsedDimension.unit}` : parsedDimension.number.toString();
const propToMatch = resolvePropertyToMatch(cssProperty);
const closestHooks = getStylingHooksForDensityValue(parsedDimension, context.valueToStylinghook, propToMatch);
const start = positionInfo.start.offset;
const end = positionInfo.end.offset;
if (closestHooks.length === 1) {
return {
start,
end,
replacement: `var(${closestHooks[0]}, ${rawValue})`,
displayValue: closestHooks[0],
hasHook: true
};
} else if (closestHooks.length > 1) {
return {
start,
end,
replacement: rawValue,
displayValue: formatSuggestionHooks(closestHooks),
hasHook: true
};
} else {
return {
start,
end,
replacement: rawValue,
displayValue: rawValue,
hasHook: false
};
}
}
// src/rules/v9/no-hardcoded-values/handlers/fontHandler.ts
var handleFontDeclaration = (node, context) => {
const cssProperty = node.property.toLowerCase();
const valueText = context.sourceCode.getText(node.value);
const replacements = [];
forEachFontValue(valueText, (fontValue, positionInfo) => {
if (fontValue && isValidFontValue(fontValue, cssProperty)) {
const replacement = createFontReplacement(fontValue, cssProperty, context, positionInfo);
if (replacement) {
replacements.push(replacement);
}
}
});
handleShorthandAutoFix(node, context, valueText, replacements);
};
function isValidFontValue(fontValue, cssProperty) {
if (cssProperty === "font-size") {
return !!fontValue.unit;
} else if (cssProperty === "font-weight") {
return !fontValue.unit && isKnownFontWeight(fontValue.number);
} else if (cssProperty === "font") {
if (!fontValue.unit && isKnownFontWeight(fontValue.number)) {
return true;
} else if (fontValue.unit) {
return true;
} else {
return false;
}
}
return false;
}
function createFontReplacement(fontValue, cssProperty, context, positionInfo) {
if (!positionInfo?.start) {
return null;
}
const rawValue = fontValue.unit ? `${fontValue.number}${fontValue.unit}` : fontValue.number.toString();
const propToMatch = !fontValue.unit && isKnownFontWeight(fontValue.number) ? resolvePropertyToMatch("font-weight") : resolvePropertyToMatch("font-size");
const closestHooks = getStylingHooksForDensityValue(fontValue, context.valueToStylinghook, propToMatch);
const start = positionInfo.start.offset;
const end = positionInfo.end.offset;
if (closestHooks.length === 1) {
return {
start,
end,
replacement: `var(${closestHooks[0]}, ${rawValue})`,
displayValue: closestHooks[0],
hasHook: true
};
} else if (closestHooks.length > 1) {
return {
start,
end,
replacement: rawValue,
displayValue: formatSuggestionHooks(closestHooks),
hasHook: true
};
} else {
return {
start,
end,
replacement: rawValue,
displayValue: rawValue,
hasHook: false
};
}
}
// src/utils/boxShadowValueParser.ts
var import_css_tree3 = require("@eslint/css-tree");
function isColorValue(node) {
if (!node) return false;
switch (node.type) {
case "Hash":
return true;
// #hex colors
case "Identifier":
return isValidColor(node.name);
case "Function":
return isCssColorFunction(node.name.toLowerCase());
default:
return false;
}
}
function isLengthValue(node) {
if (!node) return false;
switch (node.type) {
case "Dimension":
const dimensionStr = `${node.value}${node.unit}`;
return parseUnitValue(dimensionStr) !== null;
case "Number":
return Number(node.value) === 0;
default:
return false;
}
}
function isInsetKeyword(node) {
return node?.type === "Identifier" && node.name.toLowerCase() === "inset";
}
function extractShadowParts(valueText) {
const shadows = [];
let currentShadow = {
lengthParts: [],
colorParts: [],
inset: false
};
try {
const ast = (0, import_css_tree3.parse)(valueText, { context: "value" });
(0, import_css_tree3.walk)(ast, {
enter(node) {
if (node.type === "Function") {
return this.skip;
}
if (isInsetKeyword(node)) {
currentShadow.inset = true;
} else if (isLengthValue(node)) {
currentShadow.lengthParts.push((0, import_css_tree3.generate)(node));
} else if (isColorValue(node)) {
currentShadow.colorParts.push((0, import_css_tree3.generate)(node));
}
}
});
if (currentShadow.lengthParts.length > 0 || currentShadow.colorParts.length > 0 || currentShadow.inset) {
shadows.push(currentShadow);
}
} catch (error) {
return [];
}
return shadows;
}
function parseBoxShadowValue(value) {
const shadowStrings = value.split(",").map((s) => s.trim());
const allShadows = [];
for (const shadowString of shadowStrings) {
const shadows = extractShadowParts(shadowString);
const parsedShadows = shadows.map((shadow) => {
const shadowValue = {};
const lengthProps = ["offsetX", "offsetY", "blurRadius", "spreadRadius"];
lengthProps.forEach((prop, index) => {
if (shadow.lengthParts.length > index) {
shadowValue[prop] = shadow.lengthParts[index];
}
});
if (shadow.colorParts.length > 0) {
shadowValue.color = shadow.colorParts[0];
}
if (shadow.inset) {
shadowValue.inset = true;
}
return shadowValue;
});
allShadows.push(...parsedShadows);
}
return allShadows;
}
function normalizeLengthValue(value) {
if (!value) return "0px";
if (value === "0") return "0px";
return value;
}
function isBoxShadowMatch(parsedCssValue, parsedValueHook) {
if (parsedCssValue.length !== parsedValueHook.length) {
return false;
}
for (let i = 0; i < parsedCssValue.length; i++) {
const cssShadow = parsedCssValue[i];
const hookShadow = parsedValueHook[i];
if (cssShadow.color !== hookShadow.color || cssShadow.inset !== hookShadow.inset) {
return false;
}
const lengthProps = ["offsetX", "offsetY", "blurRadius", "spreadRadius"];
for (const prop of lengthProps) {
if (normalizeLengthValue(cssShadow[prop]) !== normalizeLengthValue(hookShadow[prop])) {
return false;
}
}
}
return true;
}
// src/rules/v9/no-hardcoded-values/handlers/boxShadowHandler.ts
function toBoxShadowValue(cssValue) {
const parsedCssValue = parseBoxShadowValue(cssValue).filter((shadow) => Object.keys(shadow).length > 0);
if (parsedCssValue.length === 0) {
return null;
}
return parsedCssValue;
}
function shadowValueToHookEntries(supportedStylinghooks) {
return Object.entries(supportedStylinghooks).filter(([key, value]) => {
return value.some((hook) => hook.properties.includes("box-shadow"));
}).map(([key, value]) => {
return [key, value.map((hook) => hook.name)];
});
}
var handleBoxShadowDeclaration = (node, context) => {
const cssProperty = node.property.toLowerCase();
const valueText = context.sourceCode.getText(node.value);
const shadowHooks = shadowValueToHookEntries(context.valueToStylinghook);
const parsedCssValue = toBoxShadowValue(valueText);
if (!parsedCssValue) {
return;
}
for (const [shadow, closestHooks] of shadowHooks) {
const parsedValueHook = toBoxShadowValue(shadow);
if (parsedValueHook && isBoxShadowMatch(parsedCssValue, parsedValueHook)) {
if (closestHooks.length > 0) {
const positionInfo = {
start: { offset: 0, line: 1, column: 1 },
end: { offset: valueText.length, line: 1, column: valueText.length + 1 }
};
const replacement = createBoxShadowReplacement(
valueText,
closestHooks,
context,
positionInfo
);
if (replacement) {
const replacements = [replacement];
handleShorthandAutoFix(node, context, valueText, replacements);
}
}
return;
}
}
};
function createBoxShadowReplacement(originalValue, hooks, context, positionInfo) {
if (!positionInfo?.start) {
return null;
}
const start = positionInfo.start.offset;
const end = positionInfo.end.offset;
if (hooks.length === 1) {
return {
start,
end,
replacement: `var(${hooks[0]}, ${originalValue})`,
displayValue: hooks[0],
hasHook: true
};
} else {
return {
start,
end,
replacement: originalValue,
displayValue: formatSuggestionHooks(hooks),
hasHook: true
};
}
}
// src/utils/rule-utils.ts
function isRuleEnabled(context, ruleName3) {
try {
const rules2 = context.settings?.sldsRules || {};
if (ruleName3 in rules2) {
const ruleConfig14 = rules2[ruleName3];
if (Array.isArray(ruleConfig14)) {
return ruleConfig14[0] === true;
} else if (ruleConfig14 !== void 0 && ruleConfig14 !== null) {
return true;
} else if (ruleConfig14 === false) {
return false;
}
}
} catch (error) {
return false;
}
}
// src/rules/v9/no-hardcoded-values/noHardcodedValueRule.ts
function defineNoHardcodedValueRule(config) {
const { ruleConfig: ruleConfig14, ruleName: ruleName3 } = config;
const { type: type15, description: description15, url: url15, messages: messages15 } = ruleConfig14;
return {
meta: {
type: type15,
docs: {
description: description15,
recommended: true,
url: url15
},
fixable: "code",
messages: messages15
},
create(context) {
if (ruleName3 === "no-hardcoded-values-slds1" && isRuleEnabled(context, "@salesforce-ux/slds/no-hardcoded-values-slds2")) {
return {};
}
const handlerContext = {
valueToStylinghook: config.valueToStylinghook,
context,
sourceCode: context.sourceCode
};
const colorOnlySelector = toSelector(colorProperties);
const densityOnlySelector = toSelector(densificationProperties);
const fontDensitySelector = toSelector(fontProperties);
const overlappingProperties = colorProperties.filter((colorProp) => {
return densificationProperties.some((densityProp) => {
if (densityProp === colorProp) {
return true;
}
if (densityProp.includes("*")) {
const regexPattern = new RegExp("^" + densityProp.replace(/\*/g, ".*") + "$");
return regexPattern.test(colorProp);
}
return false;
});
});
const overlappingSet = new Set(overlappingProperties);
const colorOnlyProps = colorProperties.filter((prop) => !overlappingSet.has(prop));
const densityOnlyProps = densificationProperties.filter((prop) => !overlappingSet.has(prop));
const visitors = {};
if (colorOnlyProps.length > 0) {
const colorOnlySelector2 = toSelector(colorOnlyProps);
visitors[colorOnlySelector2] = (node) => {
handleColorDeclaration(node, handlerContext);
};
}
if (densityOnlyProps.length > 0) {
const densityOnlySelector2 = toSelector(densityOnlyProps);
visitors[densityOnlySelector2] = (node) => {
handleDensityDeclaration(node, handlerContext);
};
}
visitors[fontDensitySelector] = (node) => {
handleFontDeclaration(node, handlerContext);
};
visitors['Declaration[property="box-shadow"]'] = (node) => {
handleBoxShadowDeclaration(node, handlerContext);
};
if (overlappingProperties.length > 0) {
const overlappingSelector = toSelector(overlappingProperties);
visitors[overlappingSelector] = (node) => {
handleColorDeclaration(node, handlerContext);
handleDensityDeclaration(node, handlerContext);
};
}
return visitors;
}
};
}
// src/rules/v9/no-hardcoded-values/no-hardcoded-values-slds1.ts
var ruleName = "no-hardcoded-values-slds1";
var ruleConfig12 = import_rule_messages14.default[ruleName];
var { type: type13, description: description13, url: url13, messages: messages13 } = ruleConfig12;
var valueToStylinghook = import_sds_metadata12.default.valueToStylingHooksSlds;
var no_hardcoded_values_slds1_default = defineNoHardcodedValueRule({
ruleConfig: ruleConfig12,
valueToStylinghook,
ruleName
});
// src/rules/v9/no-hardcoded-values/no-hardcoded-values-slds2.ts
var import_sds_metadata13 = __toESM(require("@salesforce-ux/sds-metadata"));
var import_rule_messages15 = __toESM(require_rule_messages());
var ruleName2 = "no-hardcoded-values-slds2";
var ruleConfig13 = import_rule_messages15.default[ruleName2];
var { type: type14, description: description14, url: url14, messages: messages14 } = ruleConfig13;
var valueToStylinghook2 = import_sds_metadata13.default.valueToStylingHooksCosmos;
var no_hardcoded_values_slds2_default = defineNoHardcodedValueRule({
ruleConfig: ruleConfig13,
valueToStylinghook: valueToStylinghook2,
ruleName: ruleName2
});
// src/index.ts
var import_parser2 = __toESM(require("@html-eslint/parser"));
var import_css = __toESM(require("@eslint/css"));
// eslint.rules.json
var eslint_rules_default = {
css: {
"@salesforce-ux/slds/no-slds-class-overrides": "warn",
"@salesforce-ux/slds/no-deprecated-slds-classes": "warn",
"@salesforce-ux/slds/lwc-token-to-slds-hook": "error",
"@salesforce-ux/slds/enforce-sds-to-slds-hooks": "warn",
"@salesforce-ux/slds/no-sldshook-fallback-for-lwctoken": "warn",
"@salesforce-ux/slds/no-unsupported-hooks-slds2": "warn",
"@salesforce-ux/slds/no-slds-var-without-fallback": "warn",
"@salesforce-ux/slds/no-slds-namespace-for-custom-hooks": "warn",
"@salesforce-ux/slds/enforce-component-hook-naming-convention": "error",
"@salesforce-ux/slds/no-slds-private-var": "warn",
"@salesforce-ux/slds/no-hardcoded-values-slds2": "warn",
"@salesforce-ux/slds/reduce-annotations": "warn"
},
html: {
"@salesforce-ux/slds/enforce-bem-usage": "error",
"@salesforce-ux/slds/no-deprecated-classes-slds2": "error",
"@salesforce-ux/slds/modal-close-button-issue": "error"
}
};
// src/index.ts
var rules = {
"enforce-bem-usage": import_enforce_bem_usage.default,
"no-deprecated-classes-slds2": import_no_deprecated_classes_slds2.default,
"modal-close-button-issue": import_modal_close_button_issue.default,
"no-slds-class-overrides": no_slds_class_overrides_default,
"no-deprecated-slds-classes": no_deprecated_slds_classes_default,
"no-deprecated-tokens-slds1": no_deprecated_tokens_slds1_default,
"lwc-token-to-slds-hook": lwc_token_to_slds_hook_default,
"enforce-sds-to-slds-hooks": enforce_sds_to_slds_hooks_default,
"no-sldshook-fallback-for-lwctoken": no_sldshook_fallback_for_lwctoken_default,
"no-unsupported-hooks-slds2": no_unsupported_hooks_slds2_default,
"no-slds-var-without-fallback": no_slds_var_without_fallback_default,
"no-slds-namespace-for-custom-hooks": no_slds_namespace_for_custom_hooks_default,
"enforce-component-hook-naming-convention": enforce_component_hook_naming_convention_default,
"no-slds-private-var": no_slds_private_var_default,
"no-hardcoded-values-slds1": no_hardcoded_values_slds1_default,
"no-hardcoded-values-slds2": no_hardcoded_values_slds2_default,
"reduce-annotations": reduce_annotations_default
};
var plugin = {
meta: {
name: "@salesforce-ux/eslint-plugin-slds",
version: "1.0.7"
},
rules,
configs: {}
};
var baseCssConfigWithPlugin = {
files: ["**/*.{css,scss}"],
language: "css/css",
languageOptions: {
tolerant: true
// Allow recoverable parsing errors for SCSS syntax
},
plugins: {
css: import_css.default,
"@salesforce-ux/slds": plugin
},
rules: eslint_rules_default.css,
settings: {
// Pass rules configuration to context for runtime access
sldsRules: { ...eslint_rules_default.css }
}
};
var cssConfigArray = [baseCssConfigWithPlugin];
var htmlConfigArray = [
// HTML/Component config
{
files: ["**/*.html", "**/*.cmp"],
languageOptions: {
parser: import_parser2.default,
ecmaVersion: 2021,
sourceType: "module"
},
plugins: {
"@salesforce-ux/slds": plugin
},
rules: eslint_rules_default.html
}
];
Object.assign(plugin.configs, {
// Flat config for ESLint v9+
"flat/recommended-css": cssConfigArray,
"flat/recommended-html": htmlConfigArray,
"flat/recommended": [...cssConfigArray, ...htmlConfigArray],
// legacy config for ESLint v8-
recommended: {
plugins: ["@salesforce-ux/slds"],
rules: eslint_rules_default.html,
parser: import_parser2.default,
parserOptions: {
ecmaVersion: 2021,
sourceType: "module"
}
}
});
function sldsCssPlugin() {
return {
...baseCssConfigWithPlugin.plugins
};
}
module.exports = plugin;
module.exports.sldsCssPlugin = sldsCssPlugin;
//# sourceMappingURL=index.js.map