Skip to content

Commit c542d61

Browse files
RaiondesuRaiondesu
committed
Docs-and-build.
1 parent be6a19c commit c542d61

File tree

7 files changed

+102
-34
lines changed

7 files changed

+102
-34
lines changed

‎dist/cjs.js

+7-8
Original file line numberDiff line numberDiff line change
@@ -62,11 +62,11 @@ function _finally(body, finalizer) {
6262
var result = body();if (result && result.then) {
6363
return result.then(_empty);
6464
}
65-
}function _await(value, then, direct) {
65+
}
66+
function _await(value, then, direct) {
6667
if (direct) {
6768
return then ? then(value) : value;
68-
}
69-
value = Promise.resolve(value);return then ? value.then(then) : value;
69+
}value = Promise.resolve(value);return then ? value.then(then) : value;
7070
}var _async = function () {
7171
try {
7272
if (isNaN.apply(null, {})) {
@@ -133,16 +133,16 @@ var VueSimpleSuggest = {
133133
get event() {
134134
return event;
135135
}
136-
},
137-
props: {
136+
}, props: {
138137
styles: {
139138
type: Object,
140139
default: function _default() {
141140
return {};
142141
}
143142
},
144143
controls: {
145-
type: Object, default: function _default() {
144+
type: Object,
145+
default: function _default() {
146146
return defaultControls;
147147
}
148148
},
@@ -156,8 +156,7 @@ var VueSimpleSuggest = {
156156
},
157157
displayAttribute: {
158158
type: String,
159-
default: 'title'
160-
},
159+
default: 'title' },
161160
valueAttribute: {
162161
type: String,
163162
default: 'id'

‎dist/es6.js

+8-11
Original file line numberDiff line numberDiff line change
@@ -46,11 +46,11 @@ function _finally(body, finalizer) {
4646
var result = body();if (result && result.then) {
4747
return result.then(_empty);
4848
}
49-
}function _await(value, then, direct) {
49+
}
50+
function _await(value, then, direct) {
5051
if (direct) {
5152
return then ? then(value) : value;
52-
}
53-
value = Promise.resolve(value);return then ? value.then(then) : value;
53+
}value = Promise.resolve(value);return then ? value.then(then) : value;
5454
}const _async = function () {
5555
try {
5656
if (isNaN.apply(null, {})) {
@@ -117,16 +117,14 @@ var VueSimpleSuggest = {
117117
get event() {
118118
return event;
119119
}
120-
},
121-
props: {
120+
}, props: {
122121
styles: {
123122
type: Object,
124-
default: () => {
125-
return {};
126-
}
123+
default: () => ({})
127124
},
128125
controls: {
129-
type: Object, default: () => defaultControls
126+
type: Object,
127+
default: () => defaultControls
130128
},
131129
minLength: {
132130
type: Number,
@@ -138,8 +136,7 @@ var VueSimpleSuggest = {
138136
},
139137
displayAttribute: {
140138
type: String,
141-
default: 'title'
142-
},
139+
default: 'title' },
143140
valueAttribute: {
144141
type: String,
145142
default: 'id'

‎dist/es7.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -64,9 +64,7 @@ var VueSimpleSuggest = {
6464
props: {
6565
styles: {
6666
type: Object,
67-
default: () => {
68-
return {};
69-
}
67+
default: () => ({})
7068
},
7169
controls: {
7270
type: Object,

‎dist/styles.css

+1
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@
3333
border-radius: 3px;
3434
border: 1px solid #aaa;
3535
background-color: #fff;
36+
opacity: 1;
3637
z-index: 1000;
3738
}
3839

‎docs/index.html

+58-5
Large diffs are not rendered by default.

‎docs/main.js

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎example/src/README.html

+25-5
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ <h2 id="table-of-contents"><a class="header-link" href="#table-of-contents"></a>
2828
<li><a href="#default-controls">Controls</a></li>
2929
<li><a href="#component-api">Component API</a><ul class="list">
3030
<li><a href="#tldr">TLDR</a></li>
31-
<li><a href="#css-class-structure">CSS class structure</a></li>
31+
<li><a href="#css-class-structure">CSS class structure &amp; Transitions</a></li>
3232
<li><a href="#api-definitions">API Definitions</a><ul class="list">
3333
<li><a href="#props">Props</a></li>
3434
<li><a href="#emitted-events">Emitted Events</a></li>
@@ -294,11 +294,11 @@ <h3 id="tldr"><a class="header-link" href="#tldr"></a>TLDR</h3>
294294
<hr>
295295
<h3 id="css-class-structure"><a class="header-link" href="#css-class-structure"></a>CSS class structure</h3>
296296
<p>If there&#39;s a need to customize the appearance of the component, here&#39;s the internal class-structure:</p>
297-
<pre class="hljs"><code><span class="hljs-comment">// .designed is applied only if `destyled` prop is false</span>
297+
<pre class="hljs"><code><span class="hljs-comment">// .designed is applied only if `destyled` prop is false.</span>
298298
<span class="hljs-selector-class">.vue-simple-suggest</span><span class="hljs-selector-class">.designed</span><span class="hljs-selector-class">.focus</span> <span class="hljs-comment">// .focus is applied whenever the component is focused.</span>
299299
<span class="hljs-selector-class">.input-wrapper</span>
300-
<span class="hljs-selector-class">.default-input</span> <span class="hljs-comment">// Replaced with your custom input if default slot is provided</span>
301-
<span class="hljs-selector-class">.suggestions</span>
300+
<span class="hljs-selector-class">.default-input</span> <span class="hljs-comment">// Replaced with your custom input if default slot is provided.</span>
301+
<span class="hljs-selector-class">.suggestions</span> <span class="hljs-comment">// Also has transition classes, see below.</span>
302302
<span class="hljs-selector-class">.suggest-item</span></code></pre><p>If you wish to use your existing classes, or frameworks like Bootstrap you can inject your own classes using the <code>&#39;styles&#39;</code> prop:</p>
303303
<pre class="hljs"><code><span class="hljs-comment">&lt;!-- Some component.vue --&gt;</span>
304304
<span class="hljs-tag">&lt;<span class="hljs-name">template</span>&gt;</span>
@@ -338,7 +338,27 @@ <h3 id="css-class-structure"><a class="header-link" href="#css-class-structure">
338338
<span class="hljs-attribute">background-color</span>: <span class="hljs-number">#007bff</span>;
339339
<span class="hljs-attribute">color</span>: <span class="hljs-number">#fff</span>;
340340
}
341-
</span><span class="hljs-tag">&lt;/<span class="hljs-name">style</span>&gt;</span></code></pre><hr>
341+
</span><span class="hljs-tag">&lt;/<span class="hljs-name">style</span>&gt;</span></code></pre><h4 id="transitions"><a class="header-link" href="#transitions"></a>Transitions</h4>
342+
<blockquote>
343+
<p>New in v1.8.0</p>
344+
</blockquote>
345+
<p>You can also define custom list transitions by defining css rules for the transition named <code>vue-simple-suggest</code> on the <code>.suggestions</code> div:</p>
346+
<pre class="hljs"><code><span class="hljs-selector-class">.suggestions</span> {
347+
<span class="hljs-comment">/* It's improtant to have a cpecific pivot point for transition:*/</span>
348+
<span class="hljs-attribute">opacity</span>: <span class="hljs-number">1</span>;
349+
}
350+
351+
<span class="hljs-selector-class">.vue-simple-suggest-enter-active</span><span class="hljs-selector-class">.suggestions</span>,
352+
<span class="hljs-selector-class">.vue-simple-suggest-leave-active</span><span class="hljs-selector-class">.suggestions</span> {
353+
<span class="hljs-comment">/* Transition length here:*/</span>
354+
<span class="hljs-attribute">transition</span>: opacity .<span class="hljs-number">2s</span>;
355+
}
356+
357+
<span class="hljs-selector-class">.vue-simple-suggest-enter</span><span class="hljs-selector-class">.suggestions</span>,
358+
<span class="hljs-selector-class">.vue-simple-suggest-leave-to</span><span class="hljs-selector-class">.suggestions</span> {
359+
<span class="hljs-comment">/* Transition rule for "disengaged" element:*/</span>
360+
<span class="hljs-attribute">opacity</span>: <span class="hljs-number">0</span>;
361+
}</code></pre><hr>
342362
<h3 id="api-definitions"><a class="header-link" href="#api-definitions"></a>API definitions</h3>
343363
<h4 id="props"><a class="header-link" href="#props"></a>Props</h4>
344364
<table>

0 commit comments

Comments
 (0)