@wavemaker/foundation-css 11.15.5-rc.647638 → 11.15.5-rc.647771

package/cjs/foundation-css.cjs

@@ -670,7 +670,7 @@ const componentsList = {
   \********************************************************************************/
 (module, __unused_webpack_exports, __webpack_require__) {
 
-var map = {
+const map = {
 	"./accordion-pane/accordion-pane.json": [
 		"./src/tokens/mobile/components/accordion-pane/accordion-pane.json",
 		[
@@ -1042,7 +1042,7 @@ function webpackAsyncContext(req) {
 	try {
 		if(!__webpack_require__.o(map, req)) {
 			return Promise.resolve().then(() => {
-	var e = new Error("Cannot find module '" + req + "'");
+	const e = new Error("Cannot find module '" + req + "'");
 	e.code = 'MODULE_NOT_FOUND';
 	throw e;
 });
@@ -1051,7 +1051,7 @@ function webpackAsyncContext(req) {
 		return Promise.reject(err);
 	}
 
-	var ids = map[req], id = ids[0];
+	const ids = map[req], id = ids[0];
 	return __webpack_require__.e(ids[1][0]).then(() => (__webpack_require__.t(id, 3 | 16)));
 }
 webpackAsyncContext.keys = () => (Object.keys(map));
@@ -1066,7 +1066,7 @@ module.exports = webpackAsyncContext;
   \*****************************************************************************/
 (module, __unused_webpack_exports, __webpack_require__) {
 
-var map = {
+const map = {
 	"./accordion/accordion.json": [
 		"./src/tokens/web/components/accordion/accordion.json",
 		[
@@ -1414,7 +1414,7 @@ function webpackAsyncContext(req) {
 	try {
 		if(!__webpack_require__.o(map, req)) {
 			return Promise.resolve().then(() => {
-	var e = new Error("Cannot find module '" + req + "'");
+	const e = new Error("Cannot find module '" + req + "'");
 	e.code = 'MODULE_NOT_FOUND';
 	throw e;
 });
@@ -1423,7 +1423,7 @@ function webpackAsyncContext(req) {
 		return Promise.reject(err);
 	}
 
-	var ids = map[req], id = ids[0];
+	const ids = map[req], id = ids[0];
 	return __webpack_require__.e(ids[1][0]).then(() => (__webpack_require__.t(id, 3 | 16)));
 }
 webpackAsyncContext.keys = () => (Object.keys(map));
@@ -9100,17 +9100,17 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 	});
 /************************************************************************/
 /******/ 	// The module cache
-/******/ 	var __webpack_module_cache__ = {};
+/******/ 	const __webpack_module_cache__ = {};
 /******/ 	
 /******/ 	// The require function
 /******/ 	function __webpack_require__(moduleId) {
 /******/ 		// Check if module is in cache
-/******/ 		var cachedModule = __webpack_module_cache__[moduleId];
+/******/ 		const cachedModule = __webpack_module_cache__[moduleId];
 /******/ 		if (cachedModule !== undefined) {
 /******/ 			return cachedModule.exports;
 /******/ 		}
 /******/ 		// Create a new module (and put it into the cache)
-/******/ 		var module = __webpack_module_cache__[moduleId] = {
+/******/ 		const module = __webpack_module_cache__[moduleId] = {
 /******/ 			// no module.id needed
 /******/ 			// no module.loaded needed
 /******/ 			exports: {}
@@ -9119,7 +9119,7 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 		// Execute the module function
 /******/ 		if (!(moduleId in __webpack_modules__)) {
 /******/ 			delete __webpack_module_cache__[moduleId];
-/******/ 			var e = new Error("Cannot find module '" + moduleId + "'");
+/******/ 			const e = new Error("Cannot find module '" + moduleId + "'");
 /******/ 			e.code = 'MODULE_NOT_FOUND';
 /******/ 			throw e;
 /******/ 		}
@@ -9135,8 +9135,8 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /************************************************************************/
 /******/ 	/* webpack/runtime/create fake namespace object */
 /******/ 	(() => {
-/******/ 		var getProto = Object.getPrototypeOf ? (obj) => (Object.getPrototypeOf(obj)) : (obj) => (obj.__proto__);
-/******/ 		var leafPrototypes;
+/******/ 		const getProto = Object.getPrototypeOf;
+/******/ 		let leafPrototypes;
 /******/ 		// create a fake namespace object
 /******/ 		// mode & 1: value is a module id, require it
 /******/ 		// mode & 2: merge all properties of value into the ns
@@ -9150,9 +9150,9 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 				if((mode & 4) && value.__esModule) return value;
 /******/ 				if((mode & 16) && typeof value.then === 'function') return value;
 /******/ 			}
-/******/ 			var ns = Object.create(null);
+/******/ 			const ns = Object.create(null);
 /******/ 			__webpack_require__.r(ns);
-/******/ 			var def = {};
+/******/ 			const def = {};
 /******/ 			leafPrototypes = leafPrototypes || [null, getProto({}), getProto([]), getProto(getProto)];
 /******/ 			for(var current = mode & 2 && value; (typeof current == 'object' || typeof current == 'function') && !~leafPrototypes.indexOf(current); current = getProto(current)) {
 /******/ 				Object.getOwnPropertyNames(current).forEach((key) => (def[key] = () => (value[key])));
@@ -9164,56 +9164,44 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 	})();
 /******/ 	
 /******/ 	/* webpack/runtime/define property getters */
-/******/ 	(() => {
-/******/ 		// define getter functions for harmony exports
-/******/ 		__webpack_require__.d = (exports, definition) => {
-/******/ 			for(var key in definition) {
-/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
-/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
-/******/ 				}
+/******/ 	// define getter/value functions for harmony exports
+/******/ 	__webpack_require__.d = (exports, definition) => {
+/******/ 		for(var key in definition) {
+/******/ 			if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 				Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
 /******/ 			}
-/******/ 		};
-/******/ 	})();
+/******/ 		}
+/******/ 	};
 /******/ 	
 /******/ 	/* webpack/runtime/ensure chunk */
-/******/ 	(() => {
-/******/ 		__webpack_require__.f = {};
-/******/ 		// This file contains only the entry chunk.
-/******/ 		// The chunk loading function for additional chunks
-/******/ 		__webpack_require__.e = (chunkId) => {
-/******/ 			return Promise.all(Object.keys(__webpack_require__.f).reduce((promises, key) => {
-/******/ 				__webpack_require__.f[key](chunkId, promises);
-/******/ 				return promises;
-/******/ 			}, []));
-/******/ 		};
-/******/ 	})();
+/******/ 	__webpack_require__.f = {};
+/******/ 	// This file contains only the entry chunk.
+/******/ 	// The chunk loading function for additional chunks
+/******/ 	__webpack_require__.e = (chunkId) => {
+/******/ 		const promises = [];
+/******/ 		__webpack_require__.f.j(chunkId, promises);
+/******/ 		return Promise.all(promises);
+/******/ 	};
 /******/ 	
 /******/ 	/* webpack/runtime/get javascript chunk filename */
-/******/ 	(() => {
-/******/ 		// This function allow to reference async chunks
-/******/ 		__webpack_require__.u = (chunkId) => {
-/******/ 			// return url for filenames based on template
-/******/ 			return "" + chunkId + ".foundation-css.cjs";
-/******/ 		};
-/******/ 	})();
+/******/ 	// This function allow to reference async chunks
+/******/ 	__webpack_require__.u = (chunkId) => (chunkId + ".foundation-css.cjs");
 /******/ 	
 /******/ 	/* webpack/runtime/hasOwnProperty shorthand */
-/******/ 	(() => {
-/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
-/******/ 	})();
+/******/ 	__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop));
 /******/ 	
 /******/ 	/* webpack/runtime/load script */
 /******/ 	(() => {
-/******/ 		var inProgress = {};
-/******/ 		var dataWebpackPrefix = "@wavemaker/foundation-css:";
+/******/ 		const inProgress = {};
+/******/ 		const dataWebpackPrefix = "@wavemaker/foundation-css:";
 /******/ 		// loadScript function to load a script via script tag
 /******/ 		__webpack_require__.l = (url, done, key, chunkId) => {
 /******/ 			if(inProgress[url]) { inProgress[url].push(done); return; }
-/******/ 			var script, needAttach;
+/******/ 			let script, needAttach;
 /******/ 			if(key !== undefined) {
-/******/ 				var scripts = document.getElementsByTagName("script");
+/******/ 				const scripts = document.getElementsByTagName("script");
 /******/ 				for(var i = 0; i < scripts.length; i++) {
-/******/ 					var s = scripts[i];
+/******/ 					const s = scripts[i];
 /******/ 					if(s.getAttribute("src") == url || s.getAttribute("data-webpack") == dataWebpackPrefix + key) { script = s; break; }
 /******/ 				}
 /******/ 			}
@@ -9230,17 +9218,17 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 				script.src = url;
 /******/ 			}
 /******/ 			inProgress[url] = [done];
-/******/ 			var onScriptComplete = (prev, event) => {
+/******/ 			const onScriptComplete = (prev, event) => {
 /******/ 				// avoid mem leaks in IE.
 /******/ 				script.onerror = script.onload = null;
 /******/ 				clearTimeout(timeout);
-/******/ 				var doneFns = inProgress[url];
+/******/ 				const doneFns = inProgress[url];
 /******/ 				delete inProgress[url];
-/******/ 				script.parentNode && script.parentNode.removeChild(script);
-/******/ 				doneFns && doneFns.forEach((fn) => (fn(event)));
+/******/ 				script.parentNode?.removeChild(script);
+/******/ 				doneFns?.forEach((fn) => (fn(event)));
 /******/ 				if(prev) return prev(event);
 /******/ 			}
-/******/ 			var timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);
+/******/ 			const timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);
 /******/ 			script.onerror = onScriptComplete.bind(null, script.onerror);
 /******/ 			script.onload = onScriptComplete.bind(null, script.onload);
 /******/ 			needAttach && document.head.appendChild(script);
@@ -9248,20 +9236,14 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 	})();
 /******/ 	
 /******/ 	/* webpack/runtime/make namespace object */
-/******/ 	(() => {
-/******/ 		// define __esModule on exports
-/******/ 		__webpack_require__.r = (exports) => {
-/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
-/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-/******/ 			}
-/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
-/******/ 		};
-/******/ 	})();
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = (exports) => {
+/******/ 		Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
 /******/ 	
 /******/ 	/* webpack/runtime/publicPath */
-/******/ 	(() => {
-/******/ 		__webpack_require__.p = "/";
-/******/ 	})();
+/******/ 	__webpack_require__.p = "/";
 /******/ 	
 /******/ 	/* webpack/runtime/jsonp chunk loading */
 /******/ 	(() => {
@@ -9270,13 +9252,13 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 		// object to store loaded and loading chunks
 /******/ 		// undefined = chunk not loaded, null = chunk preloaded/prefetched
 /******/ 		// [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
-/******/ 		var installedChunks = {
+/******/ 		const installedChunks = {
 /******/ 			"main": 0
 /******/ 		};
 /******/ 		
 /******/ 		__webpack_require__.f.j = (chunkId, promises) => {
 /******/ 				// JSONP chunk loading for javascript
-/******/ 				var installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;
+/******/ 				let installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;
 /******/ 				if(installedChunkData !== 0) { // 0 means "already installed".
 /******/ 		
 /******/ 					// a Promise means "currently loading".
@@ -9285,29 +9267,28 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 					} else {
 /******/ 						if(true) { // all chunks have JS
 /******/ 							// setup Promise in chunk cache
-/******/ 							var promise = new Promise((resolve, reject) => (installedChunkData = installedChunks[chunkId] = [resolve, reject]));
+/******/ 							const promise = new Promise((resolve, reject) => (installedChunkData = installedChunks[chunkId] = [resolve, reject]));
 /******/ 							promises.push(installedChunkData[2] = promise);
 /******/ 		
-/******/ 							// start chunk loading
-/******/ 							var url = __webpack_require__.p + __webpack_require__.u(chunkId);
 /******/ 							// create error before stack unwound to get useful stacktrace later
-/******/ 							var error = new Error();
-/******/ 							var loadingEnded = (event) => {
+/******/ 							const error = new Error();
+/******/ 							const loadingEnded = (event) => {
 /******/ 								if(__webpack_require__.o(installedChunks, chunkId)) {
 /******/ 									installedChunkData = installedChunks[chunkId];
 /******/ 									if(installedChunkData !== 0) installedChunks[chunkId] = undefined;
 /******/ 									if(installedChunkData) {
-/******/ 										var errorType = event && (event.type === 'load' ? 'missing' : event.type);
-/******/ 										var realSrc = event && event.target && event.target.src;
+/******/ 										const errorType = event && (event.type === 'load' ? 'missing' : event.type);
+/******/ 										const realSrc = event && event.target && event.target.src;
 /******/ 										error.message = 'Loading chunk ' + chunkId + ' failed.\n(' + errorType + ': ' + realSrc + ')';
 /******/ 										error.name = 'ChunkLoadError';
 /******/ 										error.type = errorType;
 /******/ 										error.request = realSrc;
+/******/ 										error.event = event;
 /******/ 										installedChunkData[1](error);
 /******/ 									}
 /******/ 								}
 /******/ 							};
-/******/ 							__webpack_require__.l(url, loadingEnded, "chunk-" + chunkId, chunkId);
+/******/ 							__webpack_require__.l(__webpack_require__.p + __webpack_require__.u(chunkId), loadingEnded, "chunk-" + chunkId, chunkId);
 /******/ 						}
 /******/ 					}
 /******/ 				}
@@ -9324,8 +9305,8 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 		// no on chunks loaded
 /******/ 		
 /******/ 		// install a JSONP callback for chunk loading
-/******/ 		var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
-/******/ 			var [chunkIds, moreModules, runtime] = data;
+/******/ 		const webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
+/******/ 			let [chunkIds, moreModules, runtime] = data;
 /******/ 			// add "moreModules" to the modules object,
 /******/ 			// then flag all "chunkIds" as loaded and fire callback
 /******/ 			var moduleId, chunkId, i = 0;
@@ -9348,13 +9329,13 @@ module.exports = /*#__PURE__*/JSON.parse('{"space":{"0":{"value":"{space.rule.va
 /******/ 		
 /******/ 		}
 /******/ 		
-/******/ 		var chunkLoadingGlobal = this["webpackChunk_wavemaker_foundation_css"] = this["webpackChunk_wavemaker_foundation_css"] || [];
+/******/ 		const chunkLoadingGlobal = this["webpackChunk_wavemaker_foundation_css"] = this["webpackChunk_wavemaker_foundation_css"] || [];
 /******/ 		chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
 /******/ 		chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
 /******/ 	})();
 /******/ 	
 /************************************************************************/
-var __webpack_exports__ = {};
+let __webpack_exports__ = {};
 // This entry needs to be wrapped in an IIFE because it needs to be in strict mode.
 (() => {
 "use strict";
@@ -9428,7 +9409,7 @@ const getComponentsList = (platform) => {
 
 })();
 
-var __webpack_export_target__ = exports;
+const __webpack_export_target__ = exports;
 for(var __webpack_i__ in __webpack_exports__) __webpack_export_target__[__webpack_i__] = __webpack_exports__[__webpack_i__];
 if(__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, "__esModule", { value: true });
 /******/ })()

package/cjs/src_tokens_mobile_components_chips_chips_json.foundation-css.cjs

@@ -7,7 +7,7 @@
   \*******************************************************/
 (module) {
 
-module.exports = /*#__PURE__*/JSON.parse('{"chips":{"meta":{"mapping":{"selector":{"mobile":".app-chips"},"states":{"disabled":{"selector":{"mobile":"-disabled"}},"active":{"selector":{"mobile":"-active-item, .app-chips-active-item-text"}}}}},"mapping":{"border":{"width":{"value":"{border.width.base.value}","type":"radius","attributes":{"subtype":"border-width","description":"Controls the border width of the main chips container (the wrapper that holds all chips and the input field). This creates the outline around the entire chips component.<br>CSS variable: --wm-chips-border-width"}}},"background-color":{"value":"transparent","type":"color","attributes":{"subtype":"color","description":"Sets the background color of individual chip items (the small pill-shaped elements). This affects the background color that appears behind each chip, not the container.<br>CSS variable: --wm-chips-background-color"}},"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the text color of individual chip items (the small pill-shaped elements). This affects the color of the text content inside each chip, not the container.<br>CSS variable: --wm-chips-color"}},"opacity":{"value":"1","type":"radius","attributes":{"subtype":"opacity","description":"Controls the overall transparency of the chips component. When set to 1, the component is fully opaque. Lower values make the entire component more transparent.<br>CSS variable: --wm-chips-opacity"}},"pointer-events":{"value":"auto","type":"radius","attributes":{"subtype":"pointer-events","description":"Controls whether the chips component can receive mouse/touch interactions. Acceptable values: all (fully interactive), none (not clickable), auto (browser default).<br>CSS variable: --wm-chips-pointer-events"}},"shadow":{"value":"none","type":"radius","attributes":{"subtype":"elevation","description":"Controls the drop shadow effect around the main chips container. This creates a subtle elevation effect that makes the chips component appear to float above the background.<br>CSS variable: --wm-chips-shadow"}},"list":{"gap":{"value":"{space.3.value}","type":"space","attributes":{"subtype":"space","description":"Controls the horizontal spacing between individual chip items (the small pill-shaped elements) within the chips container. This creates visual separation between each chip so users can easily distinguish between them.<br>CSS variable: --wm-chips-list-gap"}},"padding":{"value":"{space.2.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding (all sides) inside the chips container (the wrapper that holds all chips and the input field). This creates breathing room between the container border and the chips/input inside. Acceptable units: px.<br>CSS variable: --wm-chips-list-padding"}},"background-color":{"value":"transparent","type":"color","attributes":{"subtype":"color","description":"Sets the background color of the chips container (the wrapper that holds all chips and the input field). When set to \'transparent\', the container has no background color, making it transparent.<br>CSS variable: --wm-chips-list-background-color"}},"border":{"color":{"value":"{color.transparent.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the border around the chips container (the wrapper that holds all chips and the input field). This determines the color of the outline that defines the container shape.<br>CSS variable: --wm-chips-list-border-color"}},"radius":{"value":"{radius.sm.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of the chips container (the wrapper that holds all chips and the input field). This makes the container appear with rounded corners instead of sharp edges.<br>CSS variable: --wm-chips-list-border-radius"}},"style":{"value":"{border.style.base.value}","type":"style","attributes":{"subtype":"border-style","description":"Controls the border style of the chips container. Acceptable values: solid (continuous line), dashed (dotted line), dotted (small dots), none (no border).<br>CSS variable: --wm-chips-list-border-style"}},"width":{"value":"{border.width.base.value}","type":"space","attributes":{"subtype":"border-width","description":"Controls the thickness of the border around the chips container (the wrapper that holds all chips and the input field). This creates the outline that defines the container shape.<br>CSS variable: --wm-chips-list-border-width"}}},"place":{"holder":{"color":{"value":"{color.outline.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of placeholder text in the input field where users type to add new chips. This determines what color the placeholder text appears in.<br>CSS variable: --wm-chips-list-place-holder-color"}}}},"height":{"value":"70px","type":"space","attributes":{"subtype":"space","description":"Controls the minimum height of the chips container (the wrapper that holds all chips and the input field). This ensures the container has a consistent height even when empty or with few chips.<br>CSS variable: --wm-chips-list-height"}}},"input":{"padding":{"value":"{space.2.value} {space.3.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding (top/bottom, left/right) inside the input field where users type to add new chips. This creates breathing room around the input text. Acceptable units: px.<br>CSS variable: --wm-chips-input-padding"}}},"item":{"height":{"value":"32px","type":"space","attributes":{"subtype":"space","description":"Controls the height of individual chip items (the small pill-shaped elements). This determines how tall each chip appears visually. Acceptable units: px.<br>CSS variable: --wm-chips-item-height"}},"padding":{"value":"{space.1.value} {space.3.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding (top/bottom, left/right) of each chip item. This creates breathing room between the chip text/icon and the chip border. Acceptable units: px.<br>CSS variable: --wm-chips-item-padding"}},"gap":{"value":"{space.2.value}","type":"space","attributes":{"subtype":"space","description":"Controls the spacing between elements within individual chip items (like between text and icons, or between text and the remove button). This creates visual separation between different parts of each chip.<br>CSS variable: --wm-chips-item-gap"}},"icon":{"color":{"value":"{color.outline.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of icons that appear inside individual chip items (like remove buttons or action icons). This determines what color the icons appear in.<br>CSS variable: --wm-chips-item-icon-color"}},"size":{"value":"{icon.size.sm.value}","type":"space","attributes":{"subtype":"icon-size","description":"Controls the size of icons that appear inside individual chip items (like remove buttons or action icons). This affects how large the icons appear within each chip.<br>CSS variable: --wm-chips-item-icon-size"}},"gap":{"value":"{space.1.value}","type":"space","attributes":{"subtype":"space","description":"Controls the spacing between icons and text content within individual chip items. This creates visual separation between the icon and text.<br>CSS variable: --wm-chips-item-icon-gap"}}},"border":{"style":{"value":"{border.style.base.value}","type":"radius","attributes":{"subtype":"border-style","description":"Controls the border style of individual chip items. Acceptable values: solid (continuous line), dashed (dotted line), dotted (small dots), none (no border).<br>CSS variable: --wm-chips-item-border-style"}},"color":{"value":"{color.outline.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the border around individual chip items (the small pill-shaped elements). This determines the color of the outline that defines each chip\'s shape.<br>CSS variable: --wm-chips-item-border-color"}},"radius":{"@":{"value":"{radius.sm.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of individual chip items (the small pill-shaped elements). This makes each chip appear with rounded corners instead of sharp edges.<br>CSS variable: --wm-chips-item-border-radius"}}}},"font-family":{"value":"{label.large.font-family.value}","type":"font","attributes":{"subtype":"font-family","description":"Sets the font family (typeface) for the text content inside individual chip items (the small pill-shaped elements). This determines the visual style of the text that appears within each chip.<br>CSS variable: --wm-chips-item-font-family"}},"font-weight":{"value":"{label.large.font-weight.value}","type":"font","attributes":{"subtype":"font-weight","description":"Controls the thickness/boldness of the text content inside individual chip items. Acceptable values: normal, bold, 100-900. This affects how prominent the text appears within each chip.<br>CSS variable: --wm-chips-item-font-weight"}},"font-size":{"value":"{label.large.font-size.value}","type":"font","attributes":{"subtype":"font-size","description":"Controls the size of the text content inside individual chip items (the small pill-shaped elements). This determines how large the text appears within each chip.<br>CSS variable: --wm-chips-item-font-size"}},"line-height":{"value":"{label.large.line-height.value}","type":"font","attributes":{"subtype":"line-height","description":"Controls the vertical spacing between lines of text inside individual chip items. This is important when chip text wraps to multiple lines, ensuring proper readability.<br>CSS variable: --wm-chips-item-line-height"}},"letter-spacing":{"value":"{label.large.letter-spacing.value}","type":"font","attributes":{"subtype":"letter-spacing","description":"Controls the horizontal spacing between individual characters in the text content inside chip items. Positive values spread letters apart, negative values bring them closer together.<br>CSS variable: --wm-chips-item-letter-spacing"}},"avatar":{"size":{"value":"{icon.size.@.value}","type":"space","attributes":{"subtype":"icon-size","description":"Controls the size of user avatars that appear inside chip items (the small pill-shaped elements). This determines how large profile pictures or user images appear within each chip.<br>CSS variable: --wm-chips-item-avatar-size"}},"radius":{"value":"{radius.pill.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of user avatars inside chip items. When set to pill, avatars appear as perfect circles. Other values create rounded rectangles.<br>CSS variable: --wm-chips-item-avatar-radius"}}}},"states":{"disabled":{"opacity":{"value":"0.38","type":"radius","attributes":{"subtype":"opacity","description":"Controls the overall transparency of the chips component when it is disabled. When set to 0.38, the component appears semi-transparent to indicate it cannot be interacted with.<br>CSS variable: --wm-chips-disabled-opacity"}},"pointer-events":{"value":"none","type":"radius","attributes":{"subtype":"pointer-events","description":"Prevents mouse/touch interactions with the chips component when it is disabled. When set to \'none\', the component cannot receive any pointer events, making it non-interactive.<br>CSS variable: --wm-chips-disabled-pointer-events"}}},"active":{"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the text color of individual chip items when they are in an active/selected state. This determines what color the chip text appears in when a chip is active.<br>CSS variable: --wm-chips-active-color"}},"background-color":{"value":"{color.secondary.container.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the background color of individual chip items when they are in an active/selected state. This determines what color appears behind chips when they are active.<br>CSS variable: --wm-chips-active-background-color"}},"item":{"border":{"color":{"value":"{color.secondary.container.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the border around individual chip items when they are in an active/selected state. This determines what color the border appears in when a chip is active.<br>CSS variable: --wm-chips-active-item-border-color"}}}}}}},"appearances":{"filled":{"mapping":{"border":{"width":{"value":"0","type":"radius"}}},"variantGroups":{"status":{"default":{"background-color":{"value":"{color.surface.@.value}","type":"color"},"color":{"value":"{color.on-surface.@.value}","type":"color"}},"primary":{"background-color":{"value":"{color.primary.@.value}","type":"color"},"color":{"value":"{color.on-primary.@.value}","type":"color"}},"secondary":{"background-color":{"value":"{color.secondary.@.value}","type":"color"},"color":{"value":"{color.on-secondary.@.value}","type":"color"}},"tertiary":{"background-color":{"value":"{color.tertiary.@.value}","type":"color"},"color":{"value":"{color.on-tertiary.@.value}","type":"color"}}}}},"elevated":{"mapping":{"border":{"width":{"value":"0","type":"radius"}},"shadow":{"value":"{elevation.shadow.1.value}","type":"radius"}}}}}}');
+module.exports = /*#__PURE__*/JSON.parse('{"chips":{"meta":{"mapping":{"selector":{"mobile":".app-chips"},"states":{"disabled":{"selector":{"mobile":"-disabled"}},"active":{"selector":{"mobile":"-active-item, .app-chips-active-item-text, .app-chips-active-left-badge, .app-chips-active-right-badge, .app-chips-active-left-icon, .app-chips-active-right-icon"}}}}},"mapping":{"border":{"width":{"value":"{border.width.base.value}","type":"radius","attributes":{"subtype":"border-width","description":"Controls the border width of the main chips container (the wrapper that holds all chips and the input field). This creates the outline around the entire chips component.<br>CSS variable: --wm-chips-border-width"}}},"background-color":{"value":"transparent","type":"color","attributes":{"subtype":"color","description":"Sets the background color of individual chip items (the small pill-shaped elements). This affects the background color that appears behind each chip, not the container.<br>CSS variable: --wm-chips-background-color"}},"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the text color of individual chip items (the small pill-shaped elements). This affects the color of the text content inside each chip, not the container.<br>CSS variable: --wm-chips-color"}},"opacity":{"value":"1","type":"radius","attributes":{"subtype":"opacity","description":"Controls the overall transparency of the chips component. When set to 1, the component is fully opaque. Lower values make the entire component more transparent.<br>CSS variable: --wm-chips-opacity"}},"pointer-events":{"value":"auto","type":"radius","attributes":{"subtype":"pointer-events","description":"Controls whether the chips component can receive mouse/touch interactions. Acceptable values: all (fully interactive), none (not clickable), auto (browser default).<br>CSS variable: --wm-chips-pointer-events"}},"shadow":{"value":"none","type":"radius","attributes":{"subtype":"elevation","description":"Controls the drop shadow effect around the main chips container. This creates a subtle elevation effect that makes the chips component appear to float above the background.<br>CSS variable: --wm-chips-shadow"}},"list":{"gap":{"value":"{space.3.value}","type":"space","attributes":{"subtype":"space","description":"Controls the horizontal spacing between individual chip items (the small pill-shaped elements) within the chips container. This creates visual separation between each chip so users can easily distinguish between them.<br>CSS variable: --wm-chips-list-gap"}},"padding":{"value":"{space.2.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding (all sides) inside the chips container (the wrapper that holds all chips and the input field). This creates breathing room between the container border and the chips/input inside. Acceptable units: px.<br>CSS variable: --wm-chips-list-padding"}},"background-color":{"value":"transparent","type":"color","attributes":{"subtype":"color","description":"Sets the background color of the chips container (the wrapper that holds all chips and the input field). When set to \'transparent\', the container has no background color, making it transparent.<br>CSS variable: --wm-chips-list-background-color"}},"border":{"color":{"value":"{color.transparent.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the border around the chips container (the wrapper that holds all chips and the input field). This determines the color of the outline that defines the container shape.<br>CSS variable: --wm-chips-list-border-color"}},"radius":{"value":"{radius.sm.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of the chips container (the wrapper that holds all chips and the input field). This makes the container appear with rounded corners instead of sharp edges.<br>CSS variable: --wm-chips-list-border-radius"}},"style":{"value":"{border.style.base.value}","type":"radius","attributes":{"subtype":"border-style","description":"Controls the border style of the chips container. Acceptable values: solid (continuous line), dashed (dotted line), dotted (small dots), none (no border).<br>CSS variable: --wm-chips-list-border-style"}},"width":{"value":"{border.width.base.value}","type":"space","attributes":{"subtype":"border-width","description":"Controls the thickness of the border around the chips container (the wrapper that holds all chips and the input field). This creates the outline that defines the container shape.<br>CSS variable: --wm-chips-list-border-width"}}},"place":{"holder":{"color":{"value":"{color.outline.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of placeholder text in the input field where users type to add new chips. This determines what color the placeholder text appears in.<br>CSS variable: --wm-chips-list-place-holder-color"}}}},"height":{"value":"70px","type":"space","attributes":{"subtype":"space","description":"Controls the minimum height of the chips container (the wrapper that holds all chips and the input field). This ensures the container has a consistent height even when empty or with few chips.<br>CSS variable: --wm-chips-list-height"}}},"input":{"padding":{"value":"{space.2.value} {space.3.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding (top/bottom, left/right) inside the input field where users type to add new chips. This creates breathing room around the input text. Acceptable units: px.<br>CSS variable: --wm-chips-input-padding"}}},"item":{"text":{"padding":{"value":"0px","type":"space","attributes":{"subtype":"space","description":"Controls the padding of chip item label text (.app-chips-item-text).<br>CSS variable: --wm-chips-item-text-padding"}}},"height":{"value":"32px","type":"space","attributes":{"subtype":"space","description":"Controls the height of individual chip items (the small pill-shaped elements). This determines how tall each chip appears visually. Acceptable units: px.<br>CSS variable: --wm-chips-item-height"}},"padding":{"value":"{space.1.value} {space.3.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding (top/bottom, left/right) of each chip item. This creates breathing room between the chip text/icon and the chip border. Acceptable units: px.<br>CSS variable: --wm-chips-item-padding"}},"gap":{"value":"{space.2.value}","type":"space","attributes":{"subtype":"space","description":"Controls the spacing between elements within individual chip items (like between text and icons, or between text and the remove button). This creates visual separation between different parts of each chip.<br>CSS variable: --wm-chips-item-gap"}},"icon":{"color":{"value":"{color.outline.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of icons that appear inside individual chip items (like remove buttons or action icons). This determines what color the icons appear in.<br>CSS variable: --wm-chips-item-icon-color"}},"size":{"value":"{icon.size.sm.value}","type":"space","attributes":{"subtype":"icon-size","description":"Controls the size of icons that appear inside individual chip items (like remove buttons or action icons). This affects how large the icons appear within each chip.<br>CSS variable: --wm-chips-item-icon-size"}},"gap":{"value":"{space.1.value}","type":"space","attributes":{"subtype":"space","description":"Controls the spacing between icons and text content within individual chip items. This creates visual separation between the icon and text.<br>CSS variable: --wm-chips-item-icon-gap"}}},"border":{"style":{"value":"{border.style.base.value}","type":"radius","attributes":{"subtype":"border-style","description":"Controls the border style of individual chip items. Acceptable values: solid (continuous line), dashed (dotted line), dotted (small dots), none (no border).<br>CSS variable: --wm-chips-item-border-style"}},"color":{"value":"{color.outline.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the border around individual chip items (the small pill-shaped elements). This determines the color of the outline that defines each chip\'s shape.<br>CSS variable: --wm-chips-item-border-color"}},"radius":{"@":{"value":"{radius.sm.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of individual chip items (the small pill-shaped elements). This makes each chip appear with rounded corners instead of sharp edges.<br>CSS variable: --wm-chips-item-border-radius"}}}},"font-family":{"value":"{label.large.font-family.value}","type":"font","attributes":{"subtype":"font-family","description":"Sets the font family (typeface) for the text content inside individual chip items (the small pill-shaped elements). This determines the visual style of the text that appears within each chip.<br>CSS variable: --wm-chips-item-font-family"}},"font-weight":{"value":"{label.large.font-weight.value}","type":"font","attributes":{"subtype":"font-weight","description":"Controls the thickness/boldness of the text content inside individual chip items. Acceptable values: normal, bold, 100-900. This affects how prominent the text appears within each chip.<br>CSS variable: --wm-chips-item-font-weight"}},"font-size":{"value":"{label.large.font-size.value}","type":"font","attributes":{"subtype":"font-size","description":"Controls the size of the text content inside individual chip items (the small pill-shaped elements). This determines how large the text appears within each chip.<br>CSS variable: --wm-chips-item-font-size"}},"line-height":{"value":"{label.large.line-height.value}","type":"font","attributes":{"subtype":"line-height","description":"Controls the vertical spacing between lines of text inside individual chip items. This is important when chip text wraps to multiple lines, ensuring proper readability.<br>CSS variable: --wm-chips-item-line-height"}},"letter-spacing":{"value":"{label.large.letter-spacing.value}","type":"font","attributes":{"subtype":"letter-spacing","description":"Controls the horizontal spacing between individual characters in the text content inside chip items. Positive values spread letters apart, negative values bring them closer together.<br>CSS variable: --wm-chips-item-letter-spacing"}},"avatar":{"size":{"value":"{icon.size.@.value}","type":"space","attributes":{"subtype":"icon-size","description":"Controls the size of user avatars that appear inside chip items (the small pill-shaped elements). This determines how large profile pictures or user images appear within each chip.<br>CSS variable: --wm-chips-item-avatar-size"}},"radius":{"value":"{radius.pill.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of user avatars inside chip items. When set to pill, avatars appear as perfect circles. Other values create rounded rectangles.<br>CSS variable: --wm-chips-item-avatar-radius"}}}},"left-icon":{"padding":{"value":"{space.0.value} 2px {space.0.value} {space.0.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding of the left icon on chip items (.app-chips-left-icon, .app-chips-active-left-icon).<br>CSS variable: --wm-chips-left-icon-padding"}},"color":{"value":"{color.on-surface.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the left icon on chip items (.app-chips-left-icon, .app-chips-active-left-icon).<br>CSS variable: --wm-chips-left-icon-color"}}},"right-icon":{"color":{"value":"{color.on-surface.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the right icon on chip items (.app-chips-right-icon, .app-chips-active-right-icon).<br>CSS variable: --wm-chips-right-icon-color"}}},"left-badge":{"text":{"color":{"value":"{color.on-surface.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the text color of the left badge on chip items (.app-chips-left-badge, .app-chips-active-left-badge).<br>CSS variable: --wm-chips-left-badge-text-color"}}}},"right-badge":{"text":{"color":{"value":"{color.on-surface.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the text color of the right badge on chip items (.app-chips-right-badge, .app-chips-active-right-badge).<br>CSS variable: --wm-chips-right-badge-text-color"}},"margin-top":{"value":"0px","type":"space","attributes":{"subtype":"space","description":"Controls the top margin of the right badge text on chip items (.app-chips-right-badge, .app-chips-active-right-badge).<br>CSS variable: --wm-chips-right-badge-text-margin-top"}}}},"states":{"disabled":{"opacity":{"value":"0.38","type":"radius","attributes":{"subtype":"opacity","description":"Controls the overall transparency of the chips component when it is disabled. When set to 0.38, the component appears semi-transparent to indicate it cannot be interacted with.<br>CSS variable: --wm-chips-disabled-opacity"}},"pointer-events":{"value":"none","type":"radius","attributes":{"subtype":"pointer-events","description":"Prevents mouse/touch interactions with the chips component when it is disabled. When set to \'none\', the component cannot receive any pointer events, making it non-interactive.<br>CSS variable: --wm-chips-disabled-pointer-events"}}},"active":{"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the text color of individual chip items when they are in an active/selected state. This determines what color the chip text appears in when a chip is active.<br>CSS variable: --wm-chips-active-color"}},"background-color":{"value":"{color.secondary.container.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the background color of individual chip items when they are in an active/selected state. This determines what color appears behind chips when they are active.<br>CSS variable: --wm-chips-active-background-color"}},"item":{"border":{"color":{"value":"{color.secondary.container.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the border around individual chip items when they are in an active/selected state. This determines what color the border appears in when a chip is active.<br>CSS variable: --wm-chips-active-item-border-color"}}}}}}},"appearances":{"filled":{"mapping":{"border":{"width":{"value":"0","type":"radius"}}},"variantGroups":{"status":{"default":{"background-color":{"value":"{color.surface.@.value}","type":"color"},"color":{"value":"{color.on-surface.@.value}","type":"color"}},"primary":{"background-color":{"value":"{color.primary.@.value}","type":"color"},"color":{"value":"{color.on-primary.@.value}","type":"color"}},"secondary":{"background-color":{"value":"{color.secondary.@.value}","type":"color"},"color":{"value":"{color.on-secondary.@.value}","type":"color"}},"tertiary":{"background-color":{"value":"{color.tertiary.@.value}","type":"color"},"color":{"value":"{color.on-tertiary.@.value}","type":"color"}}}}},"elevated":{"mapping":{"border":{"width":{"value":"0","type":"radius"}},"shadow":{"value":"{elevation.shadow.1.value}","type":"radius"}}}}}}');
 
 /***/ }
 

package/cjs/src_tokens_mobile_components_dropdown-menu_dropdown-menu_json.foundation-css.cjs

@@ -7,7 +7,7 @@
   \***********************************************************************/
 (module) {
 
-module.exports = /*#__PURE__*/JSON.parse('{"dropdown":{"mapping":{"menu":{"background":{"value":"transparent","type":"color","attributes":{"subtype":"color","description":"Sets the background color of dropdown menus (lists of options that appear when users click on a button or link). This is the main background color that appears behind the dropdown menu items.<br>CSS variable: --wm-dropdown-menu-background"}},"padding":{"type":"space","value":"{space.2.value} {space.0.value}","attributes":{"subtype":"space","description":"Controls the padding inside dropdown menu containers (top/bottom, left/right). Acceptable units: px.<br>CSS variable: --wm-dropdown-menu-padding"}},"color":{"type":"color","value":"{color.on-surface.variant.@.value}","attributes":{"subtype":"color","description":"Sets the text color of dropdown menu triggers (the button or link that opens the dropdown). This determines what color the trigger text appears in.<br>CSS variable: --wm-dropdown-menu-color"}},"text":{"decoration":{"type":"radius","value":"none","attributes":{"subtype":"text-decoration","description":"Controls the text decoration of dropdown menu triggers (underline, overline, line-through, or none). When set to \'none\', no decoration is applied to the trigger text.<br>CSS variable: --wm-dropdown-menu-text-decoration"}},"font-weight":{"type":"font","value":"{font.weight.700.value}","attributes":{"subtype":"font-weight","description":"Controls how thick or bold the dropdown menu trigger text appears. When set to 700, the trigger text appears bold to emphasize the dropdown button.<br>CSS variable: --wm-dropdown-menu-text-font-weight"}},"font-size":{"type":"font","value":"{body.large.font-size.value}","attributes":{"subtype":"font-size","description":"Controls the font size of dropdown menu trigger text.<br>CSS variable: --wm-dropdown-menu-text-font-size"}},"padding":{"type":"space","value":"{space.0.value} {space.3.value} {space.0.value} {space.2.value}","attributes":{"subtype":"space","description":"Controls the padding of dropdown menu trigger text (top, right, bottom, left). Acceptable units: px.<br>CSS variable: --wm-dropdown-menu-text-padding"}}},"content":{"width":{"value":"220px","type":"space","attributes":{"subtype":"space","description":"Controls how wide dropdown menu content appears (the container that holds the dropdown menu items). This determines the horizontal size of the dropdown menu container.<br>CSS variable: --wm-dropdown-menu-content-width"}},"border":{"radius":{"value":"{radius.xs.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of dropdown menu content. This makes the dropdown appear with slightly rounded corners for a softer appearance.<br>CSS variable: --wm-dropdown-menu-content-border-radius"}},"width":{"value":"{border.width.0.value}","type":"border","attributes":{"subtype":"border-width","description":"Controls the border width of dropdown menu content.<br>CSS variable: --wm-dropdown-menu-content-border-width"}},"style":{"value":"{border.style.solid.value}","type":"radius","attributes":{"subtype":"border-style","description":"Controls the border style of dropdown menu content.<br>CSS variable: --wm-dropdown-menu-content-border-style"}},"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the border color of dropdown menu content.<br>CSS variable: --wm-dropdown-menu-content-border-color"}}},"background":{"value":"#fff","type":"color","attributes":{"subtype":"color","description":"Sets the background color of dropdown menu content (the container that holds the dropdown menu items). This is the main background color that appears behind the menu items.<br>CSS variable: --wm-dropdown-menu-content-background"}}},"caret":{"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of dropdown menu caret icons (the small arrow symbols that indicate dropdown menus). This determines what color the arrow symbols appear in.<br>CSS variable: --wm-dropdown-menu-caret-color"}},"size":{"value":"{icon.size.sm.value}","type":"space","attributes":{"subtype":"icon-size","description":"Controls how large dropdown menu caret icons appear (the small arrow symbols that indicate dropdown menus). This affects the size of the arrow symbols that users see in dropdown buttons.<br>CSS variable: --wm-dropdown-menu-caret-size"}}},"item":{"font-family":{"value":"{body.large.font-family.value}","type":"font","attributes":{"subtype":"font-family","description":"Sets the typeface (font style) for dropdown menu items (individual options in the dropdown list). This determines whether the menu item text appears in Arial, Times New Roman, or other font styles.<br>CSS variable: --wm-dropdown-menu-item-font-family"}},"font-size":{"value":"{body.large.font-size.value}","type":"font","attributes":{"subtype":"font-size","description":"Controls how large the dropdown menu items appear (individual options in the dropdown list). This affects the size of the text that users see in each menu option.<br>CSS variable: --wm-dropdown-menu-item-font-size"}},"font-weight":{"value":"{body.large.font-weight.value}","type":"font","attributes":{"subtype":"font-weight","description":"Controls how thick or bold the dropdown menu items appear (individual options in the dropdown list). \'normal\' makes it regular weight, \'bold\' makes it thicker, and numbers (100-900) provide fine control over thickness.<br>CSS variable: --wm-dropdown-menu-item-font-weight"}},"line-height":{"value":"{body.large.line-height.value}","type":"font","attributes":{"subtype":"line-height","description":"Controls the vertical spacing between lines when dropdown menu item text wraps to multiple lines. This ensures proper spacing for the menu item text displayed in the dropdown.<br>CSS variable: --wm-dropdown-menu-item-line-height"}},"color":{"value":"{color.on-surface.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the text color of dropdown menu items (individual options in the dropdown list). This determines what color the menu item text appears in, which should contrast well with the background for readability.<br>CSS variable: --wm-dropdown-menu-item-color"}},"background-color":{"value":"transparent","type":"color","attributes":{"subtype":"color","description":"Sets the background color of dropdown menu item anchor text.<br>CSS variable: --wm-dropdown-menu-item-background-color"}},"border":{"style":{"type":"radius","value":"{border.style.solid.value}","attributes":{"subtype":"border-style","description":"Controls the style of the border around dropdown menu items. \'solid\' creates a continuous line, \'dashed\' creates a dotted line, \'dotted\' creates small dots.<br>CSS variable: --wm-dropdown-menu-item-border-style"}}},"padding":{"value":"{space.3.value} {space.4.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding inside dropdown menu items (top/bottom, left/right). Acceptable units: px.<br>CSS variable: --wm-dropdown-menu-item-padding"}},"icon":{"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the dropdown menu item icon glyph (grey).<br>CSS variable: --wm-dropdown-menu-item-icon-color"}},"padding":{"value":"{space.0.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding of the dropdown menu item icon glyph.<br>CSS variable: --wm-dropdown-menu-item-icon-padding"}},"font-size":{"value":"{body.large.font-size.value}","type":"font","attributes":{"subtype":"icon-size","description":"Controls the font size of the dropdown menu item icon glyph (16px).<br>CSS variable: --wm-dropdown-menu-item-icon-font-size"}}}},"border":{"radius":{"value":"{radius.none.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of dropdown menus (lists of options that appear when users click on a button or link). When set to \'none\', dropdowns have sharp corners. Higher values create more rounded corners for a softer appearance.<br>CSS variable: --wm-dropdown-menu-border-radius"}},"width":{"value":"0","type":"space","attributes":{"subtype":"border-width","description":"Controls the thickness of the border around dropdown menus. When set to 0, there\'s no visible border. Higher values create thicker borders around the dropdown.<br>CSS variable: --wm-dropdown-menu-border-width"}},"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the border around dropdown menus. This determines the color of the outline that defines the dropdown menu shape.<br>CSS variable: --wm-dropdown-menu-border-color"}}}}}}}');
+module.exports = /*#__PURE__*/JSON.parse('{"dropdown":{"mapping":{"menu":{"background":{"value":"transparent","type":"color","attributes":{"subtype":"color","description":"Sets the background color of dropdown menus (lists of options that appear when users click on a button or link). This is the main background color that appears behind the dropdown menu items.<br>CSS variable: --wm-dropdown-menu-background"}},"box-shadow":{"value":"{elevation.shadow.2.value}","type":"radius","attributes":{"subtype":"elevation","description":"Controls the drop shadow on the floating dropdown menu panel (Material 3 menu surface elevation; uses global elevation shadow level 2).<br>CSS variable: --wm-dropdown-menu-box-shadow"}},"padding":{"type":"space","value":"{space.2.value} {space.0.value}","attributes":{"subtype":"space","description":"Controls the padding inside dropdown menu containers (top/bottom, left/right). Acceptable units: px.<br>CSS variable: --wm-dropdown-menu-padding"}},"color":{"type":"color","value":"{color.on-surface.variant.@.value}","attributes":{"subtype":"color","description":"Sets the text color of dropdown menu triggers (the button or link that opens the dropdown). This determines what color the trigger text appears in.<br>CSS variable: --wm-dropdown-menu-color"}},"text":{"decoration":{"type":"radius","value":"none","attributes":{"subtype":"text-decoration","description":"Controls the text decoration of dropdown menu triggers (underline, overline, line-through, or none). When set to \'none\', no decoration is applied to the trigger text.<br>CSS variable: --wm-dropdown-menu-text-decoration"}},"font-weight":{"type":"font","value":"{font.weight.700.value}","attributes":{"subtype":"font-weight","description":"Controls how thick or bold the dropdown menu trigger text appears. When set to 700, the trigger text appears bold to emphasize the dropdown button.<br>CSS variable: --wm-dropdown-menu-text-font-weight"}},"font-size":{"type":"font","value":"{body.large.font-size.value}","attributes":{"subtype":"font-size","description":"Controls the font size of dropdown menu trigger text.<br>CSS variable: --wm-dropdown-menu-text-font-size"}},"padding":{"type":"space","value":"{space.0.value} {space.3.value} {space.0.value} {space.2.value}","attributes":{"subtype":"space","description":"Controls the padding of dropdown menu trigger text (top, right, bottom, left). Acceptable units: px.<br>CSS variable: --wm-dropdown-menu-text-padding"}}},"content":{"width":{"value":"220px","type":"space","attributes":{"subtype":"space","description":"Controls how wide dropdown menu content appears (the container that holds the dropdown menu items). This determines the horizontal size of the dropdown menu container.<br>CSS variable: --wm-dropdown-menu-content-width"}},"border":{"radius":{"value":"{radius.xs.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of dropdown menu content. This makes the dropdown appear with slightly rounded corners for a softer appearance.<br>CSS variable: --wm-dropdown-menu-content-border-radius"}},"width":{"value":"{border.width.0.value}","type":"border","attributes":{"subtype":"border-width","description":"Controls the border width of dropdown menu content.<br>CSS variable: --wm-dropdown-menu-content-border-width"}},"style":{"value":"{border.style.solid.value}","type":"radius","attributes":{"subtype":"border-style","description":"Controls the border style of dropdown menu content.<br>CSS variable: --wm-dropdown-menu-content-border-style"}},"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the border color of dropdown menu content.<br>CSS variable: --wm-dropdown-menu-content-border-color"}}},"background":{"value":"#fff","type":"color","attributes":{"subtype":"color","description":"Sets the background color of dropdown menu content (the container that holds the dropdown menu items). This is the main background color that appears behind the menu items.<br>CSS variable: --wm-dropdown-menu-content-background"}}},"caret":{"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of dropdown menu caret icons (the small arrow symbols that indicate dropdown menus). This determines what color the arrow symbols appear in.<br>CSS variable: --wm-dropdown-menu-caret-color"}},"size":{"value":"{icon.size.sm.value}","type":"space","attributes":{"subtype":"icon-size","description":"Controls how large dropdown menu caret icons appear (the small arrow symbols that indicate dropdown menus). This affects the size of the arrow symbols that users see in dropdown buttons.<br>CSS variable: --wm-dropdown-menu-caret-size"}}},"item":{"font-family":{"value":"{body.large.font-family.value}","type":"font","attributes":{"subtype":"font-family","description":"Sets the typeface (font style) for dropdown menu items (individual options in the dropdown list). This determines whether the menu item text appears in Arial, Times New Roman, or other font styles.<br>CSS variable: --wm-dropdown-menu-item-font-family"}},"font-size":{"value":"{body.large.font-size.value}","type":"font","attributes":{"subtype":"font-size","description":"Controls how large the dropdown menu items appear (individual options in the dropdown list). This affects the size of the text that users see in each menu option.<br>CSS variable: --wm-dropdown-menu-item-font-size"}},"font-weight":{"value":"{body.large.font-weight.value}","type":"font","attributes":{"subtype":"font-weight","description":"Controls how thick or bold the dropdown menu items appear (individual options in the dropdown list). \'normal\' makes it regular weight, \'bold\' makes it thicker, and numbers (100-900) provide fine control over thickness.<br>CSS variable: --wm-dropdown-menu-item-font-weight"}},"line-height":{"value":"{body.large.line-height.value}","type":"font","attributes":{"subtype":"line-height","description":"Controls the vertical spacing between lines when dropdown menu item text wraps to multiple lines. This ensures proper spacing for the menu item text displayed in the dropdown.<br>CSS variable: --wm-dropdown-menu-item-line-height"}},"color":{"value":"{color.on-surface.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the text color of dropdown menu items (individual options in the dropdown list). This determines what color the menu item text appears in, which should contrast well with the background for readability.<br>CSS variable: --wm-dropdown-menu-item-color"}},"background-color":{"value":"transparent","type":"color","attributes":{"subtype":"color","description":"Sets the background color of dropdown menu item anchor text.<br>CSS variable: --wm-dropdown-menu-item-background-color"}},"border":{"style":{"type":"radius","value":"{border.style.solid.value}","attributes":{"subtype":"border-style","description":"Controls the style of the border around dropdown menu items. \'solid\' creates a continuous line, \'dashed\' creates a dotted line, \'dotted\' creates small dots.<br>CSS variable: --wm-dropdown-menu-item-border-style"}}},"padding":{"value":"{space.3.value} {space.4.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding inside dropdown menu items (top/bottom, left/right). Acceptable units: px.<br>CSS variable: --wm-dropdown-menu-item-padding"}},"icon":{"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the dropdown menu item icon glyph (grey).<br>CSS variable: --wm-dropdown-menu-item-icon-color"}},"padding":{"value":"{space.0.value}","type":"space","attributes":{"subtype":"space","description":"Controls the padding of the dropdown menu item icon glyph.<br>CSS variable: --wm-dropdown-menu-item-icon-padding"}},"font-size":{"value":"{body.large.font-size.value}","type":"font","attributes":{"subtype":"icon-size","description":"Controls the font size of the dropdown menu item icon glyph (16px).<br>CSS variable: --wm-dropdown-menu-item-icon-font-size"}}}},"border":{"radius":{"value":"{radius.none.value}","type":"radius","attributes":{"subtype":"radius","description":"Controls the corner rounding of dropdown menus (lists of options that appear when users click on a button or link). When set to \'none\', dropdowns have sharp corners. Higher values create more rounded corners for a softer appearance.<br>CSS variable: --wm-dropdown-menu-border-radius"}},"width":{"value":"0","type":"space","attributes":{"subtype":"border-width","description":"Controls the thickness of the border around dropdown menus. When set to 0, there\'s no visible border. Higher values create thicker borders around the dropdown.<br>CSS variable: --wm-dropdown-menu-border-width"}},"color":{"value":"{color.on-surface.variant.@.value}","type":"color","attributes":{"subtype":"color","description":"Sets the color of the border around dropdown menus. This determines the color of the outline that defines the dropdown menu shape.<br>CSS variable: --wm-dropdown-menu-border-color"}}}}}}}');
 
 /***/ }