tera-system-ui 0.0.91 → 0.1.0

package/dist/components/accordion/components/AccordionContent.svelte.d.ts

@@ -1,3 +1,4 @@
 import { Accordion as AccordionPrimitive } from "bits-ui";
 declare const AccordionContent: import("svelte").Component<Omit<AccordionPrimitive.ContentProps, "child">, {}, "ref">;
+type AccordionContent = ReturnType<typeof AccordionContent>;
 export default AccordionContent;

package/dist/components/accordion/components/AccordionItem.svelte.d.ts

@@ -1,3 +1,4 @@
 import { Accordion as AccordionPrimitive } from "bits-ui";
 declare const AccordionItem: import("svelte").Component<AccordionPrimitive.ItemProps, {}, "ref">;
+type AccordionItem = ReturnType<typeof AccordionItem>;
 export default AccordionItem;

package/dist/components/accordion/components/AccordionTrigger.svelte.d.ts

@@ -1,5 +1,7 @@
-import { Accordion as AccordionPrimitive } from "bits-ui";
-declare const AccordionTrigger: import("svelte").Component<Omit<AccordionPrimitive.TriggerProps, "child"> & {
+import { Accordion as AccordionPrimitive, type WithoutChild } from "bits-ui";
+type $$ComponentProps = WithoutChild<AccordionPrimitive.TriggerProps> & {
     level?: AccordionPrimitive.HeaderProps["level"];
-}, {}, "ref">;
+};
+declare const AccordionTrigger: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type AccordionTrigger = ReturnType<typeof AccordionTrigger>;
 export default AccordionTrigger;

package/dist/components/accordion/index.d.ts

@@ -0,0 +1,5 @@
+import { Accordion } from "bits-ui";
+export { Accordion };
+export { default as AccordionItem } from "./components/AccordionItem.svelte";
+export { default as AccordionContent } from "./components/AccordionContent.svelte";
+export { default as AccordionTrigger } from "./components/AccordionTrigger.svelte";

package/dist/components/accordion/index.js

@@ -1,5 +1,4 @@
-import { Accordion as AccordionPrimitive } from "bits-ui";
-const Accordion = AccordionPrimitive.Root;
+import { Accordion } from "bits-ui";
 export { Accordion };
 export { default as AccordionItem } from "./components/AccordionItem.svelte";
 export { default as AccordionContent } from "./components/AccordionContent.svelte";

package/dist/components/avatar/Avatar.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type AvatarProps } from "./Avatar";
 declare const Avatar: import("svelte").Component<AvatarProps, {}, "ref">;
+type Avatar = ReturnType<typeof Avatar>;
 export default Avatar;

package/dist/components/brand-logo/BrandLogo.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type BrandLogoProps } from "./BrandLogo";
 declare const BrandLogo: import("svelte").Component<BrandLogoProps, {}, "">;
+type BrandLogo = ReturnType<typeof BrandLogo>;
 export default BrandLogo;

package/dist/components/button/Button.svelte.d.ts

@@ -1,5 +1,7 @@
 import { type ButtonProps } from "./Button";
-declare const Button: import("svelte").Component<ButtonProps & {
+type $$ComponentProps = ButtonProps & {
     ref: HTMLButtonElement;
-}, {}, "ref">;
+};
+declare const Button: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type Button = ReturnType<typeof Button>;
 export default Button;

package/dist/components/checkbox/Checkbox.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
     import { Checkbox as CheckboxPrimitive, type WithoutChildrenOrChild } from "bits-ui";
     import { cn } from "../../utils";
-    import IconCheck from "@tabler/icons-svelte/icons/check";
-    import IconMinus from "@tabler/icons-svelte/icons/minus";
+    import IconCheck from "@tabler/icons-svelte/icons/check"
+    import IconMinus from "@tabler/icons-svelte/icons/minus"
 
     let {
         ref = $bindable(null),

package/dist/components/checkbox/Checkbox.svelte.d.ts

@@ -1,3 +1,4 @@
 import { Checkbox as CheckboxPrimitive } from "bits-ui";
 declare const Checkbox: import("svelte").Component<Omit<Omit<CheckboxPrimitive.RootProps, "child">, "children">, {}, "ref" | "checked" | "indeterminate">;
+type Checkbox = ReturnType<typeof Checkbox>;
 export default Checkbox;

package/dist/components/combobox/Combobox.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type ComboboxProps } from "./Combobox";
 declare const Combobox: import("svelte").Component<ComboboxProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
 export default Combobox;

package/dist/components/command/command.scss

@@ -1,34 +1,41 @@
+@reference "../../themes/tera-ui-base.css";
+
 [data-cmdk-root] {
 	transition: transform 100ms ease;
-	@apply max-w-screen-md w-full overflow-hidden ;
+	max-width: var(--spacing-screen-md);
+	width: 100%;
+	overflow: hidden;
 }
 
-//[data-cmdk-input] {
-//	@apply border-b border-b-neutral-token-5 rounded-none text-sm;
-//}
-
 [data-cmdk-item] {
 	content-visibility: auto;
 
 	cursor: pointer;
-	@apply rounded text-base flex items-center gap-2 px-2 py-2.5 text-neutral-token-10;
+	border-radius: var(--radius-sm);
+	display: flex;
+	align-items: center;
+	gap: --spacing(2);
+	padding-inline: --spacing(2);
+	padding-block: --spacing(2.5);
+	color: var(--color-neutral-token-10);
 	user-select: none;
 	will-change: background, color;
 	transition: all 150ms ease;
 	transition-property: none;
 
 	&[data-selected='true'] {
-		@apply bg-neutral-token-4 text-neutral-token-13;
+		background: var(--color-neutral-token-4);
+		color: var(--color-neutral-token-13);
 	}
 
 	&[data-disabled='true'] {
-		@apply text-neutral-token-7;
+		color: var(--color-neutral-token-7);
 		cursor: not-allowed;
 	}
 
 	&:active {
 		transition-property: background;
-		@apply active:bg-neutral-token-5;
+		background: var(--color-neutral-token-5);
 	}
 
 	//& + [data-cmdk-item] {
@@ -48,26 +55,35 @@
 	overscroll-behavior: contain;
 	transition: 100ms ease;
 	transition-property: height;
-	@apply my-2 px-2;
-
+	margin-block: --spacing(2);
+	padding-inline: --spacing(2);
 }
 
 [data-cmdk-separator] {
 	height: 1px;
 	width: 100%;
 	margin: 4px 0;
-	@apply bg-neutral-token-5;
+	background: var(--color-neutral-token-5);
 }
 
 *:not([hidden]) + [data-cmdk-group] {
-	@apply mt-2;
+	margin-top: --spacing(2);
 }
 
 [data-cmdk-group-heading] {
 	user-select: none;
-	@apply text-xs text-neutral-token-9 flex py-1 px-2;
+	font-size: var(--text-xs);
+	color: var(--color-neutral-token-9);
+	display: flex;
+	padding-block: --spacing(1);
+	padding-inline: --spacing(2);
 }
 
 [data-cmdk-empty] {
-	@apply grid place-content-center text-sm text-neutral-token-8 whitespace-pre-wrap h-12;
+	display: grid;
+	place-content: center;
+	font-size: var(--text-sm);
+	color: var(--color-neutral-token-8);
+	height: --spacing(12);
+	white-space: pre-wrap;
 }

package/dist/components/command/components/Command.svelte.d.ts

@@ -1,2 +1,3 @@
 declare const Command: import("svelte").Component<any, {}, "">;
+type Command = ReturnType<typeof Command>;
 export default Command;

package/dist/components/command/components/CommandEmpty.svelte.d.ts

@@ -1,2 +1,3 @@
 declare const CommandEmpty: import("svelte").Component<any, {}, "">;
+type CommandEmpty = ReturnType<typeof CommandEmpty>;
 export default CommandEmpty;

package/dist/components/command/components/CommandGroup.svelte.d.ts

@@ -1,2 +1,3 @@
 declare const CommandGroup: import("svelte").Component<any, {}, "">;
+type CommandGroup = ReturnType<typeof CommandGroup>;
 export default CommandGroup;

package/dist/components/command/components/CommandInput.svelte.d.ts

@@ -1,7 +1,8 @@
-declare const CommandInput: import("svelte").Component<{
-    el?: HTMLInputElement;
-    asChild?: boolean;
-} & import("svelte/elements.js").HTMLInputAttributes & {
+import type { InputProps } from '../types.js';
+type $$Props = InputProps;
+type $$ComponentProps = $$Props & {
     el?: HTMLElement;
-}, {}, "value">;
+};
+declare const CommandInput: import("svelte").Component<$$ComponentProps, {}, "value">;
+type CommandInput = ReturnType<typeof CommandInput>;
 export default CommandInput;

package/dist/components/command/components/CommandItem.svelte.d.ts

@@ -1,2 +1,3 @@
 declare const CommandItem: import("svelte").Component<any, {}, "">;
+type CommandItem = ReturnType<typeof CommandItem>;
 export default CommandItem;

package/dist/components/command/components/CommandList.svelte.d.ts

@@ -1,5 +1,6 @@
 declare const CommandList: import("svelte").Component<{
-    children: unknown;
-    el: unknown;
-} & Record<string, unknown>, {}, "">;
+    children: any;
+    el: any;
+} & Record<string, any>, {}, "">;
+type CommandList = ReturnType<typeof CommandList>;
 export default CommandList;

package/dist/components/command/components/CommandLoading.svelte.d.ts

@@ -1,2 +1,3 @@
 declare const CommandLoading: import("svelte").Component<any, {}, "">;
+type CommandLoading = ReturnType<typeof CommandLoading>;
 export default CommandLoading;

package/dist/components/command/components/CommandSeparator.svelte.d.ts

@@ -1,2 +1,3 @@
 declare const CommandSeparator: import("svelte").Component<any, {}, "">;
+type CommandSeparator = ReturnType<typeof CommandSeparator>;
 export default CommandSeparator;

package/dist/components/dialog/Dialog.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type DialogProps } from "./Dialog";
 import './dialog.scss';
 declare const Dialog: import("svelte").Component<DialogProps, {}, "ref" | "open">;
+type Dialog = ReturnType<typeof Dialog>;
 export default Dialog;

package/dist/components/dialog/dialog.scss

@@ -1,3 +1,6 @@
+@reference "../../themes/tera-ui-base.css";
+
+
 .dialog-box {
     max-height: min(calc(100svh - 1rem), 55rem);
     overflow-y: auto;
@@ -5,8 +8,11 @@
     display: grid;
     grid-template-rows: auto 1fr auto;
     width: 100%;
-    @apply bg-neutral-token-1 relative top-0 left-0 bottom-0;
-
+    background: var(--color-neutral-token-1);
+    position: relative;
+    top: 0;
+    left: 0;
+    bottom: 0;
     main {
         overflow: auto;
     }
@@ -42,7 +48,7 @@ dialog {
     &[size="full"] {
         width: 100vw;
         max-width: 100vw;
-        @apply rounded-none;
+        border-radius: 0;
     }
     &[size="auto"] {
         width: fit-content;
@@ -52,13 +58,13 @@ dialog {
 }
 
 dialog[open] {
-    @apply inline-flex;
+    display: inline-flex;
 }
 
 dialog {
     --transition-duration: 0.2s;
     transform: translateY(0px);
-
+    margin: auto;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
 
     &[data-position="top"] {
@@ -175,6 +181,7 @@ dialog {
 }
 
 dialog::backdrop {
-    @apply backdrop-blur-[0.2rem] bg-neutral-token-13/20;
+    backdrop-filter: blur(0.2rem);
+    background: --alpha(var(--color-neutral-token-13) / 20%);
     transition: opacity var(--transition-duration) ease-out;
 }

package/dist/components/dropdown-menu/components/DropdownMenu.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type DropdownMenuProps } from "../DropdownMenu";
 declare const DropdownMenu: import("svelte").Component<DropdownMenuProps, {}, "open">;
+type DropdownMenu = ReturnType<typeof DropdownMenu>;
 export default DropdownMenu;

package/dist/components/dropdown-menu/components/DropdownMenuGroup.svelte.d.ts

@@ -1,5 +1,6 @@
 declare const DropdownMenuGroup: import("svelte").Component<{
-    children: unknown;
-    class: unknown;
-} & Record<string, unknown>, {}, "">;
+    children: any;
+    class: any;
+} & Record<string, any>, {}, "">;
+type DropdownMenuGroup = ReturnType<typeof DropdownMenuGroup>;
 export default DropdownMenuGroup;

package/dist/components/dropdown-menu/components/DropdownMenuHeader.svelte.d.ts

@@ -1,5 +1,6 @@
 declare const DropdownMenuHeader: import("svelte").Component<{
-    children: unknown;
-    class: unknown;
-} & Record<string, unknown>, {}, "">;
+    children: any;
+    class: any;
+} & Record<string, any>, {}, "">;
+type DropdownMenuHeader = ReturnType<typeof DropdownMenuHeader>;
 export default DropdownMenuHeader;

package/dist/components/dropdown-menu/components/DropdownMenuItem.svelte.d.ts

@@ -1,2 +1,3 @@
 declare const DropdownMenuItem: import("svelte").Component<DropdownMenuItemProps, {}, "">;
+type DropdownMenuItem = ReturnType<typeof DropdownMenuItem>;
 export default DropdownMenuItem;

package/dist/components/dropdown-menu/components/DropdownMenuSeparator.svelte.d.ts

@@ -1,5 +1,6 @@
 declare const DropdownMenuSeparator: import("svelte").Component<{
-    children: unknown;
-    class: unknown;
-} & Record<string, unknown>, {}, "">;
+    children: any;
+    class: any;
+} & Record<string, any>, {}, "">;
+type DropdownMenuSeparator = ReturnType<typeof DropdownMenuSeparator>;
 export default DropdownMenuSeparator;

package/dist/components/header/Header.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type HeaderProps } from "./Header";
 import './header.scss';
 declare const Header: import("svelte").Component<HeaderProps, {}, "">;
+type Header = ReturnType<typeof Header>;
 export default Header;

package/dist/components/header/header.scss

@@ -2,19 +2,19 @@
   container-type: inline-size;
 
   [data-name="brand-logo"] {
-    @apply h-icon-lg;
+    height: var(--spacing-icon-lg);
   }
 }
 
 
-@container (min-width: theme(screens.md)) {
+@container (min-width: theme(--breakpoint-md)) {
   #header-container {
     header {
 
     }
 
     [data-name="brand-logo"] {
-      @apply h-icon-xl;
+      height: var(--spacing-icon-xl);
     }
   }
 }

package/dist/components/icons/IconArrowBigRightFilled.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
     import {type IconsProps, styles} from "./Icons";
-    import IconArrowBigRightFilled from "@tabler/icons-svelte/icons/arrow-big-right-filled";
+    import IconArrowBigRightFilled from "@tabler/icons-svelte/icons/arrow-big-down-filled";
+
 
     let {children, ...props}: IconsProps = $props();
 

package/dist/components/icons/IconArrowBigRightFilled.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
-import IconArrowBigRightFilled from "@tabler/icons-svelte/icons/arrow-big-right-filled";
+import IconArrowBigRightFilled from "@tabler/icons-svelte/icons/arrow-big-down-filled";
 declare const IconArrowBigRightFilled: import("svelte").Component<IconsProps, {}, "">;
+type IconArrowBigRightFilled = ReturnType<typeof IconArrowBigRightFilled>;
 export default IconArrowBigRightFilled;

package/dist/components/icons/IconBook.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconBook from "@tabler/icons-svelte/icons/book";
 declare const IconBook: import("svelte").Component<IconsProps, {}, "">;
+type IconBook = ReturnType<typeof IconBook>;
 export default IconBook;

package/dist/components/icons/IconBookmarkPlus.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconBookmarkPlus from "@tabler/icons-svelte/icons/bookmark-plus";
 declare const IconBookmarkPlus: import("svelte").Component<IconsProps, {}, "">;
+type IconBookmarkPlus = ReturnType<typeof IconBookmarkPlus>;
 export default IconBookmarkPlus;

package/dist/components/icons/IconCalculator.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconCalculator from "@tabler/icons-svelte/icons/calculator";
 declare const IconCalculator: import("svelte").Component<IconsProps, {}, "">;
+type IconCalculator = ReturnType<typeof IconCalculator>;
 export default IconCalculator;

package/dist/components/icons/IconCheck.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconCheck from "@tabler/icons-svelte/icons/check";
 declare const IconCheck: import("svelte").Component<IconsProps, {}, "">;
+type IconCheck = ReturnType<typeof IconCheck>;
 export default IconCheck;

package/dist/components/icons/IconChevronDown.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconChevronDown from "@tabler/icons-svelte/icons/chevron-down";
 declare const IconChevronDown: import("svelte").Component<IconsProps, {}, "">;
+type IconChevronDown = ReturnType<typeof IconChevronDown>;
 export default IconChevronDown;

package/dist/components/icons/IconCoin.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconCoin from "@tabler/icons-svelte/icons/coin";
 declare const IconCoin: import("svelte").Component<IconsProps, {}, "">;
+type IconCoin = ReturnType<typeof IconCoin>;
 export default IconCoin;

package/dist/components/icons/IconCoinConvert.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type IconsProps } from "./Icons";
 declare const IconCoinConvert: import("svelte").Component<IconsProps, {}, "">;
+type IconCoinConvert = ReturnType<typeof IconCoinConvert>;
 export default IconCoinConvert;

package/dist/components/icons/IconCopy.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconCopy from "@tabler/icons-svelte/icons/copy";
 declare const IconCopy: import("svelte").Component<IconsProps, {}, "">;
+type IconCopy = ReturnType<typeof IconCopy>;
 export default IconCopy;

package/dist/components/icons/IconCopyCheckFilled.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconCopyCheckFilled from "@tabler/icons-svelte/icons/copy-check-filled";
 declare const IconCopyCheckFilled: import("svelte").Component<IconsProps, {}, "">;
+type IconCopyCheckFilled = ReturnType<typeof IconCopyCheckFilled>;
 export default IconCopyCheckFilled;

package/dist/components/icons/IconHamburger.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type IconsProps } from "./Icons";
 declare const IconHamburger: import("svelte").Component<IconsProps, {}, "">;
+type IconHamburger = ReturnType<typeof IconHamburger>;
 export default IconHamburger;

package/dist/components/icons/IconLanguage.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconLanguage from "@tabler/icons-svelte/icons/language";
 declare const IconLanguage: import("svelte").Component<IconsProps, {}, "">;
+type IconLanguage = ReturnType<typeof IconLanguage>;
 export default IconLanguage;

package/dist/components/icons/IconLoader2.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconLoader2 from "@tabler/icons-svelte/icons/loader-2";
 declare const IconLoader2: import("svelte").Component<IconsProps, {}, "">;
+type IconLoader2 = ReturnType<typeof IconLoader2>;
 export default IconLoader2;

package/dist/components/icons/IconLogout.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconLogout from "@tabler/icons-svelte/icons/logout";
 declare const IconLogout: import("svelte").Component<IconsProps, {}, "">;
+type IconLogout = ReturnType<typeof IconLogout>;
 export default IconLogout;

package/dist/components/icons/IconMoon.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type IconsProps } from "./Icons";
 declare const IconMoon: import("svelte").Component<IconsProps, {}, "">;
+type IconMoon = ReturnType<typeof IconMoon>;
 export default IconMoon;

package/dist/components/icons/IconPointFilled.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconPointFilled from "@tabler/icons-svelte/icons/point-filled";
 declare const IconPointFilled: import("svelte").Component<IconsProps, {}, "">;
+type IconPointFilled = ReturnType<typeof IconPointFilled>;
 export default IconPointFilled;

package/dist/components/icons/IconSearch.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconSearch from "@tabler/icons-svelte/icons/search";
 declare const IconSearch: import("svelte").Component<IconsProps, {}, "">;
+type IconSearch = ReturnType<typeof IconSearch>;
 export default IconSearch;

package/dist/components/icons/IconSettings.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconSettings from "@tabler/icons-svelte/icons/settings";
 declare const IconSettings: import("svelte").Component<IconsProps, {}, "">;
+type IconSettings = ReturnType<typeof IconSettings>;
 export default IconSettings;

package/dist/components/icons/IconSun.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type IconsProps } from "./Icons";
 declare const IconSun: import("svelte").Component<IconsProps, {}, "">;
+type IconSun = ReturnType<typeof IconSun>;
 export default IconSun;

package/dist/components/icons/IconSwitchHorizontal.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconSwitchHorizontal from "@tabler/icons-svelte/icons/switch-horizontal";
 declare const IconSwitchHorizontal: import("svelte").Component<IconsProps, {}, "">;
+type IconSwitchHorizontal = ReturnType<typeof IconSwitchHorizontal>;
 export default IconSwitchHorizontal;

package/dist/components/icons/IconSwitchVertical.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconSwitchVertical from "@tabler/icons-svelte/icons/switch-vertical";
 declare const IconSwitchVertical: import("svelte").Component<IconsProps, {}, "">;
+type IconSwitchVertical = ReturnType<typeof IconSwitchVertical>;
 export default IconSwitchVertical;

package/dist/components/icons/IconTransform.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconTransform from "@tabler/icons-svelte/icons/transform";
 declare const IconTransform: import("svelte").Component<IconsProps, {}, "">;
+type IconTransform = ReturnType<typeof IconTransform>;
 export default IconTransform;

package/dist/components/icons/IconX.svelte.d.ts

@@ -1,4 +1,5 @@
 import { type IconsProps } from "./Icons";
 import IconX from "@tabler/icons-svelte/icons/x";
 declare const IconX: import("svelte").Component<IconsProps, {}, "">;
+type IconX = ReturnType<typeof IconX>;
 export default IconX;

package/dist/components/input/Input.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type InputProps } from "./Input";
 declare const Input: import("svelte").Component<InputProps, {}, "value" | "ref">;
+type Input = ReturnType<typeof Input>;
 export default Input;

package/dist/components/label/Label.svelte.d.ts

@@ -1,3 +1,4 @@
 import { Label as LabelPrimitive } from "bits-ui";
 declare const Label: import("svelte").Component<LabelPrimitive.RootProps, {}, "ref">;
+type Label = ReturnType<typeof Label>;
 export default Label;

package/dist/components/language-picker-button/LanguagePickerButton.svelte

@@ -82,19 +82,16 @@
   opacity: 0;
 }
 button:hover {
-  --tw-bg-opacity: 1;
-  background-color: hsl(var(--tw---token-color-neutral-token-4) / var(--tw-bg-opacity, 1)) ;
+  background: var(--color-neutral-token-4);
 }
 button[data-selected] {
-  --tw-bg-opacity: 1;
-  background-color: hsl(var(--tw---token-color-neutral-token-11) / var(--tw-bg-opacity, 1)) ;
-  --tw-text-opacity: 1;
-  color: hsl(var(--tw---token-color-neutral-token-1) / var(--tw-text-opacity, 1)) ;
+  background: var(--color-neutral-token-11);
+  color: var(--color-neutral-token-1);
 }
 button[data-selected] .check {
   opacity: 1;
 }
 
 .flag-img {
-  border-radius: 9999px;
+  border-radius: var(--radius-full);
 }</style>

package/dist/components/language-picker-button/LanguagePickerButton.svelte.d.ts

@@ -1,5 +1,7 @@
 import { type LanguagePickerButtonProps } from "./LanguagePickerButton";
-declare const LanguagePickerButton: import("svelte").Component<LanguagePickerButtonProps & {
+type $$ComponentProps = LanguagePickerButtonProps & {
     onLangSelect: (langCode: string) => void;
-}, {}, "open">;
+};
+declare const LanguagePickerButton: import("svelte").Component<$$ComponentProps, {}, "open">;
+type LanguagePickerButton = ReturnType<typeof LanguagePickerButton>;
 export default LanguagePickerButton;

package/dist/components/light-dark-toggle/LightDarkToggle.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type LightDarkToggleProps } from "./LightDarkToggle";
 declare const LightDarkToggle: import("svelte").Component<LightDarkToggleProps, {}, "">;
+type LightDarkToggle = ReturnType<typeof LightDarkToggle>;
 export default LightDarkToggle;

package/dist/components/popover/Popover.svelte.d.ts

@@ -1,3 +1,4 @@
 import { type PopoverProps } from "./Popover";
 declare const Popover: import("svelte").Component<PopoverProps, {}, "open">;
+type Popover = ReturnType<typeof Popover>;
 export default Popover;