@laser-ui/components 2.0.1 → 2.0.3

package/CHANGELOG.md

@@ -2,6 +2,16 @@
 
 All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.0.3](https://github.com/laser-ui/laser-ui/compare/v2.0.2...v2.0.3) (2024-12-25)
+
+### Bug Fixes
+
+- **components:** fix form emit change ([37e7c2b](https://github.com/laser-ui/laser-ui/commit/37e7c2bb37d70190d4d86c021977bcf3cb936134))
+
+## [2.0.2](https://github.com/laser-ui/laser-ui/compare/v2.0.1...v2.0.2) (2024-12-19)
+
+**Note:** Version bump only for package @laser-ui/components
+
 ## [2.0.1](https://github.com/laser-ui/laser-ui/compare/v2.0.0...v2.0.1) (2024-12-17)
 
 **Note:** Version bump only for package @laser-ui/components

package/form/FormItem.js

@@ -43,7 +43,9 @@ export function FormItem(props) {
                 throw new Error(`Cant find '${controlName}', please check if name exists!`);
             }
             formControl._emitChange = () => {
-                formControl._emitChange = true;
+                // eslint-disable-next-line @typescript-eslint/no-empty-function
+                formControl._emitChange = () => { };
+                formControl._emitChanged = true;
             };
             obj[controlName] = {
                 control: formControl,
@@ -58,7 +60,7 @@ export function FormItem(props) {
     useEffect(() => {
         const clear = [];
         for (const { control } of Object.values(formControlProviders)) {
-            if (control._emitChange === true) {
+            if (control._emitChanged === true) {
                 forceUpdate();
             }
             control._emitChange = forceUpdate;

package/form/hooks.js

@@ -40,7 +40,9 @@ export function useForm(initForm, deps) {
     const [form, setForm] = useState(() => {
         const form = initForm();
         form._emitChange = () => {
-            form._emitChange = true;
+            // eslint-disable-next-line @typescript-eslint/no-empty-function
+            form._emitChange = () => { };
+            form._emitChanged = true;
         };
         return form;
     });
@@ -58,7 +60,7 @@ export function useForm(initForm, deps) {
         forceUpdate();
     });
     useEffect(() => {
-        if (form._emitChange === true) {
+        if (form._emitChanged === true) {
             forceUpdate();
         }
         form._emitChange = emitChange;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@laser-ui/components",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "description": "React components.",
   "keywords": [
     "ui",
@@ -26,9 +26,8 @@
   "module": "./index.js",
   "types": "./index.d.ts",
   "dependencies": {
-    "@material-design-icons/svg": "^0.14.12",
-    "lodash": "^4.17.21",
-    "rcl-store": "^2.1.0"
+    "@material-design-icons/svg": "^0.14.13",
+    "lodash": "^4.17.21"
   },
   "peerDependencies": {
     "dayjs": "^1.11.0",
@@ -38,5 +37,5 @@
     "access": "public",
     "directory": "../../dist/libs/components"
   },
-  "gitHead": "5198c1835aa2a718c200cf61181fb372e3f54ed1"
+  "gitHead": "c7123f02baa424b48320c60861b29c7a55312ced"
 }

package/root/Root.js

@@ -1,15 +1,15 @@
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { useEvent, useRefExtra } from '@laser-ui/hooks';
 import { isString, set } from 'lodash';
-import { useStore } from 'rcl-store';
 import { useEffect, useMemo } from 'react';
-import { ROOT_DATA, RootContext, Store } from './vars';
+import { useDialogs } from './dialog-service';
+import { ROOT_DATA, RootContext } from './vars';
 import dayjs from '../dayjs';
 import resources from '../resources.json';
 export function Root(props) {
     const { context: contextProp, children } = props;
     const windowRef = useRefExtra(() => window);
-    const [{ dialogs }] = useStore(Store, ['dialogs']);
+    const dialogs = useDialogs();
     useEffect(() => {
         const handleResize = () => {
             ROOT_DATA.windowSize = { width: window.innerWidth, height: window.innerHeight };

package/root/dialog-service.d.ts

@@ -1,2 +1,4 @@
+import type { DialogInstance } from '../dialog-service';
 import { DialogService as InternalDialogService } from '../dialog-service';
+export declare function useDialogs(): DialogInstance<any>[];
 export declare const DialogService: InternalDialogService;

package/root/dialog-service.js

@@ -1,5 +1,22 @@
-import { Store } from './vars';
+import { useSyncExternalStore } from 'react';
 import { DialogService as InternalDialogService } from '../dialog-service';
-export const DialogService = new InternalDialogService((dialogs) => {
-    Store.set('dialogs', dialogs);
+let dialogs = [];
+let listeners = [];
+function subscribe(onChange) {
+    listeners = listeners.concat([onChange]);
+    return () => {
+        listeners = listeners.filter((f) => f !== onChange);
+    };
+}
+function getSnapshot() {
+    return dialogs;
+}
+export function useDialogs() {
+    return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+}
+export const DialogService = new InternalDialogService((val) => {
+    dialogs = val;
+    for (const listener of listeners) {
+        listener();
+    }
 });

package/root/vars.d.ts

@@ -1,10 +1,6 @@
 /// <reference types="react" />
-import type { DialogInstance } from '../dialog-service';
 import type { Lang } from '../types';
 import resources from '../resources.json';
-export declare const Store: import("rcl-store").Store<{
-    dialogs: DialogInstance<any>[];
-}>;
 export declare const ROOT_DATA: {
     clickEvent?: {
         time: number;

package/root/vars.js

@@ -1,9 +1,5 @@
-import { createStore } from 'rcl-store';
 import { createContext } from 'react';
 import resources from '../resources.json';
-export const Store = createStore({
-    dialogs: [],
-});
 export const ROOT_DATA = {
     windowSize: typeof window !== 'undefined' ? { width: window.innerWidth, height: window.innerHeight } : { width: 0, height: 0 },
 };