@salty-css/react 0.0.1-alpha.183 → 0.0.1-alpha.184

package/class-name.d.ts

@@ -0,0 +1,6 @@
+import { StyledParams } from '@salty-css/core/types';
+import { ClassNameFactory } from '@salty-css/core/css';
+export declare const className: <const STYLE_PARAMS extends StyledParams>(params: STYLE_PARAMS) => string & {
+    isClassName: boolean;
+    factory: ClassNameFactory<STYLE_PARAMS>;
+};

package/className.cjs

@@ -0,0 +1 @@
+"use strict";var n=Object.defineProperty;var h=(a,s,e)=>s in a?n(a,s,{enumerable:!0,configurable:!0,writable:!0,value:e}):a[s]=e;var r=(a,s,e)=>h(a,typeof s!="symbol"?s+"":s,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./parse-styles-JzVmxd-u.cjs"),o=require("./parse-tokens-p68muVgG.cjs");class l{constructor(s){r(this,"_isProd");r(this,"_callerName");this.params=s}get hash(){return c.toHash(this.params.base||this.params)}get cssClassName(){return this.hash}get classNames(){const s=[this.hash],{className:e}=this.params;return e&&s.push(e),s.join(" ")}get cssFileName(){return this._callerName?`cl_${o.dashCase(this._callerName)}-${this.hash}.css`:`${this.hash}.css`}get css(){const{base:s={},variants:e={},compoundVariants:t=[]}=this.params,i={...s,variants:e,compoundVariants:t};return c.parseStyles(i,`.${this.cssClassName}`)}_withBuildContext(s){const{name:e,prod:t}=s;return this._isProd=t,this._callerName=e,this}}const m=a=>{const s=new l(a),e=new String(s.cssClassName);return Object.assign(e,{get isClassName(){return!0},factory:s}),e};exports.className=m;

package/className.js

@@ -0,0 +1,45 @@
+var i = Object.defineProperty;
+var h = (t, s, a) => s in t ? i(t, s, { enumerable: !0, configurable: !0, writable: !0, value: a }) : t[s] = a;
+var r = (t, s, a) => h(t, typeof s != "symbol" ? s + "" : s, a);
+import { t as n, p as o } from "./parse-styles-lB6EJuGj.js";
+import { d as m } from "./parse-tokens-YUi047xd.js";
+class l {
+  constructor(s) {
+    r(this, "_isProd");
+    r(this, "_callerName");
+    this.params = s;
+  }
+  get hash() {
+    return n(this.params.base || this.params);
+  }
+  get cssClassName() {
+    return this.hash;
+  }
+  get classNames() {
+    const s = [this.hash], { className: a } = this.params;
+    return a && s.push(a), s.join(" ");
+  }
+  get cssFileName() {
+    return this._callerName ? `cl_${m(this._callerName)}-${this.hash}.css` : `${this.hash}.css`;
+  }
+  get css() {
+    const { base: s = {}, variants: a = {}, compoundVariants: e = [] } = this.params, c = { ...s, variants: a, compoundVariants: e };
+    return o(c, `.${this.cssClassName}`);
+  }
+  _withBuildContext(s) {
+    const { name: a, prod: e } = s;
+    return this._isProd = e, this._callerName = a, this;
+  }
+}
+const g = (t) => {
+  const s = new l(t), a = new String(s.cssClassName);
+  return Object.assign(a, {
+    get isClassName() {
+      return !0;
+    },
+    factory: s
+  }), a;
+};
+export {
+  g as className
+};

package/element-factory-C7JVLDq7.js

@@ -0,0 +1,67 @@
+import { forwardRef as g, createElement as p } from "react";
+import { p as N, d as A } from "./parse-tokens-YUi047xd.js";
+function K(n) {
+  var s, e, t = "";
+  if (typeof n == "string" || typeof n == "number") t += n;
+  else if (typeof n == "object") if (Array.isArray(n)) {
+    var o = n.length;
+    for (s = 0; s < o; s++) n[s] && (e = K(n[s])) && (t && (t += " "), t += e);
+  } else for (e in n) n[e] && (t && (t += " "), t += e);
+  return t;
+}
+function R() {
+  for (var n, s, e = 0, t = "", o = arguments.length; e < o; e++) (n = arguments[e]) && (s = K(n)) && (t && (t += " "), t += s);
+  return t;
+}
+const F = ["passProps"], x = (n, s, e, t) => {
+  const j = g(({
+    extend: d = n,
+    element: S = e.element,
+    className: O = "",
+    children: $,
+    passProps: u = e.passProps,
+    _vks: c = /* @__PURE__ */ new Set(),
+    ...r
+  }, w) => {
+    const f = { passProps: u };
+    e.attr && Object.assign(f, e.attr), t && Object.assign(f, t), e.defaultProps && Object.assign(r, e.defaultProps), r && Object.assign(f, r);
+    const b = new Set(O.split(" ")), y = typeof d == "function" || typeof d == "object", h = y && "isStyled" in d, E = y ? d : S || d;
+    if (!E) throw new Error("No element provided");
+    const m = f.style || {};
+    f.style || (f.style = m), Object.entries(m).forEach(([i, a]) => {
+      const { result: l } = N(a);
+      m[i] = l;
+    }), e.propValueKeys && e.propValueKeys.forEach((i) => {
+      const a = `css-${i}`, l = r[a];
+      if (l === void 0) return;
+      const C = `--props-${A(i)}`;
+      m[C] = l, c && c.add(a);
+    }), e.variantKeys && e.variantKeys.forEach((i) => {
+      const [a, l] = i.split("=");
+      r[a] !== void 0 ? (b.add(`${a}-${r[a]}`), c && c.add(a)) : l !== void 0 && b.add(`${a}-${l}`);
+    }), c && (!y || !h) ? c.forEach((i) => {
+      if (!u) return delete f[i];
+      if (u !== !0 && !u.includes(i))
+        return delete f[i];
+    }) : h && Object.assign(f, { _vks: c }), h || F.forEach((i) => delete f[i]);
+    const V = R(s, ...b);
+    return p(
+      E,
+      {
+        element: y ? S : void 0,
+        className: V,
+        ref: w,
+        ...f
+      },
+      $
+    );
+  });
+  return Object.assign(j, {
+    isStyled: !0,
+    className: s,
+    toString: () => `.${s}`
+  }), j;
+};
+export {
+  x as e
+};

package/element-factory-D4kpeFoW.cjs

@@ -0,0 +1 @@
+"use strict";const K=require("react"),O=require("./parse-tokens-p68muVgG.cjs");function $(n){var s,e,t="";if(typeof n=="string"||typeof n=="number")t+=n;else if(typeof n=="object")if(Array.isArray(n)){var u=n.length;for(s=0;s<u;s++)n[s]&&(e=$(n[s]))&&(t&&(t+=" "),t+=e)}else for(e in n)n[e]&&(t&&(t+=" "),t+=e);return t}function q(){for(var n,s,e=0,t="",u=arguments.length;e<u;e++)(n=arguments[e])&&(s=$(n))&&(t&&(t+=" "),t+=s);return t}const A=["passProps"],F=(n,s,e,t)=>{const u=({extend:d=n,element:S=e.element,className:w="",children:V,passProps:o=e.passProps,_vks:c=new Set,...r},C)=>{const f={passProps:o};e.attr&&Object.assign(f,e.attr),t&&Object.assign(f,t),e.defaultProps&&Object.assign(r,e.defaultProps),r&&Object.assign(f,r);const b=new Set(w.split(" ")),y=typeof d=="function"||typeof d=="object",h=y&&"isStyled"in d,E=y?d:S||d;if(!E)throw new Error("No element provided");const m=f.style||{};f.style||(f.style=m),Object.entries(m).forEach(([i,a])=>{const{result:l}=O.parseValueTokens(a);m[i]=l}),e.propValueKeys&&e.propValueKeys.forEach(i=>{const a=`css-${i}`,l=r[a];if(l===void 0)return;const N=`--props-${O.dashCase(i)}`;m[N]=l,c&&c.add(a)}),e.variantKeys&&e.variantKeys.forEach(i=>{const[a,l]=i.split("=");r[a]!==void 0?(b.add(`${a}-${r[a]}`),c&&c.add(a)):l!==void 0&&b.add(`${a}-${l}`)}),c&&(!y||!h)?c.forEach(i=>{if(!o)return delete f[i];if(o!==!0&&!o.includes(i))return delete f[i]}):h&&Object.assign(f,{_vks:c}),h||A.forEach(i=>delete f[i]);const g=q(s,...b);return K.createElement(E,{element:y?S:void 0,className:g,ref:C,...f},V)},j=K.forwardRef(u);return Object.assign(j,{isStyled:!0,className:s,toString:()=>`.${s}`}),j};exports.elementFactory=F;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salty-css/react",
-  "version": "0.0.1-alpha.183",
+  "version": "0.0.1-alpha.184",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "typings": "./dist/index.d.ts",
@@ -36,6 +36,10 @@
       "import": "./styled-client.js",
       "require": "./styled-client.cjs"
     },
+    "./class-name": {
+      "import": "./class-name.js",
+      "require": "./class-name.cjs"
+    },
     "./keyframes": {
       "import": "./keyframes.js",
       "require": "./keyframes.cjs"
@@ -50,7 +54,7 @@
     }
   },
   "dependencies": {
-    "@salty-css/core": "^0.0.1-alpha.183",
+    "@salty-css/core": "^0.0.1-alpha.184",
     "clsx": ">=2.x",
     "react": ">=19.x || >=18.3.x"
   }

package/styled-client.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./element-factory-CixOWc4u.cjs"),n=(e,t,r)=>l.elementFactory(e,t,r);exports.styledClient=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./element-factory-D4kpeFoW.cjs"),n=(e,t,r)=>l.elementFactory(e,t,r);exports.styledClient=n;

package/styled-client.js

@@ -1,4 +1,4 @@
-import { e as o } from "./element-factory-CRNlgjJ5.js";
+import { e as o } from "./element-factory-C7JVLDq7.js";
 const l = (e, t, r) => o(e, t, r);
 export {
   l as styledClient

package/styled.cjs

@@ -1 +1 @@
-"use strict";var y=Object.defineProperty;var g=(e,t,s)=>t in e?y(e,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):e[t]=s;var c=(e,t,s)=>g(e,typeof t!="symbol"?t+"":t,s);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./parse-styles-JzVmxd-u.cjs"),f=require("./parse-tokens-p68muVgG.cjs"),N=require("./element-factory-CixOWc4u.cjs"),_=e=>Object.keys(e);class b{constructor(t,s){c(this,"_isProd");c(this,"_callerName");c(this,"_context");this.tagName=t,this.params=s}get hash(){return u.toHash(this.params.base||this.params)}get priority(){var t;return typeof this.tagName=="function"||typeof this.tagName=="object"?(((t=this.tagName.generator)==null?void 0:t.priority)||0)+1:0}get classNames(){const t=[this.hash],{className:s}=this.params;return s&&t.push(s),t.join(" ")}get cssClassName(){return this.hash}get cssDisplayNameVar(){return`--${this.hash}-display-name: ${this._callerName};`}get cssFileName(){return this._callerName?`c_${f.dashCase(this._callerName)}-${this.hash}-${this.priority}.css`:`${this.hash}-${this.priority}.css`}get templateKeys(){var t;return(t=this._context)!=null&&t.config.templates?_(this._context.config.templates):[]}get css(){var n;const{base:t={},variants:s={},compoundVariants:r=[]}=this.params,i={...t,variants:s,compoundVariants:r};return u.parseStyles(i,`.${this.cssClassName}`,(n=this._context)==null?void 0:n.config)}get props(){const{element:t,variants:s={},compoundVariants:r=[],defaultVariants:i={},defaultProps:p={},passProps:n}=this.params,h=new Set([]),l=a=>{const o=i[a];o!==void 0?h.add(`${a}=${String(o)}`):h.add(a)};Object.keys(s).forEach(l),r.map(a=>Object.keys(a).forEach(l));const m=new Set([]);if(this.params.base){const a=JSON.stringify(this.params.base).match(/\{props\.([\w\d]+)\}/gi);a&&a.forEach(o=>{const d=o.replace(/\{props\.([\w\d]+)\}/gi,"$1");d&&m.add(d)})}return{element:t,variantKeys:[...h],propValueKeys:[...m],passProps:n,defaultProps:p,attr:{"data-component-name":this._isProd?void 0:this._callerName}}}_withBuildContext(t){this._context=t;const{name:s,config:r,prod:i}=t;return this._isProd=i,this._callerName=s,this}}const $=(e,t)=>{const s=new b(e,t),r=N.elementFactory(e,s.cssClassName,s.props,{"data-unoptimized-client-component":!0});return Object.assign(r,{generator:s}),r};exports.styled=$;
+"use strict";var y=Object.defineProperty;var g=(e,t,s)=>t in e?y(e,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):e[t]=s;var c=(e,t,s)=>g(e,typeof t!="symbol"?t+"":t,s);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./parse-styles-JzVmxd-u.cjs"),f=require("./parse-tokens-p68muVgG.cjs"),N=require("./element-factory-D4kpeFoW.cjs"),_=e=>Object.keys(e);class b{constructor(t,s){c(this,"_isProd");c(this,"_callerName");c(this,"_context");this.tagName=t,this.params=s}get hash(){return u.toHash(this.params.base||this.params)}get priority(){var t;return typeof this.tagName=="function"||typeof this.tagName=="object"?(((t=this.tagName.generator)==null?void 0:t.priority)||0)+1:0}get classNames(){const t=[this.hash],{className:s}=this.params;return s&&t.push(s),t.join(" ")}get cssClassName(){return this.hash}get cssDisplayNameVar(){return`--${this.hash}-display-name: ${this._callerName};`}get cssFileName(){return this._callerName?`c_${f.dashCase(this._callerName)}-${this.hash}-${this.priority}.css`:`${this.hash}-${this.priority}.css`}get templateKeys(){var t;return(t=this._context)!=null&&t.config.templates?_(this._context.config.templates):[]}get css(){var n;const{base:t={},variants:s={},compoundVariants:r=[]}=this.params,i={...t,variants:s,compoundVariants:r};return u.parseStyles(i,`.${this.cssClassName}`,(n=this._context)==null?void 0:n.config)}get props(){const{element:t,variants:s={},compoundVariants:r=[],defaultVariants:i={},defaultProps:p={},passProps:n}=this.params,h=new Set([]),l=a=>{const o=i[a];o!==void 0?h.add(`${a}=${String(o)}`):h.add(a)};Object.keys(s).forEach(l),r.map(a=>Object.keys(a).forEach(l));const m=new Set([]);if(this.params.base){const a=JSON.stringify(this.params.base).match(/\{props\.([\w\d]+)\}/gi);a&&a.forEach(o=>{const d=o.replace(/\{props\.([\w\d]+)\}/gi,"$1");d&&m.add(d)})}return{element:t,variantKeys:[...h],propValueKeys:[...m],passProps:n,defaultProps:p,attr:{"data-component-name":this._isProd?void 0:this._callerName}}}_withBuildContext(t){this._context=t;const{name:s,config:r,prod:i}=t;return this._isProd=i,this._callerName=s,this}}const $=(e,t)=>{const s=new b(e,t),r=N.elementFactory(e,s.cssClassName,s.props,{"data-unoptimized-client-component":!0});return Object.assign(r,{generator:s}),r};exports.styled=$;

package/styled.js

@@ -3,7 +3,7 @@ var f = (e, s, t) => s in e ? u(e, s, { enumerable: !0, configurable: !0, writab
 var c = (e, s, t) => f(e, typeof s != "symbol" ? s + "" : s, t);
 import { t as g, p as y } from "./parse-styles-lB6EJuGj.js";
 import { d as N } from "./parse-tokens-YUi047xd.js";
-import { e as _ } from "./element-factory-CRNlgjJ5.js";
+import { e as _ } from "./element-factory-C7JVLDq7.js";
 const $ = (e) => Object.keys(e);
 class b {
   constructor(s, t) {
@@ -37,21 +37,21 @@ class b {
     return (s = this._context) != null && s.config.templates ? $(this._context.config.templates) : [];
   }
   get css() {
-    var o;
+    var n;
     const { base: s = {}, variants: t = {}, compoundVariants: r = [] } = this.params, i = { ...s, variants: t, compoundVariants: r };
-    return y(i, `.${this.cssClassName}`, (o = this._context) == null ? void 0 : o.config);
+    return y(i, `.${this.cssClassName}`, (n = this._context) == null ? void 0 : n.config);
   }
   get props() {
-    const { element: s, variants: t = {}, compoundVariants: r = [], defaultVariants: i = {}, defaultProps: p = {}, passProps: o } = this.params, h = /* @__PURE__ */ new Set([]), m = (a) => {
-      const n = i[a];
-      n !== void 0 ? h.add(`${a}=${String(n)}`) : h.add(a);
+    const { element: s, variants: t = {}, compoundVariants: r = [], defaultVariants: i = {}, defaultProps: p = {}, passProps: n } = this.params, h = /* @__PURE__ */ new Set([]), m = (a) => {
+      const o = i[a];
+      o !== void 0 ? h.add(`${a}=${String(o)}`) : h.add(a);
     };
     Object.keys(t).forEach(m), r.map((a) => Object.keys(a).forEach(m));
     const l = /* @__PURE__ */ new Set([]);
     if (this.params.base) {
       const a = JSON.stringify(this.params.base).match(/\{props\.([\w\d]+)\}/gi);
-      a && a.forEach((n) => {
-        const d = n.replace(/\{props\.([\w\d]+)\}/gi, "$1");
+      a && a.forEach((o) => {
+        const d = o.replace(/\{props\.([\w\d]+)\}/gi, "$1");
         d && l.add(d);
       });
     }
@@ -59,7 +59,7 @@ class b {
       element: s,
       variantKeys: [...h],
       propValueKeys: [...l],
-      passProps: o,
+      passProps: n,
       defaultProps: p,
       attr: {
         "data-component-name": this._isProd ? void 0 : this._callerName

package/element-factory-CRNlgjJ5.js

@@ -1,67 +0,0 @@
-import { forwardRef as C, createElement as g } from "react";
-import { p, d as N } from "./parse-tokens-YUi047xd.js";
-function K(s) {
-  var i, e, t = "";
-  if (typeof s == "string" || typeof s == "number") t += s;
-  else if (typeof s == "object") if (Array.isArray(s)) {
-    var d = s.length;
-    for (i = 0; i < d; i++) s[i] && (e = K(s[i])) && (t && (t += " "), t += e);
-  } else for (e in s) s[e] && (t && (t += " "), t += e);
-  return t;
-}
-function A() {
-  for (var s, i, e = 0, t = "", d = arguments.length; e < d; e++) (s = arguments[e]) && (i = K(s)) && (t && (t += " "), t += i);
-  return t;
-}
-const R = ["passProps"], x = (s, i, e, t) => {
-  const j = C(({
-    extend: r = s,
-    element: S = e.element,
-    className: O = "",
-    children: $,
-    passProps: u = e.passProps,
-    _vks: c = /* @__PURE__ */ new Set(),
-    ...o
-  }, w) => {
-    const f = { passProps: u };
-    e.attr && Object.assign(f, e.attr), t && Object.assign(f, t), e.defaultProps && Object.assign(o, e.defaultProps), o && Object.assign(f, o);
-    const b = new Set(O.split(" ")), y = typeof r == "function" || typeof r == "object", h = y && "isStyled" in r, E = y ? r : S || r;
-    if (!E) throw new Error("No element provided");
-    const m = f.style || {};
-    f.style || (f.style = m), Object.entries(m).forEach(([n, a]) => {
-      const { result: l } = p(a);
-      m[n] = l;
-    }), e.propValueKeys && e.propValueKeys.forEach((n) => {
-      const a = `css-${n}`, l = o[a];
-      if (l === void 0) return;
-      const v = `--props-${N(n)}`;
-      m[v] = l, c && c.add(a);
-    }), e.variantKeys && e.variantKeys.forEach((n) => {
-      const [a, l] = n.split("=");
-      o[a] !== void 0 ? (b.add(`${a}-${o[a]}`), c && c.add(a)) : l !== void 0 && b.add(`${a}-${l}`);
-    }), c && (!y || !h) ? c.forEach((n) => {
-      if (!u) return delete f[n];
-      if (u !== !0 && !u.includes(n))
-        return delete f[n];
-    }) : h && Object.assign(f, { _vks: c }), h || R.forEach((n) => delete f[n]);
-    const V = A(i, ...b);
-    return g(
-      E,
-      {
-        element: y ? S : void 0,
-        className: V,
-        ref: w,
-        ...f
-      },
-      $
-    );
-  });
-  return Object.assign(j, {
-    isStyled: !0,
-    className: i,
-    toString: () => `.${i}`
-  }), j;
-};
-export {
-  x as e
-};

package/element-factory-CixOWc4u.cjs

@@ -1 +0,0 @@
-"use strict";const K=require("react"),O=require("./parse-tokens-p68muVgG.cjs");function $(s){var n,e,t="";if(typeof s=="string"||typeof s=="number")t+=s;else if(typeof s=="object")if(Array.isArray(s)){var o=s.length;for(n=0;n<o;n++)s[n]&&(e=$(s[n]))&&(t&&(t+=" "),t+=e)}else for(e in s)s[e]&&(t&&(t+=" "),t+=e);return t}function N(){for(var s,n,e=0,t="",o=arguments.length;e<o;e++)(s=arguments[e])&&(n=$(s))&&(t&&(t+=" "),t+=n);return t}const q=["passProps"],A=(s,n,e,t)=>{const o=({extend:u=s,element:S=e.element,className:w="",children:V,passProps:d=e.passProps,_vks:c=new Set,...r},v)=>{const f={passProps:d};e.attr&&Object.assign(f,e.attr),t&&Object.assign(f,t),e.defaultProps&&Object.assign(r,e.defaultProps),r&&Object.assign(f,r);const b=new Set(w.split(" ")),y=typeof u=="function"||typeof u=="object",h=y&&"isStyled"in u,E=y?u:S||u;if(!E)throw new Error("No element provided");const m=f.style||{};f.style||(f.style=m),Object.entries(m).forEach(([i,a])=>{const{result:l}=O.parseValueTokens(a);m[i]=l}),e.propValueKeys&&e.propValueKeys.forEach(i=>{const a=`css-${i}`,l=r[a];if(l===void 0)return;const g=`--props-${O.dashCase(i)}`;m[g]=l,c&&c.add(a)}),e.variantKeys&&e.variantKeys.forEach(i=>{const[a,l]=i.split("=");r[a]!==void 0?(b.add(`${a}-${r[a]}`),c&&c.add(a)):l!==void 0&&b.add(`${a}-${l}`)}),c&&(!y||!h)?c.forEach(i=>{if(!d)return delete f[i];if(d!==!0&&!d.includes(i))return delete f[i]}):h&&Object.assign(f,{_vks:c}),h||q.forEach(i=>delete f[i]);const C=N(n,...b);return K.createElement(E,{element:y?S:void 0,className:C,ref:v,...f},V)},j=K.forwardRef(o);return Object.assign(j,{isStyled:!0,className:n,toString:()=>`.${n}`}),j};exports.elementFactory=A;