@yahoo/uds 3.152.0 → 3.153.0

package/dist/css/dist/css/utils.cjs

@@ -132,7 +132,11 @@ const getConfigurableCssVariables = () => {
 		if (Array.isArray(cssProperties)) return cssProperties.filter((cssProperty) => typeof cssProperty === "string" && cssProperty.startsWith(udsVarPrefix));
 		return [];
 	});
-	return [...new Set(["--uds-button-gap", ...cssVars])];
+	return [...new Set([
+		"--uds-button-gap",
+		"--uds-pagination-control-size",
+		...cssVars
+	])];
 };
 //#endregion
 exports.extractRuntimeConfigValues = extractRuntimeConfigValues;

package/dist/css/dist/css/utils.js

@@ -132,7 +132,11 @@ const getConfigurableCssVariables = () => {
 		if (Array.isArray(cssProperties)) return cssProperties.filter((cssProperty) => typeof cssProperty === "string" && cssProperty.startsWith(udsVarPrefix));
 		return [];
 	});
-	return [...new Set(["--uds-button-gap", ...cssVars])];
+	return [...new Set([
+		"--uds-button-gap",
+		"--uds-pagination-control-size",
+		...cssVars
+	])];
 };
 //#endregion
 export { extractRuntimeConfigValues, extractVariantDefaults, formatBytes, getConfigurableCssVariables, getMotionVarPrefixes };

package/dist/css/dist/packages/config/dist/index.cjs

@@ -28948,8 +28948,278 @@ const defaultTokensConfig = {
 			}
 		}
 	},
-	version: "v0.94.0",
-	version: "v0.94.0"
+	version: "v0.95.0",
+	pagination: {
+		defaults: {
+			size: "md",
+			variant: "default"
+		},
+		variables: {
+			"size/md/icon": { size: { rest: {
+				type: "iconSizes",
+				value: "sm",
+				valueType: "alias"
+			} } },
+			"size/md/item": {
+				borderRadius: { rest: {
+					type: "borderRadii",
+					value: "full",
+					valueType: "alias"
+				} },
+				spacing: { rest: {
+					type: "spacingAliases",
+					value: "2",
+					valueType: "alias"
+				} }
+			},
+			"size/md/root": { gap: { rest: {
+				type: "spacingAliases",
+				value: "0",
+				valueType: "alias"
+			} } },
+			"size/md/text": { textVariant: { rest: {
+				type: "textVariants",
+				value: "ui2",
+				valueType: "alias"
+			} } },
+			"size/sm/icon": { size: { rest: {
+				type: "iconSizes",
+				value: "sm",
+				valueType: "alias"
+			} } },
+			"size/sm/item": {
+				borderRadius: { rest: {
+					type: "borderRadii",
+					value: "full",
+					valueType: "alias"
+				} },
+				spacing: { rest: {
+					type: "spacingAliases",
+					value: "1.5",
+					valueType: "alias"
+				} }
+			},
+			"size/sm/root": { gap: { rest: {
+				type: "spacingAliases",
+				value: "0",
+				valueType: "alias"
+			} } },
+			"size/sm/text": { textVariant: { rest: {
+				type: "textVariants",
+				value: "ui2",
+				valueType: "alias"
+			} } },
+			"variant/default/active/off/root": {
+				backgroundColor: {
+					hover: {
+						type: "backgroundPaletteColors",
+						value: "brand-secondary",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "spectrumColors",
+						value: "purple-2",
+						valueType: "alias"
+					},
+					rest: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					}
+				},
+				color: {
+					hover: {
+						type: "foregroundPaletteColors",
+						value: "secondary",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "foregroundPaletteColors",
+						value: "secondary",
+						valueType: "alias"
+					},
+					rest: {
+						type: "foregroundPaletteColors",
+						value: "secondary",
+						valueType: "alias"
+					}
+				},
+				borderColor: {
+					hover: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					},
+					rest: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					}
+				},
+				borderWidth: {
+					hover: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					}
+				},
+				shadow: {
+					hover: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					}
+				},
+				insetShadow: {
+					hover: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "shadowVariantsWithInvert",
+						value: "sm",
+						valueType: "alias"
+					},
+					rest: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					}
+				}
+			},
+			"variant/default/active/on/root": {
+				backgroundColor: {
+					hover: {
+						type: "backgroundPaletteColors",
+						value: "brand",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "backgroundPaletteColors",
+						value: "brand",
+						valueType: "alias"
+					},
+					rest: {
+						type: "backgroundPaletteColors",
+						value: "brand",
+						valueType: "alias"
+					}
+				},
+				color: {
+					hover: {
+						type: "foregroundPaletteColors",
+						value: "on-color",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "foregroundPaletteColors",
+						value: "on-color",
+						valueType: "alias"
+					},
+					rest: {
+						type: "foregroundPaletteColors",
+						value: "on-color",
+						valueType: "alias"
+					}
+				},
+				borderColor: {
+					hover: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					},
+					rest: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					}
+				},
+				borderWidth: {
+					hover: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					}
+				},
+				shadow: {
+					hover: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					}
+				},
+				insetShadow: {
+					hover: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					}
+				}
+			}
+		}
+	},
+	version: "v0.95.0"
 };
 //#endregion
 exports.defaultTokensConfig = defaultTokensConfig;

package/dist/css/dist/packages/config/dist/index.js

@@ -28948,8 +28948,278 @@ const defaultTokensConfig = {
 			}
 		}
 	},
-	version: "v0.94.0",
-	version: "v0.94.0"
+	version: "v0.95.0",
+	pagination: {
+		defaults: {
+			size: "md",
+			variant: "default"
+		},
+		variables: {
+			"size/md/icon": { size: { rest: {
+				type: "iconSizes",
+				value: "sm",
+				valueType: "alias"
+			} } },
+			"size/md/item": {
+				borderRadius: { rest: {
+					type: "borderRadii",
+					value: "full",
+					valueType: "alias"
+				} },
+				spacing: { rest: {
+					type: "spacingAliases",
+					value: "2",
+					valueType: "alias"
+				} }
+			},
+			"size/md/root": { gap: { rest: {
+				type: "spacingAliases",
+				value: "0",
+				valueType: "alias"
+			} } },
+			"size/md/text": { textVariant: { rest: {
+				type: "textVariants",
+				value: "ui2",
+				valueType: "alias"
+			} } },
+			"size/sm/icon": { size: { rest: {
+				type: "iconSizes",
+				value: "sm",
+				valueType: "alias"
+			} } },
+			"size/sm/item": {
+				borderRadius: { rest: {
+					type: "borderRadii",
+					value: "full",
+					valueType: "alias"
+				} },
+				spacing: { rest: {
+					type: "spacingAliases",
+					value: "1.5",
+					valueType: "alias"
+				} }
+			},
+			"size/sm/root": { gap: { rest: {
+				type: "spacingAliases",
+				value: "0",
+				valueType: "alias"
+			} } },
+			"size/sm/text": { textVariant: { rest: {
+				type: "textVariants",
+				value: "ui2",
+				valueType: "alias"
+			} } },
+			"variant/default/active/off/root": {
+				backgroundColor: {
+					hover: {
+						type: "backgroundPaletteColors",
+						value: "brand-secondary",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "spectrumColors",
+						value: "purple-2",
+						valueType: "alias"
+					},
+					rest: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					}
+				},
+				color: {
+					hover: {
+						type: "foregroundPaletteColors",
+						value: "secondary",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "foregroundPaletteColors",
+						value: "secondary",
+						valueType: "alias"
+					},
+					rest: {
+						type: "foregroundPaletteColors",
+						value: "secondary",
+						valueType: "alias"
+					}
+				},
+				borderColor: {
+					hover: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					},
+					rest: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					}
+				},
+				borderWidth: {
+					hover: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					}
+				},
+				shadow: {
+					hover: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					}
+				},
+				insetShadow: {
+					hover: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "shadowVariantsWithInvert",
+						value: "sm",
+						valueType: "alias"
+					},
+					rest: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					}
+				}
+			},
+			"variant/default/active/on/root": {
+				backgroundColor: {
+					hover: {
+						type: "backgroundPaletteColors",
+						value: "brand",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "backgroundPaletteColors",
+						value: "brand",
+						valueType: "alias"
+					},
+					rest: {
+						type: "backgroundPaletteColors",
+						value: "brand",
+						valueType: "alias"
+					}
+				},
+				color: {
+					hover: {
+						type: "foregroundPaletteColors",
+						value: "on-color",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "foregroundPaletteColors",
+						value: "on-color",
+						valueType: "alias"
+					},
+					rest: {
+						type: "foregroundPaletteColors",
+						value: "on-color",
+						valueType: "alias"
+					}
+				},
+				borderColor: {
+					hover: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					},
+					rest: {
+						type: "alwaysPaletteAliases",
+						value: "always/transparent",
+						valueType: "alias"
+					}
+				},
+				borderWidth: {
+					hover: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "borderWidths",
+						value: "none",
+						valueType: "alias"
+					}
+				},
+				shadow: {
+					hover: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "shadowVariants",
+						value: "none",
+						valueType: "alias"
+					}
+				},
+				insetShadow: {
+					hover: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					},
+					pressed: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					},
+					rest: {
+						type: "shadowVariantsWithInvert",
+						value: "none",
+						valueType: "alias"
+					}
+				}
+			}
+		}
+	},
+	version: "v0.95.0"
 };
 //#endregion
 export { defaultTokensConfig };

package/dist/css/dist/purger/optimized/purgeFromCode.cjs

@@ -62,11 +62,13 @@ const isUdsComponentModule = (moduleSpecifier) => {
 	return cleaned === "@yahoo/uds" || cleaned.startsWith("@yahoo/uds/");
 };
 /**
-* Normalize component name to match autoVariants keys (lower camel, no punctuation).
+* Normalize component name to match autoVariants keys (fully lowercase, no
+* punctuation). autoVariants keys lowercase the entire component label (e.g.
+* `menucontentSizeRoot`), so full lowercasing keeps the normalized prefix
+* aligned with those keys and makes namespace/flat aliases resolve consistently.
 */
 const normalizeComponentName = (name) => {
-	const cleaned = name.replace(/\W/g, "");
-	return cleaned.charAt(0).toLowerCase() + cleaned.slice(1);
+	return name.replace(/\W/g, "").toLowerCase();
 };
 /**
 * Fallback: infer prop -> variant key mapping from autoVariants when the
@@ -350,7 +352,7 @@ const purgeFromCodeOptimized = async (code, options) => {
 		});
 	});
 	if (options.includeAllClassNamePrimitives) safelist.push(...extractClassNamePrimitives(sourceFile));
-	const finalSafelist = [...new Set(safelist)];
+	const finalSafelist = [...new Set(safelist)].sort();
 	const safelistGenerationMs = performance.now() - safelistGenStart;
 	stats.timeMs = Math.round(performance.now() - startTime);
 	stats.classesGenerated = finalSafelist.length;

package/dist/css/dist/purger/optimized/purgeFromCode.js

@@ -61,11 +61,13 @@ const isUdsComponentModule = (moduleSpecifier) => {
 	return cleaned === "@yahoo/uds" || cleaned.startsWith("@yahoo/uds/");
 };
 /**
-* Normalize component name to match autoVariants keys (lower camel, no punctuation).
+* Normalize component name to match autoVariants keys (fully lowercase, no
+* punctuation). autoVariants keys lowercase the entire component label (e.g.
+* `menucontentSizeRoot`), so full lowercasing keeps the normalized prefix
+* aligned with those keys and makes namespace/flat aliases resolve consistently.
 */
 const normalizeComponentName = (name) => {
-	const cleaned = name.replace(/\W/g, "");
-	return cleaned.charAt(0).toLowerCase() + cleaned.slice(1);
+	return name.replace(/\W/g, "").toLowerCase();
 };
 /**
 * Fallback: infer prop -> variant key mapping from autoVariants when the
@@ -349,7 +351,7 @@ const purgeFromCodeOptimized = async (code, options) => {
 		});
 	});
 	if (options.includeAllClassNamePrimitives) safelist.push(...extractClassNamePrimitives(sourceFile));
-	const finalSafelist = [...new Set(safelist)];
+	const finalSafelist = [...new Set(safelist)].sort();
 	const safelistGenerationMs = performance.now() - safelistGenStart;
 	stats.timeMs = Math.round(performance.now() - startTime);
 	stats.classesGenerated = finalSafelist.length;

package/dist/index.cjs

@@ -73,6 +73,13 @@ const require_components_client_PaddleNav_PaddleButtonNext = require("./componen
 const require_components_client_PaddleNav_PaddleButtonPrevious = require("./components/client/PaddleNav/PaddleButtonPrevious.cjs");
 const require_components_client_PaddleNav_PaddleNavContent = require("./components/client/PaddleNav/PaddleNavContent.cjs");
 const require_components_client_PaddleNav_PaddleNav = require("./components/client/PaddleNav/PaddleNav.cjs");
+const require_components_client_Pagination_Pagination = require("./components/client/Pagination/Pagination.cjs");
+const require_components_client_Pagination_PaginationEllipsis = require("./components/client/Pagination/PaginationEllipsis.cjs");
+const require_components_client_Pagination_PaginationItem = require("./components/client/Pagination/PaginationItem.cjs");
+const require_components_client_Pagination_PaginationLink = require("./components/client/Pagination/PaginationLink.cjs");
+const require_components_client_Pagination_PaginationNext = require("./components/client/Pagination/PaginationNext.cjs");
+const require_components_client_Pagination_PaginationNumbers = require("./components/client/Pagination/PaginationNumbers.cjs");
+const require_components_client_Pagination_PaginationPrev = require("./components/client/Pagination/PaginationPrev.cjs");
 const require_components_client_Popover_UDSPopoverConfigProvider = require("./components/client/Popover/UDSPopoverConfigProvider.cjs");
 const require_components_client_Popover_Popover = require("./components/client/Popover/Popover.cjs");
 const require_generatedConfigs = require("./automated-config/dist/generated/generatedConfigs.cjs");
@@ -216,6 +223,14 @@ exports.PaddleButtonPrevious = require_components_client_PaddleNav_PaddleButtonP
 exports.PaddleNav = require_components_client_PaddleNav_PaddleNav.PaddleNav;
 exports.PaddleNavConfig = require_generatedConfigs.PaddleNavConfig;
 exports.PaddleNavContent = require_components_client_PaddleNav_PaddleNavContent.PaddleNavContent;
+exports.Pagination = require_components_client_Pagination_Pagination.Pagination;
+exports.PaginationConfig = require_generatedConfigs.PaginationConfig;
+exports.PaginationEllipsis = require_components_client_Pagination_PaginationEllipsis.PaginationEllipsis;
+exports.PaginationItem = require_components_client_Pagination_PaginationItem.PaginationItem;
+exports.PaginationLink = require_components_client_Pagination_PaginationLink.PaginationLink;
+exports.PaginationNext = require_components_client_Pagination_PaginationNext.PaginationNext;
+exports.PaginationNumbers = require_components_client_Pagination_PaginationNumbers.PaginationNumbers;
+exports.PaginationPrev = require_components_client_Pagination_PaginationPrev.PaginationPrev;
 exports.Popover = require_components_client_Popover_Popover.Popover;
 exports.PopoverConfig = require_generatedConfigs.PopoverConfig;
 exports.PopoverContent = require_components_client_Popover_PopoverContent.PopoverContent;
@@ -263,6 +278,7 @@ exports.XSMALL_SCALE_MODE_CLASSNAME = require_index$1.XSMALL_SCALE_MODE_CLASSNAM
 exports.XXLARGE_SCALE_MODE_CLASSNAME = require_index$1.XXLARGE_SCALE_MODE_CLASSNAME;
 exports.XXXLARGE_SCALE_MODE_CLASSNAME = require_index$1.XXXLARGE_SCALE_MODE_CLASSNAME;
 exports.alwaysPalette = require_index.alwaysPalette;
+exports.applyBoxShadowBorder = require_index$2.applyBoxShadowBorder;
 exports.buildConfigSchema = require_buildConfigSchema.buildConfigSchema;
 exports.cartesianProduct = require_cartesianProduct.cartesianProduct;
 exports.coalesceConfigVariant = require_coalesceConfigVariant.coalesceConfigVariant;