@dr.pogodin/react-utils 1.47.4 → 1.48.0

package/build/development/client/getInj.js

@@ -8,6 +8,8 @@ import "core-js/modules/web.dom-exception.stack.js";
 // Encapsulates retrieval of server-side data injection into HTML template.
 
 /* global document */
+
+import { SEC_MS, timer } from '@dr.pogodin/js-utils';
 import { getBuildInfo } from "../shared/utils/isomorphy/buildInfo.js";
 let inj;
 export default function getInj() {
@@ -27,6 +29,8 @@ export default function getInj() {
         }
         const target = window.location.href.replace(/^http:/, 'https:');
         window.location.replace(target);
+        await timer(3 * SEC_MS);
+        throw Error('Failed to move into secure context');
       }
       const {
         key

package/build/development/client/getInj.js.map

@@ -1 +1 @@
-{"version":3,"file":"getInj.js","names":["getBuildInfo","inj","getInj","metaElement","document","querySelector","remove","data","atob","content","window","isSecureContext","location","protocol","Error","target","href","replace","key","code","x","charCodeAt","dataBuffer","Uint8Array","from","slice","ivBuffer","keyBuffer","cKey","crypto","subtle","importKey","name","buffer","decrypt","iv","decoder","TextDecoder","res","eval","decode","REACT_UTILS_INJECTION"],"sources":["../../../src/client/getInj.ts"],"sourcesContent":["// Encapsulates retrieval of server-side data injection into HTML template.\n\n/* global document */\n\nimport type { InjT } from 'utils/globalState';\n\nimport { getBuildInfo } from 'utils/isomorphy/buildInfo';\n\nlet inj: InjT | Promise<InjT> | undefined;\n\nexport default function getInj(): InjT | Promise<InjT> {\n  inj ??= (async () => {\n    const metaElement: HTMLMetaElement | null = typeof document === 'undefined'\n      ? null : document.querySelector('meta[itemprop=\"drpruinj\"]');\n\n    if (metaElement) {\n      metaElement.remove();\n\n      // NOTE: Since 2025 there is Uint8Array.fromBase64(), which should be\n      // preferred, but it is not supported by older environments yet.\n      const data = atob(metaElement.content);\n\n      if (!window.isSecureContext) {\n        if (window.location.protocol === 'https:') {\n          throw Error('Loaded via HTTPS, but it is not considered a secure context');\n        } else if (window.location.protocol !== 'http:') {\n          throw Error('Unexpected protocol');\n        }\n\n        const target = window.location.href.replace(/^http:/, 'https:');\n        window.location.replace(target);\n      }\n\n      const { key } = getBuildInfo();\n\n      const code = (x: string) => x.charCodeAt(0);\n      const dataBuffer = Uint8Array.from(data.slice(16), code);\n      const ivBuffer = Uint8Array.from(data.slice(0, 16), code);\n      const keyBuffer = Uint8Array.from(atob(key), code);\n\n      const cKey = await window.crypto.subtle.importKey(\n        'raw',\n        keyBuffer,\n        { name: 'AES-CBC' },\n        false,\n        ['decrypt'],\n      );\n\n      const buffer = await window.crypto.subtle.decrypt({\n        iv: ivBuffer,\n        name: 'AES-CBC',\n      }, cKey, dataBuffer);\n\n      const decoder = new TextDecoder();\n\n      // eslint-disable-next-line no-eval\n      const res = eval(`(${decoder.decode(buffer)})`) as InjT;\n\n      // NOTE: This is important, to be able to return the injection\n      // synchronously once it is initialized.\n      inj = res;\n\n      return res;\n    } else if (typeof window !== 'undefined' && window.REACT_UTILS_INJECTION) {\n      const res = window.REACT_UTILS_INJECTION;\n      delete window.REACT_UTILS_INJECTION;\n      return res;\n    }\n\n    // Otherwise, a bunch of dependent stuff will easily fail in non-standard\n    // environments, where no client-side initialization is performed. Like tests,\n    // Docusaurus examples, etc.\n    return {};\n  })();\n\n  return inj;\n}\n"],"mappings":";;;;;;;AAAA;;AAEA;AAAA,SAISA,YAAY;AAErB,IAAIC,GAAqC;AAEzC,eAAe,SAASC,MAAMA,CAAA,EAAyB;EACrDD,GAAG,KAAK,CAAC,YAAY;IACnB,MAAME,WAAmC,GAAG,OAAOC,QAAQ,KAAK,WAAW,GACvE,IAAI,GAAGA,QAAQ,CAACC,aAAa,CAAC,2BAA2B,CAAC;IAE9D,IAAIF,WAAW,EAAE;MACfA,WAAW,CAACG,MAAM,CAAC,CAAC;;MAEpB;MACA;MACA,MAAMC,IAAI,GAAGC,IAAI,CAACL,WAAW,CAACM,OAAO,CAAC;MAEtC,IAAI,CAACC,MAAM,CAACC,eAAe,EAAE;QAC3B,IAAID,MAAM,CAACE,QAAQ,CAACC,QAAQ,KAAK,QAAQ,EAAE;UACzC,MAAMC,KAAK,CAAC,6DAA6D,CAAC;QAC5E,CAAC,MAAM,IAAIJ,MAAM,CAACE,QAAQ,CAACC,QAAQ,KAAK,OAAO,EAAE;UAC/C,MAAMC,KAAK,CAAC,qBAAqB,CAAC;QACpC;QAEA,MAAMC,MAAM,GAAGL,MAAM,CAACE,QAAQ,CAACI,IAAI,CAACC,OAAO,CAAC,QAAQ,EAAE,QAAQ,CAAC;QAC/DP,MAAM,CAACE,QAAQ,CAACK,OAAO,CAACF,MAAM,CAAC;MACjC;MAEA,MAAM;QAAEG;MAAI,CAAC,GAAGlB,YAAY,CAAC,CAAC;MAE9B,MAAMmB,IAAI,GAAIC,CAAS,IAAKA,CAAC,CAACC,UAAU,CAAC,CAAC,CAAC;MAC3C,MAAMC,UAAU,GAAGC,UAAU,CAACC,IAAI,CAACjB,IAAI,CAACkB,KAAK,CAAC,EAAE,CAAC,EAAEN,IAAI,CAAC;MACxD,MAAMO,QAAQ,GAAGH,UAAU,CAACC,IAAI,CAACjB,IAAI,CAACkB,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,EAAEN,IAAI,CAAC;MACzD,MAAMQ,SAAS,GAAGJ,UAAU,CAACC,IAAI,CAAChB,IAAI,CAACU,GAAG,CAAC,EAAEC,IAAI,CAAC;MAElD,MAAMS,IAAI,GAAG,MAAMlB,MAAM,CAACmB,MAAM,CAACC,MAAM,CAACC,SAAS,CAC/C,KAAK,EACLJ,SAAS,EACT;QAAEK,IAAI,EAAE;MAAU,CAAC,EACnB,KAAK,EACL,CAAC,SAAS,CACZ,CAAC;MAED,MAAMC,MAAM,GAAG,MAAMvB,MAAM,CAACmB,MAAM,CAACC,MAAM,CAACI,OAAO,CAAC;QAChDC,EAAE,EAAET,QAAQ;QACZM,IAAI,EAAE;MACR,CAAC,EAAEJ,IAAI,EAAEN,UAAU,CAAC;MAEpB,MAAMc,OAAO,GAAG,IAAIC,WAAW,CAAC,CAAC;;MAEjC;MACA,MAAMC,GAAG,GAAGC,IAAI,CAAC,IAAIH,OAAO,CAACI,MAAM,CAACP,MAAM,CAAC,GAAG,CAAS;;MAEvD;MACA;MACAhC,GAAG,GAAGqC,GAAG;MAET,OAAOA,GAAG;IACZ,CAAC,MAAM,IAAI,OAAO5B,MAAM,KAAK,WAAW,IAAIA,MAAM,CAAC+B,qBAAqB,EAAE;MACxE,MAAMH,GAAG,GAAG5B,MAAM,CAAC+B,qBAAqB;MACxC,OAAO/B,MAAM,CAAC+B,qBAAqB;MACnC,OAAOH,GAAG;IACZ;;IAEA;IACA;IACA;IACA,OAAO,CAAC,CAAC;EACX,CAAC,EAAE,CAAC;EAEJ,OAAOrC,GAAG;AACZ","ignoreList":[]}
+{"version":3,"file":"getInj.js","names":["SEC_MS","timer","getBuildInfo","inj","getInj","metaElement","document","querySelector","remove","data","atob","content","window","isSecureContext","location","protocol","Error","target","href","replace","key","code","x","charCodeAt","dataBuffer","Uint8Array","from","slice","ivBuffer","keyBuffer","cKey","crypto","subtle","importKey","name","buffer","decrypt","iv","decoder","TextDecoder","res","eval","decode","REACT_UTILS_INJECTION"],"sources":["../../../src/client/getInj.ts"],"sourcesContent":["// Encapsulates retrieval of server-side data injection into HTML template.\n\n/* global document */\n\nimport { SEC_MS, timer } from '@dr.pogodin/js-utils';\n\nimport type { InjT } from 'utils/globalState';\n\nimport { getBuildInfo } from 'utils/isomorphy/buildInfo';\n\nlet inj: InjT | Promise<InjT> | undefined;\n\nexport default function getInj(): InjT | Promise<InjT> {\n  inj ??= (async () => {\n    const metaElement: HTMLMetaElement | null = typeof document === 'undefined'\n      ? null : document.querySelector('meta[itemprop=\"drpruinj\"]');\n\n    if (metaElement) {\n      metaElement.remove();\n\n      // NOTE: Since 2025 there is Uint8Array.fromBase64(), which should be\n      // preferred, but it is not supported by older environments yet.\n      const data = atob(metaElement.content);\n\n      if (!window.isSecureContext) {\n        if (window.location.protocol === 'https:') {\n          throw Error('Loaded via HTTPS, but it is not considered a secure context');\n        } else if (window.location.protocol !== 'http:') {\n          throw Error('Unexpected protocol');\n        }\n\n        const target = window.location.href.replace(/^http:/, 'https:');\n        window.location.replace(target);\n\n        await timer(3 * SEC_MS);\n        throw Error('Failed to move into secure context');\n      }\n\n      const { key } = getBuildInfo();\n\n      const code = (x: string) => x.charCodeAt(0);\n      const dataBuffer = Uint8Array.from(data.slice(16), code);\n      const ivBuffer = Uint8Array.from(data.slice(0, 16), code);\n      const keyBuffer = Uint8Array.from(atob(key), code);\n\n      const cKey = await window.crypto.subtle.importKey(\n        'raw',\n        keyBuffer,\n        { name: 'AES-CBC' },\n        false,\n        ['decrypt'],\n      );\n\n      const buffer = await window.crypto.subtle.decrypt({\n        iv: ivBuffer,\n        name: 'AES-CBC',\n      }, cKey, dataBuffer);\n\n      const decoder = new TextDecoder();\n\n      // eslint-disable-next-line no-eval\n      const res = eval(`(${decoder.decode(buffer)})`) as InjT;\n\n      // NOTE: This is important, to be able to return the injection\n      // synchronously once it is initialized.\n      inj = res;\n\n      return res;\n    } else if (typeof window !== 'undefined' && window.REACT_UTILS_INJECTION) {\n      const res = window.REACT_UTILS_INJECTION;\n      delete window.REACT_UTILS_INJECTION;\n      return res;\n    }\n\n    // Otherwise, a bunch of dependent stuff will easily fail in non-standard\n    // environments, where no client-side initialization is performed. Like tests,\n    // Docusaurus examples, etc.\n    return {};\n  })();\n\n  return inj;\n}\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA,SAASA,MAAM,EAAEC,KAAK,QAAQ,sBAAsB;AAAA,SAI3CC,YAAY;AAErB,IAAIC,GAAqC;AAEzC,eAAe,SAASC,MAAMA,CAAA,EAAyB;EACrDD,GAAG,KAAK,CAAC,YAAY;IACnB,MAAME,WAAmC,GAAG,OAAOC,QAAQ,KAAK,WAAW,GACvE,IAAI,GAAGA,QAAQ,CAACC,aAAa,CAAC,2BAA2B,CAAC;IAE9D,IAAIF,WAAW,EAAE;MACfA,WAAW,CAACG,MAAM,CAAC,CAAC;;MAEpB;MACA;MACA,MAAMC,IAAI,GAAGC,IAAI,CAACL,WAAW,CAACM,OAAO,CAAC;MAEtC,IAAI,CAACC,MAAM,CAACC,eAAe,EAAE;QAC3B,IAAID,MAAM,CAACE,QAAQ,CAACC,QAAQ,KAAK,QAAQ,EAAE;UACzC,MAAMC,KAAK,CAAC,6DAA6D,CAAC;QAC5E,CAAC,MAAM,IAAIJ,MAAM,CAACE,QAAQ,CAACC,QAAQ,KAAK,OAAO,EAAE;UAC/C,MAAMC,KAAK,CAAC,qBAAqB,CAAC;QACpC;QAEA,MAAMC,MAAM,GAAGL,MAAM,CAACE,QAAQ,CAACI,IAAI,CAACC,OAAO,CAAC,QAAQ,EAAE,QAAQ,CAAC;QAC/DP,MAAM,CAACE,QAAQ,CAACK,OAAO,CAACF,MAAM,CAAC;QAE/B,MAAMhB,KAAK,CAAC,CAAC,GAAGD,MAAM,CAAC;QACvB,MAAMgB,KAAK,CAAC,oCAAoC,CAAC;MACnD;MAEA,MAAM;QAAEI;MAAI,CAAC,GAAGlB,YAAY,CAAC,CAAC;MAE9B,MAAMmB,IAAI,GAAIC,CAAS,IAAKA,CAAC,CAACC,UAAU,CAAC,CAAC,CAAC;MAC3C,MAAMC,UAAU,GAAGC,UAAU,CAACC,IAAI,CAACjB,IAAI,CAACkB,KAAK,CAAC,EAAE,CAAC,EAAEN,IAAI,CAAC;MACxD,MAAMO,QAAQ,GAAGH,UAAU,CAACC,IAAI,CAACjB,IAAI,CAACkB,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,EAAEN,IAAI,CAAC;MACzD,MAAMQ,SAAS,GAAGJ,UAAU,CAACC,IAAI,CAAChB,IAAI,CAACU,GAAG,CAAC,EAAEC,IAAI,CAAC;MAElD,MAAMS,IAAI,GAAG,MAAMlB,MAAM,CAACmB,MAAM,CAACC,MAAM,CAACC,SAAS,CAC/C,KAAK,EACLJ,SAAS,EACT;QAAEK,IAAI,EAAE;MAAU,CAAC,EACnB,KAAK,EACL,CAAC,SAAS,CACZ,CAAC;MAED,MAAMC,MAAM,GAAG,MAAMvB,MAAM,CAACmB,MAAM,CAACC,MAAM,CAACI,OAAO,CAAC;QAChDC,EAAE,EAAET,QAAQ;QACZM,IAAI,EAAE;MACR,CAAC,EAAEJ,IAAI,EAAEN,UAAU,CAAC;MAEpB,MAAMc,OAAO,GAAG,IAAIC,WAAW,CAAC,CAAC;;MAEjC;MACA,MAAMC,GAAG,GAAGC,IAAI,CAAC,IAAIH,OAAO,CAACI,MAAM,CAACP,MAAM,CAAC,GAAG,CAAS;;MAEvD;MACA;MACAhC,GAAG,GAAGqC,GAAG;MAET,OAAOA,GAAG;IACZ,CAAC,MAAM,IAAI,OAAO5B,MAAM,KAAK,WAAW,IAAIA,MAAM,CAAC+B,qBAAqB,EAAE;MACxE,MAAMH,GAAG,GAAG5B,MAAM,CAAC+B,qBAAqB;MACxC,OAAO/B,MAAM,CAAC+B,qBAAqB;MACnC,OAAOH,GAAG;IACZ;;IAEA;IACA;IACA;IACA,OAAO,CAAC,CAAC;EACX,CAAC,EAAE,CAAC;EAEJ,OAAOrC,GAAG;AACZ","ignoreList":[]}

package/build/development/index.js

@@ -7,5 +7,5 @@ if (global.REACT_UTILS_LIBRARY_LOADED) {
 } else global.REACT_UTILS_LIBRARY_LOADED = true;
 export { getGlobalState, GlobalStateProvider, newAsyncDataEnvelope, useAsyncCollection, useAsyncData, useGlobalState, withGlobalStateType } from '@dr.pogodin/react-global-state';
 export * from "./shared/components/index.js";
-export { assertEmptyObject, Barrier, Cached, Emitter, getConfig, isomorphy, getSsrContext, Semaphore, splitComponent, themed, ThemeProvider, time, webpack, withRetries } from "./shared/utils/index.js";
+export { assertEmptyObject, Barrier, Cached, Emitter, getConfig, isomorphy, getSsrContext, Semaphore, splitComponent, THEME_COMPOSE, THEME_PRIORITY, ThemeProvider, time, useTheme, webpack, withRetries } from "./shared/utils/index.js";
 //# sourceMappingURL=index.js.map

package/build/development/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["global","REACT_UTILS_LIBRARY_LOADED","Error","getGlobalState","GlobalStateProvider","newAsyncDataEnvelope","useAsyncCollection","useAsyncData","useGlobalState","withGlobalStateType","assertEmptyObject","Barrier","Cached","Emitter","getConfig","isomorphy","getSsrContext","Semaphore","splitComponent","themed","ThemeProvider","time","webpack","withRetries"],"sources":["../../src/index.ts"],"sourcesContent":["// It is a safeguard against multiple instances / versions of the library\n// being loaded into environment by mistake (e.g. because of different\n// packages pinning down different exact versions of the lib, thus preventing\n// a proper dedupe and using a single common library version).\nif (global.REACT_UTILS_LIBRARY_LOADED) {\n  throw Error('React utils library is already loaded');\n} else global.REACT_UTILS_LIBRARY_LOADED = true;\n\nexport {\n  type AsyncCollectionT,\n  type AsyncCollectionLoaderT,\n  type AsyncDataEnvelopeT,\n  type AsyncDataLoaderT,\n  type ForceT,\n  type UseAsyncDataOptionsT,\n  type UseAsyncDataResT,\n  type UseGlobalStateResT,\n  type ValueOrInitializerT,\n  getGlobalState,\n  GlobalStateProvider,\n  newAsyncDataEnvelope,\n  useAsyncCollection,\n  useAsyncData,\n  useGlobalState,\n  withGlobalStateType,\n} from '@dr.pogodin/react-global-state';\n\nexport * from 'components';\n\nexport {\n  type BeforeRenderResT,\n  type BeforeRenderT,\n  type ConfigT,\n  type ServerSsrContext,\n  type ServerT,\n} from './server';\n\nexport {\n  assertEmptyObject,\n  Barrier,\n  Cached,\n  Emitter,\n  getConfig,\n  isomorphy,\n  getSsrContext,\n  type Listener,\n  type ObjectKey,\n  Semaphore,\n  splitComponent,\n  type Theme,\n  themed,\n  ThemeProvider,\n  time,\n  webpack,\n  withRetries,\n} from 'utils';\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA,IAAIA,MAAM,CAACC,0BAA0B,EAAE;EACrC,MAAMC,KAAK,CAAC,uCAAuC,CAAC;AACtD,CAAC,MAAMF,MAAM,CAACC,0BAA0B,GAAG,IAAI;AAE/C,SAUEE,cAAc,EACdC,mBAAmB,EACnBC,oBAAoB,EACpBC,kBAAkB,EAClBC,YAAY,EACZC,cAAc,EACdC,mBAAmB,QACd,gCAAgC;AAAA;AAAA,SAarCC,iBAAiB,EACjBC,OAAO,EACPC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,aAAa,EAGbC,SAAS,EACTC,cAAc,EAEdC,MAAM,EACNC,aAAa,EACbC,IAAI,EACJC,OAAO,EACPC,WAAW","ignoreList":[]}
+{"version":3,"file":"index.js","names":["global","REACT_UTILS_LIBRARY_LOADED","Error","getGlobalState","GlobalStateProvider","newAsyncDataEnvelope","useAsyncCollection","useAsyncData","useGlobalState","withGlobalStateType","assertEmptyObject","Barrier","Cached","Emitter","getConfig","isomorphy","getSsrContext","Semaphore","splitComponent","THEME_COMPOSE","THEME_PRIORITY","ThemeProvider","time","useTheme","webpack","withRetries"],"sources":["../../src/index.ts"],"sourcesContent":["// It is a safeguard against multiple instances / versions of the library\n// being loaded into environment by mistake (e.g. because of different\n// packages pinning down different exact versions of the lib, thus preventing\n// a proper dedupe and using a single common library version).\nif (global.REACT_UTILS_LIBRARY_LOADED) {\n  throw Error('React utils library is already loaded');\n} else global.REACT_UTILS_LIBRARY_LOADED = true;\n\nexport {\n  type AsyncCollectionT,\n  type AsyncCollectionLoaderT,\n  type AsyncDataEnvelopeT,\n  type AsyncDataLoaderT,\n  type ForceT,\n  type UseAsyncDataOptionsT,\n  type UseAsyncDataResT,\n  type UseGlobalStateResT,\n  type ValueOrInitializerT,\n  getGlobalState,\n  GlobalStateProvider,\n  newAsyncDataEnvelope,\n  useAsyncCollection,\n  useAsyncData,\n  useGlobalState,\n  withGlobalStateType,\n} from '@dr.pogodin/react-global-state';\n\nexport * from 'components';\n\nexport {\n  type BeforeRenderResT,\n  type BeforeRenderT,\n  type ConfigT,\n  type ServerSsrContext,\n  type ServerT,\n} from './server';\n\nexport {\n  assertEmptyObject,\n  Barrier,\n  Cached,\n  Emitter,\n  getConfig,\n  isomorphy,\n  getSsrContext,\n  type Listener,\n  type ObjectKey,\n  Semaphore,\n  splitComponent,\n  type Theme,\n  THEME_COMPOSE,\n  THEME_PRIORITY,\n  ThemeProvider,\n  time,\n  useTheme,\n  webpack,\n  withRetries,\n} from 'utils';\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA,IAAIA,MAAM,CAACC,0BAA0B,EAAE;EACrC,MAAMC,KAAK,CAAC,uCAAuC,CAAC;AACtD,CAAC,MAAMF,MAAM,CAACC,0BAA0B,GAAG,IAAI;AAE/C,SAUEE,cAAc,EACdC,mBAAmB,EACnBC,oBAAoB,EACpBC,kBAAkB,EAClBC,YAAY,EACZC,cAAc,EACdC,mBAAmB,QACd,gCAAgC;AAAA;AAAA,SAarCC,iBAAiB,EACjBC,OAAO,EACPC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,aAAa,EAGbC,SAAS,EACTC,cAAc,EAEdC,aAAa,EACbC,cAAc,EACdC,aAAa,EACbC,IAAI,EACJC,QAAQ,EACRC,OAAO,EACPC,WAAW","ignoreList":[]}

package/build/development/server/server.js

@@ -174,7 +174,6 @@ export default async function factory(webpackConfig, options) {
       default: webpackHotMiddleware
     } = await import(/* webpackChunkName: "server-side-code" */'webpack-hot-middleware');
     const compiler = webpack(webpackConfig);
-    if (!compiler) throw Error('Internal error');
     server.use(webpackDevMiddleware(compiler, {
       publicPath,
       serverSideRender: true

package/build/development/server/server.js.map

@@ -1 +1 @@
-{"version":3,"file":"server.js","names":["sep","pathToFileURL","cloneDeep","mapValues","pick","compression","cookieParser","csrf","express","favicon","helmet","loggerMiddleware","requestIp","v4","uuid","rendererFactory","CODES","ERRORS","getErrorForCode","newError","defaultCspSettings","directives","contentSecurityPolicy","getDefaultDirectives","array","filter","item","push","getDefaultCspSettings","factory","webpackConfig","options","rendererOps","renderer","publicPath","output","server","beforeExpressJsSetup","logger","httpsRedirect","use","req","res","next","schema","headers","url","host","originalUrl","redirect","crossOriginEmbedderPolicy","crossOriginOpenerPolicy","crossOriginResourcePolicy","noCsp","req2","nonce","cspNonce","cspSettings","cspSettingsHook","send","json","limit","urlencoded","extended","cookieSignatureSecret","mw","cookie","token","clientIp","FORMAT","stream","write","info","bind","get","static","path","setHeaders","set","devMode","global","location","href","process","cwd","default","webpack","webpackDevMiddleware","webpackHotMiddleware","compiler","Error","serverSideRender","onExpressJsSetup","NOT_FOUND","dontAttachDefaultErrorHandler","beforeExpressJsError","error","headersSent","status","INTERNAL_SERVER_ERROR","serverSide","log","toString","message","env","NODE_ENV"],"sources":["../../../src/server/server.ts"],"sourcesContent":["/**\n * Creation of standard ExpressJS server for ReactJS apps.\n */\n\nimport { sep } from 'node:path';\nimport { pathToFileURL } from 'node:url';\n\nimport { cloneDeep, mapValues, pick } from 'lodash-es';\n\nimport compression from 'compression';\nimport cookieParser from 'cookie-parser';\nimport csrf from '@dr.pogodin/csurf';\n\nimport express, {\n  type Express,\n  type NextFunction,\n  type Request,\n  type Response,\n} from 'express';\n\nimport favicon from 'serve-favicon';\nimport helmet, { type HelmetOptions } from 'helmet';\nimport loggerMiddleware from 'morgan';\nimport requestIp from 'request-ip';\nimport { v4 as uuid } from 'uuid';\n\nimport type { Configuration } from 'webpack';\n\nimport rendererFactory, {\n  type LoggerI,\n  type OptionsT as RendererOptionsT,\n} from './renderer';\n\nimport {\n  CODES,\n  ERRORS,\n  getErrorForCode,\n  newError,\n} from './utils/errors';\n\nexport type CspOptionsT = Exclude<HelmetOptions['contentSecurityPolicy'], boolean | undefined>;\n\n// eslint-disable-next-line @typescript-eslint/consistent-type-definitions\ninterface RequestT extends Request {\n  cspNonce: string;\n  nonce: string;\n}\n\n/**\n * Default Content Security Policy settings.\n * @ignore\n */\nconst defaultCspSettings = {\n  directives: mapValues(\n    helmet.contentSecurityPolicy.getDefaultDirectives(),\n\n    // 'https:' options (automatic re-write of insecure URLs to secure ones)\n    // is removed to facilitate local development with HTTP server. In cloud\n    // deployments we assume Apache or Nginx server in front of out app takes\n    // care about such re-writes.\n    (array) => (array as string[]).filter((item: string) => item !== 'https:'),\n  ),\n};\ndefaultCspSettings.directives['frame-src'] = [\n  \"'self'\",\n\n  // YouTube domain is whitelisted to allow <YouTubeVideo> component to work\n  // out of box.\n  'https://*.youtube.com',\n];\n\n{\n  const directives = defaultCspSettings.directives['script-src'];\n  if (directives) directives.push(\"'unsafe-eval'\");\n  else defaultCspSettings.directives['script-src'] = [\"'unsafe-eval'\"];\n}\n\n// No need for automatic re-writes via Content Security Policy settings:\n// the forefront Apache or Nginx server is supposed to take care of this\n// in production cloud deployments.\ndelete defaultCspSettings.directives['upgrade-insecure-requests'];\n\n/**\n * @category Utilities\n * @func server/getDefaultCspSettings\n * @global\n * @desc\n * ```js\n * import { server } from '@dr.pogodin/react-utils';\n * const { getDefaultCspSettings } from '@dr.pogodin/react-utils';\n * ```\n * @return {{\n *   directives: object\n * }} A deep copy of default CSP settings object used by `react-utils`,\n * with the exception of `nonce-xxx` clause in `script-src` directive,\n * which is added dynamically for each request.\n */\nexport function getDefaultCspSettings(): {\n  directives: Record<string, string[]>;\n} {\n  return cloneDeep(defaultCspSettings);\n}\n\nexport type ServerT = Express & {\n  logger: LoggerI;\n};\n\nexport type OptionsT = RendererOptionsT & {\n  beforeExpressJsError?:\n  (server: ServerT) => boolean | Promise<boolean>;\n\n  beforeExpressJsSetup?: (server: ServerT) => Promise<void> | void;\n  cookieSignatureSecret?: string;\n  cspSettingsHook?: (\n    defaultOptions: CspOptionsT,\n    req: Request,\n  ) => CspOptionsT;\n  devMode?: boolean;\n  httpsRedirect?: boolean;\n  onExpressJsSetup?: (server: ServerT) => Promise<void> | void;\n};\n\nexport default async function factory(\n  webpackConfig: Configuration,\n  options: OptionsT,\n): Promise<ServerT> {\n  const rendererOps: RendererOptionsT = pick(options, [\n    'Application',\n    'beforeRender',\n    'favicon',\n    'logger',\n    'maxSsrRounds',\n    'noCsp',\n    'ssrTimeout',\n    'staticCacheController',\n    'staticCacheSize',\n  ]);\n  const renderer = rendererFactory(webpackConfig, rendererOps);\n  const { publicPath } = webpackConfig.output!;\n\n  const server = express() as ServerT;\n\n  if (options.beforeExpressJsSetup) {\n    await options.beforeExpressJsSetup(server);\n  }\n\n  if (options.logger) server.logger = options.logger;\n\n  if (options.httpsRedirect) {\n    server.use((req, res, next) => {\n      const schema = req.headers['x-forwarded-proto'];\n      if (schema === 'http') {\n        let url = `https://${req.headers.host}`;\n        if (req.originalUrl !== '/') url += req.originalUrl;\n        res.redirect(url);\n        return;\n      }\n      next();\n    });\n  }\n\n  server.use(compression());\n  server.use(\n    helmet({\n      contentSecurityPolicy: false,\n      crossOriginEmbedderPolicy: false,\n      crossOriginOpenerPolicy: false,\n      crossOriginResourcePolicy: false,\n    }),\n  );\n\n  if (!options.noCsp) {\n    server.use(\n      (req: Request, res: Response, next: NextFunction) => {\n        const req2 = req as RequestT;\n\n        req2.nonce = uuid();\n\n        // TODO: This is deprecated, but it is kept for now for backward\n        // compatibility. Should be removed sometime later.\n        req2.cspNonce = req2.nonce;\n\n        // The deep clone is necessary here to ensure that default value can't be\n        // mutated during request processing.\n        let cspSettings: CspOptionsT = cloneDeep(defaultCspSettings);\n        (cspSettings.directives?.['script-src'] as string[]).push(`'nonce-${req2.nonce}'`);\n        if (options.cspSettingsHook) {\n          cspSettings = options.cspSettingsHook(cspSettings, req);\n        }\n        helmet.contentSecurityPolicy(cspSettings)(req, res, next);\n      },\n    );\n  }\n\n  if (options.favicon) {\n    server.use(favicon(options.favicon));\n  }\n\n  server.use('/robots.txt', (req, res) => {\n    res.send('User-agent: *\\nDisallow:');\n  });\n\n  server.use(express.json({ limit: '300kb' }));\n  server.use(express.urlencoded({ extended: false }));\n  server.use(cookieParser(options.cookieSignatureSecret));\n  server.use(requestIp.mw());\n\n  server.use(csrf({ cookie: true }));\n\n  loggerMiddleware.token(\n    'ip',\n    (req: Request & { clientIp: string }) => req.clientIp,\n  );\n  const FORMAT = ':ip > :status :method :url :response-time ms :res[content-length] :referrer :user-agent';\n  server.use(loggerMiddleware(FORMAT, {\n    stream: {\n      // TODO: This implies the logger is always set. Is it on a higher level?\n      // then mark it as always present.\n      write: options.logger!.info.bind(options.logger),\n    },\n  }));\n\n  // Note: no matter the \"public path\", we want the service worker, if any,\n  // to be served from the root, to have all web app pages in its scope.\n  // Thus, this setup to serve it. Probably, need some more configuration\n  // for special cases, but this will do for now.\n  server.get('/__service-worker.js', express.static(\n    webpackConfig.output?.path ?? '',\n    {\n      setHeaders: (res) => res.set('Cache-Control', 'no-cache'),\n    },\n  ));\n\n  /* Setup of Hot Module Reloading for development environment.\n   * These dependencies are not used, nor installed for production use,\n   * hence we should violate some import-related lint rules. */\n  /* eslint-disable import/no-extraneous-dependencies */\n  if (options.devMode) {\n    // This is a workaround for SASS bug:\n    // https://github.com/dart-lang/sdk/issues/27979\n    // which manifests itself sometimes when webpack dev middleware is used\n    // (in dev mode), and app modules are imported in some unfortunate ways.\n    // TODO: Double-check, what is going on here.\n    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n    if (!global.location) {\n      global.location = {\n        href: `${pathToFileURL(process.cwd()).href}${sep}`,\n      } as Location;\n    }\n\n    const { default: webpack } = await import(/* webpackChunkName: \"server-side-code\" */ 'webpack');\n\n    const { default: webpackDevMiddleware } = await import(\n      /* webpackChunkName: \"server-side-code\" */ 'webpack-dev-middleware'\n    );\n\n    const { default: webpackHotMiddleware } = await import(\n      /* webpackChunkName: \"server-side-code\" */ 'webpack-hot-middleware'\n    );\n\n    const compiler = webpack(webpackConfig);\n    if (!compiler) throw Error('Internal error');\n\n    server.use(webpackDevMiddleware(compiler, {\n      publicPath,\n      serverSideRender: true,\n    }));\n    server.use(webpackHotMiddleware(compiler));\n  }\n  /* eslint-enable import/no-extraneous-dependencies */\n\n  server.use(publicPath as string, express.static(webpackConfig.output!.path!));\n\n  if (options.onExpressJsSetup) {\n    await options.onExpressJsSetup(server);\n  }\n  server.use(renderer);\n\n  /* Detects 404 errors, and forwards them to the error handler. */\n  server.use((req, res, next) => {\n    next(newError(ERRORS.NOT_FOUND, CODES.NOT_FOUND));\n  });\n\n  let dontAttachDefaultErrorHandler;\n  if (options.beforeExpressJsError) {\n    dontAttachDefaultErrorHandler = await options.beforeExpressJsError(server);\n  }\n\n  /* Error handler. */\n  if (!dontAttachDefaultErrorHandler) {\n    // TODO: Do we need this error handler at all? It actually seems to do\n    // what the default ExpressJS error handler does anyway, see:\n    // https://expressjs.com/en/guide/error-handling.html\n    //\n    // TODO: It is better to move the default error handler definition\n    // to a stand-alone function at top-level, but the use of options.logger\n    // prevents to do it without some extra refactoring. Should be done sometime\n    // though.\n    server.use((\n      error: Error & {\n        status?: number;\n      },\n      req: Request,\n      res: Response,\n      next: NextFunction,\n    ) => {\n      // TODO: This is needed to correctly handled any errors thrown after\n      // sending initial response to the client.\n      if (res.headersSent) {\n        next(error);\n        return;\n      }\n\n      const status = error.status ?? CODES.INTERNAL_SERVER_ERROR;\n      const serverSide = status >= (CODES.INTERNAL_SERVER_ERROR as number);\n\n      // Log server-side errors always, client-side at debug level only.\n      options.logger!.log(serverSide ? 'error' : 'debug', error.toString());\n\n      let message = error.message || getErrorForCode(status);\n      if (serverSide && process.env.NODE_ENV === 'production') {\n        message = ERRORS.INTERNAL_SERVER_ERROR;\n      }\n\n      res.status(status).send(message);\n    });\n  }\n\n  return server;\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"server.js","names":["sep","pathToFileURL","cloneDeep","mapValues","pick","compression","cookieParser","csrf","express","favicon","helmet","loggerMiddleware","requestIp","v4","uuid","rendererFactory","CODES","ERRORS","getErrorForCode","newError","defaultCspSettings","directives","contentSecurityPolicy","getDefaultDirectives","array","filter","item","push","getDefaultCspSettings","factory","webpackConfig","options","rendererOps","renderer","publicPath","output","server","beforeExpressJsSetup","logger","httpsRedirect","use","req","res","next","schema","headers","url","host","originalUrl","redirect","crossOriginEmbedderPolicy","crossOriginOpenerPolicy","crossOriginResourcePolicy","noCsp","req2","nonce","cspNonce","cspSettings","cspSettingsHook","send","json","limit","urlencoded","extended","cookieSignatureSecret","mw","cookie","token","clientIp","FORMAT","stream","write","info","bind","get","static","path","setHeaders","set","devMode","global","location","href","process","cwd","default","webpack","webpackDevMiddleware","webpackHotMiddleware","compiler","serverSideRender","onExpressJsSetup","NOT_FOUND","dontAttachDefaultErrorHandler","beforeExpressJsError","error","headersSent","status","INTERNAL_SERVER_ERROR","serverSide","log","toString","message","env","NODE_ENV"],"sources":["../../../src/server/server.ts"],"sourcesContent":["/**\n * Creation of standard ExpressJS server for ReactJS apps.\n */\n\nimport { sep } from 'node:path';\nimport { pathToFileURL } from 'node:url';\n\nimport { cloneDeep, mapValues, pick } from 'lodash-es';\n\nimport compression from 'compression';\nimport cookieParser from 'cookie-parser';\nimport csrf from '@dr.pogodin/csurf';\n\nimport express, {\n  type Express,\n  type NextFunction,\n  type Request,\n  type Response,\n} from 'express';\n\nimport favicon from 'serve-favicon';\nimport helmet, { type HelmetOptions } from 'helmet';\nimport loggerMiddleware from 'morgan';\nimport requestIp from 'request-ip';\nimport { v4 as uuid } from 'uuid';\n\nimport type { Configuration } from 'webpack';\n\nimport rendererFactory, {\n  type LoggerI,\n  type OptionsT as RendererOptionsT,\n} from './renderer';\n\nimport {\n  CODES,\n  ERRORS,\n  getErrorForCode,\n  newError,\n} from './utils/errors';\n\nexport type CspOptionsT = Exclude<HelmetOptions['contentSecurityPolicy'], boolean | undefined>;\n\n// eslint-disable-next-line @typescript-eslint/consistent-type-definitions\ninterface RequestT extends Request {\n  cspNonce: string;\n  nonce: string;\n}\n\n/**\n * Default Content Security Policy settings.\n * @ignore\n */\nconst defaultCspSettings = {\n  directives: mapValues(\n    helmet.contentSecurityPolicy.getDefaultDirectives(),\n\n    // 'https:' options (automatic re-write of insecure URLs to secure ones)\n    // is removed to facilitate local development with HTTP server. In cloud\n    // deployments we assume Apache or Nginx server in front of out app takes\n    // care about such re-writes.\n    (array) => (array as string[]).filter((item: string) => item !== 'https:'),\n  ),\n};\ndefaultCspSettings.directives['frame-src'] = [\n  \"'self'\",\n\n  // YouTube domain is whitelisted to allow <YouTubeVideo> component to work\n  // out of box.\n  'https://*.youtube.com',\n];\n\n{\n  const directives = defaultCspSettings.directives['script-src'];\n  if (directives) directives.push(\"'unsafe-eval'\");\n  else defaultCspSettings.directives['script-src'] = [\"'unsafe-eval'\"];\n}\n\n// No need for automatic re-writes via Content Security Policy settings:\n// the forefront Apache or Nginx server is supposed to take care of this\n// in production cloud deployments.\ndelete defaultCspSettings.directives['upgrade-insecure-requests'];\n\n/**\n * @category Utilities\n * @func server/getDefaultCspSettings\n * @global\n * @desc\n * ```js\n * import { server } from '@dr.pogodin/react-utils';\n * const { getDefaultCspSettings } from '@dr.pogodin/react-utils';\n * ```\n * @return {{\n *   directives: object\n * }} A deep copy of default CSP settings object used by `react-utils`,\n * with the exception of `nonce-xxx` clause in `script-src` directive,\n * which is added dynamically for each request.\n */\nexport function getDefaultCspSettings(): {\n  directives: Record<string, string[]>;\n} {\n  return cloneDeep(defaultCspSettings);\n}\n\nexport type ServerT = Express & {\n  logger: LoggerI;\n};\n\nexport type OptionsT = RendererOptionsT & {\n  beforeExpressJsError?:\n  (server: ServerT) => boolean | Promise<boolean>;\n\n  beforeExpressJsSetup?: (server: ServerT) => Promise<void> | void;\n  cookieSignatureSecret?: string;\n  cspSettingsHook?: (\n    defaultOptions: CspOptionsT,\n    req: Request,\n  ) => CspOptionsT;\n  devMode?: boolean;\n  httpsRedirect?: boolean;\n  onExpressJsSetup?: (server: ServerT) => Promise<void> | void;\n};\n\nexport default async function factory(\n  webpackConfig: Configuration,\n  options: OptionsT,\n): Promise<ServerT> {\n  const rendererOps: RendererOptionsT = pick(options, [\n    'Application',\n    'beforeRender',\n    'favicon',\n    'logger',\n    'maxSsrRounds',\n    'noCsp',\n    'ssrTimeout',\n    'staticCacheController',\n    'staticCacheSize',\n  ]);\n  const renderer = rendererFactory(webpackConfig, rendererOps);\n  const { publicPath } = webpackConfig.output!;\n\n  const server = express() as ServerT;\n\n  if (options.beforeExpressJsSetup) {\n    await options.beforeExpressJsSetup(server);\n  }\n\n  if (options.logger) server.logger = options.logger;\n\n  if (options.httpsRedirect) {\n    server.use((req, res, next) => {\n      const schema = req.headers['x-forwarded-proto'];\n      if (schema === 'http') {\n        let url = `https://${req.headers.host}`;\n        if (req.originalUrl !== '/') url += req.originalUrl;\n        res.redirect(url);\n        return;\n      }\n      next();\n    });\n  }\n\n  server.use(compression());\n  server.use(\n    helmet({\n      contentSecurityPolicy: false,\n      crossOriginEmbedderPolicy: false,\n      crossOriginOpenerPolicy: false,\n      crossOriginResourcePolicy: false,\n    }),\n  );\n\n  if (!options.noCsp) {\n    server.use(\n      (req: Request, res: Response, next: NextFunction) => {\n        const req2 = req as RequestT;\n\n        req2.nonce = uuid();\n\n        // TODO: This is deprecated, but it is kept for now for backward\n        // compatibility. Should be removed sometime later.\n        req2.cspNonce = req2.nonce;\n\n        // The deep clone is necessary here to ensure that default value can't be\n        // mutated during request processing.\n        let cspSettings: CspOptionsT = cloneDeep(defaultCspSettings);\n        (cspSettings.directives?.['script-src'] as string[]).push(`'nonce-${req2.nonce}'`);\n        if (options.cspSettingsHook) {\n          cspSettings = options.cspSettingsHook(cspSettings, req);\n        }\n        helmet.contentSecurityPolicy(cspSettings)(req, res, next);\n      },\n    );\n  }\n\n  if (options.favicon) {\n    server.use(favicon(options.favicon));\n  }\n\n  server.use('/robots.txt', (req, res) => {\n    res.send('User-agent: *\\nDisallow:');\n  });\n\n  server.use(express.json({ limit: '300kb' }));\n  server.use(express.urlencoded({ extended: false }));\n  server.use(cookieParser(options.cookieSignatureSecret));\n  server.use(requestIp.mw());\n\n  server.use(csrf({ cookie: true }));\n\n  loggerMiddleware.token(\n    'ip',\n    (req: Request & { clientIp: string }) => req.clientIp,\n  );\n  const FORMAT = ':ip > :status :method :url :response-time ms :res[content-length] :referrer :user-agent';\n  server.use(loggerMiddleware(FORMAT, {\n    stream: {\n      // TODO: This implies the logger is always set. Is it on a higher level?\n      // then mark it as always present.\n      write: options.logger!.info.bind(options.logger),\n    },\n  }));\n\n  // Note: no matter the \"public path\", we want the service worker, if any,\n  // to be served from the root, to have all web app pages in its scope.\n  // Thus, this setup to serve it. Probably, need some more configuration\n  // for special cases, but this will do for now.\n  server.get('/__service-worker.js', express.static(\n    webpackConfig.output?.path ?? '',\n    {\n      setHeaders: (res) => res.set('Cache-Control', 'no-cache'),\n    },\n  ));\n\n  /* Setup of Hot Module Reloading for development environment.\n   * These dependencies are not used, nor installed for production use,\n   * hence we should violate some import-related lint rules. */\n  /* eslint-disable import/no-extraneous-dependencies */\n  if (options.devMode) {\n    // This is a workaround for SASS bug:\n    // https://github.com/dart-lang/sdk/issues/27979\n    // which manifests itself sometimes when webpack dev middleware is used\n    // (in dev mode), and app modules are imported in some unfortunate ways.\n    // TODO: Double-check, what is going on here.\n    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n    if (!global.location) {\n      global.location = {\n        href: `${pathToFileURL(process.cwd()).href}${sep}`,\n      } as Location;\n    }\n\n    const { default: webpack } = await import(/* webpackChunkName: \"server-side-code\" */ 'webpack');\n\n    const { default: webpackDevMiddleware } = await import(\n      /* webpackChunkName: \"server-side-code\" */ 'webpack-dev-middleware'\n    );\n\n    const { default: webpackHotMiddleware } = await import(\n      /* webpackChunkName: \"server-side-code\" */ 'webpack-hot-middleware'\n    );\n\n    const compiler = webpack(webpackConfig);\n\n    server.use(webpackDevMiddleware(compiler, {\n      publicPath,\n      serverSideRender: true,\n    }));\n    server.use(webpackHotMiddleware(compiler));\n  }\n  /* eslint-enable import/no-extraneous-dependencies */\n\n  server.use(publicPath as string, express.static(webpackConfig.output!.path!));\n\n  if (options.onExpressJsSetup) {\n    await options.onExpressJsSetup(server);\n  }\n  server.use(renderer);\n\n  /* Detects 404 errors, and forwards them to the error handler. */\n  server.use((req, res, next) => {\n    next(newError(ERRORS.NOT_FOUND, CODES.NOT_FOUND));\n  });\n\n  let dontAttachDefaultErrorHandler;\n  if (options.beforeExpressJsError) {\n    dontAttachDefaultErrorHandler = await options.beforeExpressJsError(server);\n  }\n\n  /* Error handler. */\n  if (!dontAttachDefaultErrorHandler) {\n    // TODO: Do we need this error handler at all? It actually seems to do\n    // what the default ExpressJS error handler does anyway, see:\n    // https://expressjs.com/en/guide/error-handling.html\n    //\n    // TODO: It is better to move the default error handler definition\n    // to a stand-alone function at top-level, but the use of options.logger\n    // prevents to do it without some extra refactoring. Should be done sometime\n    // though.\n    server.use((\n      error: Error & {\n        status?: number;\n      },\n      req: Request,\n      res: Response,\n      next: NextFunction,\n    ) => {\n      // TODO: This is needed to correctly handled any errors thrown after\n      // sending initial response to the client.\n      if (res.headersSent) {\n        next(error);\n        return;\n      }\n\n      const status = error.status ?? CODES.INTERNAL_SERVER_ERROR;\n      const serverSide = status >= (CODES.INTERNAL_SERVER_ERROR as number);\n\n      // Log server-side errors always, client-side at debug level only.\n      options.logger!.log(serverSide ? 'error' : 'debug', error.toString());\n\n      let message = error.message || getErrorForCode(status);\n      if (serverSide && process.env.NODE_ENV === 'production') {\n        message = ERRORS.INTERNAL_SERVER_ERROR;\n      }\n\n      res.status(status).send(message);\n    });\n  }\n\n  return server;\n}\n"],"mappings":"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","ignoreList":[]}

package/build/development/shared/components/Button/index.js

@@ -1,6 +1,6 @@
 // The <Button> component implements a standard button / button-like link.
 
-import themed from '@dr.pogodin/react-themes';
+import { useTheme } from '@dr.pogodin/react-themes';
 import Link from "../Link.js";
 const defaultTheme = {
   "context": "-dr-pogodin-react-utils___build-web-shared-components-Button-style___context___0S7CYa",
@@ -85,13 +85,17 @@ export const BaseButton = ({
     children: children
   });
 };
+const Button = ({
+  theme,
+  ...rest
+}) => {
+  const composed = useTheme('Button', defaultTheme, theme);
 
-/**
- * Button component theme: a map of CSS
- * class names to append to button elements:
- * @prop {string} [active] to the root element of active button.
- * @prop {string} [button] to the root element of any button.
- * @prop {string} [disabled] to the root element of disabled button.
- */
-export default /* #__PURE__ */themed(BaseButton, 'Button', defaultTheme);
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  return /*#__PURE__*/_jsx(BaseButton, {
+    ...rest,
+    theme: composed
+  });
+};
+export default Button;
 //# sourceMappingURL=index.js.map

package/build/development/shared/components/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["themed","Link","defaultTheme","jsx","_jsx","BaseButton","active","children","disabled","enforceA","onClick","onKeyDown","onKeyDownProp","onKeyUp","onMouseDown","onMouseUp","onPointerDown","onPointerUp","openNewTab","replace","testId","theme","to","className","button","process","env","NODE_ENV","undefined","e","key","role","tabIndex"],"sources":["../../../../../src/shared/components/Button/index.tsx"],"sourcesContent":["// The <Button> component implements a standard button / button-like link.\n\nimport type {\n  FunctionComponent,\n  KeyboardEventHandler,\n  MouseEventHandler,\n  PointerEventHandler,\n  ReactNode,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport Link from 'components/Link';\n\nimport defaultTheme from './style.scss';\n\ntype PropsT = {\n  active?: boolean;\n  children?: ReactNode;\n  disabled?: boolean;\n  enforceA?: boolean;\n  onClick?: MouseEventHandler & KeyboardEventHandler;\n  onKeyDown?: KeyboardEventHandler;\n  onKeyUp?: KeyboardEventHandler;\n  onMouseDown?: MouseEventHandler;\n  onMouseUp?: MouseEventHandler;\n  onPointerDown?: PointerEventHandler;\n  onPointerUp?: PointerEventHandler;\n  openNewTab?: boolean;\n  replace?: boolean;\n  testId?: string;\n  theme: Theme<'active' | 'button' | 'disabled'>;\n  // TODO: It needs a more precise typing of the object option.\n  to?: object | string;\n};\n\nexport const BaseButton: FunctionComponent<PropsT> = ({\n  active,\n  children,\n  disabled,\n  enforceA,\n  onClick,\n  onKeyDown: onKeyDownProp,\n  onKeyUp,\n  onMouseDown,\n  onMouseUp,\n  onPointerDown,\n  onPointerUp,\n  openNewTab,\n  replace,\n  testId,\n  theme,\n  to,\n}) => {\n  let className = theme.button;\n  if (active && theme.active) className += ` ${theme.active}`;\n  if (disabled) {\n    if (theme.disabled) className += ` ${theme.disabled}`;\n    return (\n      <div\n        className={className}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n      >\n        {children}\n      </div>\n    );\n  }\n\n  let onKeyDown = onKeyDownProp;\n  if (!onKeyDown && onClick) {\n    onKeyDown = (e) => {\n      if (e.key === 'Enter') onClick(e);\n    };\n  }\n\n  if (to) {\n    return (\n      <Link\n        className={className}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n        enforceA={enforceA}\n        onClick={onClick}\n\n        // TODO: For now, the `onKeyDown` handler is not passed to the <Link>,\n        // as <Link> component does not call it anyway, presumably due to\n        // the inner implementation details. We should look into supporting it:\n        // https://github.com/birdofpreyru/react-utils/issues/444\n        // onKeyDown={onKeyDown}\n\n        onKeyUp={onKeyUp}\n        onMouseDown={onMouseDown}\n        onMouseUp={onMouseUp}\n        onPointerDown={onPointerDown}\n        onPointerUp={onPointerUp}\n        openNewTab={openNewTab}\n        replace={replace}\n        to={to}\n      >\n        {children}\n      </Link>\n    );\n  }\n\n  return (\n    <div\n      className={className}\n      data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n      onClick={onClick}\n      onKeyDown={onKeyDown}\n      onKeyUp={onKeyUp}\n      onMouseDown={onMouseDown}\n      onMouseUp={onMouseUp}\n      onPointerDown={onPointerDown}\n      onPointerUp={onPointerUp}\n      role=\"button\"\n      tabIndex={0}\n    >\n      {children}\n    </div>\n  );\n};\n\n/**\n * Button component theme: a map of CSS\n * class names to append to button elements:\n * @prop {string} [active] to the root element of active button.\n * @prop {string} [button] to the root element of any button.\n * @prop {string} [disabled] to the root element of disabled button.\n */\nexport default /* #__PURE__ */ themed(BaseButton, 'Button', defaultTheme);\n"],"mappings":"AAAA;;AAUA,OAAOA,MAAM,MAAsB,0BAA0B;AAAA,OAEtDC,IAAI;AAAA,MAAAC,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAE6B,SAAAC,GAAA,IAAAC,IAAA;AAsBxC,OAAO,MAAMC,UAAqC,GAAGA,CAAC;EACpDC,MAAM;EACNC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,OAAO;EACPC,SAAS,EAAEC,aAAa;EACxBC,OAAO;EACPC,WAAW;EACXC,SAAS;EACTC,aAAa;EACbC,WAAW;EACXC,UAAU;EACVC,OAAO;EACPC,MAAM;EACNC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,IAAIC,SAAS,GAAGF,KAAK,CAACG,MAAM;EAC5B,IAAIlB,MAAM,IAAIe,KAAK,CAACf,MAAM,EAAEiB,SAAS,IAAI,IAAIF,KAAK,CAACf,MAAM,EAAE;EAC3D,IAAIE,QAAQ,EAAE;IACZ,IAAIa,KAAK,CAACb,QAAQ,EAAEe,SAAS,IAAI,IAAIF,KAAK,CAACb,QAAQ,EAAE;IACrD,oBACEJ,IAAA;MACEmB,SAAS,EAAEA,SAAU;MACrB,eAAaE,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGC,SAAS,GAAGR,MAAO;MAAAb,QAAA,EAEvEA;IAAQ,CACN,CAAC;EAEV;EAEA,IAAII,SAAS,GAAGC,aAAa;EAC7B,IAAI,CAACD,SAAS,IAAID,OAAO,EAAE;IACzBC,SAAS,GAAIkB,CAAC,IAAK;MACjB,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAEpB,OAAO,CAACmB,CAAC,CAAC;IACnC,CAAC;EACH;EAEA,IAAIP,EAAE,EAAE;IACN,oBACElB,IAAA,CAACH,IAAI;MACHsB,SAAS,EAAEA,SAAU;MACrB,eAAaE,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGC,SAAS,GAAGR,MAAO;MACxEX,QAAQ,EAAEA,QAAS;MACnBC,OAAO,EAAEA;;MAET;MACA;MACA;MACA;MACA;MAAA;;MAEAG,OAAO,EAAEA,OAAQ;MACjBC,WAAW,EAAEA,WAAY;MACzBC,SAAS,EAAEA,SAAU;MACrBC,aAAa,EAAEA,aAAc;MAC7BC,WAAW,EAAEA,WAAY;MACzBC,UAAU,EAAEA,UAAW;MACvBC,OAAO,EAAEA,OAAQ;MACjBG,EAAE,EAAEA,EAAG;MAAAf,QAAA,EAENA;IAAQ,CACL,CAAC;EAEX;EAEA,oBACEH,IAAA;IACEmB,SAAS,EAAEA,SAAU;IACrB,eAAaE,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGC,SAAS,GAAGR,MAAO;IACxEV,OAAO,EAAEA,OAAQ;IACjBC,SAAS,EAAEA,SAAU;IACrBE,OAAO,EAAEA,OAAQ;IACjBC,WAAW,EAAEA,WAAY;IACzBC,SAAS,EAAEA,SAAU;IACrBC,aAAa,EAAEA,aAAc;IAC7BC,WAAW,EAAEA,WAAY;IACzBc,IAAI,EAAC,QAAQ;IACbC,QAAQ,EAAE,CAAE;IAAAzB,QAAA,EAEXA;EAAQ,CACN,CAAC;AAEV,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,eAAgBP,MAAM,CAACK,UAAU,EAAE,QAAQ,EAAEH,YAAY,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useTheme","Link","defaultTheme","jsx","_jsx","BaseButton","active","children","disabled","enforceA","onClick","onKeyDown","onKeyDownProp","onKeyUp","onMouseDown","onMouseUp","onPointerDown","onPointerUp","openNewTab","replace","testId","theme","to","className","button","process","env","NODE_ENV","undefined","e","key","role","tabIndex","Button","rest","composed"],"sources":["../../../../../src/shared/components/Button/index.tsx"],"sourcesContent":["// The <Button> component implements a standard button / button-like link.\n\nimport type {\n  FunctionComponent,\n  KeyboardEventHandler,\n  MouseEventHandler,\n  PointerEventHandler,\n  ReactNode,\n} from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport Link from 'components/Link';\n\nimport defaultTheme from './style.scss';\n\ntype ThemeT = Theme<'active' | 'button' | 'disabled'>;\n\ntype PropsT = {\n  active?: boolean;\n  children?: ReactNode;\n  disabled?: boolean;\n  enforceA?: boolean;\n  onClick?: MouseEventHandler & KeyboardEventHandler;\n  onKeyDown?: KeyboardEventHandler;\n  onKeyUp?: KeyboardEventHandler;\n  onMouseDown?: MouseEventHandler;\n  onMouseUp?: MouseEventHandler;\n  onPointerDown?: PointerEventHandler;\n  onPointerUp?: PointerEventHandler;\n  openNewTab?: boolean;\n  replace?: boolean;\n  testId?: string;\n  theme: ThemeT;\n\n  // TODO: It needs a more precise typing of the object option.\n  to?: object | string;\n};\n\nexport const BaseButton: FunctionComponent<PropsT> = ({\n  active,\n  children,\n  disabled,\n  enforceA,\n  onClick,\n  onKeyDown: onKeyDownProp,\n  onKeyUp,\n  onMouseDown,\n  onMouseUp,\n  onPointerDown,\n  onPointerUp,\n  openNewTab,\n  replace,\n  testId,\n  theme,\n  to,\n}) => {\n  let className = theme.button;\n  if (active && theme.active) className += ` ${theme.active}`;\n  if (disabled) {\n    if (theme.disabled) className += ` ${theme.disabled}`;\n    return (\n      <div\n        className={className}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n      >\n        {children}\n      </div>\n    );\n  }\n\n  let onKeyDown = onKeyDownProp;\n  if (!onKeyDown && onClick) {\n    onKeyDown = (e) => {\n      if (e.key === 'Enter') onClick(e);\n    };\n  }\n\n  if (to) {\n    return (\n      <Link\n        className={className}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n        enforceA={enforceA}\n        onClick={onClick}\n\n        // TODO: For now, the `onKeyDown` handler is not passed to the <Link>,\n        // as <Link> component does not call it anyway, presumably due to\n        // the inner implementation details. We should look into supporting it:\n        // https://github.com/birdofpreyru/react-utils/issues/444\n        // onKeyDown={onKeyDown}\n\n        onKeyUp={onKeyUp}\n        onMouseDown={onMouseDown}\n        onMouseUp={onMouseUp}\n        onPointerDown={onPointerDown}\n        onPointerUp={onPointerUp}\n        openNewTab={openNewTab}\n        replace={replace}\n        to={to}\n      >\n        {children}\n      </Link>\n    );\n  }\n\n  return (\n    <div\n      className={className}\n      data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n      onClick={onClick}\n      onKeyDown={onKeyDown}\n      onKeyUp={onKeyUp}\n      onMouseDown={onMouseDown}\n      onMouseUp={onMouseUp}\n      onPointerDown={onPointerDown}\n      onPointerUp={onPointerUp}\n      role=\"button\"\n      tabIndex={0}\n    >\n      {children}\n    </div>\n  );\n};\n\nconst Button: FunctionComponent<\n  Omit<PropsT, 'theme'> & { theme?: ThemeT }\n> = ({ theme, ...rest }) => {\n  const composed = useTheme('Button', defaultTheme, theme);\n\n  // eslint-disable-next-line react/jsx-props-no-spreading\n  return <BaseButton {...rest} theme={composed} />;\n};\n\nexport default Button;\n"],"mappings":"AAAA;;AAUA,SAAqBA,QAAQ,QAAQ,0BAA0B;AAAA,OAExDC,IAAI;AAAA,MAAAC,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAE6B,SAAAC,GAAA,IAAAC,IAAA;AAyBxC,OAAO,MAAMC,UAAqC,GAAGA,CAAC;EACpDC,MAAM;EACNC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACRC,OAAO;EACPC,SAAS,EAAEC,aAAa;EACxBC,OAAO;EACPC,WAAW;EACXC,SAAS;EACTC,aAAa;EACbC,WAAW;EACXC,UAAU;EACVC,OAAO;EACPC,MAAM;EACNC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,IAAIC,SAAS,GAAGF,KAAK,CAACG,MAAM;EAC5B,IAAIlB,MAAM,IAAIe,KAAK,CAACf,MAAM,EAAEiB,SAAS,IAAI,IAAIF,KAAK,CAACf,MAAM,EAAE;EAC3D,IAAIE,QAAQ,EAAE;IACZ,IAAIa,KAAK,CAACb,QAAQ,EAAEe,SAAS,IAAI,IAAIF,KAAK,CAACb,QAAQ,EAAE;IACrD,oBACEJ,IAAA;MACEmB,SAAS,EAAEA,SAAU;MACrB,eAAaE,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGC,SAAS,GAAGR,MAAO;MAAAb,QAAA,EAEvEA;IAAQ,CACN,CAAC;EAEV;EAEA,IAAII,SAAS,GAAGC,aAAa;EAC7B,IAAI,CAACD,SAAS,IAAID,OAAO,EAAE;IACzBC,SAAS,GAAIkB,CAAC,IAAK;MACjB,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAEpB,OAAO,CAACmB,CAAC,CAAC;IACnC,CAAC;EACH;EAEA,IAAIP,EAAE,EAAE;IACN,oBACElB,IAAA,CAACH,IAAI;MACHsB,SAAS,EAAEA,SAAU;MACrB,eAAaE,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGC,SAAS,GAAGR,MAAO;MACxEX,QAAQ,EAAEA,QAAS;MACnBC,OAAO,EAAEA;;MAET;MACA;MACA;MACA;MACA;MAAA;;MAEAG,OAAO,EAAEA,OAAQ;MACjBC,WAAW,EAAEA,WAAY;MACzBC,SAAS,EAAEA,SAAU;MACrBC,aAAa,EAAEA,aAAc;MAC7BC,WAAW,EAAEA,WAAY;MACzBC,UAAU,EAAEA,UAAW;MACvBC,OAAO,EAAEA,OAAQ;MACjBG,EAAE,EAAEA,EAAG;MAAAf,QAAA,EAENA;IAAQ,CACL,CAAC;EAEX;EAEA,oBACEH,IAAA;IACEmB,SAAS,EAAEA,SAAU;IACrB,eAAaE,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGC,SAAS,GAAGR,MAAO;IACxEV,OAAO,EAAEA,OAAQ;IACjBC,SAAS,EAAEA,SAAU;IACrBE,OAAO,EAAEA,OAAQ;IACjBC,WAAW,EAAEA,WAAY;IACzBC,SAAS,EAAEA,SAAU;IACrBC,aAAa,EAAEA,aAAc;IAC7BC,WAAW,EAAEA,WAAY;IACzBc,IAAI,EAAC,QAAQ;IACbC,QAAQ,EAAE,CAAE;IAAAzB,QAAA,EAEXA;EAAQ,CACN,CAAC;AAEV,CAAC;AAED,MAAM0B,MAEL,GAAGA,CAAC;EAAEZ,KAAK;EAAE,GAAGa;AAAK,CAAC,KAAK;EAC1B,MAAMC,QAAQ,GAAGnC,QAAQ,CAAC,QAAQ,EAAEE,YAAY,EAAEmB,KAAK,CAAC;;EAExD;EACA,oBAAOjB,IAAA,CAACC,UAAU;IAAA,GAAK6B,IAAI;IAAEb,KAAK,EAAEc;EAAS,CAAE,CAAC;AAClD,CAAC;AAED,eAAeF,MAAM","ignoreList":[]}

package/build/development/shared/components/Checkbox/index.js

@@ -1,4 +1,4 @@
-import themed from '@dr.pogodin/react-themes';
+import { useTheme } from '@dr.pogodin/react-themes';
 const defaultTheme = {
   "context": "-dr-pogodin-react-utils___build-web-shared-components-Checkbox-theme___context___08mmmo",
   "ad": "-dr-pogodin-react-utils___build-web-shared-components-Checkbox-theme___ad___Hc06MV",
@@ -18,14 +18,15 @@ const Checkbox = ({
   testId,
   theme
 }) => {
-  let containerClassName = theme.container;
-  if (disabled) containerClassName += ` ${theme.disabled}`;
-  let checkboxClassName = theme.checkbox;
-  if (checked === 'indeterminate') checkboxClassName += ` ${theme.indeterminate}`;
+  const composed = useTheme('Checkbox', defaultTheme, theme);
+  let containerClassName = composed.container;
+  if (disabled) containerClassName += ` ${composed.disabled}`;
+  let checkboxClassName = composed.checkbox;
+  if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;
   return /*#__PURE__*/_jsxs("div", {
     className: containerClassName,
     children: [label === undefined ? null : /*#__PURE__*/_jsx("div", {
-      className: theme.label,
+      className: composed.label,
       children: label
     }), /*#__PURE__*/_jsx("input", {
       checked: checked === undefined ? undefined : checked === true,
@@ -40,5 +41,5 @@ const Checkbox = ({
     })]
   });
 };
-export default /* #__PURE__ */themed(Checkbox, 'Checkbox', defaultTheme);
+export default Checkbox;
 //# sourceMappingURL=index.js.map

package/build/development/shared/components/Checkbox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["themed","defaultTheme","jsx","_jsx","jsxs","_jsxs","Checkbox","checked","disabled","label","onChange","testId","theme","containerClassName","container","checkboxClassName","checkbox","indeterminate","className","children","undefined","process","env","NODE_ENV","onClick","e","stopPropagation","type"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropT<ValueT> = {\n  checked?: ValueT;\n  disabled?: boolean;\n  label?: React.ReactNode;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  testId?: string;\n  theme: Theme<\n    | 'checkbox'\n    | 'container'\n    | 'disabled'\n    | 'indeterminate'\n    | 'label'\n  >;\n};\n\nconst Checkbox = <ValueT extends boolean | 'indeterminate' = boolean>({\n  checked,\n  disabled,\n  label,\n  onChange,\n  testId,\n  theme,\n}: PropT<ValueT>) => {\n  let containerClassName = theme.container;\n  if (disabled) containerClassName += ` ${theme.disabled}`;\n\n  let checkboxClassName = theme.checkbox;\n  if (checked === 'indeterminate') checkboxClassName += ` ${theme.indeterminate}`;\n\n  return (\n    <div className={containerClassName}>\n      { label === undefined\n        ? null : <div className={theme.label}>{label}</div> }\n      <input\n        checked={checked === undefined ? undefined : checked === true}\n        className={checkboxClassName}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n        disabled={disabled}\n        onChange={onChange}\n        onClick={(e) => {\n          e.stopPropagation();\n        }}\n        type=\"checkbox\"\n      />\n    </div>\n  );\n};\n\nexport default /* #__PURE__ */ themed(Checkbox, 'Checkbox', defaultTheme);\n"],"mappings":"AAAA,OAAOA,MAAM,MAAsB,0BAA0B;AAAA,MAAAC,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAErB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAiBxC,MAAMC,QAAQ,GAAGA,CAAqD;EACpEC,OAAO;EACPC,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACRC,MAAM;EACNC;AACa,CAAC,KAAK;EACnB,IAAIC,kBAAkB,GAAGD,KAAK,CAACE,SAAS;EACxC,IAAIN,QAAQ,EAAEK,kBAAkB,IAAI,IAAID,KAAK,CAACJ,QAAQ,EAAE;EAExD,IAAIO,iBAAiB,GAAGH,KAAK,CAACI,QAAQ;EACtC,IAAIT,OAAO,KAAK,eAAe,EAAEQ,iBAAiB,IAAI,IAAIH,KAAK,CAACK,aAAa,EAAE;EAE/E,oBACEZ,KAAA;IAAKa,SAAS,EAAEL,kBAAmB;IAAAM,QAAA,GAC/BV,KAAK,KAAKW,SAAS,GACjB,IAAI,gBAAGjB,IAAA;MAAKe,SAAS,EAAEN,KAAK,CAACH,KAAM;MAAAU,QAAA,EAAEV;IAAK,CAAM,CAAC,eACrDN,IAAA;MACEI,OAAO,EAAEA,OAAO,KAAKa,SAAS,GAAGA,SAAS,GAAGb,OAAO,KAAK,IAAK;MAC9DW,SAAS,EAAEH,iBAAkB;MAC7B,eAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGH,SAAS,GAAGT,MAAO;MACxEH,QAAQ,EAAEA,QAAS;MACnBE,QAAQ,EAAEA,QAAS;MACnBc,OAAO,EAAGC,CAAC,IAAK;QACdA,CAAC,CAACC,eAAe,CAAC,CAAC;MACrB,CAAE;MACFC,IAAI,EAAC;IAAU,CAChB,CAAC;EAAA,CACC,CAAC;AAEV,CAAC;AAED,eAAe,eAAgB3B,MAAM,CAACM,QAAQ,EAAE,UAAU,EAAEL,YAAY,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useTheme","defaultTheme","jsx","_jsx","jsxs","_jsxs","Checkbox","checked","disabled","label","onChange","testId","theme","composed","containerClassName","container","checkboxClassName","checkbox","indeterminate","className","children","undefined","process","env","NODE_ENV","onClick","e","stopPropagation","type"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropT<ValueT> = {\n  checked?: ValueT;\n  disabled?: boolean;\n  label?: React.ReactNode;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  testId?: string;\n  theme?: Theme<\n    | 'checkbox'\n    | 'container'\n    | 'disabled'\n    | 'indeterminate'\n    | 'label'\n  >;\n};\n\nconst Checkbox = <ValueT extends boolean | 'indeterminate' = boolean>({\n  checked,\n  disabled,\n  label,\n  onChange,\n  testId,\n  theme,\n}: PropT<ValueT>): ReactNode => {\n  const composed = useTheme('Checkbox', defaultTheme, theme);\n\n  let containerClassName = composed.container;\n  if (disabled) containerClassName += ` ${composed.disabled}`;\n\n  let checkboxClassName = composed.checkbox;\n  if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;\n\n  return (\n    <div className={containerClassName}>\n      { label === undefined\n        ? null : <div className={composed.label}>{label}</div> }\n      <input\n        checked={checked === undefined ? undefined : checked === true}\n        className={checkboxClassName}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n        disabled={disabled}\n        onChange={onChange}\n        onClick={(e) => {\n          e.stopPropagation();\n        }}\n        type=\"checkbox\"\n      />\n    </div>\n  );\n};\n\nexport default Checkbox;\n"],"mappings":"AAEA,SAAqBA,QAAQ,QAAQ,0BAA0B;AAAA,MAAAC,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAEvB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAiBxC,MAAMC,QAAQ,GAAGA,CAAqD;EACpEC,OAAO;EACPC,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACRC,MAAM;EACNC;AACa,CAAC,KAAgB;EAC9B,MAAMC,QAAQ,GAAGb,QAAQ,CAAC,UAAU,EAAEC,YAAY,EAAEW,KAAK,CAAC;EAE1D,IAAIE,kBAAkB,GAAGD,QAAQ,CAACE,SAAS;EAC3C,IAAIP,QAAQ,EAAEM,kBAAkB,IAAI,IAAID,QAAQ,CAACL,QAAQ,EAAE;EAE3D,IAAIQ,iBAAiB,GAAGH,QAAQ,CAACI,QAAQ;EACzC,IAAIV,OAAO,KAAK,eAAe,EAAES,iBAAiB,IAAI,IAAIH,QAAQ,CAACK,aAAa,EAAE;EAElF,oBACEb,KAAA;IAAKc,SAAS,EAAEL,kBAAmB;IAAAM,QAAA,GAC/BX,KAAK,KAAKY,SAAS,GACjB,IAAI,gBAAGlB,IAAA;MAAKgB,SAAS,EAAEN,QAAQ,CAACJ,KAAM;MAAAW,QAAA,EAAEX;IAAK,CAAM,CAAC,eACxDN,IAAA;MACEI,OAAO,EAAEA,OAAO,KAAKc,SAAS,GAAGA,SAAS,GAAGd,OAAO,KAAK,IAAK;MAC9DY,SAAS,EAAEH,iBAAkB;MAC7B,eAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGH,SAAS,GAAGV,MAAO;MACxEH,QAAQ,EAAEA,QAAS;MACnBE,QAAQ,EAAEA,QAAS;MACnBe,OAAO,EAAGC,CAAC,IAAK;QACdA,CAAC,CAACC,eAAe,CAAC,CAAC;MACrB,CAAE;MACFC,IAAI,EAAC;IAAU,CAChB,CAAC;EAAA,CACC,CAAC;AAEV,CAAC;AAED,eAAetB,QAAQ","ignoreList":[]}

package/build/development/shared/components/Input/index.js

@@ -1,5 +1,5 @@
 import { useRef, useState } from 'react';
-import themed from '@dr.pogodin/react-themes';
+import { useTheme } from '@dr.pogodin/react-themes';
 const defaultTheme = {
   "context": "-dr-pogodin-react-utils___build-web-shared-components-Input-theme___context___-Jj9Dp",
   "ad": "-dr-pogodin-react-utils___build-web-shared-components-Input-theme___ad___IOZUc8",
@@ -29,17 +29,19 @@ const Input = ({
   theme,
   ...rest
 }) => {
+  const composed = useTheme('Input', defaultTheme, theme);
+
   // NOTE: As of now, it is only updated when "theme.focused" is defined,
   // as otherwise its value is not used.
   const [focused, setFocused] = useState(false);
   const localRef = useRef(null);
-  let containerClassName = theme.container;
+  let containerClassName = composed.container;
 
   // NOTE: As of now, "focused" can be true only when "theme.focused"
   // is provided.
-  if (focused /* && theme.focused */) containerClassName += ` ${theme.focused}`;
-  if (!rest.value && theme.empty) containerClassName += ` ${theme.empty}`;
-  if (error) containerClassName += ` ${theme.error}`;
+  if (focused /* && theme.focused */) containerClassName += ` ${composed.focused}`;
+  if (!rest.value && composed.empty) containerClassName += ` ${composed.empty}`;
+  if (error) containerClassName += ` ${composed.error}`;
   return /*#__PURE__*/_jsxs("div", {
     className: containerClassName,
     onFocus: () => {
@@ -49,10 +51,10 @@ const Input = ({
       if (typeof ref === 'object') ref?.current?.focus();else localRef.current?.focus();
     },
     children: [label === undefined ? null : /*#__PURE__*/_jsx("div", {
-      className: theme.label,
+      className: composed.label,
       children: label
     }), /*#__PURE__*/_jsx("input", {
-      className: theme.input,
+      className: composed.input,
       "data-testid": process.env.NODE_ENV === 'production' ? undefined : testId,
       ref: ref ?? localRef
 
@@ -61,22 +63,22 @@ const Input = ({
       ,
 
       ...rest,
-      onBlur: theme.focused ? e => {
+      onBlur: composed.focused ? e => {
         setFocused(false);
         rest.onBlur?.(e);
       } : rest.onBlur,
-      onFocus: theme.focused ? e => {
+      onFocus: composed.focused ? e => {
         setFocused(true);
         rest.onFocus?.(e);
       } : rest.onFocus
     }), error && error !== true ? /*#__PURE__*/_jsx("div", {
-      className: theme.errorMessage,
+      className: composed.errorMessage,
       children: error
     }) : null, children ? /*#__PURE__*/_jsx("div", {
-      className: theme.children,
+      className: composed.children,
       children: children
     }) : null]
   });
 };
-export default /* #__PURE__ */themed(Input, 'Input', defaultTheme);
+export default Input;
 //# sourceMappingURL=index.js.map

package/build/development/shared/components/Input/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useRef","useState","themed","defaultTheme","jsx","_jsx","jsxs","_jsxs","Input","children","error","label","ref","testId","theme","rest","focused","setFocused","localRef","containerClassName","container","value","empty","className","onFocus","current","focus","undefined","input","process","env","NODE_ENV","onBlur","e","errorMessage"],"sources":["../../../../../src/shared/components/Input/index.tsx"],"sourcesContent":["import {\n  type FunctionComponent,\n  type ReactNode,\n  type Ref,\n  useRef,\n  useState,\n} from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype ThemeKeyT = 'children' | 'container' | 'empty' | 'error' | 'errorMessage'\n  | 'focused' | 'input' | 'label';\n\ntype PropsT = React.InputHTMLAttributes<HTMLInputElement> & {\n  children?: ReactNode;\n  error?: ReactNode;\n  label?: React.ReactNode;\n  ref?: Ref<HTMLInputElement>;\n  testId?: string;\n  theme: Theme<ThemeKeyT>;\n};\n\n/**\n * Themeable input field, based on the standard HTML `<input>` element.\n * @param [props.label] Input label.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props...] [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n * @param [props...] Any other properties are passed to the underlying\n * `<input>` element.\n */\nconst Input: FunctionComponent<PropsT> = ({\n  children,\n  error,\n  label,\n  ref,\n  testId,\n  theme,\n  ...rest\n}) => {\n  // NOTE: As of now, it is only updated when \"theme.focused\" is defined,\n  // as otherwise its value is not used.\n  const [focused, setFocused] = useState(false);\n\n  const localRef = useRef<HTMLInputElement>(null);\n\n  let containerClassName = theme.container;\n\n  // NOTE: As of now, \"focused\" can be true only when \"theme.focused\"\n  // is provided.\n  if (focused /* && theme.focused */) containerClassName += ` ${theme.focused}`;\n\n  if (!rest.value && theme.empty) containerClassName += ` ${theme.empty}`;\n\n  if (error) containerClassName += ` ${theme.error}`;\n\n  return (\n    <div\n      className={containerClassName}\n      onFocus={() => {\n        // TODO: It does not really work if a callback-style `ref` is passed in,\n        // we need a more complex logic to cover that case, but for now this serves\n        // the case we need it for.\n        if (typeof ref === 'object') ref?.current?.focus();\n        else localRef.current?.focus();\n      }}\n    >\n      {label === undefined ? null : <div className={theme.label}>{label}</div>}\n      <input\n        className={theme.input}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n        ref={ref ?? localRef}\n\n        // TODO: Avoid the spreading later.\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...rest}\n\n        onBlur={theme.focused ? (e) => {\n          setFocused(false);\n          rest.onBlur?.(e);\n        } : rest.onBlur}\n        onFocus={theme.focused ? (e) => {\n          setFocused(true);\n          rest.onFocus?.(e);\n        } : rest.onFocus}\n      />\n      {error && error !== true\n        ? <div className={theme.errorMessage}>{error}</div>\n        : null}\n      {children ? <div className={theme.children}>{children}</div> : null}\n    </div>\n  );\n};\n\nexport default /* #__PURE__ */ themed(Input, 'Input', defaultTheme);\n"],"mappings":"AAAA,SAIEA,MAAM,EACNC,QAAQ,QACH,OAAO;AAEd,OAAOC,MAAM,MAAsB,0BAA0B;AAAA,MAAAC,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAErB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAcxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAgC,GAAGA,CAAC;EACxCC,QAAQ;EACRC,KAAK;EACLC,KAAK;EACLC,GAAG;EACHC,MAAM;EACNC,KAAK;EACL,GAAGC;AACL,CAAC,KAAK;EACJ;EACA;EACA,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGhB,QAAQ,CAAC,KAAK,CAAC;EAE7C,MAAMiB,QAAQ,GAAGlB,MAAM,CAAmB,IAAI,CAAC;EAE/C,IAAImB,kBAAkB,GAAGL,KAAK,CAACM,SAAS;;EAExC;EACA;EACA,IAAIJ,OAAO,CAAC,wBAAwBG,kBAAkB,IAAI,IAAIL,KAAK,CAACE,OAAO,EAAE;EAE7E,IAAI,CAACD,IAAI,CAACM,KAAK,IAAIP,KAAK,CAACQ,KAAK,EAAEH,kBAAkB,IAAI,IAAIL,KAAK,CAACQ,KAAK,EAAE;EAEvE,IAAIZ,KAAK,EAAES,kBAAkB,IAAI,IAAIL,KAAK,CAACJ,KAAK,EAAE;EAElD,oBACEH,KAAA;IACEgB,SAAS,EAAEJ,kBAAmB;IAC9BK,OAAO,EAAEA,CAAA,KAAM;MACb;MACA;MACA;MACA,IAAI,OAAOZ,GAAG,KAAK,QAAQ,EAAEA,GAAG,EAAEa,OAAO,EAAEC,KAAK,CAAC,CAAC,CAAC,KAC9CR,QAAQ,CAACO,OAAO,EAAEC,KAAK,CAAC,CAAC;IAChC,CAAE;IAAAjB,QAAA,GAEDE,KAAK,KAAKgB,SAAS,GAAG,IAAI,gBAAGtB,IAAA;MAAKkB,SAAS,EAAET,KAAK,CAACH,KAAM;MAAAF,QAAA,EAAEE;IAAK,CAAM,CAAC,eACxEN,IAAA;MACEkB,SAAS,EAAET,KAAK,CAACc,KAAM;MACvB,eAAaC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGJ,SAAS,GAAGd,MAAO;MACxED,GAAG,EAAEA,GAAG,IAAIM;;MAEZ;MACA;MAAA;;MAAA,GACIH,IAAI;MAERiB,MAAM,EAAElB,KAAK,CAACE,OAAO,GAAIiB,CAAC,IAAK;QAC7BhB,UAAU,CAAC,KAAK,CAAC;QACjBF,IAAI,CAACiB,MAAM,GAAGC,CAAC,CAAC;MAClB,CAAC,GAAGlB,IAAI,CAACiB,MAAO;MAChBR,OAAO,EAAEV,KAAK,CAACE,OAAO,GAAIiB,CAAC,IAAK;QAC9BhB,UAAU,CAAC,IAAI,CAAC;QAChBF,IAAI,CAACS,OAAO,GAAGS,CAAC,CAAC;MACnB,CAAC,GAAGlB,IAAI,CAACS;IAAQ,CAClB,CAAC,EACDd,KAAK,IAAIA,KAAK,KAAK,IAAI,gBACpBL,IAAA;MAAKkB,SAAS,EAAET,KAAK,CAACoB,YAAa;MAAAzB,QAAA,EAAEC;IAAK,CAAM,CAAC,GACjD,IAAI,EACPD,QAAQ,gBAAGJ,IAAA;MAAKkB,SAAS,EAAET,KAAK,CAACL,QAAS;MAAAA,QAAA,EAAEA;IAAQ,CAAM,CAAC,GAAG,IAAI;EAAA,CAChE,CAAC;AAEV,CAAC;AAED,eAAe,eAAgBP,MAAM,CAACM,KAAK,EAAE,OAAO,EAAEL,YAAY,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useRef","useState","useTheme","defaultTheme","jsx","_jsx","jsxs","_jsxs","Input","children","error","label","ref","testId","theme","rest","composed","focused","setFocused","localRef","containerClassName","container","value","empty","className","onFocus","current","focus","undefined","input","process","env","NODE_ENV","onBlur","e","errorMessage"],"sources":["../../../../../src/shared/components/Input/index.tsx"],"sourcesContent":["import {\n  type FunctionComponent,\n  type ReactNode,\n  type Ref,\n  useRef,\n  useState,\n} from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype ThemeKeyT = 'children' | 'container' | 'empty' | 'error' | 'errorMessage'\n  | 'focused' | 'input' | 'label';\n\ntype PropsT = React.InputHTMLAttributes<HTMLInputElement> & {\n  children?: ReactNode;\n  error?: ReactNode;\n  label?: React.ReactNode;\n  ref?: Ref<HTMLInputElement>;\n  testId?: string;\n  theme?: Theme<ThemeKeyT>;\n};\n\n/**\n * Themeable input field, based on the standard HTML `<input>` element.\n * @param [props.label] Input label.\n * @param [props.theme] _Ad hoc_ theme.\n * @param [props...] [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n * @param [props...] Any other properties are passed to the underlying\n * `<input>` element.\n */\nconst Input: FunctionComponent<PropsT> = ({\n  children,\n  error,\n  label,\n  ref,\n  testId,\n  theme,\n  ...rest\n}) => {\n  const composed = useTheme('Input', defaultTheme, theme);\n\n  // NOTE: As of now, it is only updated when \"theme.focused\" is defined,\n  // as otherwise its value is not used.\n  const [focused, setFocused] = useState(false);\n\n  const localRef = useRef<HTMLInputElement>(null);\n\n  let containerClassName = composed.container;\n\n  // NOTE: As of now, \"focused\" can be true only when \"theme.focused\"\n  // is provided.\n  if (focused /* && theme.focused */) containerClassName += ` ${composed.focused}`;\n\n  if (!rest.value && composed.empty) containerClassName += ` ${composed.empty}`;\n\n  if (error) containerClassName += ` ${composed.error}`;\n\n  return (\n    <div\n      className={containerClassName}\n      onFocus={() => {\n        // TODO: It does not really work if a callback-style `ref` is passed in,\n        // we need a more complex logic to cover that case, but for now this serves\n        // the case we need it for.\n        if (typeof ref === 'object') ref?.current?.focus();\n        else localRef.current?.focus();\n      }}\n    >\n      {label === undefined\n        ? null : <div className={composed.label}>{label}</div>}\n      <input\n        className={composed.input}\n        data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n        ref={ref ?? localRef}\n\n        // TODO: Avoid the spreading later.\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...rest}\n\n        onBlur={composed.focused ? (e) => {\n          setFocused(false);\n          rest.onBlur?.(e);\n        } : rest.onBlur}\n        onFocus={composed.focused ? (e) => {\n          setFocused(true);\n          rest.onFocus?.(e);\n        } : rest.onFocus}\n      />\n      {error && error !== true\n        ? <div className={composed.errorMessage}>{error}</div>\n        : null}\n      {children ? <div className={composed.children}>{children}</div> : null}\n    </div>\n  );\n};\n\nexport default Input;\n"],"mappings":"AAAA,SAIEA,MAAM,EACNC,QAAQ,QACH,OAAO;AAEd,SAAqBC,QAAQ,QAAQ,0BAA0B;AAAA,MAAAC,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAEvB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAcxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAgC,GAAGA,CAAC;EACxCC,QAAQ;EACRC,KAAK;EACLC,KAAK;EACLC,GAAG;EACHC,MAAM;EACNC,KAAK;EACL,GAAGC;AACL,CAAC,KAAK;EACJ,MAAMC,QAAQ,GAAGd,QAAQ,CAAC,OAAO,EAAEC,YAAY,EAAEW,KAAK,CAAC;;EAEvD;EACA;EACA,MAAM,CAACG,OAAO,EAAEC,UAAU,CAAC,GAAGjB,QAAQ,CAAC,KAAK,CAAC;EAE7C,MAAMkB,QAAQ,GAAGnB,MAAM,CAAmB,IAAI,CAAC;EAE/C,IAAIoB,kBAAkB,GAAGJ,QAAQ,CAACK,SAAS;;EAE3C;EACA;EACA,IAAIJ,OAAO,CAAC,wBAAwBG,kBAAkB,IAAI,IAAIJ,QAAQ,CAACC,OAAO,EAAE;EAEhF,IAAI,CAACF,IAAI,CAACO,KAAK,IAAIN,QAAQ,CAACO,KAAK,EAAEH,kBAAkB,IAAI,IAAIJ,QAAQ,CAACO,KAAK,EAAE;EAE7E,IAAIb,KAAK,EAAEU,kBAAkB,IAAI,IAAIJ,QAAQ,CAACN,KAAK,EAAE;EAErD,oBACEH,KAAA;IACEiB,SAAS,EAAEJ,kBAAmB;IAC9BK,OAAO,EAAEA,CAAA,KAAM;MACb;MACA;MACA;MACA,IAAI,OAAOb,GAAG,KAAK,QAAQ,EAAEA,GAAG,EAAEc,OAAO,EAAEC,KAAK,CAAC,CAAC,CAAC,KAC9CR,QAAQ,CAACO,OAAO,EAAEC,KAAK,CAAC,CAAC;IAChC,CAAE;IAAAlB,QAAA,GAEDE,KAAK,KAAKiB,SAAS,GAChB,IAAI,gBAAGvB,IAAA;MAAKmB,SAAS,EAAER,QAAQ,CAACL,KAAM;MAAAF,QAAA,EAAEE;IAAK,CAAM,CAAC,eACxDN,IAAA;MACEmB,SAAS,EAAER,QAAQ,CAACa,KAAM;MAC1B,eAAaC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGJ,SAAS,GAAGf,MAAO;MACxED,GAAG,EAAEA,GAAG,IAAIO;;MAEZ;MACA;MAAA;;MAAA,GACIJ,IAAI;MAERkB,MAAM,EAAEjB,QAAQ,CAACC,OAAO,GAAIiB,CAAC,IAAK;QAChChB,UAAU,CAAC,KAAK,CAAC;QACjBH,IAAI,CAACkB,MAAM,GAAGC,CAAC,CAAC;MAClB,CAAC,GAAGnB,IAAI,CAACkB,MAAO;MAChBR,OAAO,EAAET,QAAQ,CAACC,OAAO,GAAIiB,CAAC,IAAK;QACjChB,UAAU,CAAC,IAAI,CAAC;QAChBH,IAAI,CAACU,OAAO,GAAGS,CAAC,CAAC;MACnB,CAAC,GAAGnB,IAAI,CAACU;IAAQ,CAClB,CAAC,EACDf,KAAK,IAAIA,KAAK,KAAK,IAAI,gBACpBL,IAAA;MAAKmB,SAAS,EAAER,QAAQ,CAACmB,YAAa;MAAA1B,QAAA,EAAEC;IAAK,CAAM,CAAC,GACpD,IAAI,EACPD,QAAQ,gBAAGJ,IAAA;MAAKmB,SAAS,EAAER,QAAQ,CAACP,QAAS;MAAAA,QAAA,EAAEA;IAAQ,CAAM,CAAC,GAAG,IAAI;EAAA,CACnE,CAAC;AAEV,CAAC;AAED,eAAeD,KAAK","ignoreList":[]}

package/build/development/shared/components/Modal/index.js

@@ -1,7 +1,7 @@
 import { useEffect, useMemo, useRef } from 'react';
 import { createPortal } from 'react-dom';
-import themed from '@dr.pogodin/react-themes';
-const baseTheme = {
+import { useTheme } from '@dr.pogodin/react-themes';
+const defaultTheme = {
   "context": "-dr-pogodin-react-utils___build-web-shared-components-Modal-base-theme___context___sCYXfW",
   "ad": "-dr-pogodin-react-utils___build-web-shared-components-Modal-base-theme___ad___e0BH-f",
   "hoc": "-dr-pogodin-react-utils___build-web-shared-components-Modal-base-theme___hoc___vqUuSP",
@@ -131,8 +131,20 @@ const BaseModal = ({
     }), focusLast]
   }), document.body);
 };
-export default /* #__PURE__ */themed(BaseModal, 'Modal', baseTheme);
 
 /* Non-themed version of the Modal. */
 export { BaseModal };
+const Modal = ({
+  theme,
+  ...rest
+}) => {
+  const composed = useTheme('Modal', defaultTheme, theme);
+
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  return /*#__PURE__*/_jsx(BaseModal, {
+    ...rest,
+    theme: composed
+  });
+};
+export default Modal;
 //# sourceMappingURL=index.js.map

package/build/development/shared/components/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useEffect","useMemo","useRef","createPortal","themed","baseTheme","S","jsx","_jsx","jsxs","_jsxs","BaseModal","cancelOnScrolling","children","containerStyle","dontDisableScrolling","onCancel","overlayStyle","style","testId","testIdForOverlay","theme","containerRef","overlayRef","window","addEventListener","removeEventListener","document","body","classList","add","scrollingDisabledByModal","remove","focusLast","onFocus","elems","current","querySelectorAll","i","length","focus","activeElement","tabIndex","className","overlay","process","env","NODE_ENV","undefined","onClick","e","stopPropagation","onKeyDown","key","ref","node","role","container","onWheel","event"],"sources":["../../../../../src/shared/components/Modal/index.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type FunctionComponent,\n  type ReactNode,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport baseTheme from './base-theme.scss';\nimport S from './styles.scss';\n\ntype PropsT = {\n  cancelOnScrolling?: boolean;\n  children?: ReactNode;\n  dontDisableScrolling?: boolean;\n  onCancel?: () => void;\n  overlayStyle?: CSSProperties;\n  style?: CSSProperties;\n  testId?: string;\n  testIdForOverlay?: string;\n  theme: Theme<'container' | 'overlay'>;\n\n  /** @deprecated */\n  containerStyle?: CSSProperties;\n};\n\n/**\n * The `<Modal>` component implements a simple themeable modal window, wrapped\n * into the default theme. `<BaseModal>` exposes the base non-themed component.\n * **Children:** Component children are rendered as the modal content.\n * @param {object} props Component properties. Beside props documented below,\n *  [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties) are supported as well.\n * @param {function} [props.onCancel] The callback to trigger when user\n * clicks outside the modal, or presses Escape. It is expected to hide the\n * modal.\n * @param {ModalTheme} [props.theme] _Ad hoc_ theme.\n */\nconst BaseModal: FunctionComponent<PropsT> = ({\n  cancelOnScrolling,\n  children,\n  containerStyle,\n  dontDisableScrolling,\n  onCancel,\n  overlayStyle,\n  style,\n  testId,\n  testIdForOverlay,\n  theme,\n}) => {\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const overlayRef = useRef<HTMLDivElement | null>(null);\n\n  // Sets up modal cancellation of scrolling, if opted-in.\n  useEffect(() => {\n    if (cancelOnScrolling && onCancel) {\n      window.addEventListener('scroll', onCancel);\n      window.addEventListener('wheel', onCancel);\n    }\n    return () => {\n      if (cancelOnScrolling && onCancel) {\n        window.removeEventListener('scroll', onCancel);\n        window.removeEventListener('wheel', onCancel);\n      }\n    };\n  }, [cancelOnScrolling, onCancel]);\n\n  // Disables window scrolling, if it is not opted-out.\n  useEffect(() => {\n    if (!dontDisableScrolling) {\n      document.body.classList.add(S.scrollingDisabledByModal);\n    }\n    return () => {\n      if (!dontDisableScrolling) {\n        document.body.classList.remove(S.scrollingDisabledByModal);\n      }\n    };\n  }, [dontDisableScrolling]);\n\n  const focusLast = useMemo(() => (\n    <div\n      onFocus={() => {\n        const elems = containerRef.current!.querySelectorAll('*');\n        for (let i = elems.length - 1; i >= 0; --i) {\n          (elems[i] as HTMLElement).focus();\n          if (document.activeElement === elems[i]) return;\n        }\n        overlayRef.current?.focus();\n      }}\n      // TODO: Have a look at this later.\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n      tabIndex={0}\n    />\n  ), []);\n\n  return createPortal(\n    (\n      <div>\n        {focusLast}\n        <div\n          aria-label=\"Cancel\"\n          className={theme.overlay}\n          data-testid={\n            process.env.NODE_ENV === 'production'\n              ? undefined : testIdForOverlay\n          }\n          onClick={(e) => {\n            if (onCancel) {\n              onCancel();\n              e.stopPropagation();\n            }\n          }}\n          onKeyDown={(e) => {\n            if (e.key === 'Escape' && onCancel) {\n              onCancel();\n              e.stopPropagation();\n            }\n          }}\n          ref={(node) => {\n            if (node && node !== overlayRef.current) {\n              overlayRef.current = node;\n              node.focus();\n            }\n          }}\n          role=\"button\"\n          style={overlayStyle}\n          tabIndex={0}\n        />\n        {\n          // NOTE: These rules are disabled because our intention is to keep\n          // the element non-interactive (thus not on the keyboard focus chain),\n          // and it has `onClick` handler merely to stop propagation of click\n          // events to its parent container. This is needed because, for example\n          // when the modal is wrapped into an interactive element we don't want\n          // any clicks inside the modal to bubble-up to that parent element\n          // (because visually and logically the modal dialog does not belong\n          // to its parent container, where it technically belongs from\n          // the HTML mark-up perpective).\n        }\n        <div // eslint-disable-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions\n          aria-modal=\"true\"\n          className={theme.container}\n          data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n          onClick={(e) => {\n            e.stopPropagation();\n          }}\n          onWheel={(event) => {\n            event.stopPropagation();\n          }}\n          ref={containerRef}\n          role=\"dialog\"\n          style={style ?? containerStyle}\n        >\n          {children}\n        </div>\n        <div\n          onFocus={() => {\n            overlayRef.current?.focus();\n          }}\n          // TODO: Have a look at this later.\n          // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n          tabIndex={0}\n        />\n        {focusLast}\n      </div>\n    ),\n    document.body,\n  );\n};\n\nexport default /* #__PURE__ */ themed(BaseModal, 'Modal', baseTheme);\n\n/* Non-themed version of the Modal. */\nexport { BaseModal };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useEffect","useMemo","useRef","createPortal","useTheme","defaultTheme","S","jsx","_jsx","jsxs","_jsxs","BaseModal","cancelOnScrolling","children","containerStyle","dontDisableScrolling","onCancel","overlayStyle","style","testId","testIdForOverlay","theme","containerRef","overlayRef","window","addEventListener","removeEventListener","document","body","classList","add","scrollingDisabledByModal","remove","focusLast","onFocus","elems","current","querySelectorAll","i","length","focus","activeElement","tabIndex","className","overlay","process","env","NODE_ENV","undefined","onClick","e","stopPropagation","onKeyDown","key","ref","node","role","container","onWheel","event","Modal","rest","composed"],"sources":["../../../../../src/shared/components/Modal/index.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type FunctionComponent,\n  type ReactNode,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './base-theme.scss';\nimport S from './styles.scss';\n\ntype ThemeT = Theme<'container' | 'overlay'>;\n\ntype PropsT = {\n  cancelOnScrolling?: boolean;\n  children?: ReactNode;\n  dontDisableScrolling?: boolean;\n  onCancel?: () => void;\n  overlayStyle?: CSSProperties;\n  style?: CSSProperties;\n  testId?: string;\n  testIdForOverlay?: string;\n  theme: ThemeT;\n\n  /** @deprecated */\n  containerStyle?: CSSProperties;\n};\n\n/**\n * The `<Modal>` component implements a simple themeable modal window, wrapped\n * into the default theme. `<BaseModal>` exposes the base non-themed component.\n * **Children:** Component children are rendered as the modal content.\n * @param {object} props Component properties. Beside props documented below,\n *  [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties) are supported as well.\n * @param {function} [props.onCancel] The callback to trigger when user\n * clicks outside the modal, or presses Escape. It is expected to hide the\n * modal.\n * @param {ModalTheme} [props.theme] _Ad hoc_ theme.\n */\nconst BaseModal: FunctionComponent<PropsT> = ({\n  cancelOnScrolling,\n  children,\n  containerStyle,\n  dontDisableScrolling,\n  onCancel,\n  overlayStyle,\n  style,\n  testId,\n  testIdForOverlay,\n  theme,\n}) => {\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const overlayRef = useRef<HTMLDivElement | null>(null);\n\n  // Sets up modal cancellation of scrolling, if opted-in.\n  useEffect(() => {\n    if (cancelOnScrolling && onCancel) {\n      window.addEventListener('scroll', onCancel);\n      window.addEventListener('wheel', onCancel);\n    }\n    return () => {\n      if (cancelOnScrolling && onCancel) {\n        window.removeEventListener('scroll', onCancel);\n        window.removeEventListener('wheel', onCancel);\n      }\n    };\n  }, [cancelOnScrolling, onCancel]);\n\n  // Disables window scrolling, if it is not opted-out.\n  useEffect(() => {\n    if (!dontDisableScrolling) {\n      document.body.classList.add(S.scrollingDisabledByModal);\n    }\n    return () => {\n      if (!dontDisableScrolling) {\n        document.body.classList.remove(S.scrollingDisabledByModal);\n      }\n    };\n  }, [dontDisableScrolling]);\n\n  const focusLast = useMemo(() => (\n    <div\n      onFocus={() => {\n        const elems = containerRef.current!.querySelectorAll('*');\n        for (let i = elems.length - 1; i >= 0; --i) {\n          (elems[i] as HTMLElement).focus();\n          if (document.activeElement === elems[i]) return;\n        }\n        overlayRef.current?.focus();\n      }}\n      // TODO: Have a look at this later.\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n      tabIndex={0}\n    />\n  ), []);\n\n  return createPortal(\n    (\n      <div>\n        {focusLast}\n        <div\n          aria-label=\"Cancel\"\n          className={theme.overlay}\n          data-testid={\n            process.env.NODE_ENV === 'production'\n              ? undefined : testIdForOverlay\n          }\n          onClick={(e) => {\n            if (onCancel) {\n              onCancel();\n              e.stopPropagation();\n            }\n          }}\n          onKeyDown={(e) => {\n            if (e.key === 'Escape' && onCancel) {\n              onCancel();\n              e.stopPropagation();\n            }\n          }}\n          ref={(node) => {\n            if (node && node !== overlayRef.current) {\n              overlayRef.current = node;\n              node.focus();\n            }\n          }}\n          role=\"button\"\n          style={overlayStyle}\n          tabIndex={0}\n        />\n        {\n          // NOTE: These rules are disabled because our intention is to keep\n          // the element non-interactive (thus not on the keyboard focus chain),\n          // and it has `onClick` handler merely to stop propagation of click\n          // events to its parent container. This is needed because, for example\n          // when the modal is wrapped into an interactive element we don't want\n          // any clicks inside the modal to bubble-up to that parent element\n          // (because visually and logically the modal dialog does not belong\n          // to its parent container, where it technically belongs from\n          // the HTML mark-up perpective).\n        }\n        <div // eslint-disable-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions\n          aria-modal=\"true\"\n          className={theme.container}\n          data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n          onClick={(e) => {\n            e.stopPropagation();\n          }}\n          onWheel={(event) => {\n            event.stopPropagation();\n          }}\n          ref={containerRef}\n          role=\"dialog\"\n          style={style ?? containerStyle}\n        >\n          {children}\n        </div>\n        <div\n          onFocus={() => {\n            overlayRef.current?.focus();\n          }}\n          // TODO: Have a look at this later.\n          // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n          tabIndex={0}\n        />\n        {focusLast}\n      </div>\n    ),\n    document.body,\n  );\n};\n\n/* Non-themed version of the Modal. */\nexport { BaseModal };\n\nconst Modal: FunctionComponent<\n  Omit<PropsT, 'theme'> & { theme: ThemeT | undefined }\n> = ({ theme, ...rest }) => {\n  const composed = useTheme('Modal', defaultTheme, theme);\n\n  // eslint-disable-next-line react/jsx-props-no-spreading\n  return <BaseModal {...rest} theme={composed} />;\n};\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}

package/build/development/shared/components/PageLayout/index.js

@@ -1,4 +1,4 @@
-import themed from '@dr.pogodin/react-themes';
+import { useTheme } from '@dr.pogodin/react-themes';
 const baseTheme = {
   "context": "-dr-pogodin-react-utils___build-web-shared-components-PageLayout-base-theme___context___zv9tdn",
   "ad": "-dr-pogodin-react-utils___build-web-shared-components-PageLayout-base-theme___ad___yr8hbI",
@@ -28,18 +28,21 @@ const PageLayout = ({
   leftSidePanelContent,
   rightSidePanelContent,
   theme
-}) => /*#__PURE__*/_jsxs("div", {
-  className: theme.container,
-  children: [/*#__PURE__*/_jsx("div", {
-    className: [theme.sidePanel, theme.leftSidePanel].join(' '),
-    children: leftSidePanelContent
-  }), /*#__PURE__*/_jsx("div", {
-    className: theme.mainPanel,
-    children: children
-  }), /*#__PURE__*/_jsx("div", {
-    className: [theme.sidePanel, theme.rightSidePanel].join(' '),
-    children: rightSidePanelContent
-  })]
-});
-export default /* #__PURE__ */themed(PageLayout, 'PageLayout', baseTheme);
+}) => {
+  const composed = useTheme('PageLayout', baseTheme, theme);
+  return /*#__PURE__*/_jsxs("div", {
+    className: composed.container,
+    children: [/*#__PURE__*/_jsx("div", {
+      className: [composed.sidePanel, composed.leftSidePanel].join(' '),
+      children: leftSidePanelContent
+    }), /*#__PURE__*/_jsx("div", {
+      className: composed.mainPanel,
+      children: children
+    }), /*#__PURE__*/_jsx("div", {
+      className: [composed.sidePanel, composed.rightSidePanel].join(' '),
+      children: rightSidePanelContent
+    })]
+  });
+};
+export default PageLayout;
 //# sourceMappingURL=index.js.map

package/build/development/shared/components/PageLayout/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["themed","baseTheme","jsx","_jsx","jsxs","_jsxs","PageLayout","children","leftSidePanelContent","rightSidePanelContent","theme","className","container","sidePanel","leftSidePanel","join","mainPanel","rightSidePanel"],"sources":["../../../../../src/shared/components/PageLayout/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport themed, { type Theme } from '@dr.pogodin/react-themes';\n\nimport baseTheme from './base-theme.scss';\n\ntype ThemeKeyT = 'container' | 'leftSidePanel' | 'mainPanel' | 'rightSidePanel'\n  | 'sidePanel';\n\ntype PropsT = {\n  children?: ReactNode;\n  leftSidePanelContent?: ReactNode;\n  rightSidePanelContent?: ReactNode;\n  theme: Theme<ThemeKeyT>;\n};\n\n/**\n * Simple and themeable page layout. It keeps the main content centered in\n * a column of limited width, which fills entire viewport on small screens\n * (under `$screen-md = 1024px` size). At larger screens the column keeps\n * `$screen-md` size, and it is centered at the page, surrounded by side\n * panels, where additional content can be displayed.\n *\n * **Children:** Component children are rendered as the content of main panel.\n * @param {object} [props] Component properties.\n * @param {Node} [props.leftSidePanelContent] The content for left side panel.\n * @param {Node} [props.rightSidePanelContent] The content for right side panel.\n * @param {PageLayoutTheme} [props.theme] _Ad hoc_ theme.\n * @param {...any} [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst PageLayout: React.FunctionComponent<PropsT> = ({\n  children,\n  leftSidePanelContent,\n  rightSidePanelContent,\n  theme,\n}) => (\n  <div className={theme.container}>\n    <div className={[theme.sidePanel, theme.leftSidePanel].join(' ')}>\n      {leftSidePanelContent}\n    </div>\n    <div className={theme.mainPanel}>\n      {children}\n    </div>\n    <div className={[theme.sidePanel, theme.rightSidePanel].join(' ')}>\n      {rightSidePanelContent}\n    </div>\n  </div>\n);\n\nexport default /* #__PURE__ */ themed(PageLayout, 'PageLayout', baseTheme);\n"],"mappings":"AAEA,OAAOA,MAAM,MAAsB,0BAA0B;AAAA,MAAAC,SAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAEnB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAY1C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,UAA2C,GAAGA,CAAC;EACnDC,QAAQ;EACRC,oBAAoB;EACpBC,qBAAqB;EACrBC;AACF,CAAC,kBACCL,KAAA;EAAKM,SAAS,EAAED,KAAK,CAACE,SAAU;EAAAL,QAAA,gBAC9BJ,IAAA;IAAKQ,SAAS,EAAE,CAACD,KAAK,CAACG,SAAS,EAAEH,KAAK,CAACI,aAAa,CAAC,CAACC,IAAI,CAAC,GAAG,CAAE;IAAAR,QAAA,EAC9DC;EAAoB,CAClB,CAAC,eACNL,IAAA;IAAKQ,SAAS,EAAED,KAAK,CAACM,SAAU;IAAAT,QAAA,EAC7BA;EAAQ,CACN,CAAC,eACNJ,IAAA;IAAKQ,SAAS,EAAE,CAACD,KAAK,CAACG,SAAS,EAAEH,KAAK,CAACO,cAAc,CAAC,CAACF,IAAI,CAAC,GAAG,CAAE;IAAAR,QAAA,EAC/DE;EAAqB,CACnB,CAAC;AAAA,CACH,CACN;AAED,eAAe,eAAgBT,MAAM,CAACM,UAAU,EAAE,YAAY,EAAEL,SAAS,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useTheme","baseTheme","jsx","_jsx","jsxs","_jsxs","PageLayout","children","leftSidePanelContent","rightSidePanelContent","theme","composed","className","container","sidePanel","leftSidePanel","join","mainPanel","rightSidePanel"],"sources":["../../../../../src/shared/components/PageLayout/index.tsx"],"sourcesContent":["import type { FunctionComponent, ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport baseTheme from './base-theme.scss';\n\ntype ThemeKeyT = 'container' | 'leftSidePanel' | 'mainPanel' | 'rightSidePanel'\n  | 'sidePanel';\n\ntype PropsT = {\n  children?: ReactNode;\n  leftSidePanelContent?: ReactNode;\n  rightSidePanelContent?: ReactNode;\n  theme?: Theme<ThemeKeyT>;\n};\n\n/**\n * Simple and themeable page layout. It keeps the main content centered in\n * a column of limited width, which fills entire viewport on small screens\n * (under `$screen-md = 1024px` size). At larger screens the column keeps\n * `$screen-md` size, and it is centered at the page, surrounded by side\n * panels, where additional content can be displayed.\n *\n * **Children:** Component children are rendered as the content of main panel.\n * @param {object} [props] Component properties.\n * @param {Node} [props.leftSidePanelContent] The content for left side panel.\n * @param {Node} [props.rightSidePanelContent] The content for right side panel.\n * @param {PageLayoutTheme} [props.theme] _Ad hoc_ theme.\n * @param {...any} [props....]\n * [Other theming properties](https://www.npmjs.com/package/@dr.pogodin/react-themes#themed-component-properties)\n */\nconst PageLayout: FunctionComponent<PropsT> = ({\n  children,\n  leftSidePanelContent,\n  rightSidePanelContent,\n  theme,\n}) => {\n  const composed = useTheme('PageLayout', baseTheme, theme);\n  return (\n    <div className={composed.container}>\n      <div className={[composed.sidePanel, composed.leftSidePanel].join(' ')}>\n        {leftSidePanelContent}\n      </div>\n      <div className={composed.mainPanel}>\n        {children}\n      </div>\n      <div className={[composed.sidePanel, composed.rightSidePanel].join(' ')}>\n        {rightSidePanelContent}\n      </div>\n    </div>\n  );\n};\n\nexport default PageLayout;\n"],"mappings":"AAEA,SAAqBA,QAAQ,QAAQ,0BAA0B;AAAA,MAAAC,SAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAErB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAY1C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,UAAqC,GAAGA,CAAC;EAC7CC,QAAQ;EACRC,oBAAoB;EACpBC,qBAAqB;EACrBC;AACF,CAAC,KAAK;EACJ,MAAMC,QAAQ,GAAGX,QAAQ,CAAC,YAAY,EAAEC,SAAS,EAAES,KAAK,CAAC;EACzD,oBACEL,KAAA;IAAKO,SAAS,EAAED,QAAQ,CAACE,SAAU;IAAAN,QAAA,gBACjCJ,IAAA;MAAKS,SAAS,EAAE,CAACD,QAAQ,CAACG,SAAS,EAAEH,QAAQ,CAACI,aAAa,CAAC,CAACC,IAAI,CAAC,GAAG,CAAE;MAAAT,QAAA,EACpEC;IAAoB,CAClB,CAAC,eACNL,IAAA;MAAKS,SAAS,EAAED,QAAQ,CAACM,SAAU;MAAAV,QAAA,EAChCA;IAAQ,CACN,CAAC,eACNJ,IAAA;MAAKS,SAAS,EAAE,CAACD,QAAQ,CAACG,SAAS,EAAEH,QAAQ,CAACO,cAAc,CAAC,CAACF,IAAI,CAAC,GAAG,CAAE;MAAAT,QAAA,EACrEE;IAAqB,CACnB,CAAC;EAAA,CACH,CAAC;AAEV,CAAC;AAED,eAAeH,UAAU","ignoreList":[]}