igniteui-theming 25.1.0 → 25.2.0

package/dist/mcp/json/elevations/indigo.json.js

@@ -1,8 +0,0 @@
-const elevations = { "0": "none", "1": "0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 3px) 0 rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 1px) 0 rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * -1px) rgba(0, 0, 0, 0.08)", "2": "0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 6px) 0 rgba(0, 0, 0, 0.3)", "3": "0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 6px) 0 rgba(36, 37, 44, 0.2)", "4": "0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 12px) 0 rgba(36, 37, 44, 0.1)", "5": "0 0 calc(var(--ig-elevation-factor, 1) * 12px) 0 rgba(36, 37, 44, 0.2)", "6": "0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 12px) 0 rgba(36, 37, 44, 0.2)", "7": "0 0 calc(var(--ig-elevation-factor, 1) * 12px) 0 rgba(0, 0, 0, 0.3)", "8": "0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 2px) 0 rgba(36, 37, 44, 0.2)", "9": "0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 2px) 0 rgba(0, 0, 0, 0.3)", "10": "0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 6px) 0 rgba(36, 37, 44, 0.4)", "11": "0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 6px) 0 rgba(0, 0, 0, 0.4)", "12": "0 0 calc(var(--ig-elevation-factor, 1) * 16px) 0 rgba(36, 37, 44, 0.4)", "13": "0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * -4px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 13px) calc(var(--ig-elevation-factor, 1) * 19px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * 24px) calc(var(--ig-elevation-factor, 1) * 4px) rgba(0, 0, 0, 0.08)", "14": "0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * -4px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 14px) calc(var(--ig-elevation-factor, 1) * 21px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * 26px) calc(var(--ig-elevation-factor, 1) * 4px) rgba(0, 0, 0, 0.08)", "15": "0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * -5px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 15px) calc(var(--ig-elevation-factor, 1) * 22px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 28px) calc(var(--ig-elevation-factor, 1) * 5px) rgba(0, 0, 0, 0.08)", "16": "0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * -5px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 16px) calc(var(--ig-elevation-factor, 1) * 24px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 30px) calc(var(--ig-elevation-factor, 1) * 5px) rgba(0, 0, 0, 0.08)", "17": "0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 11px) calc(var(--ig-elevation-factor, 1) * -5px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 17px) calc(var(--ig-elevation-factor, 1) * 26px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 32px) calc(var(--ig-elevation-factor, 1) * 5px) rgba(0, 0, 0, 0.08)", "18": "0 calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * 11px) calc(var(--ig-elevation-factor, 1) * -5px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 18px) calc(var(--ig-elevation-factor, 1) * 28px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 34px) calc(var(--ig-elevation-factor, 1) * 6px) rgba(0, 0, 0, 0.08)", "19": "0 calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * 12px) calc(var(--ig-elevation-factor, 1) * -6px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 19px) calc(var(--ig-elevation-factor, 1) * 29px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 36px) calc(var(--ig-elevation-factor, 1) * 6px) rgba(0, 0, 0, 0.08)", "20": "0 calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 13px) calc(var(--ig-elevation-factor, 1) * -6px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 20px) calc(var(--ig-elevation-factor, 1) * 31px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 38px) calc(var(--ig-elevation-factor, 1) * 7px) rgba(0, 0, 0, 0.08)", "21": "0 calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 13px) calc(var(--ig-elevation-factor, 1) * -6px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 21px) calc(var(--ig-elevation-factor, 1) * 33px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 40px) calc(var(--ig-elevation-factor, 1) * 7px) rgba(0, 0, 0, 0.08)", "22": "0 calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 14px) calc(var(--ig-elevation-factor, 1) * -6px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 22px) calc(var(--ig-elevation-factor, 1) * 35px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 42px) calc(var(--ig-elevation-factor, 1) * 7px) rgba(0, 0, 0, 0.08)", "23": "0 0 calc(var(--ig-elevation-factor, 1) * 16px) 0 rgba(0, 0, 0, 0.3)", "24": "0 0 calc(var(--ig-elevation-factor, 1) * 16px) 0 rgba(36, 37, 44, 0.4)" };
-const indigoElevationsData = {
-  elevations
-};
-export {
-  indigoElevationsData as default,
-  elevations
-};

package/dist/mcp/json/elevations/material.json.js

@@ -1,8 +0,0 @@
-const elevations = /* @__PURE__ */ JSON.parse('{"0":"none","1":"0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 3px) 0 rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 1px) 0 rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * -1px) rgba(0, 0, 0, 0.08)","2":"0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 5px) 0 rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 2px) 0 rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * -2px) rgba(0, 0, 0, 0.08)","3":"0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 8px) 0 rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 4px) 0 rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * -2px) rgba(0, 0, 0, 0.08)","4":"0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 4px) calc(var(--ig-elevation-factor, 1) * -1px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 4px) calc(var(--ig-elevation-factor, 1) * 5px) 0 rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 10px) 0 rgba(0, 0, 0, 0.08)","5":"0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * -1px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * 8px) 0 rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 14px) 0 rgba(0, 0, 0, 0.08)","6":"0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * -1px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 10px) 0 rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 1px) calc(var(--ig-elevation-factor, 1) * 18px) 0 rgba(0, 0, 0, 0.08)","7":"0 calc(var(--ig-elevation-factor, 1) * 4px) calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * -2px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 1px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 2px) calc(var(--ig-elevation-factor, 1) * 16px) calc(var(--ig-elevation-factor, 1) * 1px) rgba(0, 0, 0, 0.08)","8":"0 calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * -3px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 1px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 14px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.08)","9":"0 calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * -3px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * 12px) calc(var(--ig-elevation-factor, 1) * 1px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 3px) calc(var(--ig-elevation-factor, 1) * 16px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.08)","10":"0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * -3px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 14px) calc(var(--ig-elevation-factor, 1) * 1px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 4px) calc(var(--ig-elevation-factor, 1) * 18px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.08)","11":"0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * -4px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 11px) calc(var(--ig-elevation-factor, 1) * 15px) calc(var(--ig-elevation-factor, 1) * 1px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 4px) calc(var(--ig-elevation-factor, 1) * 20px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.08)","12":"0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * -4px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 12px) calc(var(--ig-elevation-factor, 1) * 17px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * 22px) calc(var(--ig-elevation-factor, 1) * 4px) rgba(0, 0, 0, 0.08)","13":"0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * -4px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 13px) calc(var(--ig-elevation-factor, 1) * 19px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * 24px) calc(var(--ig-elevation-factor, 1) * 4px) rgba(0, 0, 0, 0.08)","14":"0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * -4px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 14px) calc(var(--ig-elevation-factor, 1) * 21px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 5px) calc(var(--ig-elevation-factor, 1) * 26px) calc(var(--ig-elevation-factor, 1) * 4px) rgba(0, 0, 0, 0.08)","15":"0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * -5px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 15px) calc(var(--ig-elevation-factor, 1) * 22px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 28px) calc(var(--ig-elevation-factor, 1) * 5px) rgba(0, 0, 0, 0.08)","16":"0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * -5px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 16px) calc(var(--ig-elevation-factor, 1) * 24px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 30px) calc(var(--ig-elevation-factor, 1) * 5px) rgba(0, 0, 0, 0.08)","17":"0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 11px) calc(var(--ig-elevation-factor, 1) * -5px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 17px) calc(var(--ig-elevation-factor, 1) * 26px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 6px) calc(var(--ig-elevation-factor, 1) * 32px) calc(var(--ig-elevation-factor, 1) * 5px) rgba(0, 0, 0, 0.08)","18":"0 calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * 11px) calc(var(--ig-elevation-factor, 1) * -5px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 18px) calc(var(--ig-elevation-factor, 1) * 28px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 34px) calc(var(--ig-elevation-factor, 1) * 6px) rgba(0, 0, 0, 0.08)","19":"0 calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * 12px) calc(var(--ig-elevation-factor, 1) * -6px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 19px) calc(var(--ig-elevation-factor, 1) * 29px) calc(var(--ig-elevation-factor, 1) * 2px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 7px) calc(var(--ig-elevation-factor, 1) * 36px) calc(var(--ig-elevation-factor, 1) * 6px) rgba(0, 0, 0, 0.08)","20":"0 calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 13px) calc(var(--ig-elevation-factor, 1) * -6px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 20px) calc(var(--ig-elevation-factor, 1) * 31px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 38px) calc(var(--ig-elevation-factor, 1) * 7px) rgba(0, 0, 0, 0.08)","21":"0 calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 13px) calc(var(--ig-elevation-factor, 1) * -6px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 21px) calc(var(--ig-elevation-factor, 1) * 33px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 40px) calc(var(--ig-elevation-factor, 1) * 7px) rgba(0, 0, 0, 0.08)","22":"0 calc(var(--ig-elevation-factor, 1) * 10px) calc(var(--ig-elevation-factor, 1) * 14px) calc(var(--ig-elevation-factor, 1) * -6px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 22px) calc(var(--ig-elevation-factor, 1) * 35px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 8px) calc(var(--ig-elevation-factor, 1) * 42px) calc(var(--ig-elevation-factor, 1) * 7px) rgba(0, 0, 0, 0.08)","23":"0 calc(var(--ig-elevation-factor, 1) * 11px) calc(var(--ig-elevation-factor, 1) * 14px) calc(var(--ig-elevation-factor, 1) * -7px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 23px) calc(var(--ig-elevation-factor, 1) * 36px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * 44px) calc(var(--ig-elevation-factor, 1) * 8px) rgba(0, 0, 0, 0.08)","24":"0 calc(var(--ig-elevation-factor, 1) * 11px) calc(var(--ig-elevation-factor, 1) * 15px) calc(var(--ig-elevation-factor, 1) * -7px) rgba(0, 0, 0, 0.26), 0 calc(var(--ig-elevation-factor, 1) * 24px) calc(var(--ig-elevation-factor, 1) * 38px) calc(var(--ig-elevation-factor, 1) * 3px) rgba(0, 0, 0, 0.12), 0 calc(var(--ig-elevation-factor, 1) * 9px) calc(var(--ig-elevation-factor, 1) * 46px) calc(var(--ig-elevation-factor, 1) * 8px) rgba(0, 0, 0, 0.08)"}');
-const materialElevationsData = {
-  elevations
-};
-export {
-  materialElevationsData as default,
-  elevations
-};

package/dist/mcp/json/typography/presets/typescales.json.js

@@ -1,17 +0,0 @@
-const bootstrap = { "typeface": "-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol", "h1": { "font-family": "inherit", "font-size": "2.5rem", "font-weight": "500", "font-style": "normal", "line-height": "3rem", "letter-spacing": "-0.09375rem", "text-transform": "none", "margin-top": "0", "margin-bottom": "0.5rem" }, "h2": { "font-family": "inherit", "font-size": "2rem", "font-weight": "500", "font-style": "normal", "line-height": "2.4rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0.5rem" }, "h3": { "font-family": "inherit", "font-size": "1.75rem", "font-weight": "500", "font-style": "normal", "line-height": "2.1rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0.5rem" }, "h4": { "font-family": "inherit", "font-size": "1.5rem", "font-weight": "500", "font-style": "normal", "line-height": "1.8rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0.5rem" }, "h5": { "font-family": "inherit", "font-size": "1.25rem", "font-weight": "500", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0.5rem" }, "h6": { "font-family": "inherit", "font-size": "1rem", "font-weight": "500", "font-style": "normal", "line-height": "1.2rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0.5rem" }, "subtitle-1": { "font-family": "inherit", "font-size": "1rem", "font-weight": "700", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "subtitle-2": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "700", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "body-1": { "font-family": "inherit", "font-size": "1rem", "font-weight": "400", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "body-2": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "400", "font-style": "normal", "line-height": "1.3125rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "button": { "font-family": "inherit", "font-size": "1rem", "font-weight": "400", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "caption": { "font-family": "inherit", "font-size": "0.75rem", "font-weight": "400", "font-style": "normal", "line-height": "1rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "overline": { "font-family": "inherit", "font-size": "0.625rem", "font-weight": "400", "font-style": "normal", "line-height": "1rem", "letter-spacing": "0.09375rem", "text-transform": "uppercase", "margin-top": "0", "margin-bottom": "0" }, "calendar-labels": { "font-family": "inherit", "font-size": "0.8125rem", "font-weight": "400", "font-style": "normal", "line-height": "normal", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" } };
-const material = { "typeface": "Titillium Web, sans-serif", "h1": { "font-family": "inherit", "font-size": "6rem", "font-weight": "300", "font-style": "normal", "line-height": "7rem", "letter-spacing": "-0.09375rem", "text-transform": "none", "margin-top": "1.75rem", "margin-bottom": "3.5rem" }, "h2": { "font-family": "inherit", "font-size": "3.75rem", "font-weight": "300", "font-style": "normal", "line-height": "4.4375rem", "letter-spacing": "-0.03125rem", "text-transform": "none", "margin-top": "1.75rem", "margin-bottom": "1.75rem" }, "h3": { "font-family": "inherit", "font-size": "3rem", "font-weight": "400", "font-style": "normal", "line-height": "3.5625rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "1.75rem", "margin-bottom": "0" }, "h4": { "font-family": "inherit", "font-size": "2.125rem", "font-weight": "400", "font-style": "normal", "line-height": "2.5rem", "letter-spacing": "0.015625rem", "text-transform": "none", "margin-top": "1.75rem", "margin-bottom": "0" }, "h5": { "font-family": "inherit", "font-size": "1.5rem", "font-weight": "400", "font-style": "normal", "line-height": "1.75rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "1.75rem", "margin-bottom": "0" }, "h6": { "font-family": "inherit", "font-size": "1.25rem", "font-weight": "600", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "0.009375rem", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "subtitle-1": { "font-family": "inherit", "font-size": "1rem", "font-weight": "400", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "0.009375rem", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "subtitle-2": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "600", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "0.00625rem", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "body-1": { "font-family": "inherit", "font-size": "1rem", "font-weight": "400", "font-style": "normal", "line-height": "1.75rem", "letter-spacing": "0.03125rem", "text-transform": "none", "margin-top": "1.75rem", "margin-bottom": "1rem" }, "body-2": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "400", "font-style": "normal", "line-height": "1.25rem", "letter-spacing": "0.015625rem", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "button": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "600", "font-style": "normal", "line-height": "1rem", "letter-spacing": "0.046875rem", "text-transform": "uppercase", "margin-top": "0", "margin-bottom": "0" }, "caption": { "font-family": "inherit", "font-size": "0.75rem", "font-weight": "400", "font-style": "normal", "line-height": "1rem", "letter-spacing": "0.025rem", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "overline": { "font-family": "inherit", "font-size": "0.625rem", "font-weight": "400", "font-style": "normal", "line-height": "1rem", "letter-spacing": "0.09375rem", "text-transform": "uppercase", "margin-top": "0", "margin-bottom": "0" } };
-const fluent = { "typeface": "Open Sans, Helvetica, Arial, sans-serif", "h1": { "font-family": "inherit", "font-size": "4.25rem", "font-weight": "400", "font-style": "normal", "line-height": "4.75rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h2": { "font-family": "inherit", "font-size": "2.625rem", "font-weight": "400", "font-style": "normal", "line-height": "3.25rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h3": { "font-family": "inherit", "font-size": "2rem", "font-weight": "400", "font-style": "normal", "line-height": "2.5rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h4": { "font-family": "inherit", "font-size": "1.75rem", "font-weight": "400", "font-style": "normal", "line-height": "2.25rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h5": { "font-family": "inherit", "font-size": "1.5rem", "font-weight": "400", "font-style": "normal", "line-height": "2rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h6": { "font-family": "inherit", "font-size": "1.25rem", "font-weight": "400", "font-style": "normal", "line-height": "1.75rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "subtitle-1": { "font-family": "inherit", "font-size": "1.125rem", "font-weight": "400", "font-style": "normal", "line-height": "1.5rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "subtitle-2": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "700", "font-style": "normal", "line-height": "1.25rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "body-1": { "font-family": "inherit", "font-size": "1rem", "font-weight": "400", "font-style": "normal", "line-height": "1.375rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "body-2": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "400", "font-style": "normal", "line-height": "1.25rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "button": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "600", "font-style": "normal", "line-height": "0.875rem", "letter-spacing": "normal", "text-transform": "capitalize", "margin-top": "0", "margin-bottom": "0" }, "caption": { "font-family": "inherit", "font-size": "0.75rem", "font-weight": "400", "font-style": "normal", "line-height": "1rem", "letter-spacing": "normal", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "overline": { "font-family": "inherit", "font-size": "0.625rem", "font-weight": "400", "font-style": "normal", "line-height": "0.875rem", "letter-spacing": "normal", "text-transform": "uppercase", "margin-top": "0", "margin-bottom": "0" } };
-const indigo = { "typeface": "Nunito Sans, sans-serif", "h1": { "font-family": "inherit", "font-size": "2.25rem", "font-weight": "300", "font-style": "normal", "line-height": "2.625rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h2": { "font-family": "inherit", "font-size": "1.75rem", "font-weight": "400", "font-style": "normal", "line-height": "2.25rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h3": { "font-family": "inherit", "font-size": "1.5rem", "font-weight": "400", "font-style": "normal", "line-height": "2rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h4": { "font-family": "inherit", "font-size": "1.25rem", "font-weight": "600", "font-style": "normal", "line-height": "1.625rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h5": { "font-family": "inherit", "font-size": "1rem", "font-weight": "600", "font-style": "normal", "line-height": "1.375rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "h6": { "font-family": "inherit", "font-size": "0.875rem", "font-weight": "600", "font-style": "normal", "line-height": "1.25rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "subtitle-1": { "font-family": "inherit", "font-size": "0.8125rem", "font-weight": "600", "font-style": "normal", "line-height": "1.125rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "subtitle-2": { "font-family": "inherit", "font-size": "0.75rem", "font-weight": "600", "font-style": "normal", "line-height": "1rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "body-1": { "font-family": "inherit", "font-size": "0.8125rem", "font-weight": "400", "font-style": "normal", "line-height": "1.125rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "body-2": { "font-family": "inherit", "font-size": "0.75rem", "font-weight": "400", "font-style": "normal", "line-height": "1rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "button": { "font-family": "inherit", "font-size": "0.6875rem", "font-weight": "700", "font-style": "normal", "line-height": "0.9375rem", "letter-spacing": "0", "text-transform": "uppercase", "margin-top": "0", "margin-bottom": "0" }, "caption": { "font-family": "inherit", "font-size": "0.6875rem", "font-weight": "400", "font-style": "normal", "line-height": "0.9375rem", "letter-spacing": "0", "text-transform": "normal", "margin-top": "0", "margin-bottom": "0" }, "overline": { "font-family": "inherit", "font-size": "0.6875rem", "font-weight": "700", "font-style": "normal", "line-height": "0.9375rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "detail-1": { "font-family": "inherit", "font-size": "0.75rem", "font-weight": "400", "font-style": "normal", "line-height": "1rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" }, "detail-2": { "font-family": "inherit", "font-size": "0.75rem", "font-weight": "600", "font-style": "normal", "line-height": "1rem", "letter-spacing": "0", "text-transform": "none", "margin-top": "0", "margin-bottom": "0" } };
-const typescalesData = {
-  bootstrap,
-  material,
-  fluent,
-  indigo
-};
-export {
-  bootstrap,
-  typescalesData as default,
-  fluent,
-  indigo,
-  material
-};

package/dist/mcp/knowledge/docs/colors/guidance.md.js

@@ -1,4 +0,0 @@
-const COLOR_GUIDANCE_MARKDOWN = '# Ignite UI Theming - Color Guidance\n\n## Understanding Theme Variants\n\nIgnite UI themes support two variants: **light** and **dark**. The variant affects how colors are chosen and how the palette generates shades.\n\n## Surface Color Rules\n\nThe **surface** color is the main background color used throughout your application.\n\n| Variant | Surface Requirement | Luminance | Examples |\n|---------|---------------------|-----------|----------|\n| light | Light color | > 0.5 | white, #ffffff, #f5f5f5, #e8e8e8 |\n| dark | Dark color | ≤ 0.5 | #121212, #1a1a1a, #1e1e1e, #212121 |\n\n## Gray Color Rules\n\nThe **gray** parameter sets the base color used to generate the grayscale palette. This is INVERTED from the surface because the grayscale shades need to contrast against the surface.\n\n| Variant | Gray Base Requirement | Luminance | Examples |\n|---------|----------------------|-----------|----------|\n| light | Dark color | ≤ 0.5 | #333333, #212121, #424242, #2c2c2c |\n| dark | Light color | > 0.5 | #f5f5f5, #e0e0e0, #d0d0d0, #cccccc |\n\n### Why is Gray Inverted?\n\nThe `palette()` function generates grayscale shades that are used for text, borders, and UI elements. These shades need to be readable against the surface:\n\n- **Light theme**: Light surface needs dark gray shades for readable text → use dark gray base\n- **Dark theme**: Dark surface needs light gray shades for readable text → use light gray base\n\n## Luminance Calculation\n\nLuminance is calculated using the WCAG 2.0 formula:\n- 0 = pure black\n- 1 = pure white\n- 0.5 = threshold between "light" and "dark" colors\n\n## Contrast Ratio\n\nWhen both surface and gray are provided, the system checks their contrast ratio. A minimum of 4.5:1 is recommended for good readability.\n\n## Best Practices\n\n1. **Let the system auto-calculate gray**: If you\'re unsure, omit the `gray` parameter. The palette() function will automatically derive an appropriate gray base from the surface color.\n\n2. **Match surface to variant**: Always use a light surface for light themes and a dark surface for dark themes.\n\n3. **Test contrast**: Ensure your color combinations meet accessibility standards (WCAG 2.0).\n\n## Common Mistakes\n\n❌ **Light theme with dark surface**: Creates visual confusion\n❌ **Dark theme with light surface**: Defeats the purpose of dark mode\n❌ **Light theme with light gray base**: Produces unreadable gray shades\n❌ **Dark theme with dark gray base**: Produces unreadable gray shades\n\n## Examples\n\n### Correct Light Theme\n```scss\n$palette: palette(\n  $primary: #06c,\n  $secondary: #f60,\n  $surface: white,      // ✅ Light surface for light theme\n  $gray: #333           // ✅ Dark gray base (optional)\n);\n```\n\n### Correct Dark Theme\n```scss\n$palette: palette(\n  $primary: #39f,\n  $secondary: #f93,\n  $surface: #1a1a1a,    // ✅ Dark surface for dark theme\n  $gray: #f5f5f5        // ✅ Light gray base (optional)\n);\n```\n';
-export {
-  COLOR_GUIDANCE_MARKDOWN as default
-};

package/dist/mcp/knowledge/docs/colors/usage.md.js

@@ -1,4 +0,0 @@
-const COLOR_USAGE_MARKDOWN = "# Ignite UI Color Usage Guide\n\n## Overview\n\nThe Ignite UI theming system uses **8 color families**, each with **10 shade levels** (50-900). Understanding how these colors interact with components helps you create cohesive, accessible themes.\n\n## Color Families\n\n### Primary Color\n**Role:** Brand identity and primary actions\n\nThe primary color is your brand's signature color. It draws attention to the most important interactive elements.\n\n**Used For:**\n- Primary action buttons (filled/contained style)\n- Links and navigation highlights\n- Active/selected states (tabs, list items, checkboxes, radios, switches)\n- Progress indicators and sliders\n- Focus rings and outlines\n- Calendar date selection\n- Grid row selection\n\n**Shade Usage:**\n| Shades | Purpose | Examples |\n|--------|---------|----------|\n| 50-100 | Subtle backgrounds, disabled | Focus backgrounds, disabled button fills |\n| 200-300 | Focus outlines, selections with opacity | Focus rings, selected backgrounds (Indigo) |\n| **500** | **Default/main color** | Button backgrounds, link text, checkbox fills |\n| 600-700 | Hover and active states | Button hover, pressed states |\n| 800-900 | Dark mode, maximum emphasis | Dark theme selections |\n\n---\n\n### Secondary Color\n**Role:** Accent and secondary emphasis\n\nMost prominent in Material Design. Provides accent without competing with primary.\n\n**Used For:**\n- Flat/outlined button text (Material)\n- List and dropdown headers\n- Alternative selection backgrounds\n- Secondary action buttons\n\n**Shade Usage:**\n| Shades | Purpose |\n|--------|---------|\n| 100-200 | Selected backgrounds, light accents |\n| **500** | Default accent |\n| 600-700 | Headers (Fluent), strong accents |\n\n---\n\n### Gray Color\n**Role:** Neutral UI foundation\n\nThe most used color family. Creates text hierarchy, borders, and backgrounds.\n\n**Used For:**\n- All text (primary, secondary, disabled, placeholder)\n- Borders and dividers\n- Backgrounds (hover, selected, disabled)\n- Icons\n- Tooltips\n\n**Shade Usage:**\n| Shade | Purpose | Examples |\n|-------|---------|----------|\n| 50 | Lightest backgrounds | Dark mode bg, group areas |\n| 100 | Hover/focus backgrounds | Item hover, light borders |\n| 200 | Selected backgrounds, borders | Selected items (Fluent), borders |\n| 300 | Borders, dividers | Default borders, dividers |\n| 400 | Disabled elements, placeholders | Disabled text, placeholder |\n| 500 | Secondary text, icons | Disabled text, secondary content |\n| 600 | Labels, secondary text | Header text (Indigo), labels |\n| 700 | Descriptions, tooltips | Tooltip bg, descriptions |\n| 800 | Primary text | Main text, titles |\n| **900** | **Maximum contrast text** | Headings, emphasis |\n\n---\n\n### Surface Color\n**Role:** Component background foundation\n\nThe \"canvas\" color. Typically white (light) or dark gray (dark themes).\n\n**Used For:**\n- Card, dialog, dropdown backgrounds\n- Input field backgrounds\n- List and panel backgrounds\n- Navigation backgrounds\n\n**Note:** Usually only shade 500 is used. The surface determines whether gray shades appear light or dark.\n\n---\n\n### Error Color\n**Role:** Validation errors and destructive actions\n\nCommunicates problems. Use sparingly for maximum impact.\n\n**Used For:**\n- Form validation errors (borders, text)\n- Invalid state indicators\n- Destructive action buttons\n- Error progress state\n\n**Shade Usage:**\n| Shades | Purpose |\n|--------|---------|\n| 200-400 | Focus rings, light errors |\n| **500** | Default error |\n| 600-800 | Hover states, Material errors |\n\n---\n\n### Success, Warn, Info Colors\n**Role:** Feedback states\n\n| Color | Purpose |\n|-------|---------|\n| **Success** | Completion, positive feedback |\n| **Warn** | Caution, potential issues |\n| **Info** | Neutral information |\n\nThese primarily use shade **500** for their default state.\n\n---\n\n## Interaction State Patterns\n\n### Button States\n```\nidle    → primary-500 background\nhover   → primary-600 (or 500 + overlay)\nfocus   → primary-500 + focus ring (200-300)\nactive  → primary-700\ndisabled → gray-300 bg, gray-500 text\n```\n\n### List Item States\n```\nidle     → surface bg, gray-800 text\nhover    → gray-100 or 200 bg\nfocus    → gray-100 bg + outline\nselected → primary-100/200 bg (or 300 @ 0.3 opacity)\ndisabled → gray-400 text\n```\n\n### Input States\n```\nidle    → surface bg, gray-300/400 border\nhover   → gray-400/500 border\nfocus   → primary-500 border + ring\nerror   → error-500 border/text\ndisabled → gray-100 bg, gray-400 text\n```\n\n---\n\n## Opacity Usage\n\nOpacity modifiers adjust color intensity while maintaining relationships:\n\n| Opacity | Use Case |\n|---------|----------|\n| 0.05-0.1 | Subtle hover overlays |\n| 0.12-0.15 | Active states, disabled bg |\n| 0.2 | Disabled elements |\n| 0.3 | Selected backgrounds (Indigo) |\n| **0.38** | Material disabled (standard) |\n| 0.5 | Focus outlines |\n| 0.8-0.9 | Strong overlays, tooltips |\n\n---\n\n## Contrast Colors\n\nAlways use `contrast-color` for text on colored backgrounds:\n\n```scss\n// Text on primary button\ncolor: contrast-color('primary', 500);\n\n// Text with opacity\ncolor: contrast-color('gray', 50, 0.8);\n```\n\n---\n\n## Theme Variations\n\n### Material Design\n- Secondary color for accents\n- Ripple effects\n- A100-A700 accent shades\n- Elevation through shadows\n\n### Fluent Design\n- Gray-based, subtle\n- 100-200 for hovers\n- Border-focused styling\n\n### Bootstrap\n- Primary for accents\n- 600 for hover states\n- Strong borders\n\n### Indigo Design\n- Transparent backgrounds\n- Primary 300 @ 0.3 opacity for selections\n- Clean, modern aesthetic\n\n---\n\n## Dark Mode Guidelines\n\nIMPORTANT: Chromatic color shades (primary, secondary, etc.) are NEVER inverted.\nThe shade order is always 50=lightest, 900=darkest regardless of theme variant.\nOnly GRAY inverts its shade progression for dark themes.\n\n1. **Gray shades invert**: Lower numbers become darker (50=darkest in dark mode)\n2. **Use lighter primary shades**: In dark mode UI, reference lighter shades (100-300) \n   instead of darker ones (500-700) for better visibility. The palette itself is NOT \n   inverted - you just USE different shades from the same palette.\n3. **Surface becomes dark**: #222, #1a1a1a, etc.\n4. **Contrast still works**: `contrast-color` adapts automatically\n\n---\n\n## Quick Reference\n\n| Need | Color | Shade |\n|------|-------|-------|\n| Primary button bg | primary | 500 |\n| Link text | primary | 500 |\n| Main body text | gray | 800-900 |\n| Secondary text | gray | 600-700 |\n| Disabled text | gray | 400-500 |\n| Component bg | surface | 500 |\n| Hover bg | gray | 100-200 |\n| Border | gray | 200-400 |\n| Error state | error | 500 |\n| Success state | success | 500 |\n| Focus ring | primary | 200-300 |\n";
-export {
-  COLOR_USAGE_MARKDOWN as default
-};

package/dist/mcp/knowledge/docs/layout/functions/border-radius.md.js

@@ -1,4 +0,0 @@
-const BORDER_RADIUS_FUNCTION_DOC = "# The border-radius() function\n\nClamps a radius value between min and max that can be configured using --ig-radius-factor with fractional values between 0 and 1.\n\n## Mechanism\nborder-radius() calculates:\nclamp(min, calc(var(--ig-radius-factor) * max), max)\n\n## Sass example (include border-radius() in your styles)\n```scss\n.my-pill {\n  border-radius: border-radius(16px, 4px, 20px);\n}\n```\n\n## Configure radius factor to adjust the radius between min and max\n```css\n.my-pill {\n  --ig-radius-factor: 0.8;\n}\n```\n\n## Notes\n- Works without additional mixins.\n";
-export {
-  BORDER_RADIUS_FUNCTION_DOC as default
-};

package/dist/mcp/knowledge/docs/layout/functions/pad.md.js

@@ -1,4 +0,0 @@
-const PAD_FUNCTION_DOC = "# The pad() function\n\nReturns a size-aware spacing value based on --ig-spacing and size flags.\n\n## Mechanism\nThe pad() function uses --is-small/medium/large (from @include sizable()) and multiplies the\nchosen size by spacing variables:\n- --ig-spacing\n- --ig-spacing-inline (optional)\n- --ig-spacing-block (optional)\n- If --ig-spacing-inline or --ig-spacing-block are not provided, they default to --ig-spacing.\n\nSpacing can be controlled based on the value of --ig-size (small/medium/large) and can be set globally or at the component level:\n- --ig-spacing-small/medium/large\n- --ig-spacing-inline-small/medium/large\n- --ig-spacing-block-small/medium/large\n\n## CSS Variable Fallback Priority\nThe system checks CSS variables in priority order (first match wins):\n\n### For inline spacing (pad-inline):\n1. Most specific: --ig-spacing-inline-small/medium/large (based on current --ig-size)\n   - If defined → Use this value\n2. Size-specific: --ig-spacing-small/medium/large (based on current --ig-size)\n   - If defined → Use this value\n3. Direction-specific: --ig-spacing-inline\n   - If defined → Use this value (applies to all sizes)\n4. Base fallback: --ig-spacing\n   - Always use this if none of the above are defined (applies to all sizes)\n\n### For block spacing (pad-block):\n1. Most specific: --ig-spacing-block-small/medium/large (based on current --ig-size)\n   - If defined → Use this value\n2. Size-specific: --ig-spacing-small/medium/large (based on current --ig-size)\n   - If defined → Use this value\n3. Direction-specific: --ig-spacing-block\n   - If defined → Use this value (applies to all sizes)\n4. Base fallback: --ig-spacing\n   - Always use this if none of the above are defined (applies to all sizes)\n\n#### Example 1: Only base spacing set\n```scss\n:root {\n  --ig-spacing: 1;\n}\n```\nResult: Both inline and block use 1 for all sizes (small/medium/large)\n\n#### Example 2: Direction-specific spacing\n```scss\n:root {\n  --ig-spacing: 1;\n  --ig-spacing-inline: 1.5;\n  --ig-spacing-block: 0.75;\n}\n```\nResult:\n- Inline uses 1.5 for all sizes\n- Block uses 0.75 for all sizes\n\n#### Example 3: Size-specific spacing\n```scss\n:root {\n  --ig-spacing: 1;\n  --ig-spacing-small: 0.5;\n  --ig-spacing-medium: 1;\n  --ig-spacing-large: 1.5;\n}\n```\nResult: Both inline and block use size-specific values:\n- Small (--ig-size: 1) → 0.5\n- Medium (--ig-size: 2) → 1\n- Large (--ig-size: 3) → 1.5\n\n#### Example 4: Fully customized (most specific wins)\n```scss\n:root {\n  --ig-spacing: 1;\n  --ig-spacing-inline: 1.2;\n  --ig-spacing-inline-large: 2;\n}\n```\nResult:\n- Inline small/medium: 1.2 (from --ig-spacing-inline)\n- Inline large: 2 (from --ig-spacing-inline-large, most specific)\n- Block all sizes: 1 (fallback to --ig-spacing)\n\n## How to configure padding in a card component using pad(), pad-inline(), and pad-block()\n```scss\n.my-card {\n  padding: pad(4px, 8px, 16px); // Set both vertical and horizontal padding (configurable via --ig-spacing)\n  margin-inline: pad-inline(4px, 8px, 16px); // Set horizontal padding only (configurable via --ig-spacing or --ig-spacing-inline)\n  margin-block: pad-block(2px, 4px, 8px); // Set vertical padding only (configurable via --ig-spacing or --ig-spacing-block)\n}\n```\n\n## Configure the spacing variable to adjust the padding size in the card\n```css\n.my-card {\n  --ig-spacing: 0.75;\n}\n```\n\n## Notes\n- Requires @include sizing() and @include sizable() in component styles.\n- Requires @include spacing() once to set spacing variables.\n";
-export {
-  PAD_FUNCTION_DOC as default
-};

package/dist/mcp/knowledge/docs/layout/functions/sizable.md.js

@@ -1,4 +0,0 @@
-const SIZABLE_FUNCTION_DOC = "# The sizable() function\n\nReturns a size-aware value based on the values --ig-size and a user-declared --component-size CSS variables.\n\n## Mechanism\nThe sizable() function chooses between small/medium/large values using:\n- --component-size (user declared and liked to --ig-size)\n- --ig-size-small/medium/large (set by @include sizing())\n- --is-small/medium/large from @include sizable()\n\n## Sass example\n```scss\n.my-avatar {\n  @include sizable(); // Include --is-small/medium/large flags\n\n  --component-size: var(--ig-size, var(--ig-size-medium)); // Link component size to --ig-size with a default of 2 (medium)\n  --size: #{sizable(32px, 40px, 48px)};\n\n  width: var(--size);\n  height: var(--size);\n}\n```\n\n## Change the global size to medium, which will make the wid\n```scss\n:root {\n  --ig-size: 2;\n}\n```\n\n## Notes\n- Requires `@include sizable()` in component styles.\n- Requires `@include sizing()` once to set size variables.\n";
-export {
-  SIZABLE_FUNCTION_DOC as default
-};

package/dist/mcp/knowledge/docs/layout/mixins/sizable.md.js

@@ -1,4 +0,0 @@
-const SIZABLE_MIXIN_DOC = "# The sizable() mixin\n\nDefines size state flags used by `sizable()` and `pad()`:\n- --is-small\n- --is-medium\n- --is-large\n\n## Sass example\n```scss\n.my-component {\n  @include sizable();\n}\n```\n\n## Notes\n- Required for components to react to --ig-size changes.\n";
-export {
-  SIZABLE_MIXIN_DOC as default
-};

package/dist/mcp/knowledge/docs/layout/mixins/sizing.md.js

@@ -1,4 +0,0 @@
-const SIZING_MIXIN_DOC = "# The sizing() mixin\n\nDefines [CSS @property](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@property) rules for size levels:\n- --ig-size-small\n- --ig-size-medium\n- --ig-size-large\n\n## Sass example\n```scss\n@include sizing();\n```\n\n## Notes\n- Typically included once at the root scope/stylesheet.\n";
-export {
-  SIZING_MIXIN_DOC as default
-};

package/dist/mcp/knowledge/docs/layout/mixins/spacing.md.js

@@ -1,4 +0,0 @@
-const SPACING_MIXIN_DOC = "# The spacing() mixin\n\nDefines [CSS @property](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@property) rules for spacing (--ig-spacing) and its variants:\n## Sass example\n```scss\n@include spacing();\n```\n\n## CSS output\n```css\n:root {\n  @property --ig-spacing {\n      syntax: '<number> | <integer>';\n      initial-value: 1;\n      inherits: true;\n  } \n\n  --ig-spacing-inline-small: var(--ig-spacing-inline, var(--ig-spacing-small));\n  --ig-spacing-inline-medium: var(--ig-spacing-inline, var(--ig-spacing-medium));\n  --ig-spacing-inline-large: var(--ig-spacing-inline, var(--ig-spacing-large));\n  --ig-spacing-block-small: var(--ig-spacing-block, var(--ig-spacing-small));\n  --ig-spacing-block-medium: var(--ig-spacing-block, var(--ig-spacing-medium));\n  --ig-spacing-block-large: var(--ig-spacing-block, var(--ig-spacing-large));\n}\n```\n\n## Notes\n- spacing() is typically included once at the root scope/stylesheet.\n";
-export {
-  SPACING_MIXIN_DOC as default
-};

package/dist/mcp/knowledge/docs/layout/overview.md.js

@@ -1,4 +0,0 @@
-const LAYOUT_OVERVIEW_DOC = "# Layout scale overview\n\nIgnite UI components expose sizing, spacing, and roundness through CSS custom properties.\nYou can set them globally on :root or locally on a specific component selector.\n\n## Size\n--ig-size is the primary control. Components map it into --component-size internally:\n--component-size: var(--ig-size, <default-size-from-theme>).\n\nSize affects any styles that use sizable() or pad() functions.\n\nSuggested values:\n- 1 = small\n- 2 = medium (default in mosts components)\n- 3 = large\n- fractional values are NOT ALLOWED (0.75, 1.5)\n\n## Spacing\n--ig-spacing scales spacing used by pad(), pad-inline(), and pad-block().\n\nSuggested values:\n- 0 = no spacing\n- 1 = default\n- 2 = double\n- fractional values are ALLOWED (0.75, 1.5)\n\nYou can override inline or block independently:\n- --ig-spacing\n- --ig-spacing-inline\n- --ig-spacing-block\n\n## Roundness\n--ig-radius-factor scales border radius values when border-radius() is used.\n- 0 = minimum radius\n- 1 = maximum radius\n- values between 0 and 1 interpolate between min and max\n\n## Examples\n\n### CSS (global)\n```css\n:root {\n  --ig-size: 2;\n  --ig-spacing: 0.75;\n  --ig-radius-factor: 0.8;\n}\n```\n\n### CSS (component scope)\n```css\nigx-calendar,\nigc-calendar {\n  --ig-size: 1; // small calendar\n  --ig-spacing: 0.5; // tighter spacing in calendar 50% of default\n  --ig-radius-factor: 0.9; // more rounded calendar with radius closer to max\n}\n```\n\n### Sass notes\n- To react to --ig-size, component styles must include @include sizable() and --component-size.\n- To use pad(), pad-inline(), or pad-block(), include @include spacing() once.\n- border-radius() responds to --ig-radius-factor without extra mixins.\n";
-export {
-  LAYOUT_OVERVIEW_DOC as default
-};

package/dist/mcp/knowledge/docs/setup/platform.md.js

@@ -1,4 +0,0 @@
-const PLATFORM_SETUP_MARKDOWN = "# Platform Setup Guide\n\nThis document is an instruction resource for AI agents using the Ignite UI Theming MCP. It describes how to detect, configure, and work with target platforms. Follow these rules when helping a user set up theming in their project.\n\n---\n\n## Step 1: Always Detect First\n\n**ALWAYS** call `detect_platform` before generating any theme code. Do not assume a platform; do not skip detection even if the user mentions a framework by name — detection confirms the actual project setup and returns Sass configuration guidance.\n\n```\ndetect_platform({ packageJsonPath: \"./package.json\" })\n```\n\nThe result determines every subsequent tool call's `platform` parameter.\n\n---\n\n## Step 2: Interpret the Detection Result\n\n### High-confidence product detection\n\nWhen `confidence` is `\"high\"` and `platform` is one of `angular`, `webcomponents`, `react`, or `blazor`:\n\n- Use the returned `platform` value in all subsequent tool calls.\n- Use the `platformInfo.themingModule` value for Sass import guidance.\n- If `licensed` is `true` (Angular only), also pass `licensed: true` to theme generation tools.\n\n### Generic (standalone) mode\n\nWhen `platform` is `\"generic\"`:\n\n- No Ignite UI product framework was found. The project can still use `igniteui-theming` directly.\n- Use `platform: \"generic\"` in all subsequent tool calls.\n- The Sass import is `@use 'igniteui-theming' as *;`.\n\n**Tool eligibility in generic mode:**\n\n| Tool                          | Available | Notes                                  |\n| ----------------------------- | --------- | -------------------------------------- |\n| `create_palette`              | YES       | Full functionality                     |\n| `create_custom_palette`       | YES       | Full functionality                     |\n| `create_typography`           | YES       | Full functionality                     |\n| `create_elevations`           | YES       | Full functionality                     |\n| `create_theme`                | YES       | Full functionality                     |\n| `set_size`                    | YES       | Use `scope`, not `component`           |\n| `set_spacing`                 | YES       | Use `scope`, not `component`           |\n| `set_roundness`               | YES       | Use `scope`, not `component`           |\n| `get_color`                   | YES       | Full functionality                     |\n| `read_resource`               | YES       | Full functionality                     |\n| `create_component_theme`      | **NO**    | Requires Ignite UI component selectors |\n| `get_component_design_tokens` | **NO**    | Requires Ignite UI components          |\n\n**IMPORTANT:** For layout tools (`set_size`, `set_spacing`, `set_roundness`) in generic mode, do NOT use the `component` parameter — it resolves Ignite UI component selectors that don't exist in the project. Use `scope` with a custom CSS selector, or omit both for `:root` targeting.\n\n### Ambiguous detection\n\nWhen `ambiguous` is `true` and `platform` is `null`:\n\n- Multiple Ignite UI products were detected (e.g., both Angular and React packages).\n- Do NOT guess. Ask the user which platform to target.\n- Present the `alternatives` array from the result so the user can choose.\n\n### Null / error state\n\nWhen `platform` is `null` and `ambiguous` is not `true`:\n\n- Something went wrong (package.json unreadable, invalid structure).\n- Report the `reason` to the user and ask them to specify a platform manually.\n- Suggest `\"generic\"` if they don't use an Ignite UI product.\n\n---\n\n## Step 3: Configure Sass Load Paths\n\nIf the user will consume **Sass output** (not CSS), they need `node_modules` in their Sass compiler's load paths so that `@use 'igniteui-theming' as *;` resolves correctly.\n\nThe `detect_platform` response includes config-file signals. Use them to give the right guidance:\n\n### Angular (`angular.json` detected)\n\n```json\n// In angular.json → architect → build → options:\n\"stylePreprocessorOptions\": {\n  \"includePaths\": [\"node_modules\"]\n}\n```\n\n### Vite (`vite.config.*` detected)\n\n```js\n// In vite.config.ts/js:\nexport default defineConfig({\n  css: {\n    preprocessorOptions: {\n      scss: {\n        loadPaths: ['node_modules'],\n      },\n    },\n  },\n});\n```\n\n### Next.js (`next.config.*` detected)\n\n```js\n// In next.config.js/mjs/ts:\nmodule.exports = {\n  sassOptions: {\n    loadPaths: ['node_modules'],\n  },\n};\n```\n\n### Other / unknown build tools\n\nIf no recognizable config file was detected, instruct the user to add `node_modules` to their Sass compiler's `loadPaths`. Angular CLI is the exception — it uses `includePaths` in `angular.json`. Investigate the project's build configuration to find the right setting.\n\n### When load paths are NOT needed\n\n- **CSS output**: CSS output is compiled server-side by the MCP. No local Sass toolchain or load path configuration is required. The user can paste the CSS output directly.\n- **Angular with Ignite UI for Angular**: The `igniteui-angular/theming` module is already resolved by Angular's build system when the package is installed.\n\n---\n\n## Step 4: Handle the igniteui-theming Dependency\n\nCheck whether `igniteui-theming` (or a product package like `igniteui-angular`) is in the project's dependencies.\n\n### Package IS installed\n\n- Sass output will work once load paths are configured.\n- CSS output works regardless.\n\n### Package is NOT installed\n\n- **CSS output** still works — the MCP compiles it server-side. Recommend this path for quick results.\n- **Sass output** requires the package to be resolvable. The user must either:\n  - Run `npm install igniteui-theming` (or the product-specific package), OR\n  - Ensure the package is available via `loadPaths` from a parent `node_modules`.\n\nWhen in doubt, suggest CSS output first — it has zero local dependencies.\n\n---\n\n## Step 5: Recommended Workflow\n\nAfter detection and setup, follow this order for a complete theme:\n\n1. **`detect_platform`** — Determine platform and configuration needs.\n2. **`create_palette`** or **`create_custom_palette`** — Define the color system.\n   - Read `theming://guidance/colors/rules` first if unsure about surface/gray color choices.\n3. **`create_typography`** — Set up the type scale (optional but recommended).\n4. **`create_elevations`** — Configure shadows (optional).\n5. **`create_theme`** — Generate the complete theme that brings everything together.\n6. **Layout tools** — Use `set_size`, `set_spacing`, `set_roundness` if the user wants to customize layout tokens.\n7. **`create_component_theme`** — Customize individual component appearances (only for product platforms, NOT generic).\n\n### Output format decision\n\n- Offer **CSS output** when the user wants quick, dependency-free results or is working in a non-Sass environment.\n- Offer **Sass output** when the user has a Sass toolchain set up and wants the flexibility of Sass variables and functions.\n- When both are viable, mention both options and let the user choose.\n\n---\n\n## Platform-Specific Notes\n\n### Angular\n\n- Uses `igniteui-angular/theming` (free) or `@infragistics/igniteui-angular/theming` (licensed) (not `igniteui-theming` directly).\n- Licensed packages use `@infragistics/igniteui-angular/theming` — pass `licensed: true`.\n- Requires `core()` mixin before `theme()` mixin.\n- Typography requires the `ig-typography` CSS class on the root element.\n- Read `theming://platforms/angular` for full platform configuration and usage examples.\n\n### Web Components\n\n- Uses `igniteui-theming` directly.\n- Provides runtime theming via `defineComponents()` and `register()` APIs.\n- Read `theming://platforms/webcomponents` for configuration and runtime config.\n\n### React\n\n- Uses `igniteui-theming` directly (same as Web Components).\n- Read `theming://platforms/react` for configuration and usage examples.\n\n### Blazor\n\n- Uses `igniteui-theming` directly (same as Web Components).\n- Detection relies on `.csproj` files with IgniteUI.Blazor references.\n- Read `theming://platforms/blazor` for configuration and usage examples.\n\n### Generic (Standalone)\n\n- Uses `igniteui-theming` directly.\n- No Ignite UI components — all theme output applies globally via CSS custom properties.\n- Component-specific tools are not available.\n- Layout tools work only with `:root` or custom `scope` selectors.\n- Read `theming://platforms/generic` for presets available in this mode.\n\n### Preset imports for non-Angular platforms\n\nFor all non-Angular platforms (Web Components, React, Blazor, Generic), using preset variables such as `$material-type-scale`, `$indigo-type-scale`, `$material-elevations`, or `$indigo-elevations` requires additional `@use` imports beyond the base `@use 'igniteui-theming' as *;`:\n\n```scss\n// Base module (always required)\n@use 'igniteui-theming' as *;\n\n// Typography presets (required for $<designSystem>-type-scale variables)\n@use 'igniteui-theming/sass/typography/presets' as *;\n\n// Elevation presets (required for $material-elevations / $indigo-elevations)\n@use 'igniteui-theming/sass/elevations/presets' as *;\n```\n\nThe MCP tools (`create_typography`, `create_elevations`, `create_theme`) automatically include these imports in their generated Sass output. Angular is not affected — its `igniteui-angular/theming` module re-exports all presets.\n\n---\n\n## Related Resources\n\n| Resource            | URI                                 | When to read                       |\n| ------------------- | ----------------------------------- | ---------------------------------- |\n| Supported Platforms | `theming://platforms`               | To list all platforms and metadata |\n| Color Guidance      | `theming://guidance/colors`         | Before creating palettes           |\n| Color Rules         | `theming://guidance/colors/rules`   | For surface/gray color decisions   |\n| Spacing & Sizing    | `theming://docs/spacing-and-sizing` | Before using layout tools          |\n";
-export {
-  PLATFORM_SETUP_MARKDOWN as default
-};

package/dist/mcp/vite-env.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="vite/client" />
-
-/**
- * Module declaration for importing markdown files with ?raw suffix.
- * This enables: import content from './doc.md?raw'
- */
-declare module "*.md?raw" {
-	const content: string;
-	export default content;
-}
-
-/**
- * Fallback for direct .md imports (though we'll use ?raw explicitly).
- */
-declare module "*.md" {
-	const content: string;
-	export default content;
-}

package/index.js

@@ -1,5 +0,0 @@
-export {default as PaletteMultipliers} from './json/colors/meta/multipliers.json';
-export {default as PaletteMeta} from './json/colors/meta/palette.json';
-export {default as Palettes} from './json/colors/presets/palettes.json';
-export {default as Elevations} from './json/elevations/elevations.json';
-export {default as Typescales} from './json/typography/presets/typescales.json';