@wwog/react 1.3.2 → 1.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import a,{useMemo as g,Children as W,Fragment as E,isValidElement as H,cloneElement as B,useEffect as D,useState as A,useRef as O,useCallback as V}from"react";function P(e,n){if(e===void 0)return;let t=0;if(Array.isArray(e)){for(const r of e)if(n(r,t++)===!1)break}else n(e,t)}const Z=(e,n)=>e===n,w=e=>a.createElement(a.Fragment,null,e.children);w.displayName="Switch_Case";const N=e=>a.createElement(a.Fragment,null,e.children);N.displayName="Switch_Default";const y=e=>{const{value:n,compare:t=Z,children:r,strict:o=!1}=e,l=new Set;let s=null,u=null,f=!1;return P(r,(c,i)=>{if(!a.isValidElement(c))throw new Error(`Switch Children only accepts valid React elements at index ${i}`);const d=c.type;if(d.displayName===w.displayName){const m=c.props;if(l.has(m.value))throw new Error(`Switch found duplicate Case value at index ${i}: ${JSON.stringify(m.value)}${o?" (detected in strict mode)":""}`);if(l.add(m.value),!s&&t(n,m.value)&&(s=m.children,o===!1))return!1}else if(d.displayName===N.displayName){if(f)throw new Error(`Switch can only have one Default child at index ${i}`);if(f=!0,u=c.props.children,!o&&s)return!1}else throw new Error(`Switch Children only accepts 'Case' or 'Default' elements, found: ${String(d.displayName||d.name||d)} at index ${i}`)}),a.createElement(a.Fragment,null,s??u)};y.displayName="Switch",y.Case=w,y.Default=N,y.createTyped=function(){return{Switch:y,Case:w,Default:N}};const v=e=>a.createElement(a.Fragment,null,e.children),b=({children:e})=>a.createElement(a.Fragment,null,e),M=e=>a.createElement(a.Fragment,null,e.children);v.displayName="If_Then",b.displayName="If_Else",M.displayName="If_ElseIf";const h=({condition:e,children:n})=>{let t=null,r=null;const o=[];if(a.Children.forEach(n,l=>{if(!a.isValidElement(l))throw new Error("If component only accepts valid React elements");const s=l.type;if(s.displayName===v.displayName){if(t)throw new Error("If component can only have one Then child");t=l}else if(s.displayName===M.displayName)o.push(l);else if(s.displayName===b.displayName){if(r)throw new Error("If component can only have one Else child");r=l}else throw new Error(`If component only accepts 'Then', 'ElseIf', or 'Else' elements as children, found: ${String(s.displayName||s.name||s)}`)}),e)return t?a.createElement(a.Fragment,null,t.props.children):null;for(const l of o)if(l.props.condition)return a.createElement(a.Fragment,null,l.props.children);return r?a.createElement(a.Fragment,null,r.props.children):null};h.displayName="If",h.Then=v,h.ElseIf=M,h.Else=b,h.createTyped=function(){return{If:h,Then:v,ElseIf:M,Else:b}};const z=({condition:e,children:n})=>e?a.createElement(a.Fragment,null,n):null,L=({condition:e,children:n})=>e===!1?a.createElement(a.Fragment,null,n):null,U=({all:e,any:n,none:t,children:r,fallback:o})=>g(()=>(e&&(n||t)&&console.warn('When: Multiple condition types (all, any, none) provided; "all" takes precedence.'),!!(e&&e.length>0&&e.every(Boolean)||n&&n.length>0&&n.some(Boolean)||t&&t.length>0&&t.every(l=>!l))),[e,n,t])?a.createElement(a.Fragment,null,r):a.createElement(a.Fragment,null,o||null),G=({data:e,transform:n,render:t,fallback:r})=>{const o=g(()=>n.reduce((l,s)=>s(l),e),[e,n]);return o==null?a.createElement(a.Fragment,null,r||null):a.createElement(a.Fragment,null,t(o))},$=e=>{const{children:n,h:t,w:r,size:o,height:l,width:s,className:u}=e;return a.createElement("div",{style:{width:o||r||s,height:o||t||l,flexShrink:0},className:u},n)},q=({let:e,props:n,children:t,fallback:r})=>{const o=g(()=>typeof e=="function"?e(n):e,[e,n]);return!t||!Object.keys(o).length?a.createElement(a.Fragment,null,r||null):a.createElement(a.Fragment,null,t(o))};function F(...e){const n=new Set;for(const t of e)if(t){if(typeof t=="string")n.add(t);else if(Array.isArray(t))t.forEach(r=>n.add(r));else if(typeof t=="object")for(const[r,o]of Object.entries(t))o&&n.add(r)}return Array.from(n).join(" ")}const K=e=>typeof e=="object"&&!!e,x=({className:e,children:n,asWrapper:t=!1})=>{if(!n)return null;if(W.count(n)>1)return console.error("<Styles>: children has more than one child. Please check your code."),a.createElement(E,null,n);if(!e)return a.createElement(E,null,n);const r=typeof e=="string"?e:F(...Object.values(e));if(t)return a.createElement(t===!0?"div":t,{className:r},n);if(H(n)){const o=n;let l=o?.props?.className;return o?.type?.displayName===x.displayName&&K(l)&&(l=F(...Object.values(l))),B(n,{className:F(r,l)})}return console.error("<Styles>: children is not a valid React element. Please check your code."),a.createElement(E,null,n)};x.displayName="W/Styles";const Q=e=>{const{index:n=0,options:t,next:r,render:o}=e;D(()=>{if(t.length<n+1)throw new Error(`Index ${n} is out of bounds for options array of length ${t.length}. Defaulting to first option.`)},[n,t]);const[l,s]=A(n),u=()=>{s(f=>t.length?r?r(f,t):(f+1)%t.length:f)};return o(t[l],u)},X=({onIntersect:e,threshold:n=.1,root:t=null,rootMargin:r="0px",triggerOnce:o=!1,disabled:l=!1,children:s,className:u,style:f})=>{const c=O(null),i=O(null),d=O(!1);return D(()=>{if(l||!c.current)return;if(!window.IntersectionObserver){console.warn("IntersectionObserver is not supported in this browser");return}const m=c.current,p=I=>{I.forEach(S=>{if(S.isIntersecting){if(o&&d.current)return;e(S,i.current),o&&(d.current=!0,i.current?.unobserve(m))}})};return i.current=new IntersectionObserver(p,{root:t,rootMargin:r,threshold:n}),i.current.observe(m),()=>{i.current&&i.current.disconnect()}},[e,n,t,r,o,l]),D(()=>{o||(d.current=!1)},[o]),a.createElement("div",{ref:c,className:u,style:f},s)};function ee(e){const{items:n,renderItem:t,filter:r}=e;return n?a.createElement(E,null,n.map((o,l)=>r&&!r(o)?null:t(o,l))):(console.error("ArrayRender: items is null"),null)}function te({source:e,format:n,children:t}){const r=g(()=>{if(e instanceof Date)return e;if(typeof e=="string"||typeof e=="number"){const l=new Date(e);return isNaN(l.getTime())?null:l}return null},[e]),o=g(()=>r?n?n(r):r.toLocaleString():null,[r,n]);return!o||!t?null:a.createElement(a.Fragment,null,t(o))}const ne="onChange",re="value";function le(e){const{defaultValue:n,onBeforeChange:t,trigger:r=ne,valuePropName:o=re,props:l}=e,s=Object.prototype.hasOwnProperty.call(l,o),[u,f]=A(n),c=s?l[o]:u,i=g(()=>l[r],[l,r]),d=V(m=>{const p=typeof m=="function"?m(c):m;t&&t(p,c)===!1||(s||f(p),i&&i(p))},[s,t,c,i]);return[c,d]}function oe(e,...n){try{const t=e(...n);return t instanceof Promise?t:Promise.resolve(t)}catch(t){return Promise.reject(t)}}const Y=typeof Promise.try=="function"?Promise.try.bind(Promise):oe;function k(e,n={}){let t=typeof e=="function"?e():e;const r=[],{sideEffect:o,transform:l}=n,s=()=>{const c=t;return l?.get?l.get(c):c},u=c=>{const i=t,d=l?.get?l.get(i):i;t=l?.set?l.set(typeof c=="function"?c(d):c):typeof c=="function"?c(d):c,r.forEach(m=>m(t)),o&&Y(o,t,i).catch(m=>{console.error("Error in external state side effect, Please do it within side effects:",m)})},f=()=>{const[c,i]=a.useState(t);return a.useEffect(()=>(r.push(i),()=>{const d=r.indexOf(i);d>-1&&r.splice(d,1)}),[]),[l?.get?l.get(c):c,u]};return{get:s,set:u,use:f,useGetter:()=>{const[c]=f();return c},__listeners:r}}function ae(e,n,t){const{storageType:r="local",sideEffect:o,transform:l}=t??{},s=r==="local"?localStorage:sessionStorage;let u=n;const f=s.getItem(e);if(f)try{u=JSON.parse(f)}catch(c){console.warn(`Failed to parse ${r}Storage value for key "${e}", using initial state:`,c),u=n}return k(u,{sideEffect:c=>{s.setItem(e,JSON.stringify(c)),o?.(c)},transform:l})}function se(e,n){const t=n||new Date,r=t.getFullYear(),o=t.getMonth()+1,l=t.getDate(),s=t.getHours(),u=t.getMinutes(),f=t.getSeconds(),c=t.getMilliseconds(),i=t.getDay(),d=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],m=["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],p=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],I=["January","February","March","April","May","June","July","August","September","October","November","December"],S=m[i],T=d[i],C=o-1,j=I[C],J=p[C],R={YY:r.toString().slice(2),YYYY:r.toString(),M:o.toString(),MM:o.toString().padStart(2,"0"),MMM:J,MMMM:j,D:l.toString(),DD:l.toString().padStart(2,"0"),d:i.toString(),dd:T,ddd:T,dddd:S,H:s.toString(),HH:s.toString().padStart(2,"0"),h:(s%12).toString(),hh:(s%12).toString().padStart(2,"0"),m:u.toString(),mm:u.toString().padStart(2,"0"),s:f.toString(),ss:f.toString().padStart(2,"0"),SSS:c.toString().padStart(3,"0"),Z:"+08:00",ZZ:"+0800",A:s<12?"AM":"PM",a:s<12?"am":"pm"};return e.replace(/YYYY|YY|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|m{1,2}|s{1,2}|SSS|Z{1,2}|A|a/g,_=>R[_])}class ce{count=0;next(){return this.count++}}export{ee as ArrayRender,ce as Counter,te as DateRender,L as False,h as If,X as Observer,G as Pipe,q as Scope,$ as SizeBox,x as Styles,y as Switch,Q as Toggle,z as True,U as When,P as childrenLoop,k as createExternalState,ae as createStorageState,F as cx,se as formatDate,Y as safePromiseTry,le as useControlled};
1
+ import o,{useMemo as y,Fragment as S,Children as W,isValidElement as H,cloneElement as B,useEffect as D,useState as A,useRef as O,useCallback as V}from"react";function P(e,n){if(e===void 0)return;let t=0;if(Array.isArray(e)){for(const r of e)if(n(r,t++)===!1)break}else n(e,t)}const Z=(e,n)=>e===n,E=e=>o.createElement(o.Fragment,null,e.children);E.displayName="Switch_Case";const w=e=>o.createElement(o.Fragment,null,e.children);w.displayName="Switch_Default";const g=e=>{const{value:n,compare:t=Z,children:r,strict:a=!1}=e,l=new Set;let s=null,u=null,d=!1;return P(r,(c,i)=>{if(!o.isValidElement(c))throw new Error(`Switch Children only accepts valid React elements at index ${i}`);const f=c.type;if(f.displayName===E.displayName){const m=c.props;if(l.has(m.value))throw new Error(`Switch found duplicate Case value at index ${i}: ${JSON.stringify(m.value)}${a?" (detected in strict mode)":""}`);if(l.add(m.value),!s&&t(n,m.value)&&(s=m.children,a===!1))return!1}else if(f.displayName===w.displayName){if(d)throw new Error(`Switch can only have one Default child at index ${i}`);if(d=!0,u=c.props.children,!a&&s)return!1}else throw new Error(`Switch Children only accepts 'Case' or 'Default' elements, found: ${String(f.displayName||f.name||f)} at index ${i}`)}),o.createElement(o.Fragment,null,s??u)};g.displayName="Switch",g.Case=E,g.Default=w,g.createTyped=function(){return{Switch:g,Case:E,Default:w}};const N=e=>o.createElement(o.Fragment,null,e.children),v=({children:e})=>o.createElement(o.Fragment,null,e),b=e=>o.createElement(o.Fragment,null,e.children);N.displayName="If_Then",v.displayName="If_Else",b.displayName="If_ElseIf";const h=({condition:e,children:n})=>{let t=null,r=null;const a=[];if(o.Children.forEach(n,l=>{if(!o.isValidElement(l))throw new Error("If component only accepts valid React elements");const s=l.type;if(s.displayName===N.displayName){if(t)throw new Error("If component can only have one Then child");t=l}else if(s.displayName===b.displayName)a.push(l);else if(s.displayName===v.displayName){if(r)throw new Error("If component can only have one Else child");r=l}else throw new Error(`If component only accepts 'Then', 'ElseIf', or 'Else' elements as children, found: ${String(s.displayName||s.name||s)}`)}),e)return t?o.createElement(o.Fragment,null,t.props.children):null;for(const l of a)if(l.props.condition)return o.createElement(o.Fragment,null,l.props.children);return r?o.createElement(o.Fragment,null,r.props.children):null};h.displayName="If",h.Then=N,h.ElseIf=b,h.Else=v,h.createTyped=function(){return{If:h,Then:N,ElseIf:b,Else:v}};const z=({condition:e,children:n})=>e?o.createElement(o.Fragment,null,n):null,L=({condition:e,children:n})=>e===!1?o.createElement(o.Fragment,null,n):null,U=({all:e,any:n,none:t,children:r,fallback:a})=>y(()=>(e&&(n||t)&&console.warn('When: Multiple condition types (all, any, none) provided; "all" takes precedence.'),!!(e&&e.length>0&&e.every(Boolean)||n&&n.length>0&&n.some(Boolean)||t&&t.length>0&&t.every(l=>!l))),[e,n,t])?o.createElement(o.Fragment,null,r):o.createElement(o.Fragment,null,a||null),G=({data:e,transform:n,render:t,fallback:r})=>{const a=y(()=>n.reduce((l,s)=>s(l),e),[e,n]);return a==null?o.createElement(o.Fragment,null,r||null):o.createElement(o.Fragment,null,t(a))},$=e=>{const{children:n,h:t,w:r,size:a,height:l,width:s,className:u}=e;return o.createElement("div",{style:{width:a||r||s,height:a||t||l,flexShrink:0},className:u},n)},q=({let:e,props:n,children:t,fallback:r})=>{const a=y(()=>typeof e=="function"?e(n):e,[e,n]);return!t||!Object.keys(a).length?o.createElement(o.Fragment,null,r||null):o.createElement(o.Fragment,null,t(a))};function M(...e){const n=new Set;for(const t of e)if(t){if(typeof t=="string")n.add(t);else if(Array.isArray(t))t.forEach(r=>n.add(r));else if(typeof t=="object")for(const[r,a]of Object.entries(t))a&&n.add(r)}return Array.from(n).join(" ")}const K=e=>typeof e=="object"&&!!e,x=({className:e,children:n,asWrapper:t=!1})=>{if(!n)return null;if(!e)return o.createElement(S,null,n);const r=typeof e=="string"?e:M(...Object.values(e));if(t)return o.createElement(t===!0?"div":t,{className:r},n);if(W.count(n)>1)return console.error("<Styles>: children has more than one child. Please check your code."),o.createElement(S,null,n);if(H(n)){const a=n;let l=a?.props?.className;return a?.type?.displayName===x.displayName&&K(l)&&(l=M(...Object.values(l))),B(n,{className:M(r,l)})}return console.error("<Styles>: children is not a valid React element. Please check your code."),o.createElement(S,null,n)};x.displayName="W/Styles";const Q=e=>{const{index:n=0,options:t,next:r,render:a}=e;D(()=>{if(t.length<n+1)throw new Error(`Index ${n} is out of bounds for options array of length ${t.length}. Defaulting to first option.`)},[n,t]);const[l,s]=A(n),u=()=>{s(d=>t.length?r?r(d,t):(d+1)%t.length:d)};return a(t[l],u)},X=({onIntersect:e,threshold:n=.1,root:t=null,rootMargin:r="0px",triggerOnce:a=!1,disabled:l=!1,children:s,className:u,style:d})=>{const c=O(null),i=O(null),f=O(!1);return D(()=>{if(l||!c.current)return;if(!window.IntersectionObserver){console.warn("IntersectionObserver is not supported in this browser");return}const m=c.current,p=F=>{F.forEach(I=>{a&&f.current||(e(I,i.current),a&&(f.current=!0,i.current?.unobserve(m)))})};return i.current=new IntersectionObserver(p,{root:t,rootMargin:r,threshold:n}),i.current.observe(m),()=>{i.current&&i.current.disconnect()}},[e,n,t,r,a,l]),D(()=>{a||(f.current=!1)},[a]),o.createElement("div",{ref:c,className:u,style:d},s)};function ee(e){const{items:n,renderItem:t,filter:r}=e;return n?o.createElement(S,null,n.map((a,l)=>r&&!r(a)?null:t(a,l))):(console.error("ArrayRender: items is null"),null)}function te({source:e,format:n,children:t}){const r=y(()=>{if(e instanceof Date)return e;if(typeof e=="string"||typeof e=="number"){const l=new Date(e);return isNaN(l.getTime())?null:l}return null},[e]),a=y(()=>r?n?n(r):r.toLocaleString():null,[r,n]);return!a||!t?null:o.createElement(o.Fragment,null,t(a))}const ne="onChange",re="value";function le(e){const{defaultValue:n,onBeforeChange:t,trigger:r=ne,valuePropName:a=re,props:l}=e,s=Object.prototype.hasOwnProperty.call(l,a),[u,d]=A(n),c=s?l[a]:u,i=y(()=>l[r],[l,r]),f=V(m=>{const p=typeof m=="function"?m(c):m;t&&t(p,c)===!1||(s||d(p),i&&i(p))},[s,t,c,i]);return[c,f]}function ae(e,...n){try{const t=e(...n);return t instanceof Promise?t:Promise.resolve(t)}catch(t){return Promise.reject(t)}}const Y=typeof Promise.try=="function"?Promise.try.bind(Promise):ae;function k(e,n={}){let t=typeof e=="function"?e():e;const r=[],{sideEffect:a,transform:l}=n,s=()=>{const c=t;return l?.get?l.get(c):c},u=c=>{const i=t,f=l?.get?l.get(i):i;t=l?.set?l.set(typeof c=="function"?c(f):c):typeof c=="function"?c(f):c,r.forEach(m=>m(t)),a&&Y(a,t,i).catch(m=>{console.error("Error in external state side effect, Please do it within side effects:",m)})},d=()=>{const[c,i]=o.useState(t);return o.useEffect(()=>(r.push(i),()=>{const f=r.indexOf(i);f>-1&&r.splice(f,1)}),[]),[l?.get?l.get(c):c,u]};return{get:s,set:u,use:d,useGetter:()=>{const[c]=d();return c},__listeners:r}}function oe(e,n,t){const{storageType:r="local",sideEffect:a,transform:l}=t??{},s=r==="local"?localStorage:sessionStorage;let u=n;const d=s.getItem(e);if(d)try{u=JSON.parse(d)}catch(c){console.warn(`Failed to parse ${r}Storage value for key "${e}", using initial state:`,c),u=n}return k(u,{sideEffect:c=>{s.setItem(e,JSON.stringify(c)),a?.(c)},transform:l})}function se(e,n){const t=n||new Date,r=t.getFullYear(),a=t.getMonth()+1,l=t.getDate(),s=t.getHours(),u=t.getMinutes(),d=t.getSeconds(),c=t.getMilliseconds(),i=t.getDay(),f=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],m=["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],p=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],F=["January","February","March","April","May","June","July","August","September","October","November","December"],I=m[i],T=f[i],C=a-1,j=F[C],J=p[C],R={YY:r.toString().slice(2),YYYY:r.toString(),M:a.toString(),MM:a.toString().padStart(2,"0"),MMM:J,MMMM:j,D:l.toString(),DD:l.toString().padStart(2,"0"),d:i.toString(),dd:T,ddd:T,dddd:I,H:s.toString(),HH:s.toString().padStart(2,"0"),h:(s%12).toString(),hh:(s%12).toString().padStart(2,"0"),m:u.toString(),mm:u.toString().padStart(2,"0"),s:d.toString(),ss:d.toString().padStart(2,"0"),SSS:c.toString().padStart(3,"0"),Z:"+08:00",ZZ:"+0800",A:s<12?"AM":"PM",a:s<12?"am":"pm"};return e.replace(/YYYY|YY|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|m{1,2}|s{1,2}|SSS|Z{1,2}|A|a/g,_=>R[_])}class ce{count=0;next(){return this.count++}}export{ee as ArrayRender,ce as Counter,te as DateRender,L as False,h as If,X as Observer,G as Pipe,q as Scope,$ as SizeBox,x as Styles,g as Switch,Q as Toggle,z as True,U as When,P as childrenLoop,k as createExternalState,oe as createStorageState,M as cx,se as formatDate,Y as safePromiseTry,le as useControlled};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wwog/react",
3
- "version": "1.3.2",
3
+ "version": "1.3.4",
4
4
  "description": "A practical React component library providing declarative flow control and common UI utility components to make your React code more concise and readable.",
5
5
  "keywords": [
6
6
  "react",
@@ -20,15 +20,6 @@
20
20
  ],
21
21
  "homepage": "https://github.com/wwog/react",
22
22
  "license": "MIT",
23
- "scripts": {
24
- "build": "unbuild",
25
- "format": "biome format --write src",
26
- "check": "biome check --write src",
27
- "test:unit": "vitest run --browser.headless",
28
- "test:types": "tsc --noEmit --skipLibCheck",
29
- "all-suites": "pnpm run format && pnpm run check && pnpm run test:types && pnpm run test:unit",
30
- "test:watch": "vitest"
31
- },
32
23
  "devDependencies": {
33
24
  "@biomejs/biome": "^1.9.4",
34
25
  "@types/react": "^19.1.2",
@@ -50,5 +41,13 @@
50
41
  "node": ">= 20.0.0",
51
42
  "pnpm": ">=8.15.0"
52
43
  },
53
- "packageManager": "pnpm@10.11.0+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977"
54
- }
44
+ "scripts": {
45
+ "build": "unbuild",
46
+ "format": "biome format --write src",
47
+ "check": "biome check --write src",
48
+ "test:unit": "vitest run --browser.headless",
49
+ "test:types": "tsc --noEmit --skipLibCheck",
50
+ "all-suites": "pnpm run format && pnpm run check && pnpm run test:types && pnpm run test:unit",
51
+ "test:watch": "vitest"
52
+ }
53
+ }
@@ -5,7 +5,10 @@ export interface ObserverProps {
5
5
  * @description_en Callback function when intersection occurs.
6
6
  * @description_zh 交叉时触发的回调函数。
7
7
  */
8
- onIntersect: (entry: IntersectionObserverEntry, observer: IntersectionObserver) => void;
8
+ onIntersect: (
9
+ entry: IntersectionObserverEntry,
10
+ observer: IntersectionObserver
11
+ ) => void;
9
12
  /**
10
13
  * @description_en Threshold(s) at which to trigger the callback. Default is 0.1.
11
14
  * @description_zh 触发回调的阈值,默认为 0.1。
@@ -76,14 +79,14 @@ export interface ObserverProps {
76
79
  * <Observer onIntersect={loadImage} triggerOnce>
77
80
  * <img data-src="image.jpg" alt="Lazy loaded" />
78
81
  * </Observer>
79
- *
82
+ *
80
83
  * // 无限滚动示例
81
84
  * <Observer onIntersect={loadMore} threshold={0.1}>
82
85
  * <div>滚动到这里加载更多</div>
83
86
  * </Observer>
84
- *
87
+ *
85
88
  * // 自定义根元素和边距
86
- * <Observer
89
+ * <Observer
87
90
  * onIntersect={handleIntersect}
88
91
  * root={scrollContainer}
89
92
  * rootMargin="100px"
@@ -115,7 +118,7 @@ export const Observer: React.FC<ObserverProps> = ({
115
118
 
116
119
  // 检查浏览器支持
117
120
  if (!window.IntersectionObserver) {
118
- console.warn('IntersectionObserver is not supported in this browser');
121
+ console.warn("IntersectionObserver is not supported in this browser");
119
122
  return;
120
123
  }
121
124
 
@@ -123,17 +126,15 @@ export const Observer: React.FC<ObserverProps> = ({
123
126
 
124
127
  const handleIntersect = (entries: IntersectionObserverEntry[]) => {
125
128
  entries.forEach((entry) => {
126
- if (entry.isIntersecting) {
127
- if (triggerOnce && hasTriggeredRef.current) {
128
- return;
129
- }
129
+ if (triggerOnce && hasTriggeredRef.current) {
130
+ return;
131
+ }
132
+
133
+ onIntersect(entry, observerRef.current!);
130
134
 
131
- onIntersect(entry, observerRef.current!);
132
-
133
- if (triggerOnce) {
134
- hasTriggeredRef.current = true;
135
- observerRef.current?.unobserve(element);
136
- }
135
+ if (triggerOnce) {
136
+ hasTriggeredRef.current = true;
137
+ observerRef.current?.unobserve(element);
137
138
  }
138
139
  });
139
140
  };
@@ -165,4 +166,4 @@ export const Observer: React.FC<ObserverProps> = ({
165
166
  {children}
166
167
  </div>
167
168
  );
168
- };
169
+ };
@@ -91,12 +91,6 @@ export const Styles: FC<StylesProps> = ({
91
91
  if (!children) {
92
92
  return null;
93
93
  }
94
- if (Children.count(children) > 1) {
95
- console.error(
96
- "<Styles>: children has more than one child. Please check your code."
97
- );
98
- return <Fragment>{children}</Fragment>;
99
- }
100
94
 
101
95
  if (!className) {
102
96
  return <Fragment>{children}</Fragment>;
@@ -109,6 +103,12 @@ export const Styles: FC<StylesProps> = ({
109
103
  const Tag = asWrapper === true ? "div" : asWrapper;
110
104
  return <Tag className={generatedClassName}>{children}</Tag>;
111
105
  }
106
+ if (Children.count(children) > 1) {
107
+ console.error(
108
+ "<Styles>: children has more than one child. Please check your code."
109
+ );
110
+ return <Fragment>{children}</Fragment>;
111
+ }
112
112
  if (isValidElement(children)) {
113
113
  const typeChildren = children as any;
114
114
  let processedChildClassName = typeChildren?.props?.className;
@@ -32,7 +32,6 @@ function promiseTry<T, U extends unknown[]>(
32
32
  export const safePromiseTry = (() => {
33
33
  if (typeof Promise.try === "function") {
34
34
  return Promise.try.bind(Promise);
35
- } else {
36
- return promiseTry;
37
35
  }
36
+ return promiseTry;
38
37
  })();