@jis3r/icons 1.19.0 → 1.20.0

package/dist/icons/gallery-horizontal.svelte

@@ -0,0 +1,100 @@
+<script>
+	/**
+	 * @typedef {Object} Props
+	 * @property {string} [color]
+	 * @property {number} [size]
+	 * @property {number} [strokeWidth]
+	 * @property {boolean} [isHovered]
+	 * @property {string} [class]
+	 */
+
+	/** @type {Props} */
+	let {
+		color = 'currentColor',
+		size = 24,
+		strokeWidth = 2,
+		isHovered = false,
+		class: className = ''
+	} = $props();
+
+	function handleMouseEnter() {
+		if (isHovered) return;
+		isHovered = true;
+
+		setTimeout(() => {
+			isHovered = false;
+		}, 600);
+	}
+</script>
+
+<div class={className} aria-label="gallery-horizontal" role="img" onmouseenter={handleMouseEnter}>
+	<svg
+		xmlns="http://www.w3.org/2000/svg"
+		width={size}
+		height={size}
+		viewBox="0 0 24 24"
+		fill="none"
+		stroke={color}
+		stroke-width={strokeWidth}
+		stroke-linecap="round"
+		stroke-linejoin="round"
+		class="gallery-horizontal-icon"
+		class:animate={isHovered}
+	>
+		<path d="M2 3v18" class="gallery-path gallery-path-1" />
+		<rect width="12" height="18" x="6" y="3" rx="2" class="gallery-rect" />
+		<path d="M22 3v18" class="gallery-path gallery-path-2" />
+	</svg>
+</div>
+
+<style>
+	div {
+		display: inline-block;
+	}
+
+	.gallery-horizontal-icon {
+		overflow: visible;
+	}
+
+	.gallery-path {
+		opacity: 1;
+		transform: scale(1) translateX(0);
+		transform-origin: center;
+	}
+
+	.gallery-rect {
+		opacity: 1;
+		transform: scale(1);
+		transform-origin: center;
+	}
+
+	.gallery-horizontal-icon.animate .gallery-path-1 {
+		animation: slideInLeft 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0.15s;
+	}
+
+	.gallery-horizontal-icon.animate .gallery-path-2 {
+		animation: slideInRight 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0.15s;
+	}
+
+	@keyframes slideInLeft {
+		0% {
+			opacity: 0;
+			transform: scale(0.8) translateX(4px);
+		}
+		100% {
+			opacity: 1;
+			transform: scale(1) translateX(0);
+		}
+	}
+
+	@keyframes slideInRight {
+		0% {
+			opacity: 0;
+			transform: scale(0.8) translateX(-4px);
+		}
+		100% {
+			opacity: 1;
+			transform: scale(1) translateX(0);
+		}
+	}
+</style>

package/dist/icons/gallery-horizontal.svelte.d.ts

@@ -0,0 +1,19 @@
+export default GalleryHorizontal;
+type GalleryHorizontal = {
+    $on?(type: string, callback: (e: any) => void): () => void;
+    $set?(props: Partial<Props>): void;
+};
+declare const GalleryHorizontal: import("svelte").Component<{
+    color?: string;
+    size?: number;
+    strokeWidth?: number;
+    isHovered?: boolean;
+    class?: string;
+}, {}, "">;
+type Props = {
+    color?: string;
+    size?: number;
+    strokeWidth?: number;
+    isHovered?: boolean;
+    class?: string;
+};

package/dist/icons/index.js

@@ -242,6 +242,7 @@ import folderPlus from './folder-plus.svelte';
 import folderSync from './folder-sync.svelte';
 import folderUp from './folder-up.svelte';
 import frame from './frame.svelte';
+import galleryHorizontal from './gallery-horizontal.svelte';
 import galleryHorizontalEnd from './gallery-horizontal-end.svelte';
 import galleryThumbnails from './gallery-thumbnails.svelte';
 import galleryVerticalEnd from './gallery-vertical-end.svelte';
@@ -3129,6 +3130,12 @@ let ICONS_LIST = [
 		tags: ['logo', 'design', 'tool'],
 		categories: ['design', 'photography']
 	},
+	{
+		name: 'gallery-horizontal',
+		icon: galleryHorizontal,
+		tags: ['carousel', 'pictures', 'images', 'scroll', 'swipe', 'album', 'portfolio'],
+		categories: ['layout', 'design', 'development', 'photography', 'multimedia']
+	},
 	{
 		name: 'gallery-horizontal-end',
 		icon: galleryHorizontalEnd,

package/dist/index.d.ts

@@ -243,6 +243,7 @@ export { default as FolderSync } from "./icons/folder-sync.svelte";
 export { default as FolderUp } from "./icons/folder-up.svelte";
 export { default as Frame } from "./icons/frame.svelte";
 export { default as GalleryHorizontalEnd } from "./icons/gallery-horizontal-end.svelte";
+export { default as GalleryHorizontal } from "./icons/gallery-horizontal.svelte";
 export { default as GalleryThumbnails } from "./icons/gallery-thumbnails.svelte";
 export { default as GalleryVerticalEnd } from "./icons/gallery-vertical-end.svelte";
 export { default as Gauge } from "./icons/gauge.svelte";

package/dist/index.js

@@ -243,6 +243,7 @@ export { default as FolderSync } from './icons/folder-sync.svelte';
 export { default as FolderUp } from './icons/folder-up.svelte';
 export { default as Frame } from './icons/frame.svelte';
 export { default as GalleryHorizontalEnd } from './icons/gallery-horizontal-end.svelte';
+export { default as GalleryHorizontal } from './icons/gallery-horizontal.svelte';
 export { default as GalleryThumbnails } from './icons/gallery-thumbnails.svelte';
 export { default as GalleryVerticalEnd } from './icons/gallery-vertical-end.svelte';
 export { default as Gauge } from './icons/gauge.svelte';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@jis3r/icons",
-	"version": "1.19.0",
+	"version": "1.20.0",
 	"description": "beautifully crafted, moving icons. for svelte.",
 	"keywords": [
 		"svelte",