@mantine/emotion 9.1.1 → 9.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/Global.cjs.map +1 -1
- package/cjs/MantineEmotionProvider.cjs.map +1 -1
- package/cjs/create-styles.cjs.map +1 -1
- package/cjs/emotion-transform.cjs.map +1 -1
- package/cjs/merge-sx.cjs.map +1 -1
- package/cjs/ssr.cjs.map +1 -1
- package/cjs/use-css.cjs.map +1 -1
- package/cjs/use-guaranteed-memo.cjs.map +1 -1
- package/esm/Global.mjs.map +1 -1
- package/esm/MantineEmotionProvider.mjs.map +1 -1
- package/esm/create-styles.mjs.map +1 -1
- package/esm/emotion-transform.mjs.map +1 -1
- package/esm/merge-sx.mjs.map +1 -1
- package/esm/ssr.mjs.map +1 -1
- package/esm/use-css.mjs.map +1 -1
- package/esm/use-guaranteed-memo.mjs.map +1 -1
- package/package.json +5 -5
package/cjs/Global.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Global.cjs","names":["EmotionGlobal"],"sources":["../src/Global.tsx"],"sourcesContent":["import { css, Global as EmotionGlobal } from '@emotion/react';\nimport { MantineTheme, useMantineTheme } from '@mantine/core';\nimport type { CSSObject } from './types';\n\ntype EmotionStyles = CSSObject | CSSObject[];\n\ninterface GlobalStylesProps {\n styles: EmotionStyles | ((theme: MantineTheme) => EmotionStyles);\n}\n\nexport function Global({ styles }: GlobalStylesProps) {\n const theme = useMantineTheme();\n return (\n <EmotionGlobal styles={css((typeof styles === 'function' ? styles(theme) : styles) as any)} />\n );\n}\n"],"mappings":";;;;;;AAUA,SAAgB,OAAO,EAAE,UAA6B;CACpD,MAAM,SAAA,GAAA,cAAA,
|
|
1
|
+
{"version":3,"file":"Global.cjs","names":["EmotionGlobal"],"sources":["../src/Global.tsx"],"sourcesContent":["import { css, Global as EmotionGlobal } from '@emotion/react';\nimport { MantineTheme, useMantineTheme } from '@mantine/core';\nimport type { CSSObject } from './types';\n\ntype EmotionStyles = CSSObject | CSSObject[];\n\ninterface GlobalStylesProps {\n styles: EmotionStyles | ((theme: MantineTheme) => EmotionStyles);\n}\n\nexport function Global({ styles }: GlobalStylesProps) {\n const theme = useMantineTheme();\n return (\n <EmotionGlobal styles={css((typeof styles === 'function' ? styles(theme) : styles) as any)} />\n );\n}\n"],"mappings":";;;;;;AAUA,SAAgB,OAAO,EAAE,UAA6B;CACpD,MAAM,SAAA,GAAA,cAAA,iBAAwB;CAC9B,OACE,iBAAA,GAAA,kBAAA,KAACA,eAAAA,QAAD,EAAe,SAAA,GAAA,eAAA,KAAa,OAAO,WAAW,aAAa,OAAO,KAAK,IAAI,MAAc,EAAI,CAAA;AAEjG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MantineEmotionProvider.cjs","names":[],"sources":["../src/MantineEmotionProvider.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport { EmotionCache, withEmotionCache } from '@emotion/react';\n\nexport const EmotionCacheContext = createContext<EmotionCache | null>(null);\n\nexport function useEmotionCache() {\n const cache = use(EmotionCacheContext);\n\n if (cache === null) {\n throw new Error(\n 'Emotion cache is not available in context, make sure that you have MantineEmotionProvider in the component tree'\n );\n }\n\n return cache;\n}\n\ninterface EmotionCacheProviderProps {\n children: React.ReactNode;\n cache?: EmotionCache;\n}\n\nexport const MantineEmotionProvider = withEmotionCache<EmotionCacheProviderProps>(\n ({ children, cache }, ctx) => (\n <EmotionCacheContext value={cache || ctx}>{children}</EmotionCacheContext>\n )\n);\n"],"mappings":";;;;;;AAGA,MAAa,uBAAA,GAAA,MAAA,eAAyD,
|
|
1
|
+
{"version":3,"file":"MantineEmotionProvider.cjs","names":[],"sources":["../src/MantineEmotionProvider.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport { EmotionCache, withEmotionCache } from '@emotion/react';\n\nexport const EmotionCacheContext = createContext<EmotionCache | null>(null);\n\nexport function useEmotionCache() {\n const cache = use(EmotionCacheContext);\n\n if (cache === null) {\n throw new Error(\n 'Emotion cache is not available in context, make sure that you have MantineEmotionProvider in the component tree'\n );\n }\n\n return cache;\n}\n\ninterface EmotionCacheProviderProps {\n children: React.ReactNode;\n cache?: EmotionCache;\n}\n\nexport const MantineEmotionProvider = withEmotionCache<EmotionCacheProviderProps>(\n ({ children, cache }, ctx) => (\n <EmotionCacheContext value={cache || ctx}>{children}</EmotionCacheContext>\n )\n);\n"],"mappings":";;;;;;AAGA,MAAa,uBAAA,GAAA,MAAA,eAAyD,IAAI;AAE1E,SAAgB,kBAAkB;CAChC,MAAM,SAAA,GAAA,MAAA,KAAY,mBAAmB;CAErC,IAAI,UAAU,MACZ,MAAM,IAAI,MACR,iHACF;CAGF,OAAO;AACT;AAOA,MAAa,0BAAA,GAAA,eAAA,mBACV,EAAE,UAAU,SAAS,QACpB,iBAAA,GAAA,kBAAA,KAAC,qBAAD;CAAqB,OAAO,SAAS;CAAM;AAA8B,CAAA,CAE7E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create-styles.cjs","names":["useCss"],"sources":["../src/create-styles.ts"],"sourcesContent":["import { em, MantineBreakpoint, MantineTheme, px, useMantineTheme } from '@mantine/core';\nimport { CSSObject } from './types';\nimport { useCss } from './use-css';\n\nexport function getStylesRef(refName: string) {\n return `___ref-${refName || ''}`;\n}\n\nfunction getBreakpointValue(theme: MantineTheme, breakpoint: MantineBreakpoint | number) {\n return breakpoint in theme.breakpoints && typeof breakpoint !== 'number'\n ? (px(theme.breakpoints[breakpoint]) as number)\n : (px(breakpoint) as number);\n}\n\nexport const getHelpers = (theme: MantineTheme) => ({\n light: '[data-mantine-color-scheme=\"light\"] &',\n dark: '[data-mantine-color-scheme=\"dark\"] &',\n rtl: '[dir=\"rtl\"] &',\n ltr: '[dir=\"ltr\"] &',\n notRtl: '[dir=\"ltr\"] &',\n notLtr: '[dir=\"rtl\"] &',\n ref: getStylesRef,\n smallerThan: (breakpoint: MantineBreakpoint | number) =>\n `@media (max-width: ${em(getBreakpointValue(theme, breakpoint) - 0.1)})`,\n largerThan: (breakpoint: MantineBreakpoint | number) =>\n `@media (min-width: ${em(getBreakpointValue(theme, breakpoint))})`,\n});\n\nexport type EmotionHelpers = ReturnType<typeof getHelpers>;\n\nexport function createStyles<\n Key extends string = string,\n Params = void,\n Input extends Record<Key, CSSObject> = Record<Key, CSSObject>,\n>(input: ((theme: MantineTheme, params: Params, helpers: EmotionHelpers) => Input) | Input) {\n const getCssObject = typeof input === 'function' ? input : () => input;\n\n return function useStyles(params: Params) {\n const theme = useMantineTheme();\n const helpers = getHelpers(theme);\n const cssObject: Record<string, any> = getCssObject(theme, params, helpers);\n const { css, cx } = useCss();\n const classes = Object.keys(cssObject).reduce<Record<string, string>>((acc, key) => {\n acc[key] = css(cssObject[key]);\n return acc;\n }, {}) as { [key in keyof Input]: string };\n\n return { classes, cx, theme };\n };\n}\n"],"mappings":";;;;;AAIA,SAAgB,aAAa,SAAiB;
|
|
1
|
+
{"version":3,"file":"create-styles.cjs","names":["useCss"],"sources":["../src/create-styles.ts"],"sourcesContent":["import { em, MantineBreakpoint, MantineTheme, px, useMantineTheme } from '@mantine/core';\nimport { CSSObject } from './types';\nimport { useCss } from './use-css';\n\nexport function getStylesRef(refName: string) {\n return `___ref-${refName || ''}`;\n}\n\nfunction getBreakpointValue(theme: MantineTheme, breakpoint: MantineBreakpoint | number) {\n return breakpoint in theme.breakpoints && typeof breakpoint !== 'number'\n ? (px(theme.breakpoints[breakpoint]) as number)\n : (px(breakpoint) as number);\n}\n\nexport const getHelpers = (theme: MantineTheme) => ({\n light: '[data-mantine-color-scheme=\"light\"] &',\n dark: '[data-mantine-color-scheme=\"dark\"] &',\n rtl: '[dir=\"rtl\"] &',\n ltr: '[dir=\"ltr\"] &',\n notRtl: '[dir=\"ltr\"] &',\n notLtr: '[dir=\"rtl\"] &',\n ref: getStylesRef,\n smallerThan: (breakpoint: MantineBreakpoint | number) =>\n `@media (max-width: ${em(getBreakpointValue(theme, breakpoint) - 0.1)})`,\n largerThan: (breakpoint: MantineBreakpoint | number) =>\n `@media (min-width: ${em(getBreakpointValue(theme, breakpoint))})`,\n});\n\nexport type EmotionHelpers = ReturnType<typeof getHelpers>;\n\nexport function createStyles<\n Key extends string = string,\n Params = void,\n Input extends Record<Key, CSSObject> = Record<Key, CSSObject>,\n>(input: ((theme: MantineTheme, params: Params, helpers: EmotionHelpers) => Input) | Input) {\n const getCssObject = typeof input === 'function' ? input : () => input;\n\n return function useStyles(params: Params) {\n const theme = useMantineTheme();\n const helpers = getHelpers(theme);\n const cssObject: Record<string, any> = getCssObject(theme, params, helpers);\n const { css, cx } = useCss();\n const classes = Object.keys(cssObject).reduce<Record<string, string>>((acc, key) => {\n acc[key] = css(cssObject[key]);\n return acc;\n }, {}) as { [key in keyof Input]: string };\n\n return { classes, cx, theme };\n };\n}\n"],"mappings":";;;;;AAIA,SAAgB,aAAa,SAAiB;CAC5C,OAAO,UAAU,WAAW;AAC9B;AAEA,SAAS,mBAAmB,OAAqB,YAAwC;CACvF,OAAO,cAAc,MAAM,eAAe,OAAO,eAAe,YAAA,GAAA,cAAA,IACxD,MAAM,YAAY,WAAW,KAAA,GAAA,cAAA,IAC7B,UAAU;AACpB;AAEA,MAAa,cAAc,WAAyB;CAClD,OAAO;CACP,MAAM;CACN,KAAK;CACL,KAAK;CACL,QAAQ;CACR,QAAQ;CACR,KAAK;CACL,cAAc,eACZ,uBAAA,GAAA,cAAA,IAAyB,mBAAmB,OAAO,UAAU,IAAI,EAAG,EAAE;CACxE,aAAa,eACX,uBAAA,GAAA,cAAA,IAAyB,mBAAmB,OAAO,UAAU,CAAC,EAAE;AACpE;AAIA,SAAgB,aAId,OAA0F;CAC1F,MAAM,eAAe,OAAO,UAAU,aAAa,cAAc;CAEjE,OAAO,SAAS,UAAU,QAAgB;EACxC,MAAM,SAAA,GAAA,cAAA,iBAAwB;EAE9B,MAAM,YAAiC,aAAa,OAAO,QAD3C,WAAW,KAC8C,CAAC;EAC1E,MAAM,EAAE,KAAK,OAAOA,gBAAAA,OAAO;EAM3B,OAAO;GAAE,SALO,OAAO,KAAK,SAAS,EAAE,QAAgC,KAAK,QAAQ;IAClF,IAAI,OAAO,IAAI,UAAU,IAAI;IAC7B,OAAO;GACT,GAAG,CAAC,CAEW;GAAG;GAAI;EAAM;CAC9B;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"emotion-transform.cjs","names":["useCss","getHelpers"],"sources":["../src/emotion-transform.ts"],"sourcesContent":["import { MantineStylesTransform, useMantineTheme } from '@mantine/core';\nimport { getHelpers } from './create-styles';\nimport { useCss } from './use-css';\n\nfunction sxTransform() {\n const theme = useMantineTheme();\n const { css } = useCss();\n\n return (sx: any) => {\n const parsedSx = typeof sx === 'function' ? sx(theme, getHelpers(theme)) : sx;\n return !parsedSx ? '' : css(parsedSx);\n };\n}\n\nfunction stylesTransform() {\n const theme = useMantineTheme();\n const { css } = useCss();\n\n return (styles: any, payload: any) => {\n if (!styles) {\n return {};\n }\n\n const stylesObject =\n typeof styles === 'function' ? styles(theme, payload.props, getHelpers(theme)) : styles;\n\n return Object.keys(stylesObject).reduce((acc, key) => {\n const value = stylesObject[key];\n const parsedValue = typeof value === 'function' ? value(theme) : value;\n return { ...acc, [key]: css(parsedValue) };\n }, {});\n };\n}\n\nexport const emotionTransform: MantineStylesTransform = {\n sx: sxTransform,\n styles: stylesTransform,\n};\n"],"mappings":";;;;;;AAIA,SAAS,cAAc;CACrB,MAAM,SAAA,GAAA,cAAA,
|
|
1
|
+
{"version":3,"file":"emotion-transform.cjs","names":["useCss","getHelpers"],"sources":["../src/emotion-transform.ts"],"sourcesContent":["import { MantineStylesTransform, useMantineTheme } from '@mantine/core';\nimport { getHelpers } from './create-styles';\nimport { useCss } from './use-css';\n\nfunction sxTransform() {\n const theme = useMantineTheme();\n const { css } = useCss();\n\n return (sx: any) => {\n const parsedSx = typeof sx === 'function' ? sx(theme, getHelpers(theme)) : sx;\n return !parsedSx ? '' : css(parsedSx);\n };\n}\n\nfunction stylesTransform() {\n const theme = useMantineTheme();\n const { css } = useCss();\n\n return (styles: any, payload: any) => {\n if (!styles) {\n return {};\n }\n\n const stylesObject =\n typeof styles === 'function' ? styles(theme, payload.props, getHelpers(theme)) : styles;\n\n return Object.keys(stylesObject).reduce((acc, key) => {\n const value = stylesObject[key];\n const parsedValue = typeof value === 'function' ? value(theme) : value;\n return { ...acc, [key]: css(parsedValue) };\n }, {});\n };\n}\n\nexport const emotionTransform: MantineStylesTransform = {\n sx: sxTransform,\n styles: stylesTransform,\n};\n"],"mappings":";;;;;;AAIA,SAAS,cAAc;CACrB,MAAM,SAAA,GAAA,cAAA,iBAAwB;CAC9B,MAAM,EAAE,QAAQA,gBAAAA,OAAO;CAEvB,QAAQ,OAAY;EAClB,MAAM,WAAW,OAAO,OAAO,aAAa,GAAG,OAAOC,sBAAAA,WAAW,KAAK,CAAC,IAAI;EAC3E,OAAO,CAAC,WAAW,KAAK,IAAI,QAAQ;CACtC;AACF;AAEA,SAAS,kBAAkB;CACzB,MAAM,SAAA,GAAA,cAAA,iBAAwB;CAC9B,MAAM,EAAE,QAAQD,gBAAAA,OAAO;CAEvB,QAAQ,QAAa,YAAiB;EACpC,IAAI,CAAC,QACH,OAAO,CAAC;EAGV,MAAM,eACJ,OAAO,WAAW,aAAa,OAAO,OAAO,QAAQ,OAAOC,sBAAAA,WAAW,KAAK,CAAC,IAAI;EAEnF,OAAO,OAAO,KAAK,YAAY,EAAE,QAAQ,KAAK,QAAQ;GACpD,MAAM,QAAQ,aAAa;GAC3B,MAAM,cAAc,OAAO,UAAU,aAAa,MAAM,KAAK,IAAI;GACjE,OAAO;IAAE,GAAG;KAAM,MAAM,IAAI,WAAW;GAAE;EAC3C,GAAG,CAAC,CAAC;CACP;AACF;AAEA,MAAa,mBAA2C;CACtD,IAAI;CACJ,QAAQ;AACV"}
|
package/cjs/merge-sx.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"merge-sx.cjs","names":[],"sources":["../src/merge-sx.ts"],"sourcesContent":["import type { MantineTheme } from '@mantine/core';\nimport { EmotionHelpers } from './create-styles';\nimport { CSSObject, EmotionSx } from './types';\n\nexport function mergeSx(...sxs: (EmotionSx | undefined)[]) {\n return (theme: MantineTheme, params: EmotionHelpers) => {\n return sxs.filter(Boolean).reduce<CSSObject>((merged, sx) => {\n const cssObj = typeof sx === 'function' ? sx(theme, params) : sx;\n return {\n ...merged,\n ...(cssObj || {}),\n };\n }, {});\n };\n}\n"],"mappings":";;AAIA,SAAgB,QAAQ,GAAG,KAAgC;
|
|
1
|
+
{"version":3,"file":"merge-sx.cjs","names":[],"sources":["../src/merge-sx.ts"],"sourcesContent":["import type { MantineTheme } from '@mantine/core';\nimport { EmotionHelpers } from './create-styles';\nimport { CSSObject, EmotionSx } from './types';\n\nexport function mergeSx(...sxs: (EmotionSx | undefined)[]) {\n return (theme: MantineTheme, params: EmotionHelpers) => {\n return sxs.filter(Boolean).reduce<CSSObject>((merged, sx) => {\n const cssObj = typeof sx === 'function' ? sx(theme, params) : sx;\n return {\n ...merged,\n ...(cssObj || {}),\n };\n }, {});\n };\n}\n"],"mappings":";;AAIA,SAAgB,QAAQ,GAAG,KAAgC;CACzD,QAAQ,OAAqB,WAA2B;EACtD,OAAO,IAAI,OAAO,OAAO,EAAE,QAAmB,QAAQ,OAAO;GAC3D,MAAM,SAAS,OAAO,OAAO,aAAa,GAAG,OAAO,MAAM,IAAI;GAC9D,OAAO;IACL,GAAG;IACH,GAAI,UAAU,CAAC;GACjB;EACF,GAAG,CAAC,CAAC;CACP;AACF"}
|
package/cjs/ssr.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ssr.cjs","names":[],"sources":["../src/ssr.tsx"],"sourcesContent":["import htmlReactParser from 'html-react-parser';\n\n// Type is not imported to avoid dependency on @emotion/server\ntype EmotionServer = any;\ntype NextDocumentType = any;\n\nexport function getSSRStyles(html: string, server: EmotionServer) {\n return server.constructStyleTagsFromChunks(server.extractCriticalToChunks(html));\n}\n\ninterface ServerStylesProps {\n html: string;\n server: EmotionServer;\n}\n\nexport function ServerStyles({ html, server }: ServerStylesProps): any {\n const styles = getSSRStyles(html, server);\n return <>{htmlReactParser(styles)}</>;\n}\n\nexport function createGetInitialProps(\n NextDocument: NextDocumentType,\n server: EmotionServer\n): (ctx: any) => any {\n return async function getInitialProps(ctx: any) {\n const initialProps = await NextDocument.getInitialProps(ctx);\n return {\n ...initialProps,\n styles: (\n <>\n {initialProps.styles}\n <ServerStyles html={initialProps.html} server={server} />\n </>\n ),\n };\n };\n}\n"],"mappings":";;;;;;AAMA,SAAgB,aAAa,MAAc,QAAuB;
|
|
1
|
+
{"version":3,"file":"ssr.cjs","names":[],"sources":["../src/ssr.tsx"],"sourcesContent":["import htmlReactParser from 'html-react-parser';\n\n// Type is not imported to avoid dependency on @emotion/server\ntype EmotionServer = any;\ntype NextDocumentType = any;\n\nexport function getSSRStyles(html: string, server: EmotionServer) {\n return server.constructStyleTagsFromChunks(server.extractCriticalToChunks(html));\n}\n\ninterface ServerStylesProps {\n html: string;\n server: EmotionServer;\n}\n\nexport function ServerStyles({ html, server }: ServerStylesProps): any {\n const styles = getSSRStyles(html, server);\n return <>{htmlReactParser(styles)}</>;\n}\n\nexport function createGetInitialProps(\n NextDocument: NextDocumentType,\n server: EmotionServer\n): (ctx: any) => any {\n return async function getInitialProps(ctx: any) {\n const initialProps = await NextDocument.getInitialProps(ctx);\n return {\n ...initialProps,\n styles: (\n <>\n {initialProps.styles}\n <ServerStyles html={initialProps.html} server={server} />\n </>\n ),\n };\n };\n}\n"],"mappings":";;;;;;AAMA,SAAgB,aAAa,MAAc,QAAuB;CAChE,OAAO,OAAO,6BAA6B,OAAO,wBAAwB,IAAI,CAAC;AACjF;AAOA,SAAgB,aAAa,EAAE,MAAM,UAAkC;CAErE,OAAO,iBAAA,GAAA,kBAAA,KAAA,kBAAA,UAAA,EAAA,WAAA,GAAA,kBAAA,SADQ,aAAa,MAAM,MACH,CAAC,EAAI,CAAA;AACtC;AAEA,SAAgB,sBACd,cACA,QACmB;CACnB,OAAO,eAAe,gBAAgB,KAAU;EAC9C,MAAM,eAAe,MAAM,aAAa,gBAAgB,GAAG;EAC3D,OAAO;GACL,GAAG;GACH,QACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CACG,aAAa,QACd,iBAAA,GAAA,kBAAA,KAAC,cAAD;IAAc,MAAM,aAAa;IAAc;GAAS,CAAA,CACxD,EAAA,CAAA;EAEN;CACF;AACF"}
|
package/cjs/use-css.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-css.cjs","names":["useEmotionCache","useGuaranteedMemo"],"sources":["../src/use-css.ts"],"sourcesContent":["/* oxlint-disable prefer-const */\nimport type { EmotionCache } from '@emotion/cache';\nimport { RegisteredCache, serializeStyles } from '@emotion/serialize';\nimport { getRegisteredStyles, insertStyles } from '@emotion/utils';\nimport clsx from 'clsx';\nimport { useEmotionCache } from './MantineEmotionProvider';\nimport type { CSS } from './types';\nimport { useGuaranteedMemo } from './use-guaranteed-memo';\n\nconst refPropertyName = 'ref' as const;\n\nfunction getRef(args: any[]) {\n let ref: string | undefined;\n\n if (args.length !== 1) {\n return { args, ref };\n }\n\n const [arg] = args;\n\n if (!(arg instanceof Object)) {\n return { args, ref };\n }\n\n if (!(refPropertyName in arg)) {\n return { args, ref };\n }\n\n ref = arg[refPropertyName];\n const argCopy = { ...arg };\n delete argCopy[refPropertyName];\n return { args: [argCopy], ref };\n}\n\nexport const { cssFactory } = (() => {\n function merge(registered: RegisteredCache, css: CSS, className: string) {\n const registeredStyles: string[] = [];\n\n const rawClassName = getRegisteredStyles(registered, registeredStyles, className);\n\n if (registeredStyles.length < 2) {\n return className;\n }\n\n return rawClassName + css(registeredStyles);\n }\n\n function _cssFactory(params: { cache: EmotionCache }) {\n const { cache } = params;\n\n const css: CSS = (...styles: any) => {\n const { ref, args } = getRef(styles);\n const serialized = serializeStyles(args, cache.registered);\n insertStyles(cache as any, serialized, false);\n return `${cache.key}-${serialized.name}${ref === undefined ? '' : ` ${ref}`}`;\n };\n\n const cx = (...args: any) => merge(cache.registered, css, clsx(args));\n\n return { css, cx };\n }\n\n return { cssFactory: _cssFactory };\n})();\n\nexport function useCss() {\n const cache = useEmotionCache();\n return useGuaranteedMemo(() => cssFactory({ cache }), [cache]);\n}\n"],"mappings":";;;;;;;;;AASA,MAAM,kBAAkB;AAExB,SAAS,OAAO,MAAa;CAC3B,IAAI;
|
|
1
|
+
{"version":3,"file":"use-css.cjs","names":["useEmotionCache","useGuaranteedMemo"],"sources":["../src/use-css.ts"],"sourcesContent":["/* oxlint-disable prefer-const */\nimport type { EmotionCache } from '@emotion/cache';\nimport { RegisteredCache, serializeStyles } from '@emotion/serialize';\nimport { getRegisteredStyles, insertStyles } from '@emotion/utils';\nimport clsx from 'clsx';\nimport { useEmotionCache } from './MantineEmotionProvider';\nimport type { CSS } from './types';\nimport { useGuaranteedMemo } from './use-guaranteed-memo';\n\nconst refPropertyName = 'ref' as const;\n\nfunction getRef(args: any[]) {\n let ref: string | undefined;\n\n if (args.length !== 1) {\n return { args, ref };\n }\n\n const [arg] = args;\n\n if (!(arg instanceof Object)) {\n return { args, ref };\n }\n\n if (!(refPropertyName in arg)) {\n return { args, ref };\n }\n\n ref = arg[refPropertyName];\n const argCopy = { ...arg };\n delete argCopy[refPropertyName];\n return { args: [argCopy], ref };\n}\n\nexport const { cssFactory } = (() => {\n function merge(registered: RegisteredCache, css: CSS, className: string) {\n const registeredStyles: string[] = [];\n\n const rawClassName = getRegisteredStyles(registered, registeredStyles, className);\n\n if (registeredStyles.length < 2) {\n return className;\n }\n\n return rawClassName + css(registeredStyles);\n }\n\n function _cssFactory(params: { cache: EmotionCache }) {\n const { cache } = params;\n\n const css: CSS = (...styles: any) => {\n const { ref, args } = getRef(styles);\n const serialized = serializeStyles(args, cache.registered);\n insertStyles(cache as any, serialized, false);\n return `${cache.key}-${serialized.name}${ref === undefined ? '' : ` ${ref}`}`;\n };\n\n const cx = (...args: any) => merge(cache.registered, css, clsx(args));\n\n return { css, cx };\n }\n\n return { cssFactory: _cssFactory };\n})();\n\nexport function useCss() {\n const cache = useEmotionCache();\n return useGuaranteedMemo(() => cssFactory({ cache }), [cache]);\n}\n"],"mappings":";;;;;;;;;AASA,MAAM,kBAAkB;AAExB,SAAS,OAAO,MAAa;CAC3B,IAAI;CAEJ,IAAI,KAAK,WAAW,GAClB,OAAO;EAAE;EAAM;CAAI;CAGrB,MAAM,CAAC,OAAO;CAEd,IAAI,EAAE,eAAe,SACnB,OAAO;EAAE;EAAM;CAAI;CAGrB,IAAI,EAAE,mBAAmB,MACvB,OAAO;EAAE;EAAM;CAAI;CAGrB,MAAM,IAAI;CACV,MAAM,UAAU,EAAE,GAAG,IAAI;CACzB,OAAO,QAAQ;CACf,OAAO;EAAE,MAAM,CAAC,OAAO;EAAG;CAAI;AAChC;AAEA,MAAa,EAAE,sBAAsB;CACnC,SAAS,MAAM,YAA6B,KAAU,WAAmB;EACvE,MAAM,mBAA6B,CAAC;EAEpC,MAAM,gBAAA,GAAA,eAAA,qBAAmC,YAAY,kBAAkB,SAAS;EAEhF,IAAI,iBAAiB,SAAS,GAC5B,OAAO;EAGT,OAAO,eAAe,IAAI,gBAAgB;CAC5C;CAEA,SAAS,YAAY,QAAiC;EACpD,MAAM,EAAE,UAAU;EAElB,MAAM,OAAY,GAAG,WAAgB;GACnC,MAAM,EAAE,KAAK,SAAS,OAAO,MAAM;GACnC,MAAM,cAAA,GAAA,mBAAA,iBAA6B,MAAM,MAAM,UAAU;GACzD,CAAA,GAAA,eAAA,cAAa,OAAc,YAAY,KAAK;GAC5C,OAAO,GAAG,MAAM,IAAI,GAAG,WAAW,OAAO,QAAQ,KAAA,IAAY,KAAK,IAAI;EACxE;EAEA,MAAM,MAAM,GAAG,SAAc,MAAM,MAAM,YAAY,MAAA,GAAA,KAAA,SAAU,IAAI,CAAC;EAEpE,OAAO;GAAE;GAAK;EAAG;CACnB;CAEA,OAAO,EAAE,YAAY,YAAY;AACnC,GAAG;AAEH,SAAgB,SAAS;CACvB,MAAM,QAAQA,+BAAAA,gBAAgB;CAC9B,OAAOC,4BAAAA,wBAAwB,WAAW,EAAE,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;AAC/D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-guaranteed-memo.cjs","names":[],"sources":["../src/use-guaranteed-memo.ts"],"sourcesContent":["import { useRef } from 'react';\n\nexport function useGuaranteedMemo<T>(fn: () => T, deps: React.DependencyList): T {\n const ref = useRef<{ v: T; prevDeps: unknown[] }>(null);\n\n if (\n !ref.current ||\n deps.length !== ref.current.prevDeps.length ||\n ref.current.prevDeps.map((v, i) => v === deps[i]).indexOf(false) >= 0\n ) {\n ref.current = {\n v: fn(),\n prevDeps: [...deps],\n };\n }\n\n return ref.current.v;\n}\n"],"mappings":";;;;AAEA,SAAgB,kBAAqB,IAAa,MAA+B;CAC/E,MAAM,OAAA,GAAA,MAAA,QAA4C,
|
|
1
|
+
{"version":3,"file":"use-guaranteed-memo.cjs","names":[],"sources":["../src/use-guaranteed-memo.ts"],"sourcesContent":["import { useRef } from 'react';\n\nexport function useGuaranteedMemo<T>(fn: () => T, deps: React.DependencyList): T {\n const ref = useRef<{ v: T; prevDeps: unknown[] }>(null);\n\n if (\n !ref.current ||\n deps.length !== ref.current.prevDeps.length ||\n ref.current.prevDeps.map((v, i) => v === deps[i]).indexOf(false) >= 0\n ) {\n ref.current = {\n v: fn(),\n prevDeps: [...deps],\n };\n }\n\n return ref.current.v;\n}\n"],"mappings":";;;;AAEA,SAAgB,kBAAqB,IAAa,MAA+B;CAC/E,MAAM,OAAA,GAAA,MAAA,QAA4C,IAAI;CAEtD,IACE,CAAC,IAAI,WACL,KAAK,WAAW,IAAI,QAAQ,SAAS,UACrC,IAAI,QAAQ,SAAS,KAAK,GAAG,MAAM,MAAM,KAAK,EAAE,EAAE,QAAQ,KAAK,KAAK,GAEpE,IAAI,UAAU;EACZ,GAAG,GAAG;EACN,UAAU,CAAC,GAAG,IAAI;CACpB;CAGF,OAAO,IAAI,QAAQ;AACrB"}
|
package/esm/Global.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Global.mjs","names":["Global","EmotionGlobal"],"sources":["../src/Global.tsx"],"sourcesContent":["import { css, Global as EmotionGlobal } from '@emotion/react';\nimport { MantineTheme, useMantineTheme } from '@mantine/core';\nimport type { CSSObject } from './types';\n\ntype EmotionStyles = CSSObject | CSSObject[];\n\ninterface GlobalStylesProps {\n styles: EmotionStyles | ((theme: MantineTheme) => EmotionStyles);\n}\n\nexport function Global({ styles }: GlobalStylesProps) {\n const theme = useMantineTheme();\n return (\n <EmotionGlobal styles={css((typeof styles === 'function' ? styles(theme) : styles) as any)} />\n );\n}\n"],"mappings":";;;;;AAUA,SAAgBA,SAAO,EAAE,UAA6B;CACpD,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"Global.mjs","names":["Global","EmotionGlobal"],"sources":["../src/Global.tsx"],"sourcesContent":["import { css, Global as EmotionGlobal } from '@emotion/react';\nimport { MantineTheme, useMantineTheme } from '@mantine/core';\nimport type { CSSObject } from './types';\n\ntype EmotionStyles = CSSObject | CSSObject[];\n\ninterface GlobalStylesProps {\n styles: EmotionStyles | ((theme: MantineTheme) => EmotionStyles);\n}\n\nexport function Global({ styles }: GlobalStylesProps) {\n const theme = useMantineTheme();\n return (\n <EmotionGlobal styles={css((typeof styles === 'function' ? styles(theme) : styles) as any)} />\n );\n}\n"],"mappings":";;;;;AAUA,SAAgBA,SAAO,EAAE,UAA6B;CACpD,MAAM,QAAQ,gBAAgB;CAC9B,OACE,oBAACC,QAAD,EAAe,QAAQ,IAAK,OAAO,WAAW,aAAa,OAAO,KAAK,IAAI,MAAc,EAAI,CAAA;AAEjG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MantineEmotionProvider.mjs","names":[],"sources":["../src/MantineEmotionProvider.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport { EmotionCache, withEmotionCache } from '@emotion/react';\n\nexport const EmotionCacheContext = createContext<EmotionCache | null>(null);\n\nexport function useEmotionCache() {\n const cache = use(EmotionCacheContext);\n\n if (cache === null) {\n throw new Error(\n 'Emotion cache is not available in context, make sure that you have MantineEmotionProvider in the component tree'\n );\n }\n\n return cache;\n}\n\ninterface EmotionCacheProviderProps {\n children: React.ReactNode;\n cache?: EmotionCache;\n}\n\nexport const MantineEmotionProvider = withEmotionCache<EmotionCacheProviderProps>(\n ({ children, cache }, ctx) => (\n <EmotionCacheContext value={cache || ctx}>{children}</EmotionCacheContext>\n )\n);\n"],"mappings":";;;;;AAGA,MAAa,sBAAsB,cAAmC,
|
|
1
|
+
{"version":3,"file":"MantineEmotionProvider.mjs","names":[],"sources":["../src/MantineEmotionProvider.tsx"],"sourcesContent":["import { createContext, use } from 'react';\nimport { EmotionCache, withEmotionCache } from '@emotion/react';\n\nexport const EmotionCacheContext = createContext<EmotionCache | null>(null);\n\nexport function useEmotionCache() {\n const cache = use(EmotionCacheContext);\n\n if (cache === null) {\n throw new Error(\n 'Emotion cache is not available in context, make sure that you have MantineEmotionProvider in the component tree'\n );\n }\n\n return cache;\n}\n\ninterface EmotionCacheProviderProps {\n children: React.ReactNode;\n cache?: EmotionCache;\n}\n\nexport const MantineEmotionProvider = withEmotionCache<EmotionCacheProviderProps>(\n ({ children, cache }, ctx) => (\n <EmotionCacheContext value={cache || ctx}>{children}</EmotionCacheContext>\n )\n);\n"],"mappings":";;;;;AAGA,MAAa,sBAAsB,cAAmC,IAAI;AAE1E,SAAgB,kBAAkB;CAChC,MAAM,QAAQ,IAAI,mBAAmB;CAErC,IAAI,UAAU,MACZ,MAAM,IAAI,MACR,iHACF;CAGF,OAAO;AACT;AAOA,MAAa,yBAAyB,kBACnC,EAAE,UAAU,SAAS,QACpB,oBAAC,qBAAD;CAAqB,OAAO,SAAS;CAAM;AAA8B,CAAA,CAE7E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create-styles.mjs","names":[],"sources":["../src/create-styles.ts"],"sourcesContent":["import { em, MantineBreakpoint, MantineTheme, px, useMantineTheme } from '@mantine/core';\nimport { CSSObject } from './types';\nimport { useCss } from './use-css';\n\nexport function getStylesRef(refName: string) {\n return `___ref-${refName || ''}`;\n}\n\nfunction getBreakpointValue(theme: MantineTheme, breakpoint: MantineBreakpoint | number) {\n return breakpoint in theme.breakpoints && typeof breakpoint !== 'number'\n ? (px(theme.breakpoints[breakpoint]) as number)\n : (px(breakpoint) as number);\n}\n\nexport const getHelpers = (theme: MantineTheme) => ({\n light: '[data-mantine-color-scheme=\"light\"] &',\n dark: '[data-mantine-color-scheme=\"dark\"] &',\n rtl: '[dir=\"rtl\"] &',\n ltr: '[dir=\"ltr\"] &',\n notRtl: '[dir=\"ltr\"] &',\n notLtr: '[dir=\"rtl\"] &',\n ref: getStylesRef,\n smallerThan: (breakpoint: MantineBreakpoint | number) =>\n `@media (max-width: ${em(getBreakpointValue(theme, breakpoint) - 0.1)})`,\n largerThan: (breakpoint: MantineBreakpoint | number) =>\n `@media (min-width: ${em(getBreakpointValue(theme, breakpoint))})`,\n});\n\nexport type EmotionHelpers = ReturnType<typeof getHelpers>;\n\nexport function createStyles<\n Key extends string = string,\n Params = void,\n Input extends Record<Key, CSSObject> = Record<Key, CSSObject>,\n>(input: ((theme: MantineTheme, params: Params, helpers: EmotionHelpers) => Input) | Input) {\n const getCssObject = typeof input === 'function' ? input : () => input;\n\n return function useStyles(params: Params) {\n const theme = useMantineTheme();\n const helpers = getHelpers(theme);\n const cssObject: Record<string, any> = getCssObject(theme, params, helpers);\n const { css, cx } = useCss();\n const classes = Object.keys(cssObject).reduce<Record<string, string>>((acc, key) => {\n acc[key] = css(cssObject[key]);\n return acc;\n }, {}) as { [key in keyof Input]: string };\n\n return { classes, cx, theme };\n };\n}\n"],"mappings":";;;;AAIA,SAAgB,aAAa,SAAiB;
|
|
1
|
+
{"version":3,"file":"create-styles.mjs","names":[],"sources":["../src/create-styles.ts"],"sourcesContent":["import { em, MantineBreakpoint, MantineTheme, px, useMantineTheme } from '@mantine/core';\nimport { CSSObject } from './types';\nimport { useCss } from './use-css';\n\nexport function getStylesRef(refName: string) {\n return `___ref-${refName || ''}`;\n}\n\nfunction getBreakpointValue(theme: MantineTheme, breakpoint: MantineBreakpoint | number) {\n return breakpoint in theme.breakpoints && typeof breakpoint !== 'number'\n ? (px(theme.breakpoints[breakpoint]) as number)\n : (px(breakpoint) as number);\n}\n\nexport const getHelpers = (theme: MantineTheme) => ({\n light: '[data-mantine-color-scheme=\"light\"] &',\n dark: '[data-mantine-color-scheme=\"dark\"] &',\n rtl: '[dir=\"rtl\"] &',\n ltr: '[dir=\"ltr\"] &',\n notRtl: '[dir=\"ltr\"] &',\n notLtr: '[dir=\"rtl\"] &',\n ref: getStylesRef,\n smallerThan: (breakpoint: MantineBreakpoint | number) =>\n `@media (max-width: ${em(getBreakpointValue(theme, breakpoint) - 0.1)})`,\n largerThan: (breakpoint: MantineBreakpoint | number) =>\n `@media (min-width: ${em(getBreakpointValue(theme, breakpoint))})`,\n});\n\nexport type EmotionHelpers = ReturnType<typeof getHelpers>;\n\nexport function createStyles<\n Key extends string = string,\n Params = void,\n Input extends Record<Key, CSSObject> = Record<Key, CSSObject>,\n>(input: ((theme: MantineTheme, params: Params, helpers: EmotionHelpers) => Input) | Input) {\n const getCssObject = typeof input === 'function' ? input : () => input;\n\n return function useStyles(params: Params) {\n const theme = useMantineTheme();\n const helpers = getHelpers(theme);\n const cssObject: Record<string, any> = getCssObject(theme, params, helpers);\n const { css, cx } = useCss();\n const classes = Object.keys(cssObject).reduce<Record<string, string>>((acc, key) => {\n acc[key] = css(cssObject[key]);\n return acc;\n }, {}) as { [key in keyof Input]: string };\n\n return { classes, cx, theme };\n };\n}\n"],"mappings":";;;;AAIA,SAAgB,aAAa,SAAiB;CAC5C,OAAO,UAAU,WAAW;AAC9B;AAEA,SAAS,mBAAmB,OAAqB,YAAwC;CACvF,OAAO,cAAc,MAAM,eAAe,OAAO,eAAe,WAC3D,GAAG,MAAM,YAAY,WAAW,IAChC,GAAG,UAAU;AACpB;AAEA,MAAa,cAAc,WAAyB;CAClD,OAAO;CACP,MAAM;CACN,KAAK;CACL,KAAK;CACL,QAAQ;CACR,QAAQ;CACR,KAAK;CACL,cAAc,eACZ,sBAAsB,GAAG,mBAAmB,OAAO,UAAU,IAAI,EAAG,EAAE;CACxE,aAAa,eACX,sBAAsB,GAAG,mBAAmB,OAAO,UAAU,CAAC,EAAE;AACpE;AAIA,SAAgB,aAId,OAA0F;CAC1F,MAAM,eAAe,OAAO,UAAU,aAAa,cAAc;CAEjE,OAAO,SAAS,UAAU,QAAgB;EACxC,MAAM,QAAQ,gBAAgB;EAE9B,MAAM,YAAiC,aAAa,OAAO,QAD3C,WAAW,KAC8C,CAAC;EAC1E,MAAM,EAAE,KAAK,OAAO,OAAO;EAM3B,OAAO;GAAE,SALO,OAAO,KAAK,SAAS,EAAE,QAAgC,KAAK,QAAQ;IAClF,IAAI,OAAO,IAAI,UAAU,IAAI;IAC7B,OAAO;GACT,GAAG,CAAC,CAEW;GAAG;GAAI;EAAM;CAC9B;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"emotion-transform.mjs","names":[],"sources":["../src/emotion-transform.ts"],"sourcesContent":["import { MantineStylesTransform, useMantineTheme } from '@mantine/core';\nimport { getHelpers } from './create-styles';\nimport { useCss } from './use-css';\n\nfunction sxTransform() {\n const theme = useMantineTheme();\n const { css } = useCss();\n\n return (sx: any) => {\n const parsedSx = typeof sx === 'function' ? sx(theme, getHelpers(theme)) : sx;\n return !parsedSx ? '' : css(parsedSx);\n };\n}\n\nfunction stylesTransform() {\n const theme = useMantineTheme();\n const { css } = useCss();\n\n return (styles: any, payload: any) => {\n if (!styles) {\n return {};\n }\n\n const stylesObject =\n typeof styles === 'function' ? styles(theme, payload.props, getHelpers(theme)) : styles;\n\n return Object.keys(stylesObject).reduce((acc, key) => {\n const value = stylesObject[key];\n const parsedValue = typeof value === 'function' ? value(theme) : value;\n return { ...acc, [key]: css(parsedValue) };\n }, {});\n };\n}\n\nexport const emotionTransform: MantineStylesTransform = {\n sx: sxTransform,\n styles: stylesTransform,\n};\n"],"mappings":";;;;;AAIA,SAAS,cAAc;CACrB,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"emotion-transform.mjs","names":[],"sources":["../src/emotion-transform.ts"],"sourcesContent":["import { MantineStylesTransform, useMantineTheme } from '@mantine/core';\nimport { getHelpers } from './create-styles';\nimport { useCss } from './use-css';\n\nfunction sxTransform() {\n const theme = useMantineTheme();\n const { css } = useCss();\n\n return (sx: any) => {\n const parsedSx = typeof sx === 'function' ? sx(theme, getHelpers(theme)) : sx;\n return !parsedSx ? '' : css(parsedSx);\n };\n}\n\nfunction stylesTransform() {\n const theme = useMantineTheme();\n const { css } = useCss();\n\n return (styles: any, payload: any) => {\n if (!styles) {\n return {};\n }\n\n const stylesObject =\n typeof styles === 'function' ? styles(theme, payload.props, getHelpers(theme)) : styles;\n\n return Object.keys(stylesObject).reduce((acc, key) => {\n const value = stylesObject[key];\n const parsedValue = typeof value === 'function' ? value(theme) : value;\n return { ...acc, [key]: css(parsedValue) };\n }, {});\n };\n}\n\nexport const emotionTransform: MantineStylesTransform = {\n sx: sxTransform,\n styles: stylesTransform,\n};\n"],"mappings":";;;;;AAIA,SAAS,cAAc;CACrB,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,EAAE,QAAQ,OAAO;CAEvB,QAAQ,OAAY;EAClB,MAAM,WAAW,OAAO,OAAO,aAAa,GAAG,OAAO,WAAW,KAAK,CAAC,IAAI;EAC3E,OAAO,CAAC,WAAW,KAAK,IAAI,QAAQ;CACtC;AACF;AAEA,SAAS,kBAAkB;CACzB,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,EAAE,QAAQ,OAAO;CAEvB,QAAQ,QAAa,YAAiB;EACpC,IAAI,CAAC,QACH,OAAO,CAAC;EAGV,MAAM,eACJ,OAAO,WAAW,aAAa,OAAO,OAAO,QAAQ,OAAO,WAAW,KAAK,CAAC,IAAI;EAEnF,OAAO,OAAO,KAAK,YAAY,EAAE,QAAQ,KAAK,QAAQ;GACpD,MAAM,QAAQ,aAAa;GAC3B,MAAM,cAAc,OAAO,UAAU,aAAa,MAAM,KAAK,IAAI;GACjE,OAAO;IAAE,GAAG;KAAM,MAAM,IAAI,WAAW;GAAE;EAC3C,GAAG,CAAC,CAAC;CACP;AACF;AAEA,MAAa,mBAA2C;CACtD,IAAI;CACJ,QAAQ;AACV"}
|
package/esm/merge-sx.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"merge-sx.mjs","names":[],"sources":["../src/merge-sx.ts"],"sourcesContent":["import type { MantineTheme } from '@mantine/core';\nimport { EmotionHelpers } from './create-styles';\nimport { CSSObject, EmotionSx } from './types';\n\nexport function mergeSx(...sxs: (EmotionSx | undefined)[]) {\n return (theme: MantineTheme, params: EmotionHelpers) => {\n return sxs.filter(Boolean).reduce<CSSObject>((merged, sx) => {\n const cssObj = typeof sx === 'function' ? sx(theme, params) : sx;\n return {\n ...merged,\n ...(cssObj || {}),\n };\n }, {});\n };\n}\n"],"mappings":";;AAIA,SAAgB,QAAQ,GAAG,KAAgC;
|
|
1
|
+
{"version":3,"file":"merge-sx.mjs","names":[],"sources":["../src/merge-sx.ts"],"sourcesContent":["import type { MantineTheme } from '@mantine/core';\nimport { EmotionHelpers } from './create-styles';\nimport { CSSObject, EmotionSx } from './types';\n\nexport function mergeSx(...sxs: (EmotionSx | undefined)[]) {\n return (theme: MantineTheme, params: EmotionHelpers) => {\n return sxs.filter(Boolean).reduce<CSSObject>((merged, sx) => {\n const cssObj = typeof sx === 'function' ? sx(theme, params) : sx;\n return {\n ...merged,\n ...(cssObj || {}),\n };\n }, {});\n };\n}\n"],"mappings":";;AAIA,SAAgB,QAAQ,GAAG,KAAgC;CACzD,QAAQ,OAAqB,WAA2B;EACtD,OAAO,IAAI,OAAO,OAAO,EAAE,QAAmB,QAAQ,OAAO;GAC3D,MAAM,SAAS,OAAO,OAAO,aAAa,GAAG,OAAO,MAAM,IAAI;GAC9D,OAAO;IACL,GAAG;IACH,GAAI,UAAU,CAAC;GACjB;EACF,GAAG,CAAC,CAAC;CACP;AACF"}
|
package/esm/ssr.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ssr.mjs","names":[],"sources":["../src/ssr.tsx"],"sourcesContent":["import htmlReactParser from 'html-react-parser';\n\n// Type is not imported to avoid dependency on @emotion/server\ntype EmotionServer = any;\ntype NextDocumentType = any;\n\nexport function getSSRStyles(html: string, server: EmotionServer) {\n return server.constructStyleTagsFromChunks(server.extractCriticalToChunks(html));\n}\n\ninterface ServerStylesProps {\n html: string;\n server: EmotionServer;\n}\n\nexport function ServerStyles({ html, server }: ServerStylesProps): any {\n const styles = getSSRStyles(html, server);\n return <>{htmlReactParser(styles)}</>;\n}\n\nexport function createGetInitialProps(\n NextDocument: NextDocumentType,\n server: EmotionServer\n): (ctx: any) => any {\n return async function getInitialProps(ctx: any) {\n const initialProps = await NextDocument.getInitialProps(ctx);\n return {\n ...initialProps,\n styles: (\n <>\n {initialProps.styles}\n <ServerStyles html={initialProps.html} server={server} />\n </>\n ),\n };\n };\n}\n"],"mappings":";;;;AAMA,SAAgB,aAAa,MAAc,QAAuB;
|
|
1
|
+
{"version":3,"file":"ssr.mjs","names":[],"sources":["../src/ssr.tsx"],"sourcesContent":["import htmlReactParser from 'html-react-parser';\n\n// Type is not imported to avoid dependency on @emotion/server\ntype EmotionServer = any;\ntype NextDocumentType = any;\n\nexport function getSSRStyles(html: string, server: EmotionServer) {\n return server.constructStyleTagsFromChunks(server.extractCriticalToChunks(html));\n}\n\ninterface ServerStylesProps {\n html: string;\n server: EmotionServer;\n}\n\nexport function ServerStyles({ html, server }: ServerStylesProps): any {\n const styles = getSSRStyles(html, server);\n return <>{htmlReactParser(styles)}</>;\n}\n\nexport function createGetInitialProps(\n NextDocument: NextDocumentType,\n server: EmotionServer\n): (ctx: any) => any {\n return async function getInitialProps(ctx: any) {\n const initialProps = await NextDocument.getInitialProps(ctx);\n return {\n ...initialProps,\n styles: (\n <>\n {initialProps.styles}\n <ServerStyles html={initialProps.html} server={server} />\n </>\n ),\n };\n };\n}\n"],"mappings":";;;;AAMA,SAAgB,aAAa,MAAc,QAAuB;CAChE,OAAO,OAAO,6BAA6B,OAAO,wBAAwB,IAAI,CAAC;AACjF;AAOA,SAAgB,aAAa,EAAE,MAAM,UAAkC;CAErE,OAAO,oBAAA,UAAA,EAAA,UAAG,gBADK,aAAa,MAAM,MACH,CAAC,EAAI,CAAA;AACtC;AAEA,SAAgB,sBACd,cACA,QACmB;CACnB,OAAO,eAAe,gBAAgB,KAAU;EAC9C,MAAM,eAAe,MAAM,aAAa,gBAAgB,GAAG;EAC3D,OAAO;GACL,GAAG;GACH,QACE,qBAAA,UAAA,EAAA,UAAA,CACG,aAAa,QACd,oBAAC,cAAD;IAAc,MAAM,aAAa;IAAc;GAAS,CAAA,CACxD,EAAA,CAAA;EAEN;CACF;AACF"}
|
package/esm/use-css.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-css.mjs","names":[],"sources":["../src/use-css.ts"],"sourcesContent":["/* oxlint-disable prefer-const */\nimport type { EmotionCache } from '@emotion/cache';\nimport { RegisteredCache, serializeStyles } from '@emotion/serialize';\nimport { getRegisteredStyles, insertStyles } from '@emotion/utils';\nimport clsx from 'clsx';\nimport { useEmotionCache } from './MantineEmotionProvider';\nimport type { CSS } from './types';\nimport { useGuaranteedMemo } from './use-guaranteed-memo';\n\nconst refPropertyName = 'ref' as const;\n\nfunction getRef(args: any[]) {\n let ref: string | undefined;\n\n if (args.length !== 1) {\n return { args, ref };\n }\n\n const [arg] = args;\n\n if (!(arg instanceof Object)) {\n return { args, ref };\n }\n\n if (!(refPropertyName in arg)) {\n return { args, ref };\n }\n\n ref = arg[refPropertyName];\n const argCopy = { ...arg };\n delete argCopy[refPropertyName];\n return { args: [argCopy], ref };\n}\n\nexport const { cssFactory } = (() => {\n function merge(registered: RegisteredCache, css: CSS, className: string) {\n const registeredStyles: string[] = [];\n\n const rawClassName = getRegisteredStyles(registered, registeredStyles, className);\n\n if (registeredStyles.length < 2) {\n return className;\n }\n\n return rawClassName + css(registeredStyles);\n }\n\n function _cssFactory(params: { cache: EmotionCache }) {\n const { cache } = params;\n\n const css: CSS = (...styles: any) => {\n const { ref, args } = getRef(styles);\n const serialized = serializeStyles(args, cache.registered);\n insertStyles(cache as any, serialized, false);\n return `${cache.key}-${serialized.name}${ref === undefined ? '' : ` ${ref}`}`;\n };\n\n const cx = (...args: any) => merge(cache.registered, css, clsx(args));\n\n return { css, cx };\n }\n\n return { cssFactory: _cssFactory };\n})();\n\nexport function useCss() {\n const cache = useEmotionCache();\n return useGuaranteedMemo(() => cssFactory({ cache }), [cache]);\n}\n"],"mappings":";;;;;;;AASA,MAAM,kBAAkB;AAExB,SAAS,OAAO,MAAa;CAC3B,IAAI;
|
|
1
|
+
{"version":3,"file":"use-css.mjs","names":[],"sources":["../src/use-css.ts"],"sourcesContent":["/* oxlint-disable prefer-const */\nimport type { EmotionCache } from '@emotion/cache';\nimport { RegisteredCache, serializeStyles } from '@emotion/serialize';\nimport { getRegisteredStyles, insertStyles } from '@emotion/utils';\nimport clsx from 'clsx';\nimport { useEmotionCache } from './MantineEmotionProvider';\nimport type { CSS } from './types';\nimport { useGuaranteedMemo } from './use-guaranteed-memo';\n\nconst refPropertyName = 'ref' as const;\n\nfunction getRef(args: any[]) {\n let ref: string | undefined;\n\n if (args.length !== 1) {\n return { args, ref };\n }\n\n const [arg] = args;\n\n if (!(arg instanceof Object)) {\n return { args, ref };\n }\n\n if (!(refPropertyName in arg)) {\n return { args, ref };\n }\n\n ref = arg[refPropertyName];\n const argCopy = { ...arg };\n delete argCopy[refPropertyName];\n return { args: [argCopy], ref };\n}\n\nexport const { cssFactory } = (() => {\n function merge(registered: RegisteredCache, css: CSS, className: string) {\n const registeredStyles: string[] = [];\n\n const rawClassName = getRegisteredStyles(registered, registeredStyles, className);\n\n if (registeredStyles.length < 2) {\n return className;\n }\n\n return rawClassName + css(registeredStyles);\n }\n\n function _cssFactory(params: { cache: EmotionCache }) {\n const { cache } = params;\n\n const css: CSS = (...styles: any) => {\n const { ref, args } = getRef(styles);\n const serialized = serializeStyles(args, cache.registered);\n insertStyles(cache as any, serialized, false);\n return `${cache.key}-${serialized.name}${ref === undefined ? '' : ` ${ref}`}`;\n };\n\n const cx = (...args: any) => merge(cache.registered, css, clsx(args));\n\n return { css, cx };\n }\n\n return { cssFactory: _cssFactory };\n})();\n\nexport function useCss() {\n const cache = useEmotionCache();\n return useGuaranteedMemo(() => cssFactory({ cache }), [cache]);\n}\n"],"mappings":";;;;;;;AASA,MAAM,kBAAkB;AAExB,SAAS,OAAO,MAAa;CAC3B,IAAI;CAEJ,IAAI,KAAK,WAAW,GAClB,OAAO;EAAE;EAAM;CAAI;CAGrB,MAAM,CAAC,OAAO;CAEd,IAAI,EAAE,eAAe,SACnB,OAAO;EAAE;EAAM;CAAI;CAGrB,IAAI,EAAE,mBAAmB,MACvB,OAAO;EAAE;EAAM;CAAI;CAGrB,MAAM,IAAI;CACV,MAAM,UAAU,EAAE,GAAG,IAAI;CACzB,OAAO,QAAQ;CACf,OAAO;EAAE,MAAM,CAAC,OAAO;EAAG;CAAI;AAChC;AAEA,MAAa,EAAE,sBAAsB;CACnC,SAAS,MAAM,YAA6B,KAAU,WAAmB;EACvE,MAAM,mBAA6B,CAAC;EAEpC,MAAM,eAAe,oBAAoB,YAAY,kBAAkB,SAAS;EAEhF,IAAI,iBAAiB,SAAS,GAC5B,OAAO;EAGT,OAAO,eAAe,IAAI,gBAAgB;CAC5C;CAEA,SAAS,YAAY,QAAiC;EACpD,MAAM,EAAE,UAAU;EAElB,MAAM,OAAY,GAAG,WAAgB;GACnC,MAAM,EAAE,KAAK,SAAS,OAAO,MAAM;GACnC,MAAM,aAAa,gBAAgB,MAAM,MAAM,UAAU;GACzD,aAAa,OAAc,YAAY,KAAK;GAC5C,OAAO,GAAG,MAAM,IAAI,GAAG,WAAW,OAAO,QAAQ,KAAA,IAAY,KAAK,IAAI;EACxE;EAEA,MAAM,MAAM,GAAG,SAAc,MAAM,MAAM,YAAY,KAAK,KAAK,IAAI,CAAC;EAEpE,OAAO;GAAE;GAAK;EAAG;CACnB;CAEA,OAAO,EAAE,YAAY,YAAY;AACnC,GAAG;AAEH,SAAgB,SAAS;CACvB,MAAM,QAAQ,gBAAgB;CAC9B,OAAO,wBAAwB,WAAW,EAAE,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;AAC/D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-guaranteed-memo.mjs","names":[],"sources":["../src/use-guaranteed-memo.ts"],"sourcesContent":["import { useRef } from 'react';\n\nexport function useGuaranteedMemo<T>(fn: () => T, deps: React.DependencyList): T {\n const ref = useRef<{ v: T; prevDeps: unknown[] }>(null);\n\n if (\n !ref.current ||\n deps.length !== ref.current.prevDeps.length ||\n ref.current.prevDeps.map((v, i) => v === deps[i]).indexOf(false) >= 0\n ) {\n ref.current = {\n v: fn(),\n prevDeps: [...deps],\n };\n }\n\n return ref.current.v;\n}\n"],"mappings":";;;AAEA,SAAgB,kBAAqB,IAAa,MAA+B;CAC/E,MAAM,MAAM,OAAsC,
|
|
1
|
+
{"version":3,"file":"use-guaranteed-memo.mjs","names":[],"sources":["../src/use-guaranteed-memo.ts"],"sourcesContent":["import { useRef } from 'react';\n\nexport function useGuaranteedMemo<T>(fn: () => T, deps: React.DependencyList): T {\n const ref = useRef<{ v: T; prevDeps: unknown[] }>(null);\n\n if (\n !ref.current ||\n deps.length !== ref.current.prevDeps.length ||\n ref.current.prevDeps.map((v, i) => v === deps[i]).indexOf(false) >= 0\n ) {\n ref.current = {\n v: fn(),\n prevDeps: [...deps],\n };\n }\n\n return ref.current.v;\n}\n"],"mappings":";;;AAEA,SAAgB,kBAAqB,IAAa,MAA+B;CAC/E,MAAM,MAAM,OAAsC,IAAI;CAEtD,IACE,CAAC,IAAI,WACL,KAAK,WAAW,IAAI,QAAQ,SAAS,UACrC,IAAI,QAAQ,SAAS,KAAK,GAAG,MAAM,MAAM,KAAK,EAAE,EAAE,QAAQ,KAAK,KAAK,GAEpE,IAAI,UAAU;EACZ,GAAG,GAAG;EACN,UAAU,CAAC,GAAG,IAAI;CACpB;CAGF,OAAO,IAAI,QAAQ;AACrB"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mantine/emotion",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.2.1",
|
|
4
4
|
"description": "Emotion bindings for Mantine",
|
|
5
5
|
"homepage": "https://mantine.dev/",
|
|
6
6
|
"license": "MIT",
|
|
@@ -35,8 +35,8 @@
|
|
|
35
35
|
"@emotion/react": "^11.11.4",
|
|
36
36
|
"@emotion/serialize": "^1.1.4",
|
|
37
37
|
"@emotion/utils": "^1.2.1",
|
|
38
|
-
"@mantine/core": "9.
|
|
39
|
-
"@mantine/hooks": "9.
|
|
38
|
+
"@mantine/core": "9.2.1",
|
|
39
|
+
"@mantine/hooks": "9.2.1",
|
|
40
40
|
"react": "^19.2.0",
|
|
41
41
|
"react-dom": "^19.2.0"
|
|
42
42
|
},
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"@mantine-tests/core": "workspace:*",
|
|
49
49
|
"@mantine/core": "workspace:*",
|
|
50
50
|
"@mantine/hooks": "workspace:*",
|
|
51
|
-
"react": "19.2.
|
|
52
|
-
"react-dom": "19.2.
|
|
51
|
+
"react": "19.2.6",
|
|
52
|
+
"react-dom": "19.2.6"
|
|
53
53
|
}
|
|
54
54
|
}
|