@cypress-design/vue-button - npm Package Compare versions

Comparing version 0.6.0 to 0.7.0

CHANGELOG.md

 # @cypress-design/vue-button
 
+## 0.7.0
+
+### Minor Changes
+
+- [#162](https://github.com/cypress-io/cypress-design/pull/162) [`76d4e60`](https://github.com/cypress-io/cypress-design/commit/76d4e601687d28578cdee0ddc67cd04b286ae2c3) Thanks [@elevatebart](https://github.com/elevatebart)! - add new outline variants: indigo, purple, gray
+
 ## 0.6.0
@@ -4,0 +10,0 @@

dist/constants.d.ts

 export declare const VariantClassesTable: {
     readonly link: "border-transparent text-indigo-600 hover:underline disabled:text-gray-500 disabled:no-underline ring-transparent";
+    readonly 'outline-indigo': "border-indigo-500 text-indigo-500 hocus:ring-indigo-300/35 disabled:text-gray-500";
+    readonly 'outline-purple': "border-purple-500 text-purple-500 hocus:ring-purple-100 disabled:text-gray-500";
+    readonly 'outline-gray': "border-gray-1000 text-gray-1000 hocus:ring-gray-100 disabled:text-gray-500";
     readonly 'outline-light': "border-gray-100 text-indigo-500 hocus:border-gray-200 disabled:border-gray-100 hocus:ring-gray-50 disabled:text-gray-500";
@@ -4,0 +7,0 @@ readonly 'outline-dark': "border-white/20 text-white hocus:border-white/60 hocus:ring-white/20 disabled:border-white/20 disabled:text-white/50";

dist/index.umd.js

@@ -1,4 +0,4 @@
-(function(e,r){typeof exports=="object"&&typeof module<"u"?module.exports=r(require("vue")):typeof define=="function"&&define.amd?define(["vue"],r):(e=typeof globalThis<"u"?globalThis:e||self,e.Button=r(e.Vue))})(this,function(e){"use strict";const r={link:"border-transparent text-indigo-600 hover:underline disabled:text-gray-500 disabled:no-underline ring-transparent","outline-light":"border-gray-100 text-indigo-500 hocus:border-gray-200 disabled:border-gray-100 hocus:ring-gray-50 disabled:text-gray-500","outline-dark":"border-white/20 text-white hocus:border-white/60 hocus:ring-white/20 disabled:border-white/20 disabled:text-white/50",white:"border-gray-100 bg-white text-indigo-500 hocus:border-gray-200 hocus:ring-gray-50 disabled:text-gray-500","indigo-light":"border-indigo-50 bg-indigo-50 text-indigo-500 hocus:border-indigo-200 hocus:ring-2 hocus:ring-indigo-50","indigo-dark":"border-indigo-500 bg-indigo-500 text-white hocus:ring-2 hocus:ring-indigo-100 focus:bg-indigo-600","jade-light":"border-transparent bg-jade-200 text-teal-600 hocus:border-jade-300 hocus:ring-2 hocus:ring-jade-50","jade-dark":"border-jade-500 bg-jade-500 text-white hocus:ring-2 hocus:ring-jade-100","teal-dark":"border-teal-500 bg-teal-500 text-white hocus:ring-2 hocus:ring-teal-100 focus:bg-teal-600","purple-dark":"border-purple-500 bg-purple-500 text-white hocus:ring-2 hocus:ring-purple-100 focus:bg-purple-600","red-dark":"border-red-500 bg-red-500 text-white hocus:ring-2 hocus:ring-red-100 focus:bg-red-600","gray-dark":"border-gray-800 bg-gray-800 text-white hocus:ring-2 hocus:ring-gray-100","gray-darkest":"border-gray-1000 bg-gray-1000 text-white hocus:ring-2 hocus:ring-gray-100",disabled:"border-gray-500 bg-gray-500 text-white"},s="indigo-dark",u={20:"px-[4px] py-0 text-[14px] leading-[20px]",24:"px-[8px] py-[2px] text-[14px] leading-[20px]",32:"px-[12px] py-[6px] text-[14px] leading-[20px]",40:"px-[16px] py-[8px] text-[16px] leading-[24px]",48:"px-[20px] py-[12px] text-[16px] leading-[24px]"},l="40",b="border rounded rounded-[4px] flex font-medium items-center transition duration-150 enabled:hover:ring-2 enabled:focus:ring-2 disabled:cursor-not-allowed",d=e.defineComponent((n,{slots:i})=>{const{variant:t=s,size:h=l,disabled:o=!1,href:a,type:p="button"}=n,x=e.computed(()=>o&&!["outline-dark","outline-light","link"].includes(t)?"disabled":t),c=e.computed(()=>o||t==="disabled");return()=>{var g;return e.h(a?"a":"button",{...n.href?{}:{type:p},href:a,class:[b,r[x.value],u[h]],disabled:c.value},(g=i.default)==null?void 0:g.call(i))}});return d.props=["variant","size","disabled","href"],d});
+(function(e,r){typeof exports=="object"&&typeof module<"u"?module.exports=r(require("vue")):typeof define=="function"&&define.amd?define(["vue"],r):(e=typeof globalThis<"u"?globalThis:e||self,e.Button=r(e.Vue))})(this,function(e){"use strict";const r={link:"border-transparent text-indigo-600 hover:underline disabled:text-gray-500 disabled:no-underline ring-transparent","outline-indigo":"border-indigo-500 text-indigo-500 hocus:ring-indigo-300/35 disabled:text-gray-500","outline-purple":"border-purple-500 text-purple-500 hocus:ring-purple-100 disabled:text-gray-500","outline-gray":"border-gray-1000 text-gray-1000 hocus:ring-gray-100 disabled:text-gray-500","outline-light":"border-gray-100 text-indigo-500 hocus:border-gray-200 disabled:border-gray-100 hocus:ring-gray-50 disabled:text-gray-500","outline-dark":"border-white/20 text-white hocus:border-white/60 hocus:ring-white/20 disabled:border-white/20 disabled:text-white/50",white:"border-gray-100 bg-white text-indigo-500 hocus:border-gray-200 hocus:ring-gray-50 disabled:text-gray-500","indigo-light":"border-indigo-50 bg-indigo-50 text-indigo-500 hocus:border-indigo-200 hocus:ring-2 hocus:ring-indigo-50","indigo-dark":"border-indigo-500 bg-indigo-500 text-white hocus:ring-2 hocus:ring-indigo-100 focus:bg-indigo-600","jade-light":"border-transparent bg-jade-200 text-teal-600 hocus:border-jade-300 hocus:ring-2 hocus:ring-jade-50","jade-dark":"border-jade-500 bg-jade-500 text-white hocus:ring-2 hocus:ring-jade-100","teal-dark":"border-teal-500 bg-teal-500 text-white hocus:ring-2 hocus:ring-teal-100 focus:bg-teal-600","purple-dark":"border-purple-500 bg-purple-500 text-white hocus:ring-2 hocus:ring-purple-100 focus:bg-purple-600","red-dark":"border-red-500 bg-red-500 text-white hocus:ring-2 hocus:ring-red-100 focus:bg-red-600","gray-dark":"border-gray-800 bg-gray-800 text-white hocus:ring-2 hocus:ring-gray-100","gray-darkest":"border-gray-1000 bg-gray-1000 text-white hocus:ring-2 hocus:ring-gray-100",disabled:"border-gray-500 bg-gray-500 text-white"},s="indigo-dark",u={20:"px-[4px] py-0 text-[14px] leading-[20px]",24:"px-[8px] py-[2px] text-[14px] leading-[20px]",32:"px-[12px] py-[6px] text-[14px] leading-[20px]",40:"px-[16px] py-[8px] text-[16px] leading-[24px]",48:"px-[20px] py-[12px] text-[16px] leading-[24px]"},l="40",b="border rounded rounded-[4px] flex font-medium items-center transition duration-150 enabled:hover:ring-2 enabled:focus:ring-2 disabled:cursor-not-allowed",d=e.defineComponent((n,{slots:i})=>{const{variant:t=s,size:p=l,disabled:o=!1,href:a,type:h="button"}=n,x=e.computed(()=>o&&!["outline-dark","outline-light","link"].includes(t)?"disabled":t),c=e.computed(()=>o||t==="disabled");return()=>{var g;return e.h(a?"a":"button",{...n.href?{}:{type:h},href:a,class:[b,r[x.value],u[p]],disabled:c.value},(g=i.default)==null?void 0:g.call(i))}});return d.props=["variant","size","disabled","href"],d});
 
-/* <windicss-keep class="border-transparent text-indigo-600 hover:underline disabled:text-gray-500 disabled:no-underline ring-transparent border-gray-100 text-indigo-500 hocus:border-gray-200 disabled:border-gray-100 hocus:ring-gray-50 border-white/20 text-white hocus:border-white/60 hocus:ring-white/20 disabled:border-white/20 disabled:text-white/50 bg-white border-indigo-50 bg-indigo-50 hocus:border-indigo-200 hocus:ring-2 hocus:ring-indigo-50 border-indigo-500 bg-indigo-500 hocus:ring-indigo-100 focus:bg-indigo-600 bg-jade-200 text-teal-600 hocus:border-jade-300 hocus:ring-jade-50 border-jade-500 bg-jade-500 hocus:ring-jade-100 border-teal-500 bg-teal-500 hocus:ring-teal-100 focus:bg-teal-600 border-purple-500 bg-purple-500 hocus:ring-purple-100 focus:bg-purple-600 border-red-500 bg-red-500 hocus:ring-red-100 focus:bg-red-600 border-gray-800 bg-gray-800 hocus:ring-gray-100 border-gray-1000 bg-gray-1000 border-gray-500 bg-gray-500 px-[4px] py-0 text-[14px] leading-[20px] px-[8px] py-[2px] px-[12px] py-[6px] px-[16px] py-[8px] text-[16px] leading-[24px] px-[20px] py-[12px] border rounded rounded-[4px] flex font-medium items-center transition duration-150 enabled:hover:ring-2 enabled:focus:ring-2 disabled:cursor-not-allowed"> */
+/* <windicss-keep class="border-transparent text-indigo-600 hover:underline disabled:text-gray-500 disabled:no-underline ring-transparent border-indigo-500 text-indigo-500 hocus:ring-indigo-300/35 border-purple-500 text-purple-500 hocus:ring-purple-100 border-gray-1000 text-gray-1000 hocus:ring-gray-100 border-gray-100 hocus:border-gray-200 disabled:border-gray-100 hocus:ring-gray-50 border-white/20 text-white hocus:border-white/60 hocus:ring-white/20 disabled:border-white/20 disabled:text-white/50 bg-white border-indigo-50 bg-indigo-50 hocus:border-indigo-200 hocus:ring-2 hocus:ring-indigo-50 bg-indigo-500 hocus:ring-indigo-100 focus:bg-indigo-600 bg-jade-200 text-teal-600 hocus:border-jade-300 hocus:ring-jade-50 border-jade-500 bg-jade-500 hocus:ring-jade-100 border-teal-500 bg-teal-500 hocus:ring-teal-100 focus:bg-teal-600 bg-purple-500 focus:bg-purple-600 border-red-500 bg-red-500 hocus:ring-red-100 focus:bg-red-600 border-gray-800 bg-gray-800 bg-gray-1000 border-gray-500 bg-gray-500 px-[4px] py-0 text-[14px] leading-[20px] px-[8px] py-[2px] px-[12px] py-[6px] px-[16px] py-[8px] text-[16px] leading-[24px] px-[20px] py-[12px] border rounded rounded-[4px] flex font-medium items-center transition duration-150 enabled:hover:ring-2 enabled:focus:ring-2 disabled:cursor-not-allowed"> */
 //# sourceMappingURL=index.umd.js.map

dist/vue/Button.d.ts

 declare const Button: import("vue").DefineComponent<{
-    variant?: "link" | "outline-light" | "outline-dark" | "white" | "indigo-light" | "indigo-dark" | "jade-light" | "jade-dark" | "teal-dark" | "purple-dark" | "red-dark" | "gray-dark" | "gray-darkest" | "disabled" | undefined;
+    variant?: "link" | "outline-indigo" | "outline-purple" | "outline-gray" | "outline-light" | "outline-dark" | "white" | "indigo-light" | "indigo-dark" | "jade-light" | "jade-dark" | "teal-dark" | "purple-dark" | "red-dark" | "gray-dark" | "gray-darkest" | "disabled" | undefined;
     size?: "20" | "24" | "32" | "40" | "48" | undefined;
@@ -11,3 +11,3 @@ disabled?: boolean | undefined;
 }>, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    variant?: "link" | "outline-light" | "outline-dark" | "white" | "indigo-light" | "indigo-dark" | "jade-light" | "jade-dark" | "teal-dark" | "purple-dark" | "red-dark" | "gray-dark" | "gray-darkest" | "disabled" | undefined;
+    variant?: "link" | "outline-indigo" | "outline-purple" | "outline-gray" | "outline-light" | "outline-dark" | "white" | "indigo-light" | "indigo-dark" | "jade-light" | "jade-dark" | "teal-dark" | "purple-dark" | "red-dark" | "gray-dark" | "gray-darkest" | "disabled" | undefined;
     size?: "20" | "24" | "32" | "40" | "48" | undefined;
@@ -14,0 +14,0 @@ disabled?: boolean | undefined;

package.json

 {
   "name": "@cypress-design/vue-button",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "files": [
@@ -5,0 +5,0 @@ "*"

No alert changes

Improved metrics

Total package byte prevSize

36153

6.43%

Lines of code

279

2.57%

No dependency changes