@rei/cdr-button
Advanced tools
Comparing version 0.1.0 to 0.2.0-alpha.0
@@ -1,1 +0,1 @@ | ||
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("CdrButton",[],e):"object"==typeof exports?exports.CdrButton=e():t.CdrButton=e()}("undefined"!=typeof self?self:this,function(){return function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:r})},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="/",n(n.s=1)}([function(t,e,n){"use strict";var r=n(4),o=n(5);e.a={name:"CdrButton",mixins:[o.a,r.a],props:{type:{type:String,default:"button",validator:function(t){return["button","submit","reset"].indexOf(t)>=0||!1}},onClick:{type:Function,default:function(){return function(){return null}}}},computed:{baseClass:function(){return(this.modifier?this.modifier.split(" "):[]).indexOf("link")>=0?"cdr-link":"cdr-button"}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var r=n(2);n.d(e,"CdrButton",function(){return r.a})},function(t,e,n){"use strict";var r=n(0),o=n(6),i=n(7);var s=function(t){n(3)},u=Object(i.a)(r.a,o.a,o.b,!1,s,null,null);e.a=u.exports},function(t,e){},function(t,e,n){"use strict";e.a={props:{theme:String},computed:{themeClass:function(){var t=this.baseClass,e=this.modifier?this.modifier.split(" "):[],n="theme-"+this.theme+"-"+t,r=[];return this.theme&&(r.push(""+n),r=r.concat(e.map(function(t){return n+"--"+t}))),r.join(" ")}}}},function(t,e,n){"use strict";e.a={props:{modifier:String},computed:{modifierClass:function(){var t=this.baseClass,e=this.modifier?this.modifier.split(" "):[],n=[];return this.theme||(n.push(""+t),n=n.concat(e.map(function(e){return t+"--"+e}))),n.join(" ")}}}},function(t,e,n){"use strict";n.d(e,"a",function(){return r}),n.d(e,"b",function(){return o});var r=function(){var t=this.$createElement;return(this._self._c||t)("button",{class:[this.modifierClass,this.themeClass],attrs:{type:this.type},on:{click:this.onClick}},[this._t("default")],2)},o=[]},function(t,e,n){"use strict";e.a=function(t,e,n,r,o,i,s,u){var c=typeof(t=t||{}).default;"object"!==c&&"function"!==c||(t=t.default);var f,a="function"==typeof t?t.options:t;e&&(a.render=e,a.staticRenderFns=n,a._compiled=!0);r&&(a.functional=!0);i&&(a._scopeId=i);s?(f=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),o&&o.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},a._ssrRegister=f):o&&(f=u?function(){o.call(this,this.$root.$options.shadowRoot)}:o);if(f)if(a.functional){a._injectStyles=f;var d=a.render;a.render=function(t,e){return f.call(e),d(t,e)}}else{var l=a.beforeCreate;a.beforeCreate=l?[].concat(l,f):[f]}return{exports:t,options:a}}}])}); | ||
!function(t,n){"object"==typeof exports&&"object"==typeof module?module.exports=n(require("@rei/cdr-icon")):"function"==typeof define&&define.amd?define("CdrButton",["@rei/cdr-icon"],n):"object"==typeof exports?exports.CdrButton=n(require("@rei/cdr-icon")):t.CdrButton=n(t["@rei/cdr-icon"])}("undefined"!=typeof self?self:this,function(t){return function(t){var n={};function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}return e.m=t,e.c=n,e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},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=12)}([function(t,n,e){"use strict";var r=e(13),o=e(2),a=e(17),s=e(1);var u=Object(s.a)(o.a,r.a,r.b,!1,function(t){this.$style=a.default.locals||a.default},null,null);n.a=u.exports},function(t,n,e){"use strict";n.a=function(t,n,e,r,o,a,s,u){var i,c="function"==typeof t?t.options:t;n&&(c.render=n,c.staticRenderFns=e,c._compiled=!0);r&&(c.functional=!0);a&&(c._scopeId="data-v-"+a);s?(i=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),o&&o.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},c._ssrRegister=i):o&&(i=u?function(){o.call(this,this.$root.$options.shadowRoot)}:o);if(i)if(c.functional){c._injectStyles=i;var l=c.render;c.render=function(t,n){return i.call(n),l(t,n)}}else{var d=c.beforeCreate;c.beforeCreate=d?[].concat(d,i):[i]}return{exports:t,options:c}}},function(t,n,e){"use strict";var r=e(3);n.a=r.a},function(t,n,e){"use strict";var r=e(15),o=e(16);n.a={name:"CdrButton",mixins:[r.a,o.a],props:{size:{type:String,default:"medium",validator:function(t){return["small","medium","large"].indexOf(t)>=0||!1}},responsiveSize:{type:Array},iconOnly:{type:Boolean,default:!1},onDark:{type:Boolean,default:!1}},computed:{baseClass:function(){return"cdr-button"},sizeClass:function(){return this.iconOnly?null:this.modifyClassName(this.baseClass,this.size)},responsiveClass:function(){var t=this,n=[];return this.responsiveSize&&!this.iconOnly&&this.responsiveSize.forEach(function(e){n.push(t.modifyClassName(t.baseClass,e))}),n.join(" ")},iconClass:function(){var t=[];return this.$slots.default&&this.$slots.default.length>1&&t.push(this.modifyClassName(this.baseClass,"has-icon")),this.iconOnly&&(t.push(this.modifyClassName(this.baseClass,"icon-only")),this.onDark&&t.push(this.modifyClassName(this.baseClass,"on-dark"))),t.join(" ")}}}},function(t,n){t.exports={"cdr-button":"cdr-button_0.2.0-alpha.0","cdr-button--secondary":"cdr-button--secondary_0.2.0-alpha.0","cdr-button--large":"cdr-button--large_0.2.0-alpha.0","cdr-button--has-icon":"cdr-button--has-icon_0.2.0-alpha.0","cdr-button--medium":"cdr-button--medium_0.2.0-alpha.0","cdr-button--small":"cdr-button--small_0.2.0-alpha.0","cdr-button--full-width":"cdr-button--full-width_0.2.0-alpha.0","cdr-button--icon-only":"cdr-button--icon-only_0.2.0-alpha.0","cdr-button--on-dark":"cdr-button--on-dark_0.2.0-alpha.0","cdr-button--small@xs":"cdr-button--small@xs_0.2.0-alpha.0","cdr-button--medium@xs":"cdr-button--medium@xs_0.2.0-alpha.0","cdr-button--large@xs":"cdr-button--large@xs_0.2.0-alpha.0","cdr-button--small@sm":"cdr-button--small@sm_0.2.0-alpha.0","cdr-button--medium@sm":"cdr-button--medium@sm_0.2.0-alpha.0","cdr-button--large@sm":"cdr-button--large@sm_0.2.0-alpha.0","cdr-button--small@md":"cdr-button--small@md_0.2.0-alpha.0","cdr-button--medium@md":"cdr-button--medium@md_0.2.0-alpha.0","cdr-button--large@md":"cdr-button--large@md_0.2.0-alpha.0","cdr-button--small@lg":"cdr-button--small@lg_0.2.0-alpha.0","cdr-button--medium@lg":"cdr-button--medium@lg_0.2.0-alpha.0","cdr-button--large@lg":"cdr-button--large@lg_0.2.0-alpha.0"}},function(t,n,e){"use strict";var r=e(6);n.a=r.a},function(t,n,e){"use strict";var r=e(7),o=(e.n(r),e(0));n.a={name:"CdrCloseButton",components:{IconXLg:r.IconXLg,CdrButton:o.a},extends:o.a}},function(n,e){n.exports=t},function(t,n){},function(t,n,e){"use strict";var r=e(10);n.a=r.a},function(t,n,e){"use strict";var r=e(7),o=(e.n(r),e(0));n.a={name:"CdrPlayButton",components:{IconPlay:r.IconPlay,CdrButton:o.a},extends:o.a}},function(t,n){},function(t,n,e){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var r=e(0);e.d(n,"CdrButton",function(){return r.a});var o=e(18);e.d(n,"CdrCloseButton",function(){return o.a});var a=e(22);e.d(n,"CdrPlayButton",function(){return a.a})},function(t,n,e){"use strict";var r=e(14);e.d(n,"a",function(){return r.a}),e.d(n,"b",function(){return r.b})},function(t,n,e){"use strict";e.d(n,"a",function(){return r}),e.d(n,"b",function(){return o});var r=function(){var t=this,n=t.$createElement;return(t._self._c||n)(t.tag,{tag:"component",class:[t.modifierClass,t.sizeClass,t.fullWidthClass,t.responsiveClass,t.iconClass],attrs:{type:"button"===t.tag?t.type:null},on:{click:t.onClick}},[t._t("icon"),t._v(" "),t._t("default")],2)},o=[]},function(t,n,e){"use strict";n.a={props:{tag:{type:String,default:"button",validator:function(t){return["button","a"].indexOf(t)>=0||!1}},type:{type:String,default:"button",validator:function(t){return["button","submit","reset"].indexOf(t)>=0||!1}},onClick:{type:Function,default:function(){return function(){return null}}},fullWidth:{type:Boolean,default:!1,validator:function(t){return"boolean"==typeof t}}},computed:{fullWidthClass:function(){return this.fullWidth&&!this.iconOnly?this.modifyClassName(this.baseClass,"full-width"):null}}}},function(t,n,e){"use strict";n.a={props:{modifier:String},computed:{modifierClass:function(){var t=this,n=this.baseClass,e=this.modifier?this.modifier.split(" "):[],r=[];return this.$style?(r.push(this.moduleClass(n)),r=r.concat(e.map(function(e){return t.modifyClassName(n,e)}))):(r.push(""+n),r=r.concat(e.map(function(e){return t.modifyClassName(n,e)}))),r.join(" ")}},methods:{moduleClass:function(t){return this.$style[""+t]},modifyClassName:function(t,n){return this.$style?this.moduleClass(t+"--"+n):t+"--"+n}}}},function(t,n,e){"use strict";var r=e(4),o=e.n(r);n.default=o.a},function(t,n,e){"use strict";var r=e(19),o=e(5),a=(e(21),e(1)),s=Object(a.a)(o.a,r.a,r.b,!1,null,null,null);n.a=s.exports},function(t,n,e){"use strict";var r=e(20);e.d(n,"a",function(){return r.a}),e.d(n,"b",function(){return r.b})},function(t,n,e){"use strict";e.d(n,"a",function(){return r}),e.d(n,"b",function(){return o});var r=function(){var t=this.$createElement,n=this._self._c||t;return n("cdr-button",{attrs:{"icon-only":!0,"on-dark":this.onDark,"aria-label":"Close"}},[[n("icon-x-lg",{staticClass:"cdr-button__icon"})]],2)},o=[]},function(t,n,e){"use strict";var r=e(8);e.n(r).a},function(t,n,e){"use strict";var r=e(23),o=e(9),a=(e(25),e(1)),s=Object(a.a)(o.a,r.a,r.b,!1,null,null,null);n.a=s.exports},function(t,n,e){"use strict";var r=e(24);e.d(n,"a",function(){return r.a}),e.d(n,"b",function(){return r.b})},function(t,n,e){"use strict";e.d(n,"a",function(){return r}),e.d(n,"b",function(){return o});var r=function(){var t=this.$createElement,n=this._self._c||t;return n("cdr-button",{attrs:{"icon-only":!0,"on-dark":this.onDark,"aria-label":"Play"}},[[n("icon-play",{staticClass:"cdr-button__icon"})]],2)},o=[]},function(t,n,e){"use strict";var r=e(11);e.n(r).a}])}); |
@@ -1,1 +0,1 @@ | ||
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("CdrButton",[],e):"object"==typeof exports?exports.CdrButton=e():t.CdrButton=e()}("undefined"!=typeof self?self:this,function(){return function(t){var e={};function n(o){if(e[o])return e[o].exports;var i=e[o]={i:o,l:!1,exports:{}};return t[o].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:o})},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="/",n(n.s=1)}([function(t,e,n){"use strict";var o=n(4),i=n(5);e.a={name:"CdrButton",mixins:[i.a,o.a],props:{type:{type:String,default:"button",validator:function(t){return["button","submit","reset"].indexOf(t)>=0||!1}},onClick:{type:Function,default:function(){return function(){return null}}}},computed:{baseClass:function(){return(this.modifier?this.modifier.split(" "):[]).indexOf("link")>=0?"cdr-link":"cdr-button"}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(2);function i(t){t.component("cdr-button",o.a)}"undefined"!=typeof window&&window.Vue&&window.Vue.use(i),e.default=i},function(t,e,n){"use strict";var o=n(0),i=n(6),r=n(7);var s=function(t){n(3)},u=Object(r.a)(o.a,i.a,i.b,!1,s,null,null);e.a=u.exports},function(t,e){},function(t,e,n){"use strict";e.a={props:{theme:String},computed:{themeClass:function(){var t=this.baseClass,e=this.modifier?this.modifier.split(" "):[],n="theme-"+this.theme+"-"+t,o=[];return this.theme&&(o.push(""+n),o=o.concat(e.map(function(t){return n+"--"+t}))),o.join(" ")}}}},function(t,e,n){"use strict";e.a={props:{modifier:String},computed:{modifierClass:function(){var t=this.baseClass,e=this.modifier?this.modifier.split(" "):[],n=[];return this.theme||(n.push(""+t),n=n.concat(e.map(function(e){return t+"--"+e}))),n.join(" ")}}}},function(t,e,n){"use strict";n.d(e,"a",function(){return o}),n.d(e,"b",function(){return i});var o=function(){var t=this.$createElement;return(this._self._c||t)("button",{class:[this.modifierClass,this.themeClass],attrs:{type:this.type},on:{click:this.onClick}},[this._t("default")],2)},i=[]},function(t,e,n){"use strict";e.a=function(t,e,n,o,i,r,s,u){var c=typeof(t=t||{}).default;"object"!==c&&"function"!==c||(t=t.default);var f,a="function"==typeof t?t.options:t;e&&(a.render=e,a.staticRenderFns=n,a._compiled=!0);o&&(a.functional=!0);r&&(a._scopeId=r);s?(f=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),i&&i.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},a._ssrRegister=f):i&&(f=u?function(){i.call(this,this.$root.$options.shadowRoot)}:i);if(f)if(a.functional){a._injectStyles=f;var d=a.render;a.render=function(t,e){return f.call(e),d(t,e)}}else{var l=a.beforeCreate;a.beforeCreate=l?[].concat(l,f):[f]}return{exports:t,options:a}}}])}); | ||
!function(t,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define("CdrButton",[],n):"object"==typeof exports?exports.CdrButton=n():t.CdrButton=n()}("undefined"!=typeof self?self:this,function(){return function(t){var n={};function e(o){if(n[o])return n[o].exports;var s=n[o]={i:o,l:!1,exports:{}};return t[o].call(s.exports,s,s.exports,e),s.l=!0,s.exports}return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get: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=3)}([function(t,n,e){"use strict";var o=e(1);n.a=o.a},function(t,n,e){"use strict";var o=e(7),s=e(8);n.a={name:"CdrButton",mixins:[o.a,s.a],props:{size:{type:String,default:"medium",validator:function(t){return["small","medium","large"].indexOf(t)>=0||!1}},responsiveSize:{type:Array},iconOnly:{type:Boolean,default:!1},onDark:{type:Boolean,default:!1}},computed:{baseClass:function(){return"cdr-button"},sizeClass:function(){return this.iconOnly?null:this.modifyClassName(this.baseClass,this.size)},responsiveClass:function(){var t=this,n=[];return this.responsiveSize&&!this.iconOnly&&this.responsiveSize.forEach(function(e){n.push(t.modifyClassName(t.baseClass,e))}),n.join(" ")},iconClass:function(){var t=[];return this.$slots.default&&this.$slots.default.length>1&&t.push(this.modifyClassName(this.baseClass,"has-icon")),this.iconOnly&&(t.push(this.modifyClassName(this.baseClass,"icon-only")),this.onDark&&t.push(this.modifyClassName(this.baseClass,"on-dark"))),t.join(" ")}}}},function(t,n){t.exports={"cdr-button":"cdr-button_0.2.0-alpha.0","cdr-button--secondary":"cdr-button--secondary_0.2.0-alpha.0","cdr-button--large":"cdr-button--large_0.2.0-alpha.0","cdr-button--has-icon":"cdr-button--has-icon_0.2.0-alpha.0","cdr-button--medium":"cdr-button--medium_0.2.0-alpha.0","cdr-button--small":"cdr-button--small_0.2.0-alpha.0","cdr-button--full-width":"cdr-button--full-width_0.2.0-alpha.0","cdr-button--icon-only":"cdr-button--icon-only_0.2.0-alpha.0","cdr-button--on-dark":"cdr-button--on-dark_0.2.0-alpha.0","cdr-button--small@xs":"cdr-button--small@xs_0.2.0-alpha.0","cdr-button--medium@xs":"cdr-button--medium@xs_0.2.0-alpha.0","cdr-button--large@xs":"cdr-button--large@xs_0.2.0-alpha.0","cdr-button--small@sm":"cdr-button--small@sm_0.2.0-alpha.0","cdr-button--medium@sm":"cdr-button--medium@sm_0.2.0-alpha.0","cdr-button--large@sm":"cdr-button--large@sm_0.2.0-alpha.0","cdr-button--small@md":"cdr-button--small@md_0.2.0-alpha.0","cdr-button--medium@md":"cdr-button--medium@md_0.2.0-alpha.0","cdr-button--large@md":"cdr-button--large@md_0.2.0-alpha.0","cdr-button--small@lg":"cdr-button--small@lg_0.2.0-alpha.0","cdr-button--medium@lg":"cdr-button--medium@lg_0.2.0-alpha.0","cdr-button--large@lg":"cdr-button--large@lg_0.2.0-alpha.0"}},function(t,n,e){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var o=e(4);function s(t){t.component("cdr-button",o.a)}"undefined"!=typeof window&&window.Vue&&window.Vue.use(s),n.default=s},function(t,n,e){"use strict";var o=e(5),s=e(0),r=e(9),a=e(10);var i=Object(a.a)(s.a,o.a,o.b,!1,function(t){this.$style=r.default.locals||r.default},null,null);n.a=i.exports},function(t,n,e){"use strict";var o=e(6);e.d(n,"a",function(){return o.a}),e.d(n,"b",function(){return o.b})},function(t,n,e){"use strict";e.d(n,"a",function(){return o}),e.d(n,"b",function(){return s});var o=function(){var t=this,n=t.$createElement;return(t._self._c||n)(t.tag,{tag:"component",class:[t.modifierClass,t.sizeClass,t.fullWidthClass,t.responsiveClass,t.iconClass],attrs:{type:"button"===t.tag?t.type:null},on:{click:t.onClick}},[t._t("icon"),t._v(" "),t._t("default")],2)},s=[]},function(t,n,e){"use strict";n.a={props:{tag:{type:String,default:"button",validator:function(t){return["button","a"].indexOf(t)>=0||!1}},type:{type:String,default:"button",validator:function(t){return["button","submit","reset"].indexOf(t)>=0||!1}},onClick:{type:Function,default:function(){return function(){return null}}},fullWidth:{type:Boolean,default:!1,validator:function(t){return"boolean"==typeof t}}},computed:{fullWidthClass:function(){return this.fullWidth&&!this.iconOnly?this.modifyClassName(this.baseClass,"full-width"):null}}}},function(t,n,e){"use strict";n.a={props:{modifier:String},computed:{modifierClass:function(){var t=this,n=this.baseClass,e=this.modifier?this.modifier.split(" "):[],o=[];return this.$style?(o.push(this.moduleClass(n)),o=o.concat(e.map(function(e){return t.modifyClassName(n,e)}))):(o.push(""+n),o=o.concat(e.map(function(e){return t.modifyClassName(n,e)}))),o.join(" ")}},methods:{moduleClass:function(t){return this.$style[""+t]},modifyClassName:function(t,n){return this.$style?this.moduleClass(t+"--"+n):t+"--"+n}}}},function(t,n,e){"use strict";var o=e(2),s=e.n(o);n.default=s.a},function(t,n,e){"use strict";n.a=function(t,n,e,o,s,r,a,i){var u,l="function"==typeof t?t.options:t;n&&(l.render=n,l.staticRenderFns=e,l._compiled=!0);o&&(l.functional=!0);r&&(l._scopeId="data-v-"+r);a?(u=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),s&&s.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(a)},l._ssrRegister=u):s&&(u=i?function(){s.call(this,this.$root.$options.shadowRoot)}:s);if(u)if(l.functional){l._injectStyles=u;var d=l.render;l.render=function(t,n){return u.call(n),d(t,n)}}else{var c=l.beforeCreate;l.beforeCreate=c?[].concat(c,u):[u]}return{exports:t,options:l}}}])}); |
{ | ||
"name": "@rei/cdr-button", | ||
"version": "0.1.0", | ||
"version": "0.2.0-alpha.0", | ||
"author": "REI Software Engineering", | ||
@@ -19,2 +19,5 @@ "description": "REI Cedar Style Framework - Vue Component for Button", | ||
], | ||
"config": { | ||
"vue_file": "CdrButton" | ||
}, | ||
"main": "dist/cdr-button.js", | ||
@@ -24,16 +27,15 @@ "style": "dist/cdr-button.css", | ||
"prepublishOnly": "npm run build && pkg-ok", | ||
"build": "npm run build:theme && npm run build:component", | ||
"build:component": "node build/build.js", | ||
"build:theme": "node ../../../utils/extractTheme.js" | ||
"build": "node build/build.js", | ||
"build:docs": "node build/docs-build.js" | ||
}, | ||
"peerDependencies": { | ||
"@rei/cdr-a": "^0.1.0", | ||
"@rei/cdr-assets": "^0.1.0", | ||
"@rei/cdr-icon": "^0.2.0", | ||
"vue": "^2.5.13" | ||
}, | ||
"devDependencies": { | ||
"@rei/cdr-a": "^0.1.0", | ||
"@rei/cdr-assets": "^0.1.0", | ||
"@rei/cdr-icon": "^0.2.0", | ||
"pkg-ok": "^1.1.0" | ||
} | ||
} |
@@ -1,13 +0,88 @@ | ||
# <span class="display-name">CdrButton</span> | ||
## <span class="usage">Usage</span> | ||
### <span class="modifiers">Modifiers</span> | ||
``` | ||
<cdr-button | ||
type="button" | ||
@onClick="myFunction" | ||
>Button</cdr-button> | ||
``` | ||
Modifiers can be combined 1 from each grouping. | ||
### <span class="variants">Variants</span> | ||
{secondary} | {sm,xs} | {block, fixed, responsive} **OR** link | ||
#### <span class="anchor">Anchor</span> | ||
Use of the 'link' modifier depends on including the css for cdrA. | ||
`cdr-button` can render as either a button or an anchor element with the same styling; button is the default. | ||
A modifier list that contains 'link' exposes the same modifiers as cdrA and the other modifiers shouldn't be combined with it. | ||
``` | ||
<cdr-button | ||
tag="a" | ||
href="https://rei.com" | ||
>REI</cdr-button> | ||
``` | ||
Responsive makes the button full width and block @ sm breakpoint. | ||
#### <span class="secondary">Secondary</span> | ||
Adding a `modifier` attribute with a value of `secondary` will render the secondary button style. | ||
``` | ||
<cdr-button | ||
modifier="secondary" | ||
@onClick="myFunction" | ||
>Secondary</cdr-button> | ||
``` | ||
#### <span class="">Composing with Icons</span> | ||
The default slot in `cdr-button` can be used to include an icon. `cdr-button` does not include `cdr-icon` as a dependency, so you will need to import it into your composition. If you are trying to create an icon-only button (i.e. no text), there's a separate component for that: `@rei/cdr-icon-only-button`. | ||
``` | ||
import { CdrIcon } from '@rei/cdr-icon' | ||
<cdr-button | ||
size="large" | ||
modifier="secondary" | ||
> | ||
<template name="icon"> | ||
<cdr-icon | ||
class="cdr-button__icon" | ||
use="#download" | ||
modifier="inherit-color" | ||
/> | ||
</template> | ||
Button and Icon | ||
</cdr-button> | ||
``` | ||
You can also use single icon components. Per design guidelines, icons should always display to the left of text. | ||
``` | ||
import { IconCheckLg } from '@rei/cdr-icon' | ||
<cdr-button> | ||
<template name="icon"> | ||
<icon-check-lg | ||
class="cdr-button__icon" | ||
/> | ||
</template> | ||
Medium and Icon | ||
</cdr-button> | ||
``` | ||
The `cdr-button__icon` class needs to be added to the icon element inside of `cdr-button`. This allows `cdr-button` to dictate some icon styling across modularized CSS. | ||
## <span class="accessibility">Accessibility</span> | ||
Since `cdr-button` can render as a button or an anchor, users should focus on what the semantically correct element would be. It will always look like a button, so as long as the correct semantic choice is made, the default ARIA context should suffice. | ||
## <span class="">Installation</span> | ||
Import the component to use it in your application. | ||
``` | ||
npm i @rei/cdr-button | ||
``` | ||
## <span class="">Contributing</span> | ||
### Request an an enhancement | ||
Join us on Slack at [#design-systems](https://rei.slack.com/messages/CA58YCGN4). |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Deprecated
MaintenanceThe maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.
Found 1 instance in 1 package
31307
0
89
6
2
2