@velumweb/ui-kit 1.0.0

package/.storybook/main.ts

@@ -0,0 +1,14 @@
+import type { StorybookConfig } from '@storybook/react-vite';
+
+const config: StorybookConfig = {
+  "stories": [
+    "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"
+  ],
+  "addons": [],
+  "framework": {
+    "name": "@storybook/react-vite",
+    "options": {}
+  },
+  staticDirs: ['../utils'],
+};
+export default config;

package/.storybook/manager.ts

@@ -0,0 +1,32 @@
+import { addons, type State } from 'storybook/manager-api';
+
+addons.setConfig({
+    navSize: 300,
+    bottomPanelHeight: 300,
+    rightPanelWidth: 300,
+    panelPosition: 'right',
+    enableShortcuts: true,
+    showToolbar: true,
+    theme: undefined,
+    selectedPanel: undefined,
+    initialActive: 'sidebar',
+    layoutCustomisations: {
+        showSidebar(state: State, defaultValue: boolean) {
+            return state.storyId === 'landing' ? false : defaultValue;
+        },
+        showToolbar(state: State, defaultValue: boolean) {
+            return state.viewMode === 'docs' ? false : defaultValue;
+        },
+    },
+    sidebar: {
+        showRoots: false,
+        collapsedRoots: ['other'],
+    },
+    toolbar: {
+        title: { hidden: false },
+        zoom: { hidden: false },
+        eject: { hidden: false },
+        copy: { hidden: false },
+        fullscreen: { hidden: false },
+    },
+});

package/.storybook/preview.ts

@@ -0,0 +1,14 @@
+import type { Preview } from '@storybook/react-vite'
+
+const preview: Preview = {
+  parameters: {
+    controls: {
+      matchers: {
+       color: /(background|color)$/i,
+       date: /Date$/i
+      },
+    },
+  },
+};
+
+export default preview;

package/dist/Button/Button.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Компонент кнопки
+ * - разные состояния
+ * - разные типы
+ * - разные размеры
+ * - разные углы
+ * - добавление иконки
+ */
+export interface ButtonProps {
+    /** Основная / Только текст / Вспомогательная */
+    type: 'primary' | 'transparent' | 'secondary';
+    /** Маленькая / Средняя / Большая */
+    size?: 'small' | 'medium' | 'large';
+    /** Углы прямые / Закругленные / Круглые */
+    corners?: 'square' | 'standard' | 'round';
+    /** Доступность кнопки */
+    disabled?: boolean;
+    /** Текст кнопки */
+    text?: string;
+    /** Событие при нажатии */
+    onClick?: (e?: MouseEvent) => void;
+    /** Дополнительные классы */
+    cls?: string;
+    /** Путь до иконки из assets */
+    iconPath?: string;
+    /** Расположение текста относительно иконки */
+    labelAlign?: 'right' | 'left' | 'bottom' | 'top';
+    /** Это просто информационная иконка */
+    staticIcon?: boolean;
+}
+/** Элемент кнопки */
+export declare const Button: ({ type, size, corners, disabled, staticIcon, cls, text, iconPath, labelAlign, onClick, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Button/Button.stories.d.ts

@@ -0,0 +1,15 @@
+import { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: ({ type, size, corners, disabled, staticIcon, cls, text, iconPath, labelAlign, onClick, ...props }: import('./Button').ButtonProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    decorators: ((Story: any) => any)[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const CustomButton: Story;
+export declare const IconButton: Story;
+export declare const Icon: Story;

package/dist/Button/index.d.ts

@@ -0,0 +1 @@
+export * from './Button';

package/dist/Container/Box.d.ts

@@ -0,0 +1,33 @@
+import { ReactNode } from 'react';
+/**
+ * Компоненты контейнеры
+ * - разные направления
+ * - семантические обертки
+ * - позиционирование
+ */
+export interface BoxProps {
+    /** Направление строка или столбец */
+    direction?: 'row' | 'column';
+    /** Горизонтальное выравнивание **/
+    align?: 'top' | 'center' | 'bottom';
+    /** Горизонтальное распределение **/
+    justify?: 'start' | 'end' | 'center' | 'space';
+    /** Перенос блоков внутри контейнера **/
+    wrapContent?: boolean;
+    /** Дополнительные классы */
+    cls?: string;
+    /** Расстояние между дочерними элементами */
+    gap?: number;
+    /** Внешние отступы */
+    margin?: number[];
+    /** Внутренние отступы */
+    padding?: number[];
+    /** Родительский тег для семантики */
+    parent?: 'header' | 'footer' | 'article' | 'section' | 'main' | 'div';
+    /** Содержимое контейнера **/
+    children: ReactNode | string;
+    /** Маска загрузки **/
+    mask?: boolean;
+}
+/** Элемент контейнера */
+export declare const Box: ({ direction, align, justify, wrapContent, cls, gap, margin, padding, parent, mask, children, ...props }: BoxProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Container/index.d.ts

@@ -0,0 +1 @@
+export * from './Box';

package/dist/Input/Input.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Компонент поля для ввода текста
+ * - тип (текст, цифры, пароль)
+ * - это поисковая строка (значок лупы)
+ * - валидация
+ */
+export interface InputProps {
+    /** Значение */
+    value?: string | number;
+    /** Текстовое поле \ цифровое \ пароль \ textarea */
+    type?: 'text' | 'number' | 'password' | 'email' | 'date' | 'tel' | 'time' | 'textarea';
+    /** Углы прямые / Закругленные / Круглые */
+    corners?: 'square' | 'standard' | 'round';
+    /** Доступность поля */
+    disabled?: boolean;
+    /** Текст над полем */
+    label?: string;
+    /** Текст под полем */
+    bottomText?: string;
+    /** Плейсхолдер */
+    placeholder?: string;
+    /** Живой поиск */
+    live?: boolean;
+    /** Событие при изменении */
+    onChange?: (value?: string | number) => void;
+    /** Это поиск */
+    isSearch?: boolean;
+    /** Валидация */
+    mask?: RegExp;
+    /** Ошибки валидации */
+    errorText: string;
+    /** Ширина в px */
+    width?: number;
+    /** Дополнительные классы */
+    cls?: string;
+}
+/** Элемент кнопки */
+export declare const Input: ({ value, type, corners, disabled, label, bottomText, placeholder, errorText, live, isSearch, mask, width, onChange, cls, ...props }: InputProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Input/Input.stories.d.ts

@@ -0,0 +1,14 @@
+import { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: ({ value, type, corners, disabled, label, bottomText, placeholder, errorText, live, isSearch, mask, width, onChange, cls, ...props }: import('./Input').InputProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    decorators: ((Story: any) => any)[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const TextField: Story;
+export declare const Search: Story;

package/dist/Input/index.d.ts

@@ -0,0 +1 @@
+export * from './Input';

package/dist/Modal/Modal.d.ts

@@ -0,0 +1,29 @@
+import { ReactNode } from 'react';
+/**
+ * Компонент модальное окно
+ * - размеры
+ * - углы
+ * - тип непрозрачности фона
+ */
+export interface ModalProps {
+    /** Ширина */
+    width?: number | 'auto';
+    /** Углы прямые / Закругленные / Круглые */
+    corners?: 'square' | 'standard' | 'round';
+    /** Тип непрозрачности фона */
+    background?: 'blackout' | 'blur';
+    /** Содержимое контейнера **/
+    children: ReactNode | string;
+    /** Дополнительные классы */
+    cls?: string;
+    /** Операции при закрытии */
+    onClose: () => void;
+    /** Окно открыто */
+    isOpen?: boolean;
+    /** Title */
+    title?: string;
+    /** Кнопка закрытия в углу */
+    closeButton?: boolean;
+}
+/** Элемент модалки */
+export declare const Modal: ({ width, corners, background, isOpen, closeButton, title, cls, children, onClose, ...props }: ModalProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Modal/Modal.stories.d.ts

@@ -0,0 +1,13 @@
+import { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: ({ width, corners, background, isOpen, closeButton, title, cls, children, onClose, ...props }: import('./Modal').ModalProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    decorators: ((Story: any) => any)[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const ModalWindow: Story;

package/dist/Modal/index.d.ts

@@ -0,0 +1 @@
+export * from './Modal';

package/dist/Toggle/Toggle.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+/**
+ * Компонент переключателя
+ */
+export interface ToggleProps {
+    /** Маленькая / Средняя / Большая */
+    size?: 'small' | 'medium' | 'large';
+    /** Доступность переключателя */
+    disabled?: boolean;
+    /** Текст переключателя */
+    text?: string;
+    /** Событие при нажатии */
+    onClick?: (e?: MouseEvent) => void;
+    /** Дополнительные классы */
+    cls?: string;
+}
+/** Элемент кнопки */
+export declare const Toggle: React.FC<ToggleProps>;

package/dist/Toggle/Toggle.stories.d.ts

@@ -0,0 +1,13 @@
+import { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: import('react').FC<import('./Toggle').ToggleProps>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    decorators: ((Story: any) => any)[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const CustomToggle: Story;

package/dist/Toggle/index.d.ts

@@ -0,0 +1 @@
+export * from './Toggle';

package/dist/assets/svg-lib/3-dots-horizontal-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Dots" data-name="24x24/On Light/Dots" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="#141124" opacity="0"/>
+  <path id="Shape" d="M12,1.5A1.5,1.5,0,1,1,13.5,3,1.5,1.5,0,0,1,12,1.5Zm-6,0A1.5,1.5,0,1,1,7.5,3,1.5,1.5,0,0,1,6,1.5Zm-6,0A1.5,1.5,0,1,1,1.5,3,1.5,1.5,0,0,1,0,1.5Z" transform="translate(4.5 11)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/about-empty-page-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_About" data-name="24x24/On Light/About" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M.75,19.5A.751.751,0,0,1,0,18.75V.75A.751.751,0,0,1,.75,0h14a.751.751,0,0,1,.75.75v11a.755.755,0,0,1-.22.53l-7,7a.755.755,0,0,1-.53.22ZM1.5,18H7V11.75A.75.75,0,0,1,7.75,11H14V1.5H1.5Zm7-1.06,4.44-4.44H8.5Z" transform="translate(4.25 2.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/alert-square.svg

@@ -0,0 +1,26 @@
+<?xml version="1.0" ?>
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+
+<title/>
+
+<g id="Complete">
+
+<g id="alert-circle">
+
+<g>
+
+<line fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="8" y2="12"/>
+
+<line fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="16" y2="16"/>
+
+<circle cx="12" cy="12" data-name="--Circle" fill="none" id="_--Circle" r="10" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+
+</g>
+
+</g>
+
+</g>
+
+</svg>

package/dist/assets/svg-lib/arrow-bottom-svgrepo-com.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <g id="_24x24_On_Light_Arrow-Bottom" data-name="24x24/On Light/Arrow-Bottom" transform="translate(0 24) rotate(-90)">
+    <rect id="view-box" width="24" height="24" fill="none"/>
+    <path id="Shape" d="M.22,10.22A.75.75,0,0,0,1.28,11.28l5-5a.75.75,0,0,0,0-1.061l-5-5A.75.75,0,0,0,.22,1.28l4.47,4.47Z" transform="translate(14.75 17.75) rotate(180)" fill="#141124"/>
+  </g>
+</svg>

package/dist/assets/svg-lib/arrow-left-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Arrow-Left" data-name="24x24/On Light/Arrow-Left" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M.22,10.22A.75.75,0,0,0,1.28,11.28l5-5a.75.75,0,0,0,0-1.061l-5-5A.75.75,0,0,0,.22,1.28l4.47,4.47Z" transform="translate(14.75 17.75) rotate(180)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/arrow-right-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Arrow-Right" data-name="24x24/On Light/Arrow-Right" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M.22,10.22A.75.75,0,0,0,1.28,11.28l5-5a.75.75,0,0,0,0-1.061l-5-5A.75.75,0,0,0,.22,1.28l4.47,4.47Z" transform="translate(9.25 6.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/arrow-top-svgrepo-com.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <g id="_24x24_On_Light_Arrow-Top" data-name="24x24/On Light/Arrow-Top" transform="translate(24) rotate(90)">
+    <rect id="view-box" width="24" height="24" fill="none"/>
+    <path id="Shape" d="M.22,10.22A.75.75,0,0,0,1.28,11.28l5-5a.75.75,0,0,0,0-1.061l-5-5A.75.75,0,0,0,.22,1.28l4.47,4.47Z" transform="translate(14.75 17.75) rotate(180)" fill="#141124"/>
+  </g>
+</svg>

package/dist/assets/svg-lib/checkmark-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Checkmark" data-name="24x24/On Light/Checkmark" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="#141124" opacity="0"/>
+  <path id="Shape" d="M5.341,12.247a1,1,0,0,0,1.317,1.505l4-3.5a1,1,0,0,0,.028-1.48l-9-8.5A1,1,0,0,0,.313,1.727l8.2,7.745Z" transform="translate(19 6.5) rotate(90)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/clock-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Clock" data-name="24x24/On Light/Clock" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M0,9.75A9.75,9.75,0,1,1,9.75,19.5,9.761,9.761,0,0,1,0,9.75Zm1.5,0A8.25,8.25,0,1,0,9.75,1.5,8.259,8.259,0,0,0,1.5,9.75Zm10.375,4.186L9.22,11.281A.754.754,0,0,1,9,10.75V5.55a.75.75,0,0,1,1.5,0v4.889l2.435,2.436a.75.75,0,1,1-1.06,1.06Z" transform="translate(2.25 2.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/cross-svgrepo-com.svg

@@ -0,0 +1,12 @@
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Cross" data-name="24x24/On Light/Cross" xmlns="http://www.w3.org/2000/svg" fill="#000000">
+
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+
+<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+
+<g id="SVGRepo_iconCarrier"> <rect id="view-box" width="24" height="24" fill="none"/> <path id="Shape" d="M9.291,10.352l-4-4-4.005,4A.75.75,0,1,1,.22,9.291l4.005-4L.22,1.281A.75.75,0,0,1,1.281.22L5.286,4.225l4-4.005a.75.75,0,1,1,1.061,1.061l-4,4.005,4,4a.75.75,0,0,1-1.061,1.061Z" transform="translate(6.629 6.8)" fill="#141124"/> </g>
+
+</svg>

package/dist/assets/svg-lib/download-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Download" data-name="24x24/On Light/Download" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M2.75,17.5A2.853,2.853,0,0,1,0,14.55V4.75a.75.75,0,1,1,1.5,0v9.8A1.363,1.363,0,0,0,2.75,16h12A1.363,1.363,0,0,0,16,14.55V4.75a.75.75,0,1,1,1.5,0v9.8A2.853,2.853,0,0,1,14.75,17.5ZM8.22,12.281l-4-4A.75.75,0,0,1,5.28,7.22L8,9.94V.75a.75.75,0,0,1,1.5,0V9.939L12.219,7.22A.75.75,0,0,1,13.28,8.28l-4,4a.75.75,0,0,1-1.06,0Z" transform="translate(3.25 3.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/edit-pen-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Edit" data-name="24x24/On Light/Edit" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M.75,17.5A.751.751,0,0,1,0,16.75V12.569a.755.755,0,0,1,.22-.53L11.461.8a2.72,2.72,0,0,1,3.848,0L16.7,2.191a2.72,2.72,0,0,1,0,3.848L5.462,17.28a.747.747,0,0,1-.531.22ZM1.5,12.879V16h3.12l7.91-7.91L9.41,4.97ZM13.591,7.03l2.051-2.051a1.223,1.223,0,0,0,0-1.727L14.249,1.858a1.222,1.222,0,0,0-1.727,0L10.47,3.91Z" transform="translate(3.25 3.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/favorite-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Favorite" data-name="24x24/On Light/Favorite" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M9.725,18.286l-7.87-7.7.524-.536-.524.536a6.115,6.115,0,0,1,0-8.775,6.406,6.406,0,0,1,8.394-.46,6.406,6.406,0,0,1,8.394.46,6.115,6.115,0,0,1,0,8.775l-7.87,7.7a.75.75,0,0,1-1.049,0Z" transform="translate(1.75 3.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/forbiden-svgrepo-com.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 -0.48 24 24" xmlns="http://www.w3.org/2000/svg">
+  <g id="_24x24_On_Light_Forbiden" data-name="24x24/On Light/Forbiden" transform="translate(0 -0.69)">
+    <rect id="view-box" width="24" height="23.04" transform="translate(0 0.69)" fill="none"/>
+    <path id="Shape" d="M0,9.36A9.572,9.572,0,0,1,9.75,0,9.572,9.572,0,0,1,19.5,9.36,9.572,9.572,0,0,1,9.75,18.72,9.572,9.572,0,0,1,0,9.36Zm1.5,0A8.1,8.1,0,0,0,9.75,17.28a8.462,8.462,0,0,0,4.174-1.09Q7.627,8,4.183,3.521A7.763,7.763,0,0,0,1.5,9.36Zm13.658,5.976A7.775,7.775,0,0,0,18,9.36,8.1,8.1,0,0,0,9.75,1.44a8.454,8.454,0,0,0-4.356,1.2Z" transform="translate(2.25 2.88)" fill="#141124"/>
+  </g>
+</svg>

package/dist/assets/svg-lib/input-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Clear-Input" data-name="24x24/On Light/Clear-Input" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="#141124" opacity="0"/>
+  <path id="Shape" d="M10,20A10,10,0,1,1,20,10,10.011,10.011,0,0,1,10,20Zm0-8.939h0l2.469,2.468a.75.75,0,1,0,1.06-1.06L11.061,10,13.53,7.53a.75.75,0,0,0-1.06-1.061L10,8.94,7.53,6.469A.75.75,0,1,0,6.469,7.53L8.94,10l-2.471,2.47A.75.75,0,1,0,7.53,13.53L10,11.062Z" transform="translate(2 2)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/link-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Link" data-name="24x24/On Light/Link" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M0,16.835V12.25A4.25,4.25,0,0,1,4.25,8a.75.75,0,1,1,0,1.5A2.75,2.75,0,0,0,1.5,12.25v4.585a2.75,2.75,0,1,0,5.5,0V14.422a.75.75,0,0,1,1.5,0v2.414a4.25,4.25,0,1,1-8.5,0Zm3.5-4.5a.75.75,0,0,1,.75-.75A2.75,2.75,0,0,0,7,8.836V4.25a2.75,2.75,0,0,0-5.5,0v2a.75.75,0,1,1-1.5,0v-2a4.25,4.25,0,0,1,8.5,0V8.836a4.25,4.25,0,0,1-4.25,4.25A.75.75,0,0,1,3.5,12.335Z" transform="translate(16.45 1.54) rotate(45)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/messages-alert-svgrepo-com.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Messages-Alert" data-name="24x24/On Light/Messages-Alert" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M10.751,19.5a9.66,9.66,0,0,1-4.266-.981,9.889,9.889,0,0,1-4.876.981c-.279,0-.578-.006-.887-.018a.74.74,0,0,1-.65-.432.738.738,0,0,1,.085-.775,11.191,11.191,0,0,0,2.072-3.787A9.754,9.754,0,0,1,12.682.192a5.478,5.478,0,0,0-.676,1.4A8.252,8.252,0,0,0,3.668,13.983a.75.75,0,0,1,.092.535A10.189,10.189,0,0,1,2.2,17.99a7.2,7.2,0,0,0,3.816-.947.746.746,0,0,1,.431-.136A.755.755,0,0,1,6.808,17a8.254,8.254,0,0,0,12.1-8.5,5.477,5.477,0,0,0,1.4-.676A9.755,9.755,0,0,1,10.751,19.5Zm3-7h-7a.75.75,0,0,1,0-1.5h7a.75.75,0,0,1,0,1.5Zm-2-4h-5a.75.75,0,1,1,0-1.5h5a.75.75,0,0,1,0,1.5Zm6.612-1.931h0a8.34,8.34,0,0,0-4.43-4.43,3.527,3.527,0,0,1,.781-1.3,9.773,9.773,0,0,1,4.946,4.946,3.527,3.527,0,0,1-1.3.781Z" transform="translate(1.249 2.25)" fill="#141124"/>
+  <path id="Shape-2" data-name="Shape" d="M3.5,7A3.5,3.5,0,1,1,7,3.5,3.5,3.5,0,0,1,3.5,7Z" transform="translate(15 2)" fill="#ff6359"/>
+</svg>

package/dist/assets/svg-lib/messages-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Messages" data-name="24x24/On Light/Messages" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M6.485,18.519a9.891,9.891,0,0,1-4.876.981c-.285,0-.584-.006-.887-.018a.739.739,0,0,1-.65-.432.738.738,0,0,1,.085-.775,11.192,11.192,0,0,0,2.072-3.787A9.751,9.751,0,1,1,10.751,19.5,9.661,9.661,0,0,1,6.485,18.519ZM6.808,17a8.247,8.247,0,1,0-3.139-3.015.75.75,0,0,1,.092.535A10.189,10.189,0,0,1,2.2,17.99a7.2,7.2,0,0,0,3.816-.947.745.745,0,0,1,.431-.136A.756.756,0,0,1,6.808,17Zm-.057-4.5a.75.75,0,0,1,0-1.5h7a.75.75,0,0,1,0,1.5Zm0-4a.75.75,0,0,1,0-1.5h5a.75.75,0,1,1,0,1.5Z" transform="translate(1.249 2.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/mic-off-svgrepo-com.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Mic-Off" data-name="24x24/On Light/Mic-Off" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M4.75,19a.75.75,0,1,1,0-1.5H7V15.464A7.749,7.749,0,0,1,0,7.75a.75.75,0,0,1,1.5,0,6.25,6.25,0,1,0,12.5,0,.75.75,0,1,1,1.5,0,7.749,7.749,0,0,1-7,7.714V17.5h2.25a.75.75,0,1,1,0,1.5ZM3,7.75v-3a4.75,4.75,0,1,1,9.5,0v3a4.75,4.75,0,0,1-9.5,0Zm1.5-3v3a3.25,3.25,0,0,0,6.5,0v-3a3.25,3.25,0,0,0-6.5,0Z" transform="translate(4.25 2.25)" fill="#abadb7"/>
+  <path id="Shape-2" data-name="Shape" d="M2.626.657.006,21.551a.75.75,0,0,0,1.488.187L4.115.843A.75.75,0,0,0,2.626.657Z" transform="translate(2.458 5.845) rotate(-45)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/mic-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Mic" data-name="24x24/On Light/Mic" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M4.75,19a.75.75,0,1,1,0-1.5H7V15.464A7.749,7.749,0,0,1,0,7.75a.75.75,0,0,1,1.5,0,6.25,6.25,0,1,0,12.5,0,.75.75,0,1,1,1.5,0,7.749,7.749,0,0,1-7,7.714V17.5h2.25a.75.75,0,1,1,0,1.5ZM3,7.75v-3a4.75,4.75,0,1,1,9.5,0v3a4.75,4.75,0,0,1-9.5,0Zm1.5-3v3a3.25,3.25,0,0,0,6.5,0v-3a3.25,3.25,0,0,0-6.5,0Z" transform="translate(4.25 2.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/music-svgrepo-com.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Music" data-name="24x24/On Light/Music" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M0,5.25A3.25,3.25,0,1,1,3.25,8.5,3.254,3.254,0,0,1,0,5.25Zm1.5,0A1.75,1.75,0,1,0,3.25,3.5,1.752,1.752,0,0,0,1.5,5.25Zm10.5-2A3.25,3.25,0,1,1,15.25,6.5,3.254,3.254,0,0,1,12,3.25Zm1.5,0A1.75,1.75,0,1,0,15.25,1.5,1.752,1.752,0,0,0,13.5,3.25Z" transform="translate(2.25 13.25)" fill="#141124"/>
+  <path id="Shape-2" data-name="Shape" d="M1.5,15.085V4.3A1.25,1.25,0,0,1,2.56,3.065L11.724,1.5A.25.25,0,0,1,12,1.75V13.085a.75.75,0,0,0,1.5,0V1.75A1.75,1.75,0,0,0,11.484.021L2.32,1.584A2.747,2.747,0,0,0,0,4.3V15.085a.75.75,0,0,0,1.5,0Z" transform="translate(7.25 3.415)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/next-long-arrow-right-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Next" data-name="24x24/On Light/Next" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="#141124" opacity="0"/>
+  <path id="Shape" d="M10.22,9.28a.75.75,0,0,1,0-1.06l2.72-2.72H.75A.75.75,0,0,1,.75,4H12.938L10.22,1.281A.75.75,0,1,1,11.281.22l4,4a.749.749,0,0,1,0,1.06l-4,4a.75.75,0,0,1-1.061,0Z" transform="translate(4.25 7.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/notification-alert-svgrepo-com.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Notification-Alert" data-name="24x24/On Light/Notification-Alert" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M6,17v-.5H2.25A2.253,2.253,0,0,1,0,14.25v-.382a2.542,2.542,0,0,1,1.415-2.289A1.247,1.247,0,0,0,2.1,10.572l.446-4.91A6.227,6.227,0,0,1,10.618.286a5.477,5.477,0,0,0-.635,1.374A4.794,4.794,0,0,0,8.75,1.5,4.7,4.7,0,0,0,4.045,5.8L3.6,10.708A2.739,2.739,0,0,1,2.089,12.92a1.055,1.055,0,0,0-.589.949v.382A.751.751,0,0,0,2.25,15h13A.751.751,0,0,0,16,14.25v-.382a1.053,1.053,0,0,0-.586-.948A2.739,2.739,0,0,1,13.9,10.708l-.2-2.18a5.473,5.473,0,0,0,1.526.221l.166,1.822a1.26,1.26,0,0,0,.686,1.005,2.547,2.547,0,0,1,1.418,2.29v.382a2.252,2.252,0,0,1-2.25,2.25H11.5V17A2.75,2.75,0,0,1,6,17Zm1.5,0A1.25,1.25,0,0,0,10,17v-.5H7.5ZM15.047,6.744A3.486,3.486,0,0,1,13.5,6.28L13.456,5.8a4.7,4.7,0,0,0-1.648-3.185,3.5,3.5,0,0,1,.61-1.417A6.221,6.221,0,0,1,14.95,5.662l.1,1.081v0Z" transform="translate(3.25 2.25)" fill="#141124"/>
+  <path id="Shape-2" data-name="Shape" d="M3.5,7A3.5,3.5,0,1,1,7,3.5,3.5,3.5,0,0,1,3.5,7Z" transform="translate(15 2)" fill="#ff6359"/>
+</svg>

package/dist/assets/svg-lib/notification-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Notification" data-name="24x24/On Light/Notification" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M6,17v-.5H2.25A2.253,2.253,0,0,1,0,14.25v-.382a2.542,2.542,0,0,1,1.415-2.289A1.248,1.248,0,0,0,2.1,10.572l.446-4.91a6.225,6.225,0,0,1,12.4,0l.446,4.91a1.26,1.26,0,0,0,.686,1.005,2.547,2.547,0,0,1,1.418,2.29v.382a2.252,2.252,0,0,1-2.25,2.25H11.5V17A2.75,2.75,0,0,1,6,17Zm1.5,0A1.25,1.25,0,0,0,10,17v-.5H7.5ZM4.045,5.8,3.6,10.708A2.738,2.738,0,0,1,2.089,12.92a1.055,1.055,0,0,0-.589.949v.382A.751.751,0,0,0,2.25,15h13A.751.751,0,0,0,16,14.25v-.382a1.054,1.054,0,0,0-.586-.948A2.739,2.739,0,0,1,13.9,10.708L13.456,5.8a4.725,4.725,0,0,0-9.411,0Z" transform="translate(3.25 2.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/notifications-off-svgrepo-com.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Notification-Off" data-name="24x24/On Light/Notification-Off" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M6,17v-.5H2.25A2.253,2.253,0,0,1,0,14.25v-.382a2.542,2.542,0,0,1,1.415-2.289A1.248,1.248,0,0,0,2.1,10.572l.446-4.91a6.225,6.225,0,0,1,12.4,0l.446,4.91a1.26,1.26,0,0,0,.686,1.005,2.547,2.547,0,0,1,1.418,2.29v.382a2.252,2.252,0,0,1-2.25,2.25H11.5V17A2.75,2.75,0,0,1,6,17Zm1.5,0A1.25,1.25,0,0,0,10,17v-.5H7.5ZM4.045,5.8,3.6,10.708A2.738,2.738,0,0,1,2.089,12.92a1.055,1.055,0,0,0-.589.949v.382A.751.751,0,0,0,2.25,15h13A.751.751,0,0,0,16,14.25v-.382a1.054,1.054,0,0,0-.586-.948A2.739,2.739,0,0,1,13.9,10.708L13.456,5.8a4.725,4.725,0,0,0-9.411,0Z" transform="translate(3.25 2.25)" fill="#abadb7"/>
+  <path id="Shape-2" data-name="Shape" d="M2.626.657.006,21.551a.75.75,0,0,0,1.488.187L4.115.843A.75.75,0,0,0,2.626.657Z" transform="translate(2.458 5.527) rotate(-45)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/party-simple-colored-svgrepo-com.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Party" data-name="24x24/On Light/Party" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M1.14,14.362A3.876,3.876,0,0,1,.592,9.546L6.338.353A.75.75,0,0,1,7.5.22L15.282,8a.749.749,0,0,1-.132,1.166L5.956,14.91a3.895,3.895,0,0,1-4.816-.548Zm.724-4.021a2.393,2.393,0,0,0,3.3,3.3l.892-.557L2.421,9.45Zm5.494,1.924,2.387-1.492L4.728,5.758,3.237,8.144Zm3.692-2.308,2.505-1.566L7.11,1.947,5.544,4.452Z" transform="translate(3.233 5.265)" fill="#141124"/>
+  <path id="Shape-2" data-name="Shape" d="M1.5,4.15V.75A.75.75,0,0,0,0,.75v3.4a.75.75,0,0,0,1.5,0Z" transform="translate(14.971 1.45)" fill="#03a5d1"/>
+  <path id="Shape-3" data-name="Shape" d="M1.16,3.114,3.82,1.378A.75.75,0,0,0,3,.122L.34,1.857a.75.75,0,1,0,.82,1.256Z" transform="translate(17.312 6.75)" fill="#00bba2"/>
+  <path id="Shape-4" data-name="Shape" d="M1.28,2.107l.827-.827A.75.75,0,0,0,1.047.22L.22,1.047A.75.75,0,0,0,1.28,2.107Z" transform="translate(17.971 3.798)" fill="#ff6783"/>
+  <path id="Shape-5" data-name="Shape" d="M.75,1.5H.967a.75.75,0,0,0,0-1.5H.75a.75.75,0,0,0,0,1.5Z" transform="translate(18.971 10.625)" fill="#ffa458"/>
+  <path id="Shape-6" data-name="Shape" d="M.75,1.5H.967a.75.75,0,0,0,0-1.5H.75a.75.75,0,0,0,0,1.5Z" transform="translate(14.971 7.625)" fill="#c75fff"/>
+  <path id="Shape-7" data-name="Shape" d="M1.881,1.478,1.439.453a.75.75,0,1,0-1.377.594L.5,2.073a.75.75,0,1,0,1.377-.594Z" transform="translate(11.528 2.599)" fill="#ffa458"/>
+</svg>

package/dist/assets/svg-lib/pattern-circles-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Pattern" data-name="24x24/On Light/Pattern" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="#141124" opacity="0"/>
+  <path id="Shape" d="M12,14.75a2.75,2.75,0,1,1,2.75,2.75A2.754,2.754,0,0,1,12,14.75Zm1.5,0a1.25,1.25,0,1,0,1.25-1.25A1.251,1.251,0,0,0,13.5,14.75ZM0,14.75A2.75,2.75,0,1,1,2.75,17.5,2.754,2.754,0,0,1,0,14.75Zm1.5,0A1.25,1.25,0,1,0,2.75,13.5,1.251,1.251,0,0,0,1.5,14.75Zm4.5-6a2.75,2.75,0,1,1,2.75,2.75A2.754,2.754,0,0,1,6,8.751Zm1.5,0A1.25,1.25,0,1,0,8.751,7.5,1.251,1.251,0,0,0,7.5,8.751Zm4.5-6A2.75,2.75,0,1,1,14.75,5.5,2.754,2.754,0,0,1,12,2.75Zm1.5,0A1.25,1.25,0,1,0,14.75,1.5,1.251,1.251,0,0,0,13.5,2.75ZM0,2.75A2.75,2.75,0,1,1,2.75,5.5,2.754,2.754,0,0,1,0,2.75Zm1.5,0A1.25,1.25,0,1,0,2.75,1.5,1.251,1.251,0,0,0,1.5,2.75Z" transform="translate(3.25 3.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/play-button-simple-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Play" data-name="24x24/On Light/Play" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M0,9.75A9.75,9.75,0,1,1,9.75,19.5,9.761,9.761,0,0,1,0,9.75Zm1.5,0A8.25,8.25,0,1,0,9.75,1.5,8.259,8.259,0,0,0,1.5,9.75Zm5.75-3.8,7,3.8-7,3.8Z" transform="translate(2.25 2.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/plus-outlined-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Plus" data-name="24x24/On Light/Plus" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="#141124" opacity="0"/>
+  <path id="Shape" d="M5,10.75V6.5H.75A.75.75,0,0,1,.75,5H5V.75a.75.75,0,0,1,1.5,0V5h4.25a.75.75,0,1,1,0,1.5H6.5v4.25a.75.75,0,1,1-1.5,0Z" transform="translate(6 6)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/previous-long-arrow-left-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Previous" data-name="24x24/On Light/Previous" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="#141124" opacity="0"/>
+  <path id="Shape" d="M4.22,9.28l-4-4L.207,5.267.2,5.261.194,5.254.187,5.246.182,5.24.174,5.231l0,0-.008-.01,0,0L.151,5.2l0,0L.14,5.186l0,0L.13,5.172l0,0L.12,5.157l0-.006L.111,5.142l0-.007,0-.008L.1,5.118l0-.006L.087,5.1l0,0A.751.751,0,0,1,.235,4.2L4.22.22A.75.75,0,0,1,5.28,1.281L2.561,4H14.75a.75.75,0,0,1,0,1.5H2.561L5.28,8.22A.75.75,0,1,1,4.22,9.28Z" transform="translate(4.25 7.25)" fill="#141124"/>
+</svg>

package/dist/assets/svg-lib/queue-listing-cards-svgrepo-com.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Queue-In" data-name="24x24/On Light/Queue-In" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M3.75,19.5A3.75,3.75,0,0,1,0,15.75V6.607A2.607,2.607,0,0,1,2.607,4H4V2.75A2.754,2.754,0,0,1,6.75,0h10A2.753,2.753,0,0,1,19.5,2.75v10a2.752,2.752,0,0,1-2.75,2.75H15.5v1.393A2.607,2.607,0,0,1,12.892,19.5ZM1.5,6.607V15.75A2.25,2.25,0,0,0,3.75,18h9.142A1.108,1.108,0,0,0,14,16.893V15.5H6.75A2.753,2.753,0,0,1,4,12.75V5.5H2.607A1.107,1.107,0,0,0,1.5,6.607Zm4-3.857v10A1.252,1.252,0,0,0,6.75,14h10A1.251,1.251,0,0,0,18,12.75v-10A1.251,1.251,0,0,0,16.75,1.5h-10A1.252,1.252,0,0,0,5.5,2.75ZM9.25,10.5a.75.75,0,1,1,0-1.5h5a.75.75,0,1,1,0,1.5Z" transform="translate(2.25 2.25)" fill="#141124"/>
+  <path id="Shape-2" data-name="Shape" d="M.75,1.5h5a.75.75,0,0,0,0-1.5h-5a.75.75,0,0,0,0,1.5Z" transform="translate(17.25 8.75) rotate(-180)" fill="#141124" opacity="0.5"/>
+</svg>

package/dist/assets/svg-lib/queue-remove-svgrepo-com.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" id="_24x24_On_Light_Queue-Remove" data-name="24x24/On Light/Queue-Remove" xmlns="http://www.w3.org/2000/svg">
+  <rect id="view-box" width="24" height="24" fill="none"/>
+  <path id="Shape" d="M3.75,19.5A3.75,3.75,0,0,1,0,15.75V6.607A2.607,2.607,0,0,1,2.607,4H4V2.75A2.754,2.754,0,0,1,6.75,0h10A2.753,2.753,0,0,1,19.5,2.75v10a2.752,2.752,0,0,1-2.75,2.75H15.5v1.393A2.607,2.607,0,0,1,12.892,19.5ZM1.5,6.607V15.75A2.25,2.25,0,0,0,3.75,18h9.142A1.108,1.108,0,0,0,14,16.893V15.5H6.75A2.753,2.753,0,0,1,4,12.75V5.5H2.607A1.107,1.107,0,0,0,1.5,6.607Zm4-3.857v10A1.252,1.252,0,0,0,6.75,14h10A1.251,1.251,0,0,0,18,12.75v-10A1.251,1.251,0,0,0,16.75,1.5h-10A1.252,1.252,0,0,0,5.5,2.75ZM13.343,10.4,11.752,8.813,10.161,10.4A.75.75,0,0,1,9.1,9.343l1.591-1.591L9.1,6.161A.75.75,0,0,1,10.161,5.1l1.591,1.591L13.343,5.1A.75.75,0,1,1,14.4,6.161L12.813,7.752,14.4,9.343a.75.75,0,0,1-1.06,1.061Z" transform="translate(2.25 2.25)" fill="#141124"/>
+</svg>