@signal9/era-ui 1.1.2

package/dist/ui/button/variants.d.ts

@@ -0,0 +1,70 @@
+export declare const buttonVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        filled: string;
+        link: string;
+    };
+    tone: {
+        default: string;
+        accent: string;
+        destructive: string;
+        success: string;
+    };
+    size: {
+        default: string;
+        sm: string;
+        xs: string;
+        icon: string;
+    };
+    icon: {
+        true: string;
+    };
+    active: {
+        true: string;
+    };
+}, undefined, "items-center gap-(--era-gap) text-body era-interactive", {
+    variant: {
+        filled: string;
+        link: string;
+    };
+    tone: {
+        default: string;
+        accent: string;
+        destructive: string;
+        success: string;
+    };
+    size: {
+        default: string;
+        sm: string;
+        xs: string;
+        icon: string;
+    };
+    icon: {
+        true: string;
+    };
+    active: {
+        true: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        filled: string;
+        link: string;
+    };
+    tone: {
+        default: string;
+        accent: string;
+        destructive: string;
+        success: string;
+    };
+    size: {
+        default: string;
+        sm: string;
+        xs: string;
+        icon: string;
+    };
+    icon: {
+        true: string;
+    };
+    active: {
+        true: string;
+    };
+}, undefined, "items-center gap-(--era-gap) text-body era-interactive", unknown, unknown, undefined>>;

package/dist/ui/button/variants.js

@@ -0,0 +1,97 @@
+import { tv } from '../../utils/index.js';
+// The link variant is chromeless tinted text: it ignores size/icon geometry
+// entirely, so all geometry lives on filled compound variants rather than a
+// plain size variant.
+export const buttonVariants = tv({
+    base: 'items-center gap-(--era-gap) text-body era-interactive',
+    variants: {
+        variant: {
+            // The active: press treatment is inert outside the bevel surface —
+            // flat/glass define --era-shadow-pressed as the resting shadow and a
+            // 0px shift; bevel inverts the bevel and nudges the face 1px so the
+            // click reads as a physical depress.
+            filled: 'flex justify-center shadow-(--era-shadow) hover:shadow-(--era-highlight-shadow) active:translate-x-(--era-press-shift) active:translate-y-(--era-press-shift) active:shadow-(--era-shadow-pressed)',
+            link: 'inline-flex underline-offset-2 hover:underline'
+        },
+        tone: { default: '', accent: '', destructive: '', success: '' },
+        size: { default: '', sm: '', xs: '', icon: '' },
+        icon: { true: '' },
+        active: { true: '' }
+    },
+    compoundVariants: [
+        // filled geometry
+        {
+            variant: 'filled',
+            size: 'default',
+            class: 'h-(--era-h-md) min-w-(--era-h-md) rounded-(--era-rd-md)'
+        },
+        {
+            variant: 'filled',
+            size: 'sm',
+            class: 'h-(--era-h-sm) min-w-(--era-h-sm) rounded-(--era-rd-sm)'
+        },
+        {
+            variant: 'filled',
+            size: 'xs',
+            class: 'h-(--era-h-xs) min-w-(--era-h-xs) rounded-(--era-rd-xs)'
+        },
+        {
+            variant: 'filled',
+            size: 'icon',
+            class: 'h-(--era-h-xs) min-w-(--era-h-xs) rounded-(--era-rd-xs)'
+        },
+        // filled insets; icon buttons go square instead. When an icon is present,
+        // gap widens to match the wall inset so the icon sits in rhythm with it.
+        {
+            variant: 'filled',
+            icon: false,
+            size: 'default',
+            class: 'px-(--era-inset-md) has-[svg]:gap-(--era-inset-md)'
+        },
+        {
+            variant: 'filled',
+            icon: false,
+            size: 'sm',
+            class: 'px-(--era-inset-sm) has-[svg]:gap-(--era-inset-sm)'
+        },
+        { variant: 'filled', icon: false, size: 'xs', class: 'px-(--era-px-sm)' },
+        { variant: 'filled', icon: false, size: 'icon', class: 'px-(--era-px-sm)' },
+        { variant: 'filled', icon: true, class: 'aspect-square px-0' },
+        // filled tones
+        {
+            variant: 'filled',
+            tone: 'default',
+            class: 'text-fg hover:bg-(--era-highlight) hover:text-bright'
+        },
+        {
+            variant: 'filled',
+            tone: 'accent',
+            class: 'bg-primary text-primary-fg hover:bg-primary-hover'
+        },
+        {
+            variant: 'filled',
+            tone: 'destructive',
+            class: 'text-fg hover:bg-destructive hover:text-destructive-fg'
+        },
+        { variant: 'filled', tone: 'success', class: 'text-fg hover:bg-success hover:text-success-fg' },
+        // Latched controls (Toggle on, current tab/page) hold the pressed face.
+        {
+            variant: 'filled',
+            active: true,
+            class: 'bg-hover text-bright shadow-(--era-shadow-pressed)'
+        },
+        // link tones: static prose until the cursor confirms interactivity
+        { variant: 'link', tone: 'default', class: 'text-fg' },
+        { variant: 'link', tone: 'accent', class: 'text-primary' },
+        { variant: 'link', tone: 'destructive', class: 'text-destructive' },
+        { variant: 'link', tone: 'success', class: 'text-success' },
+        { variant: 'link', active: true, class: 'underline' }
+    ],
+    defaultVariants: {
+        variant: 'filled',
+        tone: 'default',
+        size: 'default',
+        icon: false,
+        active: false
+    }
+});

package/dist/ui/button-group/button-group.svelte

@@ -0,0 +1,31 @@
+<script lang="ts">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import type { Snippet } from 'svelte';
+	import { cn } from '../../utils/index.js';
+
+	let {
+		ref = $bindable(null),
+		children,
+		orientation = 'horizontal',
+		class: className,
+		...restProps
+	}: HTMLAttributes<HTMLDivElement> & {
+		ref?: HTMLDivElement | null;
+		children?: Snippet;
+		orientation?: 'horizontal' | 'vertical';
+	} = $props();
+</script>
+
+<div
+	bind:this={ref}
+	class={cn(
+		'flex gap-(--era-xs-inset-sm)',
+		orientation === 'vertical'
+			? 'flex-col items-stretch p-(--era-xs-inset-sm) [&>*]:justify-start'
+			: 'items-center',
+		className
+	)}
+	{...restProps}
+>
+	{@render children?.()}
+</div>

package/dist/ui/button-group/button-group.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { HTMLAttributes } from 'svelte/elements';
+import type { Snippet } from 'svelte';
+type $$ComponentProps = HTMLAttributes<HTMLDivElement> & {
+    ref?: HTMLDivElement | null;
+    children?: Snippet;
+    orientation?: 'horizontal' | 'vertical';
+};
+declare const ButtonGroup: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type ButtonGroup = ReturnType<typeof ButtonGroup>;
+export default ButtonGroup;

package/dist/ui/button-group/index.d.ts

@@ -0,0 +1 @@
+export { default as ButtonGroup } from './button-group.svelte';

package/dist/ui/button-group/index.js

@@ -0,0 +1 @@
+export { default as ButtonGroup } from './button-group.svelte';

package/dist/ui/calendar/calendar-cell.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+	import { cn } from '../../utils/index.js';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.CellProps = $props();
+</script>
+
+<Calendar.Cell bind:ref class={cn('p-0', className)} {...restProps} />

package/dist/ui/calendar/calendar-cell.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarCell: import("svelte").Component<Calendar.CellProps, {}, "ref">;
+type CalendarCell = ReturnType<typeof CalendarCell>;
+export default CalendarCell;

package/dist/ui/calendar/calendar-day.svelte

@@ -0,0 +1,15 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+	import { cn } from '../../utils/index.js';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.DayProps = $props();
+</script>
+
+<Calendar.Day
+	bind:ref
+	class={cn(
+		'inline-flex size-(--era-h-md) cursor-default items-center justify-center rounded-(--era-rd-md) text-body text-fg hover:bg-(--era-highlight) focus:outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[outside-month]:pointer-events-none data-[outside-month]:text-muted/40 data-[selected]:bg-hover data-[selected]:text-bright data-[unavailable]:text-muted data-[unavailable]:line-through',
+		className
+	)}
+	{...restProps}
+/>

package/dist/ui/calendar/calendar-day.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarDay: import("svelte").Component<Calendar.DayProps, {}, "ref">;
+type CalendarDay = ReturnType<typeof CalendarDay>;
+export default CalendarDay;

package/dist/ui/calendar/calendar-grid-body.svelte

@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.GridBodyProps = $props();
+</script>
+
+<Calendar.GridBody bind:ref class={className} {...restProps} />

package/dist/ui/calendar/calendar-grid-body.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarGridBody: import("svelte").Component<Calendar.GridBodyProps, {}, "ref">;
+type CalendarGridBody = ReturnType<typeof CalendarGridBody>;
+export default CalendarGridBody;

package/dist/ui/calendar/calendar-grid-head.svelte

@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.GridHeadProps = $props();
+</script>
+
+<Calendar.GridHead bind:ref class={className} {...restProps} />

package/dist/ui/calendar/calendar-grid-head.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarGridHead: import("svelte").Component<Calendar.GridHeadProps, {}, "ref">;
+type CalendarGridHead = ReturnType<typeof CalendarGridHead>;
+export default CalendarGridHead;

package/dist/ui/calendar/calendar-grid-row.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+	import { cn } from '../../utils/index.js';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.GridRowProps = $props();
+</script>
+
+<Calendar.GridRow bind:ref class={cn('flex gap-(--era-gap)', className)} {...restProps} />

package/dist/ui/calendar/calendar-grid-row.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarGridRow: import("svelte").Component<Calendar.GridRowProps, {}, "ref">;
+type CalendarGridRow = ReturnType<typeof CalendarGridRow>;
+export default CalendarGridRow;

package/dist/ui/calendar/calendar-grid.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+	import { cn } from '../../utils/index.js';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.GridProps = $props();
+</script>
+
+<Calendar.Grid bind:ref class={cn('flex flex-col gap-(--era-gap)', className)} {...restProps} />

package/dist/ui/calendar/calendar-grid.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarGrid: import("svelte").Component<Calendar.GridProps, {}, "ref">;
+type CalendarGrid = ReturnType<typeof CalendarGrid>;
+export default CalendarGrid;

package/dist/ui/calendar/calendar-head-cell.svelte

@@ -0,0 +1,15 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+	import { cn } from '../../utils/index.js';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.HeadCellProps = $props();
+</script>
+
+<Calendar.HeadCell
+	bind:ref
+	class={cn(
+		'flex size-(--era-h-md) items-center justify-center text-body font-normal text-muted',
+		className
+	)}
+	{...restProps}
+/>

package/dist/ui/calendar/calendar-head-cell.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarHeadCell: import("svelte").Component<Calendar.HeadCellProps, {}, "ref">;
+type CalendarHeadCell = ReturnType<typeof CalendarHeadCell>;
+export default CalendarHeadCell;

package/dist/ui/calendar/calendar-header.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+	import { cn } from '../../utils/index.js';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.HeaderProps = $props();
+</script>
+
+<Calendar.Header
+	bind:ref
+	class={cn('flex h-(--era-h-md) items-center justify-between gap-(--era-gap)', className)}
+	{...restProps}
+/>

package/dist/ui/calendar/calendar-header.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarHeader: import("svelte").Component<Calendar.HeaderProps, {}, "ref">;
+type CalendarHeader = ReturnType<typeof CalendarHeader>;
+export default CalendarHeader;

package/dist/ui/calendar/calendar-heading.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+	import { cn } from '../../utils/index.js';
+
+	let { ref = $bindable(null), class: className, ...restProps }: Calendar.HeadingProps = $props();
+</script>
+
+<Calendar.Heading bind:ref class={cn('text-body font-medium text-fg', className)} {...restProps} />

package/dist/ui/calendar/calendar-heading.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarHeading: import("svelte").Component<Calendar.HeadingProps, {}, "ref">;
+type CalendarHeading = ReturnType<typeof CalendarHeading>;
+export default CalendarHeading;

package/dist/ui/calendar/calendar-next-button.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import { Calendar, type WithoutChildrenOrChild } from 'bits-ui';
+	import { Button, type ButtonVariants } from '../button';
+	import ChevronRight from '@lucide/svelte/icons/chevron-right';
+
+	let {
+		ref = $bindable(null),
+		tone,
+		size,
+		children,
+		class: className,
+		...restProps
+	}: WithoutChildrenOrChild<Calendar.NextButtonProps> &
+		Pick<ButtonVariants, 'tone' | 'size'> & {
+			children?: Snippet;
+		} = $props();
+</script>
+
+<Calendar.NextButton {...restProps}>
+	{#snippet child({ props })}
+		<Button bind:ref {...props} {tone} {size} icon class={className}>
+			{#if children}
+				{@render children()}
+			{:else}
+				<ChevronRight class="size-(--era-h-xs)" />
+			{/if}
+		</Button>
+	{/snippet}
+</Calendar.NextButton>

package/dist/ui/calendar/calendar-next-button.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import { Calendar, type WithoutChildrenOrChild } from 'bits-ui';
+import { type ButtonVariants } from '../button';
+type $$ComponentProps = WithoutChildrenOrChild<Calendar.NextButtonProps> & Pick<ButtonVariants, 'tone' | 'size'> & {
+    children?: Snippet;
+};
+declare const CalendarNextButton: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type CalendarNextButton = ReturnType<typeof CalendarNextButton>;
+export default CalendarNextButton;

package/dist/ui/calendar/calendar-prev-button.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import { Calendar, type WithoutChildrenOrChild } from 'bits-ui';
+	import { Button, type ButtonVariants } from '../button';
+	import ChevronLeft from '@lucide/svelte/icons/chevron-left';
+
+	let {
+		ref = $bindable(null),
+		tone,
+		size,
+		children,
+		class: className,
+		...restProps
+	}: WithoutChildrenOrChild<Calendar.PrevButtonProps> &
+		Pick<ButtonVariants, 'tone' | 'size'> & {
+			children?: Snippet;
+		} = $props();
+</script>
+
+<Calendar.PrevButton {...restProps}>
+	{#snippet child({ props })}
+		<Button bind:ref {...props} {tone} {size} icon class={className}>
+			{#if children}
+				{@render children()}
+			{:else}
+				<ChevronLeft class="size-(--era-h-xs)" />
+			{/if}
+		</Button>
+	{/snippet}
+</Calendar.PrevButton>

package/dist/ui/calendar/calendar-prev-button.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import { Calendar, type WithoutChildrenOrChild } from 'bits-ui';
+import { type ButtonVariants } from '../button';
+type $$ComponentProps = WithoutChildrenOrChild<Calendar.PrevButtonProps> & Pick<ButtonVariants, 'tone' | 'size'> & {
+    children?: Snippet;
+};
+declare const CalendarPrevButton: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type CalendarPrevButton = ReturnType<typeof CalendarPrevButton>;
+export default CalendarPrevButton;

package/dist/ui/calendar/calendar-root.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+	import { Calendar } from 'bits-ui';
+	import { cn } from '../../utils/index.js';
+
+	let {
+		ref = $bindable(null),
+		value = $bindable(),
+		placeholder = $bindable(),
+		class: className,
+		...restProps
+	}: Calendar.RootProps = $props();
+
+	// Calendar.RootProps is a discriminated union (single vs. multiple) whose
+	// `value` types disagree (DateValue vs. DateValue[]). Spreading rest into
+	// Calendar.Root collides with the bindable, producing "union too complex
+	// to represent". Cast escapes the typecheck; runtime behavior is identical
+	// because bits-ui handles both branches uniformly.
+	// eslint-disable-next-line @typescript-eslint/no-explicit-any
+	const restPropsAsAny = $derived(restProps as any);
+</script>
+
+<Calendar.Root
+	bind:ref
+	bind:value
+	bind:placeholder
+	class={cn('inline-flex flex-col gap-(--era-gap)', className)}
+	fixedWeeks
+	weekdayFormat="short"
+	{...restPropsAsAny}
+/>

package/dist/ui/calendar/calendar-root.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Calendar } from 'bits-ui';
+declare const CalendarRoot: import("svelte").Component<Calendar.RootProps, {}, "value" | "placeholder" | "ref">;
+type CalendarRoot = ReturnType<typeof CalendarRoot>;
+export default CalendarRoot;

package/dist/ui/calendar/index.d.ts

@@ -0,0 +1,12 @@
+export { default as Root } from './calendar-root.svelte';
+export { default as Header } from './calendar-header.svelte';
+export { default as Heading } from './calendar-heading.svelte';
+export { default as PrevButton } from './calendar-prev-button.svelte';
+export { default as NextButton } from './calendar-next-button.svelte';
+export { default as Grid } from './calendar-grid.svelte';
+export { default as GridHead } from './calendar-grid-head.svelte';
+export { default as GridBody } from './calendar-grid-body.svelte';
+export { default as GridRow } from './calendar-grid-row.svelte';
+export { default as HeadCell } from './calendar-head-cell.svelte';
+export { default as Cell } from './calendar-cell.svelte';
+export { default as Day } from './calendar-day.svelte';

package/dist/ui/calendar/index.js

@@ -0,0 +1,12 @@
+export { default as Root } from './calendar-root.svelte';
+export { default as Header } from './calendar-header.svelte';
+export { default as Heading } from './calendar-heading.svelte';
+export { default as PrevButton } from './calendar-prev-button.svelte';
+export { default as NextButton } from './calendar-next-button.svelte';
+export { default as Grid } from './calendar-grid.svelte';
+export { default as GridHead } from './calendar-grid-head.svelte';
+export { default as GridBody } from './calendar-grid-body.svelte';
+export { default as GridRow } from './calendar-grid-row.svelte';
+export { default as HeadCell } from './calendar-head-cell.svelte';
+export { default as Cell } from './calendar-cell.svelte';
+export { default as Day } from './calendar-day.svelte';