fix: add padding none to Card, add optional children to Toggle

Author: shinokada

src/generatedFileList.ts

@@ -130,4 +130,4 @@ export const fileList = [
   "src/lib/typography/span/Span.svelte",
   "src/lib/utils/CloseButton.svelte",
   "src/lib/video/Video.svelte"
-] as const;
+] as const;

src/lib/cards/Card.svelte

@@ -41,7 +41,7 @@
 @props:reverse: boolean = false;
 @props:img: {
   src: string | undefined | null;
-@props:padding: "sm" | "lg" | "md" | "xl" | "xs" | undefined = "lg";
+@props:padding: "sm" | "lg" | "md" | "xl" | "xs" | "none" | undefined = "lg";
 @props:size: "sm" | "md" | "lg" | "xl" | "xs" | undefined = "sm";
 @props:class: string;
 @props:imgClass: string;

src/lib/cards/index.ts

@@ -5,7 +5,7 @@ import { card } from "./theme";
 
 // type CardSizeType = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 type CardSizeType = "sm" | "md" | "lg" | "xl" | "xs" | undefined;
-type PaddingType = "sm" | "lg" | "md" | "xl" | "xs" | undefined;
+type PaddingType = "sm" | "lg" | "md" | "xl" | "xs" | "none" | undefined;
 type ShadowType = "sm" | "normal" | "lg" | "md" | "xl" | "2xl" | "inner" | undefined;
 type ColorType = "gray" | "primary" | "secondary" | "red" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "pink" | "rose" | undefined;
 

src/lib/cards/theme.ts

@@ -51,7 +51,8 @@ export const card = tv({
       sm: { content: "p-4 md:p-6" },
       md: { content: "p-4 sm:p-5 md:p-7" },
       lg: { content: "p-4 sm:p-6 md:p-8" },
-      xl: { content: "p-4 sm:p-8 md:p-10" }
+      xl: { content: "p-4 sm:p-8 md:p-10" },
+      none: { content: "p-0" }
     },
     horizontal: {
       true: {

src/lib/forms/toggle/Toggle.svelte

@@ -13,7 +13,9 @@
   {/if}
   <input type="checkbox" bind:checked {value} aria-describedby={aria_describedby} {...restProps} {disabled} class={input({ class: inputClass })} />
   <span class={span({ class: spanClass })}></span>
-  {@render children()}
+  {#if children}
+    {@render children()}
+  {/if}
 </Label>
 
 <!--

src/lib/forms/toggle/index.ts

@@ -7,7 +7,7 @@ type SizeType = "default" | "small" | "large" | undefined;
 type ToggleColor = "primary" | "secondary" | "gray" | "red" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "pink" | "rose" | undefined;
 
 interface ToggleProps extends HTMLInputAttributes {
-  children: Snippet;
+  children?: Snippet;
   leftLabel?: Snippet;
   toggleSize?: SizeType;
   value?: string | number;

src/routes/component-data/Card.json

@@ -38,7 +38,7 @@
     ],
     [
       "padding",
-      "\"sm\" | \"lg\" | \"md\" | \"xl\" | \"xs\" | undefined",
+      "\"sm\" | \"lg\" | \"md\" | \"xl\" | \"xs\" | \"none\" | undefined",
       "\"lg\""
     ],
     [