purse-styles 0.1.0 → 0.1.2
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/dist/index.d.ts +1 -1
- package/dist/index.js +19 -2
- package/dist/index.js.map +1 -1
- package/dist/purse.d.ts +3 -2
- package/package.json +2 -2
- package/src/index.ts +1 -0
- package/src/purse.test.ts +38 -0
- package/src/purse.tsx +35 -9
package/dist/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { CSSProperties, InMemoryStyleApi, PurseProvider, StyleApi, StyleElement, createInMemoryStyleApi, style, useInjectGlobalStyles, useStyles, } from "./purse";
|
|
1
|
+
export { CSSProperties, InMemoryStyleApi, PurseProvider, StyleApi, StyleArgument, StyleElement, createInMemoryStyleApi, style, useInjectGlobalStyles, useStyles, } from "./purse";
|
package/dist/index.js
CHANGED
|
@@ -111,10 +111,24 @@ var UNITLESS_NUMBER_PROPS = [
|
|
|
111
111
|
"stroke-opacity",
|
|
112
112
|
"stroke-width"
|
|
113
113
|
];
|
|
114
|
+
var VENDOR_PREFIXES = ["-webkit-", "-moz-", "-ms-", "-o-"];
|
|
115
|
+
function isUnitlessNumberProperty(kebabProperty) {
|
|
116
|
+
if (UNITLESS_NUMBER_PROPS.includes(kebabProperty)) {
|
|
117
|
+
return true;
|
|
118
|
+
}
|
|
119
|
+
for (const prefix of VENDOR_PREFIXES) {
|
|
120
|
+
if (!kebabProperty.startsWith(prefix)) continue;
|
|
121
|
+
const unprefixed = kebabProperty.slice(prefix.length);
|
|
122
|
+
if (UNITLESS_NUMBER_PROPS.includes(unprefixed)) {
|
|
123
|
+
return true;
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
return false;
|
|
127
|
+
}
|
|
114
128
|
var PurseContext = createContext(void 0);
|
|
115
129
|
var __style__ = Symbol("style-element");
|
|
116
130
|
function isStyleElement(o) {
|
|
117
|
-
return "__style__" in o && o["__style__"] === __style__;
|
|
131
|
+
return o != null && typeof o === "object" && "__style__" in o && o["__style__"] === __style__;
|
|
118
132
|
}
|
|
119
133
|
var DEV = true;
|
|
120
134
|
function createInMemoryStyleApi() {
|
|
@@ -276,7 +290,7 @@ function PurseProvider(props) {
|
|
|
276
290
|
function compileDeclarations(declarations) {
|
|
277
291
|
return entries(declarations).map(([camelCaseProperty, value]) => {
|
|
278
292
|
const kebabProperty = hyphenateStyleName(camelCaseProperty);
|
|
279
|
-
const needToAddPixelsUnit = typeof value === "number" && !
|
|
293
|
+
const needToAddPixelsUnit = typeof value === "number" && !isUnitlessNumberProperty(kebabProperty);
|
|
280
294
|
if (needToAddPixelsUnit) {
|
|
281
295
|
return `${kebabProperty}:${value}px;`;
|
|
282
296
|
} else {
|
|
@@ -364,6 +378,9 @@ function style(...styleElementsOrCSS) {
|
|
|
364
378
|
let composed = [];
|
|
365
379
|
let cssPropertyGroups = [];
|
|
366
380
|
for (const styleElementOrCSS of styleElementsOrCSS) {
|
|
381
|
+
if (styleElementOrCSS == null || styleElementOrCSS === false) {
|
|
382
|
+
continue;
|
|
383
|
+
}
|
|
367
384
|
if (isStyleElement(styleElementOrCSS)) {
|
|
368
385
|
composed.push(styleElementOrCSS);
|
|
369
386
|
} else {
|
package/dist/index.js.map
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/purse.tsx", "../src/clsx.ts", "../src/destructors.ts", "../src/hashObject.ts", "../src/hyphenateStyleName.ts", "../src/useRequiredContext.tsx"],
|
|
4
|
-
"mappings": ";AACA,SAAS,SAAS,UAAU,iBAAiB;AAC7C;AAAA,EAEC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;;;ACRA,SAAS,QAAQ,YAAmD;AAC1E,SAAO,WAAW,OAAO,OAAO,EAAE,KAAK,GAAG;AAC3C;;;ACAO,SAAS,gBAAgB,aAA2B;AAC1D,SAAO,MAAM;AACZ,gBAAY,QAAQ,CAAC,eAAe,WAAW,CAAC;AAAA,EACjD;AACD;;;ACNA,SAAS,iBAAiB,MAAc;AACvC,SAAO,OAAO,aAAa,QAAQ,OAAO,KAAK,KAAK,GAAG;AACxD;AAEA,SAAS,iBAAiB,MAAc;AACvC,MAAI,OAAO;AACX,MAAI;AAEJ,OAAK,IAAI,KAAK,IAAI,IAAI,GAAG,IAAI,IAAI,IAAK,IAAI,KAAM;AAC/C,WAAO,iBAAiB,IAAI,EAAE,IAAI;AAEnC,SAAO,iBAAiB,IAAI,EAAE,IAAI;AACnC;AAEA,SAAS,QAAQ,GAAW,GAAW;AACtC,MAAI,IAAI,EAAE;AACV,SAAO,GAAG;AACT;AACA,QAAK,IAAI,KAAM,EAAE,WAAW,CAAC;AAAA,EAC9B;AACA,SAAO;AACR;AAEO,IAAM,aAAa,CAAC,UAC1B,iBAAiB,QAAQ,MAAM,KAAK,UAAU,KAAK,CAAC,MAAM,CAAC;;;ACxB5D,IAAM,mBAAmB;AACzB,IAAM,YAAY;AAClB,IAAM,QAAmC,CAAC;AAE1C,SAAS,cAAc,OAAe;AACrC,SAAO,MAAM,MAAM,YAAY;AAChC;AAEO,SAAS,mBAAmB,MAAc;AAChD,MAAI,MAAM,eAAe,IAAI,GAAG;AAC/B,WAAO,MAAM,IAAI;AAAA,EAClB;AAEA,MAAI,QAAQ,KAAK,QAAQ,kBAAkB,aAAa;AACxD,SAAQ,MAAM,IAAI,IAAI,UAAU,KAAK,KAAK,IAAI,MAAM,QAAQ;AAC7D;;;ACfA,SAAgB,kBAAkB;AAE3B,SAAS,mBACf,SACI;AACJ,QAAM,QAAQ,WAAW,OAAO;AAChC,MAAI,UAAU,QAAW;AACxB,UAAM,IAAI,MAAM,qBAAqB,OAAO,gBAAgB;AAAA,EAC7D;AACA,SAAO;AACR;;;
|
|
4
|
+
"mappings": "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",
|
|
5
5
|
"names": ["rule", "styleRules", "value", "composed"]
|
|
6
6
|
}
|
package/dist/purse.d.ts
CHANGED
|
@@ -36,7 +36,8 @@ export declare function createInMemoryStyleApi(): InMemoryStyleApi;
|
|
|
36
36
|
export declare function PurseProvider(props: {
|
|
37
37
|
children?: React.ReactNode;
|
|
38
38
|
}): import("react/jsx-runtime").JSX.Element;
|
|
39
|
-
export
|
|
39
|
+
export type StyleArgument = CSSProperties | StyleElement | false | null | undefined;
|
|
40
|
+
export declare function style(...styleElementsOrCSS: StyleArgument[]): StyleElement;
|
|
40
41
|
export declare function useInjectGlobalStyles(selector: string, cssProperties: BaseCSSProperties & CSSVarDeclarations, deps: DependencyList): void;
|
|
41
|
-
export declare function useStyles(...styleElementsOrCSS:
|
|
42
|
+
export declare function useStyles(...styleElementsOrCSS: StyleArgument[]): string;
|
|
42
43
|
export {};
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "purse-styles",
|
|
3
3
|
"type": "module",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
|
-
"version": "0.1.
|
|
5
|
+
"version": "0.1.2",
|
|
6
6
|
"author": "Tanishq Kancharla <tanishqkancharla3@gmail.com>",
|
|
7
7
|
"description": "A basic styling solution for web apps with an emphasis on simplicity and purity.",
|
|
8
8
|
"keywords": [],
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"src"
|
|
15
15
|
],
|
|
16
16
|
"repository": {
|
|
17
|
-
"url": "https://github.com/tanishqkancharla/
|
|
17
|
+
"url": "https://github.com/tanishqkancharla/npm-ts-boilerplate"
|
|
18
18
|
},
|
|
19
19
|
"scripts": {
|
|
20
20
|
"build": "tsx scripts/build.ts",
|
package/src/index.ts
CHANGED
package/src/purse.test.ts
CHANGED
|
@@ -87,6 +87,44 @@ describe("Purse", () => {
|
|
|
87
87
|
])
|
|
88
88
|
})
|
|
89
89
|
|
|
90
|
+
it("Skips falsy style arguments", () => {
|
|
91
|
+
const base = style({ color: "red" })
|
|
92
|
+
const composed = style(base, undefined, null, false, { margin: "8px" })
|
|
93
|
+
|
|
94
|
+
expect(composed.composed).toHaveLength(1)
|
|
95
|
+
assert.strictEqual(composed.composed[0], base)
|
|
96
|
+
assert(composed.owned !== undefined)
|
|
97
|
+
expect(composed.owned.styleRules).toContain(
|
|
98
|
+
`.${composed.owned.className}{margin:8px;}`,
|
|
99
|
+
)
|
|
100
|
+
assert.ok(composed.className.includes(base.className))
|
|
101
|
+
assert.ok(composed.className.includes(composed.owned.className))
|
|
102
|
+
})
|
|
103
|
+
|
|
104
|
+
it("Keeps vendor-prefixed unitless number properties dimensionless", () => {
|
|
105
|
+
const test = style({
|
|
106
|
+
WebkitLineClamp: 3,
|
|
107
|
+
MozLineClamp: 2,
|
|
108
|
+
lineClamp: 1,
|
|
109
|
+
})
|
|
110
|
+
|
|
111
|
+
assert(test.owned !== undefined)
|
|
112
|
+
expect(test.owned.styleRules).toContain(
|
|
113
|
+
`.${test.className}{-webkit-line-clamp:3;-moz-line-clamp:2;line-clamp:1;}`,
|
|
114
|
+
)
|
|
115
|
+
})
|
|
116
|
+
|
|
117
|
+
it("Still adds px to vendor-prefixed dimensional properties", () => {
|
|
118
|
+
const test = style({
|
|
119
|
+
WebkitTransform: 10,
|
|
120
|
+
})
|
|
121
|
+
|
|
122
|
+
assert(test.owned !== undefined)
|
|
123
|
+
expect(test.owned.styleRules).toContain(
|
|
124
|
+
`.${test.className}{-webkit-transform:10px;}`,
|
|
125
|
+
)
|
|
126
|
+
})
|
|
127
|
+
|
|
90
128
|
it.skip("Inserts into given style element correctly", () => {})
|
|
91
129
|
it.skip("Works if you pass style rule or object to useStyles", () => {})
|
|
92
130
|
it.skip("Works if you pass multiple style rule or object to useStyles", () => {})
|
package/src/purse.tsx
CHANGED
|
@@ -60,6 +60,25 @@ const UNITLESS_NUMBER_PROPS = [
|
|
|
60
60
|
"stroke-width",
|
|
61
61
|
]
|
|
62
62
|
|
|
63
|
+
const VENDOR_PREFIXES = ["-webkit-", "-moz-", "-ms-", "-o-"] as const
|
|
64
|
+
|
|
65
|
+
/** True when a numeric value should compile without an implicit `px` suffix. */
|
|
66
|
+
function isUnitlessNumberProperty(kebabProperty: string): boolean {
|
|
67
|
+
if (UNITLESS_NUMBER_PROPS.includes(kebabProperty)) {
|
|
68
|
+
return true
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
for (const prefix of VENDOR_PREFIXES) {
|
|
72
|
+
if (!kebabProperty.startsWith(prefix)) continue
|
|
73
|
+
const unprefixed = kebabProperty.slice(prefix.length)
|
|
74
|
+
if (UNITLESS_NUMBER_PROPS.includes(unprefixed)) {
|
|
75
|
+
return true
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
return false
|
|
80
|
+
}
|
|
81
|
+
|
|
63
82
|
type BaseCSSProperties = CSS.Properties<number | string, string & {}>
|
|
64
83
|
type CSSVarDeclarations = Record<CSSVar, string>
|
|
65
84
|
|
|
@@ -96,8 +115,13 @@ export type StyleElement = {
|
|
|
96
115
|
className: string
|
|
97
116
|
}
|
|
98
117
|
|
|
99
|
-
function isStyleElement(o:
|
|
100
|
-
return
|
|
118
|
+
function isStyleElement(o: unknown): o is StyleElement {
|
|
119
|
+
return (
|
|
120
|
+
o != null &&
|
|
121
|
+
typeof o === "object" &&
|
|
122
|
+
"__style__" in o &&
|
|
123
|
+
o["__style__"] === __style__
|
|
124
|
+
)
|
|
101
125
|
}
|
|
102
126
|
|
|
103
127
|
const DEV = process.env.NODE_ENV === "development"
|
|
@@ -334,7 +358,7 @@ function compileDeclarations(declarations: BaseCSSProperties) {
|
|
|
334
358
|
const kebabProperty = hyphenateStyleName(camelCaseProperty)
|
|
335
359
|
const needToAddPixelsUnit =
|
|
336
360
|
typeof value === "number" &&
|
|
337
|
-
!
|
|
361
|
+
!isUnitlessNumberProperty(kebabProperty)
|
|
338
362
|
|
|
339
363
|
if (needToAddPixelsUnit) {
|
|
340
364
|
return `${kebabProperty}:${value}px;`
|
|
@@ -471,13 +495,17 @@ function compileCSS(properties: CSSProperties): StyleElement["owned"] {
|
|
|
471
495
|
return { styleRules, className }
|
|
472
496
|
}
|
|
473
497
|
|
|
474
|
-
export
|
|
475
|
-
|
|
476
|
-
): StyleElement {
|
|
498
|
+
export type StyleArgument = CSSProperties | StyleElement | false | null | undefined
|
|
499
|
+
|
|
500
|
+
export function style(...styleElementsOrCSS: StyleArgument[]): StyleElement {
|
|
477
501
|
let composed: StyleElement[] = []
|
|
478
502
|
let cssPropertyGroups: CSSProperties[] = []
|
|
479
503
|
|
|
480
504
|
for (const styleElementOrCSS of styleElementsOrCSS) {
|
|
505
|
+
if (styleElementOrCSS == null || styleElementOrCSS === false) {
|
|
506
|
+
continue
|
|
507
|
+
}
|
|
508
|
+
|
|
481
509
|
if (isStyleElement(styleElementOrCSS)) {
|
|
482
510
|
composed.push(styleElementOrCSS)
|
|
483
511
|
} else {
|
|
@@ -520,9 +548,7 @@ export function useInjectGlobalStyles(
|
|
|
520
548
|
}, deps)
|
|
521
549
|
}
|
|
522
550
|
|
|
523
|
-
export function useStyles(
|
|
524
|
-
...styleElementsOrCSS: (CSSProperties | StyleElement)[]
|
|
525
|
-
): string {
|
|
551
|
+
export function useStyles(...styleElementsOrCSS: StyleArgument[]): string {
|
|
526
552
|
const styleApi = useRequiredContext(PurseContext)
|
|
527
553
|
|
|
528
554
|
// let composed: StyleElement[] = []
|