simp-select 1.0.0 → 1.0.1

package/package.json

@@ -1,9 +1,9 @@
 {
 	"name": "simp-select",
-	"version": "1.0.0",
+	"version": "1.0.1",
 	"description": "simp-select - this plugin replaces the select",
 	"main": "dist/simpleSelect.js",
-	"types": "dist/simpleSelect.d.ts",
+	"types": "src/types/simpleSelect.types.ts",
 	"module": "dist/simpleSelect.js",
 	"prepublish": "npm run build",
 	"scripts": {
@@ -21,10 +21,11 @@
 		"library",
 		"es6",
 		"commonjs",
-		"BrooonS/timezz.git",
 		"plugin",
 		"typescript",
-		"ui"
+		"ui",
+		"select",
+		"multiselect"
 	],
 	"author": "Yurii Kopot <yura.brd@gmail.com> (https://yu-k.site/)",
 	"license": "MIT",

package/tsconfig.json

@@ -3,7 +3,7 @@
 		"target": "ESNext",
 		"module": "CommonJS",
 		"lib": ["ESNext", "dom"],
-		"declaration": true,
+//		"declaration": true,
 		"outDir": "dist",
 		"strict": true,
 		"esModuleInterop": true

package/webpack.config.js

@@ -1,11 +1,11 @@
 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin')
-
+const TerserPlugin = require("terser-webpack-plugin");
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
 
 module.exports = ({ development }) => ({
-    entry: './src/simpleSelect.ts',
+  entry: './src/simpleSelect.ts',
   devtool: development ? 'inline-source-map' : false,
   mode: development ? 'development' : 'production',
   output: {
@@ -31,7 +31,6 @@ module.exports = ({ development }) => ({
       scriptLoading: "blocking",
       inject: 'head',
     }),
-    new MiniCssExtractPlugin(),
   ],
 
   module: {
@@ -68,7 +67,10 @@ module.exports = ({ development }) => ({
 
   optimization: {
     minimize: !development,
-    minimizer: !development ? [new CssMinimizerPlugin()] : [],
+    minimizer: !development ? [
+      new CssMinimizerPlugin(),
+      new TerserPlugin()
+    ] : [],
   },
 });
 

package/dist/const/simpleSelection.const.d.ts

@@ -1,6 +0,0 @@
-import { ISimpleSelectLocale, ISimpleSelectOptions } from '../types/simpleSelect.types';
-export declare const simpleSelectLocale: ISimpleSelectLocale;
-export declare const simpleSelectionOptions: ISimpleSelectOptions;
-export declare const nameSelect = "SimSel";
-export declare const nameMark = "simple-select-init";
-export declare const initClass = "SimpleSel";

package/dist/main.css

@@ -1 +0,0 @@
-:root{--simpS_bg:#fff;--simpS_pad_hor:15px;--simpS_height_top:40px;--simpS_color:#27272a;--simpS_color_light:#eae9e9;--simpS_color_cheked:#d9d7d7;--simpS_color_yes:green;--simpS_color_no:red;--simpS_color_placeholder:#5d5c5c;--simpS_color_dis:#8b8b8b;--simpS_radius:4px;--simpS_f_size:16px;--simpS_f_shadow:0 0 3px 0 var(--simpS_color);--simpS_size_check:20px;--simpS_li_h:36px;--simpS_btn_h:34px;--simpS_btn_bg:#f9f9f9;--simpS_btn_bg_reverse:#eeecec}.SimpleSel{-webkit-box-sizing:border-box;box-sizing:border-box;color:#27272a;color:var(--simpS_color);font-size:16px;font-size:var(--simpS_f_size);position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.SimpleSel--disabled{color:#8b8b8b;color:var(--simpS_color_dis);opacity:.8}.SimpleSel *,.SimpleSel :after,.SimpleSel :before,.SimpleSel__select_init{-webkit-box-sizing:border-box;box-sizing:border-box}.SimpleSel__select_init{height:100%;opacity:0;position:absolute;right:0;top:0;width:100%}.SimpleSel__select_init--native{z-index:5}.SimpleSel__bottom_control,.SimpleSel__control{-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-ms-flex-line-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-content:center;align-items:center;-webkit-appearance:none;background-color:#f9f9f9;background-color:var(--simpS_btn_bg);border:none;border-radius:0;color:inherit;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;font:inherit;height:34px;height:var(--simpS_btn_h);justify-content:center;line-height:normal;margin:0;outline:none;overflow:visible;padding:1px 10px;text-align:center;width:auto}.SimpleSel__bottom_control:hover,.SimpleSel__control:hover{background-color:#eeecec;background-color:var(--simpS_btn_bg_reverse)}.SimpleSel__list_item_icon,.SimpleSel__reset_all__icon,.SimpleSel__select_all__icon{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;border:1px solid;border-radius:4px;border-radius:var(--simpS_radius);display:-webkit-box;display:-ms-flexbox;display:flex;height:20px;height:var(--simpS_size_check);justify-content:center;margin-right:7px;position:relative;width:20px;width:var(--simpS_size_check)}.SimpleSel__list_item_icon:before,.SimpleSel__select_all__icon:before{border:solid;border-width:0 2px 2px 0;content:"";display:block;height:11px;height:calc(var(--simpS_size_check)/2 + 1px);left:4px;top:1px;-webkit-transform:rotate(45deg) translate(-17%,-10%);transform:rotate(45deg) translate(-17%,-10%);-webkit-transition:all .25s;transition:all .25s;width:6.66667px;width:calc(var(--simpS_size_check)/3)}.SimpleSel__top{position:relative}.SimpleSel__top_body{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;background-color:#fff;background-color:var(--simpS_bg);border:2px solid;border-radius:4px;border-radius:var(--simpS_radius);color:currentColor;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:40px;height:var(--simpS_height_top);justify-content:space-between;padding:5px 0 5px 15px;padding:5px 0 5px var(--simpS_pad_hor);position:relative}.SimpleSel--disabled .SimpleSel__top_body{cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.SimpleSel__top_body:focus-visible{-webkit-box-shadow:0 0 3px 0 #27272a;box-shadow:0 0 3px 0 #27272a;-webkit-box-shadow:var(--simpS_f_shadow);box-shadow:var(--simpS_f_shadow)}.SimpleSel__title{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.SimpleSel__icon{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;height:40px;height:var(--simpS_height_top);justify-content:center;position:relative;width:40px;width:var(--simpS_height_top)}.SimpleSel__icon:after{border-bottom:2px solid;border-right:2px solid;content:"";display:inline;height:.5em;left:50%;position:absolute;top:calc(50% - 2px);-webkit-transform:rotate(45deg) translate(-50%,-50%);transform:rotate(45deg) translate(-50%,-50%);-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:transform .25s,top .25s;transition:transform .25s,top .25s;width:.5em}.SimpleSel--open .SimpleSel__icon:after{top:calc(50% + 2px);-webkit-transform:rotate(225deg) translate(-50%,-50%);transform:rotate(225deg) translate(-50%,-50%)}.SimpleSel--single[data-count-checked-full="0"] .SimpleSel__title,.SimpleSel__list_item--not_value,.SimpleSel__title--placeholder{color:#5d5c5c;color:var(--simpS_color_placeholder)}.SimpleSel__body{background-color:#fff;background-color:var(--simpS_bg);border:1px solid;border-radius:4px;border-radius:var(--simpS_radius);max-height:0;opacity:0;overflow:hidden;overflow-y:auto;position:absolute;-webkit-transition:max-height .25s,opacity .1s;transition:max-height .25s,opacity .1s;width:100%;z-index:3}.SimpleSel:not(.SimpleSel--up) .SimpleSel--multi{margin-top:2px;top:100%}.SimpleSel--up:not(.SimpleSel--float) .SimpleSel__body{bottom:100%;margin-bottom:2px}.SimpleSel--open .SimpleSel__body{max-height:230px;opacity:1}.SimpleSel__search{border-radius:4px;border-radius:var(--simpS_radius);padding:2px 15px;padding:2px var(--simpS_pad_hor);width:100%}.SimpleSel__search--top{display:none;height:100%;left:0;opacity:0;position:absolute;top:0}.SimpleSel--open .SimpleSel__search--top{display:block;opacity:1}.SimpleSel__search--dropdown{border:none;border-bottom:1px solid;border-radius:0;height:34px;height:var(--simpS_btn_h)}.SimpleSel__controls{border-bottom:1px solid;display:-webkit-box;display:-ms-flexbox;display:flex}.SimpleSel__control{-webkit-box-flex:1;-ms-flex:1;flex:1}.SimpleSel__control+.SimpleSel__control{border-left:1px solid}.SimpleSel__select_all__icon{border-color:green;border-color:var(--simpS_color_yes);border-radius:50%;color:#d9d7d7;color:var(--simpS_color_cheked)}.SimpleSel[data-count-checked-full="0"] .SimpleSel__select_all__icon{color:#eae9e9;color:var(--simpS_color_light)}.SimpleSel[data-check-all-multi=yes] .SimpleSel__select_all__icon{color:green;color:var(--simpS_color_yes)}.SimpleSel__reset_all__icon{border-radius:50%;color:red;color:var(--simpS_color_no);position:relative}.SimpleSel__reset_all__icon:after,.SimpleSel__reset_all__icon:before{background-color:currentColor;content:" ";height:60%;left:8px;left:calc(var(--simpS_f_size)/2);position:absolute;width:2px}.SimpleSel__reset_all__icon:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.SimpleSel__reset_all__icon:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.SimpleSel__bottom_controls{border-top:1px solid;bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:5px;position:sticky}.SimpleSel__bottom_control--hide{display:none}.SimpleSel__bottom_control{-webkit-box-flex:1;-ms-flex:1;flex:1}.SimpleSel__bottom_control--ok{text-transform:uppercase}.SimpleSel__bottom_control+.SimpleSel__bottom_control{border-left:1px solid}.SimpleSel__list{list-style-type:none;margin:0;padding:0}.SimpleSel__group_items:not(:first-child){margin-top:5px}.SimpleSel__group_title{background-color:#eae9e9;background-color:var(--simpS_color_light);display:block;font-size:1.02em;font-weight:700;margin-bottom:2px;padding:6px 10px}.SimpleSel__group{list-style-type:none;margin:0;padding:0}.SimpleSel__list_item{cursor:pointer}.SimpleSel__list_item:not(:last-child){border-bottom:1px solid #eae9e9;border-bottom:1px solid var(--simpS_color_light)}.SimpleSel__list_item--disabled{cursor:default;opacity:.5}.SimpleSel__list_item_body{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;min-height:36px;min-height:var(--simpS_li_h);padding:5px 15px;padding:5px var(--simpS_pad_hor)}.SimpleSel__list_item_body:hover{background-color:#eae9e9;background-color:var(--simpS_color_light)}.SimpleSel--single .SimpleSel__list_item--checked{background-color:#d9d7d7;background-color:var(--simpS_color_cheked)}.SimpleSel__list_item:not(.SimpleSel__list_item--checked) .SimpleSel__list_item_icon:before{height:0;opacity:0;width:0}.SimpleSel__close{display:none}.SimpleSel--body_open{overflow:hidden;position:relative}.SimpleSel--float .SimpleSel__body{-webkit-box-orient:vertical;-webkit-box-direction:normal;display:none;-ms-flex-direction:column;flex-direction:column;left:50%;max-height:90%;max-width:90%;overflow:hidden;overflow-y:auto;position:fixed;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.SimpleSel--open{z-index:7}.SimpleSel--float .SimpleSel__bottom_control--hide,.SimpleSel--float.SimpleSel--open .SimpleSel__body{display:-webkit-box;display:-ms-flexbox;display:flex}.SimpleSel--float .SimpleSel__list{-webkit-box-flex:1;-ms-flex:1;flex:1}

package/dist/simpleSelect.d.ts

@@ -1,40 +0,0 @@
-import { ISimpleSelectOptions, ISimpleSelectProps } from './types/simpleSelect.types';
-import { selectorType } from './types/item.types';
-import { SimpleSelectItem } from './simpleSelectItem';
-import './style.css';
-export default class SimpleSelect {
-    callCount: number;
-    countInit: number;
-    $selects: SimpleSelectItem[];
-    options: ISimpleSelectOptions;
-    nameMarkTransform: string;
-    dataNameMark: string;
-    isNative: boolean;
-    constructor(selector: selectorType, options?: ISimpleSelectProps);
-    detectMobile(): void;
-    private init;
-    createMethods(select: SimpleSelectItem): {
-        getInstance: () => HTMLSelectElement;
-        reload(): void;
-        update(): void;
-        detach(): void;
-    };
-    setMethods(select: SimpleSelectItem): void;
-    setMethodsClear(select: SimpleSelectItem): void;
-    private build;
-    private detach;
-    rebuild(selectsItems: SimpleSelectItem): void;
-    getSelects(): SimpleSelectItem[];
-    getSelectFirst(): {
-        getInstance: () => HTMLSelectElement;
-        reload(): void;
-        update(): void;
-        detach(): void;
-    };
-    getSelectById(id: string): {
-        getInstance: () => HTMLSelectElement;
-        reload(): void;
-        update(): void;
-        detach(): void;
-    } | null;
-}

package/dist/simpleSelectItem.d.ts

@@ -1,49 +0,0 @@
-/// <reference types="node" />
-import { IItemLocalOptions, ISimpleSelectOptions } from './types/simpleSelect.types';
-import { SimpleSelectItemDOM } from './simpleSelectItemDOM';
-export declare class SimpleSelectItem extends SimpleSelectItemDOM {
-    closeOutsideHandler: (e: MouseEvent) => void;
-    closeEscHandler: (e: KeyboardEvent) => void;
-    changeListener: (e: Event) => void;
-    searchHandler: (e: Event) => void;
-    clickToggleOpen: (e: MouseEvent | KeyboardEvent) => void;
-    triggerSetup: (e: MouseEvent) => void;
-    confirmOkHandler: (e: MouseEvent) => void;
-    confirmNoHandler: (e: MouseEvent) => void;
-    selectAllHandler: (e: MouseEvent) => void;
-    resetAllHandler: (e: MouseEvent) => void;
-    closeHandler: (e: MouseEvent) => void;
-    handleResize: (e: MediaQueryList | null) => void;
-    mql: MediaQueryList | null;
-    countOpen: number;
-    multiDebounceTime: number;
-    timeoutDebounceId: NodeJS.Timeout | null;
-    constructor(select: HTMLSelectElement, options: ISimpleSelectOptions, localOptions: IItemLocalOptions);
-    init(): void;
-    private handleResizeInit;
-    private initAfterDom;
-    debounce<T extends (...args: never[]) => void>(func: T, delay: number): (...args: Parameters<T>) => void;
-    confirmOkHandlerInit(e: MouseEvent): void;
-    confirmOkBuild(): void;
-    confirmNoHandlerInit(e: MouseEvent): void;
-    closeHandlerInit(e: MouseEvent): void;
-    selectAllHandlerInit(e: MouseEvent): void;
-    resetAllHandlerInit(e: MouseEvent): void;
-    triggerSetupInit(e: MouseEvent): void;
-    changeClickItem(item: HTMLLIElement): void;
-    multiDebounceChange(): void;
-    triggerInit(): void;
-    clickToggleOpenInit(e: MouseEvent | KeyboardEvent): void;
-    closeOutsideHandlerInit(e: MouseEvent): void;
-    closeEscHandlerInit(e: KeyboardEvent): void;
-    keyBoardChangeChecked(isDown: boolean): void;
-    searchHandlerInit(e: Event): void;
-    toggleOpenHandler(): void;
-    private changeListenerInit;
-    getSelect(): HTMLSelectElement;
-    protected handlerChangeChecked(): void;
-    protected createList(isCompare?: boolean): void;
-    private filterList;
-    inputSearchHandler(): void;
-    detachItem(): void;
-}

package/dist/simpleSelectItemDOM.d.ts

@@ -1,57 +0,0 @@
-import { IItemLocalOptions, ISimpleSelectOptions } from './types/simpleSelect.types';
-import { IOptionItem } from './types/item.types';
-export declare class SimpleSelectItemDOM {
-    options: ISimpleSelectOptions;
-    $select: HTMLSelectElement;
-    id: string;
-    titlePlaceholder: string;
-    isDisabled: boolean;
-    isMulti: boolean;
-    state: {
-        getState: (k?: string | undefined) => any;
-        setState: (k: string, val: any) => void;
-        subscribe(k: string, cb: any): () => void;
-        subscribeAll(cb: any): () => void;
-        unSubscribe(k: string, cb: any): void;
-    };
-    classSelectInit: string;
-    isNative: boolean;
-    elemWrap: HTMLDivElement;
-    elemTop: HTMLDivElement;
-    elemTopBody: HTMLDivElement;
-    elemDropDown: HTMLDivElement | null;
-    elemDropDownClose: HTMLButtonElement | null;
-    elemListBody: HTMLUListElement | null;
-    elemInputSearch: HTMLInputElement | null;
-    elemTitle: HTMLDivElement;
-    confirmOk: HTMLButtonElement | null;
-    confirmNo: HTMLButtonElement | null;
-    elemControl: HTMLDivElement | null;
-    elemSelectAll: HTMLButtonElement | null;
-    elemResetAll: HTMLButtonElement | null;
-    cloneClasses: string;
-    isShowCheckbox: boolean;
-    bodyLiHTMLBeforeFromSelect: null | string;
-    bodyLiHTMLAfterFromSelect: null | string;
-    isFloatWidth: boolean;
-    bodyOpenClass: string;
-    constructor(select: HTMLSelectElement, options: ISimpleSelectOptions, localOptions: IItemLocalOptions);
-    optionOverride(): void;
-    initDom(): void;
-    toggleTabIndex(isOpen: boolean): void;
-    updateHTML(): void;
-    private createHTML;
-    private createControlHTML;
-    private createIcon;
-    private createDropDown;
-    private createIsConfirmInMultiHTML;
-    private createTitleHTML;
-    protected createListHTML(): void;
-    private createInputHTML;
-    getChecked(): IOptionItem[];
-    private createLi;
-    private createLiBody;
-    protected handlerChangeChecked(): void;
-    protected createList(_isCompare: boolean): void;
-    protected inputSearchHandler(): void;
-}

package/dist/types/item.types.d.ts

@@ -1,24 +0,0 @@
-export interface IOptionItem {
-    id: string;
-    title: string;
-    value: string | null;
-    checked: boolean;
-    disabled: boolean;
-    position: number;
-    isShowFilter: boolean;
-}
-export interface IOptionItems {
-    idGroup: string;
-    isGroup: boolean;
-    titleGroup?: string;
-    isDisabledGroup?: boolean;
-    items: IOptionItem[];
-    isShowFilter: boolean;
-}
-export interface ICreateLiReturn {
-    result: string;
-    countShow: number;
-    countChecked: number;
-    countCheckedFull: number;
-}
-export type selectorType = string | HTMLSelectElement | NodeListOf<HTMLSelectElement> | HTMLSelectElement[];

package/dist/types/simpleSelect.types.d.ts

@@ -1,44 +0,0 @@
-import { SimpleSelectItem } from '../simpleSelectItem';
-export interface ISimpleSelectLocale {
-    noSearch: string;
-    searchText: string;
-    title: string;
-    selected: string;
-    all: string;
-    ok: string;
-    cansel: string;
-    resetAll: string;
-    selectAll: string;
-}
-export interface ISimpleSelectOptions {
-    countShowSelected: number;
-    isConfirmInMulti: boolean;
-    isConfirmInMultiOkClickOutside: boolean;
-    isSearch: boolean;
-    isSearchInDropdown: boolean;
-    nativeOnDevice: string[];
-    locale: ISimpleSelectLocale;
-    debounceTime?: number;
-    floatWidth?: number;
-    sepChars: string;
-    selectAll: boolean;
-    selectAllAfterClose: boolean;
-    resetAll: boolean;
-    resetAllAfterClose: boolean;
-    isCloneClass: boolean;
-    isUp: boolean;
-    detectNative?: () => boolean;
-    callbackInitialization?: (item: SimpleSelectItem) => void;
-    callbackInitialized?: (item: SimpleSelectItem) => void;
-    callbackOpen?: (item: SimpleSelectItem) => void;
-    callbackClose?: (item: SimpleSelectItem) => void;
-    callbackDestroyInit?: (item: SimpleSelectItem) => void;
-    callbackDestroy?: (item: SimpleSelectItem) => void;
-    callbackChangeSelect?: (e: Event, item: SimpleSelectItem) => void;
-    changeBodyLi?: (liBody: HTMLDivElement, option: HTMLOptionElement) => HTMLElement | string;
-}
-export interface IItemLocalOptions {
-    id: string;
-    isNative: boolean;
-}
-export type ISimpleSelectProps = Partial<ISimpleSelectOptions>;

package/dist/utils/simpleSelection.utils.d.ts

@@ -1,10 +0,0 @@
-import { IOptionItems } from '../types/item.types';
-export declare const toCamelCase: (input: string) => string;
-export declare const createDataAttr: (name: string) => string;
-export declare const ifTrueDataAttr: (attr: string | null) => boolean;
-export declare function triggerInputEvent(element: HTMLElement, type?: string): void;
-export declare const getCreateListItem: (item: HTMLSelectElement | HTMLOptGroupElement, idGroup: string, isGroup: boolean) => IOptionItems;
-export declare const getClass: (cls: string, mod?: boolean, classInit?: string) => string;
-export declare const compareObj: <T1, T2>(obj1: T1, obj2: T2) => boolean;
-export declare const cloneObj: <T>(obj: T) => T;
-export declare const createButton: () => HTMLButtonElement;

package/dist/utils/store.d.ts

@@ -1,7 +0,0 @@
-export declare function store<T>(obj: T): {
-    getState: (k?: string) => any;
-    setState: (k: string, val: any) => void;
-    subscribe(k: string, cb: any): () => void;
-    subscribeAll(cb: any): () => void;
-    unSubscribe(k: string, cb: any): void;
-};