@dryui/ui 0.2.2 → 0.3.0

package/dist/thumbnail/drawer.svelte

@@ -1,112 +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="drawer thumbnail" width="100%" height="100%">
-		<!-- Dimmed backdrop (left side) -->
-		<rect x="0" y="0" width="72" height="80" fill="var(--dry-color-stroke-weak)" opacity="0.3" />
-		<!-- Drawer panel (right ~40%) -->
-		<rect
-			x="72"
-			y="0"
-			width="48"
-			height="80"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<!-- Drawer handle bar at top -->
-		<rect
-			x="88"
-			y="8"
-			width="16"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.4"
-		/>
-		<!-- Title line -->
-		<rect
-			x="80"
-			y="17"
-			width="32"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.9"
-		/>
-		<!-- Content lines -->
-		<rect
-			x="80"
-			y="27"
-			width="34"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.45"
-		/>
-		<rect
-			x="80"
-			y="34"
-			width="28"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<rect
-			x="80"
-			y="41"
-			width="32"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<!-- Action button -->
-		<rect
-			x="80"
-			y="52"
-			width="32"
-			height="8"
-			rx="3"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.8"
-		/>
-	</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/drawer.svelte.d.ts

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

package/dist/thumbnail/drop-zone.svelte

@@ -1,55 +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="DropZone thumbnail" width="100%" height="100%">
-		<rect
-			x="5"
-			y="5"
-			width="110"
-			height="70"
-			rx="8"
-			fill="var(--dry-color-surface)"
-			stroke="var(--dry-color-border)"
-			stroke-width="1"
-		/>
-		<text x="60" y="44" text-anchor="middle" font-size="10" fill="var(--dry-color-muted)">
-			DropZone
-		</text>
-	</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/drop-zone.svelte.d.ts

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

package/dist/thumbnail/dropdown-menu.svelte

@@ -1,128 +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="dropdown-menu thumbnail" width="100%" height="100%">
-		<!-- Trigger button -->
-		<rect
-			x="30"
-			y="6"
-			width="60"
-			height="14"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<rect
-			x="38"
-			y="11"
-			width="28"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.7"
-		/>
-		<!-- Chevron down -->
-		<polyline
-			points="79,11 82,14 85,11"
-			fill="none"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="1.5"
-			stroke-linecap="round"
-		/>
-		<!-- Dropdown list -->
-		<rect
-			x="30"
-			y="24"
-			width="60"
-			height="52"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<!-- Highlighted item -->
-		<rect
-			x="32"
-			y="26"
-			width="56"
-			height="10"
-			rx="2"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.12"
-		/>
-		<rect
-			x="38"
-			y="29"
-			width="32"
-			height="3.5"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.85"
-		/>
-		<!-- Other items -->
-		<rect
-			x="38"
-			y="42"
-			width="38"
-			height="3.5"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.5"
-		/>
-		<rect
-			x="38"
-			y="54"
-			width="30"
-			height="3.5"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.5"
-		/>
-		<rect
-			x="38"
-			y="66"
-			width="36"
-			height="3.5"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.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/dropdown-menu.svelte.d.ts

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

package/dist/thumbnail/empty-state.svelte.d.ts

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

package/dist/thumbnail/fare-class-picker.svelte

@@ -1,225 +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="fare class picker thumbnail" width="100%" height="100%">
-		<!-- Economy card (unselected) -->
-		<rect
-			x="6"
-			y="16"
-			width="32"
-			height="48"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<rect
-			x="10"
-			y="22"
-			width="24"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.5"
-		/>
-		<rect
-			x="12"
-			y="29"
-			width="20"
-			height="12"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.1"
-		/>
-		<!-- seat icon economy -->
-		<path
-			d="M18 35 L18 31 L24 31 L24 38 L21 38"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="1.2"
-			fill="none"
-			stroke-linecap="round"
-			stroke-linejoin="round"
-		/>
-		<rect
-			x="12"
-			y="46"
-			width="24"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.4"
-		/>
-		<rect
-			x="14"
-			y="52"
-			width="20"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.2"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-
-		<!-- Business card (selected) -->
-		<rect
-			x="44"
-			y="12"
-			width="32"
-			height="56"
-			rx="4"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.08"
-		/>
-		<rect
-			x="44"
-			y="12"
-			width="32"
-			height="56"
-			rx="4"
-			fill="none"
-			stroke="var(--dry-color-fill-brand)"
-			stroke-width="2"
-		/>
-		<rect
-			x="48"
-			y="19"
-			width="24"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.7"
-		/>
-		<rect
-			x="50"
-			y="26"
-			width="20"
-			height="14"
-			rx="2"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.1"
-		/>
-		<!-- seat icon business (wider) -->
-		<path
-			d="M55 35 L55 29 L63 29 L63 38 L58 38 L58 36"
-			stroke="var(--dry-color-fill-brand)"
-			stroke-width="1.2"
-			fill="none"
-			stroke-linecap="round"
-			stroke-linejoin="round"
-		/>
-		<rect
-			x="50"
-			y="47"
-			width="24"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.5"
-		/>
-		<rect
-			x="52"
-			y="54"
-			width="20"
-			height="5"
-			rx="2"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.6"
-		/>
-
-		<!-- First card (unselected) -->
-		<rect
-			x="82"
-			y="16"
-			width="32"
-			height="48"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<rect
-			x="86"
-			y="22"
-			width="24"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.5"
-		/>
-		<rect
-			x="88"
-			y="29"
-			width="20"
-			height="12"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.1"
-		/>
-		<!-- seat icon first (flatbed) -->
-		<path
-			d="M90 40 L90 31 L100 31 L100 36 L94 36 L94 40"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="1.2"
-			fill="none"
-			stroke-linecap="round"
-			stroke-linejoin="round"
-		/>
-		<rect
-			x="88"
-			y="46"
-			width="24"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.4"
-		/>
-		<rect
-			x="90"
-			y="52"
-			width="20"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.2"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-	</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/fare-class-picker.svelte.d.ts

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

package/dist/thumbnail/feature-split-section.svelte.d.ts

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

package/dist/thumbnail/field.svelte

@@ -1,82 +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="field thumbnail" width="100%" height="100%">
-		<!-- Label line -->
-		<rect
-			x="10"
-			y="12"
-			width="28"
-			height="5"
-			rx="2"
-			fill="var(--dry-color-stroke-weak)"
-			opacity="0.7"
-		/>
-		<!-- Input rect -->
-		<rect
-			x="10"
-			y="23"
-			width="100"
-			height="24"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<rect
-			x="17"
-			y="32"
-			width="50"
-			height="5"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.35"
-		/>
-		<!-- Helper text line -->
-		<rect
-			x="10"
-			y="53"
-			width="60"
-			height="4"
-			rx="2"
-			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/field.svelte.d.ts

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