@blockle/blocks-core 0.21.3 → 0.21.4

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.
@@ -0,0 +1,36 @@
1
+ import { Atoms } from './atoms';
2
+ export type ResponsiveValue<T> = T | [T] | [T, T] | [T, T, T] | [T, T, T, T];
3
+ export type ResponsiveDisplayFlex = ResponsiveValue<'none' | 'flex' | 'inline-flex'>;
4
+ export type MarginAtoms = {
5
+ margin?: Atoms['margin'];
6
+ marginBlock?: Atoms['marginBlock'];
7
+ marginBlockStart?: Atoms['marginBlockStart'];
8
+ marginBlockEnd?: Atoms['marginBlockEnd'];
9
+ marginInline?: Atoms['marginInline'];
10
+ marginInlineStart?: Atoms['marginInlineStart'];
11
+ marginInlineEnd?: Atoms['marginInlineEnd'];
12
+ };
13
+ export type PaddingAtoms = {
14
+ padding?: Atoms['padding'];
15
+ paddingBlock?: Atoms['paddingBlock'];
16
+ paddingBlockStart?: Atoms['paddingBlockStart'];
17
+ paddingBlockEnd?: Atoms['paddingBlockEnd'];
18
+ paddingInline?: Atoms['paddingInline'];
19
+ paddingInlineStart?: Atoms['paddingInlineStart'];
20
+ paddingInlineEnd?: Atoms['paddingInlineEnd'];
21
+ };
22
+ export type TextAtoms = {
23
+ color?: Atoms['color'];
24
+ fontFamily?: Atoms['fontFamily'];
25
+ fontSize?: Atoms['fontSize'];
26
+ fontStyle?: Atoms['fontStyle'];
27
+ fontWeight?: Atoms['fontWeight'];
28
+ lineHeight?: Atoms['lineHeight'];
29
+ textAlign?: Atoms['textAlign'];
30
+ textDecoration?: Atoms['textDecoration'];
31
+ textTransform?: Atoms['textTransform'];
32
+ textWrap?: Atoms['textWrap'];
33
+ whiteSpace?: Atoms['whiteSpace'];
34
+ wordBreak?: Atoms['wordBreak'];
35
+ wordWrap?: Atoms['wordWrap'];
36
+ };
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const atoms_css = require("./atoms.css.cjs");
4
+ function atoms(properties) {
5
+ const classList = [];
6
+ for (const property in properties) {
7
+ const value = properties[property];
8
+ const target = atoms_css.atomicProperties[property];
9
+ if (typeof value === "string") {
10
+ if (target.values[value]) {
11
+ classList.push(target.values[value].defaultClass);
12
+ }
13
+ } else if (Array.isArray(value)) {
14
+ value.forEach((val, i) => {
15
+ var _a;
16
+ if (i === 0) {
17
+ if (target.values[val]) {
18
+ classList.push(target.values[val].defaultClass);
19
+ }
20
+ } else {
21
+ classList.push(((_a = target.values[val]) == null ? void 0 : _a.conditions[i]) ?? "");
22
+ }
23
+ });
24
+ }
25
+ }
26
+ return classList.join(" ");
27
+ }
28
+ exports.atoms = atoms;
@@ -0,0 +1,119 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const fileScope = require("@vanilla-extract/css/fileScope");
4
+ const breakpoint = require("../css/breakpoint/breakpoint.cjs");
5
+ const vars_css = require("../css/vars.css.cjs");
6
+ const defineProperties = require("./defineProperties.cjs");
7
+ fileScope.setFileScope("src/atoms/atoms.css.ts", "@blockle/blocks-core");
8
+ const colorsWithCurrentColor = { ...vars_css.vars.color, currentColor: "currentColor" };
9
+ const size = { auto: "auto", full: "100%", "fit-content": "fit-content" };
10
+ const marginSpace = { auto: "auto", ...vars_css.vars.space };
11
+ const unresponsiveAtomicProperties = defineProperties.defineProperties({
12
+ properties: {
13
+ appearance: ["none"],
14
+ backgroundColor: colorsWithCurrentColor,
15
+ blockSize: size,
16
+ border: ["none"],
17
+ borderColor: colorsWithCurrentColor,
18
+ borderRadius: vars_css.vars.borderRadius,
19
+ borderWidth: vars_css.vars.borderWidth,
20
+ boxShadow: vars_css.vars.shadow,
21
+ color: colorsWithCurrentColor,
22
+ cursor: ["auto", "pointer"],
23
+ fontFamily: vars_css.vars.fontFamily,
24
+ fontStyle: ["normal", "italic", "oblique"],
25
+ fontWeight: vars_css.vars.fontWeight,
26
+ inlineSize: size,
27
+ insetBlock: [0],
28
+ insetBlockEnd: [0],
29
+ insetBlockStart: [0],
30
+ insetInline: [0],
31
+ insetInlineEnd: [0],
32
+ insetInlineStart: [0],
33
+ lineHeight: vars_css.vars.lineHeight,
34
+ maxBlockSize: size,
35
+ maxInlineSize: size,
36
+ opacity: [0, 1],
37
+ outline: ["none"],
38
+ overflow: ["hidden", "scroll", "visible", "auto"],
39
+ overflowBlock: ["hidden", "scroll", "visible", "auto"],
40
+ overflowInline: ["hidden", "scroll", "visible", "auto"],
41
+ pointerEvents: ["none"],
42
+ textDecoration: ["overline", "line-through", "underline", "none"],
43
+ textTransform: ["lowercase", "uppercase", "capitalize"],
44
+ textWrap: ["balance", "wrap"],
45
+ transition: vars_css.vars.transition,
46
+ userSelect: ["none"],
47
+ whiteSpace: ["nowrap", "pre", "pre-line", "pre-wrap"],
48
+ wordBreak: ["break-word"],
49
+ wordWrap: ["break-word"],
50
+ textAlign: ["center", "left", "right", "justify"]
51
+ }
52
+ });
53
+ const responsiveAtomicProperties = defineProperties.defineProperties({
54
+ conditions: [
55
+ {},
56
+ {
57
+ "@media": breakpoint.minMediaQuery("tablet")
58
+ },
59
+ {
60
+ "@media": breakpoint.minMediaQuery("desktop")
61
+ },
62
+ {
63
+ "@media": breakpoint.minMediaQuery("wide")
64
+ }
65
+ ],
66
+ properties: {
67
+ alignContent: ["stretch", "center", "flex-start", "flex-end"],
68
+ alignItems: ["stretch", "center", "flex-start", "flex-end"],
69
+ alignSelf: ["stretch", "center", "flex-start", "flex-end"],
70
+ placeItems: ["stretch", "center", "flex-start", "flex-end"],
71
+ columnGap: vars_css.vars.space,
72
+ display: [
73
+ "none",
74
+ "flex",
75
+ "inline-flex",
76
+ "block",
77
+ "inline",
78
+ "inline-block",
79
+ "grid",
80
+ "inline-grid"
81
+ ],
82
+ flex: [1],
83
+ flexDirection: ["row", "row-reverse", "column", "column-reverse"],
84
+ flexGrow: [0, 1],
85
+ flexShrink: [0, 1],
86
+ flexWrap: ["nowrap", "wrap"],
87
+ fontSize: vars_css.vars.fontSize,
88
+ gap: vars_css.vars.space,
89
+ justifyContent: [
90
+ "flex-start",
91
+ "flex-end",
92
+ "center",
93
+ "space-between",
94
+ "space-around"
95
+ ],
96
+ margin: marginSpace,
97
+ marginBlock: marginSpace,
98
+ marginBlockEnd: marginSpace,
99
+ marginBlockStart: marginSpace,
100
+ marginInline: marginSpace,
101
+ marginInlineEnd: marginSpace,
102
+ marginInlineStart: marginSpace,
103
+ padding: vars_css.vars.space,
104
+ paddingBlock: vars_css.vars.space,
105
+ paddingBlockEnd: vars_css.vars.space,
106
+ paddingBlockStart: vars_css.vars.space,
107
+ paddingInline: vars_css.vars.space,
108
+ paddingInlineEnd: vars_css.vars.space,
109
+ paddingInlineStart: vars_css.vars.space,
110
+ position: ["relative", "fixed", "absolute", "sticky", "static"],
111
+ rowGap: vars_css.vars.space
112
+ }
113
+ });
114
+ const atomicProperties = {
115
+ ...responsiveAtomicProperties,
116
+ ...unresponsiveAtomicProperties
117
+ };
118
+ fileScope.endFileScope();
119
+ exports.atomicProperties = atomicProperties;