@topvisor/ui 0.0.35 → 0.0.37

package/src/components/helpersStories.ts

@@ -1,151 +0,0 @@
-import type { StoryObj } from '@storybook/vue3';
-
-/**
- * Генерация объекта ArgsTypes для Storybook
- */
-export function genArgsTypes(component: any, ComponentsConsts: any[string], defaultSlotAsString: boolean = false) {
-	const argTypes = {} as any;
-
-	// slot по умолчанию в виде строки
-	if (defaultSlotAsString) {
-		argTypes.default = {
-			control: 'text',
-		};
-	}
-
-	const propsNames = Object.keys(component.props ?? []);
-	propsNames.forEach(name => {
-		// union типы, определенные через константы
-		const typeName = name[0].toLowerCase() + name.substring(1);
-		const typeNamePlural = name[0].toLowerCase() + name.substring(1) + 's';
-
-		const type = ComponentsConsts[typeName] || ComponentsConsts[typeNamePlural];
-		if (type) {
-			const size = Object.keys(type).length;
-			const controlType = (size > 3) ? 'select' : 'inline-radio';
-
-			argTypes[name] = {
-				control: controlType,
-				options: type,
-			};
-		}
-
-		// для cotrols необходимо указывать конкретный тип, выбрать первый
-		if (Array.isArray(component.props[name].type)) {
-			const type = component.props[name].type[0];
-			let control = '';
-
-			switch (type) {
-				case Boolean:
-					control = 'boolean';
-
-					break;
-
-				case String:
-					control = 'string';
-
-					break;
-			}
-
-			if (control) {
-				argTypes.modelValue = {
-					control,
-				};
-			}
-		}
-	});
-
-	return argTypes;
-}
-
-/**
- * Сгенерировать историю обзора компонента
- *
- * Располагайте компонент OverviewComponent в папке stories, чтобы он не мешал основному компоненту
- * @param options - парамтеры историии
- * @param options.args - следует указавать только необходимые для демонстрации props, которых нет в шаблоне OverviewComponent
- * @param OverviewComponent - компонент для вывода другого компонента в разных состояниях
- * @returns возвращает историю обзора компонента
- */
-export function genOverviewStory<Story>(options: Story & StoryObj, OverviewComponent: any): Story {
-	if (!options.args) {
-		options.args = {};
-	}
-
-	if (!options.parameters) {
-		options.parameters = {};
-	}
-	if (!options.parameters.controls) {
-		options.parameters.controls = {};
-	}
-	if (!options.parameters.controls.include) {
-		options.parameters.controls.include = Object.keys(options.args);
-	}
-
-	if (!options.render) {
-		options.render = (args) => ({
-			components: { OverviewComponent },
-			setup() {
-				return { args };
-			},
-			template: '<OverviewComponent :="args"/>',
-		});
-	}
-
-	return options satisfies StoryObj;
-}
-
-/**
- * Получить объект с css переменными из css стилей
- * @param css - стили css
- * @return - словарь с css переменными
- */
-export function parseCSSVariables(css: string): Map<string, string> {
-	const matches = css.matchAll(/--([^:]+):([^;]+)/g);
-
-	const cssVariables = new Map();
-
-	for (const match of matches) {
-		const name = match[1].trim();
-		const value = match[2].trim();
-
-		cssVariables.set(name, value);
-	}
-
-	return cssVariables;
-}
-
-/**
- * Сгенерировать словарь css переменных с двойной вложенностью, определяемую разделителем '-' в имени переменной
- * @param cssVariables - словарь css переменных
- * @param searchStrings - вернуть только подходящие по имени переменные, по условию AND
- * @return - словарь с группами css переменных
- */
-export function genCSSVariablesGroups(
-	cssVariables: Map<string, string>,
-	searchStrings: string[] = [],
-): Map<string, Map<string, Map<string, string>>> {
-	const cssVariablesGroups2 = new Map();
-
-	cssVariables.forEach((value, name) => {
-		const parts = name.split('-');
-		const groupName = parts[0] ?? '';
-		const subgroupName = parts[1] ?? '';
-
-		for (const searchString of searchStrings) {
-			if (searchString && name.indexOf(searchString) === -1) {
-				return;
-			}
-		}
-
-		const group: Map<string, Map<string, string>> = cssVariablesGroups2.get(groupName) || new Map();
-		const subgroup: Map<string, string> = group.get(subgroupName) || new Map();
-
-		subgroup.set(name, value);
-		group.set(subgroupName, subgroup);
-
-		cssVariablesGroups2.set(groupName, group);
-	});
-
-	return cssVariablesGroups2;
-}

package/src/components/popup/lib/popup.globalEvents.js

@@ -1,205 +0,0 @@
-import Worker from '@/components/popup/lib/worker';
-import DOM from '@/core/utils/dom';
-
-/**
- * Глобальные события, для реализации Popup
- * Автоматически инициируется при первой загрузке, не является выгружаемым модулем
- *
- * Если в меню встречает класс .preloader, то событие нажатия на кнопку через enter будет остановлено
- */
-class GlobalEvents {
-	static init () {
-		document.addEventListener('click', this.onclick);
-		document.addEventListener('keydown', this.onkeydown);
-	}
-
-	/**
-	 * Глобальный обработчик кликов
-	 * обрабатывает клики внутри Popup
-	 * @param {Event} e
-	 */
-	static onclick (e) {
-		// элементы меню, клик по которым должен его закрыть
-		const elCloser = e.target.closest('.closer, a, .a, .top-button');
-		if (elCloser) {
-			// меню
-			const elPopup = e.target.closest('.top-popup-wrapper');
-
-			// клик вне меню
-			if (!elPopup) {
-				return;
-			}
-
-			// элемент имеет модификатор, запрещаюущий закрытие меню по клику на него
-			if (elCloser.matches('.top-popup-noCloser')) {
-				return;
-			}
-
-			// deprecated, ссылки с href="." запрещены, они должны быть заменены на .top-popup_item
-			if (elCloser.getAttribute('href') === '.') {
-				e.preventDefault();
-			}
-
-			// клик по кнопке открытия другого меню
-			if (e.target.matches('[data-top-popup]')) {
-				// список меню, в котором был сделан клик
-				const elUl = e.target.closest('ul');
-
-				// элемент меню, по которому был сделан клик
-				const elItem = e.target.closest('a, .a');
-
-				// сделать элемент меню, по которому сделан клик активным
-				if (elUl) {
-					elUl.querySelector('a.top-active, .a.top-active')?.classList.remove('top-active');
-				}
-
-				if (elItem) {
-					elItem.classList.add('top-active');
-				}
-
-				return;
-			}
-
-			// закрыть меню
-			Worker.close(elPopup);
-		}
-
-		// клик по фону меню
-		if (e.target.matches('.top-popup-wrapper')) {
-			const elPopup = e.target;
-
-			Worker.close(elPopup);
-		}
-	}
-
-	/**
-	 * Глобальный обработчик нажатия кнопки на клавиатуре
-	 * @param {Event} e
-	 */
-	static onkeydown (e) {
-		const elPopup = e.target.closest('.top-popup-wrapper');
-
-		// нажатие не в меню
-		if (!elPopup) {
-			return;
-		}
-
-		const elUl = elPopup.querySelector('ul.top-popup_content');
-
-		switch (e.key) {
-			case 'Escape':
-				// PopupWorker.close(elPopup);
-
-				break;
-
-			case 'Enter':
-				// атоматическое нажатие кнопок при нажатии Enter
-				if (!elUl) {
-					if (DOM.querySelectorVisible(elPopup, '.preloader')) {
-						break;
-					}
-
-					const elBtn = elPopup.querySelector('.top-popup_footer .go, .top-popup_footer [data-action]');
-					if (elBtn) {
-						elBtn.click();
-					}
-
-					break;
-				}
-
-				// перейти по ссылке по нажатию на Enter
-				// данный функуционал игнорирует SPA
-				const elLink = DOM.querySelectorVisible(elPopup, 'li > a.top-active');
-				if (elLink) {
-					// фокус может находиться на другой ссылке
-					e.preventDefault();
-
-					location.href = elLink.getAttribute('href');
-				}
-
-				// кликнуть по элементу меню по нажатию на Enter
-				const elItem = elPopup.querySelector('li > .top-active');
-				if (elItem) {
-					elItem.click();
-				}
-
-				break;
-
-			// управление стрелками
-			case 'ArrowUp':
-			case 'ArrowRight':
-			case 'ArrowDown':
-			case 'ArrowLeft':
-				if (!elUl) {
-					break;
-				}
-
-				if (e.key === 'ArrowRight' || e.key === 'ArrowLeft') {
-					const elMoreVisible = DOM.querySelectorVisible(elPopup, 'ul.top-popup_content > li:not(.top-popup_listTitle):not(.top-popup_listDelimiter) > .top-active > .top-popup_listMore');
-					if (elMoreVisible) {
-						e.preventDefault();
-					}
-				} else {
-					e.preventDefault();
-				}
-
-				const elItemActive = elPopup.querySelector('ul.top-popup_content > li:not(.top-popup_listTitle):not(.top-popup_listDelimiter) > .top-active')?.parentElement;
-
-				// есть подменю
-				if (e.key === 'ArrowRight' && elItemActive) {
-					// const elItemMoreActive = elItemActive.querySelector('[data-top-popup].top-active');
-					// if (elItemMoreActive) {
-					// 	return elItemMoreActive.click();
-					// }
-
-					const elMore = elItemActive.querySelector('.top-active > .top-popup_listMore');
-					if (elMore) {
-						return elMore.click();
-					}
-				}
-
-				const elsLiVisible = DOM.querySelectorAllVisible(elPopup, 'ul.top-popup_content > li:not(.top-popup_listTitle):not(.top-popup_listDelimiter)');
-				const countLi = elsLiVisible.length;
-
-				let index = elsLiVisible.indexOf(elItemActive);
-
-				if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') {
-					index--;
-				} else {
-					index++;
-				}
-
-				// это первый элемен, "Назад" должен закрывать окно
-				if (e.key === 'ArrowLeft' && index === -1) {
-					if (e.target.matches('input')) {
-						return;
-					}
-
-					return Worker.close(elPopup);
-				}
-
-				// это последний элемен, "Вперед" не должен ни чего делать
-				if (e.key === 'ArrowRight' && index === countLi) {
-					return;
-				}
-
-				if (index < 0) {
-					index = countLi - 1;
-				}
-
-				if (index > countLi - 1) {
-					index = 0;
-				}
-
-				elPopup.querySelectorAll('ul.top-popup_content > li > .top-active').forEach(el => el.classList.remove('top-active'));
-				elsLiVisible[index].querySelector(':scope > a, :scope > .a').classList.add('top-active');
-
-				Worker.scrollToActive(elPopup);
-
-				break;
-		}
-	}
-
-}
-
-export default GlobalEvents;