@blockle/blocks 0.3.4 → 0.3.5

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 (12) hide show
  1. package/dist/momotaro.chunk.d.ts +40 -33
  2. package/dist/styles/lib/css/atoms/atomicProperties.cjs +4 -3
  3. package/dist/styles/lib/css/atoms/atomicProperties.mjs +4 -3
  4. package/dist/styles/themes/momotaro/components/divider.css.cjs +12 -0
  5. package/dist/styles/themes/momotaro/components/divider.css.mjs +13 -0
  6. package/dist/styles/themes/momotaro/components/index.cjs +3 -1
  7. package/dist/styles/themes/momotaro/components/index.mjs +3 -1
  8. package/dist/styles/themes/momotaro/momotaro.css.cjs +2 -2
  9. package/dist/styles/themes/momotaro/momotaro.css.mjs +1 -1
  10. package/dist/styles/themes/momotaro/{tokens.cjs → tokens.css.cjs} +3 -0
  11. package/dist/styles/themes/momotaro/{tokens.mjs → tokens.css.mjs} +3 -0
  12. package/package.json +4 -4
package/dist/momotaro.chunk.d.ts CHANGED
@@ -4,8 +4,8 @@ import { HTMLProps, ReactNode, FC } from 'react';
4
4
  import * as _vanilla_extract_sprinkles from '@vanilla-extract/sprinkles';
5
5
 
6
6
  declare const atoms: ((props: {
7
- readonly backgroundColor?: ("white" | "black" | "body" | "primaryLight" | "primary" | "primaryDark" | "secondaryLight" | "secondary" | "secondaryDark" | "text" | "textLight" | "textDark" | "danger" | "link") | undefined;
8
- readonly borderColor?: ("white" | "black" | "body" | "primaryLight" | "primary" | "primaryDark" | "secondaryLight" | "secondary" | "secondaryDark" | "text" | "textLight" | "textDark" | "danger" | "link") | undefined;
7
+ readonly backgroundColor?: "white" | "black" | "body" | "primaryLight" | "primary" | "primaryDark" | "secondaryLight" | "secondary" | "secondaryDark" | "text" | "textLight" | "textDark" | "danger" | "link" | "currentColor" | undefined;
8
+ readonly borderColor?: "white" | "black" | "body" | "primaryLight" | "primary" | "primaryDark" | "secondaryLight" | "secondary" | "secondaryDark" | "text" | "textLight" | "textDark" | "danger" | "link" | "currentColor" | undefined;
9
9
  readonly borderRadius?: ("medium" | "small" | "large" | "xlarge") | undefined;
10
10
  readonly bottom?: 0 | undefined;
11
11
  readonly boxShadow?: ("medium" | "small" | "large") | undefined;
@@ -42,181 +42,181 @@ declare const atoms: ((props: {
42
42
  tablet?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
43
43
  desktop?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
44
44
  wide?: "stretch" | "center" | "flex-start" | "flex-end" | undefined;
45
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "stretch" | "center" | "flex-start" | "flex-end" | null>;
45
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "stretch" | "center" | "flex-start" | "flex-end" | null>;
46
46
  readonly columnGap?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
47
47
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
48
48
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
49
49
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
50
50
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
51
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
51
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
52
52
  readonly display?: ("none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | {
53
53
  mobile?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
54
54
  tablet?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
55
55
  desktop?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
56
56
  wide?: "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | undefined;
57
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | null>;
57
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | "flex" | "grid" | "inline-flex" | "block" | "inline" | "inline-block" | "inline-grid" | null>;
58
58
  readonly flex?: (1 | {
59
59
  mobile?: 1 | undefined;
60
60
  tablet?: 1 | undefined;
61
61
  desktop?: 1 | undefined;
62
62
  wide?: 1 | undefined;
63
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, 1 | null>;
63
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 1 | null>;
64
64
  readonly flexDirection?: ("row" | "row-reverse" | "column" | "column-reverse" | {
65
65
  mobile?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
66
66
  tablet?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
67
67
  desktop?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
68
68
  wide?: "row" | "row-reverse" | "column" | "column-reverse" | undefined;
69
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "row" | "row-reverse" | "column" | "column-reverse" | null>;
69
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "row" | "row-reverse" | "column" | "column-reverse" | null>;
70
70
  readonly flexGrow?: (0 | 1 | {
71
71
  mobile?: 0 | 1 | undefined;
72
72
  tablet?: 0 | 1 | undefined;
73
73
  desktop?: 0 | 1 | undefined;
74
74
  wide?: 0 | 1 | undefined;
75
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, 0 | 1 | null>;
75
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 0 | 1 | null>;
76
76
  readonly flexShrink?: (0 | 1 | {
77
77
  mobile?: 0 | 1 | undefined;
78
78
  tablet?: 0 | 1 | undefined;
79
79
  desktop?: 0 | 1 | undefined;
80
80
  wide?: 0 | 1 | undefined;
81
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, 0 | 1 | null>;
81
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, 0 | 1 | null>;
82
82
  readonly flexWrap?: ("wrap" | "nowrap" | {
83
83
  mobile?: "wrap" | "nowrap" | undefined;
84
84
  tablet?: "wrap" | "nowrap" | undefined;
85
85
  desktop?: "wrap" | "nowrap" | undefined;
86
86
  wide?: "wrap" | "nowrap" | undefined;
87
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "wrap" | "nowrap" | null>;
87
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "wrap" | "nowrap" | null>;
88
88
  readonly fontSize?: (("medium" | "xsmall" | "small" | "large" | "xlarge") | {
89
89
  mobile?: ("medium" | "xsmall" | "small" | "large" | "xlarge") | undefined;
90
90
  tablet?: ("medium" | "xsmall" | "small" | "large" | "xlarge") | undefined;
91
91
  desktop?: ("medium" | "xsmall" | "small" | "large" | "xlarge") | undefined;
92
92
  wide?: ("medium" | "xsmall" | "small" | "large" | "xlarge") | undefined;
93
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "xsmall" | "small" | "large" | "xlarge") | null>;
93
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "xsmall" | "small" | "large" | "xlarge") | null>;
94
94
  readonly gap?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
95
95
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
96
96
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
97
97
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
98
98
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
99
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
99
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
100
100
  readonly justifyContent?: ("center" | "flex-start" | "flex-end" | "space-between" | "space-around" | {
101
101
  mobile?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
102
102
  tablet?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
103
103
  desktop?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
104
104
  wide?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | undefined;
105
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | null>;
105
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | null>;
106
106
  readonly marginBottom?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | {
107
107
  mobile?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
108
108
  tablet?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
109
109
  desktop?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
110
110
  wide?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
111
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
111
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
112
112
  readonly marginLeft?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | {
113
113
  mobile?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
114
114
  tablet?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
115
115
  desktop?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
116
116
  wide?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
117
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
117
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
118
118
  readonly marginRight?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | {
119
119
  mobile?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
120
120
  tablet?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
121
121
  desktop?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
122
122
  wide?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
123
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
123
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
124
124
  readonly marginTop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | {
125
125
  mobile?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
126
126
  tablet?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
127
127
  desktop?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
128
128
  wide?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
129
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
129
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
130
130
  readonly outline?: ("none" | {
131
131
  mobile?: "none" | undefined;
132
132
  tablet?: "none" | undefined;
133
133
  desktop?: "none" | undefined;
134
134
  wide?: "none" | undefined;
135
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "none" | null>;
135
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "none" | null>;
136
136
  readonly paddingBottom?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
137
137
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
138
138
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
139
139
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
140
140
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
141
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
141
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
142
142
  readonly paddingLeft?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
143
143
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
144
144
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
145
145
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
146
146
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
147
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
147
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
148
148
  readonly paddingRight?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
149
149
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
150
150
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
151
151
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
152
152
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
153
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
153
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
154
154
  readonly paddingTop?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
155
155
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
156
156
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
157
157
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
158
158
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
159
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
159
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
160
160
  readonly position?: ("relative" | "fixed" | "absolute" | "sticky" | "static" | {
161
161
  mobile?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
162
162
  tablet?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
163
163
  desktop?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
164
164
  wide?: "relative" | "fixed" | "absolute" | "sticky" | "static" | undefined;
165
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "relative" | "fixed" | "absolute" | "sticky" | "static" | null>;
165
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "relative" | "fixed" | "absolute" | "sticky" | "static" | null>;
166
166
  readonly rowGap?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
167
167
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
168
168
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
169
169
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
170
170
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
171
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
171
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
172
172
  readonly textAlign?: ("left" | "right" | "center" | "justify" | {
173
173
  mobile?: "left" | "right" | "center" | "justify" | undefined;
174
174
  tablet?: "left" | "right" | "center" | "justify" | undefined;
175
175
  desktop?: "left" | "right" | "center" | "justify" | undefined;
176
176
  wide?: "left" | "right" | "center" | "justify" | undefined;
177
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "left" | "right" | "center" | "justify" | null>;
177
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "left" | "right" | "center" | "justify" | null>;
178
178
  margin?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | {
179
179
  mobile?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
180
180
  tablet?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
181
181
  desktop?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
182
182
  wide?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
183
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
183
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
184
184
  marginX?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | {
185
185
  mobile?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
186
186
  tablet?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
187
187
  desktop?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
188
188
  wide?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
189
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
189
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
190
190
  marginY?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | {
191
191
  mobile?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
192
192
  tablet?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
193
193
  desktop?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
194
194
  wide?: "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | undefined;
195
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
195
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge" | "auto" | null>;
196
196
  padding?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
197
197
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
198
198
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
199
199
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
200
200
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
201
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
201
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
202
202
  paddingX?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
203
203
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
204
204
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
205
205
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
206
206
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
207
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
207
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
208
208
  paddingY?: (("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | {
209
209
  mobile?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
210
210
  tablet?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
211
211
  desktop?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
212
212
  wide?: ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | undefined;
213
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
213
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, ("medium" | "none" | "gutter" | "xsmall" | "small" | "large" | "xlarge") | null>;
214
214
  placeItems?: ("center" | "flex-start" | "flex-end" | {
215
215
  mobile?: "center" | "flex-start" | "flex-end" | undefined;
216
216
  tablet?: "center" | "flex-start" | "flex-end" | undefined;
217
217
  desktop?: "center" | "flex-start" | "flex-end" | undefined;
218
218
  wide?: "center" | "flex-start" | "flex-end" | undefined;
219
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 2 | 1 | 3, "center" | "flex-start" | "flex-end" | null>;
219
+ } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<4 | 1 | 2 | 3, "center" | "flex-start" | "flex-end" | null>;
220
220
  }) => string) & {
221
221
  properties: Set<"borderRadius" | "color" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "transition" | "boxShadow" | "outline" | "alignItems" | "backgroundColor" | "bottom" | "columnGap" | "cursor" | "display" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "height" | "justifyContent" | "left" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "opacity" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "pointerEvents" | "position" | "right" | "rowGap" | "textAlign" | "textTransform" | "top" | "userSelect" | "whiteSpace" | "width" | "wordBreak" | "wordWrap" | "borderColor" | "flex" | "gap" | "inset" | "margin" | "overflow" | "padding" | "placeItems" | "textDecoration" | "textWrap" | "marginX" | "marginY" | "paddingX" | "paddingY">;
222
222
  };
@@ -293,7 +293,14 @@ type SpinnerTheme = {
293
293
  };
294
294
  };
295
295
  type SpinnerThemeComponent = CreateComponentTheme<SpinnerTheme>;
296
- type ComponentThemes = ButtonThemeComponent | LinkThemeComponent | SpinnerThemeComponent;
296
+ type DividerTheme = {
297
+ type: 'divider';
298
+ variants: {
299
+ color: Exclude<Atoms['color'], undefined>;
300
+ };
301
+ };
302
+ type DividerThemeComponent = CreateComponentTheme<DividerTheme>;
303
+ type ComponentThemes = ButtonThemeComponent | LinkThemeComponent | SpinnerThemeComponent | DividerThemeComponent;
297
304
  type ComponentThemesMap = UnionThemesToRecord<ComponentThemes>;
298
305
  type UnionThemesToRecord<T extends {
299
306
  type: string;
package/dist/styles/lib/css/atoms/atomicProperties.cjs CHANGED
@@ -1,12 +1,13 @@
1
1
  "use strict";
2
2
  const styles_lib_css_theme_vars_css_cjs = require("../theme/vars.css.cjs");
3
+ const colorWithCurrentColor = { ...styles_lib_css_theme_vars_css_cjs.vars.color, currentColor: "currentColor" };
3
4
  const unresponsiveProperties = {
4
- backgroundColor: styles_lib_css_theme_vars_css_cjs.vars.color,
5
- borderColor: styles_lib_css_theme_vars_css_cjs.vars.color,
5
+ backgroundColor: colorWithCurrentColor,
6
+ borderColor: colorWithCurrentColor,
6
7
  borderRadius: styles_lib_css_theme_vars_css_cjs.vars.borderRadius,
7
8
  bottom: [0],
8
9
  boxShadow: styles_lib_css_theme_vars_css_cjs.vars.shadow,
9
- color: { ...styles_lib_css_theme_vars_css_cjs.vars.color, currentColor: "currentColor" },
10
+ color: colorWithCurrentColor,
10
11
  cursor: ["auto", "pointer"],
11
12
  fontFamily: styles_lib_css_theme_vars_css_cjs.vars.fontFamily,
12
13
  fontStyle: ["normal", "italic", "oblique"],
package/dist/styles/lib/css/atoms/atomicProperties.mjs CHANGED
@@ -1,11 +1,12 @@
1
1
  import { vars } from "../theme/vars.css.mjs";
2
+ const colorWithCurrentColor = { ...vars.color, currentColor: "currentColor" };
2
3
  const unresponsiveProperties = {
3
- backgroundColor: vars.color,
4
- borderColor: vars.color,
4
+ backgroundColor: colorWithCurrentColor,
5
+ borderColor: colorWithCurrentColor,
5
6
  borderRadius: vars.borderRadius,
6
7
  bottom: [0],
7
8
  boxShadow: vars.shadow,
8
- color: { ...vars.color, currentColor: "currentColor" },
9
+ color: colorWithCurrentColor,
9
10
  cursor: ["auto", "pointer"],
10
11
  fontFamily: vars.fontFamily,
11
12
  fontStyle: ["normal", "italic", "oblique"],
package/dist/styles/themes/momotaro/components/divider.css.cjs ADDED
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+ const fileScope = require("@vanilla-extract/css/fileScope");
3
+ const styles_lib_css_theme_makeComponentTheme_cjs = require("../../../lib/css/theme/makeComponentTheme.cjs");
4
+ fileScope.setFileScope("src/themes/momotaro/components/divider.css.ts?used", "blocks");
5
+ const divider = styles_lib_css_theme_makeComponentTheme_cjs.makeComponentTheme({
6
+ type: "divider",
7
+ defaultVariants: {
8
+ color: "textLight"
9
+ }
10
+ });
11
+ fileScope.endFileScope();
12
+ exports.divider = divider;
package/dist/styles/themes/momotaro/components/divider.css.mjs ADDED
@@ -0,0 +1,13 @@
1
+ import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
2
+ import { makeComponentTheme } from "../../../lib/css/theme/makeComponentTheme.mjs";
3
+ setFileScope("src/themes/momotaro/components/divider.css.ts?used", "blocks");
4
+ const divider = makeComponentTheme({
5
+ type: "divider",
6
+ defaultVariants: {
7
+ color: "textLight"
8
+ }
9
+ });
10
+ endFileScope();
11
+ export {
12
+ divider
13
+ };
package/dist/styles/themes/momotaro/components/index.cjs CHANGED
@@ -2,9 +2,11 @@
2
2
  const styles_themes_momotaro_components_button_css_cjs = require("./button.css.cjs");
3
3
  const styles_themes_momotaro_components_link_css_cjs = require("./link.css.cjs");
4
4
  const styles_themes_momotaro_components_spinner_css_cjs = require("./spinner.css.cjs");
5
+ const styles_themes_momotaro_components_divider_css_cjs = require("./divider.css.cjs");
5
6
  const components = {
6
7
  button: styles_themes_momotaro_components_button_css_cjs.button,
7
8
  link: styles_themes_momotaro_components_link_css_cjs.link,
8
- spinner: styles_themes_momotaro_components_spinner_css_cjs.spinner
9
+ spinner: styles_themes_momotaro_components_spinner_css_cjs.spinner,
10
+ divider: styles_themes_momotaro_components_divider_css_cjs.divider
9
11
  };
10
12
  exports.components = components;
package/dist/styles/themes/momotaro/components/index.mjs CHANGED
@@ -1,10 +1,12 @@
1
1
  import { button } from "./button.css.mjs";
2
2
  import { link } from "./link.css.mjs";
3
3
  import { spinner } from "./spinner.css.mjs";
4
+ import { divider } from "./divider.css.mjs";
4
5
  const components = {
5
6
  button,
6
7
  link,
7
- spinner
8
+ spinner,
9
+ divider
8
10
  };
9
11
  export {
10
12
  components
package/dist/styles/themes/momotaro/momotaro.css.cjs CHANGED
@@ -2,11 +2,11 @@
2
2
  const fileScope = require("@vanilla-extract/css/fileScope");
3
3
  const styles_lib_css_theme_makeTheme_cjs = require("../../lib/css/theme/makeTheme.cjs");
4
4
  const styles_themes_momotaro_components_index_cjs = require("./components/index.cjs");
5
- const styles_themes_momotaro_tokens_cjs = require("./tokens.cjs");
5
+ const styles_themes_momotaro_tokens_css_cjs = require("./tokens.css.cjs");
6
6
  fileScope.setFileScope("src/themes/momotaro/momotaro.css.ts?used", "blocks");
7
7
  const momotaro = styles_lib_css_theme_makeTheme_cjs.makeTheme({
8
8
  name: "momotaro",
9
- tokens: styles_themes_momotaro_tokens_cjs.tokens,
9
+ tokens: styles_themes_momotaro_tokens_css_cjs.tokens,
10
10
  components: styles_themes_momotaro_components_index_cjs.components
11
11
  });
12
12
  fileScope.endFileScope();
package/dist/styles/themes/momotaro/momotaro.css.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
2
2
  import { makeTheme } from "../../lib/css/theme/makeTheme.mjs";
3
3
  import { components } from "./components/index.mjs";
4
- import { tokens } from "./tokens.mjs";
4
+ import { tokens } from "./tokens.css.mjs";
5
5
  setFileScope("src/themes/momotaro/momotaro.css.ts?used", "blocks");
6
6
  const momotaro = makeTheme({
7
7
  name: "momotaro",
package/dist/styles/themes/momotaro/{tokens.cjs → tokens.css.cjs} RENAMED
@@ -1,4 +1,6 @@
1
1
  "use strict";
2
+ const fileScope = require("@vanilla-extract/css/fileScope");
3
+ fileScope.setFileScope("src/themes/momotaro/tokens.css.ts?used", "blocks");
2
4
  const tokens = {
3
5
  border: {
4
6
  radius: {
@@ -77,4 +79,5 @@ const tokens = {
77
79
  }
78
80
  }
79
81
  };
82
+ fileScope.endFileScope();
80
83
  exports.tokens = tokens;
package/dist/styles/themes/momotaro/{tokens.mjs → tokens.css.mjs} RENAMED
@@ -1,3 +1,5 @@
1
+ import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
2
+ setFileScope("src/themes/momotaro/tokens.css.ts?used", "blocks");
1
3
  const tokens = {
2
4
  border: {
3
5
  radius: {
@@ -76,6 +78,7 @@ const tokens = {
76
78
  }
77
79
  }
78
80
  };
81
+ endFileScope();
79
82
  export {
80
83
  tokens
81
84
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blockle/blocks",
3
- "version": "0.3.4",
3
+ "version": "0.3.5",
4
4
  "description": "Blocks design system",
5
5
  "repository": "git@github.com:Blockle/blocks.git",
6
6
  "license": "MIT",
@@ -72,19 +72,19 @@
72
72
  "@testing-library/jest-dom": "^6.1.3",
73
73
  "@testing-library/react": "^14.0.0",
74
74
  "@types/react": "^18.2.25",
75
- "@types/react-dom": "^18.2.10",
75
+ "@types/react-dom": "^18.2.11",
76
76
  "@typescript-eslint/eslint-plugin": "^6.7.4",
77
77
  "@typescript-eslint/parser": "^6.7.4",
78
78
  "@vanilla-extract/vite-plugin": "^3.8.2",
79
79
  "@vitest/coverage-v8": "^0.34.6",
80
80
  "cross-env": "^7.0.3",
81
- "eslint": "^8.50.0",
81
+ "eslint": "^8.51.0",
82
82
  "eslint-config-prettier": "^9.0.0",
83
83
  "eslint-plugin-jest": "^27.4.2",
84
84
  "eslint-plugin-prettier": "^5.0.0",
85
85
  "eslint-plugin-react": "^7.33.2",
86
86
  "eslint-plugin-react-hooks": "^4.6.0",
87
- "eslint-plugin-storybook": "^0.6.14",
87
+ "eslint-plugin-storybook": "^0.6.15",
88
88
  "eslint-plugin-unicorn": "^48.0.1",
89
89
  "jsdom": "^22.1.0",
90
90
  "prettier": "^3.0.3",