@salty-css/react 0.0.1-alpha.98 → 0.0.1

package/dynamic-styles.js

@@ -0,0 +1,29 @@
+import { jsx as s, jsxs as p, Fragment as y } from "react/jsx-runtime";
+import { parseStyles as u } from "@salty-css/core/parsers";
+import { resolveDynamicConfigCache as g } from "@salty-css/core/cache/resolve-dynamic-config-cache";
+import { toHash as d } from "@salty-css/core/util";
+import { c as h } from "./clsx-OuTLNxxd.js";
+import { createElement as C } from "react";
+const w = (t) => d(t), i = async (t, r) => {
+  const n = await g();
+  return (await u(t, r, n)).join(`
+`);
+}, E = async ({ as: t, scope: r, styles: n, ...o }) => {
+  if (t) {
+    const c = (a) => typeof t == "string" ? C(t, a) : t(a);
+    if (!n) return /* @__PURE__ */ s(c, { ...o });
+    const e = w(n), l = await i(n, r || `.${e}`), f = { ...o, className: h(e, o.className) };
+    return /* @__PURE__ */ p(y, { children: [
+      /* @__PURE__ */ s("style", { children: l }),
+      /* @__PURE__ */ s(c, { ...f })
+    ] });
+  }
+  if (!n) return null;
+  const m = await i(n, r);
+  return /* @__PURE__ */ s("style", { children: m });
+};
+export {
+  E as DynamicStyles,
+  w as getDynamicStylesClassName,
+  i as getDynamicStylesCss
+};

package/element-factory-BPI0pGIH.cjs

@@ -0,0 +1 @@
+"use strict";const S=require("react"),C=require("./clsx-C11secjj.cjs"),N=require("@salty-css/core/util"),F=require("@salty-css/core/parsers"),R=["passProps"],v=(E,y="",t={},m)=>{const K=({extend:l=E,element:h=t.element,className:O="",children:$,passProps:f=t.passProps,_vks:c=new Set,...a},w)=>{const s={passProps:f};t.attr&&Object.assign(s,t.attr),m&&Object.assign(s,m),t.defaultProps&&Object.assign(a,t.defaultProps),a&&Object.assign(s,a);const o=new Set([...y.split(" "),...O.split(" ")]),d=typeof l=="function"||typeof l=="object",r=d&&"isStyled"in l,j=d?l:h||l;if(!j)throw new Error("No element provided");const u=s.style||{};s.style||(s.style=u),Object.entries(u).forEach(([e,i])=>{const n=F.parseVariableTokens(i);n&&(u[e]=n.transformed)}),t.propValueKeys&&t.propValueKeys.forEach(e=>{const i=`css-${e}`,n=a[i];if(n===void 0)return;const q=`--props-${N.dashCase(e)}`;u[q]=n,c&&c.add(i)}),t.variantKeys&&t.variantKeys.forEach(e=>{const[i,n]=e.split("=");a[i]!==void 0?(o.add(`${i}-${a[i]}`),c&&c.add(i)):n!==void 0&&o.add(`${i}-${n}`)}),c&&(!d||!r)?c.forEach(e=>{if(!f)return delete s[e];if(f!==!0&&!f.includes(e))return delete s[e]}):r&&Object.assign(s,{_vks:c}),r||R.forEach(e=>delete s[e]);const V=C.clsx(...o);return S.createElement(j,{element:d?h:void 0,className:V,ref:w,...s},$)},b=S.forwardRef(K);return Object.assign(b,{isStyled:!0,className:y,toString:()=>`.${t.hash}`}),b};exports.elementFactory=v;

package/element-factory-D5vMsSwp.js

@@ -0,0 +1,56 @@
+import { forwardRef as V, createElement as C } from "react";
+import { c as N } from "./clsx-OuTLNxxd.js";
+import { dashCase as R } from "@salty-css/core/util";
+import { parseVariableTokens as p } from "@salty-css/core/parsers";
+const q = ["passProps"], B = (S, m = "", t = {}, y) => {
+  const b = V(({
+    extend: c = S,
+    element: h = t.element,
+    className: E = "",
+    children: K,
+    passProps: l = t.passProps,
+    _vks: n = /* @__PURE__ */ new Set(),
+    ...a
+  }, O) => {
+    const s = { passProps: l };
+    t.attr && Object.assign(s, t.attr), y && Object.assign(s, y), t.defaultProps && Object.assign(a, t.defaultProps), a && Object.assign(s, a);
+    const r = /* @__PURE__ */ new Set([...m.split(" "), ...E.split(" ")]), o = typeof c == "function" || typeof c == "object", u = o && "isStyled" in c, j = o ? c : h || c;
+    if (!j) throw new Error("No element provided");
+    const d = s.style || {};
+    s.style || (s.style = d), Object.entries(d).forEach(([e, i]) => {
+      const f = p(i);
+      f && (d[e] = f.transformed);
+    }), t.propValueKeys && t.propValueKeys.forEach((e) => {
+      const i = `css-${e}`, f = a[i];
+      if (f === void 0) return;
+      const w = `--props-${R(e)}`;
+      d[w] = f, n && n.add(i);
+    }), t.variantKeys && t.variantKeys.forEach((e) => {
+      const [i, f] = e.split("=");
+      a[i] !== void 0 ? (r.add(`${i}-${a[i]}`), n && n.add(i)) : f !== void 0 && r.add(`${i}-${f}`);
+    }), n && (!o || !u) ? n.forEach((e) => {
+      if (!l) return delete s[e];
+      if (l !== !0 && !l.includes(e))
+        return delete s[e];
+    }) : u && Object.assign(s, { _vks: n }), u || q.forEach((e) => delete s[e]);
+    const $ = N(...r);
+    return C(
+      j,
+      {
+        element: o ? h : void 0,
+        className: $,
+        ref: O,
+        ...s
+      },
+      K
+    );
+  });
+  return Object.assign(b, {
+    isStyled: !0,
+    className: m,
+    toString: () => `.${t.hash}`
+  }), b;
+};
+export {
+  B as e
+};

package/element-factory.d.ts

@@ -1,3 +1,3 @@
-import { GeneratorProps } from '@salty-css/core/generator';
 import { StyledComponentProps, Tag } from '@salty-css/core/types';
-export declare const elementFactory: (tagName: Tag<any>, _className: string, _generatorProps: GeneratorProps, _additionalProps?: Record<PropertyKey, any>) => import('react').ForwardRefExoticComponent<Omit<StyledComponentProps, "ref"> & import('react').RefAttributes<any>>;
+import { StyledGeneratorClientProps } from '@salty-css/core/generators';
+export declare const elementFactory: (tagName: Tag<any>, _className?: string, _generatorProps?: StyledGeneratorClientProps, _additionalProps?: Record<PropertyKey, any>) => import('react').ForwardRefExoticComponent<Omit<StyledComponentProps, "ref"> & import('react').RefAttributes<any>>;

package/helpers.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@salty-css/core/helpers");Object.keys(t).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});

package/helpers.d.ts

@@ -0,0 +1 @@
+export * from '@salty-css/core/helpers';

package/helpers.js

@@ -0,0 +1 @@
+export * from "@salty-css/core/helpers";

package/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@salty-css/core/css");Object.keys(t).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});

package/index.d.ts

@@ -0,0 +1 @@
+export * from '@salty-css/core/css';

package/index.js

@@ -0,0 +1 @@
+export * from "@salty-css/core/css";

package/keyframes.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./parse-styles-DjwCLt3X.cjs"),j=({animationName:m,params:l,appendInitialStyles:f,...t})=>{const r=m||u.toHash(t),o=(n={})=>{const{duration:e="500ms",easing:s="ease-in-out",delay:a="0s",iterationCount:i="1",direction:d="normal",fillMode:g="forwards",playState:p="running"}={...l,...n},c=`${r} ${e} ${s} ${a} ${i} ${d} ${g} ${p}`;if(!f)return c;const $=t.from||t["0%"];if(!$)return c;const b=u.parseStyles($,"");return`${c};${b}`},y=Object.entries(t).reduce((n,[e,s])=>{if(!s)return n;const a=u.parseStyles(s,""),i=typeof e=="number"?`${e}%`:e;return`${n}${i}{${a}}`},""),S=`@keyframes ${r} {${y}}`;return Object.assign(o,{toString:o,isKeyframes:!0,animationName:r,css:S,keyframes:t}),o};exports.keyframes=j;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@salty-css/core/css/keyframes");Object.keys(t).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});

package/keyframes.d.ts

@@ -1,22 +1 @@
-import { CssStyles, StyleValue } from '@salty-css/core/types';
-type KeyframeKeys = number | 'from' | 'to' | `${number}%`;
-type Keyframes = {
-    [key in KeyframeKeys]?: CssStyles;
-};
-interface KeyframesConfig {
-    animationName?: string;
-    appendInitialStyles?: boolean;
-    params?: KeyframesParams;
-}
-interface KeyframesParams {
-    duration?: string;
-    delay?: string;
-    iterationCount?: string | number;
-    easing?: StyleValue<'animationTimingFunction'>;
-    direction?: StyleValue<'animationDirection'>;
-    fillMode?: StyleValue<'animationFillMode'>;
-    playState?: StyleValue<'animationPlayState'>;
-}
-type KeyframesProps = Keyframes & KeyframesConfig;
-export declare const keyframes: ({ animationName: _name, params: _params, appendInitialStyles, ...keyframes }: KeyframesProps) => (params?: KeyframesParams) => string;
-export {};
+export * from '@salty-css/core/css/keyframes';

package/keyframes.js

@@ -1,33 +1 @@
-import { t as j, p as m } from "./parse-styles-CVYekczt.js";
-const N = ({ animationName: u, params: f, appendInitialStyles: l, ...t }) => {
-  const e = u || j(t), o = (s = {}) => {
-    const {
-      duration: n = "500ms",
-      easing: r = "ease-in-out",
-      delay: a = "0s",
-      iterationCount: i = "1",
-      direction: y = "normal",
-      fillMode: g = "forwards",
-      playState: S = "running"
-    } = { ...f, ...s }, $ = `${e} ${n} ${r} ${a} ${i} ${y} ${g} ${S}`;
-    if (!l) return $;
-    const c = t.from || t["0%"];
-    if (!c) return $;
-    const b = m(c, "");
-    return `${$};${b}`;
-  }, p = Object.entries(t).reduce((s, [n, r]) => {
-    if (!r) return s;
-    const a = m(r, ""), i = typeof n == "number" ? `${n}%` : n;
-    return `${s}${i}{${a}}`;
-  }, ""), d = `@keyframes ${e} {${p}}`;
-  return Object.assign(o, {
-    toString: o,
-    isKeyframes: !0,
-    animationName: e,
-    css: d,
-    keyframes: t
-  }), o;
-};
-export {
-  N as keyframes
-};
+export * from "@salty-css/core/css/keyframes";

package/media.cjs

@@ -1 +1 @@
-"use strict";var a=Object.defineProperty;var o=(s,e,t)=>e in s?a(s,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):s[e]=t;var i=(s,e,t)=>o(s,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class r{constructor(e="@media"){i(this,"next",e=>{const t=new String(e);return Object.assign(t,{get and(){return new r(`${e} and`)},get or(){return new r(`${e},`)}}),t});this.base=e}custom(e){return this.next(`${this.base} ${e}`)}minWidth(e){const t=typeof e=="number"?`${e}px`:e,n=`${this.base} (min-width: ${t})`;return this.next(n)}maxWidth(e){const t=typeof e=="number"?`${e}px`:e,n=`${this.base} (max-width: ${t})`;return this.next(n)}minHeight(e){const t=typeof e=="number"?`${e}px`:e,n=`${this.base} (min-height: ${t})`;return this.next(n)}maxHeight(e){const t=typeof e=="number"?`${e}px`:e,n=`${this.base} (max-height: ${t})`;return this.next(n)}get portrait(){const e=`${this.base} (orientation: portrait)`;return this.next(e)}get landscape(){const e=`${this.base} (orientation: landscape)`;return this.next(e)}prefersColorScheme(e){const t=`${this.base} (prefers-color-scheme: ${e})`;return this.next(t)}get dark(){return this.prefersColorScheme("dark")}get light(){return this.prefersColorScheme("light")}get print(){const e=`${this.base} print`;return this.next(e)}get screen(){const e=`${this.base} screen`;return this.next(e)}get speech(){const e=`${this.base} speech`;return this.next(e)}get all(){const e=`${this.base} all`;return this.next(e)}get not(){const e=`${this.base} not`;return this.next(e)}get reducedMotion(){const e=`${this.base} (prefers-reduced-motion: reduce)`;return this.next(e)}}const h=new r;exports.MediaQueryFactory=r;exports.media=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@salty-css/core/css/media");Object.keys(t).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});

package/media.d.ts

@@ -1,71 +1 @@
-import { OrNumber, OrString } from '@salty-css/core/types/util-types';
-export declare class MediaQueryFactory {
-    private base;
-    constructor(base?: string);
-    private next;
-    custom(value: string): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    minWidth(width: OrString | OrNumber): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    maxWidth(width: OrString | OrNumber): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    minHeight(height: OrString | OrNumber): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    maxHeight(height: OrString | OrNumber): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get portrait(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get landscape(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    prefersColorScheme(scheme: 'dark' | 'light' | OrString): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get dark(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get light(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get print(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get screen(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get speech(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get all(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get not(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-    get reducedMotion(): string & {
-        and: MediaQueryFactory;
-        or: MediaQueryFactory;
-    };
-}
-export declare const media: MediaQueryFactory;
+export * from '@salty-css/core/css/media';

package/media.js

@@ -1,85 +1 @@
-var o = Object.defineProperty;
-var a = (s, t, e) => t in s ? o(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e;
-var i = (s, t, e) => a(s, typeof t != "symbol" ? t + "" : t, e);
-class r {
-  constructor(t = "@media") {
-    i(this, "next", (t) => {
-      const e = new String(t);
-      return Object.assign(e, {
-        get and() {
-          return new r(`${t} and`);
-        },
-        get or() {
-          return new r(`${t},`);
-        }
-      }), e;
-    });
-    this.base = t;
-  }
-  custom(t) {
-    return this.next(`${this.base} ${t}`);
-  }
-  minWidth(t) {
-    const e = typeof t == "number" ? `${t}px` : t, n = `${this.base} (min-width: ${e})`;
-    return this.next(n);
-  }
-  maxWidth(t) {
-    const e = typeof t == "number" ? `${t}px` : t, n = `${this.base} (max-width: ${e})`;
-    return this.next(n);
-  }
-  minHeight(t) {
-    const e = typeof t == "number" ? `${t}px` : t, n = `${this.base} (min-height: ${e})`;
-    return this.next(n);
-  }
-  maxHeight(t) {
-    const e = typeof t == "number" ? `${t}px` : t, n = `${this.base} (max-height: ${e})`;
-    return this.next(n);
-  }
-  get portrait() {
-    const t = `${this.base} (orientation: portrait)`;
-    return this.next(t);
-  }
-  get landscape() {
-    const t = `${this.base} (orientation: landscape)`;
-    return this.next(t);
-  }
-  prefersColorScheme(t) {
-    const e = `${this.base} (prefers-color-scheme: ${t})`;
-    return this.next(e);
-  }
-  get dark() {
-    return this.prefersColorScheme("dark");
-  }
-  get light() {
-    return this.prefersColorScheme("light");
-  }
-  get print() {
-    const t = `${this.base} print`;
-    return this.next(t);
-  }
-  get screen() {
-    const t = `${this.base} screen`;
-    return this.next(t);
-  }
-  get speech() {
-    const t = `${this.base} speech`;
-    return this.next(t);
-  }
-  get all() {
-    const t = `${this.base} all`;
-    return this.next(t);
-  }
-  get not() {
-    const t = `${this.base} not`;
-    return this.next(t);
-  }
-  get reducedMotion() {
-    const t = `${this.base} (prefers-reduced-motion: reduce)`;
-    return this.next(t);
-  }
-}
-const u = new r();
-export {
-  r as MediaQueryFactory,
-  u as media
-};
+export * from "@salty-css/core/css/media";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salty-css/react",
-  "version": "0.0.1-alpha.98",
+  "version": "0.0.1",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "typings": "./dist/index.d.ts",
@@ -28,6 +28,10 @@
     "name": "react"
   },
   "exports": {
+    ".": {
+      "import": "./index.js",
+      "require": "./index.cjs"
+    },
     "./styled": {
       "import": "./styled.js",
       "require": "./styled.cjs"
@@ -36,6 +40,14 @@
       "import": "./styled-client.js",
       "require": "./styled-client.cjs"
     },
+    "./class-name": {
+      "import": "./class-name.js",
+      "require": "./class-name.cjs"
+    },
+    "./class-name-client": {
+      "import": "./class-name-client.js",
+      "require": "./class-name-client.cjs"
+    },
     "./keyframes": {
       "import": "./keyframes.js",
       "require": "./keyframes.cjs"
@@ -43,10 +55,26 @@
     "./media": {
       "import": "./media.js",
       "require": "./media.cjs"
+    },
+    "./config": {
+      "import": "./config.js",
+      "require": "./config.cjs"
+    },
+    "./helpers": {
+      "import": "./helpers.js",
+      "require": "./helpers.cjs"
+    },
+    "./dynamic-styles": {
+      "import": "./dynamic-styles.js",
+      "require": "./dynamic-styles.cjs"
+    },
+    "./runtime": {
+      "import": "./runtime.js",
+      "require": "./runtime.cjs"
     }
   },
   "dependencies": {
-    "@salty-css/core": "^0.0.1-alpha.98",
+    "@salty-css/core": "^0.0.1",
     "clsx": ">=2.x",
     "react": ">=19.x || >=18.3.x"
   }

package/runtime.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@salty-css/core/runtime");Object.keys(t).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});

package/runtime.d.ts

@@ -0,0 +1 @@
+export * from '@salty-css/core/runtime';

package/runtime.js

@@ -0,0 +1 @@
+export * from "@salty-css/core/runtime";

package/styled-client.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./element-factory-D1ozgqO7.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-BPI0pGIH.cjs"),n=(e,t,r)=>l.elementFactory(e,t,r);exports.styledClient=n;

package/styled-client.d.ts

@@ -1,3 +1,3 @@
-import { GeneratorProps } from '@salty-css/core/generator';
+import { StyledGeneratorClientProps } from '@salty-css/core/generators';
 import { Tag } from '@salty-css/core/types';
-export declare const styledClient: (tagName: Tag<any>, className: string, generatorProps: GeneratorProps) => import('react').ForwardRefExoticComponent<Omit<import('@salty-css/core/types').StyledComponentProps, "ref"> & import('react').RefAttributes<any>>;
+export declare const styledClient: (tagName: Tag<any>, className: string, generatorProps: StyledGeneratorClientProps) => import('react').ForwardRefExoticComponent<Omit<import('@salty-css/core/types').StyledComponentProps, "ref"> & import('react').RefAttributes<any>>;

package/styled-client.js

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

package/styled.cjs

@@ -1 +1 @@
-"use strict";var m=Object.defineProperty;var l=(e,t,s)=>t in e?m(e,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):e[t]=s;var o=(e,t,s)=>l(e,typeof t!="symbol"?t+"":t,s);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("./parse-styles-DjwCLt3X.cjs"),u=require("./element-factory-D1ozgqO7.cjs"),y=e=>Object.keys(e);class g{constructor(t,s){o(this,"_isProd");o(this,"_callerName");o(this,"_context");this.tagName=t,this.params=s}get hash(){return h.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 templateKeys(){var t;return(t=this._context)!=null&&t.config.templates?y(this._context.config.templates):[]}get css(){var r;const{base:t={},variants:s={},compoundVariants:a=[]}=this.params,i={...t,variants:s,compoundVariants:a};return h.parseStyles(i,`.${this.cssClassName}`,this.priority,(r=this._context)==null?void 0:r.config)}get props(){const{element:t}=this.params,s=this.params.variants?Object.keys(this.params.variants).map(r=>{var n;const c=(n=this.params.defaultVariants)==null?void 0:n[r];return c!==void 0?`${r}=${String(c)}`:r}):void 0,a=new Set([]),i=/\{props\.([\w\d]+)\}/gi.exec(JSON.stringify(this.params.base));return i&&i.forEach((r,c,n)=>{const p=n.at(1);p&&a.add(p)}),{element:t,variantKeys:s,propValueKeys:[...a],attr:{"data-component-name":this._isProd?void 0:this._callerName}}}_withBuildContext(t){this._context=t;const{name:s,config:a,prod:i}=t;return this._isProd=i,this._callerName=s,this}}const d=(e,t)=>{const s=new g(e,t),a=u.elementFactory(e,s.cssClassName,s.props,{"data-unoptimized-client-component":!0});return Object.assign(a,{generator:s}),a};exports.styled=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@salty-css/core/generators"),s=require("./element-factory-BPI0pGIH.cjs"),c=(t,r)=>{const e=new o.StyledGenerator(t,r),n=s.elementFactory(t,e.cssClassName,e.clientProps,{"data-unoptimized-client-component":!0});return Object.assign(n,{generator:e}),n};exports.styled=c;

package/styled.d.ts

@@ -1,5 +1,5 @@
 import { AllHTMLAttributes, JSX, ReactNode } from 'react';
-import { Tag, StyledComponentProps, CreateElementProps, VariantProps, ParentComponentProps, StyledParams, ValueProps } from '@salty-css/core/types';
-export declare const styled: <const PROPS extends StyledComponentProps, const TAG extends Tag<Required<PROPS>>, const STYLE_PARAMS extends StyledParams>(tagName: TAG, params: STYLE_PARAMS) => ((props: (CreateElementProps & ParentComponentProps<TAG>) | (TAG extends string ? {
-    ref: any;
-} : never) | VariantProps<STYLE_PARAMS> | ValueProps | (TAG extends keyof JSX.IntrinsicElements ? JSX.IntrinsicElements[TAG] : TAG extends string ? AllHTMLAttributes<HTMLElement> : never)) => ReactNode) & string;
+import { Tag, StyledComponentProps, CreateElementProps, VariantProps, ParentComponentProps, StyledParams, ValueProps, Merge } from '@salty-css/core/types';
+export declare const styled: <const PROPS extends StyledComponentProps, const TAG extends Tag<Required<PROPS>>, const STYLE_PARAMS extends StyledParams>(tagName: TAG, params: STYLE_PARAMS) => ((props: CreateElementProps & (TAG extends string ? {
+    ref?: any;
+} : object) & Merge<ParentComponentProps<TAG> | VariantProps<STYLE_PARAMS>> & ValueProps & Omit<TAG extends keyof JSX.IntrinsicElements ? JSX.IntrinsicElements[TAG] : TAG extends string ? AllHTMLAttributes<HTMLElement> : object, keyof CreateElementProps>) => ReactNode) & string;

package/styled.js

@@ -1,74 +1,13 @@
-var m = Object.defineProperty;
-var h = (e, t, s) => t in e ? m(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s;
-var o = (e, t, s) => h(e, typeof t != "symbol" ? t + "" : t, s);
-import { t as l, p as u } from "./parse-styles-CVYekczt.js";
-import { e as g } from "./element-factory-Dupolv6C.js";
-const y = (e) => Object.keys(e);
-class d {
-  constructor(t, s) {
-    o(this, "_isProd");
-    o(this, "_callerName");
-    o(this, "_context");
-    this.tagName = t, this.params = s;
-  }
-  get hash() {
-    return l(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 templateKeys() {
-    var t;
-    return (t = this._context) != null && t.config.templates ? y(this._context.config.templates) : [];
-  }
-  get css() {
-    var r;
-    const { base: t = {}, variants: s = {}, compoundVariants: a = [] } = this.params, i = { ...t, variants: s, compoundVariants: a };
-    return u(i, `.${this.cssClassName}`, this.priority, (r = this._context) == null ? void 0 : r.config);
-  }
-  get props() {
-    const { element: t } = this.params, s = this.params.variants ? Object.keys(this.params.variants).map((r) => {
-      var n;
-      const c = (n = this.params.defaultVariants) == null ? void 0 : n[r];
-      return c !== void 0 ? `${r}=${String(c)}` : r;
-    }) : void 0, a = /* @__PURE__ */ new Set([]), i = /\{props\.([\w\d]+)\}/gi.exec(JSON.stringify(this.params.base));
-    return i && i.forEach((r, c, n) => {
-      const p = n.at(1);
-      p && a.add(p);
-    }), {
-      element: t,
-      variantKeys: s,
-      propValueKeys: [...a],
-      attr: {
-        "data-component-name": this._isProd ? void 0 : this._callerName
-      }
-    };
-  }
-  _withBuildContext(t) {
-    this._context = t;
-    const { name: s, config: a, prod: i } = t;
-    return this._isProd = i, this._callerName = s, this;
-  }
-}
-const v = (e, t) => {
-  const s = new d(e, t), a = g(e, s.cssClassName, s.props, {
+import { StyledGenerator as r } from "@salty-css/core/generators";
+import { e as s } from "./element-factory-D5vMsSwp.js";
+const i = (t, o) => {
+  const e = new r(t, o), n = s(t, e.cssClassName, e.clientProps, {
     "data-unoptimized-client-component": !0
   });
-  return Object.assign(a, {
-    generator: s
-  }), a;
+  return Object.assign(n, {
+    generator: e
+  }), n;
 };
 export {
-  v as styled
+  i as styled
 };

package/element-factory-D1ozgqO7.cjs

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

package/element-factory-Dupolv6C.js

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