@atomic-design/di
Version:
Lightweight, type-safe dependency inversion utilities for Atomic Design architectures in React
2 lines (1 loc) • 2.25 kB
JavaScript
(function(i,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react"],a):(i=typeof globalThis<"u"?globalThis:i||self,a(i.atomicContext={},i.React,i.React))})(this,function(i,a,p){"use strict";const h={};function v(o,e){const n=H(o,e),r=n.getInitVariants(),t=p.createContext(r),{Provider:f}=t,l=()=>{const s=p.use(t);if(s===r)throw new Error("Need to wrap into Provider");return s.context};n.setDepsHook(()=>l());const V=({children:s,variants:j,space:b,variant:u})=>{const{variants:x}=p.useContext(t),d=p.useMemo(()=>k(x,j,b,u),[x,b,u,j]),y=p.useMemo(async()=>{try{return await n.getVariant(d)}catch(C){throw console.error(C),C}},[d]),w=p.use(y),D=p.useMemo(()=>({variants:d,context:w}),[d,w]);return a.jsx(f,{value:D,children:s})},c=s=>a.jsx(p.Suspense,{fallback:null,children:a.jsx(V,{...s})});function m(s,j){return u=>{const x=l()[s][j];return a.jsx(x,{...u||{}})}}return[l,c,m]}function k(o,e,n,r){const t={...o};return e&&Object.assign(t,e),n&&n&&Object.assign(t,{[n]:r}),t}function H(o,e){let n;const r=()=>n(),t=new Map;return{getVariant:async c=>{const m=M(c);let s=t.get(m);if(s)return s;const j=Object.entries(o).map(async([u,x])=>{const d=c[u];if(d){const w=e[u];if(w){const D=w[d];if(D){const C=await D();return C.setDepsHook(r),[u,C.output]}}}const y=await x();return y.setDepsHook(r),[u,y.output]}),b=await Promise.all(j);return s=Object.fromEntries(b),t.set(m,s),s},getInitVariants:()=>h,setDepsHook:c=>{n=c}}}function M(o){return Object.entries(o).filter(([,e])=>e!==void 0).sort(([e],[n])=>e.localeCompare(n)).map(([e,n])=>`${e}=${String(n)}`).join("&")}let g=1;function P(o){let e;return{output:Object.fromEntries(Object.entries(o).map(([r,t])=>{const f=(...l)=>{const[V]=l,c=e(),m=S(V)?{...V,deps:c}:{deps:c};return a.jsx(t,{...m})};return"displayName"in t?f.displayName=`${t.displayName}_${g++}`:"name"in t&&(f.displayName=`${t.name}_${g++}`),[r,f]})),setDepsHook:r=>{e=r}}}const O=o=>({output:o,setDepsHook:()=>{}});function S(o){return typeof o=="object"&&o!==null}i.blankDeps=O,i.createVariantsContext=v,i.extractComponentDeps=P,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});