tera-system-ui 0.1.75 → 0.1.76
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.
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<script lang="ts">import { Tabs as TabsPrimitive } from 'bits-ui';
|
|
2
2
|
import { cn } from '../../../utils/utils.js';
|
|
3
3
|
import { getTabsContext } from '../Tabs.svelte.js';
|
|
4
|
-
let { children, class: className, ref = $bindable(null), ...props } = $props();
|
|
4
|
+
let { children, class: className, indicatorClass, ref = $bindable(null), ...props } = $props();
|
|
5
5
|
const ctx = getTabsContext();
|
|
6
6
|
const variant = $derived(ctx.variant);
|
|
7
7
|
const orientation = $derived(ctx.orientation);
|
|
@@ -50,41 +50,41 @@ $effect(() => {
|
|
|
50
50
|
{#if variant === 'ios'}
|
|
51
51
|
<!-- iOS segmented control: gray pill container, sliding white background — horizontal only -->
|
|
52
52
|
<TabsPrimitive.List
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
53
|
+
bind:ref={tabsList}
|
|
54
|
+
class={cn('relative flex bg-neutral-token-3 p-1 rounded-lg', className)}
|
|
55
|
+
{...props}
|
|
56
56
|
>
|
|
57
57
|
{@render children?.()}
|
|
58
58
|
<!-- Sliding white pill (background layer) -->
|
|
59
59
|
<div
|
|
60
|
-
|
|
61
|
-
|
|
60
|
+
bind:this={tabIndicator}
|
|
61
|
+
class={cn("absolute inset-y-1 rounded-md bg-surface shadow-sm transition-[left,width] duration-200 ease-spring pointer-events-none", indicatorClass)}
|
|
62
62
|
></div>
|
|
63
63
|
</TabsPrimitive.List>
|
|
64
64
|
{:else if isVertical}
|
|
65
65
|
<!-- Vertical line style: right-side accent bar indicator -->
|
|
66
66
|
<TabsPrimitive.List
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
67
|
+
bind:ref={tabsList}
|
|
68
|
+
class={cn('relative flex flex-col gap-1 border-r border-border-default', className)}
|
|
69
|
+
{...props}
|
|
70
70
|
>
|
|
71
71
|
{@render children?.()}
|
|
72
72
|
<div
|
|
73
|
-
|
|
74
|
-
|
|
73
|
+
bind:this={tabIndicator}
|
|
74
|
+
class="absolute right-0 w-0.5 rounded-full bg-primary-token-5 transition-[top,height] duration-150 ease-ui pointer-events-none"
|
|
75
75
|
></div>
|
|
76
76
|
</TabsPrimitive.List>
|
|
77
77
|
{:else}
|
|
78
78
|
<!-- Default horizontal line style: underline indicator -->
|
|
79
79
|
<TabsPrimitive.List
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
80
|
+
bind:ref={tabsList}
|
|
81
|
+
class={cn('relative flex gap-2 items-end border-b border-border-default', className)}
|
|
82
|
+
{...props}
|
|
83
83
|
>
|
|
84
84
|
{@render children?.()}
|
|
85
85
|
<div
|
|
86
|
-
|
|
87
|
-
|
|
86
|
+
bind:this={tabIndicator}
|
|
87
|
+
class="absolute bottom-0 h-0.5 rounded-full bg-primary-token-5 transition-[left,width] duration-150 ease-ui pointer-events-none"
|
|
88
88
|
></div>
|
|
89
89
|
</TabsPrimitive.List>
|
|
90
90
|
{/if}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "tera-system-ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.76",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"dev": "vite dev",
|
|
6
6
|
"build": "npm run customPrepublish && npm run generate-index && npm run generate-llms && vite build && npm run package && npm run copy-docs && npm run copy-llms && npm run postpublish",
|