@capillarytech/blaze-ui 2.0.2 → 2.0.3

package/dist/index.js

@@ -517,9 +517,9 @@ exports["default"] = CheckOutlined;
 
 
 exports.__esModule = true;
-exports.loadBlazeUIFonts = exports.getBlazeUIFontLinks = void 0;
+exports.loadCapUIFonts = exports.getCapUIFontLinks = void 0;
 /**
- * Font configuration for Blaze UI
+ * Font configuration for Cap UI
  * Centralized font management for consistent typography across applications
  */
 
@@ -577,7 +577,7 @@ const injectRobotoFont = function (weights) {
   const link = document.createElement('link');
   link.href = href;
   link.rel = 'stylesheet';
-  link.setAttribute('data-blaze-ui-font', 'roboto');
+  link.setAttribute('data-cap-ui-font', 'roboto');
   document.head.appendChild(link);
 };
 
@@ -595,7 +595,7 @@ const injectMaterialIcons = () => {
   preloadLink.rel = 'preload';
   preloadLink.href = FONT_URLS.materialIcons;
   preloadLink.setAttribute('as', 'style');
-  preloadLink.setAttribute('data-blaze-ui-font', 'material-icons');
+  preloadLink.setAttribute('data-cap-ui-font', 'material-icons');
 
   // Convert to stylesheet when loaded
   preloadLink.onload = function () {
@@ -610,13 +610,13 @@ const injectMaterialIcons = () => {
   const fallbackLink = document.createElement('link');
   fallbackLink.rel = 'stylesheet';
   fallbackLink.href = FONT_URLS.materialIcons;
-  fallbackLink.setAttribute('data-blaze-ui-font', 'material-icons-fallback');
+  fallbackLink.setAttribute('data-cap-ui-font', 'material-icons-fallback');
   noscript.appendChild(fallbackLink);
   document.head.appendChild(noscript);
 };
 
 /**
- * Loads Blaze UI fonts into the document head
+ * Loads Cap UI fonts into the document head
  *
  * This function should be called once when your application initializes.
  * It's safe to call multiple times - it will check if fonts are already loaded.
@@ -625,19 +625,19 @@ const injectMaterialIcons = () => {
  *
  * @example
  * ```typescript
- * import { loadBlazeUIFonts } from '@capillarytech/blaze-ui';
+ * import { loadCapUIFonts } from '@capillarytech/blaze-ui';
  *
  * // Load all fonts (default)
- * loadBlazeUIFonts();
+ * loadCapUIFonts();
  *
  * // Load only Roboto with custom weights
- * loadBlazeUIFonts({
+ * loadCapUIFonts({
  *   loadMaterialIcons: false,
  *   robotoWeights: [400, 500, 700]
  * });
  * ```
  */
-const loadBlazeUIFonts = function (config) {
+const loadCapUIFonts = function (config) {
   if (config === void 0) {
     config = {};
   }
@@ -663,11 +663,11 @@ const loadBlazeUIFonts = function (config) {
  * @example
  * ```html
  * <!-- In your HTML head -->
- * ${getBlazeUIFontLinks().join('\n')}
+ * ${getCapUIFontLinks().join('\n')}
  * ```
  */
-exports.loadBlazeUIFonts = loadBlazeUIFonts;
-const getBlazeUIFontLinks = function (config) {
+exports.loadCapUIFonts = loadCapUIFonts;
+const getCapUIFontLinks = function (config) {
   if (config === void 0) {
     config = {};
   }
@@ -685,7 +685,7 @@ const getBlazeUIFontLinks = function (config) {
   }
   return links;
 };
-exports.getBlazeUIFontLinks = getBlazeUIFontLinks;
+exports.getCapUIFontLinks = getCapUIFontLinks;
 
 /***/ }),
 
@@ -752,9 +752,9 @@ const CapDropdownComponent = _ref => {
   const v6Placement = mapPlacement(placement);
 
   // Support both new `classNames.root` and deprecated `overlayClassName` props
-  // Note: TypeScript types may be outdated, but runtime supports classNames.root
-  const finalClassNames = _extends({}, classNamesProp, {
-    root: (0, _classnames.default)(_styles.default[clsPrefix + "-overlay"], classNamesProp == null ? void 0 : classNamesProp.root, overlayClassName)
+  const existingRoot = classNamesProp && typeof classNamesProp === 'object' && !Array.isArray(classNamesProp) ? classNamesProp.root : undefined;
+  const finalClassNames = _extends({}, typeof classNamesProp === 'object' && !Array.isArray(classNamesProp) ? classNamesProp : {}, {
+    root: (0, _classnames.default)(_styles.default[clsPrefix + "-overlay"], existingRoot, overlayClassName)
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antdV.Dropdown, _extends({
     className: (0, _classnames.default)(_styles.default[clsPrefix], className),
@@ -5136,7 +5136,7 @@ var ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ = __webpack_require__(1601);
 var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(6314);
 var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.blaze-ui-cap-dropdown-v2-overlay{min-width:14.286rem}.ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item{padding:.857rem 1.714rem}`, ""]);
+___CSS_LOADER_EXPORT___.push([module.id, `.blaze-ui-cap-dropdown-v2-overlay{min-width:14.286rem}.blaze-ui-cap-dropdown-v2-overlay .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item{padding:.857rem 1.714rem}`, ""]);
 // Exports
 ___CSS_LOADER_EXPORT___.locals = {
 	"cap-dropdown-v2-overlay": `blaze-ui-cap-dropdown-v2-overlay`
@@ -5781,13 +5781,36 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 
 exports.__esModule = true;
 exports.getCapThemeConfig = getCapThemeConfig;
+var _lodash = __webpack_require__(2543);
 var styledVars = _interopRequireWildcard(__webpack_require__(9941));
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 /**
- * Converts rem values to pixels (number).
- * Base font size is 14px, so 1rem = 14px.
+ * Gets the root font size from the document element dynamically.
+ * Falls back to Cap UI default (14px) if not available or in non-browser environments.
  *
+ * @returns Root font size in pixels
+ */
+function getRootFontSize() {
+  if (typeof window === 'undefined' || typeof document === 'undefined') {
+    // SSR or non-browser environment: return Cap UI default
+    return 14;
+  }
+  const rootElement = document.documentElement;
+  const computedStyle = window.getComputedStyle(rootElement);
+  const fontSize = computedStyle.fontSize;
+  if (fontSize) {
+    const pxValue = parseFloat(fontSize);
+    if (!isNaN(pxValue) && pxValue > 0) {
+      return pxValue;
+    }
+  }
+
+  // Fallback to Cap UI default if unable to read computed size
+  return 14;
+}
+
+/**
+ * Converts rem values to pixels (number) by reading the root font size dynamically.
  * @param remValue - Rem value as string (e.g., '1rem', '0.857rem') or number
  * @returns Number in pixels
  *
@@ -5803,11 +5826,12 @@ function remToPx(remValue, fallback) {
   if (typeof remValue === 'number') {
     return remValue;
   }
+  const rootFontSize = getRootFontSize();
   const value = remValue || fallback;
   const remMatch = typeof value === 'string' ? value.match(/^([\d.]+)rem$/) : null;
   if (remMatch) {
     const rem = parseFloat(remMatch[1]);
-    return rem * 14; // Base font size is 14px
+    return rem * rootFontSize;
   }
 
   // If it's already a number string, parse it
@@ -5818,7 +5842,7 @@ function remToPx(remValue, fallback) {
 
   // Default fallback: parse the fallback value
   const fallbackMatch = fallback.match(/^([\d.]+)rem$/);
-  return fallbackMatch ? parseFloat(fallbackMatch[1]) * 14 : 14;
+  return fallbackMatch ? parseFloat(fallbackMatch[1]) * rootFontSize : rootFontSize;
 }
 
 /**
@@ -5826,6 +5850,13 @@ function remToPx(remValue, fallback) {
  * This function maps Capillary design tokens to Ant Design tokens,
  * eliminating the need for SCSS overrides.
  *
+ * **⚠️ Accessibility Note:**
+ * This function converts rem values to px for Ant Design theme tokens.
+ * This means Ant Design components will not scale with user browser font size settings,
+ * while Cap UI components (which use rem) will scale. This creates inconsistent
+ * behavior and violates WCAG 2.1 SC 1.4.4 (Resize text). Consider using rem values
+ * directly in theme config when Ant Design v6 supports it, or use CSS custom properties.
+ *
  * @param options - Optional theme configuration overrides
  * @returns Ant Design ThemeConfig object
  *
@@ -6077,8 +6108,8 @@ function getCapThemeConfig(options) {
   // Merge with custom options if provided
   if (options) {
     return {
-      token: _extends({}, baseTheme.token, options.token),
-      components: _extends({}, baseTheme.components, options.components),
+      token: options.token ? (0, _lodash.merge)({}, baseTheme.token, options.token) : baseTheme.token,
+      components: options.components ? (0, _lodash.merge)({}, baseTheme.components, options.components) : baseTheme.components,
       algorithm: options.algorithm,
       cssVar: options.cssVar,
       hashed: options.hashed
@@ -6965,7 +6996,7 @@ const CapAlert = _ref => {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antdV.Alert, _extends({
       className: (0, _classnames.default)(_styles.default[clsPrefix], className),
       type: type,
-      title: alertTitle
+      message: alertTitle
     }, rest))
   });
 };
@@ -7035,9 +7066,9 @@ function _isNativeReflectConstruct() {
 exports.__esModule = true;
 var _exportNames = {
   getCapThemeConfig: true,
-  loadBlazeUI: true
+  loadCapUI: true
 };
-exports.loadBlazeUI = exports.getCapThemeConfig = void 0;
+exports.loadCapUI = exports.getCapThemeConfig = void 0;
 var _fonts = __webpack_require__(170);
 Object.keys(_fonts).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -7051,11 +7082,11 @@ exports.getCapThemeConfig = _getCapThemeConfig.getCapThemeConfig;
 const _excluded = ["baseFontSize"];
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 /**
- * Configuration for Blaze UI initialization
+ * Configuration for Cap UI initialization
  */
 
 /**
- * Loads Blaze UI fonts and base styles (sanitize.css) together
+ * Loads Cap UI fonts and base styles (sanitize.css) together
  *
  * This is a convenience function that loads both fonts and base styles in one call.
  * It should be called once when your application initializes.
@@ -7064,28 +7095,28 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
  * - Webpack will typically deduplicate it if both resolve to the same module path in node_modules
  * - However, if you want to avoid any potential duplication, import fonts separately:
  *   ```typescript
- *   import { loadBlazeUIFonts } from '@capillarytech/blaze-ui/utils';
- *   loadBlazeUIFonts();
+ *   import { loadCapUIFonts } from '@capillarytech/blaze-ui/utils';
+ *   loadCapUIFonts();
  *   ```
  *
- * @param config - Blaze UI configuration options
+ * @param config - Cap UI configuration options
  *
  * @example
  * ```typescript
- * import { loadBlazeUI } from '@capillarytech/blaze-ui/utils';
+ * import { loadCapUI } from '@capillarytech/blaze-ui/utils';
  *
  * // Load everything with default base font size (14px)
- * loadBlazeUI();
+ * loadCapUI();
  *
  * // Load with custom font configuration and base font size
- * loadBlazeUI({
+ * loadCapUI({
  *   loadMaterialIcons: false,
  *   robotoWeights: [400, 500, 700],
  *   baseFontSize: '16px'
  * });
  * ```
  */
-const loadBlazeUI = function (config) {
+const loadCapUI = function (config) {
   if (config === void 0) {
     config = {};
   }
@@ -7101,9 +7132,9 @@ const loadBlazeUI = function (config) {
 
   // Styles are loaded via import at module level (above)
   // Webpack will deduplicate sanitize.css if imported elsewhere with same module path
-  (0, _fonts.loadBlazeUIFonts)(fontConfig);
+  (0, _fonts.loadCapUIFonts)(fontConfig);
 };
-exports.loadBlazeUI = loadBlazeUI;
+exports.loadCapUI = loadCapUI;
 
 /***/ }),
 
@@ -7456,13 +7487,13 @@ var _exportNames = {
   CapTooltipWithInfo: true,
   CapUnifiedSelect: true,
   LocaleHoc: true,
-  loadBlazeUI: true,
+  loadCapUI: true,
   getCapThemeConfig: true,
-  loadBlazeUIFonts: true,
-  getBlazeUIFontLinks: true,
+  loadCapUIFonts: true,
+  getCapUIFontLinks: true,
   styledVars: true
 };
-exports.styledVars = exports.loadBlazeUIFonts = exports.loadBlazeUI = exports.getCapThemeConfig = exports.getBlazeUIFontLinks = exports.LocaleHoc = exports.CapUnifiedSelect = exports.CapTooltipWithInfo = exports.CapTooltip = exports.CapTable = exports.CapTab = exports.CapSwitch = exports.CapSpin = exports.CapSkeleton = exports.CapRow = exports.CapRadio = exports.CapMenu = exports.CapLabel = exports.CapInput = exports.CapIcon = exports.CapFormItem = exports.CapForm = exports.CapDropdown = exports.CapDivider = exports.CapColumn = exports.CapCheckbox = exports.CapCard = exports.CapButton = exports.CapAlert = void 0;
+exports.styledVars = exports.loadCapUIFonts = exports.loadCapUI = exports.getCapUIFontLinks = exports.getCapThemeConfig = exports.LocaleHoc = exports.CapUnifiedSelect = exports.CapTooltipWithInfo = exports.CapTooltip = exports.CapTable = exports.CapTab = exports.CapSwitch = exports.CapSpin = exports.CapSkeleton = exports.CapRow = exports.CapRadio = exports.CapMenu = exports.CapLabel = exports.CapInput = exports.CapIcon = exports.CapFormItem = exports.CapForm = exports.CapDropdown = exports.CapDivider = exports.CapColumn = exports.CapCheckbox = exports.CapCard = exports.CapButton = exports.CapAlert = void 0;
 var _CapAlert = _interopRequireDefault(__webpack_require__(8501));
 exports.CapAlert = _CapAlert.default;
 var _CapButton = _interopRequireDefault(__webpack_require__(8793));
@@ -7512,11 +7543,11 @@ exports.CapUnifiedSelect = _CapUnifiedSelect.default;
 var _LocaleHoc = _interopRequireDefault(__webpack_require__(9879));
 exports.LocaleHoc = _LocaleHoc.default;
 var _utils = __webpack_require__(2232);
-exports.loadBlazeUI = _utils.loadBlazeUI;
+exports.loadCapUI = _utils.loadCapUI;
 exports.getCapThemeConfig = _utils.getCapThemeConfig;
 var _fonts = __webpack_require__(170);
-exports.loadBlazeUIFonts = _fonts.loadBlazeUIFonts;
-exports.getBlazeUIFontLinks = _fonts.getBlazeUIFontLinks;
+exports.loadCapUIFonts = _fonts.loadCapUIFonts;
+exports.getCapUIFontLinks = _fonts.getCapUIFontLinks;
 var _styles = __webpack_require__(7668);
 Object.keys(_styles).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -33545,27 +33576,31 @@ var _antdV = __webpack_require__(4273);
 var _classnames = _interopRequireDefault(__webpack_require__(6942));
 var _react = _interopRequireDefault(__webpack_require__(9206));
 var _jsxRuntime = __webpack_require__(4848);
-const _excluded = ["className", "orientation"]; // Deprecated values from old API
+const _excluded = ["className", "orientation", "type"]; // Legacy alignment values that need mapping
+// Valid Ant Design v6 title placement values
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-// Map deprecated values to valid v6 values
-const mapOrientation = value => {
-  // Map deprecated values to 'horizontal'
-  if (value === 'left' || value === 'center' || value === 'right') {
-    return 'horizontal';
+// Map legacy alignment values to Ant Design v6 titlePlacement values
+const mapTitlePlacement = value => {
+  if (value === 'left') return 'start';
+  if (value === 'right') return 'end';
+  if (value === 'center' || value === 'start' || value === 'end') {
+    return value;
   }
-  return value;
+  return undefined;
 };
 const CapDivider = _ref => {
   let {
       className,
-      orientation = 'horizontal'
+      orientation,
+      type = 'horizontal'
     } = _ref,
     rest = _objectWithoutPropertiesLoose(_ref, _excluded);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antdV.Divider, _extends({
     className: (0, _classnames.default)('cap-divider-v2', className),
-    orientation: mapOrientation(orientation)
+    orientation: type,
+    titlePlacement: mapTitlePlacement(orientation)
   }, rest));
 };
 var _default = exports["default"] = CapDivider;