@jis3r/icons 1.9.0 → 1.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,72 @@
1
+ <script>
2
+ /**
3
+ * @typedef {Object} Props
4
+ * @property {string} [color]
5
+ * @property {number} [size]
6
+ * @property {number} [strokeWidth]
7
+ * @property {boolean} [isHovered]
8
+ * @property {string} [class]
9
+ */
10
+
11
+ /** @type {Props} */
12
+ let {
13
+ color = 'currentColor',
14
+ size = 28,
15
+ strokeWidth = 2,
16
+ isHovered = false,
17
+ class: className = ''
18
+ } = $props();
19
+
20
+ function handleMouseEnter() {
21
+ isHovered = true;
22
+ }
23
+
24
+ function handleMouseLeave() {
25
+ isHovered = false;
26
+ }
27
+ </script>
28
+
29
+ <div
30
+ class={className}
31
+ aria-label="bold"
32
+ role="img"
33
+ onmouseenter={handleMouseEnter}
34
+ onmouseleave={handleMouseLeave}
35
+ >
36
+ <svg
37
+ xmlns="http://www.w3.org/2000/svg"
38
+ width={size}
39
+ height={size}
40
+ viewBox="0 0 24 24"
41
+ fill="none"
42
+ stroke={color}
43
+ stroke-width={strokeWidth}
44
+ stroke-linecap="round"
45
+ stroke-linejoin="round"
46
+ class="bold-icon"
47
+ class:animate={isHovered}
48
+ >
49
+ <path
50
+ d="M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8"
51
+ class="bold-path"
52
+ />
53
+ </svg>
54
+ </div>
55
+
56
+ <style>
57
+ div {
58
+ display: inline-block;
59
+ }
60
+ .bold-icon {
61
+ overflow: visible;
62
+ }
63
+
64
+ .bold-path {
65
+ stroke-width: 2;
66
+ transition: stroke-width 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
67
+ }
68
+
69
+ .bold-icon.animate .bold-path {
70
+ stroke-width: 3.5;
71
+ }
72
+ </style>
@@ -0,0 +1,19 @@
1
+ export default Bold;
2
+ type Bold = {
3
+ $on?(type: string, callback: (e: any) => void): () => void;
4
+ $set?(props: Partial<Props>): void;
5
+ };
6
+ declare const Bold: import("svelte").Component<{
7
+ color?: string;
8
+ size?: number;
9
+ strokeWidth?: number;
10
+ isHovered?: boolean;
11
+ class?: string;
12
+ }, {}, "">;
13
+ type Props = {
14
+ color?: string;
15
+ size?: number;
16
+ strokeWidth?: number;
17
+ isHovered?: boolean;
18
+ class?: string;
19
+ };
@@ -0,0 +1,99 @@
1
+ <script>
2
+ /**
3
+ * @typedef {Object} Props
4
+ * @property {string} [color]
5
+ * @property {number} [size]
6
+ * @property {number} [strokeWidth]
7
+ * @property {boolean} [isHovered]
8
+ * @property {string} [class]
9
+ */
10
+
11
+ /** @type {Props} */
12
+ let {
13
+ color = 'currentColor',
14
+ size = 24,
15
+ strokeWidth = 2,
16
+ isHovered = false,
17
+ class: className = ''
18
+ } = $props();
19
+
20
+ function handleMouseEnter() {
21
+ isHovered = true;
22
+ }
23
+
24
+ function handleMouseLeave() {
25
+ isHovered = false;
26
+ }
27
+ </script>
28
+
29
+ <div
30
+ class={className}
31
+ aria-label="images"
32
+ role="img"
33
+ onmouseenter={handleMouseEnter}
34
+ onmouseleave={handleMouseLeave}
35
+ >
36
+ <svg
37
+ xmlns="http://www.w3.org/2000/svg"
38
+ width={size}
39
+ height={size}
40
+ viewBox="0 0 24 24"
41
+ fill="none"
42
+ stroke={color}
43
+ stroke-width={strokeWidth}
44
+ stroke-linecap="round"
45
+ stroke-linejoin="round"
46
+ >
47
+ <path
48
+ d="m22 11-1.296-1.296a2.4 2.4 0 0 0-3.408 0L11 16"
49
+ class="images-path-1"
50
+ class:animate={isHovered}
51
+ />
52
+ <path
53
+ d="M4 8a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2"
54
+ class="images-path-2"
55
+ class:animate={isHovered}
56
+ />
57
+ <circle
58
+ cx="13"
59
+ cy="7"
60
+ r="1"
61
+ fill="currentColor"
62
+ class="images-circle"
63
+ class:animate={isHovered}
64
+ />
65
+ <rect x="8" y="2" width="14" height="14" rx="2" class="images-rect" class:animate={isHovered} />
66
+ </svg>
67
+ </div>
68
+
69
+ <style>
70
+ div {
71
+ display: inline-block;
72
+ }
73
+ .images-path-1,
74
+ .images-path-2,
75
+ .images-circle,
76
+ .images-rect {
77
+ transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
78
+ }
79
+
80
+ .images-path-1.animate {
81
+ transform: translate(-3px, 3px);
82
+ }
83
+
84
+ .images-path-2.animate {
85
+ transform: translate(3px, -3px);
86
+ }
87
+
88
+ .images-circle.animate {
89
+ transform: translate(-3px, 3px);
90
+ }
91
+
92
+ .images-rect.animate {
93
+ transform: translate(-3px, 3px);
94
+ }
95
+
96
+ svg {
97
+ overflow: visible;
98
+ }
99
+ </style>
@@ -0,0 +1,19 @@
1
+ export default Images;
2
+ type Images = {
3
+ $on?(type: string, callback: (e: any) => void): () => void;
4
+ $set?(props: Partial<Props>): void;
5
+ };
6
+ declare const Images: import("svelte").Component<{
7
+ color?: string;
8
+ size?: number;
9
+ strokeWidth?: number;
10
+ isHovered?: boolean;
11
+ class?: string;
12
+ }, {}, "">;
13
+ type Props = {
14
+ color?: string;
15
+ size?: number;
16
+ strokeWidth?: number;
17
+ isHovered?: boolean;
18
+ class?: string;
19
+ };
@@ -56,6 +56,7 @@ import betweenVerticalStart from './between-vertical-start.svelte';
56
56
  import blend from './blend.svelte';
57
57
  import blocks from './blocks.svelte';
58
58
  import bluetoothOff from './bluetooth-off.svelte';
59
+ import bold from './bold.svelte';
59
60
  import bolt from './bolt.svelte';
60
61
  import bone from './bone.svelte';
61
62
  import book from './book.svelte';
@@ -258,6 +259,7 @@ import house from './house.svelte';
258
259
  import houseWifi from './house-wifi.svelte';
259
260
  import imageDown from './image-down.svelte';
260
261
  import imageOff from './image-off.svelte';
262
+ import images from './images.svelte';
261
263
  import imageUp from './image-up.svelte';
262
264
  import infinity from './infinity.svelte';
263
265
  import kanban from './kanban.svelte';
@@ -1149,6 +1151,12 @@ let ICONS_LIST = [
1149
1151
  tags: ['lost'],
1150
1152
  categories: ['connectivity', 'devices']
1151
1153
  },
1154
+ {
1155
+ name: 'bold',
1156
+ icon: bold,
1157
+ tags: ['text', 'strong', 'format'],
1158
+ categories: ['text']
1159
+ },
1152
1160
  {
1153
1161
  name: 'bolt',
1154
1162
  icon: bolt,
@@ -3258,6 +3266,22 @@ let ICONS_LIST = [
3258
3266
  tags: ['picture', 'photo', 'upload', 'import'],
3259
3267
  categories: ['photography', 'text', 'multimedia', 'files']
3260
3268
  },
3269
+ {
3270
+ name: 'images',
3271
+ icon: images,
3272
+ tags: [
3273
+ 'picture',
3274
+ 'photo',
3275
+ 'multiple',
3276
+ 'copy',
3277
+ 'gallery',
3278
+ 'album',
3279
+ 'collection',
3280
+ 'slideshow',
3281
+ 'showcase'
3282
+ ],
3283
+ categories: ['photography', 'text', 'multimedia', 'files']
3284
+ },
3261
3285
  {
3262
3286
  name: 'infinity',
3263
3287
  icon: infinity,
package/dist/index.d.ts CHANGED
@@ -56,6 +56,7 @@ export { default as BetweenVerticalStart } from "./icons/between-vertical-start.
56
56
  export { default as Blend } from "./icons/blend.svelte";
57
57
  export { default as Blocks } from "./icons/blocks.svelte";
58
58
  export { default as BluetoothOff } from "./icons/bluetooth-off.svelte";
59
+ export { default as Bold } from "./icons/bold.svelte";
59
60
  export { default as Bolt } from "./icons/bolt.svelte";
60
61
  export { default as Bone } from "./icons/bone.svelte";
61
62
  export { default as BookA } from "./icons/book-a.svelte";
@@ -259,6 +260,7 @@ export { default as House } from "./icons/house.svelte";
259
260
  export { default as ImageDown } from "./icons/image-down.svelte";
260
261
  export { default as ImageOff } from "./icons/image-off.svelte";
261
262
  export { default as ImageUp } from "./icons/image-up.svelte";
263
+ export { default as Images } from "./icons/images.svelte";
262
264
  export { default as Infinity } from "./icons/infinity.svelte";
263
265
  export { default as Kanban } from "./icons/kanban.svelte";
264
266
  export { default as KeyRound } from "./icons/key-round.svelte";
package/dist/index.js CHANGED
@@ -56,6 +56,7 @@ export { default as BetweenVerticalStart } from './icons/between-vertical-start.
56
56
  export { default as Blend } from './icons/blend.svelte';
57
57
  export { default as Blocks } from './icons/blocks.svelte';
58
58
  export { default as BluetoothOff } from './icons/bluetooth-off.svelte';
59
+ export { default as Bold } from './icons/bold.svelte';
59
60
  export { default as Bolt } from './icons/bolt.svelte';
60
61
  export { default as Bone } from './icons/bone.svelte';
61
62
  export { default as BookA } from './icons/book-a.svelte';
@@ -259,6 +260,7 @@ export { default as House } from './icons/house.svelte';
259
260
  export { default as ImageDown } from './icons/image-down.svelte';
260
261
  export { default as ImageOff } from './icons/image-off.svelte';
261
262
  export { default as ImageUp } from './icons/image-up.svelte';
263
+ export { default as Images } from './icons/images.svelte';
262
264
  export { default as Infinity } from './icons/infinity.svelte';
263
265
  export { default as Kanban } from './icons/kanban.svelte';
264
266
  export { default as KeyRound } from './icons/key-round.svelte';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jis3r/icons",
3
- "version": "1.9.0",
3
+ "version": "1.11.0",
4
4
  "description": "beautifully crafted, moving icons. for svelte.",
5
5
  "keywords": [
6
6
  "svelte",
@@ -86,4 +86,4 @@
86
86
  "overrides": {
87
87
  "cookie": "0.7.0"
88
88
  }
89
- }
89
+ }