@dryui/ui 0.2.2 → 0.3.0

package/dist/thumbnail/review-card.svelte

@@ -1,153 +0,0 @@
-<script lang="ts">
-	import { Svg } from '@dryui/primitives';
-	import { applySizeVars } from './apply-size.js';
-
-	interface Props {
-		size?: 'sm' | 'md' | 'lg' | number;
-		class?: string;
-	}
-
-	let { size = 'md', class: className }: Props = $props();
-</script>
-
-<span
-	data-thumbnail
-	data-size={typeof size === 'string' ? size : undefined}
-	class={className}
-	use:applySizeVars={size}
->
-	<Svg viewBox="0 0 120 80" aria-label="review card thumbnail" width="100%" height="100%">
-		<!-- Card -->
-		<rect
-			x="10"
-			y="8"
-			width="100"
-			height="64"
-			rx="6"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<!-- Stars row (3 filled, 2 empty) -->
-		<path
-			d="M18 20 L19.5 17 L21 20 L24 20 L21.5 22 L22.5 25 L19.5 23 L16.5 25 L17.5 22 L15 20 Z"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.85"
-		/>
-		<path
-			d="M27 20 L28.5 17 L30 20 L33 20 L30.5 22 L31.5 25 L28.5 23 L25.5 25 L26.5 22 L24 20 Z"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.85"
-		/>
-		<path
-			d="M36 20 L37.5 17 L39 20 L42 20 L39.5 22 L40.5 25 L37.5 23 L34.5 25 L35.5 22 L33 20 Z"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.85"
-		/>
-		<path
-			d="M45 20 L46.5 17 L48 20 L51 20 L48.5 22 L49.5 25 L46.5 23 L43.5 25 L44.5 22 L42 20 Z"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.3"
-		/>
-		<path
-			d="M54 20 L55.5 17 L57 20 L60 20 L57.5 22 L58.5 25 L55.5 23 L52.5 25 L53.5 22 L51 20 Z"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.3"
-		/>
-		<!-- Review title -->
-		<rect
-			x="18"
-			y="30"
-			width="60"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.6"
-		/>
-		<!-- Review text lines -->
-		<rect
-			x="18"
-			y="38"
-			width="84"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.4"
-		/>
-		<rect
-			x="18"
-			y="44"
-			width="80"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<rect
-			x="18"
-			y="50"
-			width="56"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.3"
-		/>
-		<!-- Author line -->
-		<line
-			x1="18"
-			y1="60"
-			x2="102"
-			y2="60"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="0.5"
-		/>
-		<circle
-			cx="24"
-			cy="66"
-			r="5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.2"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-		<rect
-			x="33"
-			y="63"
-			width="28"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.45"
-		/>
-		<rect
-			x="33"
-			y="68"
-			width="20"
-			height="2.5"
-			rx="1.25"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.3"
-		/>
-	</Svg>
-</span>
-
-<style>
-	[data-thumbnail] {
-		display: inline-grid;
-		width: var(--thumbnail-w, 80px);
-		height: var(--thumbnail-h, 53px);
-	}
-
-	[data-thumbnail][data-size='sm'] {
-		--thumbnail-w: 32px;
-		--thumbnail-h: 21px;
-	}
-	[data-thumbnail][data-size='md'] {
-		--thumbnail-w: 80px;
-		--thumbnail-h: 53px;
-	}
-	[data-thumbnail][data-size='lg'] {
-		--thumbnail-w: 160px;
-		--thumbnail-h: 107px;
-	}
-</style>

package/dist/thumbnail/review-card.svelte.d.ts

@@ -1,7 +0,0 @@
-interface Props {
-	size?: 'sm' | 'md' | 'lg' | number;
-	class?: string;
-}
-declare const ReviewCard: import('svelte').Component<Props, {}, ''>;
-type ReviewCard = ReturnType<typeof ReviewCard>;
-export default ReviewCard;

package/dist/thumbnail/rich-text-editor.svelte

@@ -1,134 +0,0 @@
-<script lang="ts">
-	import { Svg } from '@dryui/primitives';
-	import { applySizeVars } from './apply-size.js';
-
-	interface Props {
-		size?: 'sm' | 'md' | 'lg' | number;
-		class?: string;
-	}
-
-	let { size = 'md', class: className }: Props = $props();
-</script>
-
-<span
-	data-thumbnail
-	data-size={typeof size === 'string' ? size : undefined}
-	class={className}
-	use:applySizeVars={size}
->
-	<Svg viewBox="0 0 120 80" aria-label="rich-text-editor thumbnail" width="100%" height="100%">
-		<!-- Outer container -->
-		<rect
-			x="8"
-			y="6"
-			width="104"
-			height="68"
-			rx="5"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<!-- Toolbar bar -->
-		<rect
-			x="8"
-			y="6"
-			width="104"
-			height="18"
-			rx="5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.2"
-		/>
-		<line x1="8" y1="24" x2="112" y2="24" stroke="var(--dry-color-stroke-weak)" stroke-width="1" />
-		<!-- Toolbar icon squares: B, I, U, link -->
-		{#each Array(4) as _, i}
-			<rect
-				x={14 + i * 14}
-				y="10"
-				width="10"
-				height="10"
-				rx="2"
-				fill="var(--dry-color-stroke-weak)"
-				opacity="0.35"
-			/>
-		{/each}
-		<!-- Divider in toolbar -->
-		<line
-			x1="74"
-			y1="10"
-			x2="74"
-			y2="20"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-			opacity="0.4"
-		/>
-		{#each Array(2) as _, i}
-			<rect
-				x={78 + i * 14}
-				y="10"
-				width="10"
-				height="10"
-				rx="2"
-				fill="var(--dry-color-stroke-weak)"
-				opacity="0.25"
-			/>
-		{/each}
-		<!-- Content area text lines -->
-		<rect
-			x="14"
-			y="30"
-			width="80"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<rect
-			x="14"
-			y="39"
-			width="66"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<rect
-			x="14"
-			y="48"
-			width="74"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<rect
-			x="14"
-			y="57"
-			width="44"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.25"
-		/>
-	</Svg>
-</span>
-
-<style>
-	[data-thumbnail] {
-		display: inline-grid;
-		width: var(--thumbnail-w, 80px);
-		height: var(--thumbnail-h, 53px);
-	}
-
-	[data-thumbnail][data-size='sm'] {
-		--thumbnail-w: 32px;
-		--thumbnail-h: 21px;
-	}
-	[data-thumbnail][data-size='md'] {
-		--thumbnail-w: 80px;
-		--thumbnail-h: 53px;
-	}
-	[data-thumbnail][data-size='lg'] {
-		--thumbnail-w: 160px;
-		--thumbnail-h: 107px;
-	}
-</style>

package/dist/thumbnail/rich-text-editor.svelte.d.ts

@@ -1,7 +0,0 @@
-interface Props {
-	size?: 'sm' | 'md' | 'lg' | number;
-	class?: string;
-}
-declare const RichTextEditor: import('svelte').Component<Props, {}, ''>;
-type RichTextEditor = ReturnType<typeof RichTextEditor>;
-export default RichTextEditor;

package/dist/thumbnail/room-type-picker.svelte

@@ -1,212 +0,0 @@
-<script lang="ts">
-	import { Svg } from '@dryui/primitives';
-	import { applySizeVars } from './apply-size.js';
-
-	interface Props {
-		size?: 'sm' | 'md' | 'lg' | number;
-		class?: string;
-	}
-
-	let { size = 'md', class: className }: Props = $props();
-</script>
-
-<span
-	data-thumbnail
-	data-size={typeof size === 'string' ? size : undefined}
-	class={className}
-	use:applySizeVars={size}
->
-	<Svg viewBox="0 0 120 80" aria-label="room type picker thumbnail" width="100%" height="100%">
-		<!-- Room card 1 (selected) -->
-		<rect
-			x="10"
-			y="8"
-			width="100"
-			height="18"
-			rx="4"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.1"
-			stroke="var(--dry-color-fill-brand)"
-			stroke-width="1.5"
-		/>
-		<!-- Room icon (bed) -->
-		<path
-			d="M16 21 L16 13 L28 13 L28 17 L16 17"
-			stroke="var(--dry-color-fill-brand)"
-			stroke-width="1.2"
-			fill="none"
-			stroke-linecap="round"
-			stroke-linejoin="round"
-		/>
-		<rect
-			x="16"
-			y="17"
-			width="12"
-			height="4"
-			rx="1"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.2"
-		/>
-		<rect
-			x="32"
-			y="12"
-			width="40"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.7"
-		/>
-		<rect
-			x="32"
-			y="19"
-			width="24"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.4"
-		/>
-		<rect
-			x="88"
-			y="13"
-			width="18"
-			height="5"
-			rx="2"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.7"
-		/>
-		<!-- Radio check -->
-		<circle cx="107" cy="17" r="4" fill="var(--dry-color-fill-brand)" opacity="0.9" />
-		<circle cx="107" cy="17" r="1.5" fill="var(--dry-color-bg-raised)" />
-
-		<!-- Room card 2 -->
-		<rect
-			x="10"
-			y="30"
-			width="100"
-			height="18"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-		<path
-			d="M16 43 L16 35 L22 35 L22 37 L28 37 L28 35 L34 35 L34 43"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="1.2"
-			fill="none"
-			stroke-linecap="round"
-			stroke-linejoin="round"
-		/>
-		<rect
-			x="38"
-			y="34"
-			width="36"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.5"
-		/>
-		<rect
-			x="38"
-			y="41"
-			width="22"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<rect
-			x="86"
-			y="35"
-			width="18"
-			height="5"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.4"
-		/>
-		<circle
-			cx="107"
-			cy="39"
-			r="4"
-			fill="none"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-
-		<!-- Room card 3 -->
-		<rect
-			x="10"
-			y="52"
-			width="100"
-			height="18"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-		<path
-			d="M16 65 L16 57 L28 57 L28 61 L22 61 L22 65"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="1.2"
-			fill="none"
-			stroke-linecap="round"
-			stroke-linejoin="round"
-		/>
-		<rect
-			x="32"
-			y="56"
-			width="44"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.5"
-		/>
-		<rect
-			x="32"
-			y="63"
-			width="28"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<rect
-			x="84"
-			y="57"
-			width="20"
-			height="5"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<circle
-			cx="107"
-			cy="61"
-			r="4"
-			fill="none"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-	</Svg>
-</span>
-
-<style>
-	[data-thumbnail] {
-		display: inline-grid;
-		width: var(--thumbnail-w, 80px);
-		height: var(--thumbnail-h, 53px);
-	}
-
-	[data-thumbnail][data-size='sm'] {
-		--thumbnail-w: 32px;
-		--thumbnail-h: 21px;
-	}
-	[data-thumbnail][data-size='md'] {
-		--thumbnail-w: 80px;
-		--thumbnail-h: 53px;
-	}
-	[data-thumbnail][data-size='lg'] {
-		--thumbnail-w: 160px;
-		--thumbnail-h: 107px;
-	}
-</style>

package/dist/thumbnail/room-type-picker.svelte.d.ts

@@ -1,7 +0,0 @@
-interface Props {
-	size?: 'sm' | 'md' | 'lg' | number;
-	class?: string;
-}
-declare const RoomTypePicker: import('svelte').Component<Props, {}, ''>;
-type RoomTypePicker = ReturnType<typeof RoomTypePicker>;
-export default RoomTypePicker;

package/dist/thumbnail/root.svelte

@@ -1,52 +0,0 @@
-<script lang="ts">
-	import type { Snippet } from 'svelte';
-	import { Svg } from '@dryui/primitives';
-	import { applySizeVars } from './apply-size.js';
-	import { thumbnailMap } from './index.js';
-
-	interface Props {
-		name?: string;
-		size?: 'sm' | 'md' | 'lg' | number;
-		class?: string;
-		children?: Snippet;
-	}
-
-	let { name, size = 'md', children, ...rest }: Props = $props();
-</script>
-
-{#if children}
-	<span
-		data-thumbnail
-		data-size={typeof size === 'string' ? size : undefined}
-		{...rest}
-		use:applySizeVars={size}
-	>
-		{@render children()}
-	</span>
-{:else if name}
-	{@const Component = thumbnailMap[name]}
-	{#if Component}
-		<Component {size} {...rest} />
-	{/if}
-{/if}
-
-<style>
-	[data-thumbnail] {
-		display: inline-grid;
-		width: var(--thumbnail-w, 80px);
-		height: var(--thumbnail-h, 53px);
-	}
-
-	[data-thumbnail][data-size='sm'] {
-		--thumbnail-w: 32px;
-		--thumbnail-h: 21px;
-	}
-	[data-thumbnail][data-size='md'] {
-		--thumbnail-w: 80px;
-		--thumbnail-h: 53px;
-	}
-	[data-thumbnail][data-size='lg'] {
-		--thumbnail-w: 160px;
-		--thumbnail-h: 107px;
-	}
-</style>

package/dist/thumbnail/root.svelte.d.ts

@@ -1,10 +0,0 @@
-import type { Snippet } from 'svelte';
-interface Props {
-	name?: string;
-	size?: 'sm' | 'md' | 'lg' | number;
-	class?: string;
-	children?: Snippet;
-}
-declare const Root: import('svelte').Component<Props, {}, ''>;
-type Root = ReturnType<typeof Root>;
-export default Root;