@pikas-ui/button - npm Package Compare versions

Comparing version 1.0.13 to 1.0.14

dist/button/Button.d.ts

@@ -29,2 +29,3 @@ import { CSS, BorderRadiusType, FontsSizesType, FontsWeightsType, ColorsType } from '@pikas-ui/styles';
     RightIcon?: React.FC<IconProps>;
+    borderWidth?: number;
 }
@@ -31,0 +32,0 @@ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

dist/button/Button.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var _styles = require('@pikas-ui/styles');var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _loader = require('@pikas-ui/loader');var _fontcolorcontrast = require('font-color-contrast'); var _fontcolorcontrast2 = _interopRequireDefault(_fontcolorcontrast);const B=_styles.styled.call(void 0, "button",{all:"unset",cursor:"pointer",outline:"none",display:"flex",alignItems:"center",justifyContent:"center",userSelect:"none",space:2,borderWidth:2,borderStyle:"solid",position:"relative",boxShadow:"$ELEVATION_BOTTOM_1",whiteSpace:"nowrap",boxSizing:"border-box",variants:{effect:{globalScale:{transition:"transform 250ms ease","&:hover":{transform:"scale(1.025)",transition:"transform 250ms ease"},"&:active":{transform:"scale(0.95)",transition:"transform 250ms ease"}},boxScale:{transition:"transform 250ms ease","&:after":{background:"inherit",content:"",position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:-1,transition:"transform 250ms ease",borderRadius:"inherit"},"&:hover:after":{transform:"scale(1.1)",transition:"transform 250ms"},"&:active":{transform:"scale(0.95)",transition:"transform 250ms ease"}},opacity:{transition:"opacity 500ms","&:hover":{opacity:.8},"&:active":{opacity:1,transition:"opacity 0s"}}},padding:{sm:{padding:"4px 24px"},md:{padding:"8px 32px"},lg:{padding:"16px 40px"}},state:{true:{cursor:"initial",opacity:.5}}}}),L=_styles.styled.call(void 0, "div",{display:"flex",alignItems:"center",justifyContent:"center",variants:{textTransform:{capitalize:{textTransform:"capitalize"},uppercase:{textTransform:"uppercase"},default:{"span::first-letter":{textTransform:"uppercase"}},none:{}},gap:{sm:{customGap:4},md:{customGap:8},lg:{customGap:16}}}}),W=_styles.styled.call(void 0, "div",{display:"flex",alignItems:"center",justifyContent:"center",position:"absolute",top:0,left:0,right:0,bottom:0}),F= exports.Button =_react.forwardRef.call(void 0, function({type:a,fullWidth:i,id:p,name:v,color:o,style:f,padding:l,form:$,loading:n,disabled:e,borderRadius:c,fontSize:d,textTransform:k,fontWeight:m,effect:u,onClick:y,children:M,gap:I,href:g,LeftIcon:T,RightIcon:h,outlined:P},z){const C=_react.useCallback.call(void 0, ()=>{e||n||_optionalChain([y, 'optionalCall', _ => _()])},[e,y,n]),b=()=>_react2.default.createElement(_react2.default.Fragment,null,_react2.default.createElement(W,null,_react2.default.createElement(_loader.BeatLoader,{size:_styles.theme.fontSizes["EM-XX-SMALL"].value,color:"WHITE",loading:n})),_react2.default.createElement(L,{textTransform:k,gap:I,css:{opacity:n?0:1}},T?_react2.default.createElement(T,{styles:{svg:{height:"1em",width:"1em"}}}):null,_react2.default.createElement("span",null,M),h?_react2.default.createElement(h,{styles:{svg:{height:"1em",width:"1em"}}}):null)),x=()=>P?{backgroundColor:"$TRANSPARENT",borderColor:`$${o}`,color:`$${o}`,svg:{fill:`$${o}`}}:{backgroundColor:`$${o}`,borderColor:`$${o}`,color:_fontcolorcontrast2.default.call(void 0, _styles.theme.colors[o||"PRIMARY"].value,.7),svg:{fill:_fontcolorcontrast2.default.call(void 0, _styles.theme.colors[o||"PRIMARY"].value,.7)}};return g?_react2.default.createElement(B,{as:"a",href:g,type:a,id:p,onClick:C,state:e,padding:l,effect:e?void 0:u,css:{width:i?"100%":"auto",br:c,fontWeight:`$${m}`,fontSize:`$${d}`,...x(),...f}},b()):_react2.default.createElement(B,{ref:z,form:$,type:a,id:p,name:v,onClick:C,state:e,padding:l,effect:e?void 0:u,css:{width:i?"100%":"auto",br:c,fontWeight:`$${m}`,fontSize:`$${d}`,...x(),...f}},b())});F.defaultProps={type:"button",fullWidth:!1,disabled:!1,loading:!1,borderRadius:"md",fontSize:"EM-MEDIUM",padding:"md",textTransform:"default",color:"PRIMARY",fontWeight:"NORMAL",gap:"md",effect:"opacity"};exports.Button = F;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var _styles = require('@pikas-ui/styles');var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _loader = require('@pikas-ui/loader');var _fontcolorcontrast = require('font-color-contrast'); var _fontcolorcontrast2 = _interopRequireDefault(_fontcolorcontrast);const $=_styles.styled.call(void 0, "button",{all:"unset",cursor:"pointer",outline:"none",display:"flex",alignItems:"center",justifyContent:"center",userSelect:"none",space:2,borderStyle:"solid",position:"relative",boxShadow:"$ELEVATION_BOTTOM_1",whiteSpace:"nowrap",boxSizing:"border-box",variants:{effect:{globalScale:{transition:"transform 250ms ease","&:hover":{transform:"scale(1.025)",transition:"transform 250ms ease"},"&:active":{transform:"scale(0.95)",transition:"transform 250ms ease"}},boxScale:{transition:"transform 250ms ease","&:after":{background:"inherit",content:"",position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:-1,transition:"transform 250ms ease",borderRadius:"inherit"},"&:hover:after":{transform:"scale(1.1)",transition:"transform 250ms"},"&:active":{transform:"scale(0.95)",transition:"transform 250ms ease"}},opacity:{transition:"opacity 500ms","&:hover":{opacity:.8},"&:active":{opacity:1,transition:"opacity 0s"}}},padding:{sm:{padding:"4px 24px"},md:{padding:"8px 32px"},lg:{padding:"16px 40px"}},state:{true:{cursor:"initial",opacity:.5}}}}),w=_styles.styled.call(void 0, "div",{display:"flex",alignItems:"center",justifyContent:"center",variants:{textTransform:{capitalize:{textTransform:"capitalize"},uppercase:{textTransform:"uppercase"},default:{"span::first-letter":{textTransform:"uppercase"}},none:{}},gap:{sm:{customGap:4},md:{customGap:8},lg:{customGap:16}}}}),F=_styles.styled.call(void 0, "div",{display:"flex",alignItems:"center",justifyContent:"center",position:"absolute",top:0,left:0,right:0,bottom:0}),O= exports.Button =_react.forwardRef.call(void 0, function({type:a,fullWidth:i,id:p,name:v,color:o,style:f,padding:l,form:k,loading:n,disabled:e,borderRadius:c,fontSize:d,textTransform:M,fontWeight:u,effect:m,onClick:y,children:z,gap:I,href:g,LeftIcon:T,RightIcon:b,outlined:P,borderWidth:C},R){const x=_react.useCallback.call(void 0, ()=>{e||n||_optionalChain([y, 'optionalCall', _ => _()])},[e,y,n]),S=()=>_react2.default.createElement(_react2.default.Fragment,null,_react2.default.createElement(F,null,_react2.default.createElement(_loader.BeatLoader,{size:_styles.theme.fontSizes["EM-XX-SMALL"].value,color:"WHITE",loading:n})),_react2.default.createElement(w,{textTransform:M,gap:I,css:{opacity:n?0:1}},T?_react2.default.createElement(T,{size:"1em"}):null,_react2.default.createElement("span",null,z),b?_react2.default.createElement(b,{size:"1em"}):null)),h=()=>P?{backgroundColor:"$TRANSPARENT",borderColor:`$${o}`,color:`$${o}`,svg:{fill:`$${o}`}}:{backgroundColor:`$${o}`,borderColor:`$${o}`,color:_fontcolorcontrast2.default.call(void 0, _styles.theme.colors[o||"PRIMARY"].value,.7),svg:{fill:_fontcolorcontrast2.default.call(void 0, _styles.theme.colors[o||"PRIMARY"].value,.7)}};return g?_react2.default.createElement($,{as:"a",href:g,type:a,id:p,onClick:x,state:e,padding:l,effect:e?void 0:m,css:{width:i?"100%":"auto",br:c,fontWeight:`$${u}`,borderWidth:C,fontSize:`$${d}`,...h(),...f}},S()):_react2.default.createElement($,{ref:R,form:k,type:a,id:p,name:v,onClick:x,state:e,padding:l,effect:e?void 0:m,css:{width:i?"100%":"auto",br:c,fontWeight:`$${u}`,borderWidth:C,fontSize:`$${d}`,...h(),...f}},S())});O.defaultProps={type:"button",fullWidth:!1,disabled:!1,loading:!1,borderRadius:"md",fontSize:"EM-MEDIUM",padding:"md",textTransform:"default",color:"PRIMARY",fontWeight:"NORMAL",gap:"md",effect:"opacity",borderWidth:2};exports.Button = O;
 //# sourceMappingURL=Button.js.map

dist/buttonIcon/ButtonIcon.d.ts

@@ -17,2 +17,3 @@ import { CSS, BorderRadiusType, SizesType, ColorsType } from '@pikas-ui/styles';
     borderRadius?: BorderRadiusType;
+    borderWidth?: number;
     padding?: keyof typeof ButtonPaddingType;
@@ -19,0 +20,0 @@ size?: SizesType;

dist/buttonIcon/ButtonIcon.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var _styles = require('@pikas-ui/styles');var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _loader = require('@pikas-ui/loader');var _fontcolorcontrast = require('font-color-contrast'); var _fontcolorcontrast2 = _interopRequireDefault(_fontcolorcontrast);const T=_styles.styled.call(void 0, "button",{all:"unset",cursor:"pointer",outline:"none",display:"flex",alignItems:"center",justifyContent:"center",userSelect:"none",space:2,borderWidth:2,borderStyle:"solid",position:"relative",boxShadow:"$ELEVATION_BOTTOM_1",whiteSpace:"nowrap",boxSizing:"border-box",variants:{effect:{globalScale:{transition:"transform 250ms ease","&:hover":{transform:"scale(1.025)",transition:"transform 250ms ease"},"&:active":{transform:"scale(0.95)",transition:"transform 250ms ease"}},boxScale:{transition:"transform 250ms ease","&:after":{background:"inherit",content:"",position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:-1,transition:"transform 250ms ease",borderRadius:"inherit"},"&:hover:after":{transform:"scale(1.1)",transition:"transform 250ms"},"&:active":{transform:"scale(0.95)",transition:"transform 250ms ease"}},opacity:{transition:"opacity 500ms","&:hover":{opacity:.8},"&:active":{opacity:1,transition:"opacity 0s"}}},padding:{sm:{padding:4},md:{padding:8},lg:{padding:16}},state:{true:{cursor:"initial",opacity:.5}}}}),z=_styles.styled.call(void 0, "div",{display:"flex",alignItems:"center",justifyContent:"center"}),M=_styles.styled.call(void 0, "div",{display:"flex",alignItems:"center",justifyContent:"center",position:"absolute",top:0,left:0,right:0,bottom:0}),E= exports.ButtonIcon =_react.forwardRef.call(void 0, function({type:s,id:i,name:I,color:t,style:a,padding:c,form:v,loading:n,disabled:e,borderRadius:p,effect:f,onClick:l,href:d,outlined:B,Icon:h,size:m},k){const u=_react.useCallback.call(void 0, ()=>{e||n||_optionalChain([l, 'optionalCall', _ => _()])},[e,l,n]),y=()=>_react2.default.createElement(_react2.default.Fragment,null,_react2.default.createElement(M,null,_react2.default.createElement(_loader.ClipLoader,{size:_styles.Sizes[m||"md"],color:"WHITE",loading:n})),_react2.default.createElement(z,{css:{opacity:n?0:1}},_react2.default.createElement(h,{size:_styles.Sizes[m||"md"]}))),g=()=>B?{backgroundColor:"$TRANSPARENT",borderColor:`$${t}`,color:`$${t}`,svg:{fill:`$${t}`}}:{backgroundColor:`$${t}`,borderColor:`$${t}`,color:_fontcolorcontrast2.default.call(void 0, _styles.theme.colors[t||"PRIMARY"].value,.7),svg:{fill:_fontcolorcontrast2.default.call(void 0, _styles.theme.colors[t||"PRIMARY"].value,.7)}};return d?_react2.default.createElement(T,{as:"a",href:d,type:s,id:i,onClick:u,state:e,padding:c,effect:e?void 0:f,css:{br:p,...g(),...a}},y()):_react2.default.createElement(T,{ref:k,form:v,type:s,id:i,name:I,onClick:u,state:e,padding:c,effect:e?void 0:f,css:{br:p,...g(),...a}},y())});E.defaultProps={type:"button",disabled:!1,loading:!1,borderRadius:"md",color:"PRIMARY",size:"md",effect:"opacity"};exports.ButtonIcon = E;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }var _styles = require('@pikas-ui/styles');var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _loader = require('@pikas-ui/loader');var _fontcolorcontrast = require('font-color-contrast'); var _fontcolorcontrast2 = _interopRequireDefault(_fontcolorcontrast);const I=_styles.styled.call(void 0, "button",{all:"unset",cursor:"pointer",outline:"none",display:"flex",alignItems:"center",justifyContent:"center",userSelect:"none",space:2,borderStyle:"solid",position:"relative",boxShadow:"$ELEVATION_BOTTOM_1",whiteSpace:"nowrap",boxSizing:"border-box",variants:{effect:{globalScale:{transition:"transform 250ms ease","&:hover":{transform:"scale(1.025)",transition:"transform 250ms ease"},"&:active":{transform:"scale(0.95)",transition:"transform 250ms ease"}},boxScale:{transition:"transform 250ms ease","&:after":{background:"inherit",content:"",position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:-1,transition:"transform 250ms ease",borderRadius:"inherit"},"&:hover:after":{transform:"scale(1.1)",transition:"transform 250ms"},"&:active":{transform:"scale(0.95)",transition:"transform 250ms ease"}},opacity:{transition:"opacity 500ms","&:hover":{opacity:.8},"&:active":{opacity:1,transition:"opacity 0s"}}},padding:{sm:{padding:4},md:{padding:8},lg:{padding:16}},state:{true:{cursor:"initial",opacity:.5}}}}),M=_styles.styled.call(void 0, "div",{display:"flex",alignItems:"center",justifyContent:"center"}),E=_styles.styled.call(void 0, "div",{display:"flex",alignItems:"center",justifyContent:"center",position:"absolute",top:0,left:0,right:0,bottom:0}),A= exports.ButtonIcon =_react.forwardRef.call(void 0, function({type:i,id:s,name:v,color:t,style:a,padding:c,form:B,loading:n,disabled:e,borderRadius:p,effect:f,onClick:l,href:d,outlined:h,Icon:k,size:m,borderWidth:u},$){const y=_react.useCallback.call(void 0, ()=>{e||n||_optionalChain([l, 'optionalCall', _ => _()])},[e,l,n]),g=()=>_react2.default.createElement(_react2.default.Fragment,null,_react2.default.createElement(E,null,_react2.default.createElement(_loader.ClipLoader,{size:_styles.Sizes[m||"md"],color:"WHITE",loading:n})),_react2.default.createElement(M,{css:{opacity:n?0:1}},_react2.default.createElement(k,{size:_styles.Sizes[m||"md"]}))),C=()=>h?{backgroundColor:"$TRANSPARENT",borderColor:`$${t}`,color:`$${t}`,svg:{fill:`$${t}`}}:{backgroundColor:`$${t}`,borderColor:`$${t}`,color:_fontcolorcontrast2.default.call(void 0, _styles.theme.colors[t||"PRIMARY"].value,.7),svg:{fill:_fontcolorcontrast2.default.call(void 0, _styles.theme.colors[t||"PRIMARY"].value,.7)}};return d?_react2.default.createElement(I,{as:"a",href:d,type:i,id:s,onClick:y,state:e,padding:c,effect:e?void 0:f,css:{br:p,borderWidth:u,...C(),...a}},g()):_react2.default.createElement(I,{ref:$,form:B,type:i,id:s,name:v,onClick:y,state:e,padding:c,effect:e?void 0:f,css:{br:p,borderWidth:u,...C(),...a}},g())});A.defaultProps={type:"button",disabled:!1,loading:!1,borderRadius:"md",color:"PRIMARY",size:"md",effect:"opacity",borderWidth:2};exports.ButtonIcon = A;
 //# sourceMappingURL=ButtonIcon.js.map

package.json

 {
   "name": "@pikas-ui/button",
-  "version": "1.0.13",
+  "version": "1.0.14",
   "private": false,
@@ -33,5 +33,5 @@ "description": "",
   "dependencies": {
-    "@pikas-ui/icons": "1.0.13",
-    "@pikas-ui/loader": "1.0.13",
-    "@pikas-ui/styles": "1.0.13",
+    "@pikas-ui/icons": "1.0.14",
+    "@pikas-ui/loader": "1.0.14",
+    "@pikas-ui/styles": "1.0.14",
     "font-color-contrast": "^11.1.0",
@@ -44,4 +44,4 @@ "react": "^18.1.0",
     "@pikas-ui/tsconfig": "workspace:*",
-    "@types/node": "^17.0.35",
-    "@types/react": "^18.0.9",
+    "@types/node": "^17.0.38",
+    "@types/react": "^18.0.10",
     "@types/react-dom": "^18.0.5",
@@ -48,0 +48,0 @@ "eslint": "^8.16.0",

No alert changes

Improved metrics

Lines of code

166

increased by1.22%

Worsened metrics

Total package byte prevSize

63103

decreased by-0.54%

Dependency changes

• + Added@iconify/react@3.2.2(transitive)

• + Added@iconify/types@1.1.0(transitive)

• + Added@pikas-ui/icons@1.0.14(transitive)

• + Added@pikas-ui/loader@1.0.14(transitive)

• + Added@pikas-ui/styles@1.0.14(transitive)

• + Added@webcomponents/webcomponentsjs@2.8.0(transitive)

• + Addedboxicons@2.1.4(transitive)

• + Addeddetect-hover@1.0.3(transitive)

• + Addeddetect-it@3.0.7(transitive)

• + Addeddetect-passive-events@1.0.5(transitive)

• + Addeddetect-pointer@1.0.3(transitive)

• + Addeddetect-touch-events@2.0.2(transitive)

• + Addedhistory@4.10.1(transitive)

• + Addedhoist-non-react-statics@2.5.5(transitive)

• + Addediconify-icon@0.0.6(transitive)

• + Addedinvariant@2.2.4(transitive)

• + Addedisarray@0.0.1(transitive)

• + Addedobject-assign@4.1.1(transitive)

• + Addedpath-to-regexp@1.9.0(transitive)

• + Addedprop-types@15.8.1(transitive)

• + Addedreact@16.14.0(transitive)

• + Addedreact-dom@16.14.0(transitive)

• + Addedreact-interactive@0.8.3(transitive)

• + Addedreact-router@4.3.1(transitive)

• + Addedreact-router-dom@4.3.1(transitive)

• + Addedresolve-pathname@3.0.0(transitive)

• + Addedscheduler@0.19.1(transitive)

• + Addedtiny-invariant@1.3.3(transitive)

• + Addedtiny-warning@1.0.3(transitive)

• + Addedvalue-equal@1.0.1(transitive)

• + Addedwarning@4.0.3(transitive)

• - Removed@pikas-ui/icons@1.0.13(transitive)

• - Removed@pikas-ui/loader@1.0.13(transitive)

• - Removed@pikas-ui/styles@1.0.13(transitive)

• Updated@pikas-ui/icons@1.0.14

• Updated@pikas-ui/loader@1.0.14

• Updated@pikas-ui/styles@1.0.14