vx-vue 0.8.3 → 0.9.1

package/README.md

@@ -161,6 +161,20 @@ A sortable table; the `columns` prop specifies the columns and their sorting opt
 |------------------------------------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------|--------------------------------------------------|
 | `columns [Array]`<br/>`rows [Array]`<br/>`offset [Number]`<br/>`count [Number]`<br/>`sortProp [String]`<br/>`sortDirection ['asc', 'desc']`<br/>`keyProperty [String]` | `before-sort`<br/>`after-sort` | `{ column: prop }-header`<br/>`{ column: prop }` |
 
+### Spinner
+Well, an animated circular spinner; colorized with `currentColor`.
+
+| props                                         | events | slots |
+|-----------------------------------------------|--------|-------|
+| `radius [Number]`<br/>`strokeWidth [Number]`  |        |       |
+
+### SubmitButton
+A button which will be disabled when `busy` is true and display a spinner to its right. Apart from a default theme a `success` and `error` theme are provided with matching spinner. In any case the spinner can be styled by a separate class string.
+
+| props                                                              | events    | slots     |
+|--------------------------------------------------------------------|-----------|-----------|
+| `busy [Boolean]`<br/>`theme [String]`<br/>`spinnerClass [String]`  | `submit`  | `default` |
+
 ### Tabs
 A responsive tabs component. The items array holds objects with a required `name [String]` and optional `badge [String]`, `icon [Component]` and `disabled [Boolean]` properties. 
 

package/dist/style.css

@@ -1 +1 @@
-.messagetoast-fade-enter-from[data-v-62f8007a],.messagetoast-fade-leave-to[data-v-62f8007a]{--tw-translate-y: -2.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:0}.messagetoast-fade-enter-to[data-v-62f8007a],.messagetoast-fade-leave-from[data-v-62f8007a]{--tw-translate-y: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:1}.messagetoast-fade-enter-active[data-v-62f8007a],.messagetoast-fade-leave-active[data-v-62f8007a]{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}tbody tr[data-v-7ec18969]:nth-of-type(odd){--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(51 65 85 / var(--tw-text-opacity))}tbody tr[data-v-7ec18969]:nth-of-type(2n){--tw-bg-opacity: 1;background-color:rgb(226 232 240 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(30 41 59 / var(--tw-text-opacity))}tbody tr:nth-of-type(odd) td.active[data-v-7ec18969]{--tw-bg-opacity: 1;background-color:rgb(254 243 199 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity))}tbody tr:nth-of-type(2n) td.active[data-v-7ec18969]{--tw-bg-opacity: 1;background-color:rgb(253 230 138 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity))}thead th.active[data-v-7ec18969]{--tw-bg-opacity: 1;background-color:rgb(146 64 14 / var(--tw-bg-opacity))}
+.messagetoast-fade-enter-from[data-v-62f8007a],.messagetoast-fade-leave-to[data-v-62f8007a]{--tw-translate-y: -2.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:0}.messagetoast-fade-enter-to[data-v-62f8007a],.messagetoast-fade-leave-from[data-v-62f8007a]{--tw-translate-y: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:1}.messagetoast-fade-enter-active[data-v-62f8007a],.messagetoast-fade-leave-active[data-v-62f8007a]{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}tbody tr[data-v-7ec18969]:nth-of-type(odd){--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(51 65 85 / var(--tw-text-opacity))}tbody tr[data-v-7ec18969]:nth-of-type(2n){--tw-bg-opacity: 1;background-color:rgb(226 232 240 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(30 41 59 / var(--tw-text-opacity))}tbody tr:nth-of-type(odd) td.active[data-v-7ec18969]{--tw-bg-opacity: 1;background-color:rgb(254 243 199 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity))}tbody tr:nth-of-type(2n) td.active[data-v-7ec18969]{--tw-bg-opacity: 1;background-color:rgb(253 230 138 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity))}thead th.active[data-v-7ec18969]{--tw-bg-opacity: 1;background-color:rgb(146 64 14 / var(--tw-bg-opacity))}.button{display:inline-flex;align-items:center;justify-content:center;border-radius:.25rem;border-width:1px;border-color:transparent;background-color:rgb(var(--vxvue-color));padding:.5rem 1rem;font-weight:500;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.button:hover{background-color:rgb(var(--vxvue-color-700))}.button:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000);--tw-ring-color: rgb(var(--vxvue-color));--tw-ring-offset-width: 2px }.button.success{background-color:rgb(var(--success-color));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.button.success:hover{background-color:rgb(var(--success-color-700))}.button.success:focus{--tw-ring-color: rgb(var(--success-color)) }.button.error{background-color:rgb(var(--error-color));color:rgb(var(--error-color-50))}.button.error:hover{background-color:rgb(var(--error-color-600))}.button.error:focus{--tw-ring-color: rgb(var(--error-color-600)) }.button:disabled{--tw-bg-opacity: 1;background-color:rgb(203 213 225 / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(30 41 59 / var(--tw-text-opacity))}.button:disabled:hover{--tw-bg-opacity: 1;background-color:rgb(203 213 225 / var(--tw-bg-opacity))}.button:disabled:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}