Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@justeat/f-button

Package Overview
Dependencies
Maintainers
53
Versions
45
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@justeat/f-button - npm Package Compare versions

Comparing version 3.0.2 to 3.2.0

test-utils/component-objects/f-button--link.component.js

27

CHANGELOG.md

@@ -7,2 +7,29 @@ # Changelog

v3.2.0
------------------------------
*October 25, 2021*
### Changed
- Button border style definition moved to button types. Introduced `background-color()` mixin to apply the same colour for the background and for the border colour.
- Each button size vertical padding reduced by 1px to make button height 56px/48px/40px/32px instead of 58px/50px/42px/34px.
### Removed
- Outline css styles as focus styles applied with `box-shadow`.
v3.1.0
------------------------------
*October 22, 2021*
### Changed
- Add spacing to buttons following a paragraph tag. This matches the current behaviour in Fozzie.
- Removed the background from the link button in disabled state.
- `f-vue-icons` package version bump.
- Button story now shows all the types and sizes of the button component (primary, secondary, outline and ghost).
- Changed knobs to controls for switching button props.
- Separate Demo story to still show one button in isolation.
- Separate story for Link Button to be able to run tests properly.
- Updated the tests in line with the changes.
v3.0.2

@@ -9,0 +36,0 @@ ------------------------------

10

dist/f-button.common.js

@@ -122,3 +122,3 @@ module.exports =

// CONCATENATED MODULE: /Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"03bd7195-vue-loader-template"}!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js??ref--0-0!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/components/Button.vue?vue&type=template&id=81d1b1b4&
// CONCATENATED MODULE: /Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"03bd7195-vue-loader-template"}!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js??ref--0-0!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/components/Button.vue?vue&type=template&id=c210f3ae&
var render = function () {

@@ -134,3 +134,3 @@ var _obj, _obj$1;

// CONCATENATED MODULE: ./src/components/Button.vue?vue&type=template&id=81d1b1b4&
// CONCATENATED MODULE: ./src/components/Button.vue?vue&type=template&id=c210f3ae&

@@ -432,3 +432,3 @@ // CONCATENATED MODULE: /Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"03bd7195-vue-loader-template"}!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js??ref--0-0!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/components/Action.vue?vue&type=template&id=5e41886b&

* Renders `RouterLink` component if a `to` attribute is applied to the component, avoids page reload compared to Link with `href`
* Renders `Action` component if no `href` attrivute is applied to the component
* Renders `Action` component if no `href` attribute is applied to the component
*/

@@ -489,3 +489,3 @@ componentType: function componentType() {

if (!VALID_BUTTON_ICON_POSITION.includes(this.hasIcon)) {
throw new TypeError("hasIcon is set to \"".concat(this.hasIcon, "\", but it can only be one of the following buttonSizes: \"").concat(VALID_BUTTON_ICON_POSITION.join('", "'), "\""));
throw new TypeError("hasIcon is set to \"".concat(this.hasIcon, "\", but it can only be one of the following button icon positions: \"").concat(VALID_BUTTON_ICON_POSITION.join('", "'), "\""));
}

@@ -632,3 +632,3 @@ }

// extracted by mini-css-extract-plugin
module.exports = {"c-screen-sizer":"Button_c-screen-sizer_aacnl","c-spinner-wrapper":"Button_c-spinner-wrapper_16dYe","c-spinner":"Button_c-spinner_16ib0","spin":"Button_spin_1l7_1","o-btn":"Button_o-btn_1KX8u","o-btn--link":"Button_o-btn--link_2f-eF","o-button-content":"Button_o-button-content_3Ow1e","o-btn-content--hidden":"Button_o-btn-content--hidden_1592m","o-btn-icon":"Button_o-btn-icon_rKd_B","o-btn-icon--leading":"Button_o-btn-icon--leading_2MkiQ","o-btn-icon--trailing":"Button_o-btn-icon--trailing_R6HPj","o-btn--primary":"Button_o-btn--primary_NRuBe","o-btn--icon":"Button_o-btn--icon_1k-qM","o-btn--loading":"Button_o-btn--loading_2up-7","o-btn--sizeSmall":"Button_o-btn--sizeSmall_WNBZx","o-btn--sizeXSmall":"Button_o-btn--sizeXSmall_3KRtq","o-btn--secondary":"Button_o-btn--secondary_1KBR1","o-btn--outline":"Button_o-btn--outline_3TR6n","o-btn--ghost":"Button_o-btn--ghost_1hnGu","o-btn--ghostTertiary":"Button_o-btn--ghostTertiary_2F6ho","o-btn--inverse":"Button_o-btn--inverse_1uhdX","o-btn--ghostInverse":"Button_o-btn--ghostInverse_2oPMZ","o-btn--sizeLarge":"Button_o-btn--sizeLarge_3A8Ov","o-btn--sizeMedium":"Button_o-btn--sizeMedium_2uSln","o-btn--fullWidth":"Button_o-btn--fullWidth_1xkfh","is-disabled":"Button_is-disabled_1zPQV","skeletonGradient":"Button_skeletonGradient_2l0Iq"};
module.exports = {"c-screen-sizer":"Button_c-screen-sizer_aacnl","c-spinner-wrapper":"Button_c-spinner-wrapper_16dYe","c-spinner":"Button_c-spinner_16ib0","spin":"Button_spin_1l7_1","o-btn":"Button_o-btn_1KX8u","o-button-content":"Button_o-button-content_3Ow1e","o-btn-content--hidden":"Button_o-btn-content--hidden_1592m","o-btn-icon":"Button_o-btn-icon_rKd_B","o-btn-icon--leading":"Button_o-btn-icon--leading_2MkiQ","o-btn-icon--trailing":"Button_o-btn-icon--trailing_R6HPj","o-btn--primary":"Button_o-btn--primary_NRuBe","o-btn--icon":"Button_o-btn--icon_1k-qM","o-btn--loading":"Button_o-btn--loading_2up-7","o-btn--sizeSmall":"Button_o-btn--sizeSmall_WNBZx","o-btn--sizeXSmall":"Button_o-btn--sizeXSmall_3KRtq","o-btn--secondary":"Button_o-btn--secondary_1KBR1","o-btn--outline":"Button_o-btn--outline_3TR6n","o-btn--ghost":"Button_o-btn--ghost_1hnGu","o-btn--ghostTertiary":"Button_o-btn--ghostTertiary_2F6ho","o-btn--inverse":"Button_o-btn--inverse_1uhdX","o-btn--ghostInverse":"Button_o-btn--ghostInverse_2oPMZ","o-btn--link":"Button_o-btn--link_2f-eF","o-btn--sizeLarge":"Button_o-btn--sizeLarge_3A8Ov","o-btn--sizeMedium":"Button_o-btn--sizeMedium_2uSln","o-btn--fullWidth":"Button_o-btn--fullWidth_1xkfh","is-disabled":"Button_is-disabled_1zPQV","skeletonGradient":"Button_skeletonGradient_2l0Iq"};

@@ -635,0 +635,0 @@ /***/ }),

@@ -131,3 +131,3 @@ (function webpackUniversalModuleDefinition(root, factory) {

// CONCATENATED MODULE: /Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"03bd7195-vue-loader-template"}!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js??ref--0-0!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/components/Button.vue?vue&type=template&id=81d1b1b4&
// CONCATENATED MODULE: /Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"03bd7195-vue-loader-template"}!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js??ref--0-0!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/components/Button.vue?vue&type=template&id=c210f3ae&
var render = function () {

@@ -143,3 +143,3 @@ var _obj, _obj$1;

// CONCATENATED MODULE: ./src/components/Button.vue?vue&type=template&id=81d1b1b4&
// CONCATENATED MODULE: ./src/components/Button.vue?vue&type=template&id=c210f3ae&

@@ -441,3 +441,3 @@ // CONCATENATED MODULE: /Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"03bd7195-vue-loader-template"}!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/cache-loader/dist/cjs.js??ref--0-0!/Users/maryia.radchuk/Documents/work/fozzie-components/node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/components/Action.vue?vue&type=template&id=5e41886b&

* Renders `RouterLink` component if a `to` attribute is applied to the component, avoids page reload compared to Link with `href`
* Renders `Action` component if no `href` attrivute is applied to the component
* Renders `Action` component if no `href` attribute is applied to the component
*/

@@ -498,3 +498,3 @@ componentType: function componentType() {

if (!VALID_BUTTON_ICON_POSITION.includes(this.hasIcon)) {
throw new TypeError("hasIcon is set to \"".concat(this.hasIcon, "\", but it can only be one of the following buttonSizes: \"").concat(VALID_BUTTON_ICON_POSITION.join('", "'), "\""));
throw new TypeError("hasIcon is set to \"".concat(this.hasIcon, "\", but it can only be one of the following button icon positions: \"").concat(VALID_BUTTON_ICON_POSITION.join('", "'), "\""));
}

@@ -641,3 +641,3 @@ }

// extracted by mini-css-extract-plugin
module.exports = {"c-screen-sizer":"Button_c-screen-sizer_aacnl","c-spinner-wrapper":"Button_c-spinner-wrapper_16dYe","c-spinner":"Button_c-spinner_16ib0","spin":"Button_spin_1l7_1","o-btn":"Button_o-btn_1KX8u","o-btn--link":"Button_o-btn--link_2f-eF","o-button-content":"Button_o-button-content_3Ow1e","o-btn-content--hidden":"Button_o-btn-content--hidden_1592m","o-btn-icon":"Button_o-btn-icon_rKd_B","o-btn-icon--leading":"Button_o-btn-icon--leading_2MkiQ","o-btn-icon--trailing":"Button_o-btn-icon--trailing_R6HPj","o-btn--primary":"Button_o-btn--primary_NRuBe","o-btn--icon":"Button_o-btn--icon_1k-qM","o-btn--loading":"Button_o-btn--loading_2up-7","o-btn--sizeSmall":"Button_o-btn--sizeSmall_WNBZx","o-btn--sizeXSmall":"Button_o-btn--sizeXSmall_3KRtq","o-btn--secondary":"Button_o-btn--secondary_1KBR1","o-btn--outline":"Button_o-btn--outline_3TR6n","o-btn--ghost":"Button_o-btn--ghost_1hnGu","o-btn--ghostTertiary":"Button_o-btn--ghostTertiary_2F6ho","o-btn--inverse":"Button_o-btn--inverse_1uhdX","o-btn--ghostInverse":"Button_o-btn--ghostInverse_2oPMZ","o-btn--sizeLarge":"Button_o-btn--sizeLarge_3A8Ov","o-btn--sizeMedium":"Button_o-btn--sizeMedium_2uSln","o-btn--fullWidth":"Button_o-btn--fullWidth_1xkfh","is-disabled":"Button_is-disabled_1zPQV","skeletonGradient":"Button_skeletonGradient_2l0Iq"};
module.exports = {"c-screen-sizer":"Button_c-screen-sizer_aacnl","c-spinner-wrapper":"Button_c-spinner-wrapper_16dYe","c-spinner":"Button_c-spinner_16ib0","spin":"Button_spin_1l7_1","o-btn":"Button_o-btn_1KX8u","o-button-content":"Button_o-button-content_3Ow1e","o-btn-content--hidden":"Button_o-btn-content--hidden_1592m","o-btn-icon":"Button_o-btn-icon_rKd_B","o-btn-icon--leading":"Button_o-btn-icon--leading_2MkiQ","o-btn-icon--trailing":"Button_o-btn-icon--trailing_R6HPj","o-btn--primary":"Button_o-btn--primary_NRuBe","o-btn--icon":"Button_o-btn--icon_1k-qM","o-btn--loading":"Button_o-btn--loading_2up-7","o-btn--sizeSmall":"Button_o-btn--sizeSmall_WNBZx","o-btn--sizeXSmall":"Button_o-btn--sizeXSmall_3KRtq","o-btn--secondary":"Button_o-btn--secondary_1KBR1","o-btn--outline":"Button_o-btn--outline_3TR6n","o-btn--ghost":"Button_o-btn--ghost_1hnGu","o-btn--ghostTertiary":"Button_o-btn--ghostTertiary_2F6ho","o-btn--inverse":"Button_o-btn--inverse_1uhdX","o-btn--ghostInverse":"Button_o-btn--ghostInverse_2oPMZ","o-btn--link":"Button_o-btn--link_2f-eF","o-btn--sizeLarge":"Button_o-btn--sizeLarge_3A8Ov","o-btn--sizeMedium":"Button_o-btn--sizeMedium_2uSln","o-btn--fullWidth":"Button_o-btn--fullWidth_1xkfh","is-disabled":"Button_is-disabled_1zPQV","skeletonGradient":"Button_skeletonGradient_2l0Iq"};

@@ -644,0 +644,0 @@ /***/ }),

@@ -1,2 +0,2 @@

(function(t,n){"object"===typeof exports&&"object"===typeof module?module.exports=n():"function"===typeof define&&define.amd?define([],n):"object"===typeof exports?exports["f-button"]=n():t["f-button"]=n()})("undefined"!==typeof self?self:this,(function(){return function(t){var n={};function e(o){if(n[o])return n[o].exports;var i=n[o]={i:o,l:!1,exports:{}};return t[o].call(i.exports,i,i.exports,e),i.l=!0,i.exports}return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:o})},e.r=function(t){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,n){if(1&n&&(t=e(t)),8&n)return t;if(4&n&&"object"===typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(e.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&n&&"string"!=typeof t)for(var i in t)e.d(o,i,function(n){return t[n]}.bind(null,i));return o},e.n=function(t){var n=t&&t.__esModule?function(){return t["default"]}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},e.p="",e(e.s="fa16")}({"05e9":function(t,n){var e;e=function(){return this}();try{e=e||new Function("return this")()}catch(o){"object"===typeof window&&(e=window)}t.exports=e},"2a7d":function(t,n,e){"use strict";var o=function(){var t,n,e=this,o=e.$createElement,i=e._self._c||o;return i(e.componentType,e._g(e._b({tag:"component",class:[e.$style["o-btn"],e.$style["o-btn--"+e.buttonType],e.$style["o-btn--size"+e.buttonSizeClassname],(t={},t[e.$style["o-btn--icon"]]=e.isIcon,t[e.$style["o-btn--fullWidth"]]=e.isFullWidth,t[e.$style["o-btn--loading"]]=e.isLoading,t)],attrs:{"action-type":e.buttonActionType,"data-test-id":e.componentType+"-component","aria-live":e.getAriaLive,"aria-busy":e.isLoading}},"component",e.$attrs,!1),!e.isLoading&&e.$listeners),[e.hasNestedContent?[e.isLoading?i("span",{class:e.$style["c-spinner"],attrs:{"data-test-id":e.componentType+"-spinner"}}):e._e(),i("span",{class:[e.$style["o-button-content"],(n={},n[e.$style["o-btn-content--hidden"]]=e.isLoading,n)]},[e.hasLeadingIcon?i("span",{class:[e.$style["o-btn-icon"],e.$style["o-btn-icon--leading"]],attrs:{"data-test-id":"button-leading-icon"}},[e._t("leading-icon")],2):e._e(),e._t("default"),e.hasTrailingIcon?i("span",{class:[e.$style["o-btn-icon"],e.$style["o-btn-icon--trailing"]],attrs:{"data-test-id":"button-trailing-icon"}},[e._t("trailing-icon")],2):e._e()],2)]:[e._t("default")]],2)},i=[],r=function(){var t=this,n=t.$createElement,e=t._self._c||n;return e("button",t._g({attrs:{type:t.actionType}},t.$listeners),[t._t("default")],2)},s=[],u={props:{actionType:{type:String,required:!0}}},a=u;function c(t,n,e,o,i,r,s,u){var a,c="function"===typeof t?t.options:t;if(n&&(c.render=n,c.staticRenderFns=e,c._compiled=!0),o&&(c.functional=!0),r&&(c._scopeId="data-v-"+r),s?(a=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"===typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),i&&i.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},c._ssrRegister=a):i&&(a=u?function(){i.call(this,(c.functional?this.parent:this).$root.$options.shadowRoot)}:i),a)if(c.functional){c._injectStyles=a;var l=c.render;c.render=function(t,n){return a.call(n),l(t,n)}}else{var d=c.beforeCreate;c.beforeCreate=d?[].concat(d,a):[a]}return{exports:t,options:c}}var l=c(a,r,s,!1,null,null,null),d=l.exports,p=function(){var t=this,n=t.$createElement,e=t._self._c||n;return e("a",t._g({},t.$listeners),[t._t("default")],2)},f=[],b={},h=c(b,p,f,!1,null,null,null),_=h.exports,y={iconButton:["primary","secondary","ghost","ghostTertiary","inverse","ghostInverse"],button:["primary","secondary","outline","ghost","link"]},g=["xsmall","small","medium","large"],m=["leading","trailing",!1],v={name:"FButton",components:{ActionButton:d,LinkButton:_},props:{buttonType:{type:String,default:"primary"},buttonSize:{type:String,default:"medium"},isFullWidth:{type:Boolean,default:!1},actionType:{type:String,default:"button"},isIcon:{type:Boolean,default:!1},isLoading:{type:Boolean,default:!1},hasIcon:{type:[Boolean,String],default:!1}},computed:{buttonActionType:function(){return this.$attrs.href||this.$attrs.to?null:this.actionType},buttonSizeClassname:function(){return"xsmall"===this.buttonSize?this.buttonSize.slice(0,2).toUpperCase()+this.buttonSize.slice(2):this.buttonSize.charAt(0).toUpperCase()+this.buttonSize.slice(1)},componentType:function(){return this.$attrs.href?"link-button":this.$attrs.to?"router-link":"action-button"},getAriaLive:function(){return this.isLoading?"polite":"off"},hasTrailingIcon:function(){return this.hasIcon&&"trailing"===this.hasIcon},hasLeadingIcon:function(){return this.hasIcon&&"leading"===this.hasIcon},hasNestedContent:function(){return this.isLoading||this.hasLeadingIcon||this.hasTrailingIcon}},watch:{$props:{immediate:!0,handler:function(){this.validateProps()}}},methods:{validateProps:function(){var t=this.isIcon?"iconButton":"button",n=y[t];if(!n.includes(this.buttonType))throw new TypeError("".concat(t,' is set to have buttonType="').concat(this.buttonType,'", but it can only be one of the following buttonTypes: "').concat(n.join('", "'),'"'));if(!g.includes(this.buttonSize))throw new TypeError('buttonSize is set to "'.concat(this.buttonSize,'", but it can only be one of the following buttonSizes: "').concat(g.join('", "'),'"'));if(!m.includes(this.hasIcon))throw new TypeError('hasIcon is set to "'.concat(this.hasIcon,'", but it can only be one of the following buttonSizes: "').concat(m.join('", "'),'"'))}}},S=v,B=e("4e4b");function T(t){this["$style"]=B["default"].locals||B["default"]}var $=c(S,o,i,!1,T,null,null);n["a"]=$.exports},"4e4b":function(t,n,e){"use strict";var o=e("9a8d"),i=e.n(o);e.d(n,"default",(function(){return i.a}))},"7e10":function(t,n,e){var o,i,r;(function(e,s){i=[],o=s,r="function"===typeof o?o.apply(n,i):o,void 0===r||(t.exports=r)})("undefined"!==typeof self&&self,(function(){function t(){var n=Object.getOwnPropertyDescriptor(document,"currentScript");if(!n&&"currentScript"in document&&document.currentScript)return document.currentScript;if(n&&n.get!==t&&document.currentScript)return document.currentScript;try{throw new Error}catch(f){var e,o,i,r=/.*at [^(]*\((.*):(.+):(.+)\)$/gi,s=/@([^@]*):(\d+):(\d+)\s*$/gi,u=r.exec(f.stack)||s.exec(f.stack),a=u&&u[1]||!1,c=u&&u[2]||!1,l=document.location.href.replace(document.location.hash,""),d=document.getElementsByTagName("script");a===l&&(e=document.documentElement.outerHTML,o=new RegExp("(?:[^\\n]+?\\n){0,"+(c-2)+"}[^<]*<script>([\\d\\D]*?)<\\/script>[\\d\\D]*","i"),i=e.replace(o,"$1").trim());for(var p=0;p<d.length;p++){if("interactive"===d[p].readyState)return d[p];if(d[p].src===a)return d[p];if(a===l&&d[p].innerHTML&&d[p].innerHTML.trim()===i)return d[p]}return null}}return t}))},"9a8d":function(t,n,e){t.exports={"c-screen-sizer":"Button_c-screen-sizer_aacnl","c-spinner-wrapper":"Button_c-spinner-wrapper_16dYe","c-spinner":"Button_c-spinner_16ib0",spin:"Button_spin_1l7_1","o-btn":"Button_o-btn_1KX8u","o-btn--link":"Button_o-btn--link_2f-eF","o-button-content":"Button_o-button-content_3Ow1e","o-btn-content--hidden":"Button_o-btn-content--hidden_1592m","o-btn-icon":"Button_o-btn-icon_rKd_B","o-btn-icon--leading":"Button_o-btn-icon--leading_2MkiQ","o-btn-icon--trailing":"Button_o-btn-icon--trailing_R6HPj","o-btn--primary":"Button_o-btn--primary_NRuBe","o-btn--icon":"Button_o-btn--icon_1k-qM","o-btn--loading":"Button_o-btn--loading_2up-7","o-btn--sizeSmall":"Button_o-btn--sizeSmall_WNBZx","o-btn--sizeXSmall":"Button_o-btn--sizeXSmall_3KRtq","o-btn--secondary":"Button_o-btn--secondary_1KBR1","o-btn--outline":"Button_o-btn--outline_3TR6n","o-btn--ghost":"Button_o-btn--ghost_1hnGu","o-btn--ghostTertiary":"Button_o-btn--ghostTertiary_2F6ho","o-btn--inverse":"Button_o-btn--inverse_1uhdX","o-btn--ghostInverse":"Button_o-btn--ghostInverse_2oPMZ","o-btn--sizeLarge":"Button_o-btn--sizeLarge_3A8Ov","o-btn--sizeMedium":"Button_o-btn--sizeMedium_2uSln","o-btn--fullWidth":"Button_o-btn--fullWidth_1xkfh","is-disabled":"Button_is-disabled_1zPQV",skeletonGradient:"Button_skeletonGradient_2l0Iq"}},b635:function(t,n,e){"use strict";(function(t){e.d(n,"b",(function(){return i}));var o=e("2a7d");function i(t){i.installed||(i.installed=!0,t.component("FButton",o["a"]))}var r={install:i},s=null;"undefined"!==typeof window?s=window.Vue:"undefined"!==typeof t&&(s=t.Vue),s&&s.use(r),n["a"]=o["a"]}).call(this,e("05e9"))},fa16:function(t,n,e){"use strict";if(e.r(n),e.d(n,"install",(function(){return s["b"]})),"undefined"!==typeof window){var o=window.document.currentScript,i=e("7e10");o=i(),"currentScript"in document||Object.defineProperty(document,"currentScript",{get:i});var r=o&&o.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);r&&(e.p=r[1])}var s=e("b635");n["default"]=s["a"]}})}));
(function(t,n){"object"===typeof exports&&"object"===typeof module?module.exports=n():"function"===typeof define&&define.amd?define([],n):"object"===typeof exports?exports["f-button"]=n():t["f-button"]=n()})("undefined"!==typeof self?self:this,(function(){return function(t){var n={};function e(o){if(n[o])return n[o].exports;var i=n[o]={i:o,l:!1,exports:{}};return t[o].call(i.exports,i,i.exports,e),i.l=!0,i.exports}return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:o})},e.r=function(t){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,n){if(1&n&&(t=e(t)),8&n)return t;if(4&n&&"object"===typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(e.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&n&&"string"!=typeof t)for(var i in t)e.d(o,i,function(n){return t[n]}.bind(null,i));return o},e.n=function(t){var n=t&&t.__esModule?function(){return t["default"]}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},e.p="",e(e.s="fa16")}({"05e9":function(t,n){var e;e=function(){return this}();try{e=e||new Function("return this")()}catch(o){"object"===typeof window&&(e=window)}t.exports=e},"2a7d":function(t,n,e){"use strict";var o=function(){var t,n,e=this,o=e.$createElement,i=e._self._c||o;return i(e.componentType,e._g(e._b({tag:"component",class:[e.$style["o-btn"],e.$style["o-btn--"+e.buttonType],e.$style["o-btn--size"+e.buttonSizeClassname],(t={},t[e.$style["o-btn--icon"]]=e.isIcon,t[e.$style["o-btn--fullWidth"]]=e.isFullWidth,t[e.$style["o-btn--loading"]]=e.isLoading,t)],attrs:{"action-type":e.buttonActionType,"data-test-id":e.componentType+"-component","aria-live":e.getAriaLive,"aria-busy":e.isLoading}},"component",e.$attrs,!1),!e.isLoading&&e.$listeners),[e.hasNestedContent?[e.isLoading?i("span",{class:e.$style["c-spinner"],attrs:{"data-test-id":e.componentType+"-spinner"}}):e._e(),i("span",{class:[e.$style["o-button-content"],(n={},n[e.$style["o-btn-content--hidden"]]=e.isLoading,n)]},[e.hasLeadingIcon?i("span",{class:[e.$style["o-btn-icon"],e.$style["o-btn-icon--leading"]],attrs:{"data-test-id":"button-leading-icon"}},[e._t("leading-icon")],2):e._e(),e._t("default"),e.hasTrailingIcon?i("span",{class:[e.$style["o-btn-icon"],e.$style["o-btn-icon--trailing"]],attrs:{"data-test-id":"button-trailing-icon"}},[e._t("trailing-icon")],2):e._e()],2)]:[e._t("default")]],2)},i=[],r=function(){var t=this,n=t.$createElement,e=t._self._c||n;return e("button",t._g({attrs:{type:t.actionType}},t.$listeners),[t._t("default")],2)},s=[],u={props:{actionType:{type:String,required:!0}}},a=u;function c(t,n,e,o,i,r,s,u){var a,c="function"===typeof t?t.options:t;if(n&&(c.render=n,c.staticRenderFns=e,c._compiled=!0),o&&(c.functional=!0),r&&(c._scopeId="data-v-"+r),s?(a=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"===typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),i&&i.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},c._ssrRegister=a):i&&(a=u?function(){i.call(this,(c.functional?this.parent:this).$root.$options.shadowRoot)}:i),a)if(c.functional){c._injectStyles=a;var l=c.render;c.render=function(t,n){return a.call(n),l(t,n)}}else{var d=c.beforeCreate;c.beforeCreate=d?[].concat(d,a):[a]}return{exports:t,options:c}}var l=c(a,r,s,!1,null,null,null),d=l.exports,p=function(){var t=this,n=t.$createElement,e=t._self._c||n;return e("a",t._g({},t.$listeners),[t._t("default")],2)},f=[],b={},h=c(b,p,f,!1,null,null,null),_=h.exports,y={iconButton:["primary","secondary","ghost","ghostTertiary","inverse","ghostInverse"],button:["primary","secondary","outline","ghost","link"]},g=["xsmall","small","medium","large"],m=["leading","trailing",!1],v={name:"FButton",components:{ActionButton:d,LinkButton:_},props:{buttonType:{type:String,default:"primary"},buttonSize:{type:String,default:"medium"},isFullWidth:{type:Boolean,default:!1},actionType:{type:String,default:"button"},isIcon:{type:Boolean,default:!1},isLoading:{type:Boolean,default:!1},hasIcon:{type:[Boolean,String],default:!1}},computed:{buttonActionType:function(){return this.$attrs.href||this.$attrs.to?null:this.actionType},buttonSizeClassname:function(){return"xsmall"===this.buttonSize?this.buttonSize.slice(0,2).toUpperCase()+this.buttonSize.slice(2):this.buttonSize.charAt(0).toUpperCase()+this.buttonSize.slice(1)},componentType:function(){return this.$attrs.href?"link-button":this.$attrs.to?"router-link":"action-button"},getAriaLive:function(){return this.isLoading?"polite":"off"},hasTrailingIcon:function(){return this.hasIcon&&"trailing"===this.hasIcon},hasLeadingIcon:function(){return this.hasIcon&&"leading"===this.hasIcon},hasNestedContent:function(){return this.isLoading||this.hasLeadingIcon||this.hasTrailingIcon}},watch:{$props:{immediate:!0,handler:function(){this.validateProps()}}},methods:{validateProps:function(){var t=this.isIcon?"iconButton":"button",n=y[t];if(!n.includes(this.buttonType))throw new TypeError("".concat(t,' is set to have buttonType="').concat(this.buttonType,'", but it can only be one of the following buttonTypes: "').concat(n.join('", "'),'"'));if(!g.includes(this.buttonSize))throw new TypeError('buttonSize is set to "'.concat(this.buttonSize,'", but it can only be one of the following buttonSizes: "').concat(g.join('", "'),'"'));if(!m.includes(this.hasIcon))throw new TypeError('hasIcon is set to "'.concat(this.hasIcon,'", but it can only be one of the following button icon positions: "').concat(m.join('", "'),'"'))}}},B=v,S=e("4e4b");function T(t){this["$style"]=S["default"].locals||S["default"]}var $=c(B,o,i,!1,T,null,null);n["a"]=$.exports},"4e4b":function(t,n,e){"use strict";var o=e("9a8d"),i=e.n(o);e.d(n,"default",(function(){return i.a}))},"7e10":function(t,n,e){var o,i,r;(function(e,s){i=[],o=s,r="function"===typeof o?o.apply(n,i):o,void 0===r||(t.exports=r)})("undefined"!==typeof self&&self,(function(){function t(){var n=Object.getOwnPropertyDescriptor(document,"currentScript");if(!n&&"currentScript"in document&&document.currentScript)return document.currentScript;if(n&&n.get!==t&&document.currentScript)return document.currentScript;try{throw new Error}catch(f){var e,o,i,r=/.*at [^(]*\((.*):(.+):(.+)\)$/gi,s=/@([^@]*):(\d+):(\d+)\s*$/gi,u=r.exec(f.stack)||s.exec(f.stack),a=u&&u[1]||!1,c=u&&u[2]||!1,l=document.location.href.replace(document.location.hash,""),d=document.getElementsByTagName("script");a===l&&(e=document.documentElement.outerHTML,o=new RegExp("(?:[^\\n]+?\\n){0,"+(c-2)+"}[^<]*<script>([\\d\\D]*?)<\\/script>[\\d\\D]*","i"),i=e.replace(o,"$1").trim());for(var p=0;p<d.length;p++){if("interactive"===d[p].readyState)return d[p];if(d[p].src===a)return d[p];if(a===l&&d[p].innerHTML&&d[p].innerHTML.trim()===i)return d[p]}return null}}return t}))},"9a8d":function(t,n,e){t.exports={"c-screen-sizer":"Button_c-screen-sizer_aacnl","c-spinner-wrapper":"Button_c-spinner-wrapper_16dYe","c-spinner":"Button_c-spinner_16ib0",spin:"Button_spin_1l7_1","o-btn":"Button_o-btn_1KX8u","o-button-content":"Button_o-button-content_3Ow1e","o-btn-content--hidden":"Button_o-btn-content--hidden_1592m","o-btn-icon":"Button_o-btn-icon_rKd_B","o-btn-icon--leading":"Button_o-btn-icon--leading_2MkiQ","o-btn-icon--trailing":"Button_o-btn-icon--trailing_R6HPj","o-btn--primary":"Button_o-btn--primary_NRuBe","o-btn--icon":"Button_o-btn--icon_1k-qM","o-btn--loading":"Button_o-btn--loading_2up-7","o-btn--sizeSmall":"Button_o-btn--sizeSmall_WNBZx","o-btn--sizeXSmall":"Button_o-btn--sizeXSmall_3KRtq","o-btn--secondary":"Button_o-btn--secondary_1KBR1","o-btn--outline":"Button_o-btn--outline_3TR6n","o-btn--ghost":"Button_o-btn--ghost_1hnGu","o-btn--ghostTertiary":"Button_o-btn--ghostTertiary_2F6ho","o-btn--inverse":"Button_o-btn--inverse_1uhdX","o-btn--ghostInverse":"Button_o-btn--ghostInverse_2oPMZ","o-btn--link":"Button_o-btn--link_2f-eF","o-btn--sizeLarge":"Button_o-btn--sizeLarge_3A8Ov","o-btn--sizeMedium":"Button_o-btn--sizeMedium_2uSln","o-btn--fullWidth":"Button_o-btn--fullWidth_1xkfh","is-disabled":"Button_is-disabled_1zPQV",skeletonGradient:"Button_skeletonGradient_2l0Iq"}},b635:function(t,n,e){"use strict";(function(t){e.d(n,"b",(function(){return i}));var o=e("2a7d");function i(t){i.installed||(i.installed=!0,t.component("FButton",o["a"]))}var r={install:i},s=null;"undefined"!==typeof window?s=window.Vue:"undefined"!==typeof t&&(s=t.Vue),s&&s.use(r),n["a"]=o["a"]}).call(this,e("05e9"))},fa16:function(t,n,e){"use strict";if(e.r(n),e.d(n,"install",(function(){return s["b"]})),"undefined"!==typeof window){var o=window.document.currentScript,i=e("7e10");o=i(),"currentScript"in document||Object.defineProperty(document,"currentScript",{get:i});var r=o&&o.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);r&&(e.p=r[1])}var s=e("b635");n["default"]=s["a"]}})}));
//# sourceMappingURL=f-button.umd.min.js.map
{
"name": "@justeat/f-button",
"description": "Fozzie Button – The generic button component",
"version": "3.0.2",
"version": "3.2.0",
"main": "dist/f-button.umd.min.js",

@@ -55,3 +55,3 @@ "maxBundleSize": "5kB",

"devDependencies": {
"@justeat/f-vue-icons": "2.5.0",
"@justeat/f-vue-icons": "2.8.0",
"@justeat/f-wdio-utils": "0.3.0",

@@ -58,0 +58,0 @@ "@samhammer/vue-cli-plugin-stylelint": "2.0.1",

@@ -10,4 +10,2 @@ const Page = require('@justeat/f-wdio-utils/src/page.object');

get linkComponent () { return $('[data-test-id="link-button-component"]'); }
open (url) {

@@ -17,8 +15,4 @@ super.open(url);

load (type = 'action') {
if (type === 'action') {
super.load(this.actionComponent);
} else {
super.load(this.linkComponent);
}
load () {
super.load(this.actionComponent);
}

@@ -29,3 +23,3 @@

* Sets the data for the button component.
*
*
* @param {Object} button

@@ -35,10 +29,3 @@ * @param {String} button.type

*/
// open (button) {
// const type = `&knob-Button%20Type=${button.type}`;
// const url = button.type === 'link' ? `&knob-href=link` : '';
// const size = `&knob-Button%20Size=${button.size}`;
// browser.url(`/iframe.html?id=components-atoms-f-button--button-component${type}${url}${size}`)
// }
waitForActionComponent () {

@@ -48,13 +35,5 @@ super.waitForComponent(this.actionComponent);

waitForLinkComponent () {
super.waitForComponent(this.linkComponent);
}
isActionComponentDisplayed () {
return this.actionComponent.isDisplayed();
}
isLinkComponentDisplayed () {
return this.linkComponent.isDisplayed();
}
};

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc