@hairy/react-lib 1.44.0 → 1.46.0

package/dist/index.cjs

@@ -207,7 +207,7 @@ var Deferred = class extends Promise {
 };
 
 // ../util-core/src/util/json.ts
-function jsonTryParse(text) {
+function tryParseJson(text) {
   try {
     return JSON.parse(text || "");
   } catch {
@@ -227,20 +227,20 @@ function track(fn, ...args) {
 
 // src/utils/wrapper.ts
 var import_react = require("react");
-function wrapper(tag, props, children) {
-  return tag ? (0, import_react.createElement)(tag, props, children) : children;
+function wrapper(asChild, props, children) {
+  return asChild ? (0, import_react.createElement)(asChild, props, children) : children;
 }
 
 // src/components/condition/Case.ts
 function Case(props) {
-  const { cond, children, tag, ...attrs } = props;
-  return wrapper(tag, attrs, children);
+  const { cond, children, tag, as: asChild, ...attrs } = props;
+  return wrapper(tag || asChild, attrs, children);
 }
 
 // src/components/condition/Default.ts
 function Default(props) {
-  const { children, tag, ...attrs } = props;
-  return wrapper(tag, attrs, children);
+  const { children, tag, as: asChild, ...attrs } = props;
+  return wrapper(tag || asChild, attrs, children);
 }
 
 // src/components/condition/If.ts
@@ -248,24 +248,24 @@ var import_react2 = require("react");
 
 // src/components/condition/Then.ts
 function Then(props) {
-  const { children, cond, else: _else, then, tag, ...attrs } = props;
-  return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag, attrs, children);
+  const { children, cond, else: _else, then, tag, as: asChild, ...attrs } = props;
+  return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag || asChild, attrs, children);
 }
 
 // src/components/condition/If.ts
 function If(props) {
-  const { then, cond, else: _else, children = props.then, tag, ...attrs } = props;
+  const { then, cond, else: _else, children = props.then, tag, as: asChild, ...attrs } = props;
   const elements = import_react2.Children.toArray(children);
   const thenChild = elements.find((c) => c.type === Then);
   const elseChild = elements.find((c) => c.type === Else);
   const child = thenChild || elseChild ? cond ? thenChild : elseChild : cond ? children : _else;
-  return wrapper(tag, attrs, child);
+  return wrapper(tag || asChild, attrs, child);
 }
 
 // src/components/condition/Else.ts
 function Else(props) {
-  const { children, tag, ...attrs } = props;
-  return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag, attrs, children);
+  const { children, tag, as: asChild, ...attrs } = props;
+  return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag || asChild, attrs, children);
 }
 
 // src/components/condition/Switch.ts
@@ -293,12 +293,12 @@ function Switch(props) {
 // src/components/condition/Unless.ts
 var import_react4 = require("react");
 function Unless(props) {
-  const { cond, then, else: _else, tag, children = props.then, ...attrs } = props;
+  const { cond, then, else: _else, tag, as: asChild, children = props.then, ...attrs } = props;
   const elements = import_react4.Children.toArray(children);
   const thenChild = elements.find((c) => c.type === Then);
   const elseChild = elements.find((c) => c.type === Else);
   const child = thenChild || elseChild ? !cond ? elseChild : thenChild : !cond ? children : _else;
-  return wrapper(tag, attrs, child);
+  return wrapper(tag || asChild, attrs, child);
 }
 
 // src/components/utils/Injector.ts
@@ -639,7 +639,7 @@ function proxyWithPersistant(keyOrOptions, initialObject) {
   }
   const storage = options.storage || (typeof localStorage !== "undefined" ? localStorage : void 0);
   typeof keyOrOptions === "string" && (keyOrOptions = { id: keyOrOptions });
-  const state = (0, import_valtio3.proxy)(jsonTryParse(storage?.getItem(options.id)) || initialObject);
+  const state = (0, import_valtio3.proxy)(tryParseJson(storage?.getItem(options.id)) || initialObject);
   (0, import_valtio3.subscribe)(state, () => {
     const pick = options.pick || Object.keys(state);
     const statePick = {};

package/dist/index.d.ts

@@ -32,10 +32,12 @@ declare namespace cls {
 declare function track<T extends AnyFn>(fn: T, ...args: Parameters<T>): Promise<ReturnType<T>>;
 
 type WrapperTag = keyof JSX.IntrinsicElements | Function;
-type WrapperProps<Kag extends keyof JSX.IntrinsicElements | React.FC | unknown> = {
-    tag?: Kag;
-} & (Kag extends keyof JSX.IntrinsicElements ? JSX.IntrinsicElements[Kag] : unknown) & (Kag extends React.FC<infer P> ? P : unknown);
-declare function wrapper(tag: any, props: unknown, children?: React.ReactNode): react.ReactNode;
+type WrapperProps<As extends keyof JSX.IntrinsicElements | React.FC | unknown> = {
+    /** @deprecated use `as` instead */
+    tag?: As;
+    as?: As;
+} & (As extends keyof JSX.IntrinsicElements ? JSX.IntrinsicElements[As] : unknown) & (As extends React.FC<infer P> ? P : unknown);
+declare function wrapper(asChild: any, props: unknown, children?: React.ReactNode): react.ReactNode;
 
 type CaseProps<Kag> = WrapperProps<Kag> & {
     cond?: BooleanLike;
@@ -231,6 +233,10 @@ interface PersistantOptions {
     storage?: Storage;
     pick?: string[];
 }
+/**
+ *
+ * @deprecated please use `valtio-define`
+ */
 declare function proxyWithPersistant<T extends object>(key: string, initialObject?: T, options?: Omit<PersistantOptions, 'key'>): T;
 declare function proxyWithPersistant<T extends object>(options: PersistantOptions, initialObject?: T): T;
 
@@ -281,6 +287,7 @@ type Store<S, A extends Actions<S>, G extends Getters<S>> = {
 
 /**
  * @description Define a store
+ * @deprecated please use `valtio-define`
  * @example
  * ```tsx
  * const store = defineStore({
@@ -329,6 +336,7 @@ type StoreAsync<T extends AnyFn, Initial = StoreAsyncInitial<T> | undefined> = S
 }, {}>;
 /**
  * @description Define a store async
+ * @deprecated please use `valtio-define`
  * @example
  * ```tsx
  * const store = defineStoreAsync(
@@ -349,8 +357,16 @@ declare function defineStoreAsync<T extends AnyFn>(fetch: T, options?: StoreAsyn
  */
 declare const defienAsyncStore: typeof defineStoreAsync;
 
+/**
+ *
+ * @deprecated please use `valtio-define`
+ */
 declare function useStatus<S extends object, A extends Actions<S>, G extends Getters<S>>(store: Store<S, A, G>): valtio.Snapshot<ActionsStatus<A>>;
 
+/**
+ *
+ * @deprecated please use `valtio-define`
+ */
 declare function useStore<S extends object, A extends Actions<S>, G extends Getters<S>>(store: Store<S, A, G>): valtio.Snapshot<S & GettersReturnType<G> & ActionsOmitThisParameter<A>>;
 
 type PropsWithDetailedHTML<T = HTMLDivElement> = DetailedHTMLProps<HTMLAttributes<T>, T>;

package/dist/index.global.js

@@ -218,7 +218,7 @@ var LibReact = (() => {
   };
 
   // ../util-core/src/util/json.ts
-  function jsonTryParse(text) {
+  function tryParseJson(text) {
     try {
       return JSON.parse(text || "");
     } catch {
@@ -743,20 +743,20 @@ var LibReact = (() => {
 
   // src/utils/wrapper.ts
   var import_react2 = __toESM(require_react(), 1);
-  function wrapper(tag, props, children) {
-    return tag ? (0, import_react2.createElement)(tag, props, children) : children;
+  function wrapper(asChild, props, children) {
+    return asChild ? (0, import_react2.createElement)(asChild, props, children) : children;
   }
 
   // src/components/condition/Case.ts
   function Case(props) {
-    const { cond, children, tag, ...attrs } = props;
-    return wrapper(tag, attrs, children);
+    const { cond, children, tag, as: asChild, ...attrs } = props;
+    return wrapper(tag || asChild, attrs, children);
   }
 
   // src/components/condition/Default.ts
   function Default(props) {
-    const { children, tag, ...attrs } = props;
-    return wrapper(tag, attrs, children);
+    const { children, tag, as: asChild, ...attrs } = props;
+    return wrapper(tag || asChild, attrs, children);
   }
 
   // src/components/condition/If.ts
@@ -764,24 +764,24 @@ var LibReact = (() => {
 
   // src/components/condition/Then.ts
   function Then(props) {
-    const { children, cond, else: _else, then, tag, ...attrs } = props;
-    return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag, attrs, children);
+    const { children, cond, else: _else, then, tag, as: asChild, ...attrs } = props;
+    return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag || asChild, attrs, children);
   }
 
   // src/components/condition/If.ts
   function If(props) {
-    const { then, cond, else: _else, children = props.then, tag, ...attrs } = props;
+    const { then, cond, else: _else, children = props.then, tag, as: asChild, ...attrs } = props;
     const elements = import_react3.Children.toArray(children);
     const thenChild = elements.find((c) => c.type === Then);
     const elseChild = elements.find((c) => c.type === Else);
     const child = thenChild || elseChild ? cond ? thenChild : elseChild : cond ? children : _else;
-    return wrapper(tag, attrs, child);
+    return wrapper(tag || asChild, attrs, child);
   }
 
   // src/components/condition/Else.ts
   function Else(props) {
-    const { children, tag, ...attrs } = props;
-    return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag, attrs, children);
+    const { children, tag, as: asChild, ...attrs } = props;
+    return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag || asChild, attrs, children);
   }
 
   // src/components/condition/Switch.ts
@@ -809,12 +809,12 @@ var LibReact = (() => {
   // src/components/condition/Unless.ts
   var import_react5 = __toESM(require_react(), 1);
   function Unless(props) {
-    const { cond, then, else: _else, tag, children = props.then, ...attrs } = props;
+    const { cond, then, else: _else, tag, as: asChild, children = props.then, ...attrs } = props;
     const elements = import_react5.Children.toArray(children);
     const thenChild = elements.find((c) => c.type === Then);
     const elseChild = elements.find((c) => c.type === Else);
     const child = thenChild || elseChild ? !cond ? elseChild : thenChild : !cond ? children : _else;
-    return wrapper(tag, attrs, child);
+    return wrapper(tag || asChild, attrs, child);
   }
 
   // src/components/utils/Injector.ts
@@ -1367,7 +1367,7 @@ var LibReact = (() => {
     }
     const storage = options.storage || (typeof localStorage !== "undefined" ? localStorage : void 0);
     typeof keyOrOptions === "string" && (keyOrOptions = { id: keyOrOptions });
-    const state = proxy(jsonTryParse(storage?.getItem(options.id)) || initialObject);
+    const state = proxy(tryParseJson(storage?.getItem(options.id)) || initialObject);
     subscribe(state, () => {
       const pick = options.pick || Object.keys(state);
       const statePick = {};

package/dist/index.js

@@ -136,7 +136,7 @@ var Deferred = class extends Promise {
 };
 
 // ../util-core/src/util/json.ts
-function jsonTryParse(text) {
+function tryParseJson(text) {
   try {
     return JSON.parse(text || "");
   } catch {
@@ -156,20 +156,20 @@ function track(fn, ...args) {
 
 // src/utils/wrapper.ts
 import { createElement } from "react";
-function wrapper(tag, props, children) {
-  return tag ? createElement(tag, props, children) : children;
+function wrapper(asChild, props, children) {
+  return asChild ? createElement(asChild, props, children) : children;
 }
 
 // src/components/condition/Case.ts
 function Case(props) {
-  const { cond, children, tag, ...attrs } = props;
-  return wrapper(tag, attrs, children);
+  const { cond, children, tag, as: asChild, ...attrs } = props;
+  return wrapper(tag || asChild, attrs, children);
 }
 
 // src/components/condition/Default.ts
 function Default(props) {
-  const { children, tag, ...attrs } = props;
-  return wrapper(tag, attrs, children);
+  const { children, tag, as: asChild, ...attrs } = props;
+  return wrapper(tag || asChild, attrs, children);
 }
 
 // src/components/condition/If.ts
@@ -177,24 +177,24 @@ import { Children } from "react";
 
 // src/components/condition/Then.ts
 function Then(props) {
-  const { children, cond, else: _else, then, tag, ...attrs } = props;
-  return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag, attrs, children);
+  const { children, cond, else: _else, then, tag, as: asChild, ...attrs } = props;
+  return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag || asChild, attrs, children);
 }
 
 // src/components/condition/If.ts
 function If(props) {
-  const { then, cond, else: _else, children = props.then, tag, ...attrs } = props;
+  const { then, cond, else: _else, children = props.then, tag, as: asChild, ...attrs } = props;
   const elements = Children.toArray(children);
   const thenChild = elements.find((c) => c.type === Then);
   const elseChild = elements.find((c) => c.type === Else);
   const child = thenChild || elseChild ? cond ? thenChild : elseChild : cond ? children : _else;
-  return wrapper(tag, attrs, child);
+  return wrapper(tag || asChild, attrs, child);
 }
 
 // src/components/condition/Else.ts
 function Else(props) {
-  const { children, tag, ...attrs } = props;
-  return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag, attrs, children);
+  const { children, tag, as: asChild, ...attrs } = props;
+  return Object.keys(props).includes("cond") ? wrapper(If, props, children) : wrapper(tag || asChild, attrs, children);
 }
 
 // src/components/condition/Switch.ts
@@ -222,12 +222,12 @@ function Switch(props) {
 // src/components/condition/Unless.ts
 import { Children as Children3 } from "react";
 function Unless(props) {
-  const { cond, then, else: _else, tag, children = props.then, ...attrs } = props;
+  const { cond, then, else: _else, tag, as: asChild, children = props.then, ...attrs } = props;
   const elements = Children3.toArray(children);
   const thenChild = elements.find((c) => c.type === Then);
   const elseChild = elements.find((c) => c.type === Else);
   const child = thenChild || elseChild ? !cond ? elseChild : thenChild : !cond ? children : _else;
-  return wrapper(tag, attrs, child);
+  return wrapper(tag || asChild, attrs, child);
 }
 
 // src/components/utils/Injector.ts
@@ -568,7 +568,7 @@ function proxyWithPersistant(keyOrOptions, initialObject) {
   }
   const storage = options.storage || (typeof localStorage !== "undefined" ? localStorage : void 0);
   typeof keyOrOptions === "string" && (keyOrOptions = { id: keyOrOptions });
-  const state = proxy(jsonTryParse(storage?.getItem(options.id)) || initialObject);
+  const state = proxy(tryParseJson(storage?.getItem(options.id)) || initialObject);
   subscribe(state, () => {
     const pick = options.pick || Object.keys(state);
     const statePick = {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hairy/react-lib",
   "type": "module",
-  "version": "1.44.0",
+  "version": "1.46.0",
   "description": "Library for react",
   "author": "Hairyf <wwu710632@gmail.com>",
   "license": "MIT",
@@ -38,7 +38,7 @@
     "react-dom": "^19.1.0",
     "react-i18next": "^14.1.2",
     "react-use": "^17.6.0",
-    "@hairy/utils": "1.44.0"
+    "@hairy/utils": "1.46.0"
   },
   "scripts": {
     "build": "tsup",