@valerius_petrini/corekit-ui 0.1.55 → 0.1.56

package/dist/components/Input.svelte

@@ -100,7 +100,7 @@
     const lifted = $derived(isFloating && (isFocused || hasContent));
 
     const Icon = $derived(icon ?? ({
-        mail: Mail, password: Lock, tel: Phone
+        email: Mail, password: Lock, tel: Phone
     }[restProps.type as string] as Component ?? null));
 
     let defaultClass = "text-main-text w-full rounded outline-none px-1.5 w-full bg-inherit border-0 focus:ring-0 focus-visible:ring-0";

package/dist/components/Progress.svelte

@@ -52,6 +52,7 @@
 
     let combinedInnerClass = $derived(twMerge(
         "h-full",
+        sizeClasses,
         colorStyleParts[color]?.base,
         className
     ))

package/dist/components/Table.svelte

@@ -0,0 +1,47 @@
+<script lang="ts">
+    import type { TableProps } from "../types/Table.js";
+    import { twMerge } from "tailwind-merge";
+
+    let { 
+        children = undefined, 
+        class: className = "",
+        tableHeaders = [],
+        tableData = [],
+        size = "md",
+        radius = "md",
+        ...restProps
+    }: TableProps = $props();
+
+    const defaultTableClass = "w-full border-collapse text-main-text border border-form-border border-l-0";
+    const defaultTableHeaderClass = "text-left border-b border-b-1 border-b-form-border bg-sub-background font-medium";
+    const defaultTableCellClass = "p-2 text-sm border-l border-l-[1px] border-l-form-border";
+    const defaultTableBodyClass = "even:bg-sub-background odd:bg-form-background";
+
+    const combinedTableClass = $derived(twMerge(
+        defaultTableClass,
+        className
+    ));
+
+    const combinedTableHeaderClass = $derived(twMerge(defaultTableHeaderClass, defaultTableCellClass));
+</script>
+
+<div class="overflow-auto w-full">
+    <table {...restProps} class={combinedTableClass}>
+        <thead>
+            <tr>
+                {#each tableHeaders as header}
+                    <th class={combinedTableHeaderClass}>{header.label}</th>
+                {/each}
+            </tr>
+        </thead>
+        <tbody>
+            {#each tableData as row}
+                <tr class={defaultTableBodyClass}>
+                    {#each row as cell}
+                        <td class={defaultTableCellClass}>{cell}</td>
+                    {/each}
+                </tr>
+            {/each}
+        </tbody>
+    </table>
+</div>

package/dist/components/Table.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { TableProps } from "../types/Table.ts";
+declare const Table: import("svelte").Component<TableProps, {}, "">;
+type Table = ReturnType<typeof Table>;
+export default Table;

package/dist/styles/layout.css

@@ -43,7 +43,7 @@ html.dark {
     --vpcui-sub-text: #A0A0A0;
     --vpcui-contrast-text: #111;
     --vpcui-form-background: #2A2A2A;
-    --vpcui-form-border: #3A3A3A;
+    --vpcui-form-border: #4A4A4A;
     --vpcui-navbar-element-hover-background: var(--color-zinc-900);
 }
 

package/dist/types/Table.d.ts

@@ -0,0 +1,14 @@
+import type { SizeStyle } from "../styles/size.js";
+export interface TableHeaders {
+    key: string;
+    label: string;
+}
+export interface TableProps {
+    children?: any;
+    class?: string;
+    tableHeaders?: TableHeaders[];
+    tableData?: any[];
+    size?: SizeStyle;
+    radius?: SizeStyle;
+    [key: string]: any;
+}

package/dist/types/Table.js

@@ -0,0 +1,3 @@
+;
+;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@valerius_petrini/corekit-ui",
-	"version": "0.1.55",
+	"version": "0.1.56",
 	"description": "Component Library used across all my projects",
 	"author": "Valerius Petrini Jr.",
 	"license": "MIT",