@praxisjs/css 0.1.7 → 0.3.0

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/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @praxisjs/css
2
2
 
3
+ ## 0.3.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 6140752: `globalStyle()` now accepts a `layer` option to wrap the injected CSS in a named `@layer`, so it can be ordered against other layered CSS (e.g. Tailwind utilities) instead of always winning the cascade regardless of specificity. `preflight()` is now implemented on top of this option.
8
+
9
+ ## 0.2.0
10
+
11
+ ### Minor Changes
12
+
13
+ - ffc4aec: `preflight()` now wraps its reset in `@layer reset` by default so it can be ordered against other layered CSS (e.g. Tailwind utilities) instead of always winning the cascade regardless of specificity. Pass `preflight({ layer: 'custom-name' })` to rename the layer, or `preflight({ layer: false })` to opt back into un-layered CSS.
14
+
3
15
  ## 0.1.7
4
16
 
5
17
  ### Patch Changes
@@ -87,6 +87,25 @@ describe("globalStyle() — factory with builder", () => {
87
87
  expect(col.getCSS()).toContain("text-decoration: none");
88
88
  });
89
89
  });
90
+ // ─── layer option ─────────────────────────────────────────────────────────────
91
+ describe("globalStyle() — layer option", () => {
92
+ it("injects un-layered CSS by default", () => {
93
+ globalStyle(_css => unique("body { margin: 0; }"));
94
+ const content = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
95
+ expect(content).not.toContain("@layer");
96
+ });
97
+ it("wraps the CSS in a named @layer when provided", () => {
98
+ globalStyle(_css => unique("body { margin: 0; }"), { layer: "base" });
99
+ const content = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
100
+ expect(content).toContain("@layer base {");
101
+ expect(content).toContain("margin: 0;");
102
+ });
103
+ it("does not wrap in a layer when layer: false", () => {
104
+ globalStyle(_css => unique("body { margin: 0; }"), { layer: false });
105
+ const content = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
106
+ expect(content).not.toContain("@layer");
107
+ });
108
+ });
90
109
  // ─── STATIC_MODE ──────────────────────────────────────────────────────────────
91
110
  describe("globalStyle() — static mode (__PRAXIS_CSS_STATIC__)", () => {
92
111
  afterEach(() => {
@@ -1 +1 @@
1
- {"version":3,"file":"global.test.js","sourceRoot":"","sources":["../../src/__tests__/global.test.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"global.test.js","sourceRoot":"","sources":["../../src/__tests__/global.test.ts"],"names":[],"mappings":"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"}
@@ -51,5 +51,24 @@ describe("preflight()", () => {
51
51
  expect(document.head.querySelector("style[data-praxis-global]")).toBeNull();
52
52
  expect(col.getCSS()).toContain("box-sizing: border-box");
53
53
  });
54
+ it("wraps the reset in `@layer reset` by default", async () => {
55
+ const { preflight } = await import("../preflight.js");
56
+ preflight();
57
+ const css = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
58
+ expect(css).toContain("@layer reset {");
59
+ expect(css).toContain("box-sizing: border-box");
60
+ });
61
+ it("wraps the reset in a custom named layer", async () => {
62
+ const { preflight } = await import("../preflight.js");
63
+ preflight({ layer: "tailwind-base" });
64
+ const css = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
65
+ expect(css).toContain("@layer tailwind-base {");
66
+ });
67
+ it("injects un-layered CSS when layer: false", async () => {
68
+ const { preflight } = await import("../preflight.js");
69
+ preflight({ layer: false });
70
+ const css = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
71
+ expect(css).not.toContain("@layer");
72
+ });
54
73
  });
55
74
  //# sourceMappingURL=preflight.test.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"preflight.test.js","sourceRoot":"","sources":["../../src/__tests__/preflight.test.ts"],"names":[],"mappings":"AAAA,4BAA4B;AAC5B,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAEzE,kFAAkF;AAClF,uFAAuF;AAEvF,SAAS,OAAO;IACd,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,2BAA2B,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC;AAC3F,CAAC;AAED,UAAU,CAAC,GAAG,EAAE;IACd,EAAE,CAAC,YAAY,EAAE,CAAC;IAClB,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC,CAAC;AAEH,SAAS,CAAC,GAAG,EAAE;IACb,OAAO,EAAE,CAAC;IACV,EAAE,CAAC,YAAY,EAAE,CAAC;AACpB,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,aAAa,EAAE,GAAG,EAAE;IAC3B,EAAE,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;QAC1D,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,MAAM,CAAC,iBAAiB,CAAC,CAAC;QACtD,SAAS,EAAE,CAAC;QACZ,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,2BAA2B,CAAC,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;IAClF,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2BAA2B,EAAE,KAAK,IAAI,EAAE;QACzC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,MAAM,CAAC,iBAAiB,CAAC,CAAC;QACtD,SAAS,EAAE,CAAC;QACZ,MAAM,GAAG,GAAG,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,2BAA2B,CAAC,EAAE,WAAW,IAAI,EAAE,CAAC;QACxF,MAAM,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,wBAAwB,CAAC,CAAC;QAChD,MAAM,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;QACnC,MAAM,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wDAAwD,EAAE,KAAK,IAAI,EAAE;QACtE,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,MAAM,CAAC,iBAAiB,CAAC,CAAC;QACtD,SAAS,EAAE,CAAC;QACZ,MAAM,GAAG,GAAG,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,2BAA2B,CAAC,EAAE,WAAW,IAAI,EAAE,CAAC;QACxF,MAAM,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;QACvC,MAAM,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;QACtC,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IACxC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iDAAiD,EAAE,KAAK,IAAI,EAAE;QAC/D,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,MAAM,CAAC,iBAAiB,CAAC,CAAC;QACtD,SAAS,EAAE,CAAC;QACZ,SAAS,EAAE,CAAC;QACZ,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,2BAA2B,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACrF,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iDAAiD,EAAE,KAAK,IAAI,EAAE;QAC/D,MAAM,EAAE,YAAY,EAAE,eAAe,EAAE,GAAG,MAAM,MAAM,CAAC,0BAA0B,CAAC,CAAC;QACnF,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,MAAM,CAAC,iBAAiB,CAAC,CAAC;QACtD,MAAM,GAAG,GAAG,eAAe,EAAE,CAAC;QAC9B,YAAY,CAAC,GAAG,CAAC,CAAC;QAClB,SAAS,EAAE,CAAC;QACZ,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,2BAA2B,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC;QAC5E,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,wBAAwB,CAAC,CAAC;IAC3D,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
1
+ {"version":3,"file":"preflight.test.js","sourceRoot":"","sources":["../../src/__tests__/preflight.test.ts"],"names":[],"mappings":"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"}
package/dist/global.d.ts CHANGED
@@ -1,6 +1,15 @@
1
1
  import { type CSSProperties, type CSSBuilder } from "./builder/css-builder.js";
2
2
  /** Factory function that receives `css` (= `createCSSBuilder`) and returns a `CSSBuilder` or raw CSS string. */
3
3
  export type GlobalStyleFactory = (css: (props: CSSProperties) => CSSBuilder) => CSSBuilder | string;
4
+ export interface GlobalStyleOptions {
5
+ /**
6
+ * Wraps the CSS in a named `@layer` so it can be ordered against other
7
+ * layered CSS (e.g. Tailwind's `@layer utilities`) instead of always
8
+ * winning the cascade regardless of specificity. Omit (or pass `false`)
9
+ * to inject un-layered CSS (default).
10
+ */
11
+ layer?: string | false;
12
+ }
4
13
  /**
5
14
  * Injects unscoped CSS into `<head>` exactly once.
6
15
  *
@@ -22,6 +31,10 @@ export type GlobalStyleFactory = (css: (props: CSSProperties) => CSSBuilder) =>
22
31
  * .on('body', { fontFamily: 'system-ui', lineHeight: 1.5 })
23
32
  * .on('img, video', { display: 'block', maxWidth: '100%' })
24
33
  * )
34
+ *
35
+ * @example
36
+ * // Ordered against other layered CSS (e.g. Tailwind utilities):
37
+ * globalStyle(_css => `body { font-family: system-ui; }`, { layer: 'base' })
25
38
  */
26
- export declare function globalStyle(factory: GlobalStyleFactory): void;
39
+ export declare function globalStyle(factory: GlobalStyleFactory, options?: GlobalStyleOptions): void;
27
40
  //# sourceMappingURL=global.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"global.d.ts","sourceRoot":"","sources":["../src/global.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,aAAa,EAAE,KAAK,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAMjG,gHAAgH;AAChH,MAAM,MAAM,kBAAkB,GAAG,CAAC,GAAG,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,UAAU,KAAK,UAAU,GAAG,MAAM,CAAC;AAYpG;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,kBAAkB,GAAG,IAAI,CAkB7D"}
1
+ {"version":3,"file":"global.d.ts","sourceRoot":"","sources":["../src/global.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,aAAa,EAAE,KAAK,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAMjG,gHAAgH;AAChH,MAAM,MAAM,kBAAkB,GAAG,CAAC,GAAG,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,UAAU,KAAK,UAAU,GAAG,MAAM,CAAC;AAEpG,MAAM,WAAW,kBAAkB;IACjC;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;CACxB;AAYD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,kBAAkB,EAAE,OAAO,GAAE,kBAAuB,GAAG,IAAI,CAoB/F"}
package/dist/global.js CHANGED
@@ -25,9 +25,15 @@ const injected = new Set();
25
25
  * .on('body', { fontFamily: 'system-ui', lineHeight: 1.5 })
26
26
  * .on('img, video', { display: 'block', maxWidth: '100%' })
27
27
  * )
28
+ *
29
+ * @example
30
+ * // Ordered against other layered CSS (e.g. Tailwind utilities):
31
+ * globalStyle(_css => `body { font-family: system-ui; }`, { layer: 'base' })
28
32
  */
29
- export function globalStyle(factory) {
30
- const css = String(factory(createCSSBuilder));
33
+ export function globalStyle(factory, options = {}) {
34
+ const rawCSS = String(factory(createCSSBuilder));
35
+ const { layer } = options;
36
+ const css = layer ? `@layer ${layer} {\n${rawCSS}\n}` : rawCSS;
31
37
  const key = hashCSS(css);
32
38
  if (injected.has(key))
33
39
  return;
@@ -1 +1 @@
1
- {"version":3,"file":"global.js","sourceRoot":"","sources":["../src/global.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAuC,MAAM,0BAA0B,CAAC;AACjG,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAU7C,MAAM,WAAW,GACf,OAAO,qBAAqB,KAAK,WAAW,IAAI,qBAAqB,CAAC;AAExE,MAAM,QAAQ,GAAG,IAAI,GAAG,EAAU,CAAC;AAEnC,gFAAgF;AAEhF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,WAAW,CAAC,OAA2B;IACrD,MAAM,GAAG,GAAG,MAAM,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAE9C,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;IACzB,IAAI,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC;QAAE,OAAO;IAC9B,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAElB,IAAI,WAAW;QAAE,OAAO;IAExB,MAAM,GAAG,GAAG,YAAY,EAAE,CAAC;IAC3B,IAAI,GAAG,EAAE,CAAC;QAAC,GAAG,CAAC,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;QAAC,OAAO;IAAC,CAAC;IAE1C,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAO;IAE5C,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC3C,EAAE,CAAC,YAAY,CAAC,oBAAoB,EAAE,GAAG,CAAC,CAAC;IAC3C,EAAE,CAAC,WAAW,GAAG,GAAG,CAAC;IACrB,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;AAChC,CAAC"}
1
+ {"version":3,"file":"global.js","sourceRoot":"","sources":["../src/global.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAuC,MAAM,0BAA0B,CAAC;AACjG,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAoB7C,MAAM,WAAW,GACf,OAAO,qBAAqB,KAAK,WAAW,IAAI,qBAAqB,CAAC;AAExE,MAAM,QAAQ,GAAG,IAAI,GAAG,EAAU,CAAC;AAEnC,gFAAgF;AAEhF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,UAAU,WAAW,CAAC,OAA2B,EAAE,UAA8B,EAAE;IACvF,MAAM,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,CAAC;IACjD,MAAM,EAAE,KAAK,EAAE,GAAG,OAAO,CAAC;IAC1B,MAAM,GAAG,GAAG,KAAK,CAAC,CAAC,CAAC,UAAU,KAAK,OAAO,MAAM,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC;IAE/D,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;IACzB,IAAI,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC;QAAE,OAAO;IAC9B,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAElB,IAAI,WAAW;QAAE,OAAO;IAExB,MAAM,GAAG,GAAG,YAAY,EAAE,CAAC;IAC3B,IAAI,GAAG,EAAE,CAAC;QAAC,GAAG,CAAC,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;QAAC,OAAO;IAAC,CAAC;IAE1C,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAO;IAE5C,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC3C,EAAE,CAAC,YAAY,CAAC,oBAAoB,EAAE,GAAG,CAAC,CAAC;IAC3C,EAAE,CAAC,WAAW,GAAG,GAAG,CAAC;IACrB,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;AAChC,CAAC"}
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export { cx, type ClassValue } from "./cx.js";
2
- export { preflight } from "./preflight.js";
3
- export { globalStyle, type GlobalStyleFactory } from "./global.js";
2
+ export { preflight, type PreflightOptions } from "./preflight.js";
3
+ export { globalStyle, type GlobalStyleFactory, type GlobalStyleOptions } from "./global.js";
4
4
  export { type CSSBuilder, type CSSProperties } from "./builder/css-builder.js";
5
5
  export { keyframes } from "./builder/keyframes.js";
6
6
  export { Param } from "./decorators/param.js";
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACnE,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,KAAK,kBAAkB,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAC5F,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC"}
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAmB,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAA2B,MAAM,aAAa,CAAC;AAEnE,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAqB,MAAM,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAmB,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAyB,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,WAAW,EAAoD,MAAM,aAAa,CAAC;AAE5F,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAqB,MAAM,mBAAmB,CAAC"}
@@ -1,3 +1,12 @@
1
+ export interface PreflightOptions {
2
+ /**
3
+ * Names the CSS `@layer` the reset is wrapped in, so it can be ordered
4
+ * against other layered CSS (e.g. Tailwind's `@layer utilities`) instead
5
+ * of always winning the cascade. Defaults to `"reset"`. Pass `false` to
6
+ * inject un-layered CSS instead.
7
+ */
8
+ layer?: string | false;
9
+ }
1
10
  /**
2
11
  * Injects an opinionated browser reset into `document.head` exactly once.
3
12
  *
@@ -14,5 +23,5 @@
14
23
  * import { preflight } from '@praxisjs/css'
15
24
  * preflight()
16
25
  */
17
- export declare function preflight(): void;
26
+ export declare function preflight({ layer }?: PreflightOptions): void;
18
27
  //# sourceMappingURL=preflight.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"preflight.d.ts","sourceRoot":"","sources":["../src/preflight.ts"],"names":[],"mappings":"AA6KA;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,IAAI,IAAI,CAEhC"}
1
+ {"version":3,"file":"preflight.d.ts","sourceRoot":"","sources":["../src/preflight.ts"],"names":[],"mappings":"AA6KA,MAAM,WAAW,gBAAgB;IAC/B;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;CACxB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EAAE,KAAe,EAAE,GAAE,gBAAqB,GAAG,IAAI,CAE1E"}
package/dist/preflight.js CHANGED
@@ -185,7 +185,7 @@ input:where([type='button'], [type='reset'], [type='submit']),
185
185
  * import { preflight } from '@praxisjs/css'
186
186
  * preflight()
187
187
  */
188
- export function preflight() {
189
- globalStyle(_css => PREFLIGHT);
188
+ export function preflight({ layer = "reset" } = {}) {
189
+ globalStyle(_css => PREFLIGHT, { layer });
190
190
  }
191
191
  //# sourceMappingURL=preflight.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"preflight.js","sourceRoot":"","sources":["../src/preflight.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,oHAAoH;AACpH,yEAAyE;AACzE,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuKjB,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,SAAS;IACvB,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AACjC,CAAC"}
1
+ {"version":3,"file":"preflight.js","sourceRoot":"","sources":["../src/preflight.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,oHAAoH;AACpH,yEAAyE;AACzE,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuKjB,CAAC;AAYF;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,SAAS,CAAC,EAAE,KAAK,GAAG,OAAO,KAAuB,EAAE;IAClE,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;AAC5C,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@praxisjs/css",
3
- "version": "0.1.7",
3
+ "version": "0.3.0",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",
@@ -106,6 +106,29 @@ describe("globalStyle() — factory with builder", () => {
106
106
  });
107
107
  });
108
108
 
109
+ // ─── layer option ─────────────────────────────────────────────────────────────
110
+
111
+ describe("globalStyle() — layer option", () => {
112
+ it("injects un-layered CSS by default", () => {
113
+ globalStyle(_css => unique("body { margin: 0; }"));
114
+ const content = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
115
+ expect(content).not.toContain("@layer");
116
+ });
117
+
118
+ it("wraps the CSS in a named @layer when provided", () => {
119
+ globalStyle(_css => unique("body { margin: 0; }"), { layer: "base" });
120
+ const content = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
121
+ expect(content).toContain("@layer base {");
122
+ expect(content).toContain("margin: 0;");
123
+ });
124
+
125
+ it("does not wrap in a layer when layer: false", () => {
126
+ globalStyle(_css => unique("body { margin: 0; }"), { layer: false });
127
+ const content = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
128
+ expect(content).not.toContain("@layer");
129
+ });
130
+ });
131
+
109
132
  // ─── STATIC_MODE ──────────────────────────────────────────────────────────────
110
133
 
111
134
  describe("globalStyle() — static mode (__PRAXIS_CSS_STATIC__)", () => {
@@ -60,4 +60,26 @@ describe("preflight()", () => {
60
60
  expect(document.head.querySelector("style[data-praxis-global]")).toBeNull();
61
61
  expect(col.getCSS()).toContain("box-sizing: border-box");
62
62
  });
63
+
64
+ it("wraps the reset in `@layer reset` by default", async () => {
65
+ const { preflight } = await import("../preflight.js");
66
+ preflight();
67
+ const css = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
68
+ expect(css).toContain("@layer reset {");
69
+ expect(css).toContain("box-sizing: border-box");
70
+ });
71
+
72
+ it("wraps the reset in a custom named layer", async () => {
73
+ const { preflight } = await import("../preflight.js");
74
+ preflight({ layer: "tailwind-base" });
75
+ const css = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
76
+ expect(css).toContain("@layer tailwind-base {");
77
+ });
78
+
79
+ it("injects un-layered CSS when layer: false", async () => {
80
+ const { preflight } = await import("../preflight.js");
81
+ preflight({ layer: false });
82
+ const css = document.head.querySelector("style[data-praxis-global]")?.textContent ?? "";
83
+ expect(css).not.toContain("@layer");
84
+ });
63
85
  });
package/src/global.ts CHANGED
@@ -7,6 +7,16 @@ import { hashCSS } from "./internal/hash.js";
7
7
  /** Factory function that receives `css` (= `createCSSBuilder`) and returns a `CSSBuilder` or raw CSS string. */
8
8
  export type GlobalStyleFactory = (css: (props: CSSProperties) => CSSBuilder) => CSSBuilder | string;
9
9
 
10
+ export interface GlobalStyleOptions {
11
+ /**
12
+ * Wraps the CSS in a named `@layer` so it can be ordered against other
13
+ * layered CSS (e.g. Tailwind's `@layer utilities`) instead of always
14
+ * winning the cascade regardless of specificity. Omit (or pass `false`)
15
+ * to inject un-layered CSS (default).
16
+ */
17
+ layer?: string | false;
18
+ }
19
+
10
20
  // ─── Static mode ──────────────────────────────────────────────────────────────
11
21
 
12
22
  declare const __PRAXIS_CSS_STATIC__: boolean | undefined;
@@ -38,9 +48,15 @@ const injected = new Set<string>();
38
48
  * .on('body', { fontFamily: 'system-ui', lineHeight: 1.5 })
39
49
  * .on('img, video', { display: 'block', maxWidth: '100%' })
40
50
  * )
51
+ *
52
+ * @example
53
+ * // Ordered against other layered CSS (e.g. Tailwind utilities):
54
+ * globalStyle(_css => `body { font-family: system-ui; }`, { layer: 'base' })
41
55
  */
42
- export function globalStyle(factory: GlobalStyleFactory): void {
43
- const css = String(factory(createCSSBuilder));
56
+ export function globalStyle(factory: GlobalStyleFactory, options: GlobalStyleOptions = {}): void {
57
+ const rawCSS = String(factory(createCSSBuilder));
58
+ const { layer } = options;
59
+ const css = layer ? `@layer ${layer} {\n${rawCSS}\n}` : rawCSS;
44
60
 
45
61
  const key = hashCSS(css);
46
62
  if (injected.has(key)) return;
package/src/index.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export { cx, type ClassValue } from "./cx.js";
2
- export { preflight } from "./preflight.js";
3
- export { globalStyle, type GlobalStyleFactory } from "./global.js";
2
+ export { preflight, type PreflightOptions } from "./preflight.js";
3
+ export { globalStyle, type GlobalStyleFactory, type GlobalStyleOptions } from "./global.js";
4
4
  export { type CSSBuilder, type CSSProperties } from "./builder/css-builder.js";
5
5
  export { keyframes } from "./builder/keyframes.js";
6
6
  export { Param } from "./decorators/param.js";
package/src/preflight.ts CHANGED
@@ -171,6 +171,16 @@ input:where([type='button'], [type='reset'], [type='submit']),
171
171
  }
172
172
  `;
173
173
 
174
+ export interface PreflightOptions {
175
+ /**
176
+ * Names the CSS `@layer` the reset is wrapped in, so it can be ordered
177
+ * against other layered CSS (e.g. Tailwind's `@layer utilities`) instead
178
+ * of always winning the cascade. Defaults to `"reset"`. Pass `false` to
179
+ * inject un-layered CSS instead.
180
+ */
181
+ layer?: string | false;
182
+ }
183
+
174
184
  /**
175
185
  * Injects an opinionated browser reset into `document.head` exactly once.
176
186
  *
@@ -187,6 +197,6 @@ input:where([type='button'], [type='reset'], [type='submit']),
187
197
  * import { preflight } from '@praxisjs/css'
188
198
  * preflight()
189
199
  */
190
- export function preflight(): void {
191
- globalStyle(_css => PREFLIGHT);
200
+ export function preflight({ layer = "reset" }: PreflightOptions = {}): void {
201
+ globalStyle(_css => PREFLIGHT, { layer });
192
202
  }