npm - @zolomedia/bifrost-client - Versions diffs - 1.7.74 - Mend

@zolomedia/bifrost-client 1.7.74

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (140) hide show

package/L1_Foundation/L1_Foundation.js +13 -0
package/L1_Foundation/bootstrap/bootstrap.js +11 -0
package/L1_Foundation/bootstrap/bootstrap_hooks.js +123 -0
package/L1_Foundation/bootstrap/bootstrap_index.js +15 -0
package/L1_Foundation/bootstrap/bootstrap_logger.js +135 -0
package/L1_Foundation/bootstrap/cdn_loader.js +217 -0
package/L1_Foundation/bootstrap/module_registry.js +102 -0
package/L1_Foundation/bootstrap/prism_loader.js +164 -0
package/L1_Foundation/config/client_config.js +110 -0
package/L1_Foundation/config/config.js +7 -0
package/L1_Foundation/connection/connection.js +8 -0
package/L1_Foundation/connection/websocket_connection.js +122 -0
package/L1_Foundation/constants/bifrost_constants.js +284 -0
package/L1_Foundation/constants/constants.js +7 -0
package/L1_Foundation/logger/logger.js +10 -0
package/L2_Handling/L2_Handling.js +15 -0
package/L2_Handling/cache/cache.js +22 -0
package/L2_Handling/cache/cache_constants.js +69 -0
package/L2_Handling/cache/orchestration/cache_manager.js +299 -0
package/L2_Handling/cache/orchestration/cache_orchestrator.js +260 -0
package/L2_Handling/cache/orchestration/orchestration.js +12 -0
package/L2_Handling/cache/storage/session_manager.js +289 -0
package/L2_Handling/cache/storage/storage.js +10 -0
package/L2_Handling/cache/storage/storage_manager.js +590 -0
package/L2_Handling/display/composite/composite.js +13 -0
package/L2_Handling/display/composite/dashboard_renderer.js +221 -0
package/L2_Handling/display/composite/swiper_renderer.js +564 -0
package/L2_Handling/display/composite/terminal_renderer.js +922 -0
package/L2_Handling/display/composite/wizard_conditional_renderer.js +274 -0
package/L2_Handling/display/display.js +30 -0
package/L2_Handling/display/feedback/feedback.js +11 -0
package/L2_Handling/display/feedback/progressbar_renderer.js +418 -0
package/L2_Handling/display/feedback/spinner_renderer.js +246 -0
package/L2_Handling/display/inputs/button_renderer.js +634 -0
package/L2_Handling/display/inputs/form_renderer.js +583 -0
package/L2_Handling/display/inputs/input_renderer.js +658 -0
package/L2_Handling/display/inputs/inputs.js +12 -0
package/L2_Handling/display/navigation/menu_renderer.js +206 -0
package/L2_Handling/display/navigation/navigation.js +11 -0
package/L2_Handling/display/navigation/navigation_renderer.js +703 -0
package/L2_Handling/display/orchestration/orchestration.js +11 -0
package/L2_Handling/display/orchestration/renderer.js +430 -0
package/L2_Handling/display/orchestration/zdisplay_orchestrator.js +1759 -0
package/L2_Handling/display/outputs/alert_renderer.js +161 -0
package/L2_Handling/display/outputs/audio_renderer.js +94 -0
package/L2_Handling/display/outputs/card_renderer.js +229 -0
package/L2_Handling/display/outputs/code_renderer.js +66 -0
package/L2_Handling/display/outputs/dl_renderer.js +131 -0
package/L2_Handling/display/outputs/header_renderer.js +162 -0
package/L2_Handling/display/outputs/icon_renderer.js +107 -0
package/L2_Handling/display/outputs/image_renderer.js +145 -0
package/L2_Handling/display/outputs/list_renderer.js +190 -0
package/L2_Handling/display/outputs/outputs.js +19 -0
package/L2_Handling/display/outputs/table_renderer.js +765 -0
package/L2_Handling/display/outputs/text_renderer.js +818 -0
package/L2_Handling/display/outputs/typography_renderer.js +293 -0
package/L2_Handling/display/outputs/video_renderer.js +116 -0
package/L2_Handling/display/primitives/document_structure_primitives.js +319 -0
package/L2_Handling/display/primitives/form_primitives.js +526 -0
package/L2_Handling/display/primitives/generic_containers.js +109 -0
package/L2_Handling/display/primitives/interactive_primitives.js +305 -0
package/L2_Handling/display/primitives/link_primitives.js +552 -0
package/L2_Handling/display/primitives/lists_primitives.js +262 -0
package/L2_Handling/display/primitives/media_primitives.js +383 -0
package/L2_Handling/display/primitives/primitives.js +19 -0
package/L2_Handling/display/primitives/semantic_element_primitive.js +226 -0
package/L2_Handling/display/primitives/table_primitives.js +528 -0
package/L2_Handling/display/primitives/typography_primitives.js +175 -0
package/L2_Handling/display/specialized/input_request_renderer.js +467 -0
package/L2_Handling/display/specialized/specialized.js +10 -0
package/L2_Handling/hooks/hooks.js +9 -0
package/L2_Handling/hooks/menu_integration.js +57 -0
package/L2_Handling/hooks/widget_hook_manager.js +292 -0
package/L2_Handling/message/message.js +8 -0
package/L2_Handling/message/message_handler.js +701 -0
package/L2_Handling/navigation/navigation.js +8 -0
package/L2_Handling/navigation/navigation_manager.js +403 -0
package/L2_Handling/zhooks/features/cache_live.js +287 -0
package/L2_Handling/zhooks/features/crumbs_live.js +292 -0
package/L2_Handling/zhooks/zhooks_manager.js +65 -0
package/L2_Handling/zvaf/zvaf.js +8 -0
package/L2_Handling/zvaf/zvaf_manager.js +334 -0
package/L3_Abstraction/L3_Abstraction.js +12 -0
package/L3_Abstraction/orchestrator/container_unwrapper.js +101 -0
package/L3_Abstraction/orchestrator/group_renderer.js +698 -0
package/L3_Abstraction/orchestrator/input_event_handler.js +797 -0
package/L3_Abstraction/orchestrator/metadata_processor.js +249 -0
package/L3_Abstraction/orchestrator/navbar_builder.js +201 -0
package/L3_Abstraction/orchestrator/orchestrator.js +13 -0
package/L3_Abstraction/orchestrator/wizard_gate_handler.js +360 -0
package/L3_Abstraction/renderer/renderer.js +1 -0
package/L3_Abstraction/session/session.js +1 -0
package/L4_Orchestration/L4_Orchestration.js +11 -0
package/L4_Orchestration/client/client.js +1 -0
package/L4_Orchestration/facade/facade.js +9 -0
package/L4_Orchestration/facade/manager_registry.js +118 -0
package/L4_Orchestration/facade/renderer_registry.js +274 -0
package/L4_Orchestration/lifecycle/asset_loader.js +255 -0
package/L4_Orchestration/lifecycle/initializer.js +135 -0
package/L4_Orchestration/lifecycle/lifecycle.js +8 -0
package/L4_Orchestration/rendering/facade.js +94 -0
package/L4_Orchestration/rendering/rendering.js +7 -0
package/LICENSE +21 -0
package/README.md +82 -0
package/bifrost_client.js +204 -0
package/bifrost_core.js +1686 -0
package/docs/ARCHITECTURE.md +111 -0
package/docs/PROTOCOL.md +106 -0
package/docs/RENDERERS.md +101 -0
package/docs/SECURITY.md +92 -0
package/package.json +24 -0
package/syntax/prism-zconfig.js +41 -0
package/syntax/prism-zenv.js +69 -0
package/syntax/prism-zolo-theme.css +288 -0
package/syntax/prism-zolo.js +380 -0
package/syntax/prism-zschema.js +38 -0
package/syntax/prism-zspark.js +25 -0
package/syntax/prism-zui.js +68 -0
package/zSys/accessibility/accessibility.js +10 -0
package/zSys/accessibility/emoji_accessibility.js +173 -0
package/zSys/dom/block_utils.js +122 -0
package/zSys/dom/container_utils.js +370 -0
package/zSys/dom/dom.js +13 -0
package/zSys/dom/dom_utils.js +328 -0
package/zSys/dom/encoding_utils.js +117 -0
package/zSys/dom/style_utils.js +71 -0
package/zSys/errors/error_display.js +299 -0
package/zSys/errors/errors.js +10 -0
package/zSys/theme/color_utils.js +274 -0
package/zSys/theme/dark_mode_utils.js +272 -0
package/zSys/theme/size_utils.js +256 -0
package/zSys/theme/spacing_utils.js +405 -0
package/zSys/theme/theme.js +14 -0
package/zSys/theme/zbase.css +1735 -0
package/zSys/theme/zbase_inject.js +161 -0
package/zSys/theme/ztheme_utils.js +305 -0
package/zSys/validation/error_boundary.js +201 -0
package/zSys/validation/validation.js +11 -0
package/zSys/validation/validation_utils.js +238 -0
package/zSys/zSys.js +14 -0

package/zSys/theme/zbase_inject.js ADDED Viewed

@@ -0,0 +1,161 @@
+/**
+ * zbase_inject.js — zbifrost-client JS behaviors (tabs, zTheme)
+ *
+ * Called once during bifrost_core.js startup:
+ *   import { injectZBase } from `${BASE_URL}zSys/theme/zbase_inject.js`;
+ *   await injectZBase(BASE_URL);
+ *
+ * CSS is now injected server-side by route_dispatcher.py as a synchronous
+ * <link rel="stylesheet"> in <head> — no async fetch, no timing races.
+ * This module only exposes window.zTheme (tabs, list-group behaviors).
+ */
+// ── Tab behavior ──────────────────────────────────────────────────────────────
+function _showTab(trigger) {
+  const targetSelector = trigger.getAttribute('data-bs-target') || trigger.getAttribute('href');
+  if (!targetSelector) return;
+  const targetPane = document.querySelector(targetSelector);
+  if (!targetPane) return;
+  const tabContent = targetPane.closest('.zTab-content');
+  const nav        = trigger.closest('.zNav, [role="tablist"]');
+  // Deactivate all triggers in the same nav group
+  const allTriggers = nav
+    ? nav.querySelectorAll('[data-bs-toggle="tab"]')
+    : [trigger];
+  allTriggers.forEach(t => {
+    t.classList.remove('zActive');
+    t.setAttribute('aria-selected', 'false');
+    t.setAttribute('tabindex', '-1');
+  });
+  // Activate the clicked trigger
+  trigger.classList.add('zActive');
+  trigger.setAttribute('aria-selected', 'true');
+  trigger.removeAttribute('tabindex');
+  // Hide all panes in the same tab-content
+  if (tabContent) {
+    tabContent.querySelectorAll('.zTab-pane').forEach(p => {
+      p.classList.remove('zActive', 'zShow');
+    });
+  }
+  // Show target pane
+  if (targetPane.classList.contains('zFade')) {
+    targetPane.classList.add('zActive');
+    requestAnimationFrame(() => targetPane.classList.add('zShow'));
+  } else {
+    targetPane.classList.add('zActive');
+  }
+  // Fire custom event for lazy-loading hooks
+  trigger.dispatchEvent(new CustomEvent('zTabShown', {
+    bubbles: true,
+    detail: { trigger, pane: targetPane }
+  }));
+}
+function initTabs() {
+  const triggers = document.querySelectorAll('[data-bs-toggle="tab"]');
+  if (triggers.length === 0) return;
+  triggers.forEach(trigger => {
+    if (trigger._zTabInited) return;
+    trigger._zTabInited = true;
+    trigger.setAttribute('role', 'tab');
+    if (trigger.classList.contains('zActive')) {
+      trigger.setAttribute('aria-selected', 'true');
+    } else {
+      trigger.setAttribute('aria-selected', 'false');
+      trigger.setAttribute('tabindex', '-1');
+    }
+    trigger.addEventListener('click', e => {
+      e.preventDefault();
+      if (!trigger.classList.contains('zActive')) _showTab(trigger);
+    });
+  });
+}
+// ── List-group tab behavior ───────────────────────────────────────────────────
+function initListGroup() {
+  const triggers = document.querySelectorAll('[data-bs-toggle="list"]');
+  if (triggers.length === 0) return;
+  triggers.forEach(trigger => {
+    if (trigger._zListInited) return;
+    trigger._zListInited = true;
+    trigger.setAttribute('aria-selected', trigger.classList.contains('zActive') ? 'true' : 'false');
+    trigger.addEventListener('click', e => {
+      e.preventDefault();
+      if (trigger.classList.contains('zActive')) return;
+      const targetId  = trigger.getAttribute('href') || trigger.getAttribute('data-bs-target');
+      const targetPane = targetId ? document.querySelector(targetId) : null;
+      if (!targetPane) return;
+      const listGroup  = trigger.closest('.zList-group');
+      const tabContent = targetPane.closest('.zTab-content');
+      if (listGroup) {
+        listGroup.querySelectorAll('.zList-group-item').forEach(item => {
+          item.classList.remove('zActive');
+          item.setAttribute('aria-selected', 'false');
+        });
+      }
+      trigger.classList.add('zActive');
+      trigger.setAttribute('aria-selected', 'true');
+      if (tabContent) {
+        tabContent.querySelectorAll('.zTab-pane').forEach(p => p.classList.remove('zActive', 'zShow'));
+      }
+      if (targetPane.classList.contains('zFade')) {
+        targetPane.classList.add('zActive');
+        requestAnimationFrame(() => targetPane.classList.add('zShow'));
+      } else {
+        targetPane.classList.add('zActive');
+      }
+      trigger.dispatchEvent(new CustomEvent('zTabShown', {
+        bubbles: true,
+        detail: { trigger, pane: targetPane }
+      }));
+    });
+  });
+}
+// ── window.zTheme public API ──────────────────────────────────────────────────
+function _exposeWindowZTheme() {
+  if (typeof window === 'undefined') return;
+  if (window.zTheme?._zbifrost) return; // already set by this module
+  window.zTheme = {
+    _zbifrost: true, // sentinel: sourced from zbifrost-client, not external CDN
+    initTabs,
+    initListGroup,
+  };
+}
+// ── Entry point ───────────────────────────────────────────────────────────────
+/**
+ * Inject structural CSS and expose window.zTheme.
+ * Called once from bifrost_core.js during _onConnect().
+ *
+ * @param {string} baseUrl - CDN base URL (same as bifrost_core.js BASE_URL)
+ */
+export async function injectZBase(_baseUrl) {
+  _exposeWindowZTheme();
+  // CSS is injected server-side — nothing async to do here.
+}

package/zSys/theme/ztheme_utils.js ADDED Viewed

@@ -0,0 +1,305 @@
+/**
+ *
+ * zTheme Utilities - zCLI to zTheme Class Mappings
+ *
+ *
+ * Pure functions for mapping zCLI color/style names to zTheme CSS classes.
+ * Uses lookup tables for O(1) performance and consistency.
+ *
+ * @module utils/ztheme_utils
+ * @layer 2
+ * @pattern Pure Functions
+ *
+ * Dependencies:
+ * - Layer 0: None (pure JavaScript)
+ *
+ * Exports:
+ * - getButtonColorClass: Map zCLI color to zTheme button class
+ * - getButtonSizeClass: Map size to zTheme button size class
+ * - getButtonStyleClass: Map style variant to zTheme button style class
+ * - getAlertColorClass: Map event type to zTheme alert class
+ * - getBadgeColorClass: Map zCLI color to zTheme badge class
+ * - getTextColorClass: Map zCLI color to zTheme text color class
+ * - isValidZThemeClass: Validate if string is valid zTheme class
+ * - indentToHeaderTag: Convert indent level to HTML header tag
+ *
+ * Example:
+ * ```javascript
+ * import { getButtonColorClass, getButtonSizeClass } from './ztheme_utils.js';
+ *
+ * const colorClass = getButtonColorClass('primary');  // 'zBtnPrimary'
+ * const sizeClass = getButtonSizeClass('lg');          // 'zBtn-lg'
+ * ```
+ */
+//
+// Color Mappings (zCLI → zTheme)
+//
+/**
+ * Button color mapping: zCLI color names → zTheme button classes
+ * @const {Object<string, string>}
+ */
+const BUTTON_COLOR_MAP = {
+  'primary': 'zBtn-primary',
+  'secondary': 'zBtn-secondary',
+  'success': 'zBtn-success',
+  'danger': 'zBtn-danger',
+  'warning': 'zBtn-warning',
+  'info': 'zBtn-info',
+  'light': 'zBtn-light',
+  'dark': 'zBtn-dark',
+  'link': 'zBtn-link'
+};
+/**
+ * Alert color mapping: zCLI event types → zTheme zSignal classes
+ * Returns ONLY the color-specific class (base zSignal class added by renderer)
+ * @const {Object<string, string>}
+ */
+const ALERT_COLOR_MAP = {
+  'error': 'zSignal-error',
+  'warning': 'zSignal-warning',
+  'success': 'zSignal-success',
+  'info': 'zSignal-info',
+  'danger': 'zSignal-error',      // danger → error (zTheme uses error)
+  'primary': 'zSignal-primary',
+  'secondary': 'zSignal-secondary',
+  'light': 'zSignal-light',
+  'dark': 'zSignal-dark'
+};
+/**
+ * Badge color mapping: zCLI colors → zTheme badge classes
+ * @const {Object<string, string>}
+ */
+const BADGE_COLOR_MAP = {
+  'primary': 'zBadge zBgPrimary',
+  'secondary': 'zBadge zBgSecondary',
+  'success': 'zBadge zBgSuccess',
+  'danger': 'zBadge zBgDanger',
+  'warning': 'zBadge zBgWarning',
+  'info': 'zBadge zBgInfo',
+  'light': 'zBadge zBgLight',
+  'dark': 'zBadge zBgDark'
+};
+/**
+ * Text color mapping: zCLI colors → zTheme text color classes
+ * @const {Object<string, string>}
+ */
+const TEXT_COLOR_MAP = {
+  'primary': 'zText-primary',
+  'secondary': 'zText-secondary',
+  'success': 'zText-success',
+  'danger': 'zText-danger',
+  'warning': 'zText-warning',
+  'info': 'zText-info',
+  'light': 'zText-light',
+  'dark': 'zText-dark',
+  'muted': 'zText-muted',
+  'white': 'zText-white'
+};
+//
+// Button Utilities
+//
+/**
+ * Get zTheme button color class from zCLI color name
+ *
+ * @param {string} zColor - zCLI color name (primary, danger, success, etc)
+ * @returns {string} zTheme button class (zBtn-primary, zBtn-danger, etc)
+ *
+ * @example
+ * getButtonColorClass('primary')   // 'zBtn-primary'
+ * getButtonColorClass('DANGER')    // 'zBtn-danger' (case-insensitive)
+ * getButtonColorClass('invalid')   // 'zBtn-primary' (fallback)
+ * getButtonColorClass(null)        // 'zBtn-primary' (fallback)
+ */
+export function getButtonColorClass(zColor) {
+  const normalized = zColor?.toLowerCase() || 'primary';
+  return BUTTON_COLOR_MAP[normalized] || 'zBtn-primary';
+}
+/**
+ * Get zTheme button size class
+ *
+ * @param {string} size - Size (sm, md, lg)
+ * @returns {string} zTheme size class (zBtn-sm, zBtn-lg, or empty string for md)
+ *
+ * @example
+ * getButtonSizeClass('sm')   // 'zBtn-sm'
+ * getButtonSizeClass('md')   // '' (default, no class needed)
+ * getButtonSizeClass('lg')   // 'zBtn-lg'
+ * getButtonSizeClass(null)   // '' (default)
+ */
+export function getButtonSizeClass(size) {
+  const normalized = size?.toLowerCase() || 'md';
+  const SIZE_MAP = {
+    'sm': 'zBtn-sm',
+    'small': 'zBtn-sm',
+    'md': '',
+    'medium': '',
+    'lg': 'zBtn-lg',
+    'large': 'zBtn-lg'
+  };
+  return SIZE_MAP[normalized] || '';
+}
+/**
+ * Get zTheme button style variant class
+ *
+ * NOTE: For outline buttons, use getButtonOutlineClass() instead.
+ * This only handles non-color-specific styles.
+ *
+ * @param {string} style - Style variant (default, link)
+ * @returns {string} zTheme style class or empty for default
+ *
+ * @example
+ * getButtonStyleClass('default')   // '' (no class needed)
+ * getButtonStyleClass('link')      // 'zBtn-link'
+ */
+export function getButtonStyleClass(style) {
+  const normalized = style?.toLowerCase() || 'default';
+  const STYLE_MAP = {
+    'default': '',
+    'solid': '',
+    'link': 'zBtn-link'
+  };
+  return STYLE_MAP[normalized] || '';
+}
+/**
+ * Get zTheme outline button class (color-specific)
+ *
+ * @param {string} zColor - zCLI color name
+ * @returns {string} zTheme outline button class (e.g., 'zBtn-outline-primary')
+ *
+ * @example
+ * getButtonOutlineClass('primary')  // 'zBtn-outline-primary'
+ * getButtonOutlineClass('danger')   // 'zBtn-outline-danger'
+ */
+export function getButtonOutlineClass(zColor) {
+  const normalized = zColor?.toLowerCase() || 'primary';
+  return `zBtn-outline-${normalized}`;
+}
+//
+// Alert Utilities
+//
+/**
+ * Get zTheme signal color class from zCLI event type
+ *
+ * Returns ONLY the color-specific class (e.g., 'zSignal-success').
+ * The base 'zSignal' class should be added separately by the renderer.
+ *
+ * @param {string} eventType - zCLI event type (error, warning, success, info)
+ * @returns {string} zTheme signal color class (e.g., 'zSignal-success')
+ *
+ * @example
+ * getAlertColorClass('error')    // 'zSignal-error'
+ * getAlertColorClass('warning')  // 'zSignal-warning'
+ * getAlertColorClass('success')  // 'zSignal-success'
+ * getAlertColorClass('info')     // 'zSignal-info'
+ */
+export function getAlertColorClass(eventType) {
+  const normalized = eventType?.toLowerCase() || 'info';
+  return ALERT_COLOR_MAP[normalized] || 'zSignal-info';
+}
+//
+// Badge Utilities
+//
+/**
+ * Get zTheme badge color classes from zCLI color
+ *
+ * @param {string} zColor - zCLI color name
+ * @returns {string} zTheme badge classes (e.g., 'zBadge zBgPrimary')
+ *
+ * @example
+ * getBadgeColorClass('primary')  // 'zBadge zBgPrimary'
+ * getBadgeColorClass('danger')   // 'zBadge zBgDanger'
+ */
+export function getBadgeColorClass(zColor) {
+  const normalized = zColor?.toLowerCase() || 'primary';
+  return BADGE_COLOR_MAP[normalized] || 'zBadge zBgPrimary';
+}
+//
+// Text Utilities
+//
+/**
+ * Get zTheme text color class from zCLI color
+ *
+ * @param {string} zColor - zCLI color name
+ * @returns {string} zTheme text color class (e.g., 'zText-primary')
+ *
+ * @example
+ * getTextColorClass('primary')  // 'zText-primary'
+ * getTextColorClass('danger')   // 'zText-danger'
+ * getTextColorClass('muted')    // 'zText-muted'
+ */
+export function getTextColorClass(zColor) {
+  const normalized = zColor?.toLowerCase() || 'dark';
+  return TEXT_COLOR_MAP[normalized] || 'zText-dark';
+}
+//
+// Typography Utilities
+//
+/**
+ * Convert indent level to HTML header tag
+ *
+ * NOTE: indent 0 is reserved for special cases (flush/hero layouts).
+ * This function maps indent 1-6 directly to h1-h6 semantic HTML tags.
+ *
+ * @param {number} indent - Indent level (1-6, where 1=h1, 6=h6)
+ * @returns {string} HTML tag name ('h1' through 'h6')
+ *
+ * @example
+ * indentToHeaderTag(1)   // 'h1'
+ * indentToHeaderTag(2)   // 'h2'
+ * indentToHeaderTag(6)   // 'h6'
+ * indentToHeaderTag(10)  // 'h6' (capped at h6)
+ */
+export function indentToHeaderTag(indent) {
+  // Clamp indent between 1 and 6 (indent 0 reserved for special cases)
+  const level = Math.max(1, Math.min(6, parseInt(indent) || 1));
+  return `h${level}`;
+}
+//
+// Validation Utilities
+//
+/**
+ * Validate if a string is a valid zTheme class name
+ *
+ * @param {string} className - Class name to validate
+ * @returns {boolean} True if valid zTheme class
+ *
+ * @example
+ * isValidZThemeClass('zBtn')           // true
+ * isValidZThemeClass('zBtnPrimary')    // true
+ * isValidZThemeClass('zAlert')         // true
+ * isValidZThemeClass('not-ztheme')     // false
+ * isValidZThemeClass('btn-primary')    // false
+ */
+export function isValidZThemeClass(className) {
+  if (!className || typeof className !== 'string') {
+    return false;
+  }
+  // zTheme classes start with 'z' followed by uppercase letter
+  return /^z[A-Z]/.test(className);
+}

package/zSys/validation/error_boundary.js ADDED Viewed

@@ -0,0 +1,201 @@
+/**
+ *
+ * Error Boundary Utility - Standardized Error Handling for Renderers
+ *
+ *
+ * Provides error boundary wrappers for renderer methods to ensure
+ * graceful degradation when rendering fails.
+ */
+// ─────────────────────────────────────────────────────────────────
+// Imports
+// ─────────────────────────────────────────────────────────────────
+// Layer 2: Utilities
+import { createElement } from '../dom/dom_utils.js';
+/**
+ * Create a fallback error UI element
+ * @param {Object} errorInfo - Error information
+ * @param {Error} errorInfo.error - The error that occurred
+ * @param {string} errorInfo.component - Component name that failed
+ * @param {Object} errorInfo.data - Data that was being rendered
+ * @returns {HTMLElement} Error display element
+ */
+export function createErrorFallback(errorInfo) {
+  const { error, component = 'Component', data: _data = {} } = errorInfo;
+  const container = createElement('div');
+  container.className = 'bifrost-render-error';
+  container.style.cssText = `
+    background: #fee;
+    border-left: 4px solid #c33;
+    padding: 1rem;
+    margin: 0.5rem 0;
+    border-radius: 4px;
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+    font-size: 0.875rem;
+  `;
+  const title = createElement('div');
+  title.style.cssText = 'font-weight: 600; color: #c33; margin-bottom: 0.5rem;';
+  title.textContent = `[WARN] ${component} Render Error`;
+  const message = createElement('div');
+  message.style.cssText = 'color: #666; margin-bottom: 0.5rem;';
+  message.textContent = error.message || 'An error occurred while rendering this component';
+  const details = createElement('details');
+  details.style.cssText = 'margin-top: 0.5rem;';
+  const summary = createElement('summary');
+  summary.style.cssText = 'cursor: pointer; color: #999; font-size: 0.75rem;';
+  summary.textContent = 'Show technical details';
+  const stack = createElement('pre');
+  stack.style.cssText = `
+    margin-top: 0.5rem;
+    padding: 0.5rem;
+    background: #f9f9f9;
+    border-radius: 4px;
+    overflow-x: auto;
+    font-size: 0.75rem;
+    color: #666;
+  `;
+  stack.textContent = error.stack || 'No stack trace available';
+  details.appendChild(summary);
+  details.appendChild(stack);
+  container.appendChild(title);
+  container.appendChild(message);
+  container.appendChild(details);
+  return container;
+}
+/**
+ * Wrap a renderer method with error boundary
+ * @param {Function} renderFn - The render function to wrap
+ * @param {Object} options - Options for error handling
+ * @param {string} options.component - Component name for error messages
+ * @param {Function} options.logger - Logger instance
+ * @param {Function} options.onError - Optional error handler callback
+ * @param {boolean} options.throwOnError - Whether to re-throw errors (default: false)
+ * @returns {Function} Wrapped render function
+ */
+export function withErrorBoundary(renderFn, options = {}) {
+  const {
+    component = 'Unknown',
+    logger = console,
+    onError = null,
+    throwOnError = false
+  } = options;
+  return function wrappedRender(...args) {
+    try {
+      const result = renderFn.apply(this, args);
+      // Handle async render functions
+      if (result && typeof result.then === 'function') {
+        return result.catch(error => {
+          logger.error(`[${component}] Async render error:`, error);
+          if (onError) {
+            try {
+              onError(error, args);
+            } catch (handlerError) {
+              logger.error(`[${component}] Error in error handler:`, handlerError);
+            }
+          }
+          if (throwOnError) {
+            throw error;
+          }
+          // Return fallback UI for async errors
+          return createErrorFallback({
+            error,
+            component,
+            data: args[0]
+          });
+        });
+      }
+      return result;
+    } catch (error) {
+      logger.error(`[${component}] Render error:`, error);
+      if (onError) {
+        try {
+          onError(error, args);
+        } catch (handlerError) {
+          logger.error(`[${component}] Error in error handler:`, handlerError);
+        }
+      }
+      if (throwOnError) {
+        throw error;
+      }
+      // Return fallback UI for sync errors
+      return createErrorFallback({
+        error,
+        component,
+        data: args[0]
+      });
+    }
+  };
+}
+/**
+ * Create a safe wrapper for renderer classes
+ * @param {Class} RendererClass - The renderer class to wrap
+ * @param {Object} options - Options for error handling
+ * @returns {Class} Wrapped renderer class
+ */
+export function createSafeRenderer(RendererClass, options = {}) {
+  return class SafeRenderer extends RendererClass {
+    constructor(...args) {
+      super(...args);
+      // Wrap render method if it exists
+      if (typeof this.render === 'function') {
+        const originalRender = this.render.bind(this);
+        this.render = withErrorBoundary(originalRender, {
+          component: RendererClass.name || 'Renderer',
+          logger: this.logger || console,
+          ...options
+        });
+      }
+      // Wrap renderHTML method if it exists
+      if (typeof this.renderHTML === 'function') {
+        const originalRenderHTML = this.renderHTML.bind(this);
+        this.renderHTML = withErrorBoundary(originalRenderHTML, {
+          component: `${RendererClass.name || 'Renderer'}.renderHTML`,
+          logger: this.logger || console,
+          ...options
+        });
+      }
+    }
+  };
+}
+/**
+ * Decorator for renderer methods (for future use with decorators proposal)
+ * Usage: @errorBoundary({ component: 'MyRenderer' })
+ */
+export function errorBoundary(options = {}) {
+  return function decorator(target, propertyKey, descriptor) {
+    const originalMethod = descriptor.value;
+    descriptor.value = withErrorBoundary(originalMethod, {
+      component: `${target.constructor.name}.${propertyKey}`,
+      ...options
+    });
+    return descriptor;
+  };
+}

package/zSys/validation/validation.js ADDED Viewed

@@ -0,0 +1,11 @@
+/**
+ * zSys/validation - Validation Utilities Barrel
+ *
+ * Validation and error boundary utilities.
+ *
+ * @module zSys/validation
+ * @layer zSys (System Utilities)
+ */
+export * from './error_boundary.js';
+export * from './validation_utils.js';