@salty-css/react 0.0.1-alpha.273 → 0.0.1-alpha.275

package/dynamic-styles.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("@salty-css/core/parsers"),m=require("@salty-css/core/util"),S=require("./clsx-C11secjj.cjs"),r=s=>m.toHash(s),i=s=>`.${r(s)}`,l=async(s,t)=>(await o.parseStyles(s,t)).join(`
-`),h=async({as:s,scope:t,styles:a,...n})=>{const c=await l(a,t);if(s){const y=i(a),u={...n,className:S.clsx(y,n.className)};return e.jsxs(e.Fragment,{children:[e.jsx("style",{children:c}),e.jsx(s,{...u})]})}return e.jsx("style",{children:c})};exports.DynamicStyles=h;exports.useDynamicStyles=l;exports.useDynamicStylesClassName=i;exports.useDynamicStylesHash=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("@salty-css/core/parsers"),m=require("@salty-css/core/util"),S=require("./clsx-C11secjj.cjs"),i=s=>m.toHash(s),r=async(s,a)=>(await o.parseStyles(s,a)).join(`
+`),j=async({as:s,scope:a,styles:e,...n})=>{if(s){if(!e)return t.jsx(s,{...n});const c=i(e),u=await r(e,a||`.${c}`),y={...n,className:S.clsx(c,n.className)};return t.jsxs(t.Fragment,{children:[t.jsx("style",{children:u}),t.jsx(s,{...y})]})}if(!e)return null;const l=await r(e,a);return t.jsx("style",{children:l})};exports.DynamicStyles=j;exports.getDynamicStylesClassName=i;exports.getDynamicStylesCss=r;

package/dynamic-styles.d.ts

@@ -3,13 +3,12 @@ import { HTMLAttributes } from 'react';
 /**
  * Create a hash of the dynamic styles that then can be used as scope.
  */
-export declare const useDynamicStylesHash: (styles: BaseStyles) => string;
-export declare const useDynamicStylesClassName: (styles: BaseStyles) => string;
+export declare const getDynamicStylesClassName: (styles: BaseStyles) => string;
 /**
  * Add any dynamic styles to your app with a custom scope.
  * Note: this works only with server components.
  */
-export declare const useDynamicStyles: (styles: BaseStyles, scope?: string) => Promise<string>;
+export declare const getDynamicStylesCss: (styles: BaseStyles, scope?: string) => Promise<string>;
 interface DynamicStylesProps extends HTMLAttributes<HTMLElement> {
     scope?: string;
     as?: (...args: any[]) => React.ReactNode;
@@ -19,5 +18,5 @@ interface DynamicStylesProps extends HTMLAttributes<HTMLElement> {
  * Add any dynamic styles to your app with a custom scope.
  * Note: this works only with server components.
  */
-export declare const DynamicStyles: ({ as: Component, scope, styles, ...rest }: DynamicStylesProps) => Promise<import("react/jsx-runtime").JSX.Element>;
+export declare const DynamicStyles: ({ as: Component, scope, styles, ...rest }: DynamicStylesProps) => Promise<import("react/jsx-runtime").JSX.Element | null>;
 export {};

package/dynamic-styles.js

@@ -1,22 +1,23 @@
-import { jsxs as m, Fragment as i, jsx as r } from "react/jsx-runtime";
-import { parseStyles as l } from "@salty-css/core/parsers";
-import { toHash as y } from "@salty-css/core/util";
-import { c as h } from "./clsx-OuTLNxxd.js";
-const p = (s) => y(s), u = (s) => `.${p(s)}`, d = async (s, a) => (await l(s, a)).join(`
-`), N = async ({ as: s, scope: a, styles: t, ...c }) => {
-  const e = await d(t, a);
+import { jsx as t, jsxs as l, Fragment as f } from "react/jsx-runtime";
+import { parseStyles as p } from "@salty-css/core/parsers";
+import { toHash as u } from "@salty-css/core/util";
+import { c as y } from "./clsx-OuTLNxxd.js";
+const d = (s) => u(s), e = async (s, a) => (await p(s, a)).join(`
+`), g = async ({ as: s, scope: a, styles: r, ...c }) => {
   if (s) {
-    const n = u(t), o = { ...c, className: h(n, c.className) };
-    return /* @__PURE__ */ m(i, { children: [
-      /* @__PURE__ */ r("style", { children: e }),
-      /* @__PURE__ */ r(s, { ...o })
+    if (!r) return /* @__PURE__ */ t(s, { ...c });
+    const n = d(r), o = await e(r, a || `.${n}`), m = { ...c, className: y(n, c.className) };
+    return /* @__PURE__ */ l(f, { children: [
+      /* @__PURE__ */ t("style", { children: o }),
+      /* @__PURE__ */ t(s, { ...m })
     ] });
   }
-  return /* @__PURE__ */ r("style", { children: e });
+  if (!r) return null;
+  const i = await e(r, a);
+  return /* @__PURE__ */ t("style", { children: i });
 };
 export {
-  N as DynamicStyles,
-  d as useDynamicStyles,
-  u as useDynamicStylesClassName,
-  p as useDynamicStylesHash
+  g as DynamicStyles,
+  d as getDynamicStylesClassName,
+  e as getDynamicStylesCss
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salty-css/react",
-  "version": "0.0.1-alpha.273",
+  "version": "0.0.1-alpha.275",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "typings": "./dist/index.d.ts",
@@ -70,7 +70,7 @@
     }
   },
   "dependencies": {
-    "@salty-css/core": "^0.0.1-alpha.273",
+    "@salty-css/core": "^0.0.1-alpha.275",
     "clsx": ">=2.x",
     "react": ">=19.x || >=18.3.x"
   }