next-yak 6.1.0-next.0 → 8.0.0

package/README.md

@@ -3,7 +3,7 @@
 ![A yak Riding on a rusty SWC Rocket](https://github.com/user-attachments/assets/72494b1c-db1a-4ff7-bd6f-2ed3535fb126)
 
 [![npm version](https://badge.fury.io/js/next-yak.svg)](https://www.npmjs.com/package/next-yak)
-[![License](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/jantimon/next-yak/blob/main/LICENSE)
+[![License](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/DigitecGalaxus/next-yak/blob/main/LICENSE)
 
 **next-yak** is a CSS-in-JS solution tailored for [Next.js](https://nextjs.org/) that seamlessly combines the expressive power of styled-components syntax with efficient build-time extraction of CSS using Next.js's built-in CSS configuration.
 
@@ -16,7 +16,7 @@
 - **Standard CSS Syntax**: Write styles in familiar, easy-to-use CSS
 - **Integrates with Atomic CSS**: Easily combines with atomic CSS frameworks like Tailwind CSS for more design options
 
-[Preview (Video)](https://github.com/jantimon/next-yak/assets/4113649/f5a220fc-2a0f-46be-a8e7-c855f7faa337
+[Preview (Video)](https://github.com/DigitecGalaxus/next-yak/assets/4113649/f5a220fc-2a0f-46be-a8e7-c855f7faa337
 )
 
 ## Compatibility
@@ -97,7 +97,7 @@ const ToggleButton = styled.button`
 `;
 ```
 
-[Dynamic Styles (Video)](https://github.com/jantimon/next-yak/assets/4113649/c5f52846-33e4-4058-9c78-efd98197d75f)
+[Dynamic Styles (Video)](https://github.com/DigitecGalaxus/next-yak/assets/4113649/c5f52846-33e4-4058-9c78-efd98197d75f)
 
 ### Dynamic Properties
 
@@ -128,7 +128,7 @@ const ExampleComponent = () => {
 };
 ```
 
-[Dynamic Props (video)](https://github.com/jantimon/next-yak/assets/4113649/2fa78f82-382c-465f-b294-2504739ea168)
+[Dynamic Props (video)](https://github.com/DigitecGalaxus/next-yak/assets/4113649/2fa78f82-382c-465f-b294-2504739ea168)
 
 
 ### Targeting Components
@@ -178,7 +178,7 @@ module.exports = {
 };
 ```
 
-[Nesting Example (video)](https://github.com/jantimon/next-yak/assets/4113649/33eeeb13-b0cf-499f-a1d3-ba6f51cf4308)
+[Nesting Example (video)](https://github.com/DigitecGalaxus/next-yak/assets/4113649/33eeeb13-b0cf-499f-a1d3-ba6f51cf4308)
 
 ## Motivation
 
@@ -205,19 +205,19 @@ Optimizations are done by postcss. This allows to use the full power of postcss
 
 ## Performance Gains
 
-[![CSS Extract](https://raw.githubusercontent.com/jantimon/next-yak/main/css-extract.gif)](https://raw.githubusercontent.com/jantimon/next-yak/main/css-extract.gif)
+[![CSS Extract](https://raw.githubusercontent.com/DigitecGalaxus/next-yak/main/css-extract.gif)](https://raw.githubusercontent.com/DigitecGalaxus/next-yak/main/css-extract.gif)
 
 ## How it works
 
 next-yak converts css-in-js into css modules. This allows to use the full power of postcss and its plugins. It also allows to use the same optimizations for css files and css-in-js.
 
-[![Compile Flow](https://raw.githubusercontent.com/jantimon/next-yak/main/compile-flow.webp)](https://raw.githubusercontent.com/jantimon/next-yak/main/compile-flow.webp)
+[![Compile Flow](https://raw.githubusercontent.com/DigitecGalaxus/next-yak/main/compile-flow.webp)](https://raw.githubusercontent.com/DigitecGalaxus/next-yak/main/compile-flow.webp)
 
 
 ## Atomic CSS
 
 `next-yak` ships with atomic css support  
-So you can use [tailwind](https://tailwindcss.com/) out of the box without additonal configuration.
+So you can use [tailwind](https://tailwindcss.com/) out of the box without additional configuration.
 
 ```tsx
 import { styled, atoms } from "next-yak";
@@ -271,11 +271,11 @@ const Container = styled.div`
 | Yak Features     | All (`styled`, `css`, ...)                      | 🚫                                             | 
 
 
-[Build time constants (video)](https://github.com/jantimon/next-yak/assets/4113649/2c83246c-a03b-4c57-8814-32a7248983ac)
+[Build time constants (video)](https://github.com/DigitecGalaxus/next-yak/assets/4113649/2c83246c-a03b-4c57-8814-32a7248983ac)
 
 ## Yak shaving
 
-While trying to get next-yak to work properly we stumbled accross several bugs.  
+While trying to get next-yak to work properly we stumbled across several bugs.  
 Thanks for merging our prs fixes in next.js, webpack and postcss ❤️
 
 <details>

package/dist/context/baseContext.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../runtime/context/baseContext.tsx"],"sourcesContent":["export function getYakThemeContext() {\n  return {};\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAO,SAAS,qBAAqB;AACnC,SAAO,CAAC;AACV;","names":[]}
+{"version":3,"sources":["../../runtime/context/baseContext.tsx"],"sourcesContent":["import type { YakTheme } from \"./index.js\";\n\nexport function getYakThemeContext() {\n  return {} as YakTheme | undefined;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEO,SAAS,qBAAqB;AACnC,SAAO,CAAC;AACV;","names":[]}

package/dist/context/baseContext.d.cts

@@ -1,3 +1,6 @@
-declare function getYakThemeContext(): {};
+interface YakTheme {
+}
+
+declare function getYakThemeContext(): YakTheme | undefined;
 
 export { getYakThemeContext };

package/dist/context/baseContext.d.ts

@@ -1,3 +1,6 @@
-declare function getYakThemeContext(): {};
+interface YakTheme {
+}
+
+declare function getYakThemeContext(): YakTheme | undefined;
 
 export { getYakThemeContext };

package/dist/context/baseContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../runtime/context/baseContext.tsx"],"sourcesContent":["export function getYakThemeContext() {\n  return {};\n}\n"],"mappings":";AAAO,SAAS,qBAAqB;AACnC,SAAO,CAAC;AACV;","names":[]}
+{"version":3,"sources":["../../runtime/context/baseContext.tsx"],"sourcesContent":["import type { YakTheme } from \"./index.js\";\n\nexport function getYakThemeContext() {\n  return {} as YakTheme | undefined;\n}\n"],"mappings":";AAEO,SAAS,qBAAqB;AACnC,SAAO,CAAC;AACV;","names":[]}

package/dist/context/index.cjs

@@ -37,7 +37,10 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 var import_react = __toESM(require("react"), 1);
 var YakContext = (0, import_react.createContext)({});
-var useTheme = () => (0, import_react.useContext)(YakContext);
+var useTheme = () => {
+  const context = (0, import_react.use)(YakContext);
+  return context instanceof Promise ? (0, import_react.use)(context) : context;
+};
 var YakThemeProvider = ({
   children,
   theme = {}

package/dist/context/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../runtime/context/index.tsx"],"sourcesContent":["\"use client\";\n//\n// This file is the client component (browser & ssr) version of index.server.tsx\n//\nimport React, { ReactNode, createContext, useContext } from \"react\";\n\nexport interface YakTheme {}\n\n/**\n * The yak theme context\n * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nconst YakContext = createContext<YakTheme>({});\n\n/**\n * Returns the current yak theme context\n *\n * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nexport const useTheme = (): YakTheme => useContext(YakContext);\n\n/**\n * Yak theme context provider\n *\n * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nexport const YakThemeProvider = ({\n  children,\n  theme = {},\n}: {\n  children: ReactNode;\n  theme?: YakTheme;\n}) => <YakContext.Provider value={theme}>{children}</YakContext.Provider>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAA4D;AAQ5D,IAAM,iBAAa,4BAAwB,CAAC,CAAC;AAOtC,IAAM,WAAW,UAAgB,yBAAW,UAAU;AAOtD,IAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA,QAAQ,CAAC;AACX,MAGM,6BAAAA,QAAA,cAAC,WAAW,UAAX,EAAoB,OAAO,SAAQ,QAAS;","names":["React"]}
+{"version":3,"sources":["../../runtime/context/index.tsx"],"sourcesContent":["\"use client\";\n//\n// This file is the client component (browser & ssr) version of index.server.tsx\n//\nimport React, { ReactNode, createContext, use } from \"react\";\n\nexport interface YakTheme {}\n\n/**\n * The yak theme context\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nconst YakContext = createContext<YakTheme>({});\n\n/**\n * Returns the current yak theme context\n *\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nexport const useTheme = (): YakTheme => {\n  const context = use(YakContext);\n  return context instanceof Promise ? use(context) : context;\n};\n\n/**\n * Yak theme context provider\n *\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nexport const YakThemeProvider = ({\n  children,\n  theme = {},\n}: {\n  children: ReactNode;\n  theme?: YakTheme;\n}) => <YakContext.Provider value={theme}>{children}</YakContext.Provider>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAAqD;AAQrD,IAAM,iBAAa,4BAAwB,CAAC,CAAC;AAOtC,IAAM,WAAW,MAAgB;AACtC,QAAM,cAAU,kBAAI,UAAU;AAC9B,SAAO,mBAAmB,cAAU,kBAAI,OAAO,IAAI;AACrD;AAOO,IAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA,QAAQ,CAAC;AACX,MAGM,6BAAAA,QAAA,cAAC,WAAW,UAAX,EAAoB,OAAO,SAAQ,QAAS;","names":["React"]}

package/dist/context/index.d.cts

@@ -5,13 +5,13 @@ interface YakTheme {
 /**
  * Returns the current yak theme context
  *
- * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
+ * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 declare const useTheme: () => YakTheme;
 /**
  * Yak theme context provider
  *
- * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
+ * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 declare const YakThemeProvider: ({ children, theme, }: {
     children: ReactNode;

package/dist/context/index.d.ts

@@ -5,13 +5,13 @@ interface YakTheme {
 /**
  * Returns the current yak theme context
  *
- * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
+ * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 declare const useTheme: () => YakTheme;
 /**
  * Yak theme context provider
  *
- * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
+ * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 declare const YakThemeProvider: ({ children, theme, }: {
     children: ReactNode;

package/dist/context/index.js

@@ -1,9 +1,12 @@
 "use client";
 
 // runtime/context/index.tsx
-import React, { createContext, useContext } from "react";
+import React, { createContext, use } from "react";
 var YakContext = createContext({});
-var useTheme = () => useContext(YakContext);
+var useTheme = () => {
+  const context = use(YakContext);
+  return context instanceof Promise ? use(context) : context;
+};
 var YakThemeProvider = ({
   children,
   theme = {}

package/dist/context/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../runtime/context/index.tsx"],"sourcesContent":["\"use client\";\n//\n// This file is the client component (browser & ssr) version of index.server.tsx\n//\nimport React, { ReactNode, createContext, useContext } from \"react\";\n\nexport interface YakTheme {}\n\n/**\n * The yak theme context\n * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nconst YakContext = createContext<YakTheme>({});\n\n/**\n * Returns the current yak theme context\n *\n * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nexport const useTheme = (): YakTheme => useContext(YakContext);\n\n/**\n * Yak theme context provider\n *\n * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nexport const YakThemeProvider = ({\n  children,\n  theme = {},\n}: {\n  children: ReactNode;\n  theme?: YakTheme;\n}) => <YakContext.Provider value={theme}>{children}</YakContext.Provider>;\n"],"mappings":";;;AAIA,OAAO,SAAoB,eAAe,kBAAkB;AAQ5D,IAAM,aAAa,cAAwB,CAAC,CAAC;AAOtC,IAAM,WAAW,MAAgB,WAAW,UAAU;AAOtD,IAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA,QAAQ,CAAC;AACX,MAGM,oCAAC,WAAW,UAAX,EAAoB,OAAO,SAAQ,QAAS;","names":[]}
+{"version":3,"sources":["../../runtime/context/index.tsx"],"sourcesContent":["\"use client\";\n//\n// This file is the client component (browser & ssr) version of index.server.tsx\n//\nimport React, { ReactNode, createContext, use } from \"react\";\n\nexport interface YakTheme {}\n\n/**\n * The yak theme context\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nconst YakContext = createContext<YakTheme>({});\n\n/**\n * Returns the current yak theme context\n *\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nexport const useTheme = (): YakTheme => {\n  const context = use(YakContext);\n  return context instanceof Promise ? use(context) : context;\n};\n\n/**\n * Yak theme context provider\n *\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md\n */\nexport const YakThemeProvider = ({\n  children,\n  theme = {},\n}: {\n  children: ReactNode;\n  theme?: YakTheme;\n}) => <YakContext.Provider value={theme}>{children}</YakContext.Provider>;\n"],"mappings":";;;AAIA,OAAO,SAAoB,eAAe,WAAW;AAQrD,IAAM,aAAa,cAAwB,CAAC,CAAC;AAOtC,IAAM,WAAW,MAAgB;AACtC,QAAM,UAAU,IAAI,UAAU;AAC9B,SAAO,mBAAmB,UAAU,IAAI,OAAO,IAAI;AACrD;AAOO,IAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA,QAAQ,CAAC;AACX,MAGM,oCAAC,WAAW,UAAX,EAAoB,OAAO,SAAQ,QAAS;","names":[]}

package/dist/context/index.server.cjs

@@ -37,9 +37,13 @@ module.exports = __toCommonJS(index_server_exports);
 var import_react = __toESM(require("react"), 1);
 var import_index = require("./index.js");
 var import_baseContext = require("next-yak/context/baseContext");
-var useTheme = (0, import_react.cache)(() => (0, import_baseContext.getYakThemeContext)());
+var getYakContext = (0, import_react.cache)(() => (0, import_baseContext.getYakThemeContext)());
+var useTheme = () => {
+  const theme = getYakContext();
+  return theme instanceof Promise ? (0, import_react.use)(theme) : theme;
+};
 var YakThemeProvider = ({ children }) => {
-  return /* @__PURE__ */ import_react.default.createElement(import_index.YakThemeProvider, { theme: useTheme() }, children);
+  return /* @__PURE__ */ import_react.default.createElement(import_index.YakThemeProvider, { theme: getYakContext() }, children);
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/context/index.server.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../runtime/context/index.server.tsx"],"sourcesContent":["//\n// This file is the react-server component version of index.tsx\n//\n\n// @ts-ignore - in the current @types/react \"cache\" is not typed\nimport React, { ReactNode, cache } from \"react\";\nimport { YakThemeProvider as YakThemeClientProvider } from \"./index.js\";\n\n// the following import might be changed by\n// the user config in withYak to point to their own\n// context\nimport { getYakThemeContext } from \"next-yak/context/baseContext\";\n\nexport const useTheme = cache(() => getYakThemeContext());\nexport const YakThemeProvider = ({ children }: { children: ReactNode }) => {\n  return (\n    <YakThemeClientProvider theme={useTheme()}>\n      {children}\n    </YakThemeClientProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA,mBAAwC;AACxC,mBAA2D;AAK3D,yBAAmC;AAE5B,IAAM,eAAW,oBAAM,UAAM,uCAAmB,CAAC;AACjD,IAAM,mBAAmB,CAAC,EAAE,SAAS,MAA+B;AACzE,SACE,6BAAAA,QAAA,cAAC,aAAAC,kBAAA,EAAuB,OAAO,SAAS,KACrC,QACH;AAEJ;","names":["React","YakThemeClientProvider"]}
+{"version":3,"sources":["../../runtime/context/index.server.tsx"],"sourcesContent":["//\n// This file is the react-server component version of index.tsx\n//\n\n// @ts-ignore - in the current @types/react \"cache\" is not typed\nimport React, { ReactNode, cache, use } from \"react\";\nimport {\n  YakTheme,\n  YakThemeProvider as YakThemeClientProvider,\n} from \"./index.js\";\n\n// the following import might be changed by\n// the user config in withYak to point to their own\n// context\nimport { getYakThemeContext } from \"next-yak/context/baseContext\";\n\n/** Request based RSC YAK Context */\nconst getYakContext = cache(() => getYakThemeContext());\nexport const useTheme = (): YakTheme | undefined => {\n  const theme: YakTheme | undefined | Promise<YakTheme> = getYakContext();\n  return theme instanceof Promise ? use(theme) : theme;\n};\nexport const YakThemeProvider = ({ children }: { children: ReactNode }) => {\n  return (\n    <YakThemeClientProvider theme={getYakContext()}>\n      {children}\n    </YakThemeClientProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA,mBAA6C;AAC7C,mBAGO;AAKP,yBAAmC;AAGnC,IAAM,oBAAgB,oBAAM,UAAM,uCAAmB,CAAC;AAC/C,IAAM,WAAW,MAA4B;AAClD,QAAM,QAAkD,cAAc;AACtE,SAAO,iBAAiB,cAAU,kBAAI,KAAK,IAAI;AACjD;AACO,IAAM,mBAAmB,CAAC,EAAE,SAAS,MAA+B;AACzE,SACE,6BAAAA,QAAA,cAAC,aAAAC,kBAAA,EAAuB,OAAO,cAAc,KAC1C,QACH;AAEJ;","names":["React","YakThemeClientProvider"]}

package/dist/context/index.server.js

@@ -1,10 +1,16 @@
 // runtime/context/index.server.tsx
-import React, { cache } from "react";
-import { YakThemeProvider as YakThemeClientProvider } from "./index.js";
+import React, { cache, use } from "react";
+import {
+  YakThemeProvider as YakThemeClientProvider
+} from "./index.js";
 import { getYakThemeContext } from "next-yak/context/baseContext";
-var useTheme = cache(() => getYakThemeContext());
+var getYakContext = cache(() => getYakThemeContext());
+var useTheme = () => {
+  const theme = getYakContext();
+  return theme instanceof Promise ? use(theme) : theme;
+};
 var YakThemeProvider = ({ children }) => {
-  return /* @__PURE__ */ React.createElement(YakThemeClientProvider, { theme: useTheme() }, children);
+  return /* @__PURE__ */ React.createElement(YakThemeClientProvider, { theme: getYakContext() }, children);
 };
 export {
   YakThemeProvider,

package/dist/context/index.server.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../runtime/context/index.server.tsx"],"sourcesContent":["//\n// This file is the react-server component version of index.tsx\n//\n\n// @ts-ignore - in the current @types/react \"cache\" is not typed\nimport React, { ReactNode, cache } from \"react\";\nimport { YakThemeProvider as YakThemeClientProvider } from \"./index.js\";\n\n// the following import might be changed by\n// the user config in withYak to point to their own\n// context\nimport { getYakThemeContext } from \"next-yak/context/baseContext\";\n\nexport const useTheme = cache(() => getYakThemeContext());\nexport const YakThemeProvider = ({ children }: { children: ReactNode }) => {\n  return (\n    <YakThemeClientProvider theme={useTheme()}>\n      {children}\n    </YakThemeClientProvider>\n  );\n};\n"],"mappings":";AAKA,OAAO,SAAoB,aAAa;AACxC,SAAS,oBAAoB,8BAA8B;AAK3D,SAAS,0BAA0B;AAE5B,IAAM,WAAW,MAAM,MAAM,mBAAmB,CAAC;AACjD,IAAM,mBAAmB,CAAC,EAAE,SAAS,MAA+B;AACzE,SACE,oCAAC,0BAAuB,OAAO,SAAS,KACrC,QACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../runtime/context/index.server.tsx"],"sourcesContent":["//\n// This file is the react-server component version of index.tsx\n//\n\n// @ts-ignore - in the current @types/react \"cache\" is not typed\nimport React, { ReactNode, cache, use } from \"react\";\nimport {\n  YakTheme,\n  YakThemeProvider as YakThemeClientProvider,\n} from \"./index.js\";\n\n// the following import might be changed by\n// the user config in withYak to point to their own\n// context\nimport { getYakThemeContext } from \"next-yak/context/baseContext\";\n\n/** Request based RSC YAK Context */\nconst getYakContext = cache(() => getYakThemeContext());\nexport const useTheme = (): YakTheme | undefined => {\n  const theme: YakTheme | undefined | Promise<YakTheme> = getYakContext();\n  return theme instanceof Promise ? use(theme) : theme;\n};\nexport const YakThemeProvider = ({ children }: { children: ReactNode }) => {\n  return (\n    <YakThemeClientProvider theme={getYakContext()}>\n      {children}\n    </YakThemeClientProvider>\n  );\n};\n"],"mappings":";AAKA,OAAO,SAAoB,OAAO,WAAW;AAC7C;AAAA,EAEE,oBAAoB;AAAA,OACf;AAKP,SAAS,0BAA0B;AAGnC,IAAM,gBAAgB,MAAM,MAAM,mBAAmB,CAAC;AAC/C,IAAM,WAAW,MAA4B;AAClD,QAAM,QAAkD,cAAc;AACtE,SAAO,iBAAiB,UAAU,IAAI,KAAK,IAAI;AACjD;AACO,IAAM,mBAAmB,CAAC,EAAE,SAAS,MAA+B;AACzE,SACE,oCAAC,0BAAuB,OAAO,cAAc,KAC1C,QACH;AAEJ;","names":[]}

package/dist/index.cjs

@@ -1,5 +1,5 @@
 "use strict";var E=Object.create;var u=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,M=Object.prototype.hasOwnProperty;var H=(t,e)=>{for(var s in e)u(t,s,{get:e[s],enumerable:!0})},R=(t,e,s,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of D(e))!M.call(t,n)&&n!==s&&u(t,n,{get:()=>e[n],enumerable:!(r=$(e,n))||r.enumerable});return t};var J=(t,e,s)=>(s=t!=null?E(L(t)):{},R(e||!t||!t.__esModule?u(s,"default",{value:t,enumerable:!0}):s,t)),W=t=>R(u({},"__esModule",{value:!0}),t);var U={};H(U,{YakThemeProvider:()=>S.YakThemeProvider,atoms:()=>N,css:()=>I,keyframes:()=>b,styled:()=>_,useTheme:()=>S.useTheme});module.exports=W(U);var S=require("next-yak/context");var p=Symbol("yak");function f(...t){let e,s=[];for(let r of t)typeof r=="string"?e=r:typeof r=="function"?s.push(r):typeof r=="object"&&"style"in r&&s.push((n,o,i)=>{for(let a in r.style){let l=r.style[a];typeof l=="function"?i[a]=String(h(n,l)):i[a]=String(l)}});return s.length===0?(r,n)=>(e&&n.add(e),()=>{}):(r,n,o)=>{e&&n.add(e);for(let i=0;i<s.length;i++)B(r,s[i],n,o)}}var B=(t,e,s,r)=>{let n=e(t,s,r);for(;n;){if(typeof n=="function"){n=n(t,s,r);continue}else if(typeof n=="object"&&("className"in n&&n.className&&s.add(n.className),"style"in n&&n.style))for(let o in n.style)r[o]=n.style[o];break}},h=(t,e)=>{let s=e(t);if(typeof s=="function")return h(t,s);if(process.env.NODE_ENV==="development"&&typeof s!="string"&&typeof s!="number"&&!(s instanceof String))throw new Error(`Dynamic CSS functions must return a string or number but returned ${JSON.stringify(s)}
 
 Dynamic CSS function: ${e.toString()}
-`);return s};var N=(...t)=>{let e=[],s=[];for(let n of t)typeof n=="string"?e.push(...n.split(" ")):typeof n=="function"&&s.push(n);let r=e.length>0?[(n,o)=>{e.forEach(i=>o.add(i))},...s]:s;return f(...r)};var I=(t,...e)=>{let s=[];for(let r of e)typeof r=="function"&&s.push(r);return s.length===0?{className:"",style:void 0}:r=>{for(let n=0;n<s.length;n++)G(r,s[n]);return{className:"",style:void 0}}};function G(t,e){let s=new Set,r={},n=e(t,s,r);for(;typeof n=="function";)n=n(t,s,r);return n}var b=(t,...e)=>"";var w=J(require("react"),1),Y=require("next-yak/context"),V={},X=t=>Object.assign(F(t),{attrs:e=>F(t,e)}),O=X,F=(t,e)=>{let s=typeof t!="string"&&p in t,[r,n,o]=s?t[p]:[],i=K(e,n);return(a,...l)=>{let T=f(a,...l),g=Q(T,o),P=y=>{let m=i||T.length?(0,Y.useTheme)():V,c="$__attrs"in y?{theme:m,...y}:d({theme:m,...y,$__attrs:!0},i?.({theme:m,...y})),k=new Set("className"in c?c.className?.split(" "):[]),C={..."style"in c?c.style:{}};"$__runtimeStylesProcessed"in c||(g(c,k,C),c.$__runtimeStylesProcessed=!0),c.className=Array.from(k).join(" ")||void 0,c.style=C;let{theme:j,...v}=c,x=j===m?v:c,A=s?x:q(x);return r?r(A):w.default.createElement(t,{...A})};return Object.assign(P,{[p]:[P,i,g]})}},q=t=>{let e={};for(let s in t)!s.startsWith("$")&&t[s]!==void 0&&(e[s]=t[s]);return e},z=(t,e)=>{if(!(!t&&!e))return t?e?t+" "+e:t:e},d=(t,e)=>e?(t.className===e.className||!e.className)&&(t.style===e.style||!e.style)?{...t,...e}:{...t,...e,className:z(t.className,e.className),style:{...t.style||{},...e.style||{}}}:t,K=(t,e)=>{let s=t&&(typeof t=="function"?t:()=>t);return s&&e?r=>{let n=e(r);return d(n,s(d(r,n)))}:s||e},Q=(t,e)=>t&&e?(r,n,o)=>{e(r,n,o),t(r,n,o)}:t||e;var _=new Proxy(O,{get(t,e){return t(e)}});0&&(module.exports={YakThemeProvider,atoms,css,keyframes,styled,useTheme});
+`);return s};var N=(...t)=>{let e=[],s=[];for(let n of t)typeof n=="string"?e.push(...n.split(" ")):typeof n=="function"&&s.push(n);let r=e.length>0?[(n,o)=>{e.forEach(i=>o.add(i))},...s]:s;return f(...r)};var I=(t,...e)=>{let s=[];for(let r of e)typeof r=="function"&&s.push(r);return s.length===0?{className:"",style:void 0}:(r=>{for(let n=0;n<s.length;n++)G(r,s[n]);return{className:"",style:void 0}})};function G(t,e){let s=new Set,r={},n=e(t,s,r);for(;typeof n=="function";)n=n(t,s,r);return n}var b=(t,...e)=>"";var w=J(require("react"),1),Y=require("next-yak/context"),V={},X=t=>Object.assign(F(t),{attrs:e=>F(t,e)}),O=X,F=(t,e)=>{let s=typeof t!="string"&&p in t,[r,n,o]=s?t[p]:[],i=K(e,n);return(a,...l)=>{let T=f(a,...l),g=Q(T,o),P=y=>{let m=i||T.length?(0,Y.useTheme)():V,c="$__attrs"in y?{theme:m,...y}:d({theme:m,...y,$__attrs:!0},i?.({theme:m,...y})),k=new Set("className"in c?c.className?.split(" "):[]),C={..."style"in c?c.style:{}};"$__runtimeStylesProcessed"in c||(g(c,k,C),c.$__runtimeStylesProcessed=!0),c.className=Array.from(k).join(" ")||void 0,c.style=C;let{theme:j,...v}=c,x=j===m?v:c,A=s?x:q(x);return r?r(A):w.default.createElement(t,{...A})};return Object.assign(P,{[p]:[P,i,g]})}},q=t=>{let e={};for(let s in t)!s.startsWith("$")&&t[s]!==void 0&&(e[s]=t[s]);return e},z=(t,e)=>{if(!(!t&&!e))return t?e?t+" "+e:t:e},d=(t,e)=>e?(t.className===e.className||!e.className)&&(t.style===e.style||!e.style)?{...t,...e}:{...t,...e,className:z(t.className,e.className),style:{...t.style||{},...e.style||{}}}:t,K=(t,e)=>{let s=t&&(typeof t=="function"?t:()=>t);return s&&e?r=>{let n=e(r);return d(n,s(d(r,n)))}:s||e},Q=(t,e)=>t&&e?(r,n,o)=>{e(r,n,o),t(r,n,o)}:t||e;var _=new Proxy(O,{get(t,e){return t(e)}});0&&(module.exports={YakThemeProvider,atoms,css,keyframes,styled,useTheme});
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../runtime/index.ts","../runtime/cssLiteral.tsx","../runtime/atoms.tsx","../runtime/mocks/cssLiteral.ts","../runtime/mocks/keyframes.ts","../runtime/styled.tsx","../runtime/mocks/styled.ts"],"sourcesContent":["/**\n * This file contains the typings for the public API for next-yak and testing mocks\n *\n * IMPORTANT: In production builds, imports to this file should be replaced by the Babel plugin.\n * If you're seeing this code in a production environment, your build process may not be configured correctly.\n *\n * Purpose:\n * 1. Provide a test-friendly version of the next-yak API\n * 2. Offer type definitions for the public API\n *\n * Usage in tests:\n * - Import from \"next-yak\" as usual in your test files\n * - These mock implementations will be used instead of the actual runtime\n *\n * Warning for production:\n * - If these exports are used in a production build, styles will not be applied correctly\n * - Ensure your build process is configured to use the next-yak Babel plugin\n *\n * For maintainers:\n * - Keep this API surface in sync with the actual implementation in next-yak/internal\n * - Ensure mock implementations here are suitable for testing purposes\n */\n\n// the following export is not relative as \"next-yak/context\"\n// links to one file for react server components and\n// to another file for classic react components\nexport { useTheme, YakThemeProvider } from \"next-yak/context\";\nexport type { YakTheme } from \"./context/index.d.ts\";\n\nexport type { GenericYakComponentOf } from \"./publicStyledApi.ts\";\n\nexport { atoms } from \"./atoms.js\";\nexport { css } from \"./mocks/cssLiteral.js\";\nexport { keyframes } from \"./mocks/keyframes.js\";\nexport { styled } from \"./mocks/styled.js\";\n","import type { YakTheme } from \"./index.d.ts\";\nimport { RuntimeStyleProcessor } from \"./publicStyledApi.js\";\n\nexport const yakComponentSymbol = Symbol(\"yak\");\n\nexport type ComponentStyles<TProps> = (props: TProps) => {\n  className: string;\n  style?: {\n    [key: string]: string;\n  };\n};\n\nexport type CSSInterpolation<TProps> =\n  | string\n  | number\n  | undefined\n  | null\n  | false\n  | ComponentStyles<TProps>\n  | {\n      // type only identifier to allow targeting components\n      // e.g. styled.svg`${Button}:hover & { fill: red; }`\n      [yakComponentSymbol]: any;\n    }\n  | ((props: TProps) => CSSInterpolation<TProps>);\n\ntype CSSStyles<TProps = {}> = {\n  style: { [key: string]: string | ((props: TProps) => string) };\n};\n\ntype CSSFunction = <TProps = {}>(\n  styles: TemplateStringsArray,\n  ...values: CSSInterpolation<TProps & { theme: YakTheme }>[]\n) => ComponentStyles<TProps>;\n\nexport type NestedRuntimeStyleProcessor = (\n  props: unknown,\n  classNames: Set<string>,\n  style: React.CSSProperties,\n) =>\n  | {\n      className?: string;\n      style?: React.CSSProperties;\n    }\n  | void\n  | NestedRuntimeStyleProcessor;\n\n/**\n * css() runtime factory of css``\n *\n * /!\\ next-yak transpiles css`` and styled``\n *\n * This changes the typings of the css`` and styled`` functions.\n * During development the user of next-yak wants to work with the\n * typings BEFORE compilation.\n *\n * Therefore this is only an internal function only and it must be cast to any\n * before exported to the user.\n *\n * The internal functioning of css`` is to return a single callback function that runs all functions\n * (or creates new ones if needed) that are passed as arguments. These functions receive the props, classNames, and style object as arguments\n * and operate directly on the classNames and style objects.\n */\nexport function css<TProps>(\n  styles: TemplateStringsArray,\n  ...values: CSSInterpolation<NoInfer<TProps> & { theme: YakTheme }>[]\n): ComponentStyles<TProps>;\nexport function css<TProps>(\n  ...args: Array<any>\n): RuntimeStyleProcessor<TProps> {\n  // Normally this  could be an array of strings passed, but as we transpile the usage of css`` ourselves, we control the arguments\n  // and ensure that only the first argument is a string (class name of the non-dynamic styles)\n  let className: string | undefined;\n  const dynamicCssFunctions: NestedRuntimeStyleProcessor[] = [];\n  for (const arg of args as Array<string | CSSFunction | CSSStyles<any>>) {\n    // A CSS-module class name which got auto generated during build from static css\n    // e.g. css`color: red;`\n    // compiled -> css(\"yak31e4\")\n    if (typeof arg === \"string\") {\n      className = arg;\n    }\n    // Dynamic CSS e.g.\n    // css`${props => props.active && css`color: red;`}`\n    // compiled -> css((props: { active: boolean }) => props.active && css(\"yak31e4\"))\n    else if (typeof arg === \"function\") {\n      dynamicCssFunctions.push(arg as unknown as NestedRuntimeStyleProcessor);\n    }\n    // Dynamic CSS with css variables e.g.\n    // css`transform: translate(${props => props.x}, ${props => props.y});`\n    // compiled -> css(\"yak31e4\", { style: { \"--yakVarX\": props => props.x }, \"--yakVarY\": props => props.y }})\n    else if (typeof arg === \"object\" && \"style\" in arg) {\n      dynamicCssFunctions.push((props, _, style) => {\n        for (const key in arg.style) {\n          const value = arg.style[key];\n          if (typeof value === \"function\") {\n            // @ts-expect-error CSSProperties don't allow css variables\n            style[key] = String(\n              // The value for a css value can be a theme dependent function e.g.:\n              // const borderColor = (props: { theme: { mode: \"dark\" | \"light\" } }) => props.theme === \"dark\" ? \"black\" : \"white\";\n              // css`border-color: ${borderColor};`\n              // Therefore the value has to be extracted recursively\n              recursivePropExecution(props, value),\n            );\n          } else {\n            // @ts-expect-error CSSProperties don't allow css variables\n            style[key] = String(value);\n          }\n        }\n      });\n    }\n  }\n\n  // Non Dynamic CSS\n  // This is just an optimization for the common case where there are no dynamic css functions\n  if (dynamicCssFunctions.length === 0) {\n    return (_, classNames) => {\n      if (className) {\n        classNames.add(className);\n      }\n      return () => {};\n    };\n  }\n\n  return (props, classNames, allStyles) => {\n    if (className) {\n      classNames.add(className);\n    }\n    for (let i = 0; i < dynamicCssFunctions.length; i++) {\n      unwrapProps(props, dynamicCssFunctions[i], classNames, allStyles);\n    }\n  };\n}\n\n// Dynamic CSS with runtime logic\nconst unwrapProps = (\n  props: unknown,\n  fn: NestedRuntimeStyleProcessor,\n  classNames: Set<string>,\n  style: React.CSSProperties,\n) => {\n  let result = fn(props, classNames, style);\n  while (result) {\n    if (typeof result === \"function\") {\n      result = result(props, classNames, style);\n      continue;\n    } else if (typeof result === \"object\") {\n      if (\"className\" in result && result.className) {\n        classNames.add(result.className);\n      }\n      if (\"style\" in result && result.style) {\n        for (const key in result.style) {\n          // This is hard for typescript to infer\n          style[key as keyof React.CSSProperties] = result.style[\n            key as keyof React.CSSProperties\n          ] as any;\n        }\n      }\n    }\n    break;\n  }\n};\n\nconst recursivePropExecution = (\n  props: unknown,\n  fn: (props: unknown) => any,\n): string | number => {\n  const result = fn(props);\n  if (typeof result === \"function\") {\n    return recursivePropExecution(props, result);\n  }\n  if (process.env.NODE_ENV === \"development\") {\n    if (\n      typeof result !== \"string\" &&\n      typeof result !== \"number\" &&\n      !(result instanceof String)\n    ) {\n      throw new Error(\n        `Dynamic CSS functions must return a string or number but returned ${JSON.stringify(\n          result,\n        )}\\n\\nDynamic CSS function: ${fn.toString()}\\n`,\n      );\n    }\n  }\n  return result;\n};\n","import { ComponentStyles, css } from \"./cssLiteral.js\";\nimport { RuntimeStyleProcessor as RuntimeStyleProcessor } from \"./publicStyledApi.js\";\n\n/**\n * Allows to use atomic CSS classes in a styled or css block\n *\n * @usage\n *\n * ```tsx\n * import { styled, atoms } from \"next-yak\";\n *\n * const Button = styled.button<{ $primary?: boolean }>`\n *  ${atoms(\"text-teal-600\", \"text-base\", \"rounded-md\")}\n *  ${props => props.$primary && atoms(\"shadow-md\")}\n * `;\n * ```\n */\nexport const atoms = <T,>(\n  ...atoms: (string | RuntimeStyleProcessor<T> | false)[]\n): ComponentStyles<T> => {\n  const staticClasses: string[] = [];\n  const dynamicFunctions: RuntimeStyleProcessor<T>[] = [];\n\n  for (const atom of atoms) {\n    if (typeof atom === \"string\") {\n      staticClasses.push(...atom.split(\" \"));\n    } else if (typeof atom === \"function\") {\n      dynamicFunctions.push(atom);\n    }\n  }\n\n  const runtimeFunctions: RuntimeStyleProcessor<T>[] =\n    staticClasses.length > 0\n      ? [\n          (_, classNames) => {\n            staticClasses.forEach((cls) => classNames.add(cls));\n          },\n          ...dynamicFunctions,\n        ]\n      : dynamicFunctions;\n\n  // @ts-expect-error the internal implementation of css is not typed\n  return css(...runtimeFunctions);\n};\n","import type {\n  css as cssInternal,\n  NestedRuntimeStyleProcessor,\n} from \"../cssLiteral.js\";\n\nexport type { ComponentStyles, CSSInterpolation } from \"../cssLiteral.js\";\n\n/**\n * Allows to use CSS styles in a styled or css block\n *\n * e.g.\n *\n * ```tsx\n * const Component = styled.div`\n *  color: black;\n *  ${({$active}) => $active && css`color: red;`}\n * `;\n * ```\n */\nexport const css: typeof cssInternal = (\n  styles: TemplateStringsArray,\n  ...args: unknown[]\n) => {\n  const dynamicCssFunctions: NestedRuntimeStyleProcessor[] = [];\n  for (const arg of args as Array<string | Function | object>) {\n    // Dynamic CSS e.g.\n    // css`${props => props.active && css`color: red;`}`\n    // compiled -> css((props: { active: boolean }) => props.active && css(\"yak31e4\"))\n    if (typeof arg === \"function\") {\n      dynamicCssFunctions.push(arg as unknown as NestedRuntimeStyleProcessor);\n    }\n  }\n  if (dynamicCssFunctions.length === 0) {\n    return {\n      className: \"\",\n      style: undefined,\n    };\n  }\n  return ((props: unknown) => {\n    for (let i = 0; i < dynamicCssFunctions.length; i++) {\n      // run the dynamic expressions and ignore the return value\n      // the execution is important to ensure that the user code is executed\n      // the same way as in the real runtime\n      executeDynamicExpressionRecursively(props, dynamicCssFunctions[i]);\n    }\n    return {\n      className: \"\",\n      style: undefined,\n    };\n  }) as any;\n};\n\nfunction executeDynamicExpressionRecursively(\n  props: unknown,\n  expression: NestedRuntimeStyleProcessor,\n) {\n  const classNames = new Set<string>();\n  const style = {};\n  let result = expression(props, classNames, style);\n  while (typeof result === \"function\") {\n    result = result(props, classNames, style);\n  }\n  return result;\n}\n","import type { keyframes as keyframesInternal } from \"../keyframes.js\";\n\n/**\n * Allows to use CSS keyframe animations in a styled or css block\n *\n * @usage\n *\n * ```tsx\n * import { styled, keyframes } from \"next-yak\";\n *\n * const rotate = keyframes`\n *  from {\n *   transform: rotate(0deg);\n *  }\n *  to {\n *   transform: rotate(360deg);\n *  }\n * `;\n *\n * const Spinner = styled.div`\n *   animation: ${rotate} 1s linear infinite;\n * `;\n * ```\n */\nexport const keyframes: typeof keyframesInternal = (styles, ...dynamic) => {\n  // the keyframes function is a no-op in the mock\n  // as it has no dynamic runtime behavior but only css\n  return \"\";\n};\n","import { css, CSSInterpolation, yakComponentSymbol } from \"./cssLiteral.js\";\nimport React from \"react\";\nimport type {\n  Attrs,\n  AttrsMerged,\n  Styled,\n  YakComponent,\n  AttrsFunction,\n  StyledFn,\n  HtmlTags,\n  Substitute,\n  StyledLiteral,\n  RuntimeStyleProcessor,\n} from \"./publicStyledApi.js\";\n\n// the following export is not relative as \"next-yak/context\"\n// links to one file for react server components and\n// to another file for classic react components\nimport { useTheme } from \"next-yak/context\";\nimport type { YakTheme } from \"./context/index.d.ts\";\n\n/**\n * This Symbol is a fake theme which was used instead of the real one from the context\n * to speed up rendering\n */\nconst noTheme: YakTheme = {};\n\n//\n// The `styled()` API without `styled.` syntax\n//\n// The API design is inspired by styled-components:\n// https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/constructors/styled.tsx\n// https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/models/StyledComponent.ts\n//\nconst styledFactory: StyledFn = (Component) =>\n  Object.assign(yakStyled(Component), {\n    attrs: (attrs: Attrs<any>) => yakStyled(Component, attrs),\n  });\n\n/**\n * The `styled` method works perfectly on all of your own or any third-party component,\n * as long as they attach the passed className prop to a DOM element.\n *\n * @usage\n *\n * ```tsx\n * const StyledLink = styled(Link)`\n *  color: #BF4F74;\n *  font-weight: bold;\n * `;\n * ```\n */\nexport const styled = styledFactory as Styled;\n\nconst yakStyled: StyledInternal = (Component, attrs) => {\n  const isYakComponent =\n    typeof Component !== \"string\" && yakComponentSymbol in Component;\n\n  // if the component that is wrapped is a yak component, we can extract it to render the underlying component directly\n  // and we can also extract the attrs function and the dynamic style function to merge it with the current attrs function (or dynamic style function)\n  // so that the sequence of the attrs functions is preserved\n  const [parentYakComponent, parentAttrsFn, parentRuntimeStylesFn] =\n    isYakComponent\n      ? (Component[yakComponentSymbol] as [\n          YakComponent<unknown>,\n          ExtractAttrsFunction<typeof attrs>,\n          RuntimeStyleProcessor<unknown>,\n        ])\n      : [];\n\n  const mergedAttrsFn = buildRuntimeAttrsProcessor(attrs, parentAttrsFn);\n\n  return (styles, ...values) => {\n    // combine all interpolated logic into a single function\n    // e.g. styled.button`color: ${props => props.color}; margin: ${props => props.margin};`\n    const runtimeStylesFn = css(\n      styles,\n      ...(values as CSSInterpolation<unknown>[]),\n    ) as RuntimeStyleProcessor<unknown>;\n    const runtimeStyleProcessor = buildRuntimeStylesProcessor(\n      runtimeStylesFn,\n      parentRuntimeStylesFn,\n    );\n    const yak: React.FunctionComponent = (props) => {\n      // if the css component does not require arguments\n      // it can be called without arguments and we skip calling useTheme()\n      //\n      // `attrsFn || getRuntimeStyles.length` is NOT against the rule of hooks as\n      // getRuntimeStyles and attrsFn are constants defined outside of the component\n      //\n      // for example\n      //\n      // const Button = styled.button`color: red;`\n      //       ^ does not need to have access to theme, so we skip calling useTheme()\n      //\n      // const Button = styled.button`${({ theme }) => css`color: ${theme.color};`}`\n      //       ^ must be have access to theme, so we call useTheme()\n      const theme =\n        mergedAttrsFn || runtimeStylesFn.length ? useTheme() : noTheme;\n\n      // The first components which is not wrapped in a yak component will execute all attrs functions\n      // starting from the innermost yak component to the outermost yak component (itself)\n      const combinedProps =\n        \"$__attrs\" in props\n          ? ({\n              theme,\n              ...props,\n            } as {\n              theme: YakTheme;\n              className?: string;\n              style?: React.CSSProperties;\n            })\n          : // overwrite and merge the current props with the processed attrs\n            combineProps(\n              {\n                theme,\n                ...(props as {\n                  className?: string;\n                  style?: React.CSSProperties;\n                }),\n                // mark the props as processed\n                $__attrs: true,\n              },\n              mergedAttrsFn?.({ theme, ...(props as any) }),\n            );\n\n      const classNames = new Set<string>(\n        \"className\" in combinedProps ? combinedProps.className?.split(\" \") : [],\n      );\n      const styles = {\n        ...(\"style\" in combinedProps ? combinedProps.style : {}),\n      };\n\n      // execute all functions inside the style literal if not already executed\n      // e.g. styled.button`color: ${props => props.color};`\n      if (!(\"$__runtimeStylesProcessed\" in combinedProps)) {\n        runtimeStyleProcessor(combinedProps, classNames, styles);\n        // @ts-expect-error this is not typed correctly\n        combinedProps.$__runtimeStylesProcessed = true;\n      }\n\n      combinedProps.className = Array.from(classNames).join(\" \") || undefined;\n      combinedProps.style = styles;\n\n      // delete the yak theme from the props\n      // this must happen after the runtimeStyles are calculated\n      // prevents passing the theme prop to the DOM element of a styled component\n      const { theme: themeAfterAttr, ...combinedPropsWithoutTheme } =\n        combinedProps;\n      const propsBeforeFiltering =\n        themeAfterAttr === theme ? combinedPropsWithoutTheme : combinedProps;\n\n      // remove all props that start with a $ sign for string components e.g. \"button\" or \"div\"\n      // so that they are not passed to the DOM element\n      const filteredProps = !isYakComponent\n        ? removeNonDomProperties(propsBeforeFiltering)\n        : propsBeforeFiltering;\n\n      return parentYakComponent ? (\n        // if the styled(Component) syntax is used and the component is a yak component\n        // we can call the yak function directly without running through react createElement\n        parentYakComponent(filteredProps)\n      ) : (\n        // if the final component is a string component e.g. styled(\"div\") or a custom non yak fn e.g. styled(MyComponent)\n        <Component\n          {...(filteredProps as React.ComponentProps<\n            Exclude<typeof Component, string>\n          >)}\n        />\n      );\n    };\n\n    // Assign the yakComponentSymbol directly without forwardRef\n    return Object.assign(yak, {\n      [yakComponentSymbol]: [yak, mergedAttrsFn, runtimeStyleProcessor] as [\n        unknown,\n        unknown,\n        unknown,\n      ],\n    });\n  };\n};\n\n/**\n * Remove all entries that start with a $ sign\n *\n * This allows to have props that are used for internal stylingen purposes\n * but are not be passed to the DOM element\n */\nconst removeNonDomProperties = <T extends Record<string, unknown>>(\n  obj: T,\n): T => {\n  const result = {} as T;\n  for (const key in obj) {\n    if (!key.startsWith(\"$\") && obj[key] !== undefined) {\n      result[key] = obj[key];\n    }\n  }\n  return result;\n};\n\n// util function to merge class names, as they are concatenated with a space\nconst mergeClassNames = (a?: string, b?: string) => {\n  if (!a && !b) return undefined;\n  if (!a) return b;\n  if (!b) return a;\n  return a + \" \" + b;\n};\n\n/**\n * merge props and processed props (including class names and styles)\n * e.g.:\\\n * `{ className: \"a\", foo: 1 }` and `{ className: \"b\", bar: 2 }` \\\n * => `{ className: \"a b\", foo: 1, bar: 2 }`\n */\nconst combineProps = <\n  T extends {\n    className?: string;\n    style?: React.CSSProperties;\n  },\n  TOther extends\n    | {\n        className?: string;\n        style?: React.CSSProperties;\n      }\n    | null\n    | undefined,\n>(\n  props: T,\n  newProps: TOther,\n) =>\n  newProps\n    ? (props.className === newProps.className || !newProps.className) &&\n      (props.style === newProps.style || !newProps.style)\n      ? // shortcut if no style and class merging is necessary\n        {\n          ...props,\n          ...newProps,\n        }\n      : // merge class names and styles\n        {\n          ...props,\n          ...newProps,\n          className: mergeClassNames(props.className, newProps.className),\n          style: { ...(props.style || {}), ...(newProps.style || {}) },\n        }\n    : // if no new props are provided, no merging is necessary\n      props;\n\n/**\n * Merges the attrs function of the current component with the attrs function of the parent component\n * in order to preserve the sequence of the attrs functions.\n * Note: In theory, the parentAttrsFn can have different types for TAttrsIn and TAttrsOut\n * but as this is only used internally, we can ignore and simplify this case\n * @param attrs The attrs object or function of the current component (if any)\n * @param parentAttrsFn The attrs function of the parent/wrapped component (if any)\n * @returns A function that receives the props and returns the transformed props\n */\nconst buildRuntimeAttrsProcessor = <\n  T,\n  TAttrsIn extends object,\n  TAttrsOut extends AttrsMerged<T, TAttrsIn>,\n>(\n  attrs?: Attrs<T, TAttrsIn, TAttrsOut>,\n  parentAttrsFn?: AttrsFunction<T, TAttrsIn, TAttrsOut>,\n): AttrsFunction<T, TAttrsIn, TAttrsOut> | undefined => {\n  const ownAttrsFn =\n    attrs && (typeof attrs === \"function\" ? attrs : () => attrs);\n\n  if (ownAttrsFn && parentAttrsFn) {\n    return (props) => {\n      const parentProps = parentAttrsFn(props);\n\n      // overwrite and merge the parent props with the props received from the attrs function\n      // after they went through the parent attrs function.\n      //\n      // This makes sure the linearity of the attrs functions is preserved and all attrs function receive\n      // the whole props object calculated from the previous attrs functions\n      return combineProps(\n        parentProps,\n        ownAttrsFn(combineProps(props, parentProps)),\n      );\n    };\n  }\n\n  return ownAttrsFn || parentAttrsFn;\n};\n\n/**\n * Merges the runtime style function of the current component with the runtime style function of the parent component\n * in order to preserve the sequence of the attrs functions.\n * @param runtimeStylesFn The current runtime styles function\n * @param parentRuntimeStylesFn The parent runtime styles function\n * @returns The merged runtime styles function\n */\nconst buildRuntimeStylesProcessor = <T,>(\n  runtimeStylesFn: RuntimeStyleProcessor<T>,\n  parentRuntimeStylesFn?: RuntimeStyleProcessor<T>,\n) => {\n  if (runtimeStylesFn && parentRuntimeStylesFn) {\n    const combined: RuntimeStyleProcessor<T> = (props, classNames, style) => {\n      parentRuntimeStylesFn(props, classNames, style);\n      runtimeStylesFn(props, classNames, style);\n    };\n    return combined;\n  }\n  return runtimeStylesFn || parentRuntimeStylesFn;\n};\n\n/**\n * Internal function where attrs are passed to be processed\n */\nexport type StyledInternal = <\n  T extends object,\n  TAttrsIn extends object = {},\n  TAttrsOut extends AttrsMerged<T, TAttrsIn> = AttrsMerged<T, TAttrsIn>,\n>(\n  Component: React.FunctionComponent<T> | YakComponent<T> | HtmlTags | string,\n  attrs?: Attrs<T, TAttrsIn, TAttrsOut>,\n) => StyledLiteral<Substitute<T, TAttrsIn>>;\n\n/**\n * Utility type to extract the AttrsFunction from the Attrs type\n */\nexport type ExtractAttrsFunction<T> = T extends (p: any) => any ? T : never;\n","import React from \"react\";\nimport { styled as StyledFactory } from \"../styled.js\";\n\nexport const styled = new Proxy(StyledFactory, {\n  get(target, TagName: keyof React.JSX.IntrinsicElements) {\n    return target(TagName);\n  },\n}) as typeof StyledFactory;\n"],"mappings":"0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mDAAAE,EAAA,QAAAC,EAAA,cAAAC,EAAA,WAAAC,EAAA,yCAAAC,EAAAN,GA0BA,IAAAO,EAA2C,4BCvBpC,IAAMC,EAAqB,OAAO,KAAK,EAgEvC,SAASC,KACXC,EAC4B,CAG/B,IAAIC,EACEC,EAAqD,CAAC,EAC5D,QAAWC,KAAOH,EAIZ,OAAOG,GAAQ,SACjBF,EAAYE,EAKL,OAAOA,GAAQ,WACtBD,EAAoB,KAAKC,CAA6C,EAK/D,OAAOA,GAAQ,UAAY,UAAWA,GAC7CD,EAAoB,KAAK,CAACE,EAAOC,EAAGC,IAAU,CAC5C,QAAWC,KAAOJ,EAAI,MAAO,CAC3B,IAAMK,EAAQL,EAAI,MAAMI,CAAG,EACvB,OAAOC,GAAU,WAEnBF,EAAMC,CAAG,EAAI,OAKXE,EAAuBL,EAAOI,CAAK,CACrC,EAGAF,EAAMC,CAAG,EAAI,OAAOC,CAAK,CAE7B,CACF,CAAC,EAML,OAAIN,EAAoB,SAAW,EAC1B,CAACG,EAAGK,KACLT,GACFS,EAAW,IAAIT,CAAS,EAEnB,IAAM,CAAC,GAIX,CAACG,EAAOM,EAAYC,IAAc,CACnCV,GACFS,EAAW,IAAIT,CAAS,EAE1B,QAAS,EAAI,EAAG,EAAIC,EAAoB,OAAQ,IAC9CU,EAAYR,EAAOF,EAAoB,CAAC,EAAGQ,EAAYC,CAAS,CAEpE,CACF,CAGA,IAAMC,EAAc,CAClBR,EACAS,EACAH,EACAJ,IACG,CACH,IAAIQ,EAASD,EAAGT,EAAOM,EAAYJ,CAAK,EACxC,KAAOQ,GAAQ,CACb,GAAI,OAAOA,GAAW,WAAY,CAChCA,EAASA,EAAOV,EAAOM,EAAYJ,CAAK,EACxC,QACF,SAAW,OAAOQ,GAAW,WACvB,cAAeA,GAAUA,EAAO,WAClCJ,EAAW,IAAII,EAAO,SAAS,EAE7B,UAAWA,GAAUA,EAAO,OAC9B,QAAWP,KAAOO,EAAO,MAEvBR,EAAMC,CAAgC,EAAIO,EAAO,MAC/CP,CACF,EAIN,KACF,CACF,EAEME,EAAyB,CAC7BL,EACAS,IACoB,CACpB,IAAMC,EAASD,EAAGT,CAAK,EACvB,GAAI,OAAOU,GAAW,WACpB,OAAOL,EAAuBL,EAAOU,CAAM,EAE7C,GAAI,QAAQ,IAAI,WAAa,eAEzB,OAAOA,GAAW,UAClB,OAAOA,GAAW,UAClB,EAAEA,aAAkB,QAEpB,MAAM,IAAI,MACR,qEAAqE,KAAK,UACxEA,CACF,CAAC;AAAA;AAAA,wBAA6BD,EAAG,SAAS,CAAC;AAAA,CAC7C,EAGJ,OAAOC,CACT,ECvKO,IAAMC,EAAQ,IAChBA,IACoB,CACvB,IAAMC,EAA0B,CAAC,EAC3BC,EAA+C,CAAC,EAEtD,QAAWC,KAAQH,EACb,OAAOG,GAAS,SAClBF,EAAc,KAAK,GAAGE,EAAK,MAAM,GAAG,CAAC,EAC5B,OAAOA,GAAS,YACzBD,EAAiB,KAAKC,CAAI,EAI9B,IAAMC,EACJH,EAAc,OAAS,EACnB,CACE,CAACI,EAAGC,IAAe,CACjBL,EAAc,QAASM,GAAQD,EAAW,IAAIC,CAAG,CAAC,CACpD,EACA,GAAGL,CACL,EACAA,EAGN,OAAOM,EAAI,GAAGJ,CAAgB,CAChC,ECxBO,IAAMK,EAA0B,CACrCC,KACGC,IACA,CACH,IAAMC,EAAqD,CAAC,EAC5D,QAAWC,KAAOF,EAIZ,OAAOE,GAAQ,YACjBD,EAAoB,KAAKC,CAA6C,EAG1E,OAAID,EAAoB,SAAW,EAC1B,CACL,UAAW,GACX,MAAO,MACT,EAEOE,GAAmB,CAC1B,QAASC,EAAI,EAAGA,EAAIH,EAAoB,OAAQG,IAI9CC,EAAoCF,EAAOF,EAAoBG,CAAC,CAAC,EAEnE,MAAO,CACL,UAAW,GACX,MAAO,MACT,CACF,CACF,EAEA,SAASC,EACPF,EACAG,EACA,CACA,IAAMC,EAAa,IAAI,IACjBC,EAAQ,CAAC,EACXC,EAASH,EAAWH,EAAOI,EAAYC,CAAK,EAChD,KAAO,OAAOC,GAAW,YACvBA,EAASA,EAAON,EAAOI,EAAYC,CAAK,EAE1C,OAAOC,CACT,CCvCO,IAAMC,EAAsC,CAACC,KAAWC,IAGtD,GC1BT,IAAAC,EAAkB,sBAiBlBC,EAAyB,4BAOnBC,EAAoB,CAAC,EASrBC,EAA2BC,GAC/B,OAAO,OAAOC,EAAUD,CAAS,EAAG,CAClC,MAAQE,GAAsBD,EAAUD,EAAWE,CAAK,CAC1D,CAAC,EAeUC,EAASJ,EAEhBE,EAA4B,CAACD,EAAWE,IAAU,CACtD,IAAME,EACJ,OAAOJ,GAAc,UAAYK,KAAsBL,EAKnD,CAACM,EAAoBC,EAAeC,CAAqB,EAC7DJ,EACKJ,EAAUK,CAAkB,EAK7B,CAAC,EAEDI,EAAgBC,EAA2BR,EAAOK,CAAa,EAErE,MAAO,CAACI,KAAWC,IAAW,CAG5B,IAAMC,EAAkBC,EACtBH,EACA,GAAIC,CACN,EACMG,EAAwBC,EAC5BH,EACAL,CACF,EACMS,EAAgCC,GAAU,CAc9C,IAAMC,EACJV,GAAiBI,EAAgB,UAAS,YAAS,EAAIf,EAInDsB,EACJ,aAAcF,EACT,CACC,MAAAC,EACA,GAAGD,CACL,EAMAG,EACE,CACE,MAAAF,EACA,GAAID,EAKJ,SAAU,EACZ,EACAT,IAAgB,CAAE,MAAAU,EAAO,GAAID,CAAc,CAAC,CAC9C,EAEAI,EAAa,IAAI,IACrB,cAAeF,EAAgBA,EAAc,WAAW,MAAM,GAAG,EAAI,CAAC,CACxE,EACMT,EAAS,CACb,GAAI,UAAWS,EAAgBA,EAAc,MAAQ,CAAC,CACxD,EAIM,8BAA+BA,IACnCL,EAAsBK,EAAeE,EAAYX,CAAM,EAEvDS,EAAc,0BAA4B,IAG5CA,EAAc,UAAY,MAAM,KAAKE,CAAU,EAAE,KAAK,GAAG,GAAK,OAC9DF,EAAc,MAAQT,EAKtB,GAAM,CAAE,MAAOY,EAAgB,GAAGC,CAA0B,EAC1DJ,EACIK,EACJF,IAAmBJ,EAAQK,EAA4BJ,EAInDM,EAAiBtB,EAEnBqB,EADAE,EAAuBF,CAAoB,EAG/C,OAAOnB,EAGLA,EAAmBoB,CAAa,EAGhC,EAAAE,QAAA,cAAC5B,EAAA,CACE,GAAI0B,EAGP,CAEJ,EAGA,OAAO,OAAO,OAAOT,EAAK,CACxB,CAACZ,CAAkB,EAAG,CAACY,EAAKR,EAAeM,CAAqB,CAKlE,CAAC,CACH,CACF,EAQMY,EACJE,GACM,CACN,IAAMC,EAAS,CAAC,EAChB,QAAWC,KAAOF,EACZ,CAACE,EAAI,WAAW,GAAG,GAAKF,EAAIE,CAAG,IAAM,SACvCD,EAAOC,CAAG,EAAIF,EAAIE,CAAG,GAGzB,OAAOD,CACT,EAGME,EAAkB,CAACC,EAAYC,IAAe,CAClD,GAAI,GAACD,GAAK,CAACC,GACX,OAAKD,EACAC,EACED,EAAI,IAAMC,EADFD,EADAC,CAGjB,EAQMb,EAAe,CAanBH,EACAiB,IAEAA,GACKjB,EAAM,YAAciB,EAAS,WAAa,CAACA,EAAS,aACpDjB,EAAM,QAAUiB,EAAS,OAAS,CAACA,EAAS,OAE3C,CACE,GAAGjB,EACH,GAAGiB,CACL,EAEA,CACE,GAAGjB,EACH,GAAGiB,EACH,UAAWH,EAAgBd,EAAM,UAAWiB,EAAS,SAAS,EAC9D,MAAO,CAAE,GAAIjB,EAAM,OAAS,CAAC,EAAI,GAAIiB,EAAS,OAAS,CAAC,CAAG,CAC7D,EAEFjB,EAWAR,EAA6B,CAKjCR,EACAK,IACsD,CACtD,IAAM6B,EACJlC,IAAU,OAAOA,GAAU,WAAaA,EAAQ,IAAMA,GAExD,OAAIkC,GAAc7B,EACRW,GAAU,CAChB,IAAMmB,EAAc9B,EAAcW,CAAK,EAOvC,OAAOG,EACLgB,EACAD,EAAWf,EAAaH,EAAOmB,CAAW,CAAC,CAC7C,CACF,EAGKD,GAAc7B,CACvB,EASMS,EAA8B,CAClCH,EACAL,IAEIK,GAAmBL,EACsB,CAACU,EAAOI,EAAYgB,IAAU,CACvE9B,EAAsBU,EAAOI,EAAYgB,CAAK,EAC9CzB,EAAgBK,EAAOI,EAAYgB,CAAK,CAC1C,EAGKzB,GAAmBL,EC/SrB,IAAM+B,EAAS,IAAI,MAAMA,EAAe,CAC7C,IAAIC,EAAQC,EAA4C,CACtD,OAAOD,EAAOC,CAAO,CACvB,CACF,CAAC","names":["index_exports","__export","atoms","css","keyframes","styled","__toCommonJS","import_context","yakComponentSymbol","css","args","className","dynamicCssFunctions","arg","props","_","style","key","value","recursivePropExecution","classNames","allStyles","unwrapProps","fn","result","atoms","staticClasses","dynamicFunctions","atom","runtimeFunctions","_","classNames","cls","css","css","styles","args","dynamicCssFunctions","arg","props","i","executeDynamicExpressionRecursively","expression","classNames","style","result","keyframes","styles","dynamic","import_react","import_context","noTheme","styledFactory","Component","yakStyled","attrs","styled","isYakComponent","yakComponentSymbol","parentYakComponent","parentAttrsFn","parentRuntimeStylesFn","mergedAttrsFn","buildRuntimeAttrsProcessor","styles","values","runtimeStylesFn","css","runtimeStyleProcessor","buildRuntimeStylesProcessor","yak","props","theme","combinedProps","combineProps","classNames","themeAfterAttr","combinedPropsWithoutTheme","propsBeforeFiltering","filteredProps","removeNonDomProperties","React","obj","result","key","mergeClassNames","a","b","newProps","ownAttrsFn","parentProps","style","styled","target","TagName"]}
+{"version":3,"sources":["../runtime/index.ts","../runtime/cssLiteral.tsx","../runtime/atoms.tsx","../runtime/mocks/cssLiteral.ts","../runtime/mocks/keyframes.ts","../runtime/styled.tsx","../runtime/mocks/styled.ts"],"sourcesContent":["/**\n * This file contains the typings for the public API for next-yak and testing mocks\n *\n * IMPORTANT: In production builds, imports to this file should be replaced by the Babel plugin.\n * If you're seeing this code in a production environment, your build process may not be configured correctly.\n *\n * Purpose:\n * 1. Provide a test-friendly version of the next-yak API\n * 2. Offer type definitions for the public API\n *\n * Usage in tests:\n * - Import from \"next-yak\" as usual in your test files\n * - These mock implementations will be used instead of the actual runtime\n *\n * Warning for production:\n * - If these exports are used in a production build, styles will not be applied correctly\n * - Ensure your build process is configured to use the next-yak Babel plugin\n *\n * For maintainers:\n * - Keep this API surface in sync with the actual implementation in next-yak/internal\n * - Ensure mock implementations here are suitable for testing purposes\n */\n\n// the following export is not relative as \"next-yak/context\"\n// links to one file for react server components and\n// to another file for classic react components\nexport { useTheme, YakThemeProvider } from \"next-yak/context\";\nexport type { YakTheme } from \"./context/index.d.ts\";\n\nexport type { GenericYakComponentOf } from \"./publicStyledApi.ts\";\n\nexport { atoms } from \"./atoms.js\";\nexport { css } from \"./mocks/cssLiteral.js\";\nexport { keyframes } from \"./mocks/keyframes.js\";\nexport { styled } from \"./mocks/styled.js\";\n","import type { YakTheme } from \"./index.d.ts\";\nimport { RuntimeStyleProcessor } from \"./publicStyledApi.js\";\n\nexport const yakComponentSymbol = Symbol(\"yak\");\n\nexport type ComponentStyles<TProps> = (props: TProps) => {\n  className: string;\n  style?: {\n    [key: string]: string;\n  };\n};\n\nexport type CSSInterpolation<TProps> =\n  | string\n  | number\n  | undefined\n  | null\n  | false\n  | ComponentStyles<TProps>\n  | {\n      // type only identifier to allow targeting components\n      // e.g. styled.svg`${Button}:hover & { fill: red; }`\n      [yakComponentSymbol]: any;\n    }\n  | ((props: TProps) => CSSInterpolation<TProps>);\n\ntype CSSStyles<TProps = {}> = {\n  style: { [key: string]: string | ((props: TProps) => string) };\n};\n\ntype CSSFunction = <TProps = {}>(\n  styles: TemplateStringsArray,\n  ...values: CSSInterpolation<TProps & { theme: YakTheme }>[]\n) => ComponentStyles<TProps>;\n\nexport type NestedRuntimeStyleProcessor = (\n  props: unknown,\n  classNames: Set<string>,\n  style: React.CSSProperties,\n) =>\n  | {\n      className?: string;\n      style?: React.CSSProperties;\n    }\n  | void\n  | NestedRuntimeStyleProcessor;\n\n/**\n * css() runtime factory of css``\n *\n * /!\\ next-yak transpiles css`` and styled``\n *\n * This changes the typings of the css`` and styled`` functions.\n * During development the user of next-yak wants to work with the\n * typings BEFORE compilation.\n *\n * Therefore this is only an internal function only and it must be cast to any\n * before exported to the user.\n *\n * The internal functioning of css`` is to return a single callback function that runs all functions\n * (or creates new ones if needed) that are passed as arguments. These functions receive the props, classNames, and style object as arguments\n * and operate directly on the classNames and style objects.\n */\nexport function css<TProps>(\n  styles: TemplateStringsArray,\n  ...values: CSSInterpolation<NoInfer<TProps> & { theme: YakTheme }>[]\n): ComponentStyles<TProps>;\nexport function css<TProps>(\n  ...args: Array<any>\n): RuntimeStyleProcessor<TProps> {\n  // Normally this  could be an array of strings passed, but as we transpile the usage of css`` ourselves, we control the arguments\n  // and ensure that only the first argument is a string (class name of the non-dynamic styles)\n  let className: string | undefined;\n  const dynamicCssFunctions: NestedRuntimeStyleProcessor[] = [];\n  for (const arg of args as Array<string | CSSFunction | CSSStyles<any>>) {\n    // A CSS-module class name which got auto generated during build from static css\n    // e.g. css`color: red;`\n    // compiled -> css(\"yak31e4\")\n    if (typeof arg === \"string\") {\n      className = arg;\n    }\n    // Dynamic CSS e.g.\n    // css`${props => props.active && css`color: red;`}`\n    // compiled -> css((props: { active: boolean }) => props.active && css(\"yak31e4\"))\n    else if (typeof arg === \"function\") {\n      dynamicCssFunctions.push(arg as unknown as NestedRuntimeStyleProcessor);\n    }\n    // Dynamic CSS with css variables e.g.\n    // css`transform: translate(${props => props.x}, ${props => props.y});`\n    // compiled -> css(\"yak31e4\", { style: { \"--yakVarX\": props => props.x }, \"--yakVarY\": props => props.y }})\n    else if (typeof arg === \"object\" && \"style\" in arg) {\n      dynamicCssFunctions.push((props, _, style) => {\n        for (const key in arg.style) {\n          const value = arg.style[key];\n          if (typeof value === \"function\") {\n            // @ts-expect-error CSSProperties don't allow css variables\n            style[key] = String(\n              // The value for a css value can be a theme dependent function e.g.:\n              // const borderColor = (props: { theme: { mode: \"dark\" | \"light\" } }) => props.theme === \"dark\" ? \"black\" : \"white\";\n              // css`border-color: ${borderColor};`\n              // Therefore the value has to be extracted recursively\n              recursivePropExecution(props, value),\n            );\n          } else {\n            // @ts-expect-error CSSProperties don't allow css variables\n            style[key] = String(value);\n          }\n        }\n      });\n    }\n  }\n\n  // Non Dynamic CSS\n  // This is just an optimization for the common case where there are no dynamic css functions\n  if (dynamicCssFunctions.length === 0) {\n    return (_, classNames) => {\n      if (className) {\n        classNames.add(className);\n      }\n      return () => {};\n    };\n  }\n\n  return (props, classNames, allStyles) => {\n    if (className) {\n      classNames.add(className);\n    }\n    for (let i = 0; i < dynamicCssFunctions.length; i++) {\n      unwrapProps(props, dynamicCssFunctions[i], classNames, allStyles);\n    }\n  };\n}\n\n// Dynamic CSS with runtime logic\nconst unwrapProps = (\n  props: unknown,\n  fn: NestedRuntimeStyleProcessor,\n  classNames: Set<string>,\n  style: React.CSSProperties,\n) => {\n  let result = fn(props, classNames, style);\n  while (result) {\n    if (typeof result === \"function\") {\n      result = result(props, classNames, style);\n      continue;\n    } else if (typeof result === \"object\") {\n      if (\"className\" in result && result.className) {\n        classNames.add(result.className);\n      }\n      if (\"style\" in result && result.style) {\n        for (const key in result.style) {\n          // This is hard for typescript to infer\n          style[key as keyof React.CSSProperties] = result.style[\n            key as keyof React.CSSProperties\n          ] as any;\n        }\n      }\n    }\n    break;\n  }\n};\n\nconst recursivePropExecution = (\n  props: unknown,\n  fn: (props: unknown) => any,\n): string | number => {\n  const result = fn(props);\n  if (typeof result === \"function\") {\n    return recursivePropExecution(props, result);\n  }\n  if (process.env.NODE_ENV === \"development\") {\n    if (\n      typeof result !== \"string\" &&\n      typeof result !== \"number\" &&\n      !(result instanceof String)\n    ) {\n      throw new Error(\n        `Dynamic CSS functions must return a string or number but returned ${JSON.stringify(\n          result,\n        )}\\n\\nDynamic CSS function: ${fn.toString()}\\n`,\n      );\n    }\n  }\n  return result;\n};\n","import { ComponentStyles, css } from \"./cssLiteral.js\";\nimport { RuntimeStyleProcessor as RuntimeStyleProcessor } from \"./publicStyledApi.js\";\n\n/**\n * Allows to use atomic CSS classes in a styled or css block\n *\n * @usage\n *\n * ```tsx\n * import { styled, atoms } from \"next-yak\";\n *\n * const Button = styled.button<{ $primary?: boolean }>`\n *  ${atoms(\"text-teal-600\", \"text-base\", \"rounded-md\")}\n *  ${props => props.$primary && atoms(\"shadow-md\")}\n * `;\n * ```\n */\nexport const atoms = <T,>(\n  ...atoms: (string | RuntimeStyleProcessor<T> | false)[]\n): ComponentStyles<T> => {\n  const staticClasses: string[] = [];\n  const dynamicFunctions: RuntimeStyleProcessor<T>[] = [];\n\n  for (const atom of atoms) {\n    if (typeof atom === \"string\") {\n      staticClasses.push(...atom.split(\" \"));\n    } else if (typeof atom === \"function\") {\n      dynamicFunctions.push(atom);\n    }\n  }\n\n  const runtimeFunctions: RuntimeStyleProcessor<T>[] =\n    staticClasses.length > 0\n      ? [\n          (_, classNames) => {\n            staticClasses.forEach((cls) => classNames.add(cls));\n          },\n          ...dynamicFunctions,\n        ]\n      : dynamicFunctions;\n\n  // @ts-expect-error the internal implementation of css is not typed\n  return css(...runtimeFunctions);\n};\n","import type {\n  css as cssInternal,\n  NestedRuntimeStyleProcessor,\n} from \"../cssLiteral.js\";\n\nexport type { ComponentStyles, CSSInterpolation } from \"../cssLiteral.js\";\n\n/**\n * Allows to use CSS styles in a styled or css block\n *\n * e.g.\n *\n * ```tsx\n * const Component = styled.div`\n *  color: black;\n *  ${({$active}) => $active && css`color: red;`}\n * `;\n * ```\n */\nexport const css: typeof cssInternal = (\n  styles: TemplateStringsArray,\n  ...args: unknown[]\n) => {\n  const dynamicCssFunctions: NestedRuntimeStyleProcessor[] = [];\n  for (const arg of args as Array<string | Function | object>) {\n    // Dynamic CSS e.g.\n    // css`${props => props.active && css`color: red;`}`\n    // compiled -> css((props: { active: boolean }) => props.active && css(\"yak31e4\"))\n    if (typeof arg === \"function\") {\n      dynamicCssFunctions.push(arg as unknown as NestedRuntimeStyleProcessor);\n    }\n  }\n  if (dynamicCssFunctions.length === 0) {\n    return {\n      className: \"\",\n      style: undefined,\n    };\n  }\n  return ((props: unknown) => {\n    for (let i = 0; i < dynamicCssFunctions.length; i++) {\n      // run the dynamic expressions and ignore the return value\n      // the execution is important to ensure that the user code is executed\n      // the same way as in the real runtime\n      executeDynamicExpressionRecursively(props, dynamicCssFunctions[i]);\n    }\n    return {\n      className: \"\",\n      style: undefined,\n    };\n  }) as any;\n};\n\nfunction executeDynamicExpressionRecursively(\n  props: unknown,\n  expression: NestedRuntimeStyleProcessor,\n) {\n  const classNames = new Set<string>();\n  const style = {};\n  let result = expression(props, classNames, style);\n  while (typeof result === \"function\") {\n    result = result(props, classNames, style);\n  }\n  return result;\n}\n","import type { keyframes as keyframesInternal } from \"../keyframes.js\";\n\n/**\n * Allows to use CSS keyframe animations in a styled or css block\n *\n * @usage\n *\n * ```tsx\n * import { styled, keyframes } from \"next-yak\";\n *\n * const rotate = keyframes`\n *  from {\n *   transform: rotate(0deg);\n *  }\n *  to {\n *   transform: rotate(360deg);\n *  }\n * `;\n *\n * const Spinner = styled.div`\n *   animation: ${rotate} 1s linear infinite;\n * `;\n * ```\n */\nexport const keyframes: typeof keyframesInternal = (styles, ...dynamic) => {\n  // the keyframes function is a no-op in the mock\n  // as it has no dynamic runtime behavior but only css\n  return \"\";\n};\n","import { css, CSSInterpolation, yakComponentSymbol } from \"./cssLiteral.js\";\nimport React from \"react\";\nimport type {\n  Attrs,\n  AttrsMerged,\n  Styled,\n  YakComponent,\n  AttrsFunction,\n  StyledFn,\n  HtmlTags,\n  Substitute,\n  StyledLiteral,\n  RuntimeStyleProcessor,\n} from \"./publicStyledApi.js\";\n\n// the following export is not relative as \"next-yak/context\"\n// links to one file for react server components and\n// to another file for classic react components\nimport { useTheme } from \"next-yak/context\";\nimport type { YakTheme } from \"./context/index.d.ts\";\n\n/**\n * This Symbol is a fake theme which was used instead of the real one from the context\n * to speed up rendering\n */\nconst noTheme: YakTheme = {};\n\n//\n// The `styled()` API without `styled.` syntax\n//\n// The API design is inspired by styled-components:\n// https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/constructors/styled.tsx\n// https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/models/StyledComponent.ts\n//\nconst styledFactory: StyledFn = (Component) =>\n  Object.assign(yakStyled(Component), {\n    attrs: (attrs: Attrs<any>) => yakStyled(Component, attrs),\n  });\n\n/**\n * The `styled` method works perfectly on all of your own or any third-party component,\n * as long as they attach the passed className prop to a DOM element.\n *\n * @usage\n *\n * ```tsx\n * const StyledLink = styled(Link)`\n *  color: #BF4F74;\n *  font-weight: bold;\n * `;\n * ```\n */\nexport const styled = styledFactory as Styled;\n\nconst yakStyled: StyledInternal = (Component, attrs) => {\n  const isYakComponent =\n    typeof Component !== \"string\" && yakComponentSymbol in Component;\n\n  // if the component that is wrapped is a yak component, we can extract it to render the underlying component directly\n  // and we can also extract the attrs function and the dynamic style function to merge it with the current attrs function (or dynamic style function)\n  // so that the sequence of the attrs functions is preserved\n  const [parentYakComponent, parentAttrsFn, parentRuntimeStylesFn] =\n    isYakComponent\n      ? (Component[yakComponentSymbol] as [\n          YakComponent<unknown>,\n          ExtractAttrsFunction<typeof attrs>,\n          RuntimeStyleProcessor<unknown>,\n        ])\n      : [];\n\n  const mergedAttrsFn = buildRuntimeAttrsProcessor(attrs, parentAttrsFn);\n\n  return (styles, ...values) => {\n    // combine all interpolated logic into a single function\n    // e.g. styled.button`color: ${props => props.color}; margin: ${props => props.margin};`\n    const runtimeStylesFn = css(\n      styles,\n      ...(values as CSSInterpolation<unknown>[]),\n    ) as RuntimeStyleProcessor<unknown>;\n    const runtimeStyleProcessor = buildRuntimeStylesProcessor(\n      runtimeStylesFn,\n      parentRuntimeStylesFn,\n    );\n    const yak: React.FunctionComponent = (props) => {\n      // if the css component does not require arguments\n      // it can be called without arguments and we skip calling useTheme()\n      //\n      // `attrsFn || getRuntimeStyles.length` is NOT against the rule of hooks as\n      // getRuntimeStyles and attrsFn are constants defined outside of the component\n      //\n      // for example\n      //\n      // const Button = styled.button`color: red;`\n      //       ^ does not need to have access to theme, so we skip calling useTheme()\n      //\n      // const Button = styled.button`${({ theme }) => css`color: ${theme.color};`}`\n      //       ^ must be have access to theme, so we call useTheme()\n      const theme =\n        mergedAttrsFn || runtimeStylesFn.length ? useTheme() : noTheme;\n\n      // The first components which is not wrapped in a yak component will execute all attrs functions\n      // starting from the innermost yak component to the outermost yak component (itself)\n      const combinedProps =\n        \"$__attrs\" in props\n          ? ({\n              theme,\n              ...props,\n            } as {\n              theme: YakTheme;\n              className?: string;\n              style?: React.CSSProperties;\n            })\n          : // overwrite and merge the current props with the processed attrs\n            combineProps(\n              {\n                theme,\n                ...(props as {\n                  className?: string;\n                  style?: React.CSSProperties;\n                }),\n                // mark the props as processed\n                $__attrs: true,\n              },\n              mergedAttrsFn?.({ theme, ...(props as any) }),\n            );\n\n      const classNames = new Set<string>(\n        \"className\" in combinedProps ? combinedProps.className?.split(\" \") : [],\n      );\n      const styles = {\n        ...(\"style\" in combinedProps ? combinedProps.style : {}),\n      };\n\n      // execute all functions inside the style literal if not already executed\n      // e.g. styled.button`color: ${props => props.color};`\n      if (!(\"$__runtimeStylesProcessed\" in combinedProps)) {\n        runtimeStyleProcessor(combinedProps, classNames, styles);\n        // @ts-expect-error this is not typed correctly\n        combinedProps.$__runtimeStylesProcessed = true;\n      }\n\n      combinedProps.className = Array.from(classNames).join(\" \") || undefined;\n      combinedProps.style = styles;\n\n      // delete the yak theme from the props\n      // this must happen after the runtimeStyles are calculated\n      // prevents passing the theme prop to the DOM element of a styled component\n      const { theme: themeAfterAttr, ...combinedPropsWithoutTheme } =\n        combinedProps;\n      const propsBeforeFiltering =\n        themeAfterAttr === theme ? combinedPropsWithoutTheme : combinedProps;\n\n      // remove all props that start with a $ sign for string components e.g. \"button\" or \"div\"\n      // so that they are not passed to the DOM element\n      const filteredProps = !isYakComponent\n        ? removeNonDomProperties(propsBeforeFiltering)\n        : propsBeforeFiltering;\n\n      return parentYakComponent ? (\n        // if the styled(Component) syntax is used and the component is a yak component\n        // we can call the yak function directly without running through react createElement\n        parentYakComponent(filteredProps)\n      ) : (\n        // if the final component is a string component e.g. styled(\"div\") or a custom non yak fn e.g. styled(MyComponent)\n        <Component\n          {...(filteredProps as React.ComponentProps<\n            Exclude<typeof Component, string>\n          >)}\n        />\n      );\n    };\n\n    // Assign the yakComponentSymbol directly without forwardRef\n    return Object.assign(yak, {\n      [yakComponentSymbol]: [yak, mergedAttrsFn, runtimeStyleProcessor] as [\n        unknown,\n        unknown,\n        unknown,\n      ],\n    });\n  };\n};\n\n/**\n * Remove all entries that start with a $ sign\n *\n * This allows to have props that are used for internal styling purposes\n * but are not be passed to the DOM element\n */\nconst removeNonDomProperties = <T extends Record<string, unknown>>(\n  obj: T,\n): T => {\n  const result = {} as T;\n  for (const key in obj) {\n    if (!key.startsWith(\"$\") && obj[key] !== undefined) {\n      result[key] = obj[key];\n    }\n  }\n  return result;\n};\n\n// util function to merge class names, as they are concatenated with a space\nconst mergeClassNames = (a?: string, b?: string) => {\n  if (!a && !b) return undefined;\n  if (!a) return b;\n  if (!b) return a;\n  return a + \" \" + b;\n};\n\n/**\n * merge props and processed props (including class names and styles)\n * e.g.:\\\n * `{ className: \"a\", foo: 1 }` and `{ className: \"b\", bar: 2 }` \\\n * => `{ className: \"a b\", foo: 1, bar: 2 }`\n */\nconst combineProps = <\n  T extends {\n    className?: string;\n    style?: React.CSSProperties;\n  },\n  TOther extends\n    | {\n        className?: string;\n        style?: React.CSSProperties;\n      }\n    | null\n    | undefined,\n>(\n  props: T,\n  newProps: TOther,\n) =>\n  newProps\n    ? (props.className === newProps.className || !newProps.className) &&\n      (props.style === newProps.style || !newProps.style)\n      ? // shortcut if no style and class merging is necessary\n        {\n          ...props,\n          ...newProps,\n        }\n      : // merge class names and styles\n        {\n          ...props,\n          ...newProps,\n          className: mergeClassNames(props.className, newProps.className),\n          style: { ...(props.style || {}), ...(newProps.style || {}) },\n        }\n    : // if no new props are provided, no merging is necessary\n      props;\n\n/**\n * Merges the attrs function of the current component with the attrs function of the parent component\n * in order to preserve the sequence of the attrs functions.\n * Note: In theory, the parentAttrsFn can have different types for TAttrsIn and TAttrsOut\n * but as this is only used internally, we can ignore and simplify this case\n * @param attrs The attrs object or function of the current component (if any)\n * @param parentAttrsFn The attrs function of the parent/wrapped component (if any)\n * @returns A function that receives the props and returns the transformed props\n */\nconst buildRuntimeAttrsProcessor = <\n  T,\n  TAttrsIn extends object,\n  TAttrsOut extends AttrsMerged<T, TAttrsIn>,\n>(\n  attrs?: Attrs<T, TAttrsIn, TAttrsOut>,\n  parentAttrsFn?: AttrsFunction<T, TAttrsIn, TAttrsOut>,\n): AttrsFunction<T, TAttrsIn, TAttrsOut> | undefined => {\n  const ownAttrsFn =\n    attrs && (typeof attrs === \"function\" ? attrs : () => attrs);\n\n  if (ownAttrsFn && parentAttrsFn) {\n    return (props) => {\n      const parentProps = parentAttrsFn(props);\n\n      // overwrite and merge the parent props with the props received from the attrs function\n      // after they went through the parent attrs function.\n      //\n      // This makes sure the linearity of the attrs functions is preserved and all attrs function receive\n      // the whole props object calculated from the previous attrs functions\n      return combineProps(\n        parentProps,\n        ownAttrsFn(combineProps(props, parentProps)),\n      );\n    };\n  }\n\n  return ownAttrsFn || parentAttrsFn;\n};\n\n/**\n * Merges the runtime style function of the current component with the runtime style function of the parent component\n * in order to preserve the sequence of the attrs functions.\n * @param runtimeStylesFn The current runtime styles function\n * @param parentRuntimeStylesFn The parent runtime styles function\n * @returns The merged runtime styles function\n */\nconst buildRuntimeStylesProcessor = <T,>(\n  runtimeStylesFn: RuntimeStyleProcessor<T>,\n  parentRuntimeStylesFn?: RuntimeStyleProcessor<T>,\n) => {\n  if (runtimeStylesFn && parentRuntimeStylesFn) {\n    const combined: RuntimeStyleProcessor<T> = (props, classNames, style) => {\n      parentRuntimeStylesFn(props, classNames, style);\n      runtimeStylesFn(props, classNames, style);\n    };\n    return combined;\n  }\n  return runtimeStylesFn || parentRuntimeStylesFn;\n};\n\n/**\n * Internal function where attrs are passed to be processed\n */\nexport type StyledInternal = <\n  T extends object,\n  TAttrsIn extends object = {},\n  TAttrsOut extends AttrsMerged<T, TAttrsIn> = AttrsMerged<T, TAttrsIn>,\n>(\n  Component: React.FunctionComponent<T> | YakComponent<T> | HtmlTags | string,\n  attrs?: Attrs<T, TAttrsIn, TAttrsOut>,\n) => StyledLiteral<Substitute<T, TAttrsIn>>;\n\n/**\n * Utility type to extract the AttrsFunction from the Attrs type\n */\nexport type ExtractAttrsFunction<T> = T extends (p: any) => any ? T : never;\n","import React from \"react\";\nimport { styled as StyledFactory } from \"../styled.js\";\n\nexport const styled = new Proxy(StyledFactory, {\n  get(target, TagName: keyof React.JSX.IntrinsicElements) {\n    return target(TagName);\n  },\n}) as typeof StyledFactory;\n"],"mappings":"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","names":["index_exports","__export","atoms","css","keyframes","styled","__toCommonJS","import_context","yakComponentSymbol","css","args","className","dynamicCssFunctions","arg","props","_","style","key","value","recursivePropExecution","classNames","allStyles","unwrapProps","fn","result","atoms","staticClasses","dynamicFunctions","atom","runtimeFunctions","_","classNames","cls","css","css","styles","args","dynamicCssFunctions","arg","props","i","executeDynamicExpressionRecursively","expression","classNames","style","result","keyframes","styles","dynamic","import_react","import_context","noTheme","styledFactory","Component","yakStyled","attrs","styled","isYakComponent","yakComponentSymbol","parentYakComponent","parentAttrsFn","parentRuntimeStylesFn","mergedAttrsFn","buildRuntimeAttrsProcessor","styles","values","runtimeStylesFn","css","runtimeStyleProcessor","buildRuntimeStylesProcessor","yak","props","theme","combinedProps","combineProps","classNames","themeAfterAttr","combinedPropsWithoutTheme","propsBeforeFiltering","filteredProps","removeNonDomProperties","React","obj","result","key","mergeClassNames","a","b","newProps","ownAttrsFn","parentProps","style","styled","target","TagName"]}

package/dist/index.d.cts

@@ -5,13 +5,13 @@ interface YakTheme {
 /**
  * Returns the current yak theme context
  *
- * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
+ * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 declare const useTheme: () => YakTheme;
 /**
  * Yak theme context provider
  *
- * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
+ * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 declare const YakThemeProvider: ({ children, theme, }: {
     children: ReactNode;

package/dist/index.d.ts

@@ -5,13 +5,13 @@ interface YakTheme {
 /**
  * Returns the current yak theme context
  *
- * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
+ * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 declare const useTheme: () => YakTheme;
 /**
  * Yak theme context provider
  *
- * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
+ * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 declare const YakThemeProvider: ({ children, theme, }: {
     children: ReactNode;

package/dist/index.js

@@ -1,5 +1,5 @@
 import{useTheme as st,YakThemeProvider as nt}from"next-yak/context";var u=Symbol("yak");function p(...e){let t,s=[];for(let r of e)typeof r=="string"?t=r:typeof r=="function"?s.push(r):typeof r=="object"&&"style"in r&&s.push((n,o,i)=>{for(let a in r.style){let l=r.style[a];typeof l=="function"?i[a]=String(x(n,l)):i[a]=String(l)}});return s.length===0?(r,n)=>(t&&n.add(t),()=>{}):(r,n,o)=>{t&&n.add(t);for(let i=0;i<s.length;i++)I(r,s[i],n,o)}}var I=(e,t,s,r)=>{let n=t(e,s,r);for(;n;){if(typeof n=="function"){n=n(e,s,r);continue}else if(typeof n=="object"&&("className"in n&&n.className&&s.add(n.className),"style"in n&&n.style))for(let o in n.style)r[o]=n.style[o];break}},x=(e,t)=>{let s=t(e);if(typeof s=="function")return x(e,s);if(process.env.NODE_ENV==="development"&&typeof s!="string"&&typeof s!="number"&&!(s instanceof String))throw new Error(`Dynamic CSS functions must return a string or number but returned ${JSON.stringify(s)}
 
 Dynamic CSS function: ${t.toString()}
-`);return s};var b=(...e)=>{let t=[],s=[];for(let n of e)typeof n=="string"?t.push(...n.split(" ")):typeof n=="function"&&s.push(n);let r=t.length>0?[(n,o)=>{t.forEach(i=>o.add(i))},...s]:s;return p(...r)};var F=(e,...t)=>{let s=[];for(let r of t)typeof r=="function"&&s.push(r);return s.length===0?{className:"",style:void 0}:r=>{for(let n=0;n<s.length;n++)w(r,s[n]);return{className:"",style:void 0}}};function w(e,t){let s=new Set,r={},n=t(e,s,r);for(;typeof n=="function";)n=n(e,s,r);return n}var Y=(e,...t)=>"";import O from"react";import{useTheme as _}from"next-yak/context";var j={},v=e=>Object.assign(A(e),{attrs:t=>A(e,t)}),R=v,A=(e,t)=>{let s=typeof e!="string"&&u in e,[r,n,o]=s?e[u]:[],i=D(t,n);return(a,...l)=>{let S=p(a,...l),d=L(S,o),T=y=>{let m=i||S.length?_():j,c="$__attrs"in y?{theme:m,...y}:f({theme:m,...y,$__attrs:!0},i?.({theme:m,...y})),g=new Set("className"in c?c.className?.split(" "):[]),P={..."style"in c?c.style:{}};"$__runtimeStylesProcessed"in c||(d(c,g,P),c.$__runtimeStylesProcessed=!0),c.className=Array.from(g).join(" ")||void 0,c.style=P;let{theme:h,...N}=c,k=h===m?N:c,C=s?k:E(k);return r?r(C):O.createElement(e,{...C})};return Object.assign(T,{[u]:[T,i,d]})}},E=e=>{let t={};for(let s in e)!s.startsWith("$")&&e[s]!==void 0&&(t[s]=e[s]);return t},$=(e,t)=>{if(!(!e&&!t))return e?t?e+" "+t:e:t},f=(e,t)=>t?(e.className===t.className||!t.className)&&(e.style===t.style||!t.style)?{...e,...t}:{...e,...t,className:$(e.className,t.className),style:{...e.style||{},...t.style||{}}}:e,D=(e,t)=>{let s=e&&(typeof e=="function"?e:()=>e);return s&&t?r=>{let n=t(r);return f(n,s(f(r,n)))}:s||t},L=(e,t)=>e&&t?(r,n,o)=>{t(r,n,o),e(r,n,o)}:e||t;var M=new Proxy(R,{get(e,t){return e(t)}});export{nt as YakThemeProvider,b as atoms,F as css,Y as keyframes,M as styled,st as useTheme};
+`);return s};var b=(...e)=>{let t=[],s=[];for(let n of e)typeof n=="string"?t.push(...n.split(" ")):typeof n=="function"&&s.push(n);let r=t.length>0?[(n,o)=>{t.forEach(i=>o.add(i))},...s]:s;return p(...r)};var F=(e,...t)=>{let s=[];for(let r of t)typeof r=="function"&&s.push(r);return s.length===0?{className:"",style:void 0}:(r=>{for(let n=0;n<s.length;n++)w(r,s[n]);return{className:"",style:void 0}})};function w(e,t){let s=new Set,r={},n=t(e,s,r);for(;typeof n=="function";)n=n(e,s,r);return n}var Y=(e,...t)=>"";import O from"react";import{useTheme as _}from"next-yak/context";var j={},v=e=>Object.assign(A(e),{attrs:t=>A(e,t)}),R=v,A=(e,t)=>{let s=typeof e!="string"&&u in e,[r,n,o]=s?e[u]:[],i=D(t,n);return(a,...l)=>{let S=p(a,...l),d=L(S,o),T=y=>{let m=i||S.length?_():j,c="$__attrs"in y?{theme:m,...y}:f({theme:m,...y,$__attrs:!0},i?.({theme:m,...y})),g=new Set("className"in c?c.className?.split(" "):[]),P={..."style"in c?c.style:{}};"$__runtimeStylesProcessed"in c||(d(c,g,P),c.$__runtimeStylesProcessed=!0),c.className=Array.from(g).join(" ")||void 0,c.style=P;let{theme:h,...N}=c,k=h===m?N:c,C=s?k:E(k);return r?r(C):O.createElement(e,{...C})};return Object.assign(T,{[u]:[T,i,d]})}},E=e=>{let t={};for(let s in e)!s.startsWith("$")&&e[s]!==void 0&&(t[s]=e[s]);return t},$=(e,t)=>{if(!(!e&&!t))return e?t?e+" "+t:e:t},f=(e,t)=>t?(e.className===t.className||!t.className)&&(e.style===t.style||!t.style)?{...e,...t}:{...e,...t,className:$(e.className,t.className),style:{...e.style||{},...t.style||{}}}:e,D=(e,t)=>{let s=e&&(typeof e=="function"?e:()=>e);return s&&t?r=>{let n=t(r);return f(n,s(f(r,n)))}:s||t},L=(e,t)=>e&&t?(r,n,o)=>{t(r,n,o),e(r,n,o)}:e||t;var M=new Proxy(R,{get(e,t){return e(t)}});export{nt as YakThemeProvider,b as atoms,F as css,Y as keyframes,M as styled,st as useTheme};
 //# sourceMappingURL=index.js.map