@blockle/blocks-core 0.21.10 → 0.21.11

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.
Files changed (10) hide show
  1. package/dist/atoms/defineProperties.cjs +3 -3
  2. package/dist/atoms/defineProperties.js +4 -4
  3. package/dist/css/layers.css.cjs +8 -1
  4. package/dist/css/layers.css.d.ts +2 -0
  5. package/dist/css/layers.css.js +9 -2
  6. package/dist/css/vars.css.d.ts +51 -51
  7. package/dist/index.cjs +2 -0
  8. package/dist/index.d.ts +1 -1
  9. package/dist/index.js +3 -1
  10. package/package.json +1 -1
package/dist/atoms/defineProperties.cjs CHANGED
@@ -16,7 +16,7 @@ function defineProperties({
16
16
  for (const value of values) {
17
17
  const defaultClass = css.style({
18
18
  "@layer": {
19
- [layers_css.blocksLayer]: {
19
+ [layers_css.blocksLayerAtom]: {
20
20
  [property]: value
21
21
  }
22
22
  }
@@ -32,7 +32,7 @@ function defineProperties({
32
32
  if (typeof condition === "object" && condition["@media"]) {
33
33
  return css.style({
34
34
  "@layer": {
35
- [layers_css.blocksLayer]: {
35
+ [layers_css.blocksLayerAtom]: {
36
36
  "@media": {
37
37
  [condition["@media"]]: {
38
38
  [property]: value
@@ -55,7 +55,7 @@ function defineProperties({
55
55
  for (const value in values) {
56
56
  const defaultClass = css.style({
57
57
  "@layer": {
58
- [layers_css.blocksLayer]: {
58
+ [layers_css.blocksLayerAtom]: {
59
59
  [property]: values[value]
60
60
  }
61
61
  }
package/dist/atoms/defineProperties.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { style } from "@vanilla-extract/css";
2
- import { blocksLayer } from "../css/layers.css.js";
2
+ import { blocksLayerAtom } from "../css/layers.css.js";
3
3
  function defineProperties({
4
4
  properties,
5
5
  conditions
@@ -14,7 +14,7 @@ function defineProperties({
14
14
  for (const value of values) {
15
15
  const defaultClass = style({
16
16
  "@layer": {
17
- [blocksLayer]: {
17
+ [blocksLayerAtom]: {
18
18
  [property]: value
19
19
  }
20
20
  }
@@ -30,7 +30,7 @@ function defineProperties({
30
30
  if (typeof condition === "object" && condition["@media"]) {
31
31
  return style({
32
32
  "@layer": {
33
- [blocksLayer]: {
33
+ [blocksLayerAtom]: {
34
34
  "@media": {
35
35
  [condition["@media"]]: {
36
36
  [property]: value
@@ -53,7 +53,7 @@ function defineProperties({
53
53
  for (const value in values) {
54
54
  const defaultClass = style({
55
55
  "@layer": {
56
- [blocksLayer]: {
56
+ [blocksLayerAtom]: {
57
57
  [property]: values[value]
58
58
  }
59
59
  }
package/dist/css/layers.css.cjs CHANGED
@@ -3,6 +3,13 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const fileScope = require("@vanilla-extract/css/fileScope");
4
4
  const css = require("@vanilla-extract/css");
5
5
  fileScope.setFileScope("src/css/layers.css.ts", "@blockle/blocks-core");
6
- const blocksLayer = css.layer("blockle-blocks");
6
+ const blocksLayerComponent = css.layer("blocks-component");
7
+ const blocksLayerAtom = css.layer(
8
+ { parent: blocksLayerComponent },
9
+ "blocks-atom"
10
+ );
11
+ const blocksLayer = css.layer({ parent: blocksLayerAtom }, "blockle-blocks");
7
12
  fileScope.endFileScope();
8
13
  exports.blocksLayer = blocksLayer;
14
+ exports.blocksLayerAtom = blocksLayerAtom;
15
+ exports.blocksLayerComponent = blocksLayerComponent;
package/dist/css/layers.css.d.ts CHANGED
@@ -1 +1,3 @@
1
+ export declare const blocksLayerComponent: string;
2
+ export declare const blocksLayerAtom: string;
1
3
  export declare const blocksLayer: string;
package/dist/css/layers.css.js CHANGED
@@ -1,8 +1,15 @@
1
1
  import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
2
2
  import { layer } from "@vanilla-extract/css";
3
3
  setFileScope("src/css/layers.css.ts", "@blockle/blocks-core");
4
- const blocksLayer = layer("blockle-blocks");
4
+ const blocksLayerComponent = layer("blocks-component");
5
+ const blocksLayerAtom = layer(
6
+ { parent: blocksLayerComponent },
7
+ "blocks-atom"
8
+ );
9
+ const blocksLayer = layer({ parent: blocksLayerAtom }, "blockle-blocks");
5
10
  endFileScope();
6
11
  export {
7
- blocksLayer
12
+ blocksLayer,
13
+ blocksLayerAtom,
14
+ blocksLayerComponent
8
15
  };
package/dist/css/vars.css.d.ts CHANGED
@@ -1,75 +1,75 @@
1
1
  export declare const vars: {
2
2
  space: {
3
- medium: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4
- none: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
5
- gutter: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
6
- xsmall: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7
- small: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8
- large: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
9
- xlarge: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
3
+ medium: `var(--${string})`;
4
+ none: `var(--${string})`;
5
+ gutter: `var(--${string})`;
6
+ xsmall: `var(--${string})`;
7
+ small: `var(--${string})`;
8
+ large: `var(--${string})`;
9
+ xlarge: `var(--${string})`;
10
10
  };
11
11
  borderRadius: {
12
- medium: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
13
- small: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
14
- large: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
15
- xlarge: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
12
+ medium: `var(--${string})`;
13
+ small: `var(--${string})`;
14
+ large: `var(--${string})`;
15
+ xlarge: `var(--${string})`;
16
16
  };
17
17
  color: {
18
- white: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
19
- black: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
20
- body: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
21
- primaryLight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
22
- primary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
23
- primaryDark: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
24
- secondaryLight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
25
- secondary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
26
- secondaryDark: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
27
- text: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
28
- textLight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
29
- textDark: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
30
- danger: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
31
- link: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
18
+ white: `var(--${string})`;
19
+ black: `var(--${string})`;
20
+ body: `var(--${string})`;
21
+ primaryLight: `var(--${string})`;
22
+ primary: `var(--${string})`;
23
+ primaryDark: `var(--${string})`;
24
+ secondaryLight: `var(--${string})`;
25
+ secondary: `var(--${string})`;
26
+ secondaryDark: `var(--${string})`;
27
+ text: `var(--${string})`;
28
+ textLight: `var(--${string})`;
29
+ textDark: `var(--${string})`;
30
+ danger: `var(--${string})`;
31
+ link: `var(--${string})`;
32
32
  };
33
33
  borderWidth: {
34
- medium: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
35
- small: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
36
- large: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
34
+ medium: `var(--${string})`;
35
+ small: `var(--${string})`;
36
+ large: `var(--${string})`;
37
37
  };
38
38
  fontFamily: {
39
- body: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
40
- primary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
41
- secondary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
39
+ body: `var(--${string})`;
40
+ primary: `var(--${string})`;
41
+ secondary: `var(--${string})`;
42
42
  };
43
43
  fontSize: {
44
- medium: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
45
- xsmall: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
46
- small: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
47
- large: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
48
- xlarge: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
44
+ medium: `var(--${string})`;
45
+ xsmall: `var(--${string})`;
46
+ small: `var(--${string})`;
47
+ large: `var(--${string})`;
48
+ xlarge: `var(--${string})`;
49
49
  };
50
50
  fontWeight: {
51
- regular: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
52
- medium: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
53
- strong: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
51
+ regular: `var(--${string})`;
52
+ medium: `var(--${string})`;
53
+ strong: `var(--${string})`;
54
54
  };
55
55
  lineHeight: {
56
- medium: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
57
- xsmall: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
58
- small: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
59
- large: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
60
- xlarge: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
56
+ medium: `var(--${string})`;
57
+ xsmall: `var(--${string})`;
58
+ small: `var(--${string})`;
59
+ large: `var(--${string})`;
60
+ xlarge: `var(--${string})`;
61
61
  };
62
62
  transition: {
63
- slow: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
64
- normal: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
65
- fast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
63
+ slow: `var(--${string})`;
64
+ normal: `var(--${string})`;
65
+ fast: `var(--${string})`;
66
66
  };
67
67
  shadow: {
68
- medium: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
69
- small: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
70
- large: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
68
+ medium: `var(--${string})`;
69
+ small: `var(--${string})`;
70
+ large: `var(--${string})`;
71
71
  };
72
72
  focus: {
73
- boxShadow: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
73
+ boxShadow: `var(--${string})`;
74
74
  };
75
75
  };
package/dist/index.cjs CHANGED
@@ -20,6 +20,8 @@ const cssMatrixUtils = require("./css/cssMatrixUtils.cjs");
20
20
  exports.breakpointNames = breakpoint.breakpointNames;
21
21
  exports.minMediaQuery = breakpoint.minMediaQuery;
22
22
  exports.blocksLayer = layers_css.blocksLayer;
23
+ exports.blocksLayerAtom = layers_css.blocksLayerAtom;
24
+ exports.blocksLayerComponent = layers_css.blocksLayerComponent;
23
25
  exports.rem = rem.rem;
24
26
  exports.vars = vars_css.vars;
25
27
  exports.makeComponentTheme = makeComponentTheme.makeComponentTheme;
package/dist/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  export type { ComponentThemes, ComponentThemesProps, } from './config/componentThemes';
2
2
  export type { ThemeTokens } from './config/themeTokens';
3
3
  export { breakpointNames, minMediaQuery } from './css/breakpoint/breakpoint';
4
- export { blocksLayer } from './css/layers.css';
4
+ export { blocksLayer, blocksLayerAtom, blocksLayerComponent, } from './css/layers.css';
5
5
  export { rem } from './css/rem';
6
6
  export { vars } from './css/vars.css';
7
7
  export { makeComponentTheme } from './theme/makeComponentTheme';
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { breakpointNames, minMediaQuery } from "./css/breakpoint/breakpoint.js";
2
- import { blocksLayer } from "./css/layers.css.js";
2
+ import { blocksLayer, blocksLayerAtom, blocksLayerComponent } from "./css/layers.css.js";
3
3
  import { rem } from "./css/rem.js";
4
4
  import { vars } from "./css/vars.css.js";
5
5
  import { makeComponentTheme } from "./theme/makeComponentTheme.js";
@@ -20,6 +20,8 @@ export {
20
20
  atomicProperties,
21
21
  atoms,
22
22
  blocksLayer,
23
+ blocksLayerAtom,
24
+ blocksLayerComponent,
23
25
  breakpointNames,
24
26
  classnames,
25
27
  composeRefs,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blockle/blocks-core",
3
- "version": "0.21.10",
3
+ "version": "0.21.11",
4
4
  "description": "Core for Blocks",
5
5
  "type": "module",
6
6
  "sideEffects": false,