@rosettadash/svelte 0.1.1

package/src/visual/input/text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/input/text/index.ts"],"names":[],"mappings":";AACA,mEAAmE"}

package/src/visual/input/text/types.d.ts

@@ -0,0 +1,9 @@
+export interface TextInputProps {
+    label?: string;
+    placeholder?: string;
+    required?: boolean;
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    className?: string;
+}

package/src/visual/input/text/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/input/text/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/input/text/types.ts"],"names":[],"mappings":""}

package/src/visual/input/textarea/TextareaInput.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { TextareaInputProps } from './types';
+
+	type Props = TextareaInputProps & { children?: Snippet };
+
+	let {
+		className,
+		label,
+		placeholder,
+		rows,
+		value,
+		children,
+	}: Props = $props();
+	const rootClass = $derived(['rd-input-textarea', className].filter(Boolean).join(' '));
+</script>
+
+<section class={rootClass} data-testid="rd-input-textarea">
+	{#if label}<span class="rd-field__label">{label}</span>{/if}
+	<textarea class="rd-textarea" rows={rows ?? 4} placeholder={placeholder ?? ''}>{value ?? ''}</textarea>
+	{@render children?.()}
+</section>

package/src/visual/input/textarea/index.d.ts

@@ -0,0 +1,2 @@
+export type { TextareaInputProps } from './types';
+/** Component entry is `TextareaInput.svelte` (see package exports). */

package/src/visual/input/textarea/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `TextareaInput.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/input/textarea/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/input/textarea/index.ts"],"names":[],"mappings":";AACA,uEAAuE"}

package/src/visual/input/textarea/types.d.ts

@@ -0,0 +1,8 @@
+export interface TextareaInputProps {
+    label?: string;
+    placeholder?: string;
+    rows?: number;
+    value?: string;
+    onChange?: (value: string) => void;
+    className?: string;
+}

package/src/visual/input/textarea/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/input/textarea/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/input/textarea/types.ts"],"names":[],"mappings":""}

package/src/visual/kpi/KpiCard.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { KpiCardProps } from './types';
+
+	type Props = KpiCardProps & { children?: Snippet };
+
+	let {
+		className,
+		title,
+		value,
+		delta,
+		format,
+		children,
+	}: Props = $props();
+	const rootClass = $derived(['rd-kpi', className].filter(Boolean).join(' '));
+</script>
+
+<article class={rootClass} data-testid="rd-kpi">
+	<span class="rd-kpi__title">{title ?? 'Metric'}</span>
+	<span class="rd-kpi__value">{value ?? '—'}</span>
+	{#if delta}<span class="rd-kpi__delta">{delta}</span>{/if}
+	{@render children?.()}
+</article>

package/src/visual/kpi/index.d.ts

@@ -0,0 +1,2 @@
+export type { KpiCardProps } from './types';
+/** Component entry is `KpiCard.svelte` (see package exports). */

package/src/visual/kpi/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `KpiCard.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/kpi/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../packages/svelte/src/visual/kpi/index.ts"],"names":[],"mappings":";AACA,iEAAiE"}

package/src/visual/kpi/types.d.ts

@@ -0,0 +1,7 @@
+export interface KpiCardProps {
+    title?: string;
+    value?: string | number;
+    delta?: string;
+    format?: 'number' | 'currency' | 'percent';
+    className?: string;
+}

package/src/visual/kpi/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/kpi/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../packages/svelte/src/visual/kpi/types.ts"],"names":[],"mappings":""}

package/src/visual/link-list/LinkList.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+	import type { LinkListItem } from './types';
+
+	interface Props {
+		items?: LinkListItem[];
+		className?: string;
+		dense?: boolean;
+	}
+
+	let { items = [], className, dense = false }: Props = $props();
+
+	const rootClass = $derived(
+		['rd-link-list', dense ? 'rd-link-list--dense' : '', className]
+			.filter(Boolean)
+			.join(' '),
+	);
+</script>
+
+<ul class={rootClass} data-testid="rd-link-list">
+	{#each items as item (item.href + ':' + item.label)}
+		<li class="rd-link-list__item">
+			<a class="rd-link-list__link" href={item.href}>{item.label}</a>
+		</li>
+	{/each}
+</ul>

package/src/visual/link-list/index.d.ts

@@ -0,0 +1,2 @@
+export type { LinkListItem, LinkListProps } from './types';
+/** Component entry is `LinkList.svelte` (see package exports). */

package/src/visual/link-list/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `LinkList.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/link-list/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../packages/svelte/src/visual/link-list/index.ts"],"names":[],"mappings":";AACA,kEAAkE"}

package/src/visual/link-list/types.d.ts

@@ -0,0 +1,9 @@
+export interface LinkListItem {
+    label: string;
+    href: string;
+}
+export interface LinkListProps {
+    items?: LinkListItem[];
+    className?: string;
+    dense?: boolean;
+}

package/src/visual/link-list/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/link-list/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../packages/svelte/src/visual/link-list/types.ts"],"names":[],"mappings":""}

package/src/visual/media/equirect-viewport/EquirectViewport.svelte

@@ -0,0 +1,66 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import {
+		DB_EQUIRECT_VIEWPORT_TAG,
+		registerRdEquirectViewport,
+		type EquirectPreviewMode,
+	} from '@rosettadash/web-components/visual/media/equirect-viewport';
+	import {
+		attachHostEvents,
+		setHostAttribute,
+	} from '../../../lib/custom-element-host';
+	import type { EquirectViewportProps } from './types';
+
+	let {
+		label,
+		previewMode,
+		sourceWidth,
+		sourceHeight,
+		cropX,
+		cropY,
+		cropWidth,
+		cropHeight,
+		outputWidth,
+		outputHeight,
+		yaw,
+		pitch,
+		horizontalFov,
+		className,
+		onCropRegion,
+	}: EquirectViewportProps = $props();
+
+	let host: HTMLElement;
+	let detachEvents = () => {};
+
+	onMount(() => {
+		registerRdEquirectViewport();
+		detachEvents = attachHostEvents(host, {
+			'crop-region': (detail) =>
+				onCropRegion?.(
+					detail as Record<string, string | number | boolean | null | undefined>,
+				),
+		});
+		return () => detachEvents();
+	});
+
+	$effect(() => {
+		if (!host) {
+			return;
+		}
+		setHostAttribute(host, 'label', label);
+		setHostAttribute(host, 'preview-mode', previewMode);
+		setHostAttribute(host, 'source-width', sourceWidth);
+		setHostAttribute(host, 'source-height', sourceHeight);
+		setHostAttribute(host, 'crop-x', cropX);
+		setHostAttribute(host, 'crop-y', cropY);
+		setHostAttribute(host, 'crop-width', cropWidth);
+		setHostAttribute(host, 'crop-height', cropHeight);
+		setHostAttribute(host, 'output-width', outputWidth);
+		setHostAttribute(host, 'output-height', outputHeight);
+		setHostAttribute(host, 'yaw', yaw);
+		setHostAttribute(host, 'pitch', pitch);
+		setHostAttribute(host, 'horizontal-fov', horizontalFov);
+	});
+</script>
+
+<svelte:element this={DB_EQUIRECT_VIEWPORT_TAG} bind:this={host} class={className} />

package/src/visual/media/equirect-viewport/index.d.ts

@@ -0,0 +1,2 @@
+export type { EquirectPreviewMode, EquirectViewportProps } from './types';
+/** Component entry is `EquirectViewport.svelte` (see package exports). */

package/src/visual/media/equirect-viewport/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `EquirectViewport.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/media/equirect-viewport/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/media/equirect-viewport/index.ts"],"names":[],"mappings":";AACA,0EAA0E"}

package/src/visual/media/equirect-viewport/types.d.ts

@@ -0,0 +1,19 @@
+import type { EquirectPreviewMode } from '@rosettadash/web-components/visual/media/equirect-viewport';
+export type { EquirectPreviewMode };
+export interface EquirectViewportProps {
+    label?: string;
+    previewMode?: EquirectPreviewMode;
+    sourceWidth?: number;
+    sourceHeight?: number;
+    cropX?: number;
+    cropY?: number;
+    cropWidth?: number;
+    cropHeight?: number;
+    outputWidth?: number;
+    outputHeight?: number;
+    yaw?: number;
+    pitch?: number;
+    horizontalFov?: number;
+    className?: string;
+    onCropRegion?: (detail: Record<string, string | number | boolean | null | undefined>) => void;
+}

package/src/visual/media/equirect-viewport/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/media/equirect-viewport/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/media/equirect-viewport/types.ts"],"names":[],"mappings":""}

package/src/visual/media/live-capture/LiveCapture.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { LiveCaptureProps } from './types';
+
+	type Props = LiveCaptureProps & { children?: Snippet };
+
+	let {
+		className,
+		label,
+		children,
+	}: Props = $props();
+	const rootClass = $derived(['rd-media-live-capture', className].filter(Boolean).join(' '));
+</script>
+
+<section class={rootClass} data-testid="rd-media-live-capture">
+	<span class="rd-media__label">{label ?? 'Live capture'}</span>
+	<button type="button" class="rd-button">Start camera</button>
+	{@render children?.()}
+</section>

package/src/visual/media/live-capture/index.d.ts

@@ -0,0 +1,2 @@
+export type { LiveCaptureProps } from './types';
+/** Component entry is `LiveCapture.svelte` (see package exports). */

package/src/visual/media/live-capture/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `LiveCapture.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/media/live-capture/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/media/live-capture/index.ts"],"names":[],"mappings":";AACA,qEAAqE"}

package/src/visual/media/live-capture/types.d.ts

@@ -0,0 +1,5 @@
+export interface LiveCaptureProps {
+    label?: string;
+    onStart?: () => void;
+    className?: string;
+}

package/src/visual/media/live-capture/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/media/live-capture/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/media/live-capture/types.ts"],"names":[],"mappings":""}

package/src/visual/media/video-source/VideoSource.svelte

@@ -0,0 +1,49 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import {
+		DB_VIDEO_SOURCE_TAG,
+		registerRdVideoSource,
+	} from '@rosettadash/web-components/visual/media/video-source';
+	import {
+		attachHostEvents,
+		setHostAttribute,
+	} from '../../../lib/custom-element-host';
+	import type { VideoFileDetail, VideoSourceProps } from './types';
+
+	let {
+		label,
+		accept,
+		sourceWidth,
+		sourceHeight,
+		className,
+		onVideoFile,
+		onMetadata,
+	}: VideoSourceProps = $props();
+
+	let host: HTMLElement;
+	let detachEvents = () => {};
+
+	onMount(() => {
+		registerRdVideoSource();
+		detachEvents = attachHostEvents(host, {
+			'video-file': (detail) => onVideoFile?.(detail as VideoFileDetail),
+			metadata: (detail) =>
+				onMetadata?.(
+					detail as Record<string, string | number | boolean | null | undefined>,
+				),
+		});
+		return () => detachEvents();
+	});
+
+	$effect(() => {
+		if (!host) {
+			return;
+		}
+		setHostAttribute(host, 'label', label);
+		setHostAttribute(host, 'accept', accept);
+		setHostAttribute(host, 'source-width', sourceWidth);
+		setHostAttribute(host, 'source-height', sourceHeight);
+	});
+</script>
+
+<svelte:element this={DB_VIDEO_SOURCE_TAG} bind:this={host} class={className} />

package/src/visual/media/video-source/index.d.ts

@@ -0,0 +1,2 @@
+export type { VideoFileDetail, VideoSourceProps } from './types';
+/** Component entry is `VideoSource.svelte` (see package exports). */

package/src/visual/media/video-source/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `VideoSource.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/media/video-source/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/media/video-source/index.ts"],"names":[],"mappings":";AACA,qEAAqE"}

package/src/visual/media/video-source/types.d.ts

@@ -0,0 +1,13 @@
+export interface VideoFileDetail {
+    file: File;
+    metadata: Record<string, string | number | boolean | null | undefined>;
+}
+export interface VideoSourceProps {
+    label?: string;
+    accept?: string;
+    sourceWidth?: number;
+    sourceHeight?: number;
+    className?: string;
+    onVideoFile?: (detail: VideoFileDetail) => void;
+    onMetadata?: (detail: Record<string, string | number | boolean | null | undefined>) => void;
+}

package/src/visual/media/video-source/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/media/video-source/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/media/video-source/types.ts"],"names":[],"mappings":""}

package/src/visual/news/article-detail/NewsArticleDetail.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { NewsArticleDetailProps } from './types';
+
+	type Props = NewsArticleDetailProps & { children?: Snippet };
+
+	let {
+		className,
+		title,
+		emptyMessage,
+		children,
+	}: Props = $props();
+	const rootClass = $derived(['rd-news-article-detail', className].filter(Boolean).join(' '));
+</script>
+
+<section class={rootClass} data-testid="rd-news-article-detail">
+	<header class="rd-detail__header"><span>{title ?? 'Article'}</span></header>
+	<p class="rd-detail__empty">{emptyMessage ?? 'Select a headline in News Results'}</p>
+	{@render children?.()}
+</section>

package/src/visual/news/article-detail/index.d.ts

@@ -0,0 +1,2 @@
+export type { NewsArticleDetailProps } from './types';
+/** Component entry is `NewsArticleDetail.svelte` (see package exports). */

package/src/visual/news/article-detail/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `NewsArticleDetail.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/news/article-detail/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/news/article-detail/index.ts"],"names":[],"mappings":";AACA,2EAA2E"}

package/src/visual/news/article-detail/types.d.ts

@@ -0,0 +1,5 @@
+export interface NewsArticleDetailProps {
+    title?: string;
+    emptyMessage?: string;
+    className?: string;
+}

package/src/visual/news/article-detail/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/news/article-detail/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/news/article-detail/types.ts"],"names":[],"mappings":""}

package/src/visual/news/language-select/NewsLanguageSelect.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { NewsLanguageSelectProps } from './types';
+
+	type Props = NewsLanguageSelectProps & { children?: Snippet };
+
+	let {
+		className,
+		label,
+		placeholder,
+		options,
+		value,
+		children,
+	}: Props = $props();
+	const rootClass = $derived(['rd-news-language-select', className].filter(Boolean).join(' '));
+</script>
+
+<section class={rootClass} data-testid="rd-news-language-select">
+	{#if label}<span class="rd-field__label">{label}</span>{/if}
+	<select class="rd-select" value={value ?? ''}>
+		<option value="">{placeholder ?? 'Select…'}</option>
+		{#each options ?? [] as o (o.value)}<option value={o.value}>{o.label}</option>{/each}
+	</select>
+	{@render children?.()}
+</section>

package/src/visual/news/language-select/index.d.ts

@@ -0,0 +1,2 @@
+export type { NewsLanguageSelectProps } from './types';
+/** Component entry is `NewsLanguageSelect.svelte` (see package exports). */

package/src/visual/news/language-select/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `NewsLanguageSelect.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/news/language-select/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/news/language-select/index.ts"],"names":[],"mappings":";AACA,4EAA4E"}

package/src/visual/news/language-select/types.d.ts

@@ -0,0 +1,11 @@
+export interface NewsLanguageSelectProps {
+    label?: string;
+    placeholder?: string;
+    options?: {
+        value: string;
+        label: string;
+    }[];
+    value?: string;
+    onChange?: (value: string) => void;
+    className?: string;
+}

package/src/visual/news/language-select/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/news/language-select/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/news/language-select/types.ts"],"names":[],"mappings":""}

package/src/visual/news/region-select/NewsRegionSelect.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { NewsRegionSelectProps } from './types';
+
+	type Props = NewsRegionSelectProps & { children?: Snippet };
+
+	let {
+		className,
+		label,
+		placeholder,
+		options,
+		value,
+		children,
+	}: Props = $props();
+	const rootClass = $derived(['rd-news-region-select', className].filter(Boolean).join(' '));
+</script>
+
+<section class={rootClass} data-testid="rd-news-region-select">
+	{#if label}<span class="rd-field__label">{label}</span>{/if}
+	<select class="rd-select" value={value ?? ''}>
+		<option value="">{placeholder ?? 'Select…'}</option>
+		{#each options ?? [] as o (o.value)}<option value={o.value}>{o.label}</option>{/each}
+	</select>
+	{@render children?.()}
+</section>

package/src/visual/news/region-select/index.d.ts

@@ -0,0 +1,2 @@
+export type { NewsRegionSelectProps } from './types';
+/** Component entry is `NewsRegionSelect.svelte` (see package exports). */

package/src/visual/news/region-select/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `NewsRegionSelect.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map

package/src/visual/news/region-select/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/news/region-select/index.ts"],"names":[],"mappings":";AACA,0EAA0E"}

package/src/visual/news/region-select/types.d.ts

@@ -0,0 +1,11 @@
+export interface NewsRegionSelectProps {
+    label?: string;
+    placeholder?: string;
+    options?: {
+        value: string;
+        label: string;
+    }[];
+    value?: string;
+    onChange?: (value: string) => void;
+    className?: string;
+}

package/src/visual/news/region-select/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/src/visual/news/region-select/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../packages/svelte/src/visual/news/region-select/types.ts"],"names":[],"mappings":""}

package/src/visual/news/results-table/NewsResultsTable.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { NewsResultsTableProps } from './types';
+
+	type Props = NewsResultsTableProps & { children?: Snippet };
+
+	let {
+		className,
+		title,
+		children,
+	}: Props = $props();
+	const rootClass = $derived(['rd-news-results-table', className].filter(Boolean).join(' '));
+</script>
+
+<section class={rootClass} data-testid="rd-news-results-table">
+	<header class="rd-table__header"><span>{title ?? 'News results'}</span></header>
+	<table class="rd-table"><thead><tr><th>Headline</th><th>Source</th><th>Region</th><th>Published</th></tr></thead><tbody></tbody></table>
+	{@render children?.()}
+</section>

package/src/visual/news/results-table/index.d.ts

@@ -0,0 +1,2 @@
+export type { NewsResultsTableProps } from './types';
+/** Component entry is `NewsResultsTable.svelte` (see package exports). */

package/src/visual/news/results-table/index.js

@@ -0,0 +1,3 @@
+export {};
+/** Component entry is `NewsResultsTable.svelte` (see package exports). */
+//# sourceMappingURL=index.js.map