@kalink-ui/seedly 0.28.0 → 0.29.1

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 (6) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/package.json +1 -1
  3. package/src/components/button-icon/button-icon.css.ts +7 -7
  4. package/src/components/grid/grid.css.ts +4 -4
  5. package/src/components/grid/grid.responsive.ts +2 -2
  6. package/src/components/grid/grid.tsx +6 -8
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @kalink-ui/seedly
2
2
 
3
+ ## 0.29.1
4
+
5
+ ### Patch Changes
6
+
7
+ - 174eb5b: Correctly apply auto layout when defined
8
+
9
+ ## 0.29.0
10
+
11
+ ### Minor Changes
12
+
13
+ - 8c2404f: Correctly use the overrides layer for ButtonIcon specificities
14
+
3
15
  ## 0.28.0
4
16
 
5
17
  ### Minor Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kalink-ui/seedly",
3
- "version": "0.28.0",
3
+ "version": "0.29.1",
4
4
  "description": "A set of components for building UIs with React and TypeScript",
5
5
  "sideEffects": false,
6
6
  "license": "MIT",
package/src/components/button-icon/button-icon.css.ts CHANGED
@@ -2,7 +2,7 @@ import { assignVars } from '@vanilla-extract/css';
2
2
  import { recipe, RecipeVariants } from '@vanilla-extract/recipes';
3
3
 
4
4
  import { createResponsiveVariants, defaultMedia, sys } from '../../styles';
5
- import { components } from '../../styles/layers.css';
5
+ import { overrides } from '../../styles/layers.css';
6
6
  import {
7
7
  buttonRecipe,
8
8
  buttonVars,
@@ -19,7 +19,7 @@ export const buttonIcon = recipe({
19
19
  buttonRecipe.classNames.variants.size.sm,
20
20
  {
21
21
  '@layer': {
22
- [components]: {
22
+ [overrides]: {
23
23
  vars: assignVars(buttonVars.spacing, {
24
24
  block: sys.spacing[2],
25
25
  inline: sys.spacing[2],
@@ -33,7 +33,7 @@ export const buttonIcon = recipe({
33
33
  buttonRecipe.classNames.variants.size.md,
34
34
  {
35
35
  '@layer': {
36
- [components]: {
36
+ [overrides]: {
37
37
  vars: assignVars(buttonVars.spacing, {
38
38
  block: sys.spacing[2],
39
39
  inline: sys.spacing[2],
@@ -47,7 +47,7 @@ export const buttonIcon = recipe({
47
47
  buttonRecipe.classNames.variants.size.lg,
48
48
  {
49
49
  '@layer': {
50
- [components]: {
50
+ [overrides]: {
51
51
  vars: assignVars(buttonVars.spacing, {
52
52
  block: sys.spacing[3],
53
53
  inline: sys.spacing[3],
@@ -72,7 +72,7 @@ export type ButtonIconVariants = NonNullable<RecipeVariants<typeof buttonIcon>>;
72
72
  const buttonIconSizeStyles = {
73
73
  sm: {
74
74
  '@layer': {
75
- [components]: {
75
+ [overrides]: {
76
76
  vars: assignVars(buttonVars.spacing, {
77
77
  block: sys.spacing[2],
78
78
  inline: sys.spacing[2],
@@ -83,7 +83,7 @@ const buttonIconSizeStyles = {
83
83
  },
84
84
  md: {
85
85
  '@layer': {
86
- [components]: {
86
+ [overrides]: {
87
87
  vars: assignVars(buttonVars.spacing, {
88
88
  block: sys.spacing[2],
89
89
  inline: sys.spacing[2],
@@ -94,7 +94,7 @@ const buttonIconSizeStyles = {
94
94
  },
95
95
  lg: {
96
96
  '@layer': {
97
- [components]: {
97
+ [overrides]: {
98
98
  vars: assignVars(buttonVars.spacing, {
99
99
  block: sys.spacing[3],
100
100
  inline: sys.spacing[3],
package/src/components/grid/grid.css.ts CHANGED
@@ -172,7 +172,7 @@ const gridColumnsStyles = Object.fromEntries(
172
172
  { '@layer': Record<string, { gridTemplateColumns: string }> }
173
173
  >;
174
174
 
175
- export const gridFitStyles = {
175
+ export const autoLayoutStyles = {
176
176
  fill: {
177
177
  '@layer': {
178
178
  [components]: {
@@ -226,7 +226,7 @@ export const gridRecipe = recipe({
226
226
  /**
227
227
  * Whether to use auto-fill (default) or auto-fit
228
228
  */
229
- fit: gridFitStyles,
229
+ autoLayout: autoLayoutStyles,
230
230
 
231
231
  /**
232
232
  * Grid item alignment along inline axis
@@ -274,8 +274,8 @@ export const columnsAt = createResponsiveVariants({
274
274
  media: defaultMedia,
275
275
  });
276
276
 
277
- export const fitAt = createResponsiveVariants({
278
- styles: gridFitStyles,
277
+ export const autoLayoutAt = createResponsiveVariants({
278
+ styles: autoLayoutStyles,
279
279
  media: defaultMedia,
280
280
  });
281
281
 
package/src/components/grid/grid.responsive.ts CHANGED
@@ -4,7 +4,7 @@ import {
4
4
  alignContentAt,
5
5
  alignItemsAt,
6
6
  columnsAt,
7
- fitAt,
7
+ autoLayoutAt,
8
8
  gridRecipe,
9
9
  justifyContentAt,
10
10
  justifyItemsAt,
@@ -20,7 +20,7 @@ export const gridResponsive = responsiveRecipe({
20
20
  columnSpacing: columnSpacingAt,
21
21
  rowSpacing: rowSpacingAt,
22
22
  columns: columnsAt,
23
- fit: fitAt,
23
+ autoLayout: autoLayoutAt,
24
24
  justifyItems: justifyItemsAt,
25
25
  alignItems: alignItemsAt,
26
26
  justifyContent: justifyContentAt,
package/src/components/grid/grid.tsx CHANGED
@@ -30,18 +30,16 @@ type GridProps<TUse extends ElementType> = PolymorphicComponentProps<TUse> &
30
30
  *
31
31
  * https://every-layout.dev/layouts/grid/
32
32
  */
33
- export function Grid<TUse extends ElementType>({
34
- minSize,
35
- className,
36
- ...props
37
- }: GridProps<TUse>) {
33
+ export function Grid<TUse extends ElementType>(props: GridProps<TUse>) {
38
34
  const {
39
35
  use: Comp = 'div',
36
+ minSize,
37
+ className,
40
38
  spacing,
41
39
  columnSpacing,
42
40
  rowSpacing,
43
41
  columns = { xs: 4, md: 8, lg: 12 },
44
- fit,
42
+ autoLayout,
45
43
  justifyItems,
46
44
  alignItems,
47
45
  justifyContent,
@@ -56,8 +54,8 @@ export function Grid<TUse extends ElementType>({
56
54
  spacing,
57
55
  columnSpacing,
58
56
  rowSpacing,
59
- columns,
60
- fit,
57
+ columns: autoLayout ? undefined : columns,
58
+ autoLayout,
61
59
  justifyItems,
62
60
  alignItems,
63
61
  justifyContent,