@kalink-ui/seedly 0.13.0 → 0.14.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.
Files changed (5) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/package.json +3 -3
  3. package/src/components/stack/stack.css.ts +3 -20
  4. package/src/components/stack/stack.tsx +1 -5
  5. package/src/styles/define-responsive-properties.ts +2 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @kalink-ui/seedly
2
2
 
3
+ ## 0.14.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 6d5d569: [Stack] Use flex-box instead of margin for spacing between elements
8
+
3
9
  ## 0.13.0
4
10
 
5
11
  ### Minor Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kalink-ui/seedly",
3
- "version": "0.13.0",
3
+ "version": "0.14.0",
4
4
  "description": "A set of components for building UIs with React and TypeScript",
5
5
  "sideEffects": false,
6
6
  "license": "MIT",
@@ -48,8 +48,8 @@
48
48
  "vite-tsconfig-paths": "^5.1.4",
49
49
  "vitest": "^3.0.8",
50
50
  "@kalink-ui/dibbly": "0.4.0",
51
- "@kalink-ui/eslint-config": "0.9.0",
52
- "@kalink-ui/typescript-config": "0.4.0"
51
+ "@kalink-ui/typescript-config": "0.4.0",
52
+ "@kalink-ui/eslint-config": "0.9.0"
53
53
  },
54
54
  "peerDependencies": {
55
55
  "@vanilla-extract/css": "^1.17.1",
package/src/components/stack/stack.css.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { createVar, globalStyle } from '@vanilla-extract/css';
1
+ import { createVar } from '@vanilla-extract/css';
2
2
  import { recipe, type RecipeVariants } from '@vanilla-extract/recipes';
3
3
 
4
4
  import { sys, mapContractVars } from '../../styles';
@@ -16,19 +16,13 @@ export const stackRecipe = recipe({
16
16
  [components]: {
17
17
  display: 'flex',
18
18
  flexDirection: 'column',
19
- justifyContent: 'flex-start',
19
+ alignItems: 'flex-start',
20
+ gap: spacing,
20
21
  },
21
22
  },
22
23
  },
23
24
 
24
25
  variants: {
25
- /**
26
- * Whether the stack spacing should be applied recursively
27
- */
28
- recursive: {
29
- true: {},
30
- },
31
-
32
26
  /**
33
27
  * The spacing between items
34
28
  */
@@ -44,15 +38,4 @@ export const stackRecipe = recipe({
44
38
  },
45
39
  });
46
40
 
47
- globalStyle(
48
- `${stackRecipe.classNames.base} > * + *, ${stackRecipe.classNames.variants.recursive.true} * + *`,
49
- {
50
- '@layer': {
51
- [components]: {
52
- marginBlockStart: spacing,
53
- },
54
- },
55
- },
56
- );
57
-
58
41
  export type StackVariants = NonNullable<RecipeVariants<typeof stackRecipe>>;
package/src/components/stack/stack.tsx CHANGED
@@ -18,7 +18,6 @@ export type StackProps<TUse extends ElementType> =
18
18
  * https://every-layout.dev/layouts/stack
19
19
  */
20
20
  export function Stack<TUse extends ElementType = 'div'>({
21
- recursive,
22
21
  spacing,
23
22
  className,
24
23
  ...props
@@ -26,9 +25,6 @@ export function Stack<TUse extends ElementType = 'div'>({
26
25
  const { use: Comp = 'div', ...rest } = props;
27
26
 
28
27
  return (
29
- <Comp
30
- className={clsx(stackRecipe({ recursive, spacing }), className)}
31
- {...rest}
32
- />
28
+ <Comp className={clsx(stackRecipe({ spacing }), className)} {...rest} />
33
29
  );
34
30
  }
package/src/styles/define-responsive-properties.ts CHANGED
@@ -61,11 +61,13 @@ export const defineResponsiveProperties = ({
61
61
  flexDirection: ['row', 'row-reverse', 'column', 'column-reverse'],
62
62
 
63
63
  justifyContent: [
64
+ 'stretch',
64
65
  'flex-start',
65
66
  'flex-end',
66
67
  'center',
67
68
  'space-between',
68
69
  'space-around',
70
+ 'space-evenly',
69
71
  ],
70
72
  alignItems: ['flex-start', 'flex-end', 'center', 'baseline', 'stretch'],
71
73
  alignSelf: ['flex-start', 'flex-end', 'center', 'baseline', 'stretch'],