@spaethtech/svelte-ui 0.4.0 → 0.4.1-dev.13.042fac9

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 (3) hide show
  1. package/dist/components/CardFooter.svelte +7 -3
  2. package/dist/components/CardHeader.svelte +7 -3
  3. package/package.json +1 -1
package/dist/components/CardFooter.svelte CHANGED
@@ -29,7 +29,11 @@
29
29
  children?: Snippet;
30
30
  } & Omit<HTMLAttributes<HTMLDivElement>, "class"> = $props();
31
31
 
32
- const space: Record<Size, string> = { sm: "pt-2 mt-2", md: "pt-3 mt-3", lg: "pt-4 mt-4" };
32
+ // The body→footer gap (`pad`) is ALWAYS applied, so `separator={false}` still leaves breathing room
33
+ // above the footer (just no line). `separator={true}` adds the line + a matching margin above it
34
+ // (`sepGap`), giving the margin → line → pad rhythm.
35
+ const pad: Record<Size, string> = { sm: "pt-2", md: "pt-3", lg: "pt-4" };
36
+ const sepGap: Record<Size, string> = { sm: "mt-2", md: "mt-3", lg: "mt-4" };
33
37
  // The separator is a SOFT internal divider, consistent with the other section splits/footers in the
34
38
  // library (DatePicker/TimePicker/TimeRangeInput) — deliberately lighter than the Card frame + fields.
35
39
  // Default (secondary) → the shared `--ui-border-color`; any other variant → that accent's tint.
@@ -41,8 +45,8 @@
41
45
  </script>
42
46
 
43
47
  <div
44
- class="flex items-center justify-end gap-3 {separator
45
- ? 'border-t ' + responsiveClasses(size, space)
48
+ class="flex items-center justify-end gap-3 {responsiveClasses(size, pad)} {separator
49
+ ? 'border-t ' + responsiveClasses(size, sepGap)
46
50
  : ''} {cls}"
47
51
  style={separator ? `border-color: ${sepColor}` : ""}
48
52
  {...rest}
package/dist/components/CardHeader.svelte CHANGED
@@ -29,7 +29,11 @@
29
29
  children?: Snippet;
30
30
  } & Omit<HTMLAttributes<HTMLDivElement>, "class"> = $props();
31
31
 
32
- const space: Record<Size, string> = { sm: "pb-2 mb-2", md: "pb-3 mb-3", lg: "pb-4 mb-4" };
32
+ // The title→body gap (`pad`) is ALWAYS applied, so `separator={false}` still leaves breathing room
33
+ // below the header (just no line). `separator={true}` adds the line + a matching margin below it
34
+ // (`sepGap`), giving the pad → line → margin rhythm.
35
+ const pad: Record<Size, string> = { sm: "pb-2", md: "pb-3", lg: "pb-4" };
36
+ const sepGap: Record<Size, string> = { sm: "mb-2", md: "mb-3", lg: "mb-4" };
33
37
  // The separator is a SOFT internal divider, consistent with the other section splits/footers in the
34
38
  // library (DatePicker/TimePicker/TimeRangeInput) — deliberately lighter than the Card frame + fields.
35
39
  // Default (secondary) → the shared `--ui-border-color`; any other variant → that accent's tint.
@@ -41,8 +45,8 @@
41
45
  </script>
42
46
 
43
47
  <div
44
- class="flex items-center justify-between gap-3 {separator
45
- ? 'border-b ' + responsiveClasses(size, space)
48
+ class="flex items-center justify-between gap-3 {responsiveClasses(size, pad)} {separator
49
+ ? 'border-b ' + responsiveClasses(size, sepGap)
46
50
  : ''} {cls}"
47
51
  style={separator ? `border-color: ${sepColor}` : ""}
48
52
  {...rest}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spaethtech/svelte-ui",
3
- "version": "0.4.0",
3
+ "version": "0.4.1-dev.13.042fac9",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/spaethtech/svelte-ui.git"