@meonode/ui 0.3.5 → 0.3.7

package/CHANGELOG.md

@@ -5,6 +5,33 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.3.7] - 2025-09-27
+
+### Added
+
+- **rsc:** make client components RSC compatible
+
+### Refactor
+
+- **node:** isolate css prop for StyledRenderer
+
+## [0.3.6] - 2025-09-27
+
+### Changed
+
+- **changelog:** update missing changelog entries
+
+## [0.3.5] - 2025-09-27
+
+### Refactor
+
+- **refactor:** remove automatic key generation and use spread children in createElement
+    - Remove _generateKey method and all automatic key generation logic
+    - Simplify _processRawNode by removing nodeIndex parameter and complex case handling
+    - Update render() to spread array children as individual arguments to createElement
+    - Only preserve explicit non-null keys from original React elements
+    - Fix component remounting issues when children content changes (e.g., during typing)
+
 ## [0.3.4] - 2025-09-26
 
 ### Fixed
@@ -45,7 +72,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - **feat(theme):** use React Context for theme propagation
 
   **Before**:
-  ```typescript
+  '''typescript
   import { Div } from '@meonode/ui';
 
   const App = () => {
@@ -56,10 +83,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
       children: 'Hello world!',
     });
   };
-  ```
+  '''
 
   **After**:
-  ```typescript
+  '''typescript
   import { Div, ThemeProvider } from '@meonode/ui';
 
   const App = () => {
@@ -82,7 +109,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
       ],
     });
   };
-  ```
+  '''
 
 ## [0.2.21] - 2025-09-23
 
@@ -142,7 +169,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - **feat(portal)**: use `usePortal` hook to make the portal reactive to state changes
 
-  ```typescript
+  '''typescript
   import { Button, Div, Node, Portal, type PortalProps } from '@meonode/ui';
   import { usePortal } from '@meonode/ui';
   import { useState } from 'react';
@@ -181,7 +208,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
       ],
     }).render();
   };
-  ```
+  '''
 
 ## [0.2.17] - 2025-09-14
 
@@ -293,22 +320,22 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - **core**: add top-level `render` function for a cleaner and simpler API when mounting a Meonode instance to the DOM.
   This abstracts away the need to manually use `react-dom/client`.
     - **Before**:
-      ```typescript
+      '''typescript
       import { createRoot } from 'react-dom/client';
       import { Div } from '@meonode/ui';
   
       const container = document.getElementById('root');
       const root = createRoot(container);
       root.render(Div({ children: 'Hello' }).render());
-      ```
+      '''
     - **After**:
-      ```typescript
+      '''typescript
       import { Div } from '@meonode/ui';
       import { render } from '@meonode/ui/client';
   
       const container = document.getElementById('root');
       render(Div({ children: 'Hello' }), container);
-      ```
+      '''
 - **constants**: add `NO_STYLE_TAGS` array and `noStyleTagsSet` for quick lookup of tags that should not receive styles
 
 ### Enhanced
@@ -340,7 +367,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Simplifies and unifies the typing system for node factories (`createNode`, `createChildrenFirstNode`).
 - Improves developer experience when working with prebuilt components:
     - Example:
-      ```typescript
+      '''typescript
       import { Div, Input } from '@meonode/ui'
   
       // Add new props
@@ -350,7 +377,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
       Input<{ onChange: (e: { target: { value: string } }) => void }>({ 
         onChange: ({ target }) => console.log(target.value),
       })
-      ```
+      '''
   Extending prebuilt components is now safer and more predictable, with generic props always taking precedence when keys
   overlap.
 
@@ -382,7 +409,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 - **core**: Exposed the original element via the created Node for easier access and debugging.
-    ```typescript
+    '''typescript
     import { createNode } from "@meonode/ui";
 
     // Create a Node wrapping a 'div' element
@@ -390,7 +417,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
     // Access the underlying element type
     console.log(MyComp.element); // 'div'
-    ```
+    '''
 
 ## [0.2.3] - 2025-09-01
 
@@ -521,4 +548,4 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - This changelog covers the most recent development history available
 - The project focuses on building React UIs with type-safe fluency without JSX syntax
 - Recent development has emphasized Emotion integration, type safety improvements, and enhanced flexbox support
-- For a complete history, view all commits on GitHub: [View all commits](https://github.com/l7aromeo/meonode-ui/commits)
+- For a complete history, view all commits on GitHub: [View all commits](https://github.com/l7aromeo/meonode-ui/commits)

package/dist/components/registry.client.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from 'react';
 export default function StyleRegistry({ children }: {
     children: ReactElement;
-}): import("react").FunctionComponentElement<import("react").ProviderProps<import("@emotion/utils").EmotionCache | null>>;
+}): ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 //# sourceMappingURL=registry.client.d.ts.map

package/dist/components/registry.client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"registry.client.d.ts","sourceRoot":"","sources":["../../src/components/registry.client.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,KAAK,YAAY,EAAY,MAAM,OAAO,CAAA;AASlE,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,YAAY,CAAA;CAAE,yHAuB7E"}
+{"version":3,"file":"registry.client.d.ts","sourceRoot":"","sources":["../../src/components/registry.client.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,KAAK,YAAY,EAAY,MAAM,OAAO,CAAA;AAUlE,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,YAAY,CAAA;CAAE,8EAuB7E"}

package/dist/components/registry.client.js

@@ -1 +1 @@
-"use client";function _slicedToArray(a,b){return _arrayWithHoles(a)||_iterableToArrayLimit(a,b)||_unsupportedIterableToArray(a,b)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(b,c){if(b){if("string"==typeof b)return _arrayLikeToArray(b,c);var a={}.toString.call(b).slice(8,-1);return"Object"===a&&b.constructor&&(a=b.constructor.name),"Map"===a||"Set"===a?Array.from(b):"Arguments"===a||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a)?_arrayLikeToArray(b,c):void 0}}function _arrayLikeToArray(b,c){(null==c||c>b.length)&&(c=b.length);for(var d=0,f=Array(c);d<c;d++)f[d]=b[d];return f}function _iterableToArrayLimit(b,c){var d=null==b?null:"undefined"!=typeof Symbol&&b[Symbol.iterator]||b["@@iterator"];if(null!=d){var g,h,j,k,l=[],a=!0,m=!1;try{if(j=(d=d.call(b)).next,0===c){if(Object(d)!==d)return;a=!1}else for(;!(a=(g=j.call(d)).done)&&(l.push(g.value),l.length!==c);a=!0);}catch(a){m=!0,h=a}finally{try{if(!a&&null!=d["return"]&&(k=d["return"](),Object(k)!==k))return}finally{if(m)throw h}}return l}}function _arrayWithHoles(a){if(Array.isArray(a))return a}import{createElement,useState}from"react";import{useServerInsertedHTML}from"next/navigation";import{CacheProvider}from"@emotion/react";import createCache from"@emotion/cache";function createEmotionCache(){return createCache({key:"meonode-css"})}export default function StyleRegistry(a){var b=a.children,c=useState(function(){var a=createEmotionCache();return a.compat=!0,a}),d=_slicedToArray(c,1),e=d[0];return useServerInsertedHTML(function(){var a=Object.keys(e.inserted).sort(),b=a.map(function(a){return e.inserted[a]}).join(""),c=a.join(" ");return b?createElement("style",{"data-emotion":"".concat(e.key," ").concat(c),dangerouslySetInnerHTML:{__html:b}}):null}),createElement(CacheProvider,{value:e},b)}
+"use client";function _slicedToArray(a,b){return _arrayWithHoles(a)||_iterableToArrayLimit(a,b)||_unsupportedIterableToArray(a,b)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(b,c){if(b){if("string"==typeof b)return _arrayLikeToArray(b,c);var a={}.toString.call(b).slice(8,-1);return"Object"===a&&b.constructor&&(a=b.constructor.name),"Map"===a||"Set"===a?Array.from(b):"Arguments"===a||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a)?_arrayLikeToArray(b,c):void 0}}function _arrayLikeToArray(b,c){(null==c||c>b.length)&&(c=b.length);for(var d=0,f=Array(c);d<c;d++)f[d]=b[d];return f}function _iterableToArrayLimit(b,c){var d=null==b?null:"undefined"!=typeof Symbol&&b[Symbol.iterator]||b["@@iterator"];if(null!=d){var g,h,j,k,l=[],a=!0,m=!1;try{if(j=(d=d.call(b)).next,0===c){if(Object(d)!==d)return;a=!1}else for(;!(a=(g=j.call(d)).done)&&(l.push(g.value),l.length!==c);a=!0);}catch(a){m=!0,h=a}finally{try{if(!a&&null!=d["return"]&&(k=d["return"](),Object(k)!==k))return}finally{if(m)throw h}}return l}}function _arrayWithHoles(a){if(Array.isArray(a))return a}import{createElement,useState}from"react";import{useServerInsertedHTML}from"next/navigation";import{CacheProvider}from"@emotion/react";import createCache from"@emotion/cache";import{Node}from"../core.node.js";function createEmotionCache(){return createCache({key:"meonode-css"})}export default function StyleRegistry(a){var b=a.children,c=useState(function(){var a=createEmotionCache();return a.compat=!0,a}),d=_slicedToArray(c,1),e=d[0];return useServerInsertedHTML(function(){var a=Object.keys(e.inserted).sort(),b=a.map(function(a){return e.inserted[a]}).join(""),c=a.join(" ");return b?createElement("style",{"data-emotion":"".concat(e.key," ").concat(c),dangerouslySetInnerHTML:{__html:b}}):null}),Node(CacheProvider,{value:e,children:b}).render()}