slim-select 2.2.0 → 2.2.2

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.
Files changed (118) hide show
  1. package/dist/helpers.d.ts +1 -0
  2. package/dist/index.d.ts +1 -1
  3. package/dist/select.d.ts +1 -1
  4. package/dist/slimselect.cjs.js +62 -40
  5. package/dist/slimselect.es.js +62 -40
  6. package/dist/slimselect.global.js +62 -40
  7. package/dist/slimselect.js +62 -40
  8. package/dist/slimselect.min.js +1 -1
  9. package/dist/slimselect.umd.js +62 -40
  10. package/dist/slimselect.umd.min.js +1 -1
  11. package/package.json +1 -3
  12. package/src/slim-select/helpers.ts +4 -0
  13. package/src/slim-select/index.ts +26 -2
  14. package/src/slim-select/render.ts +5 -3
  15. package/src/slim-select/select.ts +12 -3
  16. package/src/vue/dist/slim-select/helpers.d.ts +5 -0
  17. package/src/vue/dist/slim-select/index.d.ts +45 -0
  18. package/src/vue/dist/slim-select/render.d.ts +116 -0
  19. package/src/vue/dist/slim-select/select.d.ts +33 -0
  20. package/src/vue/dist/slim-select/settings.d.ts +30 -0
  21. package/src/vue/dist/slim-select/store.d.ts +76 -0
  22. package/src/vue/dist/slimselectvue.es.js +114 -43
  23. package/src/vue/dist/slimselectvue.global.js +114 -43
  24. package/src/vue/dist/slimselectvue.ssr.js +114 -43
  25. package/src/vue/dist/vue/hello.d.ts +2 -0
  26. package/src/vue/dist/vue/slimselect.vue.d.ts +309 -0
  27. package/src/vue/package.json +2 -3
  28. package/src/vue/slimselect.vue +66 -2
  29. package/src/vue/tsconfig.json +3 -3
  30. package/tsconfig.json +9 -2
  31. package/.github/FUNDING.yml +0 -12
  32. package/.github/ISSUE_TEMPLATE/issue-report.md +0 -14
  33. package/.vscode/extensions.json +0 -3
  34. package/.vscode/settings.json +0 -17
  35. package/docs/404.html +0 -42
  36. package/docs/CNAME +0 -1
  37. package/docs/assets/check-mark.svg +0 -6
  38. package/docs/assets/data.js +0 -63
  39. package/docs/assets/home.css +0 -1
  40. package/docs/assets/home.js +0 -1
  41. package/docs/assets/index.css +0 -1
  42. package/docs/assets/index.js +0 -16
  43. package/docs/assets/index2.js +0 -358
  44. package/docs/assets/index3.js +0 -142
  45. package/docs/assets/index4.js +0 -60
  46. package/docs/assets/index5.js +0 -149
  47. package/docs/assets/install.js +0 -34
  48. package/docs/assets/selects.js +0 -55
  49. package/docs/favicon.ico +0 -0
  50. package/docs/index.html +0 -36
  51. package/public/404.html +0 -42
  52. package/public/CNAME +0 -1
  53. package/public/favicon.ico +0 -0
  54. package/slimselect.gif +0 -0
  55. package/src/docs/app.vue +0 -228
  56. package/src/docs/assets/images/check-mark.svg +0 -6
  57. package/src/docs/assets/images/chrome.svg +0 -22
  58. package/src/docs/assets/images/firefox.svg +0 -58
  59. package/src/docs/assets/images/github.png +0 -0
  60. package/src/docs/assets/images/ie.svg +0 -11
  61. package/src/docs/assets/images/npm.png +0 -0
  62. package/src/docs/assets/images/opera.svg +0 -15
  63. package/src/docs/assets/images/safari.svg +0 -22
  64. package/src/docs/assets/scss/_variables.scss +0 -26
  65. package/src/docs/assets/scss/alert.scss +0 -12
  66. package/src/docs/assets/scss/animations.scss +0 -8
  67. package/src/docs/assets/scss/button.scss +0 -21
  68. package/src/docs/assets/scss/index.scss +0 -8
  69. package/src/docs/assets/scss/input.scss +0 -3
  70. package/src/docs/assets/scss/layout.scss +0 -250
  71. package/src/docs/assets/scss/misc.scss +0 -162
  72. package/src/docs/assets/scss/prism.scss +0 -157
  73. package/src/docs/env.d.ts +0 -13
  74. package/src/docs/main.ts +0 -27
  75. package/src/docs/pages/data.vue +0 -134
  76. package/src/docs/pages/events/addable.vue +0 -95
  77. package/src/docs/pages/events/before_after_change.vue +0 -154
  78. package/src/docs/pages/events/before_after_open_close.vue +0 -122
  79. package/src/docs/pages/events/error.vue +0 -59
  80. package/src/docs/pages/events/index.vue +0 -33
  81. package/src/docs/pages/events/search.vue +0 -169
  82. package/src/docs/pages/events/search_filter.vue +0 -45
  83. package/src/docs/pages/frameworks/index.vue +0 -18
  84. package/src/docs/pages/frameworks/vue.vue +0 -407
  85. package/src/docs/pages/home.vue +0 -241
  86. package/src/docs/pages/install.vue +0 -105
  87. package/src/docs/pages/methods/destroy.vue +0 -66
  88. package/src/docs/pages/methods/enable_disable.vue +0 -70
  89. package/src/docs/pages/methods/get_data.vue +0 -82
  90. package/src/docs/pages/methods/get_selected.vue +0 -78
  91. package/src/docs/pages/methods/index.vue +0 -36
  92. package/src/docs/pages/methods/open_close.vue +0 -63
  93. package/src/docs/pages/methods/search.vue +0 -62
  94. package/src/docs/pages/methods/set_data.vue +0 -106
  95. package/src/docs/pages/methods/set_selected.vue +0 -70
  96. package/src/docs/pages/selects.vue +0 -213
  97. package/src/docs/pages/settings/always_open.vue +0 -88
  98. package/src/docs/pages/settings/closable.vue +0 -128
  99. package/src/docs/pages/settings/close_on_select.vue +0 -69
  100. package/src/docs/pages/settings/content_location.vue +0 -64
  101. package/src/docs/pages/settings/content_position.vue +0 -86
  102. package/src/docs/pages/settings/css.vue +0 -73
  103. package/src/docs/pages/settings/data_attributes.vue +0 -39
  104. package/src/docs/pages/settings/deselect.vue +0 -69
  105. package/src/docs/pages/settings/display.vue +0 -88
  106. package/src/docs/pages/settings/hide_selected.vue +0 -73
  107. package/src/docs/pages/settings/html.vue +0 -86
  108. package/src/docs/pages/settings/index.vue +0 -76
  109. package/src/docs/pages/settings/mandatory.vue +0 -91
  110. package/src/docs/pages/settings/min_max.vue +0 -61
  111. package/src/docs/pages/settings/open_position.vue +0 -60
  112. package/src/docs/pages/settings/placeholder.vue +0 -72
  113. package/src/docs/pages/settings/search.vue +0 -140
  114. package/src/docs/pages/settings/select.vue +0 -32
  115. package/src/docs/pages/settings/select_all.vue +0 -88
  116. package/src/docs/pages/settings/show_tooltip.vue +0 -44
  117. package/src/docs/pages/settings/styles.vue +0 -51
  118. package/src/docs/router.ts +0 -50
@@ -1,250 +0,0 @@
1
- @import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,700');
2
-
3
- html {
4
- height: 100%;
5
- padding: 0;
6
- margin: 0;
7
- background-color: var(--color-primary);
8
- }
9
-
10
- body {
11
- font-family: 'Montserrat', sans-serif, Helvetica;
12
- font-size: var(--font-size);
13
- color: var(--color-font);
14
- width: 100%;
15
- padding: 0;
16
- margin: 0;
17
-
18
- #app {
19
- display: grid;
20
- grid-template-columns: var(--width-nav) 1fr;
21
- grid-template-rows: calc(var(--height-header) + var(--spacing-half)) 1fr;
22
- grid-template-areas:
23
- 'header header'
24
- 'nav main';
25
- width: 100%;
26
- max-width: var(--width-max);
27
- height: 100%;
28
- padding: 0;
29
- margin: 0 auto;
30
- overflow-x: hidden;
31
- box-sizing: border-box;
32
-
33
- @media (max-width: 700px) {
34
- grid-template-columns: 1fr;
35
- grid-template-rows: calc(var(--height-header) - var(--height-nav) + var(--spacing-half)) var(--height-nav) 1fr;
36
- grid-template-areas:
37
- 'header'
38
- 'nav'
39
- 'main';
40
- }
41
-
42
- > * {
43
- box-sizing: border-box;
44
- }
45
-
46
- header {
47
- position: fixed;
48
- top: 0;
49
- grid-area: header;
50
- display: flex;
51
- flex-direction: column;
52
- justify-content: flex-end;
53
- color: var(--color-white);
54
- height: var(--height-header);
55
- width: 100%;
56
- max-width: var(--width-max);
57
- margin: 0;
58
- padding: var(--spacing-half) 0 0 0;
59
- z-index: 100000;
60
- background-color: var(--color-primary);
61
-
62
- @media (max-width: 700px) {
63
- height: calc(var(--height-header) - var(--height-nav));
64
- }
65
-
66
- .top {
67
- display: flex;
68
- flex-direction: row;
69
- justify-content: space-between;
70
- padding: 0 0 var(--spacing-half) 0;
71
-
72
- .text {
73
- flex: 1 1 auto;
74
- color: var(--color-font);
75
-
76
- .logo {
77
- line-height: 1;
78
- font-size: 40px;
79
- font-weight: 300;
80
- padding: 0;
81
- margin: 0;
82
- }
83
- }
84
-
85
- .socials {
86
- flex: 0 1 auto;
87
- display: flex;
88
- justify-content: flex-end;
89
- gap: var(--spacing-half);
90
- color: var(--color-font);
91
- margin: 0 auto;
92
- padding: var(--spacing-half) 0 0 0;
93
-
94
- a,
95
- img {
96
- height: 30px;
97
- }
98
- }
99
- }
100
-
101
- .bar {
102
- display: flex;
103
- flex-direction: row;
104
- justify-content: space-between;
105
- height: var(--height-nav);
106
- border: solid 1.5px var(--color-white);
107
-
108
- @media (max-width: 700px) {
109
- display: none;
110
- }
111
-
112
- .tagline {
113
- flex: 1 1 auto;
114
- display: inline-flex;
115
- justify-content: flex-start;
116
- align-items: center;
117
- line-height: 1;
118
- font-size: 16px;
119
- padding: var(--spacing-quarter) var(--spacing-quarter) var(--spacing-quarter) var(--spacing-half);
120
- margin: 0 auto;
121
- }
122
-
123
- .drop {
124
- display: flex;
125
- flex: 0 1 auto;
126
- border-left: solid 1.5px var(--color-white);
127
- margin: auto var(--spacing-quarter) auto var(--spacing-quarter);
128
- padding: 0 var(--spacing-quarter) 0 var(--spacing-half);
129
-
130
- svg {
131
- display: flex;
132
- align-items: center;
133
- justify-content: flex-end;
134
- flex: 0 1 auto;
135
- height: 12px;
136
- width: 12px;
137
- margin: 0 auto;
138
-
139
- path {
140
- fill: none;
141
- stroke: var(--color-white);
142
- stroke-width: 18;
143
- stroke-linecap: round;
144
- stroke-linejoin: round;
145
- }
146
- }
147
- }
148
- }
149
- }
150
-
151
- nav {
152
- position: fixed;
153
- grid-area: nav;
154
- display: flex;
155
- flex-direction: column;
156
- top: calc(var(--height-header) + var(--spacing-half));
157
- width: var(--width-nav);
158
- max-width: var(--width-max);
159
- height: calc(100vh - var(--height-header) - var(--spacing));
160
- overflow: hidden;
161
- z-index: 100000;
162
-
163
- @media (max-width: 700px) {
164
- top: calc(var(--height-header) - var(--height-nav));
165
- height: auto;
166
- width: 100%;
167
- }
168
-
169
- .ss-main {
170
- flex: 0 1 auto;
171
- height: var(--height-nav);
172
- font-weight: bold;
173
- }
174
-
175
- .nav-content {
176
- flex: 1 1 auto;
177
- overflow: hidden;
178
-
179
- @media (max-width: 700px) {
180
- display: none;
181
- }
182
-
183
- .ss-content {
184
- max-height: calc(100vh - var(--height-header) - var(--height-nav) - var(--spacing));
185
-
186
- .label {
187
- font-weight: bold;
188
- }
189
- }
190
- }
191
- }
192
-
193
- main {
194
- grid-area: main;
195
- display: flex;
196
- flex-direction: column;
197
- gap: var(--spacing-half);
198
- padding: 0 0 0 var(--spacing);
199
- overflow: auto;
200
-
201
- @media (max-width: 700px) {
202
- padding: 0;
203
- }
204
-
205
- .contents {
206
- display: flex;
207
- flex-direction: column;
208
- gap: var(--spacing);
209
- }
210
-
211
- .content {
212
- flex: 1 1 auto;
213
- padding: var(--spacing);
214
- background-color: var(--color-white);
215
- border-radius: var(--border-radius);
216
-
217
- @media screen and (max-width: 700px) {
218
- box-shadow: none;
219
- }
220
-
221
- .row {
222
- display: flex;
223
- flex-direction: row;
224
- gap: var(--spacing-half);
225
-
226
- > * {
227
- flex: 1 1 auto;
228
- }
229
-
230
- .btn {
231
- flex: 0 1 auto;
232
- }
233
- }
234
- }
235
-
236
- footer {
237
- grid-area: footer;
238
- color: var(--color-white);
239
- padding: var(--spacing-quarter) 0 var(--spacing-quarter) 0;
240
- line-height: 1.2;
241
- font-size: calc(var(--font-size) - 2px);
242
- text-align: center;
243
-
244
- a {
245
- color: var(--color-font);
246
- }
247
- }
248
- }
249
- }
250
- }
@@ -1,162 +0,0 @@
1
- h1 {
2
- font-size: 40px;
3
- margin: 0 0 var(--spacing-half) 0;
4
- padding: 0 0 var(--spacing-quarter) 0;
5
- }
6
- h2 {
7
- font-size: 32px;
8
- margin: 0 0 var(--spacing-half) 0;
9
- padding: 0 0 var(--spacing-quarter) 0;
10
-
11
- .header {
12
- border-bottom: solid 1px var(--color-border);
13
- }
14
- }
15
- h3 {
16
- font-size: 24px;
17
- margin: 0 0 var(--spacing-half) 0;
18
- padding: 0 0 var(--spacing-quarter) 0;
19
- }
20
- h4 {
21
- font-size: 20px;
22
- margin: 0 0 var(--spacing-half) 0;
23
- padding: 0 0 var(--spacing-quarter) 0;
24
- }
25
- h5 {
26
- font-size: 16px;
27
- margin: 0 0 var(--spacing-half) 0;
28
- padding: 0 0 var(--spacing-quarter) 0;
29
- }
30
-
31
- a {
32
- color: var(--primary-color);
33
-
34
- &:hover {
35
- color: var(--color-secondary);
36
- }
37
- }
38
-
39
- p {
40
- margin: 0 0 var(--spacing-half) 0;
41
- }
42
-
43
- .separator {
44
- height: 1px;
45
- width: 100%;
46
- margin: var(--spacing-half) 0 var(--spacing-half) 0;
47
- background-color: var(--color-border);
48
- }
49
-
50
- .bold {
51
- font-weight: bold;
52
- }
53
-
54
- /////////////
55
- // Padding //
56
- /////////////
57
-
58
- // Small
59
- .pad-s {
60
- padding: var(--spacing-quarter);
61
- }
62
- .pad-t-s {
63
- padding-top: var(--spacing-quarter);
64
- }
65
- .pad-r-s {
66
- padding-right: var(--spacing-quarter);
67
- }
68
- .pad-b-s {
69
- padding-bottom: var(--spacing-quarter);
70
- }
71
- .pad-l-s {
72
- padding-left: var(--spacing-quarter);
73
- }
74
-
75
- // Medium
76
- .pad-m {
77
- padding: var(--spacing-half);
78
- }
79
- .pad-t-m {
80
- padding-top: var(--spacing-half);
81
- }
82
- .pad-r-m {
83
- padding-right: var(--spacing-half);
84
- }
85
- .pad-b-m {
86
- padding-bottom: var(--spacing-half);
87
- }
88
- .pad-l-m {
89
- padding-left: var(--spacing-half);
90
- }
91
-
92
- // Large
93
- .pad-l {
94
- padding: var(--spacing);
95
- }
96
- .pad-t-l {
97
- padding-top: var(--spacing);
98
- }
99
- .pad-r-l {
100
- padding-right: var(--spacing);
101
- }
102
- .pad-b-l {
103
- padding-bottom: var(--spacing);
104
- }
105
- .pad-l-l {
106
- padding-left: var(--spacing);
107
- }
108
-
109
- ////////////
110
- // Margin //
111
- ////////////
112
-
113
- // Small
114
- .mar-s {
115
- margin: var(--spacing-quarter);
116
- }
117
- .mar-t-s {
118
- margin-top: var(--spacing-quarter);
119
- }
120
- .mar-r-s {
121
- margin-right: var(--spacing-quarter);
122
- }
123
- .mar-b-s {
124
- margin-bottom: var(--spacing-quarter);
125
- }
126
- .mar-l-s {
127
- margin-left: var(--spacing-quarter);
128
- }
129
-
130
- // Medium
131
- .mar-m {
132
- margin: var(--spacing-half);
133
- }
134
- .mar-t-m {
135
- margin-top: var(--spacing-half);
136
- }
137
- .mar-r-m {
138
- margin-right: var(--spacing-half);
139
- }
140
- .mar-b-m {
141
- margin-bottom: var(--spacing-half);
142
- }
143
- .mar-l-m {
144
- margin-left: var(--spacing-half);
145
- }
146
-
147
- // Large
148
- .mar-l {
149
- margin: var(--spacing);
150
- }
151
- .mar-t-l {
152
- margin-top: var(--spacing);
153
- }
154
- .mar-r-l {
155
- margin-right: var(--spacing);
156
- }
157
- .mar-b-l {
158
- margin-bottom: var(--spacing);
159
- }
160
- .mar-l-l {
161
- margin-left: var(--spacing);
162
- }
@@ -1,157 +0,0 @@
1
- code[class*='language-'],
2
- pre[class*='language-'] {
3
- color: #a9b7c6;
4
- font-family: Consolas, Monaco, 'Andale Mono', monospace;
5
- direction: ltr;
6
- text-align: left;
7
- white-space: pre;
8
- word-spacing: normal;
9
- word-break: normal;
10
- line-height: 1.5;
11
- border-radius: 4px;
12
-
13
- -moz-tab-size: 4;
14
- -o-tab-size: 4;
15
- tab-size: 4;
16
-
17
- -webkit-hyphens: none;
18
- -moz-hyphens: none;
19
- -ms-hyphens: none;
20
- hyphens: none;
21
- }
22
-
23
- pre[class*='language-']::-moz-selection,
24
- pre[class*='language-'] ::-moz-selection,
25
- code[class*='language-']::-moz-selection,
26
- code[class*='language-'] ::-moz-selection {
27
- color: inherit;
28
- background: rgba(33, 66, 131, 0.85);
29
- }
30
-
31
- pre[class*='language-']::selection,
32
- pre[class*='language-'] ::selection,
33
- code[class*='language-']::selection,
34
- code[class*='language-'] ::selection {
35
- color: inherit;
36
- background: rgba(33, 66, 131, 0.85);
37
- }
38
-
39
- /* Code blocks */
40
- pre[class*='language-'] {
41
- padding: 1em;
42
- margin: 0.5em 0;
43
- overflow: auto;
44
- }
45
-
46
- :not(pre) > code[class*='language-'],
47
- pre[class*='language-'] {
48
- background: #2b2b2b;
49
- }
50
-
51
- /* Inline code */
52
- :not(pre) > code[class*='language-'] {
53
- padding: 0.1em;
54
- border-radius: 2px;
55
- }
56
-
57
- .token.comment,
58
- .token.prolog,
59
- .token.cdata {
60
- color: #808080;
61
- }
62
-
63
- .token.delimiter,
64
- .token.boolean,
65
- .token.keyword,
66
- .token.selector,
67
- .token.important,
68
- .token.atrule {
69
- color: #cc7832;
70
- }
71
-
72
- .token.operator,
73
- .token.punctuation,
74
- .token.attr-name {
75
- color: #a9b7c6;
76
- }
77
-
78
- .token.tag,
79
- .token.tag .punctuation,
80
- .token.doctype,
81
- .token.builtin {
82
- color: #e8bf6a;
83
- }
84
-
85
- .token.entity,
86
- .token.number,
87
- .token.symbol {
88
- color: #6897bb;
89
- }
90
-
91
- .token.property,
92
- .token.constant,
93
- .token.variable {
94
- color: #9876aa;
95
- }
96
-
97
- .token.string,
98
- .token.char {
99
- color: #6a8759;
100
- }
101
-
102
- .token.attr-value,
103
- .token.attr-value .punctuation {
104
- color: #a5c261;
105
- }
106
- .token.attr-value .punctuation:first-child {
107
- color: #a9b7c6;
108
- }
109
-
110
- .token.url {
111
- color: #287bde;
112
- text-decoration: underline;
113
- }
114
-
115
- .token.function {
116
- color: #ffc66d;
117
- }
118
-
119
- .token.regex {
120
- background: #364135;
121
- }
122
-
123
- .token.bold {
124
- font-weight: bold;
125
- }
126
-
127
- .token.italic {
128
- font-style: italic;
129
- }
130
-
131
- .token.inserted {
132
- background: #294436;
133
- }
134
-
135
- .token.deleted {
136
- background: #484a4a;
137
- }
138
-
139
- /*code.language-css .token.punctuation {
140
- color: #cc7832;
141
- }*/
142
-
143
- code.language-css .token.property,
144
- code.language-css .token.property + .token.punctuation {
145
- color: #a9b7c6;
146
- }
147
-
148
- code.language-css .token.id {
149
- color: #ffc66d;
150
- }
151
-
152
- code.language-css .token.selector > .token.class,
153
- code.language-css .token.selector > .token.attribute,
154
- code.language-css .token.selector > .token.pseudo-class,
155
- code.language-css .token.selector > .token.pseudo-element {
156
- color: #ffc66d;
157
- }
package/src/docs/env.d.ts DELETED
@@ -1,13 +0,0 @@
1
- /// <reference types="vite/client" />
2
-
3
- declare module '*.vue' {
4
- import { DefineComponent } from 'vue'
5
- // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
6
- const component: DefineComponent<{}, {}, any>
7
- export default component
8
- }
9
-
10
- declare module '@slim-select/vue'
11
- declare module 'chance'
12
- declare module 'prismjs'
13
- declare module 'prismjs/*'
package/src/docs/main.ts DELETED
@@ -1,27 +0,0 @@
1
- import '../../node_modules/prismjs/themes/prism-okaidia.css'
2
- import './assets/scss/index.scss'
3
- import '../slim-select/slimselect.scss'
4
-
5
- import { createApp } from 'vue'
6
- import router from './router'
7
-
8
- import App from './app.vue'
9
- import Prism from 'prismjs'
10
- import Normalizer from 'prismjs/plugins/normalize-whitespace/prism-normalize-whitespace'
11
- import 'prismjs/plugins/toolbar/prism-toolbar'
12
-
13
- new Normalizer({
14
- 'remove-trailing': true,
15
- 'remove-indent': true,
16
- 'left-trim': true,
17
- 'right-trim': true,
18
- })
19
-
20
- const app = createApp(App)
21
- app.use(router)
22
- app.mixin({
23
- updated() {
24
- Prism.highlightAll()
25
- },
26
- })
27
- app.mount('#app')