@mrintel/villain-ui 0.1.0 → 0.2.0

package/README.md

@@ -33,12 +33,14 @@ yarn add @mrintel/villain-ui
 
 ### Peer Dependencies
 
-Install the required peer dependencies if you haven't already:
+Install the required peer dependency:
 
 ```bash
-npm install svelte@^5.0.0 tailwindcss@^4.0.0
+npm install svelte@^5.0.0
 ```
 
+**Note on Tailwind CSS:** The library uses Tailwind CSS v4 internally for styling, but it is **not required** as a peer dependency. The compiled theme CSS is included in the package. You only need to install Tailwind CSS in your project if you want to extend the library's theme with custom Tailwind utilities or use Tailwind for your own application styling.
+
 ### Import Theme
 
 **Important:** The theme CSS is **not** automatically imported when you use components. You must explicitly import it in your app's entry point to apply the default styles.
@@ -793,18 +795,181 @@ This explicit import strategy gives you full control over styling and allows you
 <Avatar initials="JD" size="lg" />
 ```
 
-**CodeBlock** - Syntax-highlighted code block
+**CodeBlock** - Presentational component for displaying syntax-highlighted code
+
+A luxury-styled code display component that provides layout, styling, and optional features like line numbers, filename headers, and line highlighting. Consumers control syntax highlighting by providing pre-highlighted HTML via the default slot.
+
+**Key Features:**
+- Glass morphism aesthetic with custom scrollbars
+- Optional line numbers with highlighting support
+- Optional filename header display
+- Consumers choose their preferred syntax highlighter
+- Responsive overflow handling
+
+**Props:**
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `filename` | `string` | `undefined` | Optional filename to display in the header |
+| `showLineNumbers` | `boolean` | `false` | Whether to show line numbers in the gutter |
+| `lineCount` | `number` | `0` | Total number of lines (required when `showLineNumbers` is `true`) |
+| `highlightLines` | `number[]` | `[]` | Array of 1-indexed line numbers to highlight in the gutter |
+
+**Important Notes:**
+- Consumers are responsible for sanitizing HTML to prevent XSS attacks
+- Apply `.line` class to each code line and `.highlighted` class to highlighted lines for consistent styling
+- Line numbers are 1-indexed (first line is 1, not 0)
+- When using `showLineNumbers`, provide the `lineCount` prop for proper rendering
+
+**Basic Usage:**
+
+```svelte
+<script>
+  import { CodeBlock } from '@mrintel/villain-ui';
+  
+  const highlightedCode = `<pre><code class="language-javascript">
+<span class="token keyword">function</span> <span class="token function">hello</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+  console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">'Hello, world!'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+<span class="token punctuation">}</span>
+</code></pre>`;
+</script>
+
+<CodeBlock>
+  {@html highlightedCode}
+</CodeBlock>
+```
+
+**With Line Numbers:**
+
+```svelte
+<script>
+  import { CodeBlock } from '@mrintel/villain-ui';
+  
+  const code = `function greet(name) {
+  return \`Hello, \${name}!\`;
+}`;
+  
+  const lineCount = code.split('\n').length;
+  // Assume you have a highlighter that returns HTML
+  const highlightedCode = yourHighlighter(code, 'javascript');
+</script>
+
+<CodeBlock showLineNumbers {lineCount}>
+  {@html highlightedCode}
+</CodeBlock>
+```
+
+**With Highlighted Lines:**
+
+```svelte
+<script>
+  import { CodeBlock } from '@mrintel/villain-ui';
+  
+  const code = `function calculate(a, b) {
+  const sum = a + b;
+  return sum * 2;
+}`;
+  
+  const lineCount = 4;
+  const highlightedCode = yourHighlighter(code, 'javascript');
+  const highlightLines = [2]; // Highlight line 2
+</script>
+
+<CodeBlock showLineNumbers {lineCount} {highlightLines}>
+  {@html highlightedCode}
+</CodeBlock>
+```
+
+**With Filename:**
+
+```svelte
+<script>
+  import { CodeBlock } from '@mrintel/villain-ui';
+  
+  const code = `export function add(a: number, b: number): number {
+  return a + b;
+}`;
+  
+  const highlightedCode = yourHighlighter(code, 'typescript');
+</script>
+
+<CodeBlock filename="utils.ts">
+  {@html highlightedCode}
+</CodeBlock>
+```
+
+**Integration with Shiki:**
+
+```svelte
+<script>
+  import { CodeBlock } from '@mrintel/villain-ui';
+  import { codeToHtml } from 'shiki';
+  import { onMount } from 'svelte';
+  
+  const code = `function fibonacci(n) {
+  if (n <= 1) return n;
+  return fibonacci(n - 1) + fibonacci(n - 2);
+}`;
+  
+  let highlightedCode = $state('');
+  let lineCount = $state(0);
+  
+  onMount(async () => {
+    highlightedCode = await codeToHtml(code, {
+      lang: 'javascript',
+      theme: 'github-dark'
+    });
+    lineCount = code.split('\n').length;
+  });
+</script>
+
+<CodeBlock filename="fibonacci.js" showLineNumbers {lineCount} highlightLines={[2, 3]}>
+  {@html highlightedCode}
+</CodeBlock>
+```
+
+**Integration with Prism.js:**
+
+```svelte
+<script>
+  import { CodeBlock } from '@mrintel/villain-ui';
+  import Prism from 'prismjs';
+  import 'prismjs/themes/prism-tomorrow.css';
+  
+  const code = `const greeting = (name) => {
+  console.log(\`Hello, \${name}!\`);
+};`;
+  
+  const lineCount = code.split('\n').length;
+  const highlightedCode = Prism.highlight(code, Prism.languages.javascript, 'javascript');
+</script>
+
+<CodeBlock showLineNumbers {lineCount}>
+  <pre><code class="language-javascript">{@html highlightedCode}</code></pre>
+</CodeBlock>
+```
+
+**Integration with Highlight.js:**
 
 ```svelte
 <script>
   import { CodeBlock } from '@mrintel/villain-ui';
+  import hljs from 'highlight.js';
+  import 'highlight.js/styles/github-dark.css';
   
-  const code = `function hello() {
-  console.log('Hello, world!');
+  const code = `public class HelloWorld {
+    public static void main(String[] args) {
+        System.out.println("Hello, World!");
+    }
 }`;
+  
+  const lineCount = code.split('\n').length;
+  const highlightedCode = hljs.highlight(code, { language: 'java' }).value;
 </script>
 
-<CodeBlock {code} language="javascript" showLineNumbers />
+<CodeBlock filename="HelloWorld.java" showLineNumbers {lineCount}>
+  <pre><code class="language-java">{@html highlightedCode}</code></pre>
+</CodeBlock>
 ```
 
 **Stat** - Statistic display

package/dist/index.css

@@ -1 +1 @@
-input[type=checkbox].svelte-1ip9uuj:checked:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:10px;height:10px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M2 5L4 7L8 3' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}input[type=checkbox].svelte-zizzig:after{content:"";position:absolute;left:.25rem;top:50%;transform:translateY(-50%);width:1rem;height:1rem;border-radius:var(--radius-pill);background:var(--color-text);transition:all .3s var(--ease-luxe)}input[type=checkbox].svelte-zizzig:checked:after{transform:translate(1.25rem,-50%)}input[type=radio].svelte-1vvu266:checked:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:.625rem;height:.625rem;border-radius:var(--radius-pill);background:var(--color-accent);box-shadow:var(--shadow-accent-glow)}input[type=range].svelte-1jab628::-webkit-slider-thumb{appearance:none;width:1.25rem;height:1.25rem;border-radius:var(--radius-pill);background:var(--color-accent);box-shadow:var(--shadow-accent-glow);cursor:pointer;transition:transform .2s var(--ease-luxe)}input[type=range].svelte-1jab628::-webkit-slider-thumb:hover{transform:scale(1.1)}input[type=range].svelte-1jab628::-moz-range-thumb{appearance:none;width:1.25rem;height:1.25rem;border-radius:var(--radius-pill);background:var(--color-accent);box-shadow:var(--shadow-accent-glow);cursor:pointer;transition:transform .2s var(--ease-luxe);border:none}input[type=range].svelte-1jab628::-moz-range-thumb:hover{transform:scale(1.1)}input[type=range].svelte-1jab628:focus::-webkit-slider-thumb{box-shadow:var(--shadow-accent-glow),0 0 0 3px var(--color-base-1),0 0 0 5px var(--color-accent)}input[type=range].svelte-1jab628:focus::-moz-range-thumb{box-shadow:var(--shadow-accent-glow),0 0 0 3px var(--color-base-1),0 0 0 5px var(--color-accent)}input[type=range].svelte-1jab628:disabled::-webkit-slider-thumb{cursor:not-allowed}input[type=range].svelte-1jab628:disabled::-moz-range-thumb{cursor:not-allowed}.sr-only.svelte-1tlg6ol{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.skeleton-shimmer.svelte-z940em{position:relative;overflow:hidden}.skeleton-shimmer.svelte-z940em:before{content:"";position:absolute;top:0;left:0;width:200%;height:100%;background:linear-gradient(90deg,transparent,rgba(127,61,255,.1),transparent);animation:svelte-z940em-shimmer 1.5s ease-in-out infinite}@keyframes svelte-z940em-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}div.svelte-1blwye3::-webkit-scrollbar{width:8px}div.svelte-1blwye3::-webkit-scrollbar-track{background:var(--color-base-3);border-radius:var(--radius-sm)}div.svelte-1blwye3::-webkit-scrollbar-thumb{background:var(--color-accent);border-radius:var(--radius-sm)}div.svelte-1blwye3::-webkit-scrollbar-thumb:hover{background:var(--color-accent-soft)}div[role=listbox].svelte-1whui3e::-webkit-scrollbar{width:8px}div[role=listbox].svelte-1whui3e::-webkit-scrollbar-track{background:var(--color-base-3);border-radius:var(--radius-sm)}div[role=listbox].svelte-1whui3e::-webkit-scrollbar-thumb{background:var(--color-accent);border-radius:var(--radius-sm)}div[role=listbox].svelte-1whui3e::-webkit-scrollbar-thumb:hover{background:var(--color-accent-soft)}.mrdv-table.svelte-168is8x thead{background:var(--color-base-2);border-bottom:2px solid var(--color-border-strong)}.mrdv-table.svelte-168is8x thead th{color:var(--color-text);font-weight:600;text-transform:uppercase;letter-spacing:.05em;text-align:left}.mrdv-table.compact.svelte-168is8x th,.mrdv-table.compact.svelte-168is8x td{padding:.5rem 1rem}.mrdv-table.svelte-168is8x:not(.compact) th,.mrdv-table.svelte-168is8x:not(.compact) td{padding:1rem 1.5rem}.mrdv-table.svelte-168is8x tbody{position:relative;z-index:1}.mrdv-table.svelte-168is8x tbody tr{border-bottom:1px solid var(--color-border);transition:all var(--ease-luxe)}.mrdv-table.hoverable.svelte-168is8x tbody tr:hover{background:#7f3dff0d;transform:translateY(-1px);box-shadow:0 2px 8px #0003,var(--shadow-accent-glow)}.mrdv-table.striped.svelte-168is8x tbody tr:nth-child(2n){background:#ffffff05}.mrdv-table.striped.hoverable.svelte-168is8x tbody tr:nth-child(2n):hover{background:#7f3dff0d;transform:translateY(-1px);box-shadow:0 2px 8px #0003,var(--shadow-accent-glow)}.mrdv-table.svelte-168is8x th,.mrdv-table.svelte-168is8x td{text-align:left}button.active.svelte-1800ptl{background:var(--color-accent);color:var(--color-text);cursor:default}button.active.svelte-1800ptl{box-shadow:0 0 20px #7f3dff80}button.inactive.svelte-1800ptl{background:transparent;border:1px solid var(--color-border);color:var(--color-text)}button.inactive.svelte-1800ptl:hover{background:#7f3dff1a;border-color:var(--color-accent)}ul.svelte-18do019{margin:0;padding:0;color:var(--color-text);font-family:var(--font-body)}ul.plain>li{padding:.5rem 0}ul.bordered>li{padding:.75rem 1rem}ul.divided>li{padding:.75rem 1rem;border-bottom:1px solid var(--color-border)}ul.divided>li:last-child{border-bottom:none}ul.hoverable>li{transition:all var(--ease-luxe);cursor:pointer}ul.hoverable>li:hover{background:#7f3dff0d}div.svelte-x44t5r::-webkit-scrollbar{height:8px}div.svelte-x44t5r::-webkit-scrollbar-track{background:var(--color-base-1)}div.svelte-x44t5r::-webkit-scrollbar-thumb{background:var(--color-accent);border-radius:var(--radius-sm)}div.svelte-x44t5r::-webkit-scrollbar-thumb:hover{background:var(--color-accent-soft)}.shiki{background:transparent!important;padding:0!important}.shiki code{font-family:var(--font-mono)}.highlighted.svelte-x44t5r{background:#7f3dff1a}.line.highlighted{background:#7f3dff1a;display:inline-block;width:100%}
+input[type=checkbox].svelte-1ip9uuj:checked:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:10px;height:10px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M2 5L4 7L8 3' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}input[type=checkbox].svelte-zizzig:after{content:"";position:absolute;left:.25rem;top:50%;transform:translateY(-50%);width:1rem;height:1rem;border-radius:var(--radius-pill);background:var(--color-text);transition:all .3s var(--ease-luxe)}input[type=checkbox].svelte-zizzig:checked:after{transform:translate(1.25rem,-50%)}input[type=radio].svelte-1vvu266:checked:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:.625rem;height:.625rem;border-radius:var(--radius-pill);background:var(--color-accent);box-shadow:var(--shadow-accent-glow)}input[type=range].svelte-1jab628::-webkit-slider-thumb{appearance:none;width:1.25rem;height:1.25rem;border-radius:var(--radius-pill);background:var(--color-accent);box-shadow:var(--shadow-accent-glow);cursor:pointer;transition:transform .2s var(--ease-luxe)}input[type=range].svelte-1jab628::-webkit-slider-thumb:hover{transform:scale(1.1)}input[type=range].svelte-1jab628::-moz-range-thumb{appearance:none;width:1.25rem;height:1.25rem;border-radius:var(--radius-pill);background:var(--color-accent);box-shadow:var(--shadow-accent-glow);cursor:pointer;transition:transform .2s var(--ease-luxe);border:none}input[type=range].svelte-1jab628::-moz-range-thumb:hover{transform:scale(1.1)}input[type=range].svelte-1jab628:focus::-webkit-slider-thumb{box-shadow:var(--shadow-accent-glow),0 0 0 3px var(--color-base-1),0 0 0 5px var(--color-accent)}input[type=range].svelte-1jab628:focus::-moz-range-thumb{box-shadow:var(--shadow-accent-glow),0 0 0 3px var(--color-base-1),0 0 0 5px var(--color-accent)}input[type=range].svelte-1jab628:disabled::-webkit-slider-thumb{cursor:not-allowed}input[type=range].svelte-1jab628:disabled::-moz-range-thumb{cursor:not-allowed}.sr-only.svelte-1tlg6ol{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.skeleton-shimmer.svelte-z940em{position:relative;overflow:hidden}.skeleton-shimmer.svelte-z940em:before{content:"";position:absolute;top:0;left:0;width:200%;height:100%;background:linear-gradient(90deg,transparent,rgba(127,61,255,.1),transparent);animation:svelte-z940em-shimmer 1.5s ease-in-out infinite}@keyframes svelte-z940em-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}div.svelte-1blwye3::-webkit-scrollbar{width:8px}div.svelte-1blwye3::-webkit-scrollbar-track{background:var(--color-base-3);border-radius:var(--radius-sm)}div.svelte-1blwye3::-webkit-scrollbar-thumb{background:var(--color-accent);border-radius:var(--radius-sm)}div.svelte-1blwye3::-webkit-scrollbar-thumb:hover{background:var(--color-accent-soft)}div[role=listbox].svelte-1whui3e::-webkit-scrollbar{width:8px}div[role=listbox].svelte-1whui3e::-webkit-scrollbar-track{background:var(--color-base-3);border-radius:var(--radius-sm)}div[role=listbox].svelte-1whui3e::-webkit-scrollbar-thumb{background:var(--color-accent);border-radius:var(--radius-sm)}div[role=listbox].svelte-1whui3e::-webkit-scrollbar-thumb:hover{background:var(--color-accent-soft)}.mrdv-table.svelte-168is8x thead{background:var(--color-base-2);border-bottom:2px solid var(--color-border-strong)}.mrdv-table.svelte-168is8x thead th{color:var(--color-text);font-weight:600;text-transform:uppercase;letter-spacing:.05em;text-align:left}.mrdv-table.compact.svelte-168is8x th,.mrdv-table.compact.svelte-168is8x td{padding:.5rem 1rem}.mrdv-table.svelte-168is8x:not(.compact) th,.mrdv-table.svelte-168is8x:not(.compact) td{padding:1rem 1.5rem}.mrdv-table.svelte-168is8x tbody{position:relative;z-index:1}.mrdv-table.svelte-168is8x tbody tr{border-bottom:1px solid var(--color-border);transition:all var(--ease-luxe)}.mrdv-table.hoverable.svelte-168is8x tbody tr:hover{background:#7f3dff0d;transform:translateY(-1px);box-shadow:0 2px 8px #0003,var(--shadow-accent-glow)}.mrdv-table.striped.svelte-168is8x tbody tr:nth-child(2n){background:#ffffff05}.mrdv-table.striped.hoverable.svelte-168is8x tbody tr:nth-child(2n):hover{background:#7f3dff0d;transform:translateY(-1px);box-shadow:0 2px 8px #0003,var(--shadow-accent-glow)}.mrdv-table.svelte-168is8x th,.mrdv-table.svelte-168is8x td{text-align:left}button.active.svelte-1800ptl{background:var(--color-accent);color:var(--color-text);cursor:default}button.active.svelte-1800ptl{box-shadow:0 0 20px #7f3dff80}button.inactive.svelte-1800ptl{background:transparent;border:1px solid var(--color-border);color:var(--color-text)}button.inactive.svelte-1800ptl:hover{background:#7f3dff1a;border-color:var(--color-accent)}ul.svelte-18do019{margin:0;padding:0;color:var(--color-text);font-family:var(--font-body)}ul.plain>li{padding:.5rem 0}ul.bordered>li{padding:.75rem 1rem}ul.divided>li{padding:.75rem 1rem;border-bottom:1px solid var(--color-border)}ul.divided>li:last-child{border-bottom:none}ul.hoverable>li{transition:all var(--ease-luxe);cursor:pointer}ul.hoverable>li:hover{background:#7f3dff0d}div.svelte-x44t5r::-webkit-scrollbar{height:8px}div.svelte-x44t5r::-webkit-scrollbar-track{background:var(--color-base-1)}div.svelte-x44t5r::-webkit-scrollbar-thumb{background:var(--color-accent);border-radius:var(--radius-sm)}div.svelte-x44t5r::-webkit-scrollbar-thumb:hover{background:var(--color-accent-soft)}.highlighted.svelte-x44t5r{background:#7f3dff1a}.line.highlighted{background:#7f3dff1a;display:inline-block;width:100%}

package/dist/index.d.ts

@@ -1,18 +1,175 @@
-/**
- * @mrintel/villain-ui - A luxury Svelte 5 component library
- *
- * This is the main entry point for the component library.
- *
- * Note: Theme styles are NOT automatically imported. Consumers must explicitly
- * import '@mrintel/villain-ui/theme.css' in their application to use the default theme.
- * This gives full control over styling and allows custom theme implementations.
- */
-export declare const version = "0.1.0";
-export { Button, IconButton, ButtonGroup, LinkButton, FloatingActionButton } from './components/buttons';
-export { Input, Textarea, Select, Checkbox, Switch, RadioGroup, RangeSlider, FileUpload, InputGroup } from './components/forms';
-export { Card, Panel, Grid, Container, SectionHeader, Divider } from './components/cards';
-export { Navbar, Sidebar, Tabs, Breadcrumbs, Menu, DropdownMenu, ContextMenu } from './components/navigation';
-export { Modal, Alert, Spinner, Tooltip, ProgressBar, SkeletonLoader, Toast, Drawer, Popover, Dropdown, CommandPalette } from './components/overlays';
-export { Heading, Text, Code } from './components/typography';
-export { Table, Pagination, Badge, Tag, List, Avatar, CodeBlock, Stat } from './components/data';
-export { Portal, Collapse, Accordion, Carousel, ScrollArea } from './components/utilities';
+import { default as Accordion } from './Accordion.svelte';
+import { default as Alert } from './Alert.svelte';
+import { default as Avatar } from './Avatar.svelte';
+import { default as Badge } from './Badge.svelte';
+import { default as Breadcrumbs } from './Breadcrumbs.svelte';
+import { default as Button } from './Button.svelte';
+import { default as ButtonGroup } from './ButtonGroup.svelte';
+import { default as Card } from './Card.svelte';
+import { default as Carousel } from './Carousel.svelte';
+import { default as Checkbox } from './Checkbox.svelte';
+import { default as Code } from './Code.svelte';
+import { default as CodeBlock } from './CodeBlock.svelte';
+import { default as Collapse } from './Collapse.svelte';
+import { default as CommandPalette } from './CommandPalette.svelte';
+import { default as Container } from './Container.svelte';
+import { default as ContextMenu } from './ContextMenu.svelte';
+import { default as Divider } from './Divider.svelte';
+import { default as Drawer } from './Drawer.svelte';
+import { default as Dropdown } from './Dropdown.svelte';
+import { default as DropdownMenu } from './DropdownMenu.svelte';
+import { default as FileUpload } from './FileUpload.svelte';
+import { default as FloatingActionButton } from './FloatingActionButton.svelte';
+import { default as Grid } from './Grid.svelte';
+import { default as Heading } from './Heading.svelte';
+import { default as IconButton } from './IconButton.svelte';
+import { default as Input } from './Input.svelte';
+import { default as InputGroup } from './InputGroup.svelte';
+import { default as LinkButton } from './LinkButton.svelte';
+import { default as List } from './List.svelte';
+import { default as Menu } from './Menu.svelte';
+import { default as Modal } from './Modal.svelte';
+import { default as Navbar } from './Navbar.svelte';
+import { default as Pagination } from './Pagination.svelte';
+import { default as Panel } from './Panel.svelte';
+import { default as Popover } from './Popover.svelte';
+import { default as Portal } from './Portal.svelte';
+import { default as ProgressBar } from './ProgressBar.svelte';
+import { default as RadioGroup } from './RadioGroup.svelte';
+import { default as RangeSlider } from './RangeSlider.svelte';
+import { default as ScrollArea } from './ScrollArea.svelte';
+import { default as SectionHeader } from './SectionHeader.svelte';
+import { default as Select } from './Select.svelte';
+import { default as Sidebar } from './Sidebar.svelte';
+import { default as SkeletonLoader } from './SkeletonLoader.svelte';
+import { default as Spinner } from './Spinner.svelte';
+import { default as Stat } from './Stat.svelte';
+import { default as Switch } from './Switch.svelte';
+import { default as Table } from './Table.svelte';
+import { default as Tabs } from './Tabs.svelte';
+import { default as Tag } from './Tag.svelte';
+import { default as Text_2 } from './Text.svelte';
+import { default as Textarea } from './Textarea.svelte';
+import { default as Toast } from './Toast.svelte';
+import { default as Tooltip } from './Tooltip.svelte';
+
+export { Accordion }
+
+export { Alert }
+
+export { Avatar }
+
+export { Badge }
+
+export { Breadcrumbs }
+
+export { Button }
+
+export { ButtonGroup }
+
+export { Card }
+
+export { Carousel }
+
+export { Checkbox }
+
+export { Code }
+
+export { CodeBlock }
+
+export { Collapse }
+
+export { CommandPalette }
+
+export { Container }
+
+export { ContextMenu }
+
+export { Divider }
+
+export { Drawer }
+
+export { Dropdown }
+
+export { DropdownMenu }
+
+export { FileUpload }
+
+export { FloatingActionButton }
+
+export { Grid }
+
+export { Heading }
+
+export { IconButton }
+
+export { Input }
+
+export { InputGroup }
+
+export { LinkButton }
+
+export { List }
+
+export { Menu }
+
+export { Modal }
+
+export { Navbar }
+
+export { Pagination }
+
+export { Panel }
+
+export { Popover }
+
+export { Portal }
+
+export { ProgressBar }
+
+export { RadioGroup }
+
+export { RangeSlider }
+
+export { ScrollArea }
+
+export { SectionHeader }
+
+export { Select }
+
+export { Sidebar }
+
+export { SkeletonLoader }
+
+export { Spinner }
+
+export { Stat }
+
+export { Switch }
+
+export { Table }
+
+export { Tabs }
+
+export { Tag }
+
+export { Text_2 as Text }
+
+export { Textarea }
+
+export { Toast }
+
+export { Tooltip }
+
+/**
+ * @mrintel/villain-ui - A luxury Svelte 5 component library
+ *
+ * This is the main entry point for the component library.
+ *
+ * Note: Theme styles are NOT automatically imported. Consumers must explicitly
+ * import '@mrintel/villain-ui/theme.css' in their application to use the default theme.
+ * This gives full control over styling and allows custom theme implementations.
+ */
+export declare const version = "0.1.0";
+
+export { }