@aphexcms/ui 0.1.1 → 0.1.2

package/src/lib/components/ui/card/card-footer.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import { cn, type WithElementRef } from '@lib/utils.js';
-	import type { HTMLAttributes } from 'svelte/elements';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		children,
-		...restProps
-	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
-</script>
-
-<div
-	bind:this={ref}
-	data-slot="card-footer"
-	class={cn('[.border-t]:pt-6 flex items-center px-6', className)}
-	{...restProps}
->
-	{@render children?.()}
-</div>

package/src/lib/components/ui/card/card-header.svelte

@@ -1,23 +0,0 @@
-<script lang="ts">
-	import { cn, type WithElementRef } from '@lib/utils.js';
-	import type { HTMLAttributes } from 'svelte/elements';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		children,
-		...restProps
-	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
-</script>
-
-<div
-	bind:this={ref}
-	data-slot="card-header"
-	class={cn(
-		'@container/card-header has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6 grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6',
-		className
-	)}
-	{...restProps}
->
-	{@render children?.()}
-</div>

package/src/lib/components/ui/card/card-title.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import type { HTMLAttributes } from 'svelte/elements';
-	import { cn, type WithElementRef } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		children,
-		...restProps
-	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
-</script>
-
-<div
-	bind:this={ref}
-	data-slot="card-title"
-	class={cn('font-semibold leading-none', className)}
-	{...restProps}
->
-	{@render children?.()}
-</div>

package/src/lib/components/ui/card/card.svelte

@@ -1,23 +0,0 @@
-<script lang="ts">
-	import type { HTMLAttributes } from 'svelte/elements';
-	import { cn, type WithElementRef } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		children,
-		...restProps
-	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
-</script>
-
-<div
-	bind:this={ref}
-	data-slot="card"
-	class={cn(
-		'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm',
-		className
-	)}
-	{...restProps}
->
-	{@render children?.()}
-</div>

package/src/lib/components/ui/card/index.ts

@@ -1,25 +0,0 @@
-import Root from './card.svelte';
-import Content from './card-content.svelte';
-import Description from './card-description.svelte';
-import Footer from './card-footer.svelte';
-import Header from './card-header.svelte';
-import Title from './card-title.svelte';
-import Action from './card-action.svelte';
-
-export {
-	Root,
-	Content,
-	Description,
-	Footer,
-	Header,
-	Title,
-	Action,
-	//
-	Root as Card,
-	Content as CardContent,
-	Description as CardDescription,
-	Footer as CardFooter,
-	Header as CardHeader,
-	Title as CardTitle,
-	Action as CardAction
-};

package/src/lib/components/ui/collapsible/collapsible-content.svelte

@@ -1,7 +0,0 @@
-<script lang="ts">
-	import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
-
-	let { ref = $bindable(null), ...restProps }: CollapsiblePrimitive.ContentProps = $props();
-</script>
-
-<CollapsiblePrimitive.Content bind:ref data-slot="collapsible-content" {...restProps} />

package/src/lib/components/ui/collapsible/collapsible-trigger.svelte

@@ -1,7 +0,0 @@
-<script lang="ts">
-	import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
-
-	let { ref = $bindable(null), ...restProps }: CollapsiblePrimitive.TriggerProps = $props();
-</script>
-
-<CollapsiblePrimitive.Trigger bind:ref data-slot="collapsible-trigger" {...restProps} />

package/src/lib/components/ui/collapsible/collapsible.svelte

@@ -1,11 +0,0 @@
-<script lang="ts">
-	import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
-
-	let {
-		ref = $bindable(null),
-		open = $bindable(false),
-		...restProps
-	}: CollapsiblePrimitive.RootProps = $props();
-</script>
-
-<CollapsiblePrimitive.Root bind:ref bind:open data-slot="collapsible" {...restProps} />

package/src/lib/components/ui/collapsible/index.ts

@@ -1,13 +0,0 @@
-import Root from './collapsible.svelte';
-import Trigger from './collapsible-trigger.svelte';
-import Content from './collapsible-content.svelte';
-
-export {
-	Root,
-	Content,
-	Trigger,
-	//
-	Root as Collapsible,
-	Content as CollapsibleContent,
-	Trigger as CollapsibleTrigger
-};

package/src/lib/components/ui/command/command-dialog.svelte

@@ -1,40 +0,0 @@
-<script lang="ts">
-	import type { Command as CommandPrimitive, Dialog as DialogPrimitive } from 'bits-ui';
-	import type { Snippet } from 'svelte';
-	import Command from './command.svelte';
-	import * as Dialog from '@lib/components/ui/dialog/index.js';
-	import type { WithoutChildrenOrChild } from '@lib/utils.js';
-
-	let {
-		open = $bindable(false),
-		ref = $bindable(null),
-		value = $bindable(''),
-		title = 'Command Palette',
-		description = 'Search for a command to run',
-		portalProps,
-		children,
-		...restProps
-	}: WithoutChildrenOrChild<DialogPrimitive.RootProps> &
-		WithoutChildrenOrChild<CommandPrimitive.RootProps> & {
-			portalProps?: DialogPrimitive.PortalProps;
-			children: Snippet;
-			title?: string;
-			description?: string;
-		} = $props();
-</script>
-
-<Dialog.Root bind:open {...restProps}>
-	<Dialog.Header class="sr-only">
-		<Dialog.Title>{title}</Dialog.Title>
-		<Dialog.Description>{description}</Dialog.Description>
-	</Dialog.Header>
-	<Dialog.Content class="overflow-hidden p-0" {portalProps}>
-		<Command
-			class="**:data-[slot=command-input-wrapper]:h-12 [&_[data-command-group]:not([hidden])_~[data-command-group]]:pt-0 [&_[data-command-group]]:px-2 [&_[data-command-input-wrapper]_svg]:h-5 [&_[data-command-input-wrapper]_svg]:w-5 [&_[data-command-input]]:h-12 [&_[data-command-item]]:px-2 [&_[data-command-item]]:py-3 [&_[data-command-item]_svg]:h-5 [&_[data-command-item]_svg]:w-5"
-			{...restProps}
-			bind:value
-			bind:ref
-			{children}
-		/>
-	</Dialog.Content>
-</Dialog.Root>

package/src/lib/components/ui/command/command-empty.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-	import { Command as CommandPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		...restProps
-	}: CommandPrimitive.EmptyProps = $props();
-</script>
-
-<CommandPrimitive.Empty
-	bind:ref
-	data-slot="command-empty"
-	class={cn('py-6 text-center text-sm', className)}
-	{...restProps}
-/>

package/src/lib/components/ui/command/command-group.svelte

@@ -1,30 +0,0 @@
-<script lang="ts">
-	import { Command as CommandPrimitive, useId } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		children,
-		heading,
-		value,
-		...restProps
-	}: CommandPrimitive.GroupProps & {
-		heading?: string;
-	} = $props();
-</script>
-
-<CommandPrimitive.Group
-	bind:ref
-	data-slot="command-group"
-	class={cn('text-foreground overflow-hidden p-1', className)}
-	value={value ?? heading ?? `----${useId()}`}
-	{...restProps}
->
-	{#if heading}
-		<CommandPrimitive.GroupHeading class="text-muted-foreground px-2 py-1.5 text-xs font-medium">
-			{heading}
-		</CommandPrimitive.GroupHeading>
-	{/if}
-	<CommandPrimitive.GroupItems {children} />
-</CommandPrimitive.Group>

package/src/lib/components/ui/command/command-input.svelte

@@ -1,26 +0,0 @@
-<script lang="ts">
-	import { Command as CommandPrimitive } from 'bits-ui';
-	import SearchIcon from '@lucide/svelte/icons/search';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		value = $bindable(''),
-		...restProps
-	}: CommandPrimitive.InputProps = $props();
-</script>
-
-<div class="flex h-9 items-center gap-2 border-b pl-3 pr-8" data-slot="command-input-wrapper">
-	<SearchIcon class="size-4 shrink-0 opacity-50" />
-	<CommandPrimitive.Input
-		data-slot="command-input"
-		class={cn(
-			'placeholder:text-muted-foreground outline-hidden flex h-10 w-full rounded-md bg-transparent py-3 text-sm disabled:cursor-not-allowed disabled:opacity-50',
-			className
-		)}
-		bind:ref
-		{...restProps}
-		bind:value
-	/>
-</div>

package/src/lib/components/ui/command/command-item.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import { Command as CommandPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		...restProps
-	}: CommandPrimitive.ItemProps = $props();
-</script>
-
-<CommandPrimitive.Item
-	bind:ref
-	data-slot="command-item"
-	class={cn(
-		"aria-selected:bg-accent aria-selected:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
-		className
-	)}
-	{...restProps}
-/>

package/src/lib/components/ui/command/command-link-item.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import { Command as CommandPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		...restProps
-	}: CommandPrimitive.LinkItemProps = $props();
-</script>
-
-<CommandPrimitive.LinkItem
-	bind:ref
-	data-slot="command-item"
-	class={cn(
-		"aria-selected:bg-accent aria-selected:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
-		className
-	)}
-	{...restProps}
-/>

package/src/lib/components/ui/command/command-list.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-	import { Command as CommandPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		...restProps
-	}: CommandPrimitive.ListProps = $props();
-</script>
-
-<CommandPrimitive.List
-	bind:ref
-	data-slot="command-list"
-	class={cn('max-h-[300px] scroll-py-1 overflow-y-auto overflow-x-hidden', className)}
-	{...restProps}
-/>

package/src/lib/components/ui/command/command-separator.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-	import { Command as CommandPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		...restProps
-	}: CommandPrimitive.SeparatorProps = $props();
-</script>
-
-<CommandPrimitive.Separator
-	bind:ref
-	data-slot="command-separator"
-	class={cn('bg-border -mx-1 h-px', className)}
-	{...restProps}
-/>

package/src/lib/components/ui/command/command-shortcut.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import { cn, type WithElementRef } from '@lib/utils.js';
-	import type { HTMLAttributes } from 'svelte/elements';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		children,
-		...restProps
-	}: WithElementRef<HTMLAttributes<HTMLSpanElement>> = $props();
-</script>
-
-<span
-	bind:this={ref}
-	data-slot="command-shortcut"
-	class={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)}
-	{...restProps}
->
-	{@render children?.()}
-</span>

package/src/lib/components/ui/command/command.svelte

@@ -1,22 +0,0 @@
-<script lang="ts">
-	import { Command as CommandPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		value = $bindable(''),
-		class: className,
-		...restProps
-	}: CommandPrimitive.RootProps = $props();
-</script>
-
-<CommandPrimitive.Root
-	bind:value
-	bind:ref
-	data-slot="command"
-	class={cn(
-		'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md',
-		className
-	)}
-	{...restProps}
-/>

package/src/lib/components/ui/command/index.ts

@@ -1,40 +0,0 @@
-import { Command as CommandPrimitive } from 'bits-ui';
-
-import Root from './command.svelte';
-import Dialog from './command-dialog.svelte';
-import Empty from './command-empty.svelte';
-import Group from './command-group.svelte';
-import Item from './command-item.svelte';
-import Input from './command-input.svelte';
-import List from './command-list.svelte';
-import Separator from './command-separator.svelte';
-import Shortcut from './command-shortcut.svelte';
-import LinkItem from './command-link-item.svelte';
-
-const Loading = CommandPrimitive.Loading;
-
-export {
-	Root,
-	Dialog,
-	Empty,
-	Group,
-	Item,
-	LinkItem,
-	Input,
-	List,
-	Separator,
-	Shortcut,
-	Loading,
-	//
-	Root as Command,
-	Dialog as CommandDialog,
-	Empty as CommandEmpty,
-	Group as CommandGroup,
-	Item as CommandItem,
-	LinkItem as CommandLinkItem,
-	Input as CommandInput,
-	List as CommandList,
-	Separator as CommandSeparator,
-	Shortcut as CommandShortcut,
-	Loading as CommandLoading
-};

package/src/lib/components/ui/dialog/dialog-close.svelte

@@ -1,7 +0,0 @@
-<script lang="ts">
-	import { Dialog as DialogPrimitive } from 'bits-ui';
-
-	let { ref = $bindable(null), ...restProps }: DialogPrimitive.CloseProps = $props();
-</script>
-
-<DialogPrimitive.Close bind:ref data-slot="dialog-close" {...restProps} />

package/src/lib/components/ui/dialog/dialog-content.svelte

@@ -1,43 +0,0 @@
-<script lang="ts">
-	import { Dialog as DialogPrimitive } from 'bits-ui';
-	import XIcon from '@lucide/svelte/icons/x';
-	import type { Snippet } from 'svelte';
-	import * as Dialog from './index.js';
-	import { cn, type WithoutChildrenOrChild } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		portalProps,
-		children,
-		showCloseButton = true,
-		...restProps
-	}: WithoutChildrenOrChild<DialogPrimitive.ContentProps> & {
-		portalProps?: DialogPrimitive.PortalProps;
-		children: Snippet;
-		showCloseButton?: boolean;
-	} = $props();
-</script>
-
-<Dialog.Portal {...portalProps}>
-	<Dialog.Overlay />
-	<DialogPrimitive.Content
-		bind:ref
-		data-slot="dialog-content"
-		class={cn(
-			'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed left-[50%] top-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
-			className
-		)}
-		{...restProps}
-	>
-		{@render children?.()}
-		{#if showCloseButton}
-			<DialogPrimitive.Close
-				class="ring-offset-background focus:ring-ring rounded-xs focus:outline-hidden absolute end-4 top-4 opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0"
-			>
-				<XIcon />
-				<span class="sr-only">Close</span>
-			</DialogPrimitive.Close>
-		{/if}
-	</DialogPrimitive.Content>
-</Dialog.Portal>

package/src/lib/components/ui/dialog/dialog-description.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-	import { Dialog as DialogPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		...restProps
-	}: DialogPrimitive.DescriptionProps = $props();
-</script>
-
-<DialogPrimitive.Description
-	bind:ref
-	data-slot="dialog-description"
-	class={cn('text-muted-foreground text-sm', className)}
-	{...restProps}
-/>

package/src/lib/components/ui/dialog/dialog-footer.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import { cn, type WithElementRef } from '@lib/utils.js';
-	import type { HTMLAttributes } from 'svelte/elements';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		children,
-		...restProps
-	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
-</script>
-
-<div
-	bind:this={ref}
-	data-slot="dialog-footer"
-	class={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}
-	{...restProps}
->
-	{@render children?.()}
-</div>

package/src/lib/components/ui/dialog/dialog-header.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import type { HTMLAttributes } from 'svelte/elements';
-	import { cn, type WithElementRef } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		children,
-		...restProps
-	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
-</script>
-
-<div
-	bind:this={ref}
-	data-slot="dialog-header"
-	class={cn('flex flex-col gap-2 text-center sm:text-left', className)}
-	{...restProps}
->
-	{@render children?.()}
-</div>

package/src/lib/components/ui/dialog/dialog-overlay.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import { Dialog as DialogPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		...restProps
-	}: DialogPrimitive.OverlayProps = $props();
-</script>
-
-<DialogPrimitive.Overlay
-	bind:ref
-	data-slot="dialog-overlay"
-	class={cn(
-		'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50',
-		className
-	)}
-	{...restProps}
-/>

package/src/lib/components/ui/dialog/dialog-title.svelte

@@ -1,17 +0,0 @@
-<script lang="ts">
-	import { Dialog as DialogPrimitive } from 'bits-ui';
-	import { cn } from '@lib/utils.js';
-
-	let {
-		ref = $bindable(null),
-		class: className,
-		...restProps
-	}: DialogPrimitive.TitleProps = $props();
-</script>
-
-<DialogPrimitive.Title
-	bind:ref
-	data-slot="dialog-title"
-	class={cn('text-lg font-semibold leading-none', className)}
-	{...restProps}
-/>

package/src/lib/components/ui/dialog/dialog-trigger.svelte

@@ -1,7 +0,0 @@
-<script lang="ts">
-	import { Dialog as DialogPrimitive } from 'bits-ui';
-
-	let { ref = $bindable(null), ...restProps }: DialogPrimitive.TriggerProps = $props();
-</script>
-
-<DialogPrimitive.Trigger bind:ref data-slot="dialog-trigger" {...restProps} />

package/src/lib/components/ui/dialog/index.ts

@@ -1,37 +0,0 @@
-import { Dialog as DialogPrimitive } from 'bits-ui';
-
-import Title from './dialog-title.svelte';
-import Footer from './dialog-footer.svelte';
-import Header from './dialog-header.svelte';
-import Overlay from './dialog-overlay.svelte';
-import Content from './dialog-content.svelte';
-import Description from './dialog-description.svelte';
-import Trigger from './dialog-trigger.svelte';
-import Close from './dialog-close.svelte';
-
-const Root = DialogPrimitive.Root;
-const Portal = DialogPrimitive.Portal;
-
-export {
-	Root,
-	Title,
-	Portal,
-	Footer,
-	Header,
-	Trigger,
-	Overlay,
-	Content,
-	Description,
-	Close,
-	//
-	Root as Dialog,
-	Title as DialogTitle,
-	Portal as DialogPortal,
-	Footer as DialogFooter,
-	Header as DialogHeader,
-	Trigger as DialogTrigger,
-	Overlay as DialogOverlay,
-	Content as DialogContent,
-	Description as DialogDescription,
-	Close as DialogClose
-};