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

Comparing version 0.11.9 to 0.11.10

CHANGELOG.md

 # @cypress-design/vue-button
 
+## 0.11.10
+
+### Patch Changes
+
+- [`29703c4`](https://github.com/cypress-io/cypress-design/commit/29703c4d4d8fbb4f742bf57fb7577b41174a6590) Thanks [@elevatebart](https://github.com/elevatebart)! - fix height and width of buttons to match the size of non-square buttons
+
+- Updated dependencies [[`29703c4`](https://github.com/cypress-io/cypress-design/commit/29703c4d4d8fbb4f742bf57fb7577b41174a6590)]:
+  - @cypress-design/constants-button@0.1.7
+
 ## 0.11.9
@@ -4,0 +13,0 @@

dist/Button.vue.d.ts

@@ -30,3 +30,3 @@ import { PropType, SlotsType } from 'vue';
     finalDisabled: import("vue").ComputedRef<boolean>;
-    allClasses: import("vue").ComputedRef<(string | ("text-[14px] leading-[20px] min-h-[20px]" | "text-[14px] leading-[20px] min-h-[24px]" | "text-[14px] leading-[20px] min-h-[32px]" | "text-[16px] leading-[24px] min-h-[40px]" | "text-[16px] leading-[24px] min-h-[48px]" | "h-[20px] w-[20px] flex items-center justify-center" | "h-[24px] w-[24px] flex items-center justify-center" | "h-[32px] w-[32px] flex items-center justify-center" | "h-[40px] w-[40px] flex items-center justify-center" | "h-[48px] w-[48px] flex items-center justify-center" | "px-[4px] py-0" | "px-[8px] py-[2px]" | "px-[12px] py-[6px]" | "px-[16px] py-[8px]" | "px-[20px] py-[12px]")[])[]>;
+    allClasses: import("vue").ComputedRef<(string | ("text-[14px] leading-[18px] min-h-[20px]" | "text-[14px] leading-[20px] min-h-[24px]" | "text-[14px] leading-[20px] min-h-[32px]" | "text-[16px] leading-[24px] min-h-[40px]" | "text-[16px] leading-[24px] min-h-[48px]" | "h-[20px] w-[20px] flex items-center justify-center" | "h-[24px] w-[24px] flex items-center justify-center" | "h-[32px] w-[32px] flex items-center justify-center" | "h-[40px] w-[40px] flex items-center justify-center" | "h-[48px] w-[48px] flex items-center justify-center" | "px-[4px] py-0" | "px-[8px] py-[1px]" | "px-[12px] py-[5px]" | "px-[16px] py-[7px]" | "px-[20px] py-[11px]")[])[]>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -33,0 +33,0 @@ click($event: MouseEvent): boolean;

dist/index.umd.js

@@ -1,4 +0,4 @@
-(function(s,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],o):(s=typeof globalThis<"u"?globalThis:s||self,o(s.Button={},s.Vue))})(this,function(s,o){"use strict";const n={link:"text-indigo-600 border-transparent ring-transparent hover:underline disabled:text-gray-500 disabled:hocus:shadow-none disabled:no-underline hocus:shadow-transparent focus-visible:ring-gray-100 focus-visible:underline",white:"text-indigo-500 bg-white border-gray-100 hover:border-gray-200 disabled:hocus:shadow-none hocus:shadow-gray-50 disabled:text-gray-500 focus:ring-gray-200",disabled:"text-gray-500 bg-gray-100 border-gray-100 hover:shadow-none","outline-indigo":"border-indigo-500 text-indigo-500 disabled:hocus:shadow-none hocus:shadow-indigo-300/[.35] disabled:text-gray-500 focus:ring-indigo-600","outline-purple":"text-purple-500 border-purple-500 disabled:hocus:shadow-none hocus:shadow-purple-100 disabled:text-gray-500 focus:ring-purple-600","outline-gray":"text-gray-1000 border-gray-1000 disabled:hocus:shadow-none hocus:shadow-gray-100 disabled:text-gray-500 focus:ring-gray-1000","outline-light":"text-indigo-500 border-gray-100 hocus:border-gray-200 disabled:border-gray-100 disabled:hocus:shadow-none hocus:shadow-gray-50 disabled:text-gray-500 focus:ring-gray-200","outline-dark":"text-white border-white/20 hocus:border-white/60 disabled:hocus:shadow-none hocus:shadow-white/20 disabled:border-white/20 disabled:hover:border-white/20 disabled:text-white/50 focus:ring-gray-200","outline-disabled":"text-gray-500 border-gray-100 hover:shadow-none","indigo-light":"text-indigo-500 bg-indigo-50 border-indigo-50 hocus:border-indigo-200 disabled:hocus:shadow-none hocus:shadow-indigo-50 focus:ring-transparent","jade-light":"text-teal-600 bg-jade-200 border-transparent hocus:border-jade-300 disabled:hocus:shadow-none hocus:shadow-jade-50 focus:ring-transparent","jade-dark":"text-white bg-jade-500 border-jade-500 disabled:hocus:shadow-none hocus:shadow-jade-100 focus:ring-transparent focus:border-jade-600 focus:bg-jade-600","indigo-dark":"text-white bg-indigo-500 border-indigo-500 disabled:hocus:shadow-none hocus:shadow-indigo-100 focus:bg-indigo-600 focus:border-indigo-600 focus:ring-transparent","teal-dark":"text-white bg-teal-500 border-teal-500 disabled:hocus:shadow-none hocus:shadow-teal-100 focus:bg-teal-600 focus:bg-teal-600 focus:border-teal-600 focus:ring-transparent","purple-dark":"text-white bg-purple-500 border-purple-500 disabled:hocus:shadow-none hocus:shadow-purple-100 focus:bg-purple-600 focus:border-purple-600 focus:ring-transparent","red-dark":"text-white bg-red-500 border-red-500 disabled:hocus:shadow-none hocus:shadow-red-100 focus:bg-red-600 focus:border-red-600 focus:ring-transparent","gray-dark":"text-white bg-gray-800 border-gray-800 disabled:hocus:shadow-none hocus:shadow-gray-100 focus:bg-gray-900 focus:border-gray-900 focus:ring-transparent","gray-darkest":"text-white bg-gray-1000 border-gray-1000 disabled:hocus:shadow-none hocus:shadow-gray-100 focus:bg-gray-900 focus:border-gray-900 focus:ring-transparent"},c="indigo-dark",l={20:"text-[14px] leading-[20px] min-h-[20px]",24:"text-[14px] leading-[20px] min-h-[24px]",32:"text-[14px] leading-[20px] min-h-[32px]",40:"text-[16px] leading-[24px] min-h-[40px]",48:"text-[16px] leading-[24px] min-h-[48px]"},h={20:{wide:"px-[4px] py-0",square:"h-[20px] w-[20px] flex items-center justify-center"},24:{wide:"px-[8px] py-[2px]",square:"h-[24px] w-[24px] flex items-center justify-center"},32:{wide:"px-[12px] py-[6px]",square:"h-[32px] w-[32px] flex items-center justify-center"},40:{wide:"px-[16px] py-[8px]",square:"h-[40px] w-[40px] flex items-center justify-center"},48:{wide:"px-[20px] py-[12px]",square:"h-[48px] w-[48px] flex items-center justify-center"}},g="40",b="border border-solid rounded rounded-[4px] flex cy-button-width font-medium items-center transition duration-150 hover:shadow-ring-hover focus:shadow-ring-focus active:shadow-ring-focus disabled:hover:shadow-none disabled:cursor-not-allowed focus-visible:ring-1 focus-visible:ring-offset-0 focus-visible:outline-none",f=o.defineComponent({emits:{click(e){return!!e}},props:{variant:{type:String,default:c},size:{type:String,default:g},disabled:{type:Boolean,default:!1},href:{type:String},type:{type:String,default:"button"},square:{type:Boolean,default:!1}},slots:Object,setup(e){const a=o.computed(()=>e.disabled&&!["outline-dark","outline-light","link"].includes(e.variant)?e.variant.includes("outline")||e.variant==="white"?"outline-disabled":"disabled":e.variant),d=o.computed(()=>e.disabled||e.variant==="disabled"||e.variant==="outline-disabled"),t=o.computed(()=>n[a.value]),r=o.computed(()=>[l[e.size],h[e.size][e.square?"square":"wide"]]),u=o.computed(()=>[b,t.value,r.value]);return{href:o.computed(()=>e.href),type:o.computed(()=>e.type),finalDisabled:d,allClasses:u}}}),p=(e,a)=>{const d=e.__vccOpts||e;for(const[t,r]of a)d[t]=r;return d},w=["href","aria-disabled"],y=["disabled","type"];function x(e,a,d,t,r,u){return e.href?(o.openBlock(),o.createElementBlock("a",{key:0,href:e.href,class:o.normalizeClass(e.allClasses),"aria-disabled":e.finalDisabled?"true":void 0,onClick:a[0]||(a[0]=i=>e.$emit("click",i))},[o.renderSlot(e.$slots,"default")],10,w)):(o.openBlock(),o.createElementBlock("button",{key:1,class:o.normalizeClass(e.allClasses),disabled:e.finalDisabled,type:e.type,onClick:a[1]||(a[1]=i=>e.$emit("click",i))},[o.renderSlot(e.$slots,"default")],10,y))}const m=p(f,[["render",x]]);s.SizeClassesTable=l,s.VariantClassesTable=n,s.default=m,Object.defineProperties(s,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(s,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],o):(s=typeof globalThis<"u"?globalThis:s||self,o(s.Button={},s.Vue))})(this,function(s,o){"use strict";const n={link:"text-indigo-600 border-transparent ring-transparent hover:underline disabled:text-gray-500 disabled:hocus:shadow-none disabled:no-underline hocus:shadow-transparent focus-visible:ring-gray-100 focus-visible:underline",white:"text-indigo-500 bg-white border-gray-100 hover:border-gray-200 disabled:hocus:shadow-none hocus:shadow-gray-50 disabled:text-gray-500 focus:ring-gray-200",disabled:"text-gray-500 bg-gray-100 border-gray-100 hover:shadow-none","outline-indigo":"border-indigo-500 text-indigo-500 disabled:hocus:shadow-none hocus:shadow-indigo-300/[.35] disabled:text-gray-500 focus:ring-indigo-600","outline-purple":"text-purple-500 border-purple-500 disabled:hocus:shadow-none hocus:shadow-purple-100 disabled:text-gray-500 focus:ring-purple-600","outline-gray":"text-gray-1000 border-gray-1000 disabled:hocus:shadow-none hocus:shadow-gray-100 disabled:text-gray-500 focus:ring-gray-1000","outline-light":"text-indigo-500 border-gray-100 hocus:border-gray-200 disabled:border-gray-100 disabled:hocus:shadow-none hocus:shadow-gray-50 disabled:text-gray-500 focus:ring-gray-200","outline-dark":"text-white border-white/20 hocus:border-white/60 disabled:hocus:shadow-none hocus:shadow-white/20 disabled:border-white/20 disabled:hover:border-white/20 disabled:text-white/50 focus:ring-gray-200","outline-disabled":"text-gray-500 border-gray-100 hover:shadow-none","indigo-light":"text-indigo-500 bg-indigo-50 border-indigo-50 hocus:border-indigo-200 disabled:hocus:shadow-none hocus:shadow-indigo-50 focus:ring-transparent","jade-light":"text-teal-600 bg-jade-200 border-transparent hocus:border-jade-300 disabled:hocus:shadow-none hocus:shadow-jade-50 focus:ring-transparent","jade-dark":"text-white bg-jade-500 border-jade-500 disabled:hocus:shadow-none hocus:shadow-jade-100 focus:ring-transparent focus:border-jade-600 focus:bg-jade-600","indigo-dark":"text-white bg-indigo-500 border-indigo-500 disabled:hocus:shadow-none hocus:shadow-indigo-100 focus:bg-indigo-600 focus:border-indigo-600 focus:ring-transparent","teal-dark":"text-white bg-teal-500 border-teal-500 disabled:hocus:shadow-none hocus:shadow-teal-100 focus:bg-teal-600 focus:bg-teal-600 focus:border-teal-600 focus:ring-transparent","purple-dark":"text-white bg-purple-500 border-purple-500 disabled:hocus:shadow-none hocus:shadow-purple-100 focus:bg-purple-600 focus:border-purple-600 focus:ring-transparent","red-dark":"text-white bg-red-500 border-red-500 disabled:hocus:shadow-none hocus:shadow-red-100 focus:bg-red-600 focus:border-red-600 focus:ring-transparent","gray-dark":"text-white bg-gray-800 border-gray-800 disabled:hocus:shadow-none hocus:shadow-gray-100 focus:bg-gray-900 focus:border-gray-900 focus:ring-transparent","gray-darkest":"text-white bg-gray-1000 border-gray-1000 disabled:hocus:shadow-none hocus:shadow-gray-100 focus:bg-gray-900 focus:border-gray-900 focus:ring-transparent"},c="indigo-dark",l={20:"text-[14px] leading-[18px] min-h-[20px]",24:"text-[14px] leading-[20px] min-h-[24px]",32:"text-[14px] leading-[20px] min-h-[32px]",40:"text-[16px] leading-[24px] min-h-[40px]",48:"text-[16px] leading-[24px] min-h-[48px]"},h={20:{wide:"px-[4px] py-0",square:"h-[20px] w-[20px] flex items-center justify-center"},24:{wide:"px-[8px] py-[1px]",square:"h-[24px] w-[24px] flex items-center justify-center"},32:{wide:"px-[12px] py-[5px]",square:"h-[32px] w-[32px] flex items-center justify-center"},40:{wide:"px-[16px] py-[7px]",square:"h-[40px] w-[40px] flex items-center justify-center"},48:{wide:"px-[20px] py-[11px]",square:"h-[48px] w-[48px] flex items-center justify-center"}},g="40",b="border border-solid rounded rounded-[4px] flex cy-button-width font-medium items-center transition duration-150 hover:shadow-ring-hover focus:shadow-ring-focus active:shadow-ring-focus disabled:hover:shadow-none disabled:cursor-not-allowed focus-visible:ring-1 focus-visible:ring-offset-0 focus-visible:outline-none",f=o.defineComponent({emits:{click(e){return!!e}},props:{variant:{type:String,default:c},size:{type:String,default:g},disabled:{type:Boolean,default:!1},href:{type:String},type:{type:String,default:"button"},square:{type:Boolean,default:!1}},slots:Object,setup(e){const a=o.computed(()=>e.disabled&&!["outline-dark","outline-light","link"].includes(e.variant)?e.variant.includes("outline")||e.variant==="white"?"outline-disabled":"disabled":e.variant),d=o.computed(()=>e.disabled||e.variant==="disabled"||e.variant==="outline-disabled"),t=o.computed(()=>n[a.value]),r=o.computed(()=>[l[e.size],h[e.size][e.square?"square":"wide"]]),u=o.computed(()=>[b,t.value,r.value]);return{href:o.computed(()=>e.href),type:o.computed(()=>e.type),finalDisabled:d,allClasses:u}}}),p=(e,a)=>{const d=e.__vccOpts||e;for(const[t,r]of a)d[t]=r;return d},w=["href","aria-disabled"],y=["disabled","type"];function x(e,a,d,t,r,u){return e.href?(o.openBlock(),o.createElementBlock("a",{key:0,href:e.href,class:o.normalizeClass(e.allClasses),"aria-disabled":e.finalDisabled?"true":void 0,onClick:a[0]||(a[0]=i=>e.$emit("click",i))},[o.renderSlot(e.$slots,"default")],10,w)):(o.openBlock(),o.createElementBlock("button",{key:1,class:o.normalizeClass(e.allClasses),disabled:e.finalDisabled,type:e.type,onClick:a[1]||(a[1]=i=>e.$emit("click",i))},[o.renderSlot(e.$slots,"default")],10,y))}const m=p(f,[["render",x]]);s.SizeClassesTable=l,s.VariantClassesTable=n,s.default=m,Object.defineProperties(s,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
 //# sourceMappingURL=index.umd.js.map
 
-/* <wind-keep class="outline text-indigo-600 border-transparent ring-transparent hover:underline disabled:text-gray-500 disabled:hocus:shadow-none disabled:no-underline hocus:shadow-transparent focus-visible:ring-gray-100 focus-visible:underline text-indigo-500 bg-white border-gray-100 hover:border-gray-200 hocus:shadow-gray-50 focus:ring-gray-200 text-gray-500 bg-gray-100 hover:shadow-none border-indigo-500 hocus:shadow-indigo-300/[.35] focus:ring-indigo-600 text-purple-500 border-purple-500 hocus:shadow-purple-100 focus:ring-purple-600 text-gray-1000 border-gray-1000 hocus:shadow-gray-100 focus:ring-gray-1000 hocus:border-gray-200 disabled:border-gray-100 text-white border-white/20 hocus:border-white/60 hocus:shadow-white/20 disabled:border-white/20 disabled:hover:border-white/20 disabled:text-white/50 bg-indigo-50 border-indigo-50 hocus:border-indigo-200 hocus:shadow-indigo-50 focus:ring-transparent text-teal-600 bg-jade-200 hocus:border-jade-300 hocus:shadow-jade-50 bg-jade-500 border-jade-500 hocus:shadow-jade-100 focus:border-jade-600 focus:bg-jade-600 bg-indigo-500 hocus:shadow-indigo-100 focus:bg-indigo-600 focus:border-indigo-600 bg-teal-500 border-teal-500 hocus:shadow-teal-100 focus:bg-teal-600 focus:border-teal-600 bg-purple-500 focus:bg-purple-600 focus:border-purple-600 bg-red-500 border-red-500 hocus:shadow-red-100 focus:bg-red-600 focus:border-red-600 bg-gray-800 border-gray-800 focus:bg-gray-900 focus:border-gray-900 bg-gray-1000 text-[14px] leading-[20px] min-h-[20px] min-h-[24px] min-h-[32px] text-[16px] leading-[24px] min-h-[40px] min-h-[48px] px-[4px] py-0 h-[20px] w-[20px] flex items-center justify-center px-[8px] py-[2px] h-[24px] w-[24px] px-[12px] py-[6px] h-[32px] w-[32px] px-[16px] py-[8px] h-[40px] w-[40px] px-[20px] py-[12px] h-[48px] w-[48px] border border-solid rounded rounded-[4px] cy-button-width font-medium transition duration-150 hover:shadow-ring-hover focus:shadow-ring-focus active:shadow-ring-focus disabled:hover:shadow-none disabled:cursor-not-allowed focus-visible:ring-1 focus-visible:ring-offset-0 focus-visible:outline-none"> */
+/* <wind-keep class="outline text-indigo-600 border-transparent ring-transparent hover:underline disabled:text-gray-500 disabled:hocus:shadow-none disabled:no-underline hocus:shadow-transparent focus-visible:ring-gray-100 focus-visible:underline text-indigo-500 bg-white border-gray-100 hover:border-gray-200 hocus:shadow-gray-50 focus:ring-gray-200 text-gray-500 bg-gray-100 hover:shadow-none border-indigo-500 hocus:shadow-indigo-300/[.35] focus:ring-indigo-600 text-purple-500 border-purple-500 hocus:shadow-purple-100 focus:ring-purple-600 text-gray-1000 border-gray-1000 hocus:shadow-gray-100 focus:ring-gray-1000 hocus:border-gray-200 disabled:border-gray-100 text-white border-white/20 hocus:border-white/60 hocus:shadow-white/20 disabled:border-white/20 disabled:hover:border-white/20 disabled:text-white/50 bg-indigo-50 border-indigo-50 hocus:border-indigo-200 hocus:shadow-indigo-50 focus:ring-transparent text-teal-600 bg-jade-200 hocus:border-jade-300 hocus:shadow-jade-50 bg-jade-500 border-jade-500 hocus:shadow-jade-100 focus:border-jade-600 focus:bg-jade-600 bg-indigo-500 hocus:shadow-indigo-100 focus:bg-indigo-600 focus:border-indigo-600 bg-teal-500 border-teal-500 hocus:shadow-teal-100 focus:bg-teal-600 focus:border-teal-600 bg-purple-500 focus:bg-purple-600 focus:border-purple-600 bg-red-500 border-red-500 hocus:shadow-red-100 focus:bg-red-600 focus:border-red-600 bg-gray-800 border-gray-800 focus:bg-gray-900 focus:border-gray-900 bg-gray-1000 text-[14px] leading-[18px] min-h-[20px] leading-[20px] min-h-[24px] min-h-[32px] text-[16px] leading-[24px] min-h-[40px] min-h-[48px] px-[4px] py-0 h-[20px] w-[20px] flex items-center justify-center px-[8px] py-[1px] h-[24px] w-[24px] px-[12px] py-[5px] h-[32px] w-[32px] px-[16px] py-[7px] h-[40px] w-[40px] px-[20px] py-[11px] h-[48px] w-[48px] border border-solid rounded rounded-[4px] cy-button-width font-medium transition duration-150 hover:shadow-ring-hover focus:shadow-ring-focus active:shadow-ring-focus disabled:hover:shadow-none disabled:cursor-not-allowed focus-visible:ring-1 focus-visible:ring-offset-0 focus-visible:outline-none"> */

package.json

 {
   "name": "@cypress-design/vue-button",
-  "version": "0.11.9",
+  "version": "0.11.10",
   "files": [
@@ -23,3 +23,3 @@ "*"
   "dependencies": {
-    "@cypress-design/constants-button": "^0.1.6"
+    "@cypress-design/constants-button": "^0.1.7"
   },
@@ -26,0 +26,0 @@ "devDependencies": {

No alert changes

Improved metrics

Total package byte prevSize

63953

0.75%

Dependency changes

• Updated

  @cypress-design/constants-button@^0.1.7