Skip to content

Commit

Permalink
Prop name changes, package assets update
Browse files Browse the repository at this point in the history
  • Loading branch information
@GregPeden
GregPeden committed Aug 15, 2017
1 parent 83aa2ef commit 541b51a
Show file tree
Hide file tree
Showing 9 changed files with 1,098 additions and 1,073 deletions.
12 changes: 6 additions & 6 deletions dev/bundle.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dev/bundle.js.map
View file

Large diffs are not rendered by default.

1,141 changes: 611 additions & 530 deletions dist/click-confirm.js
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions dist/click-confirm.min.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/click-confirm.min.js.map
View file

Large diffs are not rendered by default.

60 changes: 30 additions & 30 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -182,36 +182,12 @@ <h4>Properties</h4>
</tr>
</thead>
<tbody>
<tr>
<th scope="row"><code>button-no-icon</code></th>
<td>String, Array, Object</td>
<td><code>"fa fa-times"</code></td>
<td>Typeset icon visible within the 'No' button.</td>
</tr>
<tr>
<th scope="row"><code>button-no-class</code></th>
<td>String, Array, Object</td>
<td><code>"btn btn-secondary"</code></td>
<td>Class to use for the 'No' button, can be used for further styling.</td>
</tr>
<tr>
<th scope="row"><code>button-size</code></th>
<td><code>"sm"</code>, <code>""</code> (medium), or <code>"lg"</code></td>
<td><code>""</code></td>
<td>Render size of confirmation buttons, per Bootstrap 4.</td>
</tr>
<tr>
<th scope="row"><code>button-yes-icon</code></th>
<td>String, Array, Object</td>
<td><code>"fa fa-check"</code></td>
<td>Typeset icon visible within the 'Yes' button.</td>
</tr>
<tr>
<th scope="row"><code>button-yes-class</code></th>
<td>String, Array, Object</td>
<td><code>"btn btn-primary"</code></td>
<td>Class to use for the 'Yes' button, can be used for further styling.</td>
</tr>
<tr>
<th scope="row"><code>copy-attributes</code></th>
<td>String, Array</td>
Expand All @@ -235,12 +211,36 @@ <h4>Properties</h4>
support straightforward.
</td>
</tr>
<tr>
<th scope="row"><code>no-class</code></th>
<td>String, Array, Object</td>
<td><code>"btn btn-secondary"</code></td>
<td>Class to use for the 'No' button, can be used for further styling.</td>
</tr>
<tr>
<th scope="row"><code>no-icon</code></th>
<td>String, Array, Object</td>
<td><code>"fa fa-times"</code></td>
<td>Typeset icon visible within the 'No' button.</td>
</tr>
<tr>
<th scope="row"><code>placement</code></th>
<td><code>"top"</code>, <code>"bottom"</code>, <code>"left"</code>, or <code>"right"</code></td>
<td><code>"top"</code></td>
<td>Display location of the confirmation popover.</td>
</tr>
<tr>
<th scope="row"><code>yes-icon</code></th>
<td>String, Array, Object</td>
<td><code>"fa fa-check"</code></td>
<td>Typeset icon visible within the 'Yes' button.</td>
</tr>
<tr>
<th scope="row"><code>yes-class</code></th>
<td>String, Array, Object</td>
<td><code>"btn btn-primary"</code></td>
<td>Class to use for the 'Yes' button, can be used for further styling.</td>
</tr>
</tbody>
</table>
</div>
Expand Down Expand Up @@ -357,12 +357,12 @@ <h4>Button Icons</h4>
</click-confirm>
</p>
<p>
<click-confirm button-yes-icon="fa fa-thumbs-up" button-no-icon="fa fa-thumbs-down">
<click-confirm yes-icon="fa fa-thumbs-up" no-icon="fa fa-thumbs-down">
<button class="btn btn-primary" @click="successAlert">All thumbs</button>
</click-confirm>
</p>
<p>
<click-confirm button-yes-icon="fa fa-smile-o fa-spin" button-no-icon="fa fa-frown-o fa-spin">
<click-confirm yes-icon="fa fa-smile-o fa-spin" no-icon="fa fa-frown-o fa-spin">
<button class="btn btn-primary" @click="successAlert">Turn that frown upside-down</button>
</click-confirm>
</p>
Expand All @@ -372,11 +372,11 @@ <h4>Button Icons</h4>
&lt;button class="btn btn-primary" @click="successAlert"&gt;Check and X (default)&lt;/button&gt;
&lt;/click-confirm&gt;

&lt;click-confirm button-yes-icon="fa fa-thumbs-up" button-no-icon="fa fa-thumbs-down"&gt;
&lt;click-confirm yes-icon="fa fa-thumbs-up" no-icon="fa fa-thumbs-down"&gt;
&lt;button class="btn btn-primary" @click="successAlert"&gt;All thumbs&lt;/button&gt;
&lt;/click-confirm&gt;

&lt;click-confirm button-yes-icon="fa fa-smile-o fa-spin" button-no-icon="fa fa-frown-o fa-spin"&gt;
&lt;click-confirm yes-icon="fa fa-smile-o fa-spin" no-icon="fa fa-frown-o fa-spin"&gt;
&lt;button class="btn btn-primary" @click="successAlert"&gt;Turn that frown upside-down&lt;/button&gt;
&lt;/click-confirm&gt;</code></pre>
</div>
Expand All @@ -397,7 +397,7 @@ <h4>Button Classes</h4>
</click-confirm>
</p>
<p>
<click-confirm button-yes-class="btn btn-success" button-no-class="btn btn-danger">
<click-confirm yes-class="btn btn-success" no-class="btn btn-danger">
<button class="btn btn-primary" @click="successAlert">Green and red buttons</button>
</click-confirm>
</p>
Expand All @@ -407,7 +407,7 @@ <h4>Button Classes</h4>
&lt;button class="btn btn-primary" @click="successAlert"&gt;Check and X (default)&lt;/button&gt;
&lt;/click-confirm&gt;

&lt;click-confirm button-yes-class="btn btn-success" button-no-class="btn btn-danger"&gt;
&lt;click-confirm yes-class="btn btn-success" no-class="btn btn-danger"&gt;
&lt;button class="btn btn-primary" @click="successAlert"&gt;All thumbs&lt;/button&gt;
&lt;/click-confirm&gt;</code></pre>
</div>
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,8 +63,8 @@
"vue-hot-reload-api": "^2.0.7",
"vue-html-loader": "^1.2.3",
"vue-loader": "^11.0.0",
"vue-template-compiler": "^2.2.0",
"vue-style-loader": "^1.0.0",
"vue-template-compiler": "^2.2.0",
"webpack": "^1.13.2",
"webpack-dev-server": "^1.16.2"
}
Expand Down
50 changes: 25 additions & 25 deletions src/ClickConfirm.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,13 @@
<slot></slot>
</span>
<div class="text-center" slot="content">
<a href="#" v-bind="confirmationAttributes" :class="[buttonYesClass, buttonSizeClass]"
<a href="#" v-bind="confirmationAttributes" :class="[yesClass, buttonSizeClass]"
@click.prevent="confirmEvent" @focus="setFocus('buttonYes')" @blur="clearFocus" ref="buttonYes">
<span v-if="buttonYesIcon" :class="buttonYesIcon"></span> {{ messages.yes }}
<span v-if="yesIcon" :class="yesIcon"></span> {{ messages.yes }}
</a>
<a href="#" :class="[buttonNoClass, buttonSizeClass]" @click.prevent="cancelEvent"
<a href="#" :class="[noClass, buttonSizeClass]" @click.prevent="cancelEvent"
@focus="setFocus('buttonNo')" @blur="clearFocus" ref="buttonNo">
<span v-if="buttonNoIcon" :class="buttonNoIcon"></span> {{ messages.no }}
<span v-if="noIcon" :class="noIcon"></span> {{ messages.no }}
</a>
</div>
</b-popover>
Expand Down Expand Up @@ -43,16 +43,6 @@
},
props: {
buttonNoIcon: {
type: [String, Array, Object],
default: "fa fa-times"
},
buttonNoClass: {
type: [String, Array, Object],
default: "btn btn-secondary"
},
buttonSize: {
type: String,
default: "",
Expand All @@ -61,16 +51,6 @@
}
},
buttonYesIcon: {
type: [String, Array, Object],
default: "fa fa-check"
},
buttonYesClass: {
type: [String, Array, Object],
default: "btn btn-primary"
},
copyAttributes: {
type: [String, Array],
default() {
Expand All @@ -85,9 +65,29 @@
}
},
noClass: {
type: [String, Array, Object],
default: "btn btn-secondary"
},
noIcon: {
type: [String, Array, Object],
default: "fa fa-times"
},
placement: {
type: String,
default: 'top',
},
yesClass: {
type: [String, Array, Object],
default: "btn btn-primary"
},
yesIcon: {
type: [String, Array, Object],
default: "fa fa-check"
}
},
Expand All @@ -97,7 +97,7 @@
},
groupFocus() {
return this.localFocus != false;
return Boolean(this.localFocus) !== false;
},
messagesMerged() {
Expand Down
Loading

0 comments on commit 541b51a

Please sign in to comment.