fluid-ui-svelte 0.0.6 → 0.0.8

package/dist/index.js

@@ -1,34 +1,35 @@
-//Primitives
-export { default as Audio } from './primitives/Audio/Audio.svelte';
-export { default as Button } from './primitives/Button/Button.svelte';
-export { default as Container } from './primitives/Container/Container.svelte';
-export { default as Form } from './primitives/Form/Form.svelte';
-export { default as Image } from "./primitives/Image/Image.svelte";
-export { default as ColorInput } from './primitives/Input/ColorInput.svelte';
-export { default as DateTimeInput } from './primitives/Input/DateTimeInput.svelte';
-export { default as FileInput } from './primitives/Input/FileInput.svelte';
-export { default as TextInput } from './primitives/Input/TextInput.svelte';
-export { default as PasswordInput } from './primitives/Input/PasswordInput.svelte';
-export { default as ToggleInput } from './primitives/Input/ToggleInput.svelte';
-export { default as Label } from './primitives/Label/Label.svelte';
-export { default as Link } from "./primitives/Link/Link.svelte";
-export { default as Option } from "./primitives/Select/Option.svelte";
-export { default as Select } from "./primitives/Select/Select.svelte";
-export { default as Table } from "./primitives/Table/Table.svelte";
-export { default as TableBody } from "./primitives/Table/TableBody.svelte";
-export { default as TableDataCell } from "./primitives/Table/TableDataCell.svelte";
-export { default as TableFoot } from "./primitives/Table/TableFoot.svelte";
-export { default as TableHead } from "./primitives/Table/TableHead.svelte";
-export { default as TableHeader } from "./primitives/Table/TableHeader.svelte";
-export { default as TableRow } from "./primitives/Table/TableRow.svelte";
-export { default as Text } from "./primitives/Text/Text.svelte";
-export { default as Video } from "./primitives/Video/Video.svelte";
-
-//Components
-export { default as AccordionWrapper } from './components/Accordion/AccordionWrapper.svelte';
-export { default as AccordionContent } from './components/Accordion/AccordionContent.svelte';
-export { default as AccordionHeader } from './components/Accordion/AccordionHeader.svelte';
-export { default as Avatar } from './components/Avatar/Avatar.svelte';
-export { default as ModalContainer } from './components/Modal/ModalContainer.svelte';
-
-
+// Primitives 
+export { default as Anchor } from "./primitives/Anchor.svelte";
+export { default as Button } from "./primitives/Button.svelte";
+export { default as Container } from "./primitives/Container.svelte";
+export { default as Dialog } from "./primitives/Dialog.svelte";
+export { default as Form } from "./primitives/Form.svelte";
+export { default as Image } from "./primitives/Image.svelte";
+export { default as Input } from "./primitives/Input.svelte";
+export { default as Label } from "./primitives/Label.svelte";
+export { default as Table } from "./primitives/Table.svelte";
+export { default as TableBody } from "./primitives/TableBody.svelte";
+export { default as TableData } from "./primitives/TableData.svelte";
+export { default as TableFooter } from "./primitives/TableFooter.svelte";
+export { default as TableHead } from "./primitives/TableHead.svelte";
+export { default as TableHeader } from "./primitives/TableHeader.svelte";
+export { default as TableRow } from "./primitives/TableRow.svelte";
+export { default as Text } from "./primitives/Text.svelte";
+export { default as TextArea } from "./primitives/TextArea.svelte";
+// Components
+export { default as Accordion } from "./components/Accordion.svelte";
+export { default as Breadcrumb } from "./components/Breadcrumb.svelte";
+export { default as Drawer } from "./components/Drawer.svelte";
+export { default as Dropdown } from "./components/Dropdown.svelte";
+export { default as NotificationArea } from "./components/NotificationArea.svelte";
+export { default as Pagination } from "./components/Pagination.svelte";
+export { default as Progress } from "./components/Progress.svelte";
+export { default as Switch } from "./components/Switch.svelte";
+export { default as Tabs } from "./components/Tabs.svelte";
+export { default as UploadZone } from "./components/UploadZone.svelte";
+// Prebuilt
+export { default as FormBuilder } from "./prebuilt/FormBuilder.svelte";
+export { default as InteractiveScrollArea } from "./prebuilt/InteractiveScrollArea.svelte";
+export { default as Document } from "./prebuilt/document/Document.svelte";
+export { default as DocumentBlock } from "./prebuilt/document/DocumentBlock.svelte";
+export { default as DocumentPage } from "./prebuilt/document/DocumentPage.svelte";

package/dist/prebuilt/FormBuilder.svelte

@@ -0,0 +1 @@
+<!-- TODO -->

package/dist/prebuilt/FormBuilder.svelte.d.ts

@@ -0,0 +1,26 @@
+export default FormBuilder;
+type FormBuilder = SvelteComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: string | undefined;
+};
+declare const FormBuilder: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/dist/prebuilt/InteractiveScrollArea.svelte

@@ -0,0 +1 @@
+<!-- TODO -->

package/dist/prebuilt/InteractiveScrollArea.svelte.d.ts

@@ -0,0 +1,26 @@
+export default InteractiveScrollArea;
+type InteractiveScrollArea = SvelteComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: string | undefined;
+};
+declare const InteractiveScrollArea: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/dist/prebuilt/document/Document.svelte

@@ -0,0 +1 @@
+<!-- TODO -->

package/dist/prebuilt/document/Document.svelte.d.ts

@@ -0,0 +1,26 @@
+export default Document;
+type Document = SvelteComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: string | undefined;
+};
+declare const Document: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/dist/prebuilt/document/DocumentBlock.svelte

@@ -0,0 +1 @@
+<!-- TODO -->

package/dist/prebuilt/document/DocumentBlock.svelte.d.ts

@@ -0,0 +1,26 @@
+export default DocumentBlock;
+type DocumentBlock = SvelteComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: string | undefined;
+};
+declare const DocumentBlock: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/dist/prebuilt/document/DocumentPage.svelte

@@ -0,0 +1 @@
+<!-- TODO -->

package/dist/prebuilt/document/DocumentPage.svelte.d.ts

@@ -0,0 +1,26 @@
+export default DocumentPage;
+type DocumentPage = SvelteComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: string | undefined;
+};
+declare const DocumentPage: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/dist/primitives/Anchor.svelte

@@ -0,0 +1,18 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	import { type HTMLAnchorAttributes } from "svelte/elements";
+	const {
+		class: className,
+		children,
+		overrideDefaultStyling = false,
+		...restProps
+	}: {
+		class?: string;
+		overrideDefaultStyling?: boolean;
+		children: Snippet;
+	} & HTMLAnchorAttributes = $props();
+</script>
+
+<a {...restProps} class={(overrideDefaultStyling ? "" : "fluid-anchor") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+	{@render children()}
+</a>

package/dist/primitives/Anchor.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from "svelte";
+import { type HTMLAnchorAttributes } from "svelte/elements";
+declare const Anchor: import("svelte").Component<{
+    class?: string;
+    overrideDefaultStyling?: boolean;
+    children: Snippet;
+} & HTMLAnchorAttributes, {}, "">;
+export default Anchor;

package/dist/primitives/Button.svelte

@@ -0,0 +1,42 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	import { type HTMLButtonAttributes } from "svelte/elements";
+
+	const {
+		class: className = "",
+		buttonType = "solid",
+		buttonStyle = "primary",
+		onclick,
+		overrideDefaultStyling = false,
+		children,
+		...restProps
+	}: {
+		class?: string;
+		buttonType?: "solid" | "outline" | "transparent";
+		buttonStyle?: "primary" | "secondary" | "tetriary" | "neutral";
+		onclick: (e: Event) => any;
+		overrideDefaultStyling?: boolean;
+		children: Snippet;
+	} & Omit<HTMLButtonAttributes, "onclick"> = $props();
+	let isActive = $state(false);
+</script>
+
+<button
+	onclick={async (e: Event) => {
+		if (isActive) {
+			return;
+		}
+		if (onclick) {
+			isActive = true;
+			await onclick(e);
+			isActive = false;
+		}
+	}}
+	class={(overrideDefaultStyling ? "" : "fluid-button") +
+		(className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "") +
+		(" fluid-" + buttonType + "-button") +
+		(" fluid-" + buttonStyle + "-button")}
+	{...restProps}
+>
+	{@render children()}
+</button>

package/dist/primitives/Button.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Snippet } from "svelte";
+import { type HTMLButtonAttributes } from "svelte/elements";
+declare const Button: import("svelte").Component<{
+    class?: string;
+    buttonType?: "solid" | "outline" | "transparent";
+    buttonStyle?: "primary" | "secondary" | "tetriary" | "neutral";
+    onclick: (e: Event) => any;
+    overrideDefaultStyling?: boolean;
+    children: Snippet;
+} & Omit<HTMLButtonAttributes, "onclick">, {}, "">;
+export default Button;

package/dist/primitives/Container.svelte

@@ -0,0 +1,49 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	import { type HTMLAttributes } from "svelte/elements";
+
+	const {
+		containerType = "div",
+		class: className = "",
+		overrideDefaultStyling = false,
+		children,
+		...restProps
+	}: {
+		containerType?: "div" | "section" | "aside" | "nav" | "footer";
+		class?: string;
+		overrideDefaultStyling?: boolean;
+		children?: Snippet;
+	} & HTMLAttributes<HTMLElement> = $props();
+</script>
+
+{#if containerType == "div"}
+	<div {...restProps} class={(overrideDefaultStyling ? "" : "fluid-container") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+		{#if children}
+			{@render children()}
+		{/if}
+	</div>
+{:else if containerType == "section"}
+	<section {...restProps} class={(overrideDefaultStyling ? "" : "fluid-container") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+		{#if children}
+			{@render children()}
+		{/if}
+	</section>
+{:else if containerType == "aside"}
+	<aside {...restProps} class={(overrideDefaultStyling ? "" : "fluid-container") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+		{#if children}
+			{@render children()}
+		{/if}
+	</aside>
+{:else if containerType == "nav"}
+	<nav {...restProps} class={(overrideDefaultStyling ? "" : "fluid-container") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+		{#if children}
+			{@render children()}
+		{/if}
+	</nav>
+{:else if containerType == "footer"}
+	<footer {...restProps} class={(overrideDefaultStyling ? "" : "fluid-container") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+		{#if children}
+			{@render children()}
+		{/if}
+	</footer>
+{/if}

package/dist/primitives/Container.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from "svelte";
+import { type HTMLAttributes } from "svelte/elements";
+declare const Container: import("svelte").Component<{
+    containerType?: "div" | "section" | "aside" | "nav" | "footer";
+    class?: string;
+    overrideDefaultStyling?: boolean;
+    children?: Snippet;
+} & HTMLAttributes<HTMLElement>, {}, "">;
+export default Container;

package/dist/primitives/Dialog.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	import { type HTMLDialogAttributes } from "svelte/elements";
+	let {
+		class: className,
+		isOpen = $bindable(false),
+		dialogType = "modal",
+		children,
+		overrideDefaultStyling = false,
+		...restProps
+	}: {
+		class?: string;
+		isOpen?: boolean;
+		dialogType?: "modal" | "normal";
+		overrideDefaultStyling?: boolean;
+		children: Snippet;
+	} & HTMLDialogAttributes = $props();
+
+	let dialogElement: HTMLDialogElement;
+
+	$effect(() => {
+		if (isOpen) {
+			dialogType === "modal" ? dialogElement.showModal() : dialogElement.show();
+		} else {
+			dialogElement.close();
+		}
+	});
+</script>
+
+<dialog
+	bind:this={dialogElement}
+	onclose={(e: Event) => {
+		isOpen = false;
+	}}
+	class={(overrideDefaultStyling ? "" : "fluid-dialog") +  (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}
+	{...restProps}
+>
+	{@render children()}
+</dialog>

package/dist/primitives/Dialog.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Snippet } from "svelte";
+import { type HTMLDialogAttributes } from "svelte/elements";
+declare const Dialog: import("svelte").Component<{
+    class?: string;
+    isOpen?: boolean;
+    dialogType?: "modal" | "normal";
+    overrideDefaultStyling?: boolean;
+    children: Snippet;
+} & HTMLDialogAttributes, {}, "isOpen">;
+export default Dialog;

package/dist/primitives/Form.svelte

@@ -0,0 +1,18 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	import { type HTMLFormAttributes } from "svelte/elements";
+	const {
+		class: className,
+		children,
+		overrideDefaultStyling = false,
+		...restProps
+	}: {
+		class?: string;
+		overrideDefaultStyling?: boolean;
+		children: Snippet;
+	} & HTMLFormAttributes = $props();
+</script>
+
+<form {...restProps} class={(overrideDefaultStyling ? "" : "fluid-form") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+	{@render children()}
+</form>

package/dist/primitives/Form.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from "svelte";
+import { type HTMLFormAttributes } from "svelte/elements";
+declare const Form: import("svelte").Component<{
+    class?: string;
+    overrideDefaultStyling?: boolean;
+    children: Snippet;
+} & HTMLFormAttributes, {}, "">;
+export default Form;

package/dist/primitives/Image.svelte

@@ -0,0 +1,64 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	import { type HTMLImgAttributes } from "svelte/elements";
+	const {
+		class: className,
+		loadingSnippet,
+		errorSnippet,
+		noPlaceholders = false,
+		overrideDefaultStyling = false,
+		...restProps
+	}: {
+		class?: string;
+		loadingSnippet?: Snippet;
+		errorSnippet?: Snippet;
+		noPlaceholders?: boolean;
+		overrideDefaultStyling?: boolean;
+	} & Omit<HTMLImgAttributes, "onerror" | "onload"> = $props();
+
+	let status = $state("loading");
+</script>
+
+{#if noPlaceholders}
+	<img
+		{...restProps}
+		onerror={() => {
+			status = "failed";
+			console.log(status);
+		}}
+		onload={() => {
+			status = "done";
+			console.log(status);
+		}}
+		class={(overrideDefaultStyling ? "" : "fluid-image") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "") + (status == "loading" ? " invisible" : "")}
+	/>
+{:else if status == "loading" || status == "done"}
+	<div class={"fluid-image-loading" + (status === "done" ? " hidden" : "")}>
+		{#if loadingSnippet}
+			{@render loadingSnippet()}
+		{:else}
+			<p>No loading snippet provided.</p>
+		{/if}
+	</div>
+
+	<img
+		{...restProps}
+		onerror={() => {
+			status = "failed";
+			console.log(status);
+		}}
+		onload={() => {
+			status = "done";
+			console.log(status);
+		}}
+		class={(overrideDefaultStyling ? "" : "fluid-image") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "") + (status == "loading" ? " invisible" : "")}
+	/>
+{:else if status == "failed"}
+	<div class="fluid-image-error">
+		{#if errorSnippet}
+			{@render errorSnippet()}
+		{:else}
+			<p>No error snippet provided.</p>
+		{/if}
+	</div>
+{/if}

package/dist/primitives/Image.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Snippet } from "svelte";
+import { type HTMLImgAttributes } from "svelte/elements";
+declare const Image: import("svelte").Component<{
+    class?: string;
+    loadingSnippet?: Snippet;
+    errorSnippet?: Snippet;
+    noPlaceholders?: boolean;
+    overrideDefaultStyling?: boolean;
+} & Omit<HTMLImgAttributes, "onload" | "onerror">, {}, "">;
+export default Image;

package/dist/primitives/Input.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+	import { type HTMLInputAttributes } from "svelte/elements";
+	let {
+		class: className,
+		value = $bindable(),
+		checked = $bindable(false),
+		type,
+		overrideDefaultStyling = false,
+		...restProps
+	}: {
+		class?: string;
+		overrideDefaultStyling?: boolean;
+		value?: any;
+		checked?: boolean;
+		type: string;
+	} & Omit<HTMLInputAttributes, "value" | "type"> = $props();
+</script>
+
+{#if type === "checkbox"}
+	<input {...restProps} bind:checked type="checkbox" class={(overrideDefaultStyling ? "" : "fluid-checkbox") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")} />
+{:else}
+	<input {...restProps} bind:value class={(overrideDefaultStyling ? "" : "fluid-input") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")} />
+{/if}

package/dist/primitives/Input.svelte.d.ts

@@ -0,0 +1,9 @@
+import { type HTMLInputAttributes } from "svelte/elements";
+declare const Input: import("svelte").Component<{
+    class?: string;
+    overrideDefaultStyling?: boolean;
+    value?: any;
+    checked?: boolean;
+    type: string;
+} & Omit<HTMLInputAttributes, "type" | "value">, {}, "value" | "checked">;
+export default Input;

package/dist/primitives/Label.svelte

@@ -0,0 +1,18 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	import { type HTMLLabelAttributes } from "svelte/elements";
+	const {
+		class: className,
+		children,
+		overrideDefaultStyling = false,
+		...restProps
+	}: {
+		class?: string;
+		overrideDefaultStyling?: boolean;
+		children: Snippet;
+	} & HTMLLabelAttributes = $props();
+</script>
+
+<label {...restProps} class={(overrideDefaultStyling ? "" : "fluid-label") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+	{@render children()}
+</label>

package/dist/primitives/Label.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from "svelte";
+import { type HTMLLabelAttributes } from "svelte/elements";
+declare const Label: import("svelte").Component<{
+    class?: string;
+    overrideDefaultStyling?: boolean;
+    children: Snippet;
+} & HTMLLabelAttributes, {}, "">;
+export default Label;

package/dist/primitives/Table.svelte

@@ -0,0 +1,18 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	import { type HTMLTableAttributes } from "svelte/elements";
+	const {
+		class: className,
+		children,
+		overrideDefaultStyling = false,
+		...restProps
+	}: {
+		class?: string;
+		overrideDefaultStyling?: boolean;
+		children: Snippet;
+	} & HTMLTableAttributes = $props();
+</script>
+
+<table {...restProps} class={(overrideDefaultStyling ? "" : "fluid-table") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+	{@render children()}
+</table>

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

@@ -0,0 +1,8 @@
+import type { Snippet } from "svelte";
+import { type HTMLTableAttributes } from "svelte/elements";
+declare const Table: import("svelte").Component<{
+    class?: string;
+    overrideDefaultStyling?: boolean;
+    children: Snippet;
+} & HTMLTableAttributes, {}, "">;
+export default Table;

package/dist/primitives/TableBody.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import type { Snippet } from "svelte";
+	const {
+		class: className,
+		overrideDefaultStyling = false,
+		children,
+		...restProps
+	}: {
+		class?: string;
+		overrideDefaultStyling?: boolean;
+		children: Snippet;
+	} = $props();
+</script>
+
+<tbody {...restProps} class={(overrideDefaultStyling ? "" : "fluid-table-body") + (className ? (overrideDefaultStyling ? `${className}` : ` ${className}`) : "")}>
+	{@render children()}
+</tbody>

package/dist/primitives/TableBody.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { Snippet } from "svelte";
+declare const TableBody: import("svelte").Component<{
+    class?: string;
+    overrideDefaultStyling?: boolean;
+    children: Snippet;
+}, {}, "">;
+export default TableBody;