@furystack/shades 11.0.35 → 12.0.0

package/CHANGELOG.md

@@ -1,5 +1,342 @@
 # Changelog
 
+## [12.0.0] - 2026-02-09
+
+### 📝 Documentation
+
+### ScreenService API Documentation
+
+Improved JSDoc documentation for `ScreenService` with usage examples for responsive UI development.
+
+**Documented APIs:**
+
+- `screenSize.atLeast[size]` - Observable breakpoint detection
+- `orientation` - Observable screen orientation tracking
+- `breakpoints` - Breakpoint threshold definitions
+
+**Breakpoint Thresholds:**
+
+- `xs`: 0px+ (all sizes)
+- `sm`: 600px+ (small tablets and up)
+- `md`: 960px+ (tablets and up)
+- `lg`: 1280px+ (desktops and up)
+- `xl`: 1920px+ (large desktops)
+
+### useObservable Documentation
+
+Enhanced `useObservable` JSDoc with examples for the `onChange` callback option.
+
+### 🧪 Tests
+
+- Added integration tests for Shade resource management (`useObservable`, `useDisposable`)
+- Added tests for `ScreenService` breakpoints, observables, and disposal
+- Updated unit and integration tests to use `updateComponent()` instead of the removed `callConstructed()`
+- Replaced `constructed` callback test with `useDisposable` cleanup test
+- Updated integration tests to use `flushUpdates()` for asserting DOM state after microtask-based rendering
+- Added test for batching multiple synchronous observable changes into a single render
+- Added test for coalescing multiple `updateComponent()` calls into a single render pass
+- Added tests for `NestedRouter` covering route matching, nested layouts, lifecycle hooks, `notFound` fallback, and URL parameter extraction
+- Added tests for `NestedRouteLink` covering SPA navigation, parameterized route compilation, and `createNestedRouteLink` type constraints
+- Refactored existing `Router`, `LazyLoad`, `LinkToRoute`, `RouteLink`, and integration tests to use `usingAsync` for proper `Injector` disposal
+- Added `vnode.spec.ts` with unit tests for VNode creation, flattening, mounting, patching, prop diffing, and unmounting
+- Added `vnode.integration.spec.tsx` with integration tests covering VNode reconciliation within Shade components
+- Added `shade-host-props-ref.integration.spec.tsx` with tests for `useHostProps` and `useRef` behaviors
+- Added tests for `ResourceManager.useObservable` observable switching behavior when a different observable reference is passed for the same key
+- Updated existing integration tests to use `flushUpdates()` and the new API
+
+### 💥 Breaking Changes
+
+### Removed `constructed` callback from `Shade()`
+
+The `constructed` option has been removed from the `Shade()` component definition. The `callConstructed()` method has also been removed from the `JSX.Element` interface. Any cleanup function returned by `constructed` is no longer supported.
+
+**Migration:** Move initialization logic into `render` using `useDisposable()` for one-time setup that needs cleanup.
+
+```typescript
+// ❌ Before
+const MyComponent = Shade({
+  shadowDomName: 'my-component',
+  constructed: ({ element }) => {
+    const listener = () => { /* ... */ }
+    window.addEventListener('click', listener)
+    return () => window.removeEventListener('click', listener)
+  },
+  render: () => <div>Hello</div>,
+})
+
+// ✅ After
+const MyComponent = Shade({
+  shadowDomName: 'my-component',
+  render: ({ element, useDisposable }) => {
+    useDisposable('click-handler', () => {
+      const listener = () => { /* ... */ }
+      window.addEventListener('click', listener)
+      return { [Symbol.dispose]: () => window.removeEventListener('click', listener) }
+    })
+    return <div>Hello</div>
+  },
+})
+```
+
+**Impact:** All components using the `constructed` callback must be updated.
+
+### Rendering Engine Replaced with VNode-Based Reconciliation
+
+The rendering engine has been replaced with a lightweight VNode-based reconciler. Instead of creating real DOM elements during each render and diffing them, the JSX factory now produces VNode descriptors during render mode. A reconciler diffs the previous VNode tree against the new one and applies surgical DOM updates using tracked element references.
+
+**Impact:** All components using the `element` parameter from `RenderOptions` need to be updated. Components using `onAttach` or `onDetach` lifecycle hooks need to migrate to `useDisposable`.
+
+### `element` Removed from `RenderOptions`
+
+The `element` property (direct reference to the host custom element) has been removed from `RenderOptions`. Components should no longer imperatively mutate the host element.
+
+**Migration:** Use the new `useHostProps` hook to declaratively set attributes and styles on the host element.
+
+```typescript
+// ❌ Before
+render: ({ element, props }) => {
+  element.setAttribute('data-variant', props.variant)
+  element.style.setProperty('--color', colors.main)
+  // ...
+}
+
+// ✅ After
+render: ({ useHostProps, props }) => {
+  useHostProps({
+    'data-variant': props.variant,
+    style: { '--color': colors.main },
+  })
+  // ...
+}
+```
+
+### `onAttach` and `onDetach` Lifecycle Hooks Removed
+
+The `onAttach` and `onDetach` component lifecycle hooks have been removed. Use `useDisposable` or `connectedCallback`/`disconnectedCallback` for setup and teardown logic.
+
+```typescript
+// ❌ Before
+Shade({
+  shadowDomName: 'my-component',
+  onAttach: ({ element }) => {
+    /* setup */
+  },
+  onDetach: ({ element }) => {
+    /* cleanup */
+  },
+  render: ({ props }) => {
+    /* ... */
+  },
+})
+
+// ✅ After
+Shade({
+  shadowDomName: 'my-component',
+  render: ({ props, useDisposable }) => {
+    useDisposable('setup', () => {
+      /* setup */
+      return {
+        [Symbol.dispose]: () => {
+          /* cleanup */
+        },
+      }
+    })
+    // ...
+  },
+})
+```
+
+### 📚 Documentation
+
+- Updated README to remove references to `constructed` and `initialState`, and to recommend `useDisposable` for one-time setup with cleanup
+- Removed outdated note from README about DOM morphing behavior
+
+### ⚠️ Changed
+
+### Behavioral change: `updateComponent()` is now asynchronous
+
+`updateComponent()` no longer renders synchronously. Any code that calls `updateComponent()` (or triggers it via observable changes) and immediately inspects the DOM will now see stale state. Use `await flushUpdates()` to wait for pending renders to complete before reading the DOM.
+
+### ⚡ Performance
+
+### Microtask-based batched component updates
+
+`updateComponent()` now schedules renders via `queueMicrotask()` instead of executing them synchronously. Multiple calls to `updateComponent()` within the same synchronous block (e.g. several observable changes) are coalesced into a single render pass, reducing unnecessary DOM updates.
+
+- Component updates are batched via `queueMicrotask`, coalescing multiple `updateComponent()` calls into a single render pass
+- VNode props are shallow-compared to skip unnecessary DOM updates
+- Style diffing patches only changed properties instead of replacing the entire style
+
+### ✨ Features
+
+### New `NestedRouter` component
+
+Added a `NestedRouter` component that supports hierarchical route definitions with parent/child relationships. Parent routes receive an `outlet` prop containing the rendered child route, enabling layout composition patterns (e.g. a shared layout wrapping page-specific content).
+
+Routes are defined as a nested `Record` where keys are URL patterns (using `path-to-regexp`). The matching algorithm builds a chain from outermost to innermost route, then renders inside-out so each parent wraps its child.
+
+**Usage:**
+
+```typescript
+import { NestedRouter, createComponent } from '@furystack/shades'
+
+const routes = {
+  '/': {
+    component: ({ outlet }) => (
+      <div>
+        <nav>Shared Navigation</nav>
+        {outlet}
+      </div>
+    ),
+    children: {
+      '/': { component: () => <div>Home</div> },
+      '/about': { component: () => <div>About</div> },
+    },
+  },
+}
+
+<NestedRouter routes={routes} notFound={<div>404</div>} />
+```
+
+Key features:
+
+- Hierarchical route matching with `buildMatchChain()` - matches from outermost to innermost route
+- Lifecycle hooks (`onVisit`/`onLeave`) scoped per route level, only triggered for routes that actually change
+- `findDivergenceIndex()` for efficient diffing - sibling navigation only triggers leave/visit for the changed subtree
+- `notFound` fallback when no routes match
+
+### New `NestedRouteLink` and `createNestedRouteLink` components
+
+Added `NestedRouteLink` for SPA navigation with type-safe parameterized routes. It intercepts clicks to use `history.pushState` and compiles URL parameters (e.g. `/users/:id`) automatically.
+
+`createNestedRouteLink()` creates a narrowed version of `NestedRouteLink` constrained to a specific route tree, so TypeScript only accepts valid paths and requires `params` when the route has parameters.
+
+**Usage:**
+
+```typescript
+import { NestedRouteLink, createNestedRouteLink } from '@furystack/shades'
+
+// Basic usage — params are inferred from the href pattern
+<NestedRouteLink href="/users/:id" params={{ id: '123' }}>User</NestedRouteLink>
+
+// Type-safe usage — constrained to a route tree
+const AppLink = createNestedRouteLink<typeof appRoutes>()
+<AppLink href="/buttons">Buttons</AppLink>
+```
+
+### Route type utilities
+
+Added type-level utilities for working with nested route trees:
+
+- `ExtractRoutePaths<T>` - recursively extracts all valid full URL paths from a nested route tree
+- `ExtractRouteParams<T>` - extracts parameter names from a URL pattern into a typed record
+- `ConcatPaths<Parent, Child>` - concatenates parent and child paths handling the `/` root
+- `UrlTree<TPaths>` - validates URL constant objects against a set of valid paths
+
+### VNode-Based Reconciliation Engine
+
+Introduced a new `vnode.ts` module that implements a VNode-based virtual DOM reconciler. The JSX factory produces lightweight VNode descriptors during component renders, which are then diffed against the previous tree to apply minimal DOM updates. This eliminates the overhead of creating and diffing real DOM elements on every render cycle.
+
+### `useHostProps` Hook
+
+Added `useHostProps` to `RenderOptions`, enabling components to declaratively set attributes, data attributes, ARIA attributes, event handlers, and styles (including CSS custom properties) on the host custom element. It can be called multiple times per render; calls are merged and diffed against the previous render.
+
+### `useRef` Hook
+
+Added `useRef` to `RenderOptions`, allowing components to create mutable ref objects that capture references to child DOM elements. Refs are cached by key and persist across renders. The ref's `current` property is set to the DOM element after mount and `null` on unmount.
+
+```typescript
+const inputRef = useRef<HTMLInputElement>('input')
+// In JSX:
+<input ref={inputRef} />
+// Later:
+inputRef.current?.focus()
+```
+
+### `ref` Prop Support on Intrinsic Elements
+
+Added a `ref` property to `PartialElement<T>`, enabling `ref` objects to be passed to any intrinsic JSX element (e.g., `<div ref={myRef} />`). The VNode reconciler handles mounting and unmounting refs automatically.
+
+### Native SVG Element Support
+
+Added first-class SVG support with proper namespace handling. SVG elements are now created with `createElementNS` using the correct SVG namespace, and attributes are applied via `setAttribute` instead of property assignment. This includes:
+
+- A new `svg.ts` module with SVG tag detection and namespace constants
+- A new `svg-types.ts` module with typed SVG attribute interfaces for all standard SVG elements (shapes, gradients, filters, animations, etc.)
+- Updated `IntrinsicElements` with proper typed SVG element definitions
+
+### `flushUpdates` Utility
+
+Added `flushUpdates()` — a test utility that returns a promise resolving after the current microtask queue has been processed, enabling tests to await batched component updates before asserting DOM state.
+
+- Exported `flushUpdates()` utility that returns a promise resolving after the current microtask queue is processed, allowing tests to reliably wait for batched renders to complete
+- Extended `attachDataAttributes` to forward `aria-*` attributes from component props to the DOM element, enabling accessible components built with Shades
+
+### 🗑️ Deprecated
+
+- Deprecated `Router`, `Route`, `RouterProps`, and `RouterState` in favor of `NestedRouter` and its types
+- Deprecated `RouteLink` and `RouteLinkProps` in favor of `NestedRouteLink`
+- Deprecated `LinkToRoute` and `LinkToRouteProps` in favor of `NestedRouteLink`
+
+### 🐛 Bug Fixes
+
+- Fixed `onLeave` lifecycle hooks not firing correctly when navigating between nested routes
+
+### ♻️ Refactoring
+
+- `appendChild` in `shade-component.ts` now accepts `Element | DocumentFragment` instead of `HTMLElement | DocumentFragment` for broader compatibility
+- `createComponent` now acts as a render-mode switch: when in render mode it produces VNode descriptors, otherwise it creates real DOM elements as before
+
+### ⬆️ Dependencies
+
+- Peer dependency on `@furystack/shades` updated to the new major version for downstream packages
+
+## [11.1.0] - 2026-02-01
+
+### ✨ Features
+
+### CSS Property for Component-Level Styling
+
+Added a new `css` property to `Shade()` components that enables defining component-level styles with support for pseudo-selectors and nested selectors. This provides a cleaner alternative to using `useState` for hover/focus states.
+
+**Key benefits:**
+
+- Define `:hover`, `:active`, `:focus`, and `:disabled` states declaratively
+- Support for nested selectors (e.g., `& .className`, `& > div`)
+- Styles are injected as a shared stylesheet, reducing DOM overhead
+- Type-safe with the new `CSSObject` type
+
+**Usage:**
+
+```typescript
+const Button = Shade({
+  shadowDomName: 'my-button',
+  css: {
+    padding: '12px 24px',
+    backgroundColor: 'blue',
+    cursor: 'pointer',
+    '&:hover': { backgroundColor: 'darkblue' },
+    '&:disabled': { opacity: '0.5', cursor: 'not-allowed' },
+    '& .icon': { marginRight: '8px' }
+  },
+  render: ({ children }) => <button>{children}</button>
+})
+```
+
+- Added `CSSObject` type - type definition for CSS styles with nested selector support
+- Added `StyleManager` - singleton that manages CSS injection and deduplication for components
+- Added `generateCSS()` - utility function to convert `CSSObject` to CSS strings
+- Extended support for customized built-in elements (e.g., `a[is="my-link"]` selectors)
+
+### 📚 Documentation
+
+- Updated README with documentation for the new `css` property and styling patterns
+
+### 🧪 Tests
+
+- Added tests for `generateCSS()` covering camelCase conversion, pseudo-selectors, and nested selectors
+- Added tests for `StyleManager` covering component registration, deduplication, and customized built-in elements
+
 ## [11.0.35] - 2026-01-26
 
 ### 🔧 Chores

package/README.md

@@ -18,24 +18,110 @@ You can check the [@furystack/boilerplate](https://github.com/furystack/boilerpl
 
 A shade (component) can be constructed from the following properties:
 
-- `render:(options: RenderOptions)=>JSX.Element` – A required method that will be executed on each render.
-- `initialState` – A default state that can be updated during the component lifecycle.
-- `shadowDomName` – Can be specified as the custom element's name in the DOM.
-- `constructed: (options: RenderOptions)=>void` – Optional callback executed after component construction. It can return a cleanup method (e.g., free up resources, dispose value observers, etc.).
-- `onAttach: (options: RenderOptions)=>void` – Executed when the component is attached to the DOM.
-- `onDetach: (options: RenderOptions)=>void` – Executed when the component is detached from the DOM.
+- `render:(options: RenderOptions)=>JSX.Element` – A required method that will be executed on each render. Use `useDisposable` within render for one-time setup that needs cleanup.
+- `shadowDomName` – The custom element tag name. Must follow Custom Elements naming convention (lowercase, must contain a hyphen).
+- `style` – Optional inline styles applied to each component instance. Use for per-instance overrides.
+- `css` – Optional CSS styles injected as a stylesheet during component registration. Supports pseudo-selectors and nested selectors.
+
+### Styling
+
+Shades provides two complementary approaches to styling components:
+
+#### `style` Property (Inline Styles)
+
+The `style` property applies inline styles to each component instance. Use this for:
+
+- Per-instance style overrides
+- Dynamic styles that change based on props/state
+- Quick prototyping
+
+```typescript
+const MyComponent = Shade({
+  shadowDomName: 'my-component',
+  style: {
+    display: 'flex',
+    padding: '16px',
+  },
+  render: () => <div>Content</div>,
+})
+
+// Override styles on specific instances
+<MyComponent style={{ marginTop: '20px' }} />
+```
+
+#### `css` Property (Stylesheet Injection)
+
+The `css` property injects CSS rules into a stylesheet once per component type. Use this for:
+
+- Component-level default styles
+- Pseudo-selectors (`:hover`, `:active`, `:focus`, `:disabled`, etc.)
+- Nested selectors (child elements, class names)
+- Better performance (styles injected once, not per-instance)
+
+```typescript
+const Button = Shade({
+  shadowDomName: 'my-button',
+  css: {
+    padding: '12px 24px',
+    backgroundColor: 'blue',
+    color: 'white',
+    border: 'none',
+    cursor: 'pointer',
+    transition: 'all 0.2s ease',
+
+    '&:hover': {
+      backgroundColor: 'darkblue',
+    },
+
+    '&:active': {
+      transform: 'scale(0.98)',
+    },
+
+    '&:disabled': {
+      opacity: '0.5',
+      cursor: 'not-allowed',
+    },
+
+    '& .icon': {
+      marginRight: '8px',
+    },
+  },
+  render: ({ props }) => (
+    <button disabled={props.disabled}>
+      {props.icon && <span className="icon">{props.icon}</span>}
+      {props.children}
+    </button>
+  ),
+})
+```
+
+#### When to Use Which
+
+| Use Case                  | `style` | `css` |
+| ------------------------- | ------- | ----- |
+| Hover/focus/active states | ❌      | ✅    |
+| Per-instance overrides    | ✅      | ❌    |
+| Nested element styling    | ❌      | ✅    |
+| Dynamic values from props | ✅      | ❌    |
+| Component defaults        | ⚠️      | ✅    |
+
+Both properties can be used together. Inline `style` will override `css` due to CSS specificity rules.
 
 ### Render Options
 
-The lifecycle methods receive the following options as a parameter:
+The `render` function receives a `RenderOptions` object with these hooks:
 
-- `props` – The current readonly props object for the element. As props are passed from the parent, it is read-only.
-- `getState()` – Returns the current state. The state object is also read-only and immutable and can be updated only with a corresponding method.
-- `updateState(newState: TState, skipRender?: boolean)` – Updates (patches) the component state. An optional flag can indicate that this state change shouldn't trigger a re-render (e.g., form input fields change, etc.).
-- `injector` – An injector instance. It can be retrieved from the closest parent or specified on the state or props.
+- `props` – The current readonly props object. Passed from the parent, treat as immutable.
+- `injector` – The injector instance, inherited from the closest parent or set explicitly.
 - `children` – The children element(s) of the component.
-- `element` – A reference to the current component's custom element (root).
-- `logger` – A specified logger instance with a pre-defined scope.
+- `renderCount` – How many times this component has rendered.
+- `useState(key, initialValue)` – Local state that triggers re-renders on change.
+- `useObservable(key, observable, options?)` – Subscribes to an `ObservableValue`; re-renders on change by default. Provide a custom `onChange` to skip re-renders.
+- `useSearchState(key, initialValue)` – State synced with URL search parameters.
+- `useStoredState(key, initialValue, storageArea?)` – State persisted to `localStorage` or `sessionStorage`.
+- `useDisposable(key, factory)` – Creates a resource that is automatically disposed when the component unmounts.
+- `useHostProps(hostProps)` – Declaratively sets attributes, styles, and CSS variables on the host element. Prefer this over direct DOM manipulation.
+- `useRef(key)` – Creates a ref object for imperative access to child DOM elements.
 
 ### Bundled Goodies
 

package/esm/compile-route.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=compile-route.spec.d.ts.map

package/esm/compile-route.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"compile-route.spec.d.ts","sourceRoot":"","sources":["../src/compile-route.spec.ts"],"names":[],"mappings":""}

package/esm/compile-route.spec.js

@@ -0,0 +1,34 @@
+import { describe, expect, it } from 'vitest';
+import { compileRoute } from './compile-route.js';
+describe('compile-route', () => {
+    describe('compileRoute', () => {
+        it('should compile route with string params', () => {
+            const result = compileRoute('/users/:id', { id: 'abc123' });
+            expect(result).toBe('/users/abc123');
+        });
+        it('should compile route with numeric params (stringified)', () => {
+            const result = compileRoute('/users/:id', { id: 42 });
+            expect(result).toBe('/users/42');
+        });
+        it('should compile route with multiple params', () => {
+            const result = compileRoute('/users/:userId/posts/:postId', {
+                userId: 'user1',
+                postId: 'post2',
+            });
+            expect(result).toBe('/users/user1/posts/post2');
+        });
+        it('should handle empty params object for static routes', () => {
+            const result = compileRoute('/home', {});
+            expect(result).toBe('/home');
+        });
+        it('should handle params with special characters', () => {
+            const result = compileRoute('/search/:query', { query: 'hello-world' });
+            expect(result).toBe('/search/hello-world');
+        });
+        it('should handle boolean params (stringified)', () => {
+            const result = compileRoute('/feature/:enabled', { enabled: true });
+            expect(result).toBe('/feature/true');
+        });
+    });
+});
+//# sourceMappingURL=compile-route.spec.js.map

package/esm/compile-route.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"compile-route.spec.js","sourceRoot":"","sources":["../src/compile-route.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAA;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAEjD,QAAQ,CAAC,eAAe,EAAE,GAAG,EAAE;IAC7B,QAAQ,CAAC,cAAc,EAAE,GAAG,EAAE;QAC5B,EAAE,CAAC,yCAAyC,EAAE,GAAG,EAAE;YACjD,MAAM,MAAM,GAAG,YAAY,CAAC,YAAY,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAA;YAC3D,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA;QACtC,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,wDAAwD,EAAE,GAAG,EAAE;YAChE,MAAM,MAAM,GAAG,YAAY,CAAC,YAAY,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAA;YACrD,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA;QAClC,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,2CAA2C,EAAE,GAAG,EAAE;YACnD,MAAM,MAAM,GAAG,YAAY,CAAC,8BAA8B,EAAE;gBAC1D,MAAM,EAAE,OAAO;gBACf,MAAM,EAAE,OAAO;aAChB,CAAC,CAAA;YACF,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAA;QACjD,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,qDAAqD,EAAE,GAAG,EAAE;YAC7D,MAAM,MAAM,GAAG,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC,CAAA;YACxC,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QAC9B,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,8CAA8C,EAAE,GAAG,EAAE;YACtD,MAAM,MAAM,GAAG,YAAY,CAAC,gBAAgB,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC,CAAA;YACvE,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;QAC5C,CAAC,CAAC,CAAA;QAEF,EAAE,CAAC,4CAA4C,EAAE,GAAG,EAAE;YACpD,MAAM,MAAM,GAAG,YAAY,CAAC,mBAAmB,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAA;YACnE,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA;QACtC,CAAC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}

package/esm/component-factory.spec.js

@@ -2,7 +2,7 @@ import { Injector } from '@furystack/inject';
 import { describe, expect, it, vi } from 'vitest';
 import './jsx';
 import { createComponent } from './shade-component.js';
-import { Shade } from './shade.js';
+import { flushUpdates, Shade } from './shade.js';
 describe('Shades Component Factory', () => {
     describe('HTML Elements', () => {
         it('Should create a simple component', () => {
@@ -21,6 +21,12 @@ describe('Shades Component Factory', () => {
             expect(component).toBeInstanceOf(HTMLDivElement);
             expect(component.getAttribute('data-testid')).toBe('asd-123');
         });
+        it('Should apply aria attributes', () => {
+            const component = (createComponent("div", { "aria-label": "My label", "aria-hidden": "true" }, "a"));
+            expect(component).toBeInstanceOf(HTMLDivElement);
+            expect(component.getAttribute('aria-label')).toBe('My label');
+            expect(component.getAttribute('aria-hidden')).toBe('true');
+        });
         it('Should create a nested component', () => {
             const component = (createComponent("div", { style: { display: 'flex' } },
                 createComponent("h1", null, "Hi, I'm a header"),
@@ -47,7 +53,7 @@ describe('Shades Component Factory', () => {
             expect(shade.props).toEqual({});
             expect(shade.shadeChildren).toEqual([]);
         });
-        it('Should render a component with props', () => {
+        it('Should render a component with props', async () => {
             const Example = Shade({
                 shadowDomName: 'example-with-props',
                 render: ({ props }) => createComponent("div", null, props.foo),
@@ -55,12 +61,13 @@ describe('Shades Component Factory', () => {
             const component = (createComponent("div", null,
                 createComponent(Example, { foo: "example", injector: new Injector() })));
             const shade = component.firstElementChild;
-            shade.callConstructed();
+            shade.updateComponent();
+            await flushUpdates();
             expect(shade.props.foo).toEqual('example');
             expect(shade.shadeChildren).toEqual([]);
             expect(shade.innerHTML).toBe('<div>example</div>');
         });
-        it('Should render a component with state', () => {
+        it('Should render a component with state', async () => {
             const Example = Shade({
                 shadowDomName: 'example-with-state',
                 render: ({ useState }) => {
@@ -71,7 +78,8 @@ describe('Shades Component Factory', () => {
             const component = (createComponent("div", null,
                 createComponent(Example, null)));
             const shade = component.firstElementChild;
-            shade.callConstructed();
+            shade.updateComponent();
+            await flushUpdates();
             expect(shade.resourceManager.stateObservers.get('foo')?.getValue()).toEqual('example');
             expect(shade.shadeChildren).toEqual([]);
         });

package/esm/component-factory.spec.js.map

@@ -1 +1 @@
-{"version":3,"file":"component-factory.spec.js","sourceRoot":"","sources":["../src/component-factory.spec.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"component-factory.spec.js","sourceRoot":"","sources":["../src/component-factory.spec.tsx"],"names":[],"mappings":"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"}

package/esm/components/index.d.ts

@@ -1,5 +1,8 @@
 export * from './lazy-load.js';
 export * from './link-to-route.js';
-export * from './router.js';
+export * from './nested-route-link.js';
+export * from './nested-route-types.js';
+export * from './nested-router.js';
 export * from './route-link.js';
+export * from './router.js';
 //# sourceMappingURL=index.d.ts.map

package/esm/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,cAAc,oBAAoB,CAAA;AAClC,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,cAAc,oBAAoB,CAAA;AAClC,cAAc,wBAAwB,CAAA;AACtC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,aAAa,CAAA"}

package/esm/components/index.js

@@ -1,5 +1,8 @@
 export * from './lazy-load.js';
 export * from './link-to-route.js';
-export * from './router.js';
+export * from './nested-route-link.js';
+export * from './nested-route-types.js';
+export * from './nested-router.js';
 export * from './route-link.js';
+export * from './router.js';
 //# sourceMappingURL=index.js.map

package/esm/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,cAAc,oBAAoB,CAAA;AAClC,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,cAAc,oBAAoB,CAAA;AAClC,cAAc,wBAAwB,CAAA;AACtC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,aAAa,CAAA"}

package/esm/components/lazy-load.d.ts

@@ -3,11 +3,9 @@ export interface LazyLoadProps {
     error?: (error: unknown, retry: () => Promise<void>) => JSX.Element;
     component: () => Promise<JSX.Element>;
 }
-export interface LazyLoadState {
-    component?: JSX.Element;
-    error?: unknown;
-}
 export declare const LazyLoad: (props: LazyLoadProps & Omit<Partial<HTMLElement>, "style"> & {
     style?: Partial<CSSStyleDeclaration>;
+} & {
+    ref?: import("../index.js").RefObject<Element>;
 }, children?: import("../index.js").ChildrenList) => JSX.Element;
 //# sourceMappingURL=lazy-load.d.ts.map

package/esm/components/lazy-load.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lazy-load.d.ts","sourceRoot":"","sources":["../../src/components/lazy-load.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,aAAa;IAC5B,MAAM,EAAE,GAAG,CAAC,OAAO,CAAA;IACnB,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,OAAO,CAAA;IACnE,SAAS,EAAE,MAAM,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;CACtC;AAED,MAAM,WAAW,aAAa;IAC5B,SAAS,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;IACvB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,eAAO,MAAM,QAAQ;;gEAyCnB,CAAA"}
+{"version":3,"file":"lazy-load.d.ts","sourceRoot":"","sources":["../../src/components/lazy-load.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,aAAa;IAC5B,MAAM,EAAE,GAAG,CAAC,OAAO,CAAA;IACnB,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,OAAO,CAAA;IACnE,SAAS,EAAE,MAAM,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;CACtC;AAED,eAAO,MAAM,QAAQ;;;;gEAoEnB,CAAA"}