@pandacss/shared 0.0.0-dev-20221121152823
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE.md +21 -0
- package/dist/index.d.ts +55 -0
- package/dist/index.js +411 -0
- package/dist/index.mjs +353 -0
- package/dist/shared.d.ts +1 -0
- package/dist/shared.js +157 -0
- package/dist/shared.mjs +123 -0
- package/dist/walk-styles-a10346e4.d.ts +38 -0
- package/package.json +21 -0
package/LICENSE.md
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2022 Segun Adebayo
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { W as WalkObjectStopFn } from './walk-styles-a10346e4.js';
|
|
2
|
+
export { M as MappedObject, d as WalkObjectOptions, W as WalkObjectStopFn, c as createCss, f as filterBaseConditions, i as isBaseCondition, a as isImportant, m as mapObject, t as toHash, e as walkObject, g as walkStyles, w as withoutImportant, b as withoutSpace } from './walk-styles-a10346e4.js';
|
|
3
|
+
|
|
4
|
+
declare const isString: (v: any) => v is string;
|
|
5
|
+
declare type AnyFunction = (...args: any[]) => any;
|
|
6
|
+
declare const isFunction: (v: any) => v is AnyFunction;
|
|
7
|
+
declare function isObject(value: any): value is Record<string, any>;
|
|
8
|
+
|
|
9
|
+
declare type Operand = string | number | {
|
|
10
|
+
ref: string;
|
|
11
|
+
};
|
|
12
|
+
declare const calc: {
|
|
13
|
+
negate(x: Operand): string;
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
declare const capitalize: (s: string) => string;
|
|
17
|
+
declare const dashCase: (s: string) => string;
|
|
18
|
+
declare const uncapitalize: (s: string) => string;
|
|
19
|
+
|
|
20
|
+
declare function compact<T extends Record<string, any>>(value: T): T;
|
|
21
|
+
|
|
22
|
+
declare function getUnit(value?: string): string | undefined;
|
|
23
|
+
declare function toPx(value?: string | number): string | undefined;
|
|
24
|
+
declare function toEm(value?: string, fontSize?: number): string | undefined;
|
|
25
|
+
declare function toRem(value?: string): string | undefined;
|
|
26
|
+
|
|
27
|
+
declare type CssVar = {
|
|
28
|
+
var: `--${string}`;
|
|
29
|
+
ref: string;
|
|
30
|
+
};
|
|
31
|
+
declare type CssVarOptions = {
|
|
32
|
+
fallback?: string;
|
|
33
|
+
prefix?: string;
|
|
34
|
+
};
|
|
35
|
+
declare function cssVar(name: string, options?: CssVarOptions): CssVar;
|
|
36
|
+
|
|
37
|
+
declare function esc(str: string): string;
|
|
38
|
+
|
|
39
|
+
declare function flatten(values: Record<string, Record<string, any>>, stop?: WalkObjectStopFn): Record<string, any>;
|
|
40
|
+
|
|
41
|
+
declare const memo: <T extends (...args: any[]) => any>(fn: T) => T;
|
|
42
|
+
|
|
43
|
+
declare function splitBy(value: string, separator?: string): string[];
|
|
44
|
+
declare function splitDotPath(path: string): string[];
|
|
45
|
+
declare function getNegativePath(path: string[]): string[];
|
|
46
|
+
declare function getDotPath(obj: any, path: string, fallback?: any): any;
|
|
47
|
+
|
|
48
|
+
declare type MapToRecord<K extends Map<string, any>> = {
|
|
49
|
+
[P in keyof K]: K[P] extends Map<string, infer V> ? Record<string, V> : never;
|
|
50
|
+
};
|
|
51
|
+
declare function mapToJson<T extends Map<string, any>>(map: T): MapToRecord<T>;
|
|
52
|
+
|
|
53
|
+
declare function unionType(values: IterableIterator<string> | string[]): string;
|
|
54
|
+
|
|
55
|
+
export { CssVar, CssVarOptions, calc, capitalize, compact, cssVar, dashCase, esc, flatten, getDotPath, getNegativePath, getUnit, isFunction, isObject, isString, mapToJson, memo, splitBy, splitDotPath, toEm, toPx, toRem, uncapitalize, unionType };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,411 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/index.ts
|
|
21
|
+
var src_exports = {};
|
|
22
|
+
__export(src_exports, {
|
|
23
|
+
calc: () => calc,
|
|
24
|
+
capitalize: () => capitalize,
|
|
25
|
+
compact: () => compact,
|
|
26
|
+
createCss: () => createCss,
|
|
27
|
+
cssVar: () => cssVar,
|
|
28
|
+
dashCase: () => dashCase,
|
|
29
|
+
esc: () => esc2,
|
|
30
|
+
filterBaseConditions: () => filterBaseConditions,
|
|
31
|
+
flatten: () => flatten,
|
|
32
|
+
getDotPath: () => getDotPath,
|
|
33
|
+
getNegativePath: () => getNegativePath,
|
|
34
|
+
getUnit: () => getUnit,
|
|
35
|
+
isBaseCondition: () => isBaseCondition,
|
|
36
|
+
isFunction: () => isFunction,
|
|
37
|
+
isImportant: () => isImportant,
|
|
38
|
+
isObject: () => isObject,
|
|
39
|
+
isString: () => isString,
|
|
40
|
+
mapObject: () => mapObject,
|
|
41
|
+
mapToJson: () => mapToJson,
|
|
42
|
+
memo: () => memo,
|
|
43
|
+
splitBy: () => splitBy,
|
|
44
|
+
splitDotPath: () => splitDotPath,
|
|
45
|
+
toEm: () => toEm,
|
|
46
|
+
toHash: () => toHash,
|
|
47
|
+
toPx: () => toPx,
|
|
48
|
+
toRem: () => toRem,
|
|
49
|
+
uncapitalize: () => uncapitalize,
|
|
50
|
+
unionType: () => unionType,
|
|
51
|
+
walkObject: () => walkObject,
|
|
52
|
+
walkStyles: () => walkStyles,
|
|
53
|
+
withoutImportant: () => withoutImportant,
|
|
54
|
+
withoutSpace: () => withoutSpace
|
|
55
|
+
});
|
|
56
|
+
module.exports = __toCommonJS(src_exports);
|
|
57
|
+
|
|
58
|
+
// src/assert.ts
|
|
59
|
+
var isString = (v) => typeof v === "string";
|
|
60
|
+
var isFunction = (v) => typeof v === "function";
|
|
61
|
+
function isObject(value) {
|
|
62
|
+
return typeof value === "object" && value !== null && !Array.isArray(value);
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
// src/calc.ts
|
|
66
|
+
function isCssVar(value) {
|
|
67
|
+
return isObject(value) && "ref" in value;
|
|
68
|
+
}
|
|
69
|
+
function getRef(operand) {
|
|
70
|
+
return isCssVar(operand) ? operand.ref : operand.toString();
|
|
71
|
+
}
|
|
72
|
+
var toExpression = (operator, ...operands) => operands.map(getRef).join(` ${operator} `).replace(/calc/g, "");
|
|
73
|
+
var multiply = (...operands) => `calc(${toExpression("*", ...operands)})`;
|
|
74
|
+
var calc = {
|
|
75
|
+
negate(x) {
|
|
76
|
+
const value = getRef(x);
|
|
77
|
+
if (value != null && !Number.isNaN(parseFloat(value))) {
|
|
78
|
+
return String(value).startsWith("-") ? String(value).slice(1) : `-${value}`;
|
|
79
|
+
}
|
|
80
|
+
return multiply(value, -1);
|
|
81
|
+
}
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
// src/capitalize.ts
|
|
85
|
+
var capitalize = (s) => s.charAt(0).toUpperCase() + s.slice(1);
|
|
86
|
+
var dashCase = (s) => s.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
|
|
87
|
+
var uncapitalize = (s) => s.charAt(0).toLowerCase() + s.slice(1);
|
|
88
|
+
|
|
89
|
+
// src/css-important.ts
|
|
90
|
+
function isImportant(value) {
|
|
91
|
+
return typeof value === "string" ? /!(important)?$/.test(value) : false;
|
|
92
|
+
}
|
|
93
|
+
function withoutImportant(value) {
|
|
94
|
+
return typeof value === "string" ? value.replace(/!(important)?$/, "").trim() : value;
|
|
95
|
+
}
|
|
96
|
+
function withoutSpace(str) {
|
|
97
|
+
return typeof str === "string" ? str.replaceAll(" ", "_") : str;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
// src/condition.ts
|
|
101
|
+
var isBaseCondition = (c) => /^(base|_)$/.test(c);
|
|
102
|
+
function filterBaseConditions(c) {
|
|
103
|
+
return c.slice().filter((v) => !isBaseCondition(v));
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
// src/hash.ts
|
|
107
|
+
function toChar(code) {
|
|
108
|
+
return String.fromCharCode(code + (code > 25 ? 39 : 97));
|
|
109
|
+
}
|
|
110
|
+
function toName(code) {
|
|
111
|
+
let name = "";
|
|
112
|
+
let x;
|
|
113
|
+
for (x = Math.abs(code); x > 52; x = x / 52 | 0)
|
|
114
|
+
name = toChar(x % 52) + name;
|
|
115
|
+
return toChar(x % 52) + name;
|
|
116
|
+
}
|
|
117
|
+
function toPhash(h, x) {
|
|
118
|
+
let i = x.length;
|
|
119
|
+
while (i)
|
|
120
|
+
h = h * 33 ^ x.charCodeAt(--i);
|
|
121
|
+
return h;
|
|
122
|
+
}
|
|
123
|
+
function toHash(value) {
|
|
124
|
+
return toName(toPhash(5381, value) >>> 0);
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
// src/walk-object.ts
|
|
128
|
+
function walkObject(target, predicate, options = {}) {
|
|
129
|
+
const { stop, getKey } = options;
|
|
130
|
+
function inner(value, path = []) {
|
|
131
|
+
if (isObject(value) || Array.isArray(value)) {
|
|
132
|
+
const result = {};
|
|
133
|
+
for (const [prop, child] of Object.entries(value)) {
|
|
134
|
+
const key = getKey?.(prop) ?? prop;
|
|
135
|
+
const childPath = [...path, key];
|
|
136
|
+
if (stop?.(value, childPath)) {
|
|
137
|
+
return predicate(value, path);
|
|
138
|
+
}
|
|
139
|
+
result[key] = inner(child, childPath);
|
|
140
|
+
}
|
|
141
|
+
return result;
|
|
142
|
+
}
|
|
143
|
+
return predicate(value, path);
|
|
144
|
+
}
|
|
145
|
+
return inner(target);
|
|
146
|
+
}
|
|
147
|
+
function mapObject(obj, fn) {
|
|
148
|
+
if (!isObject(obj))
|
|
149
|
+
return fn(obj);
|
|
150
|
+
return walkObject(obj, (value) => fn(value));
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
// src/walk-styles.ts
|
|
154
|
+
function walkStyles(obj, fn, scopes = []) {
|
|
155
|
+
const { selectors = {}, "@media": mediaQueries = {}, "@container": containerQueries = {}, ...baseStyles } = obj;
|
|
156
|
+
fn(baseStyles, scopes);
|
|
157
|
+
for (const [selector, selectorStyles] of Object.entries(selectors)) {
|
|
158
|
+
walkStyles(selectorStyles, fn, [...scopes, selector]);
|
|
159
|
+
}
|
|
160
|
+
for (const [mediaQuery, mediaQueryStyles] of Object.entries(mediaQueries)) {
|
|
161
|
+
walkStyles(mediaQueryStyles, fn, [...scopes, `@media ${mediaQuery}`]);
|
|
162
|
+
}
|
|
163
|
+
for (const [containerQuery, containerQueryStyles] of Object.entries(containerQueries)) {
|
|
164
|
+
walkStyles(containerQueryStyles, fn, [...scopes, `@container ${containerQuery}`]);
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
// src/classname.ts
|
|
169
|
+
function createCss(context) {
|
|
170
|
+
const { transform, hash, conditions: conds = { shift: (v) => v }, resolveShorthand, hasShorthand } = context;
|
|
171
|
+
return (styleObject) => {
|
|
172
|
+
const normalizedObject = hasShorthand ? walkObject(styleObject, (v) => v, { getKey: resolveShorthand }) : styleObject;
|
|
173
|
+
const classNames = /* @__PURE__ */ new Set();
|
|
174
|
+
walkStyles(normalizedObject, (props, scope) => {
|
|
175
|
+
walkObject(props, (value, paths) => {
|
|
176
|
+
const important = isImportant(value);
|
|
177
|
+
if (value == null)
|
|
178
|
+
return;
|
|
179
|
+
const [prop, ...allConditions] = conds.shift(paths);
|
|
180
|
+
const conditions = filterBaseConditions(allConditions);
|
|
181
|
+
const transformed = transform(prop, withoutImportant(value));
|
|
182
|
+
let transformedClassName = transformed.className;
|
|
183
|
+
if (important) {
|
|
184
|
+
transformedClassName = `${transformedClassName}!`;
|
|
185
|
+
}
|
|
186
|
+
const baseArray = [...conditions, transformedClassName];
|
|
187
|
+
if (scope && scope.length > 0) {
|
|
188
|
+
baseArray.unshift(`[${withoutSpace(scope.join("__"))}]`);
|
|
189
|
+
}
|
|
190
|
+
const className = hash ? toHash(baseArray.join(":")) : baseArray.join(":");
|
|
191
|
+
classNames.add(className);
|
|
192
|
+
});
|
|
193
|
+
});
|
|
194
|
+
return Array.from(classNames).join(" ");
|
|
195
|
+
};
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
// src/compact.ts
|
|
199
|
+
function compact(value) {
|
|
200
|
+
return Object.fromEntries(Object.entries(value).filter(([_, value2]) => value2 !== void 0));
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
// src/css-unit.ts
|
|
204
|
+
var BASE_FONT_SIZE = 16;
|
|
205
|
+
var UNIT_PX = "px";
|
|
206
|
+
var UNIT_EM = "em";
|
|
207
|
+
var UNIT_REM = "rem";
|
|
208
|
+
function getUnit(value = "") {
|
|
209
|
+
const DIGIT_REGEX = new RegExp(String.raw`-?\d+(?:\.\d+|\d*)`);
|
|
210
|
+
const UNIT_REGEX = new RegExp(`${UNIT_PX}|${UNIT_EM}|${UNIT_REM}`);
|
|
211
|
+
const unit = value.match(new RegExp(`${DIGIT_REGEX.source}(${UNIT_REGEX.source})`));
|
|
212
|
+
return unit?.[1];
|
|
213
|
+
}
|
|
214
|
+
function toPx(value = "") {
|
|
215
|
+
if (typeof value === "number") {
|
|
216
|
+
return `${value}px`;
|
|
217
|
+
}
|
|
218
|
+
const unit = getUnit(value);
|
|
219
|
+
if (!unit)
|
|
220
|
+
return value;
|
|
221
|
+
if (unit === UNIT_PX) {
|
|
222
|
+
return value;
|
|
223
|
+
}
|
|
224
|
+
if (unit === UNIT_EM || unit === UNIT_REM) {
|
|
225
|
+
return `${parseFloat(value) * BASE_FONT_SIZE}${UNIT_PX}`;
|
|
226
|
+
}
|
|
227
|
+
}
|
|
228
|
+
function toEm(value = "", fontSize = BASE_FONT_SIZE) {
|
|
229
|
+
const unit = getUnit(value);
|
|
230
|
+
if (!unit)
|
|
231
|
+
return value;
|
|
232
|
+
if (unit === UNIT_EM) {
|
|
233
|
+
return value;
|
|
234
|
+
}
|
|
235
|
+
if (unit === UNIT_PX) {
|
|
236
|
+
return `${parseFloat(value) / fontSize}${UNIT_EM}`;
|
|
237
|
+
}
|
|
238
|
+
if (unit === UNIT_REM) {
|
|
239
|
+
return `${parseFloat(value) * BASE_FONT_SIZE / fontSize}${UNIT_EM}`;
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
function toRem(value = "") {
|
|
243
|
+
const unit = getUnit(value);
|
|
244
|
+
if (!unit)
|
|
245
|
+
return value;
|
|
246
|
+
if (unit === UNIT_REM) {
|
|
247
|
+
return value;
|
|
248
|
+
}
|
|
249
|
+
if (unit === UNIT_EM) {
|
|
250
|
+
return `${parseFloat(value)}${UNIT_REM}`;
|
|
251
|
+
}
|
|
252
|
+
if (unit === UNIT_PX) {
|
|
253
|
+
return `${parseFloat(value) / BASE_FONT_SIZE}${UNIT_REM}`;
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
// src/css-var.ts
|
|
258
|
+
function esc(string) {
|
|
259
|
+
return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
|
260
|
+
}
|
|
261
|
+
function dashCase2(string) {
|
|
262
|
+
return string.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
|
|
263
|
+
}
|
|
264
|
+
function cssVar(name, options = {}) {
|
|
265
|
+
const { fallback = "", prefix = "" } = options;
|
|
266
|
+
const variable = dashCase2(["-", prefix, esc(name)].filter(Boolean).join("-"));
|
|
267
|
+
const result = {
|
|
268
|
+
var: variable,
|
|
269
|
+
ref: `var(${variable}${fallback ? `, ${fallback}` : ""})`
|
|
270
|
+
};
|
|
271
|
+
return result;
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
// src/esc.ts
|
|
275
|
+
function esc2(str) {
|
|
276
|
+
return "".replace.call(str, /(^[^_a-zA-Z\u00a0-\uffff]|[^-_a-zA-Z0-9\u00a0-\uffff])/g, "\\$1");
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
// src/flatten.ts
|
|
280
|
+
function flatten(values, stop) {
|
|
281
|
+
const result = {};
|
|
282
|
+
walkObject(
|
|
283
|
+
values,
|
|
284
|
+
(token, paths) => {
|
|
285
|
+
result[paths.join(".")] = token.value;
|
|
286
|
+
},
|
|
287
|
+
{
|
|
288
|
+
stop: stop ?? ((v) => {
|
|
289
|
+
return isObject(v) && "value" in v;
|
|
290
|
+
})
|
|
291
|
+
}
|
|
292
|
+
);
|
|
293
|
+
return result;
|
|
294
|
+
}
|
|
295
|
+
|
|
296
|
+
// src/memo.ts
|
|
297
|
+
var memo = (fn) => {
|
|
298
|
+
const cache = /* @__PURE__ */ new Map();
|
|
299
|
+
const get = (...args) => {
|
|
300
|
+
const key = JSON.stringify(args);
|
|
301
|
+
if (cache.has(key)) {
|
|
302
|
+
return cache.get(key);
|
|
303
|
+
}
|
|
304
|
+
const result = fn(...args);
|
|
305
|
+
cache.set(key, result);
|
|
306
|
+
return result;
|
|
307
|
+
};
|
|
308
|
+
return get;
|
|
309
|
+
};
|
|
310
|
+
|
|
311
|
+
// src/split.ts
|
|
312
|
+
function splitBy(value, separator = ",") {
|
|
313
|
+
const result = [];
|
|
314
|
+
let current = "";
|
|
315
|
+
let depth = 0;
|
|
316
|
+
for (let i = 0; i < value.length; i++) {
|
|
317
|
+
const char = value[i];
|
|
318
|
+
if (char === "(") {
|
|
319
|
+
depth++;
|
|
320
|
+
} else if (char === ")") {
|
|
321
|
+
depth--;
|
|
322
|
+
} else if (char === separator && depth === 0) {
|
|
323
|
+
result.push(current);
|
|
324
|
+
current = "";
|
|
325
|
+
continue;
|
|
326
|
+
}
|
|
327
|
+
current += char;
|
|
328
|
+
}
|
|
329
|
+
result.push(current);
|
|
330
|
+
return result;
|
|
331
|
+
}
|
|
332
|
+
function splitDotPath(path) {
|
|
333
|
+
return path.split(".").reduce((acc, curr) => {
|
|
334
|
+
const last = acc[acc.length - 1];
|
|
335
|
+
if (last != null && !isNaN(Number(last)) && !isNaN(Number(curr))) {
|
|
336
|
+
acc[acc.length - 1] = `${last}.${curr}`;
|
|
337
|
+
} else {
|
|
338
|
+
acc.push(curr);
|
|
339
|
+
}
|
|
340
|
+
return acc;
|
|
341
|
+
}, []);
|
|
342
|
+
}
|
|
343
|
+
function getNegativePath(path) {
|
|
344
|
+
return path.slice(0, -1).concat(`-${path.at(-1)}`);
|
|
345
|
+
}
|
|
346
|
+
function getDotPath(obj, path, fallback) {
|
|
347
|
+
const idx = path.indexOf(".");
|
|
348
|
+
if (idx === -1) {
|
|
349
|
+
return obj?.[path] ?? fallback;
|
|
350
|
+
}
|
|
351
|
+
const key = path.slice(0, idx);
|
|
352
|
+
const nextPath = path.slice(idx + 1);
|
|
353
|
+
const checkValue = obj?.[key]?.[nextPath];
|
|
354
|
+
if (checkValue) {
|
|
355
|
+
return checkValue;
|
|
356
|
+
}
|
|
357
|
+
return getDotPath(obj?.[key], nextPath, fallback) ?? fallback;
|
|
358
|
+
}
|
|
359
|
+
|
|
360
|
+
// src/to-json.ts
|
|
361
|
+
function mapToJson(map) {
|
|
362
|
+
const obj = {};
|
|
363
|
+
map.forEach((value, key) => {
|
|
364
|
+
if (value instanceof Map) {
|
|
365
|
+
obj[key] = Object.fromEntries(value);
|
|
366
|
+
} else {
|
|
367
|
+
obj[key] = value;
|
|
368
|
+
}
|
|
369
|
+
});
|
|
370
|
+
return obj;
|
|
371
|
+
}
|
|
372
|
+
|
|
373
|
+
// src/typegen.ts
|
|
374
|
+
function unionType(values) {
|
|
375
|
+
return Array.from(values).map((value) => JSON.stringify(value)).join(" | ");
|
|
376
|
+
}
|
|
377
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
378
|
+
0 && (module.exports = {
|
|
379
|
+
calc,
|
|
380
|
+
capitalize,
|
|
381
|
+
compact,
|
|
382
|
+
createCss,
|
|
383
|
+
cssVar,
|
|
384
|
+
dashCase,
|
|
385
|
+
esc,
|
|
386
|
+
filterBaseConditions,
|
|
387
|
+
flatten,
|
|
388
|
+
getDotPath,
|
|
389
|
+
getNegativePath,
|
|
390
|
+
getUnit,
|
|
391
|
+
isBaseCondition,
|
|
392
|
+
isFunction,
|
|
393
|
+
isImportant,
|
|
394
|
+
isObject,
|
|
395
|
+
isString,
|
|
396
|
+
mapObject,
|
|
397
|
+
mapToJson,
|
|
398
|
+
memo,
|
|
399
|
+
splitBy,
|
|
400
|
+
splitDotPath,
|
|
401
|
+
toEm,
|
|
402
|
+
toHash,
|
|
403
|
+
toPx,
|
|
404
|
+
toRem,
|
|
405
|
+
uncapitalize,
|
|
406
|
+
unionType,
|
|
407
|
+
walkObject,
|
|
408
|
+
walkStyles,
|
|
409
|
+
withoutImportant,
|
|
410
|
+
withoutSpace
|
|
411
|
+
});
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,353 @@
|
|
|
1
|
+
// src/assert.ts
|
|
2
|
+
var isString = (v) => typeof v === "string";
|
|
3
|
+
var isFunction = (v) => typeof v === "function";
|
|
4
|
+
function isObject(value) {
|
|
5
|
+
return typeof value === "object" && value !== null && !Array.isArray(value);
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
// src/calc.ts
|
|
9
|
+
function isCssVar(value) {
|
|
10
|
+
return isObject(value) && "ref" in value;
|
|
11
|
+
}
|
|
12
|
+
function getRef(operand) {
|
|
13
|
+
return isCssVar(operand) ? operand.ref : operand.toString();
|
|
14
|
+
}
|
|
15
|
+
var toExpression = (operator, ...operands) => operands.map(getRef).join(` ${operator} `).replace(/calc/g, "");
|
|
16
|
+
var multiply = (...operands) => `calc(${toExpression("*", ...operands)})`;
|
|
17
|
+
var calc = {
|
|
18
|
+
negate(x) {
|
|
19
|
+
const value = getRef(x);
|
|
20
|
+
if (value != null && !Number.isNaN(parseFloat(value))) {
|
|
21
|
+
return String(value).startsWith("-") ? String(value).slice(1) : `-${value}`;
|
|
22
|
+
}
|
|
23
|
+
return multiply(value, -1);
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
// src/capitalize.ts
|
|
28
|
+
var capitalize = (s) => s.charAt(0).toUpperCase() + s.slice(1);
|
|
29
|
+
var dashCase = (s) => s.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
|
|
30
|
+
var uncapitalize = (s) => s.charAt(0).toLowerCase() + s.slice(1);
|
|
31
|
+
|
|
32
|
+
// src/css-important.ts
|
|
33
|
+
function isImportant(value) {
|
|
34
|
+
return typeof value === "string" ? /!(important)?$/.test(value) : false;
|
|
35
|
+
}
|
|
36
|
+
function withoutImportant(value) {
|
|
37
|
+
return typeof value === "string" ? value.replace(/!(important)?$/, "").trim() : value;
|
|
38
|
+
}
|
|
39
|
+
function withoutSpace(str) {
|
|
40
|
+
return typeof str === "string" ? str.replaceAll(" ", "_") : str;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
// src/condition.ts
|
|
44
|
+
var isBaseCondition = (c) => /^(base|_)$/.test(c);
|
|
45
|
+
function filterBaseConditions(c) {
|
|
46
|
+
return c.slice().filter((v) => !isBaseCondition(v));
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
// src/hash.ts
|
|
50
|
+
function toChar(code) {
|
|
51
|
+
return String.fromCharCode(code + (code > 25 ? 39 : 97));
|
|
52
|
+
}
|
|
53
|
+
function toName(code) {
|
|
54
|
+
let name = "";
|
|
55
|
+
let x;
|
|
56
|
+
for (x = Math.abs(code); x > 52; x = x / 52 | 0)
|
|
57
|
+
name = toChar(x % 52) + name;
|
|
58
|
+
return toChar(x % 52) + name;
|
|
59
|
+
}
|
|
60
|
+
function toPhash(h, x) {
|
|
61
|
+
let i = x.length;
|
|
62
|
+
while (i)
|
|
63
|
+
h = h * 33 ^ x.charCodeAt(--i);
|
|
64
|
+
return h;
|
|
65
|
+
}
|
|
66
|
+
function toHash(value) {
|
|
67
|
+
return toName(toPhash(5381, value) >>> 0);
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
// src/walk-object.ts
|
|
71
|
+
function walkObject(target, predicate, options = {}) {
|
|
72
|
+
const { stop, getKey } = options;
|
|
73
|
+
function inner(value, path = []) {
|
|
74
|
+
if (isObject(value) || Array.isArray(value)) {
|
|
75
|
+
const result = {};
|
|
76
|
+
for (const [prop, child] of Object.entries(value)) {
|
|
77
|
+
const key = getKey?.(prop) ?? prop;
|
|
78
|
+
const childPath = [...path, key];
|
|
79
|
+
if (stop?.(value, childPath)) {
|
|
80
|
+
return predicate(value, path);
|
|
81
|
+
}
|
|
82
|
+
result[key] = inner(child, childPath);
|
|
83
|
+
}
|
|
84
|
+
return result;
|
|
85
|
+
}
|
|
86
|
+
return predicate(value, path);
|
|
87
|
+
}
|
|
88
|
+
return inner(target);
|
|
89
|
+
}
|
|
90
|
+
function mapObject(obj, fn) {
|
|
91
|
+
if (!isObject(obj))
|
|
92
|
+
return fn(obj);
|
|
93
|
+
return walkObject(obj, (value) => fn(value));
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
// src/walk-styles.ts
|
|
97
|
+
function walkStyles(obj, fn, scopes = []) {
|
|
98
|
+
const { selectors = {}, "@media": mediaQueries = {}, "@container": containerQueries = {}, ...baseStyles } = obj;
|
|
99
|
+
fn(baseStyles, scopes);
|
|
100
|
+
for (const [selector, selectorStyles] of Object.entries(selectors)) {
|
|
101
|
+
walkStyles(selectorStyles, fn, [...scopes, selector]);
|
|
102
|
+
}
|
|
103
|
+
for (const [mediaQuery, mediaQueryStyles] of Object.entries(mediaQueries)) {
|
|
104
|
+
walkStyles(mediaQueryStyles, fn, [...scopes, `@media ${mediaQuery}`]);
|
|
105
|
+
}
|
|
106
|
+
for (const [containerQuery, containerQueryStyles] of Object.entries(containerQueries)) {
|
|
107
|
+
walkStyles(containerQueryStyles, fn, [...scopes, `@container ${containerQuery}`]);
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
// src/classname.ts
|
|
112
|
+
function createCss(context) {
|
|
113
|
+
const { transform, hash, conditions: conds = { shift: (v) => v }, resolveShorthand, hasShorthand } = context;
|
|
114
|
+
return (styleObject) => {
|
|
115
|
+
const normalizedObject = hasShorthand ? walkObject(styleObject, (v) => v, { getKey: resolveShorthand }) : styleObject;
|
|
116
|
+
const classNames = /* @__PURE__ */ new Set();
|
|
117
|
+
walkStyles(normalizedObject, (props, scope) => {
|
|
118
|
+
walkObject(props, (value, paths) => {
|
|
119
|
+
const important = isImportant(value);
|
|
120
|
+
if (value == null)
|
|
121
|
+
return;
|
|
122
|
+
const [prop, ...allConditions] = conds.shift(paths);
|
|
123
|
+
const conditions = filterBaseConditions(allConditions);
|
|
124
|
+
const transformed = transform(prop, withoutImportant(value));
|
|
125
|
+
let transformedClassName = transformed.className;
|
|
126
|
+
if (important) {
|
|
127
|
+
transformedClassName = `${transformedClassName}!`;
|
|
128
|
+
}
|
|
129
|
+
const baseArray = [...conditions, transformedClassName];
|
|
130
|
+
if (scope && scope.length > 0) {
|
|
131
|
+
baseArray.unshift(`[${withoutSpace(scope.join("__"))}]`);
|
|
132
|
+
}
|
|
133
|
+
const className = hash ? toHash(baseArray.join(":")) : baseArray.join(":");
|
|
134
|
+
classNames.add(className);
|
|
135
|
+
});
|
|
136
|
+
});
|
|
137
|
+
return Array.from(classNames).join(" ");
|
|
138
|
+
};
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
// src/compact.ts
|
|
142
|
+
function compact(value) {
|
|
143
|
+
return Object.fromEntries(Object.entries(value).filter(([_, value2]) => value2 !== void 0));
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
// src/css-unit.ts
|
|
147
|
+
var BASE_FONT_SIZE = 16;
|
|
148
|
+
var UNIT_PX = "px";
|
|
149
|
+
var UNIT_EM = "em";
|
|
150
|
+
var UNIT_REM = "rem";
|
|
151
|
+
function getUnit(value = "") {
|
|
152
|
+
const DIGIT_REGEX = new RegExp(String.raw`-?\d+(?:\.\d+|\d*)`);
|
|
153
|
+
const UNIT_REGEX = new RegExp(`${UNIT_PX}|${UNIT_EM}|${UNIT_REM}`);
|
|
154
|
+
const unit = value.match(new RegExp(`${DIGIT_REGEX.source}(${UNIT_REGEX.source})`));
|
|
155
|
+
return unit?.[1];
|
|
156
|
+
}
|
|
157
|
+
function toPx(value = "") {
|
|
158
|
+
if (typeof value === "number") {
|
|
159
|
+
return `${value}px`;
|
|
160
|
+
}
|
|
161
|
+
const unit = getUnit(value);
|
|
162
|
+
if (!unit)
|
|
163
|
+
return value;
|
|
164
|
+
if (unit === UNIT_PX) {
|
|
165
|
+
return value;
|
|
166
|
+
}
|
|
167
|
+
if (unit === UNIT_EM || unit === UNIT_REM) {
|
|
168
|
+
return `${parseFloat(value) * BASE_FONT_SIZE}${UNIT_PX}`;
|
|
169
|
+
}
|
|
170
|
+
}
|
|
171
|
+
function toEm(value = "", fontSize = BASE_FONT_SIZE) {
|
|
172
|
+
const unit = getUnit(value);
|
|
173
|
+
if (!unit)
|
|
174
|
+
return value;
|
|
175
|
+
if (unit === UNIT_EM) {
|
|
176
|
+
return value;
|
|
177
|
+
}
|
|
178
|
+
if (unit === UNIT_PX) {
|
|
179
|
+
return `${parseFloat(value) / fontSize}${UNIT_EM}`;
|
|
180
|
+
}
|
|
181
|
+
if (unit === UNIT_REM) {
|
|
182
|
+
return `${parseFloat(value) * BASE_FONT_SIZE / fontSize}${UNIT_EM}`;
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
function toRem(value = "") {
|
|
186
|
+
const unit = getUnit(value);
|
|
187
|
+
if (!unit)
|
|
188
|
+
return value;
|
|
189
|
+
if (unit === UNIT_REM) {
|
|
190
|
+
return value;
|
|
191
|
+
}
|
|
192
|
+
if (unit === UNIT_EM) {
|
|
193
|
+
return `${parseFloat(value)}${UNIT_REM}`;
|
|
194
|
+
}
|
|
195
|
+
if (unit === UNIT_PX) {
|
|
196
|
+
return `${parseFloat(value) / BASE_FONT_SIZE}${UNIT_REM}`;
|
|
197
|
+
}
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
// src/css-var.ts
|
|
201
|
+
function esc(string) {
|
|
202
|
+
return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
|
203
|
+
}
|
|
204
|
+
function dashCase2(string) {
|
|
205
|
+
return string.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
|
|
206
|
+
}
|
|
207
|
+
function cssVar(name, options = {}) {
|
|
208
|
+
const { fallback = "", prefix = "" } = options;
|
|
209
|
+
const variable = dashCase2(["-", prefix, esc(name)].filter(Boolean).join("-"));
|
|
210
|
+
const result = {
|
|
211
|
+
var: variable,
|
|
212
|
+
ref: `var(${variable}${fallback ? `, ${fallback}` : ""})`
|
|
213
|
+
};
|
|
214
|
+
return result;
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
// src/esc.ts
|
|
218
|
+
function esc2(str) {
|
|
219
|
+
return "".replace.call(str, /(^[^_a-zA-Z\u00a0-\uffff]|[^-_a-zA-Z0-9\u00a0-\uffff])/g, "\\$1");
|
|
220
|
+
}
|
|
221
|
+
|
|
222
|
+
// src/flatten.ts
|
|
223
|
+
function flatten(values, stop) {
|
|
224
|
+
const result = {};
|
|
225
|
+
walkObject(
|
|
226
|
+
values,
|
|
227
|
+
(token, paths) => {
|
|
228
|
+
result[paths.join(".")] = token.value;
|
|
229
|
+
},
|
|
230
|
+
{
|
|
231
|
+
stop: stop ?? ((v) => {
|
|
232
|
+
return isObject(v) && "value" in v;
|
|
233
|
+
})
|
|
234
|
+
}
|
|
235
|
+
);
|
|
236
|
+
return result;
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
// src/memo.ts
|
|
240
|
+
var memo = (fn) => {
|
|
241
|
+
const cache = /* @__PURE__ */ new Map();
|
|
242
|
+
const get = (...args) => {
|
|
243
|
+
const key = JSON.stringify(args);
|
|
244
|
+
if (cache.has(key)) {
|
|
245
|
+
return cache.get(key);
|
|
246
|
+
}
|
|
247
|
+
const result = fn(...args);
|
|
248
|
+
cache.set(key, result);
|
|
249
|
+
return result;
|
|
250
|
+
};
|
|
251
|
+
return get;
|
|
252
|
+
};
|
|
253
|
+
|
|
254
|
+
// src/split.ts
|
|
255
|
+
function splitBy(value, separator = ",") {
|
|
256
|
+
const result = [];
|
|
257
|
+
let current = "";
|
|
258
|
+
let depth = 0;
|
|
259
|
+
for (let i = 0; i < value.length; i++) {
|
|
260
|
+
const char = value[i];
|
|
261
|
+
if (char === "(") {
|
|
262
|
+
depth++;
|
|
263
|
+
} else if (char === ")") {
|
|
264
|
+
depth--;
|
|
265
|
+
} else if (char === separator && depth === 0) {
|
|
266
|
+
result.push(current);
|
|
267
|
+
current = "";
|
|
268
|
+
continue;
|
|
269
|
+
}
|
|
270
|
+
current += char;
|
|
271
|
+
}
|
|
272
|
+
result.push(current);
|
|
273
|
+
return result;
|
|
274
|
+
}
|
|
275
|
+
function splitDotPath(path) {
|
|
276
|
+
return path.split(".").reduce((acc, curr) => {
|
|
277
|
+
const last = acc[acc.length - 1];
|
|
278
|
+
if (last != null && !isNaN(Number(last)) && !isNaN(Number(curr))) {
|
|
279
|
+
acc[acc.length - 1] = `${last}.${curr}`;
|
|
280
|
+
} else {
|
|
281
|
+
acc.push(curr);
|
|
282
|
+
}
|
|
283
|
+
return acc;
|
|
284
|
+
}, []);
|
|
285
|
+
}
|
|
286
|
+
function getNegativePath(path) {
|
|
287
|
+
return path.slice(0, -1).concat(`-${path.at(-1)}`);
|
|
288
|
+
}
|
|
289
|
+
function getDotPath(obj, path, fallback) {
|
|
290
|
+
const idx = path.indexOf(".");
|
|
291
|
+
if (idx === -1) {
|
|
292
|
+
return obj?.[path] ?? fallback;
|
|
293
|
+
}
|
|
294
|
+
const key = path.slice(0, idx);
|
|
295
|
+
const nextPath = path.slice(idx + 1);
|
|
296
|
+
const checkValue = obj?.[key]?.[nextPath];
|
|
297
|
+
if (checkValue) {
|
|
298
|
+
return checkValue;
|
|
299
|
+
}
|
|
300
|
+
return getDotPath(obj?.[key], nextPath, fallback) ?? fallback;
|
|
301
|
+
}
|
|
302
|
+
|
|
303
|
+
// src/to-json.ts
|
|
304
|
+
function mapToJson(map) {
|
|
305
|
+
const obj = {};
|
|
306
|
+
map.forEach((value, key) => {
|
|
307
|
+
if (value instanceof Map) {
|
|
308
|
+
obj[key] = Object.fromEntries(value);
|
|
309
|
+
} else {
|
|
310
|
+
obj[key] = value;
|
|
311
|
+
}
|
|
312
|
+
});
|
|
313
|
+
return obj;
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
// src/typegen.ts
|
|
317
|
+
function unionType(values) {
|
|
318
|
+
return Array.from(values).map((value) => JSON.stringify(value)).join(" | ");
|
|
319
|
+
}
|
|
320
|
+
export {
|
|
321
|
+
calc,
|
|
322
|
+
capitalize,
|
|
323
|
+
compact,
|
|
324
|
+
createCss,
|
|
325
|
+
cssVar,
|
|
326
|
+
dashCase,
|
|
327
|
+
esc2 as esc,
|
|
328
|
+
filterBaseConditions,
|
|
329
|
+
flatten,
|
|
330
|
+
getDotPath,
|
|
331
|
+
getNegativePath,
|
|
332
|
+
getUnit,
|
|
333
|
+
isBaseCondition,
|
|
334
|
+
isFunction,
|
|
335
|
+
isImportant,
|
|
336
|
+
isObject,
|
|
337
|
+
isString,
|
|
338
|
+
mapObject,
|
|
339
|
+
mapToJson,
|
|
340
|
+
memo,
|
|
341
|
+
splitBy,
|
|
342
|
+
splitDotPath,
|
|
343
|
+
toEm,
|
|
344
|
+
toHash,
|
|
345
|
+
toPx,
|
|
346
|
+
toRem,
|
|
347
|
+
uncapitalize,
|
|
348
|
+
unionType,
|
|
349
|
+
walkObject,
|
|
350
|
+
walkStyles,
|
|
351
|
+
withoutImportant,
|
|
352
|
+
withoutSpace
|
|
353
|
+
};
|
package/dist/shared.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { M as MappedObject, d as WalkObjectOptions, W as WalkObjectStopFn, c as createCss, f as filterBaseConditions, i as isBaseCondition, m as mapObject, t as toHash, e as walkObject, g as walkStyles, b as withoutSpace } from './walk-styles-a10346e4.js';
|
package/dist/shared.js
ADDED
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/shared.ts
|
|
21
|
+
var shared_exports = {};
|
|
22
|
+
__export(shared_exports, {
|
|
23
|
+
createCss: () => createCss,
|
|
24
|
+
filterBaseConditions: () => filterBaseConditions,
|
|
25
|
+
isBaseCondition: () => isBaseCondition,
|
|
26
|
+
mapObject: () => mapObject,
|
|
27
|
+
toHash: () => toHash,
|
|
28
|
+
walkObject: () => walkObject,
|
|
29
|
+
walkStyles: () => walkStyles,
|
|
30
|
+
withoutSpace: () => withoutSpace
|
|
31
|
+
});
|
|
32
|
+
module.exports = __toCommonJS(shared_exports);
|
|
33
|
+
|
|
34
|
+
// src/condition.ts
|
|
35
|
+
var isBaseCondition = (c) => /^(base|_)$/.test(c);
|
|
36
|
+
function filterBaseConditions(c) {
|
|
37
|
+
return c.slice().filter((v) => !isBaseCondition(v));
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
// src/css-important.ts
|
|
41
|
+
function isImportant(value) {
|
|
42
|
+
return typeof value === "string" ? /!(important)?$/.test(value) : false;
|
|
43
|
+
}
|
|
44
|
+
function withoutImportant(value) {
|
|
45
|
+
return typeof value === "string" ? value.replace(/!(important)?$/, "").trim() : value;
|
|
46
|
+
}
|
|
47
|
+
function withoutSpace(str) {
|
|
48
|
+
return typeof str === "string" ? str.replaceAll(" ", "_") : str;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
// src/hash.ts
|
|
52
|
+
function toChar(code) {
|
|
53
|
+
return String.fromCharCode(code + (code > 25 ? 39 : 97));
|
|
54
|
+
}
|
|
55
|
+
function toName(code) {
|
|
56
|
+
let name = "";
|
|
57
|
+
let x;
|
|
58
|
+
for (x = Math.abs(code); x > 52; x = x / 52 | 0)
|
|
59
|
+
name = toChar(x % 52) + name;
|
|
60
|
+
return toChar(x % 52) + name;
|
|
61
|
+
}
|
|
62
|
+
function toPhash(h, x) {
|
|
63
|
+
let i = x.length;
|
|
64
|
+
while (i)
|
|
65
|
+
h = h * 33 ^ x.charCodeAt(--i);
|
|
66
|
+
return h;
|
|
67
|
+
}
|
|
68
|
+
function toHash(value) {
|
|
69
|
+
return toName(toPhash(5381, value) >>> 0);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
// src/assert.ts
|
|
73
|
+
function isObject(value) {
|
|
74
|
+
return typeof value === "object" && value !== null && !Array.isArray(value);
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
// src/walk-object.ts
|
|
78
|
+
function walkObject(target, predicate, options = {}) {
|
|
79
|
+
const { stop, getKey } = options;
|
|
80
|
+
function inner(value, path = []) {
|
|
81
|
+
if (isObject(value) || Array.isArray(value)) {
|
|
82
|
+
const result = {};
|
|
83
|
+
for (const [prop, child] of Object.entries(value)) {
|
|
84
|
+
const key = getKey?.(prop) ?? prop;
|
|
85
|
+
const childPath = [...path, key];
|
|
86
|
+
if (stop?.(value, childPath)) {
|
|
87
|
+
return predicate(value, path);
|
|
88
|
+
}
|
|
89
|
+
result[key] = inner(child, childPath);
|
|
90
|
+
}
|
|
91
|
+
return result;
|
|
92
|
+
}
|
|
93
|
+
return predicate(value, path);
|
|
94
|
+
}
|
|
95
|
+
return inner(target);
|
|
96
|
+
}
|
|
97
|
+
function mapObject(obj, fn) {
|
|
98
|
+
if (!isObject(obj))
|
|
99
|
+
return fn(obj);
|
|
100
|
+
return walkObject(obj, (value) => fn(value));
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
// src/walk-styles.ts
|
|
104
|
+
function walkStyles(obj, fn, scopes = []) {
|
|
105
|
+
const { selectors = {}, "@media": mediaQueries = {}, "@container": containerQueries = {}, ...baseStyles } = obj;
|
|
106
|
+
fn(baseStyles, scopes);
|
|
107
|
+
for (const [selector, selectorStyles] of Object.entries(selectors)) {
|
|
108
|
+
walkStyles(selectorStyles, fn, [...scopes, selector]);
|
|
109
|
+
}
|
|
110
|
+
for (const [mediaQuery, mediaQueryStyles] of Object.entries(mediaQueries)) {
|
|
111
|
+
walkStyles(mediaQueryStyles, fn, [...scopes, `@media ${mediaQuery}`]);
|
|
112
|
+
}
|
|
113
|
+
for (const [containerQuery, containerQueryStyles] of Object.entries(containerQueries)) {
|
|
114
|
+
walkStyles(containerQueryStyles, fn, [...scopes, `@container ${containerQuery}`]);
|
|
115
|
+
}
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
// src/classname.ts
|
|
119
|
+
function createCss(context) {
|
|
120
|
+
const { transform, hash, conditions: conds = { shift: (v) => v }, resolveShorthand, hasShorthand } = context;
|
|
121
|
+
return (styleObject) => {
|
|
122
|
+
const normalizedObject = hasShorthand ? walkObject(styleObject, (v) => v, { getKey: resolveShorthand }) : styleObject;
|
|
123
|
+
const classNames = /* @__PURE__ */ new Set();
|
|
124
|
+
walkStyles(normalizedObject, (props, scope) => {
|
|
125
|
+
walkObject(props, (value, paths) => {
|
|
126
|
+
const important = isImportant(value);
|
|
127
|
+
if (value == null)
|
|
128
|
+
return;
|
|
129
|
+
const [prop, ...allConditions] = conds.shift(paths);
|
|
130
|
+
const conditions = filterBaseConditions(allConditions);
|
|
131
|
+
const transformed = transform(prop, withoutImportant(value));
|
|
132
|
+
let transformedClassName = transformed.className;
|
|
133
|
+
if (important) {
|
|
134
|
+
transformedClassName = `${transformedClassName}!`;
|
|
135
|
+
}
|
|
136
|
+
const baseArray = [...conditions, transformedClassName];
|
|
137
|
+
if (scope && scope.length > 0) {
|
|
138
|
+
baseArray.unshift(`[${withoutSpace(scope.join("__"))}]`);
|
|
139
|
+
}
|
|
140
|
+
const className = hash ? toHash(baseArray.join(":")) : baseArray.join(":");
|
|
141
|
+
classNames.add(className);
|
|
142
|
+
});
|
|
143
|
+
});
|
|
144
|
+
return Array.from(classNames).join(" ");
|
|
145
|
+
};
|
|
146
|
+
}
|
|
147
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
148
|
+
0 && (module.exports = {
|
|
149
|
+
createCss,
|
|
150
|
+
filterBaseConditions,
|
|
151
|
+
isBaseCondition,
|
|
152
|
+
mapObject,
|
|
153
|
+
toHash,
|
|
154
|
+
walkObject,
|
|
155
|
+
walkStyles,
|
|
156
|
+
withoutSpace
|
|
157
|
+
});
|
package/dist/shared.mjs
ADDED
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
// src/condition.ts
|
|
2
|
+
var isBaseCondition = (c) => /^(base|_)$/.test(c);
|
|
3
|
+
function filterBaseConditions(c) {
|
|
4
|
+
return c.slice().filter((v) => !isBaseCondition(v));
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
// src/css-important.ts
|
|
8
|
+
function isImportant(value) {
|
|
9
|
+
return typeof value === "string" ? /!(important)?$/.test(value) : false;
|
|
10
|
+
}
|
|
11
|
+
function withoutImportant(value) {
|
|
12
|
+
return typeof value === "string" ? value.replace(/!(important)?$/, "").trim() : value;
|
|
13
|
+
}
|
|
14
|
+
function withoutSpace(str) {
|
|
15
|
+
return typeof str === "string" ? str.replaceAll(" ", "_") : str;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
// src/hash.ts
|
|
19
|
+
function toChar(code) {
|
|
20
|
+
return String.fromCharCode(code + (code > 25 ? 39 : 97));
|
|
21
|
+
}
|
|
22
|
+
function toName(code) {
|
|
23
|
+
let name = "";
|
|
24
|
+
let x;
|
|
25
|
+
for (x = Math.abs(code); x > 52; x = x / 52 | 0)
|
|
26
|
+
name = toChar(x % 52) + name;
|
|
27
|
+
return toChar(x % 52) + name;
|
|
28
|
+
}
|
|
29
|
+
function toPhash(h, x) {
|
|
30
|
+
let i = x.length;
|
|
31
|
+
while (i)
|
|
32
|
+
h = h * 33 ^ x.charCodeAt(--i);
|
|
33
|
+
return h;
|
|
34
|
+
}
|
|
35
|
+
function toHash(value) {
|
|
36
|
+
return toName(toPhash(5381, value) >>> 0);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
// src/assert.ts
|
|
40
|
+
function isObject(value) {
|
|
41
|
+
return typeof value === "object" && value !== null && !Array.isArray(value);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
// src/walk-object.ts
|
|
45
|
+
function walkObject(target, predicate, options = {}) {
|
|
46
|
+
const { stop, getKey } = options;
|
|
47
|
+
function inner(value, path = []) {
|
|
48
|
+
if (isObject(value) || Array.isArray(value)) {
|
|
49
|
+
const result = {};
|
|
50
|
+
for (const [prop, child] of Object.entries(value)) {
|
|
51
|
+
const key = getKey?.(prop) ?? prop;
|
|
52
|
+
const childPath = [...path, key];
|
|
53
|
+
if (stop?.(value, childPath)) {
|
|
54
|
+
return predicate(value, path);
|
|
55
|
+
}
|
|
56
|
+
result[key] = inner(child, childPath);
|
|
57
|
+
}
|
|
58
|
+
return result;
|
|
59
|
+
}
|
|
60
|
+
return predicate(value, path);
|
|
61
|
+
}
|
|
62
|
+
return inner(target);
|
|
63
|
+
}
|
|
64
|
+
function mapObject(obj, fn) {
|
|
65
|
+
if (!isObject(obj))
|
|
66
|
+
return fn(obj);
|
|
67
|
+
return walkObject(obj, (value) => fn(value));
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
// src/walk-styles.ts
|
|
71
|
+
function walkStyles(obj, fn, scopes = []) {
|
|
72
|
+
const { selectors = {}, "@media": mediaQueries = {}, "@container": containerQueries = {}, ...baseStyles } = obj;
|
|
73
|
+
fn(baseStyles, scopes);
|
|
74
|
+
for (const [selector, selectorStyles] of Object.entries(selectors)) {
|
|
75
|
+
walkStyles(selectorStyles, fn, [...scopes, selector]);
|
|
76
|
+
}
|
|
77
|
+
for (const [mediaQuery, mediaQueryStyles] of Object.entries(mediaQueries)) {
|
|
78
|
+
walkStyles(mediaQueryStyles, fn, [...scopes, `@media ${mediaQuery}`]);
|
|
79
|
+
}
|
|
80
|
+
for (const [containerQuery, containerQueryStyles] of Object.entries(containerQueries)) {
|
|
81
|
+
walkStyles(containerQueryStyles, fn, [...scopes, `@container ${containerQuery}`]);
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
// src/classname.ts
|
|
86
|
+
function createCss(context) {
|
|
87
|
+
const { transform, hash, conditions: conds = { shift: (v) => v }, resolveShorthand, hasShorthand } = context;
|
|
88
|
+
return (styleObject) => {
|
|
89
|
+
const normalizedObject = hasShorthand ? walkObject(styleObject, (v) => v, { getKey: resolveShorthand }) : styleObject;
|
|
90
|
+
const classNames = /* @__PURE__ */ new Set();
|
|
91
|
+
walkStyles(normalizedObject, (props, scope) => {
|
|
92
|
+
walkObject(props, (value, paths) => {
|
|
93
|
+
const important = isImportant(value);
|
|
94
|
+
if (value == null)
|
|
95
|
+
return;
|
|
96
|
+
const [prop, ...allConditions] = conds.shift(paths);
|
|
97
|
+
const conditions = filterBaseConditions(allConditions);
|
|
98
|
+
const transformed = transform(prop, withoutImportant(value));
|
|
99
|
+
let transformedClassName = transformed.className;
|
|
100
|
+
if (important) {
|
|
101
|
+
transformedClassName = `${transformedClassName}!`;
|
|
102
|
+
}
|
|
103
|
+
const baseArray = [...conditions, transformedClassName];
|
|
104
|
+
if (scope && scope.length > 0) {
|
|
105
|
+
baseArray.unshift(`[${withoutSpace(scope.join("__"))}]`);
|
|
106
|
+
}
|
|
107
|
+
const className = hash ? toHash(baseArray.join(":")) : baseArray.join(":");
|
|
108
|
+
classNames.add(className);
|
|
109
|
+
});
|
|
110
|
+
});
|
|
111
|
+
return Array.from(classNames).join(" ");
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
export {
|
|
115
|
+
createCss,
|
|
116
|
+
filterBaseConditions,
|
|
117
|
+
isBaseCondition,
|
|
118
|
+
mapObject,
|
|
119
|
+
toHash,
|
|
120
|
+
walkObject,
|
|
121
|
+
walkStyles,
|
|
122
|
+
withoutSpace
|
|
123
|
+
};
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
declare type Context = {
|
|
2
|
+
hasShorthand: boolean;
|
|
3
|
+
resolveShorthand: (prop: string) => string;
|
|
4
|
+
transform: (prop: string, value: any) => {
|
|
5
|
+
className: string;
|
|
6
|
+
};
|
|
7
|
+
hash?: boolean;
|
|
8
|
+
conditions?: {
|
|
9
|
+
shift: (paths: string[]) => string[];
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
declare function createCss(context: Context): (styleObject: Record<string, any>) => string;
|
|
13
|
+
|
|
14
|
+
declare const isBaseCondition: (c: string) => boolean;
|
|
15
|
+
declare function filterBaseConditions(c: string[]): string[];
|
|
16
|
+
|
|
17
|
+
declare function isImportant(value: string): boolean;
|
|
18
|
+
declare function withoutImportant(value: string): string;
|
|
19
|
+
declare function withoutSpace(str: string): string;
|
|
20
|
+
|
|
21
|
+
declare type Predicate<R = any> = (value: any, path: string[]) => R;
|
|
22
|
+
declare type MappedObject<T, K> = {
|
|
23
|
+
[Prop in keyof T]: T[Prop] extends Array<any> ? MappedObject<T[Prop][number], K>[] : T[Prop] extends Record<string, unknown> ? MappedObject<T[Prop], K> : K;
|
|
24
|
+
};
|
|
25
|
+
declare type WalkObjectStopFn = (value: any, path: string[]) => boolean;
|
|
26
|
+
declare type WalkObjectOptions = {
|
|
27
|
+
stop?: WalkObjectStopFn;
|
|
28
|
+
getKey?(prop: string): string;
|
|
29
|
+
};
|
|
30
|
+
declare function walkObject<T, K>(target: T, predicate: Predicate<K>, options?: WalkObjectOptions): MappedObject<T, ReturnType<Predicate<K>>>;
|
|
31
|
+
declare function mapObject(obj: any, fn: (value: any) => any): any;
|
|
32
|
+
|
|
33
|
+
declare function toHash(value: string): string;
|
|
34
|
+
|
|
35
|
+
declare type Dict = Record<string, any>;
|
|
36
|
+
declare function walkStyles(obj: Dict, fn: (style: Dict, scope?: string[]) => void, scopes?: string[]): void;
|
|
37
|
+
|
|
38
|
+
export { MappedObject as M, WalkObjectStopFn as W, isImportant as a, withoutSpace as b, createCss as c, WalkObjectOptions as d, walkObject as e, filterBaseConditions as f, walkStyles as g, isBaseCondition as i, mapObject as m, toHash as t, withoutImportant as w };
|
package/package.json
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@pandacss/shared",
|
|
3
|
+
"version": "0.0.0-dev-20221121152823",
|
|
4
|
+
"description": "Shared utilities for css panda",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.mjs",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"author": "Segun Adebayo <joseshegs@gmail.com>",
|
|
9
|
+
"sideEffects": false,
|
|
10
|
+
"publishConfig": {
|
|
11
|
+
"access": "public"
|
|
12
|
+
},
|
|
13
|
+
"files": [
|
|
14
|
+
"dist"
|
|
15
|
+
],
|
|
16
|
+
"scripts": {
|
|
17
|
+
"build": "tsup --dts",
|
|
18
|
+
"build-fast": "tsup --no-dts",
|
|
19
|
+
"dev": "pnpm build-fast --watch"
|
|
20
|
+
}
|
|
21
|
+
}
|