tera-system-ui 0.0.24 → 0.0.26

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 (82) hide show
  1. package/dist/components/avatar/Avatar.svelte +43 -43
  2. package/dist/components/brand-logo/BrandLogo.svelte +31 -31
  3. package/dist/components/button/Button.svelte +49 -49
  4. package/dist/components/combobox/Combobox.svelte +8 -8
  5. package/dist/components/command/command.scss +72 -72
  6. package/dist/components/command/components/Command.svelte +120 -120
  7. package/dist/components/command/components/Command.svelte.d.ts +1 -1
  8. package/dist/components/command/components/CommandEmpty.svelte +30 -30
  9. package/dist/components/command/components/CommandEmpty.svelte.d.ts +1 -1
  10. package/dist/components/command/components/CommandGroup.svelte +110 -110
  11. package/dist/components/command/components/CommandGroup.svelte.d.ts +1 -1
  12. package/dist/components/command/components/CommandInput.svelte +92 -92
  13. package/dist/components/command/components/CommandInput.svelte.d.ts +1 -1
  14. package/dist/components/command/components/CommandItem.svelte +110 -110
  15. package/dist/components/command/components/CommandItem.svelte.d.ts +1 -1
  16. package/dist/components/command/components/CommandList.svelte +56 -56
  17. package/dist/components/command/components/CommandLoading.svelte +28 -28
  18. package/dist/components/command/components/CommandLoading.svelte.d.ts +1 -1
  19. package/dist/components/command/components/CommandSeparator.svelte +21 -21
  20. package/dist/components/command/components/CommandSeparator.svelte.d.ts +1 -1
  21. package/dist/components/dialog/Dialog.astro +64 -64
  22. package/dist/components/dialog/Dialog.svelte +109 -109
  23. package/dist/components/dialog/dialog.scss +115 -115
  24. package/dist/components/dropdown-menu/components/DropdownMenu.svelte +33 -33
  25. package/dist/components/dropdown-menu/components/DropdownMenuGroup.svelte +11 -11
  26. package/dist/components/dropdown-menu/components/DropdownMenuHeader.svelte +11 -11
  27. package/dist/components/dropdown-menu/components/DropdownMenuItem.svelte +30 -30
  28. package/dist/components/dropdown-menu/components/DropdownMenuSeparator.svelte +10 -10
  29. package/dist/components/header/Header.svelte +36 -36
  30. package/dist/components/header/header.scss +19 -19
  31. package/dist/components/icons/IconArrowBigRightFilled.svelte +10 -10
  32. package/dist/components/icons/IconBook.svelte +10 -10
  33. package/dist/components/icons/IconBookmarkPlus.svelte +10 -10
  34. package/dist/components/icons/IconCalculator.svelte +10 -10
  35. package/dist/components/icons/IconCheck.svelte +10 -10
  36. package/dist/components/icons/IconChevronDown.svelte +10 -10
  37. package/dist/components/icons/IconCopy.svelte +10 -10
  38. package/dist/components/icons/IconCopyCheckFilled.svelte +10 -10
  39. package/dist/components/icons/IconHamburger.svelte +10 -10
  40. package/dist/components/icons/IconLanguage.svelte +10 -10
  41. package/dist/components/icons/IconLoader2.svelte +10 -10
  42. package/dist/components/icons/IconLogout.svelte +10 -10
  43. package/dist/components/icons/IconMoon.svelte +10 -10
  44. package/dist/components/icons/IconPointFilled.svelte +10 -10
  45. package/dist/components/icons/IconSearch.svelte +10 -10
  46. package/dist/components/icons/IconSettings.svelte +10 -10
  47. package/dist/components/icons/IconSun.svelte +10 -10
  48. package/dist/components/icons/IconSwitchHorizontal.svelte +10 -10
  49. package/dist/components/icons/IconSwitchVertical.svelte +10 -10
  50. package/dist/components/icons/IconTransform.svelte +10 -10
  51. package/dist/components/icons/IconX.svelte +10 -10
  52. package/dist/components/input/Input.svelte +24 -24
  53. package/dist/components/language-picker-button/LanguagePickerButton.svelte +109 -109
  54. package/dist/components/light-dark-toggle/LightDarkToggle.svelte +36 -36
  55. package/dist/components/popover/Popover.svelte +159 -159
  56. package/dist/components/popover-responsive/PopoverResponsive.svelte +87 -87
  57. package/dist/components/side-navigation/SideNavigation.svelte +114 -114
  58. package/dist/components/side-navigation/SideNavigationItem.svelte +17 -17
  59. package/dist/components/side-navigation/SideNavigationLayout.svelte +19 -19
  60. package/dist/components/side-navigation/sidenav.scss +149 -149
  61. package/dist/components/slider/Slider.svelte +181 -181
  62. package/dist/components/star-rating/StarRating.d.ts +52 -0
  63. package/dist/components/star-rating/StarRating.js +15 -0
  64. package/dist/components/star-rating/StarRating.svelte +101 -0
  65. package/dist/components/star-rating/StarRating.svelte.d.ts +3 -0
  66. package/dist/components/star-rating/index.d.ts +1 -0
  67. package/dist/components/star-rating/index.js +1 -0
  68. package/dist/components/tabs/components/Tabs.svelte +47 -47
  69. package/dist/components/tabs/components/TabsContent.svelte +34 -34
  70. package/dist/components/tabs/components/TabsItem.svelte +29 -29
  71. package/dist/components/tabs/components/TabsList.svelte +41 -41
  72. package/dist/components/tera-ui-context/TeraUiContext.svelte +28 -28
  73. package/dist/components/text-area/TextArea.svelte +88 -88
  74. package/dist/components/user-avatar-with-menu/UserAvatarWithMenu.svelte +67 -67
  75. package/dist/index.d.ts +1 -0
  76. package/dist/index.js +1 -0
  77. package/dist/themes/scrollbar.scss +37 -37
  78. package/dist/themes/tera-ui-base.css +208 -208
  79. package/dist/themes/tw-preset.cjs +153 -153
  80. package/package.json +98 -98
  81. package/scripts/add-component-template.js +120 -120
  82. package/scripts/generate-ts-index.js +138 -138
@@ -1,12 +1,12 @@
1
- <script lang="ts">
2
- import {cn} from "../../../utils/utils";
3
-
4
- let {children, class: className, ...props} = $props()
5
- </script>
6
-
7
- <div class={cn('px-3 py-1.5 font-semibold', className)}
8
- data-dropdown-menu-header
9
- role="group"
10
- {...props}>
11
- {@render children?.()}
1
+ <script lang="ts">
2
+ import {cn} from "../../../utils/utils";
3
+
4
+ let {children, class: className, ...props} = $props()
5
+ </script>
6
+
7
+ <div class={cn('px-3 py-1.5 font-semibold', className)}
8
+ data-dropdown-menu-header
9
+ role="group"
10
+ {...props}>
11
+ {@render children?.()}
12
12
  </div>
@@ -1,30 +1,30 @@
1
- <script lang="ts">
2
- import {type DropdownMenuItemProps, getCtx} from "../DropdownMenu";
3
- import {cn} from "../../../utils/utils";
4
-
5
-
6
- let {children, class: className, onclick, href, ...props}: DropdownMenuItemProps = $props()
7
- let context = getCtx()
8
- </script>
9
-
10
- {#snippet button()}
11
- <button
12
- onclick={(e) => {
13
- onclick?.(e)
14
- context?.setOpen(false)
15
- }}
16
- role="menuitem"
17
- data-dropdown-menu-item
18
- class={cn('flex w-full items-center gap-2 px-2 py-2 rounded hover:bg-neutral-token-4 transition-all', className)}
19
- {...props}>
20
- {@render children?.()}
21
- </button>
22
- {/snippet}
23
-
24
- {#if href}
25
- <a href={href}>
26
- {@render button()}
27
- </a>
28
- {:else }
29
- {@render button()}
30
- {/if}
1
+ <script lang="ts">
2
+ import {type DropdownMenuItemProps, getCtx} from "../DropdownMenu";
3
+ import {cn} from "../../../utils/utils";
4
+
5
+
6
+ let {children, class: className, onclick, href, ...props}: DropdownMenuItemProps = $props()
7
+ let context = getCtx()
8
+ </script>
9
+
10
+ {#snippet button()}
11
+ <button
12
+ onclick={(e) => {
13
+ onclick?.(e)
14
+ context?.setOpen(false)
15
+ }}
16
+ role="menuitem"
17
+ data-dropdown-menu-item
18
+ class={cn('flex w-full items-center gap-2 px-2 py-2 rounded hover:bg-neutral-token-4 transition-all', className)}
19
+ {...props}>
20
+ {@render children?.()}
21
+ </button>
22
+ {/snippet}
23
+
24
+ {#if href}
25
+ <a href={href}>
26
+ {@render button()}
27
+ </a>
28
+ {:else }
29
+ {@render button()}
30
+ {/if}
@@ -1,11 +1,11 @@
1
- <script lang="ts">
2
- import {cn} from "../../../utils/utils";
3
-
4
- let {children, class: className, ...props} = $props()
5
- </script>
6
-
7
- <div class={cn('border-b w-full', className)}
8
- data-dropdown-menu-separator
9
- {...props}>
10
-
1
+ <script lang="ts">
2
+ import {cn} from "../../../utils/utils";
3
+
4
+ let {children, class: className, ...props} = $props()
5
+ </script>
6
+
7
+ <div class={cn('border-b w-full', className)}
8
+ data-dropdown-menu-separator
9
+ {...props}>
10
+
11
11
  </div>
@@ -1,36 +1,36 @@
1
- <script lang="ts">
2
- import {type HeaderProps} from "./Header";
3
- import {BrandLogo} from "../../components/brand-logo";
4
- import './header.scss'
5
- import {Button} from "../button";
6
- import {IconHamburger} from "../icons";
7
-
8
- let {children, onHamburgerClick, ...props}: HeaderProps & {} = $props();
9
-
10
- </script>
11
-
12
- <!--add component here-->
13
- <nav id="header-container"
14
- class="flex z-40 w-full h-auto items-center justify-center sticky top-0 inset-x-0 backdrop-blur-lg data-[menu-open=true]:backdrop-blur-xl backdrop-saturate-150">
15
- <header class="flex flex-wrap h-header-height w-full text-sm">
16
- <nav class="w-full mx-auto px-4 pl-1 pr-2 md:pl-4 md:pe-4 flex items-center justify-between">
17
- <div class="flex gap-1 items-center">
18
- <Button class="md:hidden ring-0 focus:ring-0"
19
- icon
20
- variant="ghost"
21
-
22
- onclick={onHamburgerClick}>
23
- <IconHamburger/>
24
- </Button>
25
- <a href="/" class="header-brand-logo">
26
- <BrandLogo class="hidden md:block !h-icon-md"/>
27
- <BrandLogo class="md:hidden" shape="square"/>
28
- </a>
29
- </div>
30
-
31
- <div class="flex gap-2 sm:gap-4 items-center">
32
- {@render children?.()}
33
- </div>
34
- </nav>
35
- </header>
36
- </nav>
1
+ <script lang="ts">
2
+ import {type HeaderProps} from "./Header";
3
+ import {BrandLogo} from "../../components/brand-logo";
4
+ import './header.scss'
5
+ import {Button} from "../button";
6
+ import {IconHamburger} from "../icons";
7
+
8
+ let {children, onHamburgerClick, ...props}: HeaderProps & {} = $props();
9
+
10
+ </script>
11
+
12
+ <!--add component here-->
13
+ <nav id="header-container"
14
+ class="flex z-40 w-full h-auto items-center justify-center sticky top-0 inset-x-0 backdrop-blur-lg data-[menu-open=true]:backdrop-blur-xl backdrop-saturate-150">
15
+ <header class="flex flex-wrap h-header-height w-full text-sm">
16
+ <nav class="w-full mx-auto px-4 pl-1 pr-2 md:pl-4 md:pe-4 flex items-center justify-between">
17
+ <div class="flex gap-1 items-center">
18
+ <Button class="md:hidden ring-0 focus:ring-0"
19
+ icon
20
+ variant="ghost"
21
+
22
+ onclick={onHamburgerClick}>
23
+ <IconHamburger/>
24
+ </Button>
25
+ <a href="/" class="header-brand-logo">
26
+ <BrandLogo class="hidden md:block !h-icon-md"/>
27
+ <BrandLogo class="md:hidden" shape="square"/>
28
+ </a>
29
+ </div>
30
+
31
+ <div class="flex gap-2 sm:gap-4 items-center">
32
+ {@render children?.()}
33
+ </div>
34
+ </nav>
35
+ </header>
36
+ </nav>
@@ -1,20 +1,20 @@
1
- #header-container {
2
- container-type: inline-size;
3
-
4
- [data-name="brand-logo"] {
5
- @apply h-icon-lg;
6
- }
7
- }
8
-
9
-
10
- @container (min-width: theme(screens.md)) {
11
- #header-container {
12
- header {
13
-
14
- }
15
-
16
- [data-name="brand-logo"] {
17
- @apply h-icon-xl;
18
- }
19
- }
1
+ #header-container {
2
+ container-type: inline-size;
3
+
4
+ [data-name="brand-logo"] {
5
+ @apply h-icon-lg;
6
+ }
7
+ }
8
+
9
+
10
+ @container (min-width: theme(screens.md)) {
11
+ #header-container {
12
+ header {
13
+
14
+ }
15
+
16
+ [data-name="brand-logo"] {
17
+ @apply h-icon-xl;
18
+ }
19
+ }
20
20
  }
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconArrowBigRightFilled} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconArrowBigRightFilled class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconArrowBigRightFilled} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconArrowBigRightFilled class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconBook} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconBook class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconBook} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconBook class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconBookmarkPlus} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconBookmarkPlus class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconBookmarkPlus} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconBookmarkPlus class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconCalculator} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconCalculator class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconCalculator} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconCalculator class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconCheck} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconCheck class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconCheck} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconCheck class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconChevronDown} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconChevronDown class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconChevronDown} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconChevronDown class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconCopy} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconCopy class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconCopy} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconCopy class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconCopyCheckFilled} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconCopyCheckFilled class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconCopyCheckFilled} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconCopyCheckFilled class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconMenu2} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconMenu2 class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconMenu2} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconMenu2 class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconLanguage} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconLanguage class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconLanguage} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconLanguage class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconLoader2} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconLoader2 class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconLoader2} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconLoader2 class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconLogout} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconLogout class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconLogout} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconLogout class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconMoonStars} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconMoonStars class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconMoonStars} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconMoonStars class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconPointFilled} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconPointFilled class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconPointFilled} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconPointFilled class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconSearch} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconSearch class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconSearch} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconSearch class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconSettings} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconSettings class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconSettings} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconSettings class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconSunHigh} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconSunHigh class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconSunHigh} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconSunHigh class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconSwitchHorizontal} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconSwitchHorizontal class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconSwitchHorizontal} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconSwitchHorizontal class={styles({...props})}/>
10
+
@@ -1,10 +1,10 @@
1
- <script lang="ts">
2
- import {type IconsProps, styles} from "./Icons";
3
- import {IconSwitchVertical} from "@tabler/icons-svelte";
4
-
5
- let {children, ...props}: IconsProps = $props();
6
-
7
- </script>
8
-
9
- <IconSwitchVertical class={styles({...props})}/>
10
-
1
+ <script lang="ts">
2
+ import {type IconsProps, styles} from "./Icons";
3
+ import {IconSwitchVertical} from "@tabler/icons-svelte";
4
+
5
+ let {children, ...props}: IconsProps = $props();
6
+
7
+ </script>
8
+
9
+ <IconSwitchVertical class={styles({...props})}/>
10
+