ui-svelte 0.2.11 → 0.2.13

package/dist/form/css/select.css

@@ -1,7 +1,7 @@
 @layer components {
 	.select-popover {
-		@apply max-h-56 flex flex-col gap-2 p-2 my-1 overflow-hidden;
-		@apply bg-background text-on-background rounded-ui;
+		@apply max-h-56 flex flex-col gap-2 p-2 my-1 overflow-hidden w-full;
+		@apply bg-background text-on-background rounded-box;
 		@apply invisible opacity-0 transition-opacity duration-300 ease-in-out;
 		@apply shadow shadow-muted;
 		position: fixed;

package/dist/form/css/slider.css

@@ -1,6 +1,7 @@
 @layer components {
 	.slider-wrapper {
 		@apply flex flex-col gap-0.5 w-full;
+		@apply transition-all duration-300;
 	}
 	.slider-info {
 		@apply flex justify-between items-center text-sm font-medium leading-none;
@@ -49,6 +50,42 @@
 				@apply bg-on-muted;
 			}
 		}
+		&.is-success {
+			--slider-color: var(--color-success);
+			&::-webkit-slider-thumb {
+				@apply bg-success;
+			}
+			&::-moz-range-thumb {
+				@apply bg-success;
+			}
+		}
+		&.is-info {
+			--slider-color: var(--color-info);
+			&::-webkit-slider-thumb {
+				@apply bg-info;
+			}
+			&::-moz-range-thumb {
+				@apply bg-info;
+			}
+		}
+		&.is-warning {
+			--slider-color: var(--color-warning);
+			&::-webkit-slider-thumb {
+				@apply bg-warning;
+			}
+			&::-moz-range-thumb {
+				@apply bg-warning;
+			}
+		}
+		&.is-danger {
+			--slider-color: var(--color-danger);
+			&::-webkit-slider-thumb {
+				@apply bg-danger;
+			}
+			&::-moz-range-thumb {
+				@apply bg-danger;
+			}
+		}
 		&.is-sm {
 			@apply h-1 my-1;
 			&::-webkit-slider-thumb {

package/dist/form/css/textarea.css

@@ -7,124 +7,227 @@
 	.textarea-control-label {
 		@apply absolute left-3 top-3;
 		@apply transition-all duration-300;
-	}
 
-	.textarea-control-label.is-active {
-		@apply text-xs left-3 top-1 translate-y-px!;
+		&.is-active {
+			@apply text-xs left-3 top-1 translate-y-px!;
+		}
 	}
 
-	.textarea-control.is-sm {
-		@apply text-sm py-2;
-	}
+	.textarea-control {
+		&.is-sm {
+			@apply text-sm py-2;
+		}
 
-	.textarea-control.is-md {
-		@apply text-base py-2.5;
-	}
+		&.is-md {
+			@apply text-base py-2.5;
+		}
 
-	.textarea-control.is-lg {
-		@apply text-xl py-3;
+		&.is-lg {
+			@apply text-xl py-3;
 
-		.textarea-control-label.is-active {
-			@apply text-sm;
+			.textarea-control-label.is-active {
+				@apply text-sm;
+			}
 		}
-	}
 
-	.textarea-control.is-float.is-sm {
-		@apply pt-5 pb-2;
-	}
+		&.is-float {
+			&.is-sm {
+				@apply pt-5 pb-2;
+			}
 
-	.textarea-control.is-float.is-md {
-		@apply pt-6 pb-2.5;
-	}
+			&.is-md {
+				@apply pt-6 pb-2.5;
+			}
 
-	.textarea-control.is-float.is-lg {
-		@apply pt-7 pb-3;
+			&.is-lg {
+				@apply pt-7 pb-3;
+			}
+		}
 	}
 
-	.textarea-control.is-primary {
-		@apply bg-on-primary text-primary rounded-ui;
-	}
+	.textarea-control.is-soft {
+		@apply rounded-ui;
 
-	.textarea-control.is-solid.is-primary {
-		@apply bg-primary text-on-primary;
-	}
+		&.is-primary {
+			@apply bg-soft-primary text-primary;
+			&.is-active {
+				@apply bg-soft-primary/90;
+			}
+		}
 
-	.textarea-control.is-primary.is-active {
-		@apply bg-on-primary/90;
-	}
+		&.is-secondary {
+			@apply bg-soft-secondary text-secondary;
+			&.is-active {
+				@apply bg-soft-secondary/90;
+			}
+		}
 
-	.textarea-control.is-solid.is-primary.is-active {
-		@apply bg-primary/90;
-	}
+		&.is-muted {
+			@apply bg-soft-muted text-on-muted;
+			&.is-active {
+				@apply bg-soft-muted/90;
+			}
+		}
 
-	.textarea-control.is-secondary {
-		@apply bg-on-secondary text-secondary rounded-ui;
-	}
+		&.is-success {
+			@apply bg-soft-success text-success;
+			&.is-active {
+				@apply bg-soft-success/90;
+			}
+		}
 
-	.textarea-control.is-solid.is-secondary {
-		@apply bg-secondary text-on-secondary;
-	}
+		&.is-info {
+			@apply bg-soft-info text-info;
+			&.is-active {
+				@apply bg-soft-info/90;
+			}
+		}
 
-	.textarea-control.is-secondary.is-active {
-		@apply bg-on-secondary/90;
-	}
+		&.is-danger {
+			@apply bg-soft-danger text-danger;
+			&.is-active {
+				@apply bg-soft-danger/90;
+			}
+		}
 
-	.textarea-control.is-solid.is-secondary.is-active {
-		@apply bg-secondary/90;
+		&.is-warning {
+			@apply bg-soft-warning text-warning;
+			&.is-active {
+				@apply bg-soft-warning/90;
+			}
+		}
 	}
 
-	.textarea-control.is-muted {
-		@apply bg-muted text-on-muted rounded-ui;
-	}
+	.textarea-control.is-solid {
+		@apply rounded-ui;
 
-	.textarea-control.is-solid.is-muted {
-		@apply bg-on-muted text-muted;
-	}
+		&.is-primary {
+			@apply bg-primary text-on-primary;
+			&.is-active {
+				@apply bg-primary/90;
+			}
+		}
 
-	.textarea-control.is-muted.is-active {
-		@apply bg-muted/90;
-	}
+		&.is-secondary {
+			@apply bg-secondary text-on-secondary;
+			&.is-active {
+				@apply bg-secondary/90;
+			}
+		}
+
+		&.is-muted {
+			@apply bg-on-muted text-muted;
+			&.is-active {
+				@apply bg-on-muted/90;
+			}
+		}
+
+		&.is-success {
+			@apply bg-success text-on-success;
+			&.is-active {
+				@apply bg-success/90;
+			}
+		}
 
-	.textarea-control.is-solid.is-muted.is-active {
-		@apply bg-on-muted/90;
+		&.is-info {
+			@apply bg-info text-on-info;
+			&.is-active {
+				@apply bg-info/90;
+			}
+		}
+
+		&.is-danger {
+			@apply bg-danger text-on-danger;
+			&.is-active {
+				@apply bg-danger/90;
+			}
+		}
+
+		&.is-warning {
+			@apply bg-warning text-on-warning;
+			&.is-active {
+				@apply bg-warning/90;
+			}
+		}
 	}
 
 	.textarea-control.is-outlined {
-		@apply inset-ring-2 inset-ring-muted rounded-ui;
-	}
+		@apply rounded-ui inset-ring;
+
+		&.is-active {
+			@apply inset-ring-2;
+		}
 
-	.textarea-control.is-outlined.is-active {
-		@apply inset-ring-2 inset-ring-primary;
+		&.is-primary {
+			@apply inset-ring-primary;
+		}
+		&.is-secondary {
+			@apply inset-ring-secondary;
+		}
+		&.is-muted {
+			@apply inset-ring-muted;
+		}
+		&.is-success {
+			@apply inset-ring-success;
+		}
+		&.is-info {
+			@apply inset-ring-info;
+		}
+		&.is-danger {
+			@apply inset-ring-danger;
+		}
+		&.is-warning {
+			@apply inset-ring-warning;
+		}
 	}
 
 	.textarea-control.is-line {
-		@apply box-border border-b-2 border-muted text-on-muted px-0;
+		@apply box-border border-b px-0;
 
 		.textarea-control-label {
 			@apply left-0!;
 		}
-	}
 
-	.textarea-control.is-line.is-active {
-		@apply border-primary;
+		&.is-active {
+			@apply border-b-2;
+		}
+
+		&.is-primary {
+			@apply border-primary text-primary;
+		}
+		&.is-secondary {
+			@apply border-secondary text-secondary;
+		}
+		&.is-muted {
+			@apply border-on-muted text-on-muted;
+		}
+		&.is-success {
+			@apply border-success text-success;
+		}
+		&.is-info {
+			@apply border-info text-info;
+		}
+		&.is-danger {
+			@apply border-danger text-danger;
+		}
+		&.is-warning {
+			@apply border-warning text-warning;
+		}
 	}
 
 	.textarea-control-input {
 		@apply appearance-none flex-1 w-full border-none outline-none;
-		@apply placeholder:transition-opacity placeholder:duration-200;
+		@apply placeholder:transition-opacity placeholder:duration-300;
 		@apply bg-transparent;
 		@apply min-h-12;
-	}
-
-	.textarea-control-input.invisible {
-		@apply opacity-0;
-	}
-
-	.textarea-control-input {
 		resize: none;
-	}
 
-	.textarea-control-input.is-resizable {
-		resize: both;
+		&.invisible {
+			@apply opacity-0;
+		}
+
+		&.is-resizable {
+			resize: both;
+		}
 	}
 }

package/dist/form/css/toggle.css

@@ -4,11 +4,11 @@
 
 		.toggle-input {
 			@apply relative appearance-none w-10 h-6 rounded-full;
-			@apply bg-muted transition-colors duration-200 ease-in-out;
+			@apply bg-muted transition-colors duration-300 ease-in-out;
 			@apply focus:outline-none;
 			@apply before:content-[''] before:absolute before:h-4 before:w-4 before:left-1 before:top-1;
 			@apply before:bg-white before:rounded-full before:shadow;
-			@apply before:transition-transform before:duration-200 before:ease-in-out;
+			@apply before:transition-transform before:duration-300 before:ease-in-out;
 			@apply checked:before:translate-x-4;
 		}
 
@@ -22,11 +22,23 @@
 			&.is-muted {
 				@apply bg-on-muted;
 			}
+			&.is-success {
+				@apply bg-success;
+			}
+			&.is-info {
+				@apply bg-info;
+			}
+			&.is-danger {
+				@apply bg-danger;
+			}
+			&.is-warning {
+				@apply bg-warning;
+			}
 		}
 
 		.toggle-label-left,
 		.toggle-label-right {
-			@apply text-muted transition-colors duration-200;
+			@apply text-muted transition-colors duration-300;
 
 			&.is-active {
 				@apply text-on-muted;

package/dist/hooks/use-chat.svelte.js

@@ -35,7 +35,7 @@ export const useChat = (config) => {
             const loadedMessages = config.transformMessage
                 ? data.messages.map(config.transformMessage)
                 : data.messages;
-            messages = loadedMessages.reverse(); // Asumiendo que vienen del más reciente al más antiguo
+            messages = loadedMessages.reverse();
             hasMore = data.hasMore ?? false;
             if (messages.length > 0) {
                 oldestMessageId = messages[0].id;

package/dist/hooks/use-form.svelte.js

@@ -36,7 +36,7 @@ export const useForm = (config) => {
                     toast.show({
                         title: config.errorTitle || 'Error',
                         description: config.errorDescription || 'An error occurred while submitting the form.',
-                        status: 'danger',
+                        color: 'danger',
                         duration: 3000
                     });
                 }
@@ -48,7 +48,7 @@ export const useForm = (config) => {
                 toast.show({
                     title: config.successTitle || 'Success',
                     description: config.successDescription || 'Form submitted successfully.',
-                    status: 'success',
+                    color: 'success',
                     duration: 3000
                 });
             }
@@ -63,7 +63,7 @@ export const useForm = (config) => {
                 toast.show({
                     title: config.errorTitle || 'Error',
                     description: config.errorDescription || 'An error occurred while submitting the form.',
-                    status: 'danger',
+                    color: 'danger',
                     duration: 3000
                 });
             }

package/dist/hooks/use-search.svelte.js

@@ -45,7 +45,6 @@ export const useSearch = (config) => {
                     (option.description && option.description.toLowerCase().includes(lowerSearch)));
             });
         }
-        // Client-side pagination
         if (enablePagination) {
             const start = 0;
             const end = (currentPage + 1) * pageSize;
@@ -96,7 +95,6 @@ export const useSearch = (config) => {
             else {
                 options = searchResponse.options;
             }
-            // Determinar si hay más resultados
             if (searchResponse.hasMore !== undefined) {
                 hasMore = searchResponse.hasMore;
             }
@@ -105,7 +103,6 @@ export const useSearch = (config) => {
                 hasMore = options.length < searchResponse.total;
             }
             else {
-                // Si no hay info de total, asumimos que hay más si recibimos pageSize resultados
                 hasMore = searchResponse.options.length >= pageSize;
             }
             config.onSuccess?.(searchResponse);

package/dist/hooks/use-table.svelte.d.ts

@@ -10,6 +10,7 @@ interface Column {
 export interface TableState {
     data: any[];
     isLoading: boolean;
+    hasInitialized: boolean;
     error: any;
     sortBy?: string;
     sortOrder: 'ASC' | 'DESC';

package/dist/hooks/use-table.svelte.js

@@ -9,6 +9,7 @@ export const useTable = (config) => {
     let sortOrder = $state(config.initialSortOrder ?? 'ASC');
     let search = $state(config.initialSearch ?? '');
     let isLoading = $state(false);
+    let hasInitialized = $state(false);
     let error = $state(null);
     const selectable = config.selectable ?? false;
     const rowKey = config.rowKey ?? 'id';
@@ -82,6 +83,7 @@ export const useTable = (config) => {
         const startIndex = (page - 1) * pageSize;
         const endIndex = startIndex + pageSize;
         data = processedData.slice(startIndex, endIndex);
+        hasInitialized = true;
     };
     const fetchData = async () => {
         if (isManualMode) {
@@ -125,6 +127,7 @@ export const useTable = (config) => {
         catch (err) {
             error = err;
             config.onError?.(err);
+            hasInitialized = true;
         }
         finally {
             isLoading = false;
@@ -307,6 +310,9 @@ export const useTable = (config) => {
         get isLoading() {
             return isLoading;
         },
+        get hasInitialized() {
+            return hasInitialized;
+        },
         get error() {
             return error;
         },

package/dist/icons/index.d.ts

@@ -1,3 +1,7 @@
+export declare const Add24RegularIcon: {
+    body: string;
+    viewbox: string;
+};
 export declare const ArrowDown24RegularIcon: {
     body: string;
     viewbox: string;
@@ -90,7 +94,7 @@ export declare const SpeakerMute24RegularIcon: {
     body: string;
     viewbox: string;
 };
-export declare const Pause24RegularIcon: {
+export declare const PauseFilledIcon: {
     body: string;
     viewbox: string;
 };
@@ -98,7 +102,7 @@ export declare const PictureInPicture24RegularIcon: {
     body: string;
     viewbox: string;
 };
-export declare const Play24RegularIcon: {
+export declare const PlayFilledIcon: {
     body: string;
     viewbox: string;
 };
@@ -138,3 +142,31 @@ export declare const EyeOffRegularIcon: {
     body: string;
     viewbox: string;
 };
+export declare const ArrowLeftRegularIcon: {
+    body: string;
+    viewbox: string;
+};
+export declare const ArrowRightRegularIcon: {
+    body: string;
+    viewbox: string;
+};
+export declare const ArrowDownloadRegularIcon: {
+    body: string;
+    viewbox: string;
+};
+export declare const ArrowUploadRegularIcon: {
+    body: string;
+    viewbox: string;
+};
+export declare const ImageAddRegularIcon: {
+    body: string;
+    viewbox: string;
+};
+export declare const ArrowResetRegularIcon: {
+    body: string;
+    viewbox: string;
+};
+export declare const CropRegularIcon: {
+    body: string;
+    viewbox: string;
+};

package/dist/icons/index.js

@@ -1,3 +1,7 @@
+export const Add24RegularIcon = {
+    body: '<path fill="currentColor" d="M11.75 3a.75.75 0 0 1 .75.75v7.5h7.5a.75.75 0 0 1 0 1.5h-7.5v7.5a.75.75 0 0 1-1.5 0v-7.5h-7.5a.75.75 0 0 1 0-1.5h7.5v-7.5a.75.75 0 0 1 .75-.75"/>',
+    viewbox: '0 0 24 24'
+};
 export const ArrowDown24RegularIcon = {
     body: '<path fill="currentColor" d="M19.79 13.267a.75.75 0 0 0-1.086-1.034l-5.954 6.251V3.75a.75.75 0 1 0-1.5 0v14.734l-5.955-6.251a.75.75 0 1 0-1.086 1.034l7.067 7.42c.16.168.366.268.58.3a.8.8 0 0 0 .29-.001a1 1 0 0 0 .578-.3z"/>',
     viewbox: '0 0 24 24'
@@ -90,16 +94,16 @@ export const SpeakerMute24RegularIcon = {
     body: '<path fill="currentColor" d="M12.92 3.315C13.726 2.6 15 3.171 15 4.25v15.495c0 1.079-1.274 1.651-2.08.934l-4.492-3.993a.75.75 0 0 0-.498-.19H4.25A2.25 2.25 0 0 1 2 14.246V9.748a2.25 2.25 0 0 1 2.25-2.25h3.68a.75.75 0 0 0 .498-.19zm.58 1.491L9.425 8.43a2.25 2.25 0 0 1-1.495.568H4.25a.75.75 0 0 0-.75.75v4.498c0 .414.336.75.75.75h3.68a2.25 2.25 0 0 1 1.495.569l4.075 3.623zm2.72 4.413a.75.75 0 0 1 1.06 0L19 10.94l1.72-1.72a.75.75 0 1 1 1.06 1.06L20.06 12l1.72 1.72a.75.75 0 0 1-1.06 1.06L19 13.06l-1.72 1.72a.75.75 0 1 1-1.06-1.06L17.94 12l-1.72-1.72a.75.75 0 0 1 0-1.06"/>',
     viewbox: '0 0 24 24'
 };
-export const Pause24RegularIcon = {
-    body: '<path fill="currentColor" d="M6.25 3A2.25 2.25 0 0 0 4 5.25v13.5A2.25 2.25 0 0 0 6.25 21h2.5A2.25 2.25 0 0 0 11 18.75V5.25A2.25 2.25 0 0 0 8.75 3zM5.5 5.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75h-2.5a.75.75 0 0 1-.75-.75zM15.25 3A2.25 2.25 0 0 0 13 5.25v13.5A2.25 2.25 0 0 0 15.25 21h2.5A2.25 2.25 0 0 0 20 18.75V5.25A2.25 2.25 0 0 0 17.75 3zm-.75 2.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75h-2.5a.75.75 0 0 1-.75-.75z"/>',
+export const PauseFilledIcon = {
+    body: '<path fill="currentColor" d="M5.746 3a1.75 1.75 0 0 0-1.75 1.75v14.5c0 .966.784 1.75 1.75 1.75h3.5a1.75 1.75 0 0 0 1.75-1.75V4.75A1.75 1.75 0 0 0 9.246 3zm9 0a1.75 1.75 0 0 0-1.75 1.75v14.5c0 .966.784 1.75 1.75 1.75h3.5a1.75 1.75 0 0 0 1.75-1.75V4.75A1.75 1.75 0 0 0 18.246 3z"/>',
     viewbox: '0 0 24 24'
 };
 export const PictureInPicture24RegularIcon = {
     body: '<path fill="currentColor" d="M2 6.25A3.25 3.25 0 0 1 5.25 3h13.5A3.25 3.25 0 0 1 22 6.25V12h-1.5V6.25a1.75 1.75 0 0 0-1.75-1.75H5.25A1.75 1.75 0 0 0 3.5 6.25v9.5c0 .966.784 1.75 1.75 1.75H11V19H5.25A3.25 3.25 0 0 1 2 15.75zM14 13a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2v-5a2 2 0 0 0-2-2z"/>',
     viewbox: '0 0 24 24'
 };
-export const Play24RegularIcon = {
-    body: '<path fill="currentColor" d="M7.608 4.615a.75.75 0 0 0-1.108.659v13.452a.75.75 0 0 0 1.108.659l12.362-6.726a.75.75 0 0 0 0-1.318zM5 5.274c0-1.707 1.826-2.792 3.325-1.977l12.362 6.727c1.566.852 1.566 3.1 0 3.952L8.325 20.702C6.826 21.518 5 20.432 5 18.726z"/>',
+export const PlayFilledIcon = {
+    body: '<path fill="currentColor" d="M5 5.274c0-1.707 1.826-2.792 3.325-1.977l12.362 6.727c1.566.852 1.566 3.1 0 3.952L8.325 20.702C6.826 21.518 5 20.432 5 18.726z"/>',
     viewbox: '0 0 24 24'
 };
 export const Record24RegularIcon = {
@@ -138,3 +142,31 @@ export const EyeOffRegularIcon = {
     body: '<path fill="currentColor" d="M2.22 2.22a.75.75 0 0 0-.073.976l.073.084l4.034 4.035a10 10 0 0 0-3.955 5.75a.75.75 0 0 0 1.455.364a8.5 8.5 0 0 1 3.58-5.034l1.81 1.81A4 4 0 0 0 14.8 15.86l5.919 5.92a.75.75 0 0 0 1.133-.977l-.073-.084l-6.113-6.114l.001-.002l-1.2-1.198l-2.87-2.87h.002l-2.88-2.877l.001-.002l-1.133-1.13L3.28 2.22a.75.75 0 0 0-1.06 0m7.984 9.045l3.535 3.536a2.5 2.5 0 0 1-3.535-3.535M12 5.5c-1 0-1.97.148-2.889.425l1.237 1.236a8.503 8.503 0 0 1 9.899 6.272a.75.75 0 0 0 1.455-.363A10 10 0 0 0 12 5.5m.195 3.51l3.801 3.8a4.003 4.003 0 0 0-3.801-3.8"/>',
     viewbox: '0 0 24 24'
 };
+export const ArrowLeftRegularIcon = {
+    body: '<path fill="currentColor" d="M10.733 19.79a.75.75 0 0 0 1.034-1.086L5.516 12.75H20.25a.75.75 0 0 0 0-1.5H5.516l6.251-5.955a.75.75 0 0 0-1.034-1.086l-7.42 7.067a1 1 0 0 0-.3.58a.8.8 0 0 0 .001.289a1 1 0 0 0 .3.579z"/>',
+    viewbox: '0 0 24 24'
+};
+export const ArrowRightRegularIcon = {
+    body: '<path fill="currentColor" d="M13.267 4.209a.75.75 0 0 0-1.034 1.086l6.251 5.955H3.75a.75.75 0 0 0 0 1.5h14.734l-6.251 5.954a.75.75 0 0 0 1.034 1.087l7.42-7.067a1 1 0 0 0 .3-.58a.8.8 0 0 0-.001-.29a1 1 0 0 0-.3-.578z"/>',
+    viewbox: '0 0 24 24'
+};
+export const ArrowDownloadRegularIcon = {
+    body: '<path fill="currentColor" d="M18.25 20.5a.75.75 0 1 1 0 1.5l-13 .005a.75.75 0 1 1 0-1.5zM11.648 2.014l.102-.007a.75.75 0 0 1 .743.648l.007.102l-.001 13.685l3.722-3.72a.75.75 0 0 1 .976-.073l.085.073a.75.75 0 0 1 .072.976l-.073.084l-4.997 4.997a.75.75 0 0 1-.976.073l-.085-.073l-5.003-4.996a.75.75 0 0 1 .976-1.134l.084.072l3.719 3.714L11 2.756a.75.75 0 0 1 .648-.743l.102-.007z"/>',
+    viewbox: '0 0 24 24'
+};
+export const ArrowUploadRegularIcon = {
+    body: '<path fill="currentColor" d="M18.25 3.51a.75.75 0 1 0 0-1.5l-13-.004a.75.75 0 1 0 0 1.5zm-6.602 18.488l.102.007a.75.75 0 0 0 .743-.649l.007-.101l-.001-13.685l3.722 3.72a.75.75 0 0 0 .976.073l.085-.073a.75.75 0 0 0 .072-.977l-.073-.084l-4.997-4.996a.75.75 0 0 0-.976-.073l-.085.072L6.22 10.23a.75.75 0 0 0 .976 1.134l.084-.073l3.719-3.713L11 21.255c0 .38.282.693.648.743"/>',
+    viewbox: '0 0 24 24'
+};
+export const ImageAddRegularIcon = {
+    body: '<path fill="currentColor" d="M12 6.5a5.5 5.5 0 1 0-11 0a5.5 5.5 0 0 0 11 0M7 7l.001 2.504a.5.5 0 0 1-1 0V7H3.496a.5.5 0 0 1 0-1H6V3.5a.5.5 0 0 1 1 0V6h2.497a.5.5 0 0 1 0 1zm10.75-2.5h-5.063a6.5 6.5 0 0 0-.709-1.5h5.772A3.25 3.25 0 0 1 21 6.25v11.5A3.25 3.25 0 0 1 17.75 21H6.25A3.25 3.25 0 0 1 3 17.75v-5.772c.463.297.967.536 1.5.709v5.063q.001.313.103.594l5.823-5.701a2.25 2.25 0 0 1 3.02-.116l.128.116l5.822 5.702q.102-.28.104-.595V6.25a1.75 1.75 0 0 0-1.75-1.75m.58 14.901l-5.805-5.686a.75.75 0 0 0-.966-.071l-.084.07l-5.807 5.687q.274.097.582.099h11.5c.203 0 .399-.035.58-.099M15.253 6.5a2.252 2.252 0 1 1 0 4.504a2.252 2.252 0 0 1 0-4.504m0 1.5a.752.752 0 1 0 0 1.504a.752.752 0 0 0 0-1.504"/>',
+    viewbox: '0 0 24 24'
+};
+export const ArrowResetRegularIcon = {
+    body: '<path fill="currentColor" d="M6.78 2.72a.75.75 0 0 1 0 1.06L4.56 6h8.69a7.75 7.75 0 1 1-7.75 7.75a.75.75 0 0 1 1.5 0a6.25 6.25 0 1 0 6.25-6.25H4.56l2.22 2.22a.75.75 0 1 1-1.06 1.06l-3.5-3.5a.75.75 0 0 1 0-1.06l3.5-3.5a.75.75 0 0 1 1.06 0"/>',
+    viewbox: '0 0 24 24'
+};
+export const CropRegularIcon = {
+    body: '<path fill="currentColor" d="M21.25 17a.75.75 0 0 1 .102 1.493l-.102.007H18.5v2.75a.75.75 0 0 1-1.493.102L17 21.25V18.5H8.75a3.25 3.25 0 0 1-3.245-3.066L5.5 15.25L5.499 7H2.75a.75.75 0 0 1-.102-1.493L2.75 5.5h2.749L5.5 2.75a.75.75 0 0 1 1.493-.102L7 2.75L6.999 5.5H7V7h-.001L7 15.25a1.75 1.75 0 0 0 1.606 1.744L8.75 17zM8 5.5h7.25a3.25 3.25 0 0 1 3.245 3.066l.005.184V16H17V8.75a1.75 1.75 0 0 0-1.607-1.744L15.25 7H8z"/>',
+    viewbox: '0 0 24 24'
+};