@mantine/emotion 9.2.2 → 9.3.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 +0 -1
- package/cjs/Global.cjs.map +1 -1
- package/cjs/MantineEmotionProvider.cjs +0 -1
- package/cjs/MantineEmotionProvider.cjs.map +1 -1
- package/cjs/create-styles.cjs +0 -1
- package/cjs/create-styles.cjs.map +1 -1
- package/cjs/emotion-transform.cjs +0 -1
- package/cjs/emotion-transform.cjs.map +1 -1
- package/cjs/index.cjs +0 -1
- package/cjs/use-guaranteed-memo.cjs +0 -1
- package/cjs/use-guaranteed-memo.cjs.map +1 -1
- package/package.json +3 -3
package/cjs/Global.cjs
CHANGED
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":"
|
|
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":"
|
|
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"}
|
package/cjs/create-styles.cjs
CHANGED
|
@@ -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":"
|
|
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":"
|
|
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/index.cjs
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
require("./_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_MantineEmotionProvider = require("./MantineEmotionProvider.cjs");
|
|
4
3
|
const require_use_css = require("./use-css.cjs");
|
|
5
4
|
const require_create_styles = require("./create-styles.cjs");
|
|
@@ -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":"
|
|
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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mantine/emotion",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.3.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.3.1",
|
|
39
|
+
"@mantine/hooks": "9.3.1",
|
|
40
40
|
"react": "^19.2.0",
|
|
41
41
|
"react-dom": "^19.2.0"
|
|
42
42
|
},
|