Ilia Mashkov
99ab7e9e08
Badge and TechText reached into $shared/ui/Label/config, and SearchBar into $shared/ui/Input/types — bypassing the siblings public surface. - Label/config.ts was explicitly shared text-styling config, not Labels internals; relocate it to shared/ui/labelConfig.ts (a neutral peer module) and point Label/Badge/TechText at it relatively. - inputIconSize is a consumer-facing map; export it from Input/index.ts so SearchBar imports it through the barrel alongside Input.
54 lines
968 B
Svelte
54 lines
968 B
Svelte
<!--
|
|
Component: TechnicalText
|
|
Monospace <code> element for technical values, measurements, identifiers.
|
|
-->
|
|
<script lang="ts">
|
|
import { cn } from '$shared/lib';
|
|
import type { Snippet } from 'svelte';
|
|
import {
|
|
type LabelSize,
|
|
type LabelVariant,
|
|
labelSizeConfig,
|
|
labelVariantConfig,
|
|
} from '../labelConfig';
|
|
|
|
interface Props {
|
|
/**
|
|
* Visual variant
|
|
* @default 'muted'
|
|
*/
|
|
variant?: LabelVariant;
|
|
/**
|
|
* Text size
|
|
* @default 'sm'
|
|
*/
|
|
size?: LabelSize;
|
|
/**
|
|
* Content snippet
|
|
*/
|
|
children?: Snippet;
|
|
/**
|
|
* CSS classes
|
|
*/
|
|
class?: string;
|
|
}
|
|
|
|
let {
|
|
variant = 'muted',
|
|
size = 'sm',
|
|
children,
|
|
class: className,
|
|
}: Props = $props();
|
|
</script>
|
|
|
|
<code
|
|
class={cn(
|
|
'font-mono tracking-tight tabular-nums',
|
|
labelSizeConfig[size],
|
|
labelVariantConfig[variant],
|
|
className,
|
|
)}
|
|
>
|
|
{#if children}{@render children()}{/if}
|
|
</code>
|