@jblehm/super-list 1.0.5

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.
package/README.md ADDED
@@ -0,0 +1,2 @@
1
+ # superlist V1.0.5
2
+ An un-styled text searchable combobox
@@ -0,0 +1,45 @@
1
+ export interface DocumentViewChangeListener {
2
+ targetNode: HTMLElement;
3
+ observe(): void;
4
+ unobserve(): void;
5
+ pauseMutationObserver(): void;
6
+ unpauseMutationObserver(): void;
7
+ }
8
+ export declare class DocumentViewChangeListener implements DocumentViewChangeListener {
9
+ private readonly eventsTypes;
10
+ private readonly config;
11
+ private mutationObserver;
12
+ private callbackFunction;
13
+ constructor(targetFunction: Function, targetNode?: any);
14
+ private addListener;
15
+ private removeListener;
16
+ private addTransitionEndListener;
17
+ private removeTransitionEndListener;
18
+ private addResizeListener;
19
+ private removeResizeListener;
20
+ }
21
+ export declare function getLabelString(value: string | number | object | null | undefined, customLabelGetFunction: Function | null | undefined, objectLabelKeyName: string | null, enumKeyToLabelObjectArray?: EnumType[]): string;
22
+ export type ListRequest = (maxNumItems: number, stringFilter?: string) => Promise<DataSet<any>>;
23
+ export type EnumType = {
24
+ type: String;
25
+ label: String;
26
+ };
27
+ export type DataSet<T> = {
28
+ data: T[];
29
+ totalNum: number;
30
+ modelName?: string;
31
+ };
32
+ export interface AbortablePromise {
33
+ abortController: AbortController;
34
+ func: Function;
35
+ then: Function;
36
+ }
37
+ export declare class AbortablePromise implements AbortablePromise {
38
+ constructor();
39
+ abortablePromise(signal: AbortSignal, asyncFunc: Function, then: Function): Promise<any>;
40
+ setFunc(func: Function): void;
41
+ setThen(then: Function): void;
42
+ execute(): Promise<any>;
43
+ abort(reason?: string): void;
44
+ resetAndExecute(func: Function, then: Function): Promise<any>;
45
+ }
@@ -0,0 +1,124 @@
1
+ import { type PropType } from 'vue';
2
+ declare function __VLS_template(): {
3
+ slots: {
4
+ default?(_: {}): any;
5
+ };
6
+ refs: {
7
+ dropDownButtonContainer: HTMLDivElement;
8
+ listContainerRef: HTMLDivElement;
9
+ dropDownListUL: HTMLUListElement;
10
+ };
11
+ attrs: Partial<{}>;
12
+ };
13
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
14
+ declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
15
+ mouseHoveringOnList: {
16
+ type: BooleanConstructor;
17
+ default: boolean;
18
+ };
19
+ filteredListItems: {
20
+ type: ArrayConstructor;
21
+ default: () => never[];
22
+ };
23
+ focusedIndex: {
24
+ type: NumberConstructor;
25
+ default: null;
26
+ };
27
+ selectedIndex: {
28
+ type: NumberConstructor;
29
+ default: null;
30
+ };
31
+ parentMethods: {
32
+ type: ObjectConstructor;
33
+ required: true;
34
+ };
35
+ showDropDown: {
36
+ type: BooleanConstructor;
37
+ required: true;
38
+ };
39
+ maxListHeightPX: {
40
+ type: NumberConstructor;
41
+ required: true;
42
+ };
43
+ listAnimationDurationMs: {
44
+ type: PropType<number>;
45
+ required: true;
46
+ };
47
+ blockListChange: {
48
+ type: BooleanConstructor;
49
+ required: true;
50
+ };
51
+ totalOptionsCount: {
52
+ type: NumberConstructor;
53
+ default: number;
54
+ };
55
+ enableScrollClose: {
56
+ type: BooleanConstructor;
57
+ default: boolean;
58
+ };
59
+ }>, {
60
+ listContainerRef: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
61
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
62
+ reverseDropDownList: (...args: any[]) => void;
63
+ }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
64
+ mouseHoveringOnList: {
65
+ type: BooleanConstructor;
66
+ default: boolean;
67
+ };
68
+ filteredListItems: {
69
+ type: ArrayConstructor;
70
+ default: () => never[];
71
+ };
72
+ focusedIndex: {
73
+ type: NumberConstructor;
74
+ default: null;
75
+ };
76
+ selectedIndex: {
77
+ type: NumberConstructor;
78
+ default: null;
79
+ };
80
+ parentMethods: {
81
+ type: ObjectConstructor;
82
+ required: true;
83
+ };
84
+ showDropDown: {
85
+ type: BooleanConstructor;
86
+ required: true;
87
+ };
88
+ maxListHeightPX: {
89
+ type: NumberConstructor;
90
+ required: true;
91
+ };
92
+ listAnimationDurationMs: {
93
+ type: PropType<number>;
94
+ required: true;
95
+ };
96
+ blockListChange: {
97
+ type: BooleanConstructor;
98
+ required: true;
99
+ };
100
+ totalOptionsCount: {
101
+ type: NumberConstructor;
102
+ default: number;
103
+ };
104
+ enableScrollClose: {
105
+ type: BooleanConstructor;
106
+ default: boolean;
107
+ };
108
+ }>> & Readonly<{
109
+ onReverseDropDownList?: ((...args: any[]) => any) | undefined;
110
+ }>, {
111
+ mouseHoveringOnList: boolean;
112
+ filteredListItems: unknown[];
113
+ focusedIndex: number;
114
+ selectedIndex: number;
115
+ totalOptionsCount: number;
116
+ enableScrollClose: boolean;
117
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
118
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
119
+ export default _default;
120
+ type __VLS_WithTemplateSlots<T, S> = T & {
121
+ new (): {
122
+ $slots: S;
123
+ };
124
+ };
@@ -0,0 +1,61 @@
1
+ import { type PropType } from 'vue';
2
+ declare function __VLS_template(): {
3
+ slots: {
4
+ default?(_: {}): any;
5
+ };
6
+ refs: {};
7
+ attrs: Partial<{}>;
8
+ };
9
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
10
+ declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
11
+ parentMethods: {
12
+ type: ObjectConstructor;
13
+ required: true;
14
+ };
15
+ showDropDown: {
16
+ type: BooleanConstructor;
17
+ required: true;
18
+ };
19
+ enableTextFilter: {
20
+ type: BooleanConstructor;
21
+ required: true;
22
+ };
23
+ customIcon: {
24
+ default: null;
25
+ type: PropType<object | Function | null>;
26
+ };
27
+ reverseDropDownList: {
28
+ type: BooleanConstructor;
29
+ required: true;
30
+ };
31
+ }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
32
+ parentMethods: {
33
+ type: ObjectConstructor;
34
+ required: true;
35
+ };
36
+ showDropDown: {
37
+ type: BooleanConstructor;
38
+ required: true;
39
+ };
40
+ enableTextFilter: {
41
+ type: BooleanConstructor;
42
+ required: true;
43
+ };
44
+ customIcon: {
45
+ default: null;
46
+ type: PropType<object | Function | null>;
47
+ };
48
+ reverseDropDownList: {
49
+ type: BooleanConstructor;
50
+ required: true;
51
+ };
52
+ }>> & Readonly<{}>, {
53
+ customIcon: object | Function | null;
54
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
55
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
56
+ export default _default;
57
+ type __VLS_WithTemplateSlots<T, S> = T & {
58
+ new (): {
59
+ $slots: S;
60
+ };
61
+ };
@@ -0,0 +1,78 @@
1
+ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
2
+ mouseHoveringOnList: {
3
+ type: BooleanConstructor;
4
+ default: boolean;
5
+ };
6
+ filteredListItems: {
7
+ type: ArrayConstructor;
8
+ default: () => never[];
9
+ };
10
+ focusedIndex: {
11
+ type: NumberConstructor;
12
+ default: null;
13
+ };
14
+ selectedIndex: {
15
+ type: NumberConstructor;
16
+ default: null;
17
+ };
18
+ listElementOpenAndVisible: {
19
+ type: BooleanConstructor;
20
+ default: boolean;
21
+ };
22
+ parentMethods: {
23
+ type: ObjectConstructor;
24
+ required: true;
25
+ };
26
+ showDropDown: {
27
+ type: BooleanConstructor;
28
+ default: boolean;
29
+ };
30
+ totalOptionsCount: {
31
+ type: NumberConstructor;
32
+ default: number;
33
+ };
34
+ }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
35
+ mouseHoveringOnList: {
36
+ type: BooleanConstructor;
37
+ default: boolean;
38
+ };
39
+ filteredListItems: {
40
+ type: ArrayConstructor;
41
+ default: () => never[];
42
+ };
43
+ focusedIndex: {
44
+ type: NumberConstructor;
45
+ default: null;
46
+ };
47
+ selectedIndex: {
48
+ type: NumberConstructor;
49
+ default: null;
50
+ };
51
+ listElementOpenAndVisible: {
52
+ type: BooleanConstructor;
53
+ default: boolean;
54
+ };
55
+ parentMethods: {
56
+ type: ObjectConstructor;
57
+ required: true;
58
+ };
59
+ showDropDown: {
60
+ type: BooleanConstructor;
61
+ default: boolean;
62
+ };
63
+ totalOptionsCount: {
64
+ type: NumberConstructor;
65
+ default: number;
66
+ };
67
+ }>> & Readonly<{}>, {
68
+ showDropDown: boolean;
69
+ mouseHoveringOnList: boolean;
70
+ filteredListItems: unknown[];
71
+ focusedIndex: number;
72
+ selectedIndex: number;
73
+ listElementOpenAndVisible: boolean;
74
+ totalOptionsCount: number;
75
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {
76
+ items: HTMLLIElement;
77
+ }, any>;
78
+ export default _default;
@@ -0,0 +1,62 @@
1
+ import { type PropType } from 'vue';
2
+ declare function blurInput(): void;
3
+ declare function focusInput(): void;
4
+ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
5
+ enableTextFilter: {
6
+ type: PropType<boolean | null>;
7
+ required: true;
8
+ };
9
+ placeholder: {
10
+ type: PropType<string | undefined>;
11
+ default: undefined;
12
+ };
13
+ enableButtonClick: {
14
+ type: PropType<boolean | null>;
15
+ default: boolean;
16
+ };
17
+ parentMethods: {
18
+ type: ObjectConstructor;
19
+ required: true;
20
+ };
21
+ showDropDown: {
22
+ type: BooleanConstructor;
23
+ required: true;
24
+ };
25
+ }>, {
26
+ blurInput: typeof blurInput;
27
+ focusInput: typeof focusInput;
28
+ textInputRef: import("vue").Ref<null, null>;
29
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
30
+ "update:selected": (...args: any[]) => void;
31
+ "update:query": (...args: any[]) => void;
32
+ "update:press": (...args: any[]) => void;
33
+ }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
34
+ enableTextFilter: {
35
+ type: PropType<boolean | null>;
36
+ required: true;
37
+ };
38
+ placeholder: {
39
+ type: PropType<string | undefined>;
40
+ default: undefined;
41
+ };
42
+ enableButtonClick: {
43
+ type: PropType<boolean | null>;
44
+ default: boolean;
45
+ };
46
+ parentMethods: {
47
+ type: ObjectConstructor;
48
+ required: true;
49
+ };
50
+ showDropDown: {
51
+ type: BooleanConstructor;
52
+ required: true;
53
+ };
54
+ }>> & Readonly<{
55
+ "onUpdate:selected"?: ((...args: any[]) => any) | undefined;
56
+ "onUpdate:query"?: ((...args: any[]) => any) | undefined;
57
+ "onUpdate:press"?: ((...args: any[]) => any) | undefined;
58
+ }>, {
59
+ placeholder: string | undefined;
60
+ enableButtonClick: boolean | null;
61
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
62
+ export default _default;
@@ -0,0 +1,2 @@
1
+ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
2
+ export default _default;
@@ -0,0 +1,2 @@
1
+ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
2
+ export default _default;
package/dist/index.css ADDED
@@ -0,0 +1 @@
1
+ .list-filter-text-input[data-v-18c89a96]{color:var(--superlist-text-colour, rgb(17, 24, 39));text-align:center;padding:.125rem 2rem .125rem .5rem!important;width:100%;height:100%;margin:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:transparent;border:0 none;pointer-events:auto;cursor:text}.list-filter-text-input[data-v-18c89a96]:focus,.list-filter-text-input[data-v-18c89a96]:focus-visible,.list-filter-text-input[data-v-18c89a96]:active{text-align:left}.click-through[data-v-18c89a96]{pointer-events:none}.dark-placeholder-text[data-v-18c89a96]::placeholder{color:var(--superlist-text-colour, rgb(17, 24, 39))}.light-placeholder-text[data-v-18c89a96]::placeholder{color:var(--superlist-disabled-text-colour, rgb(120, 125, 130))}.text-filter-disabled[data-v-18c89a96]{background-color:transparent;border:none;outline:none;box-shadow:none;filter:none}@media (min-width: 640px){.list-filter-text-input[data-v-18c89a96]{font-size:.875rem;line-height:1.5rem}}.list-option[data-v-9b370840]{text-transform:capitalize;display:inline-flex;width:100%;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:transparent;color:var(--superlist-text-colour, rgb(55, 60, 65));transition-property:font-weight,background-color,color,text-shadow;transition-duration:.5s;transition-timing-function:ease;font-weight:400;text-shadow:1px 1px 3px var(--superlist-background-colour, white)}.list-option[data-v-9b370840]:focus-visible,.list-option>span[data-v-9b370840]:focus-visible{outline:none}.list-option-selected[data-v-9b370840]{font-weight:600}.list-option-message[data-v-9b370840]{text-shadow:1px 1px 3px var(--superlist-background-colour, white);text-transform:capitalize;display:inline-flex;width:100%;position:relative;cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:transparent;color:var(--superlist-disabled-text-colour, rgb(120, 125, 130))}.list-option-active[data-v-9b370840]:hover,.list-option-active[data-v-9b370840],.list-option-selected[data-v-9b370840]:hover,.list-option[data-v-9b370840]:hover{font-weight:600;background-color:var(--superlist-theme-colour, rgb(77, 168, 11, .8));color:var(--superlist-background-colour, white);text-shadow:1px 1px 3px var(--superlist-theme-colour, rgb(77, 168, 11, .8));transition-duration:0s!important}.list-item-icon[data-v-9b370840]{display:flex;height:1rem;width:1rem;position:absolute;right:.7rem;margin-top:-.1rem;align-self:center}.list-item-span[data-v-9b370840]{padding:.5rem .75rem;width:100%;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-item-extra-padding[data-v-9b370840]{padding-right:1.75rem}.list-normal[data-v-02d0c000]{top:var(--parent-y)}.list-reverse[data-v-02d0c000]{bottom:var(--parent-y)}.select-list[data-v-02d0c000]{--parent-width: var(--1c26e35a);--parent-x: var(--3a8b91f6);--parent-y: var(--3a8b8a74);--duration: var(--3f1664b2);--border-radius: var(--superlist-list-border-radius, 0);border-radius:var(--border-radius);width:var(--parent-width);min-width:var(--parent-width);left:var(--parent-x);display:block;transition-property:max-height,box-shadow,opacity,visibility,filter,drop-shadow;transition-duration:var(--duration, .3s);transition-timing-function:cubic-bezier(.1,.9,.35,.98);position:absolute;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);background-color:#ffffffb3;align-items:baseline;opacity:.25;z-index:999;visibility:collapse;overflow:auto;max-height:0;border:none!important}.select-list.select-list-scrollable[data-v-02d0c000]{border-radius:var(--border-radius) 0 0 var(--border-radius)}.select-list[data-v-02d0c000]:focus-visible,.select-list>ul[data-v-02d0c000]:focus-visible,.super-list-button-container[data-v-02d0c000]:focus-visible{outline:none}.super-list-button-container[data-v-02d0c000]{height:100%;width:100%}.select-list.select-list-open[data-v-02d0c000]{z-index:999999;--max-height: var(--c180c800);max-height:var(--max-height, 0)}.select-list.no-scroll[data-v-02d0c000]{overflow:hidden}.select-list-fixed[data-v-02d0c000]{position:fixed;opacity:1;visibility:visible;border:initial!important}.list-content[data-v-02d0c000]{--duration: var(--3f1664b2);overflow:visible;margin:0;padding:0;border-style:none;color:var(--superlist-text-colour, rgb(55, 60, 65));list-style:none;max-width:100%}@media (min-width: 640px){.list-content[data-v-02d0c000]{font-size:.875rem;line-height:1.25rem}}.list-button-icon[data-v-f5167d40]{display:flex;transition-timing-function:ease-in-out;transition-duration:.2s;transition-property:transform;width:.6rem;transform:rotate(0);color:var(--superlist-text-colour, rgb(17, 24, 39));justify-content:center;max-height:18%}.list-button-icon.custom-icon[data-v-f5167d40]{max-height:100%;width:1.25rem}.list-button-icon.rotate-180[data-v-f5167d40]{transform:rotate(180deg)}.list-button[data-v-f5167d40]{position:relative;padding:0;margin:0;width:100%;max-height:100%;height:100%;background-color:var(--superlist-background-colour, white);align-items:center;pointer-events:auto;cursor:pointer}.list-button[data-v-f5167d40]:focus,.list-button[data-v-f5167d40]:focus-visible,.list-button[data-v-f5167d40]:active{text-align:left}.list-button-icon-div[data-v-f5167d40]{pointer-events:none;position:absolute;top:0;bottom:0;right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-right:.75rem;max-height:100%;height:100%;gap:max(.15rem,calc(6.25% + .075rem));transition:gap .2s}.list-button-icon-div.bigger-gap[data-v-f5167d40]{gap:calc(40% - .25rem)}.click-through[data-v-f5167d40]{pointer-events:none}[data-v-f0f16320]{box-sizing:border-box}
@@ -0,0 +1,2 @@
1
+ import SuperList from './super-list.vue';
2
+ export default SuperList;
package/dist/main.d.ts ADDED
@@ -0,0 +1 @@
1
+ export {};