@dryui/ui 0.2.1 → 0.3.0

package/dist/thumbnail/map-list-toggle.svelte

@@ -1,140 +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="map list toggle thumbnail" width="100%" height="100%">
-		<!-- Toggle container -->
-		<rect
-			x="20"
-			y="28"
-			width="80"
-			height="24"
-			rx="6"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<!-- Active map segment -->
-		<rect
-			x="21"
-			y="29"
-			width="38"
-			height="22"
-			rx="5"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.15"
-		/>
-		<!-- Map icon (active) -->
-		<!-- Map shape: folded map -->
-		<path
-			d="M33 35 L39 33 L45 36 L45 45 L39 43 L33 45 Z"
-			fill="none"
-			stroke="var(--dry-color-fill-brand)"
-			stroke-width="1.5"
-			stroke-linejoin="round"
-		/>
-		<line
-			x1="39"
-			y1="33"
-			x2="39"
-			y2="43"
-			stroke="var(--dry-color-fill-brand)"
-			stroke-width="1"
-			stroke-dasharray="2,1"
-		/>
-		<rect
-			x="28"
-			y="35"
-			width="20"
-			height="4"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0"
-		/>
-		<!-- Map label -->
-		<rect
-			x="26"
-			y="47"
-			width="16"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.5"
-		/>
-		<!-- List icon (inactive) -->
-		<line
-			x1="66"
-			y1="36"
-			x2="80"
-			y2="36"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="1.5"
-			stroke-linecap="round"
-		/>
-		<line
-			x1="66"
-			y1="40"
-			x2="80"
-			y2="40"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="1.5"
-			stroke-linecap="round"
-		/>
-		<line
-			x1="66"
-			y1="44"
-			x2="76"
-			y2="44"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="1.5"
-			stroke-linecap="round"
-		/>
-		<!-- List label -->
-		<rect
-			x="63"
-			y="47"
-			width="16"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.4"
-		/>
-		<!-- Divider between segments -->
-		<line x1="59" y1="32" x2="59" y2="48" 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/map-list-toggle.svelte.d.ts

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

package/dist/thumbnail/map.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="map thumbnail" width="100%" height="100%">
-		<!-- Map frame -->
-		<rect
-			x="8"
-			y="8"
-			width="104"
-			height="64"
-			rx="6"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.1"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<!-- Grid lines (map texture) -->
-		<line
-			x1="8"
-			y1="35"
-			x2="112"
-			y2="35"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="0.5"
-			opacity="0.4"
-		/>
-		<line
-			x1="8"
-			y1="50"
-			x2="112"
-			y2="50"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="0.5"
-			opacity="0.4"
-		/>
-		<line
-			x1="40"
-			y1="8"
-			x2="40"
-			y2="72"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="0.5"
-			opacity="0.4"
-		/>
-		<line
-			x1="72"
-			y1="8"
-			x2="72"
-			y2="72"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="0.5"
-			opacity="0.4"
-		/>
-		<!-- Road lines -->
-		<path
-			d="M8,40 Q40,30 60,40 Q80,50 112,42"
-			fill="none"
-			stroke="var(--dry-color-text-weak)"
-			stroke-width="2.5"
-			opacity="0.3"
-			stroke-linecap="round"
-		/>
-		<!-- Map pin -->
-		<circle cx="60" cy="34" r="7" fill="var(--dry-color-fill-brand)" opacity="0.85" />
-		<circle cx="60" cy="34" r="3" fill="var(--dry-color-bg-raised)" />
-		<line
-			x1="60"
-			y1="41"
-			x2="60"
-			y2="46"
-			stroke="var(--dry-color-fill-brand)"
-			stroke-width="1.5"
-			stroke-linecap="round"
-		/>
-	</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/map.svelte.d.ts

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

package/dist/thumbnail/markdown-renderer.svelte

@@ -1,113 +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="markdown-renderer thumbnail" width="100%" height="100%">
-		<!-- H1 heading (bold wide bar) -->
-		<rect
-			x="10"
-			y="8"
-			width="68"
-			height="7"
-			rx="2.5"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.8"
-		/>
-		<!-- Paragraph lines -->
-		<rect
-			x="10"
-			y="22"
-			width="96"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.45"
-		/>
-		<rect
-			x="10"
-			y="30"
-			width="80"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.4"
-		/>
-		<!-- Bullet list items -->
-		<circle cx="16" cy="42" r="2.5" fill="var(--dry-color-text-weak)" opacity="0.5" />
-		<rect
-			x="22"
-			y="39"
-			width="64"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.45"
-		/>
-		<circle cx="16" cy="52" r="2.5" fill="var(--dry-color-text-weak)" opacity="0.5" />
-		<rect
-			x="22"
-			y="49"
-			width="50"
-			height="4"
-			rx="2"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.38"
-		/>
-		<!-- Code inline hint -->
-		<rect
-			x="10"
-			y="62"
-			width="36"
-			height="8"
-			rx="3"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.15"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-		<rect
-			x="14"
-			y="65"
-			width="24"
-			height="3"
-			rx="1.5"
-			fill="var(--dry-color-fill-brand)"
-			opacity="0.6"
-		/>
-	</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/markdown-renderer.svelte.d.ts

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

package/dist/thumbnail/marquee.svelte

@@ -1,114 +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="marquee thumbnail" width="100%" height="100%">
-		<!-- Track -->
-		<rect
-			x="8"
-			y="28"
-			width="104"
-			height="24"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1.5"
-		/>
-		<!-- Fade edges -->
-		<rect
-			x="8"
-			y="28"
-			width="18"
-			height="24"
-			rx="4"
-			fill="var(--dry-color-bg-raised)"
-			opacity="0.7"
-		/>
-		<rect
-			x="94"
-			y="28"
-			width="18"
-			height="24"
-			rx="4 4 4 4"
-			fill="var(--dry-color-bg-raised)"
-			opacity="0.7"
-		/>
-		<!-- Items inside -->
-		<rect
-			x="18"
-			y="34"
-			width="26"
-			height="12"
-			rx="3"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.2"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-		<rect
-			x="50"
-			y="34"
-			width="22"
-			height="12"
-			rx="3"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.2"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-		<rect
-			x="78"
-			y="34"
-			width="26"
-			height="12"
-			rx="3"
-			fill="var(--dry-color-text-weak)"
-			opacity="0.2"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-		<!-- Motion arrow -->
-		<polyline
-			points="100,36 106,40 100,44"
-			fill="none"
-			stroke="var(--dry-color-fill-brand)"
-			stroke-width="1.5"
-			stroke-linecap="round"
-		/>
-	</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/marquee.svelte.d.ts

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

package/dist/thumbnail/mask-reveal.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="MaskReveal thumbnail" width="100%" height="100%">
-		<rect
-			x="5"
-			y="5"
-			width="110"
-			height="70"
-			rx="8"
-			fill="var(--dry-color-bg-raised)"
-			stroke="var(--dry-color-stroke-weak)"
-			stroke-width="1"
-		/>
-		<text x="60" y="44" text-anchor="middle" font-size="10" fill="var(--dry-color-text-weak)">
-			MaskReveal
-		</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/mask-reveal.svelte.d.ts

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