Chore: Changelog

Author: jlukic

CHANGELOG.md

@@ -17,6 +17,8 @@ Please note after `1.0` Semver will be followed using normal protocols.
 
 ## Features
 * **Utils** - Clone now has a new setting `preserveDOM` which will not clone DOM nodes if present. This can be useful in scenarios where you want to clone an object with references to the live DOM you want to maintain
+* **Utils** - Added `log()` function for flexible logging with formatting, namespacing, timestamps, and JSON output support
+* **Utils** - Renamed `errors.js` module to `debug.js` to better reflect its logging and debugging capabilities
 
 ## Breaking Changes
 * **Utils** - `deepExtend` now preserves non clonables by default. This is to prevent very common scenarios where extend is used with custom classes or dom elements where the original reference should be maintained. Note this still can be overwritten using `deepExtend(obj1, obj2, { preserveNonCloneable: false });`

ai/packages/query.md

@@ -174,6 +174,7 @@ The Query class provides a comprehensive set of methods organized into logical c
 - `clippingParent()` - Get element that clips visual bounds
 - `containingParent()` - Get simple containing parent (offsetParent)
 - `positioningParent(options)` - Get accurate positioning context parent
+- `scrollParent(options)` - Get nearest scrollable container or all scroll parents in hierarchy
 
 ### Visibility and Display
 - `show(options)` - Show hidden elements using natural display value
@@ -951,6 +952,40 @@ function positionTooltip($tooltip, $trigger) {
   $tooltip.css({ top: `${top}px`, left: `${left}px` });
 }
 
+// Position tooltip within scrollable container
+function positionTooltipInScroller($tooltip, $trigger) {
+  const $scrollContainer = $trigger.scrollParent();
+
+  if ($scrollContainer[0] !== window) {
+    // Element is within a scrollable container
+    const scrollBounds = $scrollContainer.bounds();
+    const triggerPos = $trigger.position({ relativeTo: $scrollContainer });
+
+    // Position tooltip within scroll container bounds
+    $tooltip.css({
+      position: 'absolute',
+      top: triggerPos.top + $trigger.height() + 5,
+      left: Math.min(triggerPos.left, scrollBounds.width - $tooltip.width())
+    });
+
+    // Append to scroll container to inherit scrolling
+    $scrollContainer.append($tooltip);
+  } else {
+    // Use viewport positioning
+    positionTooltip($tooltip, $trigger);
+  }
+}
+
+// Handle scroll events on appropriate containers
+function setupScrollAwareTooltip($trigger, $tooltip) {
+  const $allScrollers = $trigger.scrollParent({ all: true });
+
+  $allScrollers.on('scroll', () => {
+    // Hide tooltip when any parent scrolls
+    $tooltip.hide();
+  });
+}
+
 // Relative positioning for connected elements
 $('#draggable').on('drag', (event) => {
   // Position connected indicator relative to draggable

ai/packages/utils.md

@@ -26,7 +26,7 @@ The package is organized into **17 specialized modules**, each focused on a spec
 ├── crypto.js      ← Hashing and ID generation
 ├── equality.js    ← Deep equality comparison
 ├── cloning.js     ← Deep cloning of objects and arrays
-├── errors.js      ← Error handling and async error throwing
+├── debug.js       ← Logging, debugging, and error handling
 ├── environment.js  ← Environment detection (server/client/dev/CI)
 └── regexp.js      ← Regular expression and HTML escaping
 ```
@@ -553,14 +553,39 @@ cloned.b.c = 99;
 console.log(obj1.b.c);                             // 2 (original unchanged)
 ```
 
-## Error Handling (errors.js)
+## Debug Utilities (debug.js)
 
-### Error Management
+### Logging and Error Management
 ```javascript
-import { fatal } from '@semantic-ui/utils';
+import { log, fatal } from '@semantic-ui/utils';
 
-// Fatal error handling with custom messages
-fatal('Critical system error', { exit: true });
+// Flexible logging with levels and formatting
+log('Application started', 'info');                     // Basic info log
+log('User action', 'debug', {                           // Debug with namespace
+  namespace: 'UserService',
+  data: [{ action: 'login', userId: 123 }]
+});
+
+// JSON format for structured logging
+log('API response', 'info', {                           // Structured output
+  format: 'json',
+  namespace: 'ApiClient',
+  timestamp: true,
+  data: [{ status: 200, endpoint: '/api/users' }]
+});
+
+// Custom styling and colors
+log('Important notice', 'warn', {                       // Custom title styling
+  title: 'SYSTEM',
+  titleColor: '#FF6B35',
+  timestamp: true
+});
+
+// Fatal error handling with metadata
+fatal('Critical system error', {                        // Async error throwing
+  errorType: TypeError,
+  metadata: { code: 'SYS_ERROR' }
+});
 ```
 
 ## Iteration Utilities (looping.js)