@asphalt-react/button/dist/index.js

Button

import "./index.css";
import React, { forwardRef } from 'react';
import PropTypes from 'prop-types';
import cn from 'classnames';
import { SvgNormalizer } from '@asphalt-react/svg-normalizer';
import { svgUtil, propsUtil } from '@asphalt-react/helper';
import { Qualifier } from '@asphalt-react/qualifier';

function _extends() {
  return _extends = Object.assign ? Object.assign.bind() : function (n) {
    for (var e = 1; e < arguments.length; e++) {
      var t = arguments[e];
      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
    }
    return n;
  }, _extends.apply(null, arguments);
}

const NewTab=()=>React.createElement("svg",{height:"16",width:"16",fill:"none",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg","data-testid":"new-tab-icon"},React.createElement("path",{d:"M2.77772 13.2222L2.77772 2.55556L8.04509 2.55556C8.28084 2.55556 8.50693 2.46191 8.67363 2.29521C9.23116 1.73767 8.84043 0.786085 8.05538 0.777832H1.88889C1.4 0.777832 1 1.17783 1 1.66672V14.1112C1 14.3585 1.10235 14.583 1.26677 14.7446C1.4274 14.9023 1.64727 15 1.88883 15L14.3333 15C14.8222 15 15.2222 14.6 15.2222 14.1111V7.94459C15.2139 7.15956 14.2623 6.76884 13.7048 7.32637C13.5381 7.49307 13.4444 7.71916 13.4444 7.95491V13.2223H2.77778V13.2222H2.77772Z",fill:"currentColor",fillRule:"evenodd"}),React.createElement("path",{d:"M15.1023 0H11.5467C11.0578 0 10.6578 0.39975 10.6578 0.888334C10.6578 1.37692 11.0578 1.77667 11.5467 1.77667H12.9601L10.0356 4.69929C9.87561 4.85919 9.77783 5.08127 9.77783 5.33C9.77783 5.81859 10.1778 6.21834 10.6667 6.21834C10.9156 6.21834 11.1378 6.12062 11.2978 5.96072L14.2223 3.0381V4.45055C14.2223 4.93914 14.6223 5.33889 15.1112 5.33889C15.6001 5.33889 16.0001 4.93914 16.0001 4.45055V0.897217C15.9912 0.39975 15.5912 0 15.1023 0Z",fill:"currentColor",fillRule:"evenodd"}));NewTab.iconName="NewTab";

const svgSize=(sizeObj,size)=>{switch(size){case "xs":return sizeObj.xs;case "s":return sizeObj.sm;case "m":return sizeObj.md;case "l":return sizeObj.lg;default:return sizeObj.md}};const opensInNewTab=target=>target&&!(target==="_self"||target==="_top"||target==="_parent");const getRelAttributes=target=>opensInNewTab(target)?{rel:"noreferrer"}:{};const resolveSizeProp=size=>{const supportedSizes=["xs","s","m","l"];return supportedSizes.includes(size)?size:"m"};

const qualifierSVGSizes={xs:{height:"12",width:"12"},sm:{height:"14",width:"14"},md:{height:"16",width:"16"},lg:{height:"16",width:"16"}};const iconSVGSizes={xs:{height:"12",width:"12"},sm:{height:"14",width:"14"},md:{height:"16",width:"16"},lg:{height:"18",width:"18"}};

var styles = {"Button":"Button__yXAkD","stretch":"stretch__3qC8p","primaryBrand":"primaryBrand__Krr2l","primaryDanger":"primaryDanger__NfS2o","primarySystem":"primarySystem__zsZ-u","secondaryBrand":"secondaryBrand__jfdxk","secondaryDanger":"secondaryDanger__-U1QE","secondarySystem":"secondarySystem__PJ4Xx","tertiaryBrand":"tertiaryBrand__1-455","tertiaryDanger":"tertiaryDanger__tqihQ","tertiarySystem":"tertiarySystem__-S7oN","nudeBrand":"nudeBrand__aDE26","nudeDanger":"nudeDanger__zOqPK","nudeSystem":"nudeSystem__PdH9G","primary":"primary__VOpsr","secondary":"secondary__zealy","nude":"nude__SJHsv","compactIcon":"compactIcon__8D7Nl","tertiary":"tertiary__pRmHg","qualifier":"qualifier__JJPaq","qualifierStart":"qualifierStart__6o51Y","qualifierEnd":"qualifierEnd__Yb2zt","buttonL":"buttonL__dT9zq","buttonM":"buttonM__jmSYx","buttonS":"buttonS__MrlZh","buttonXs":"buttonXs__r9M7f","iconL":"iconL__9Ee56","iconM":"iconM__7SUOV","iconS":"iconS__ItZGm","iconXs":"iconXs__5mF1K","compactL":"compactL__lisV7","compactM":"compactM__hqnWo","compactS":"compactS__nuYcM","compactXs":"compactXs__AywxT","compactIconL":"compactIconL__L0Ed1","compactIconM":"compactIconM__b6gxq","compactIconS":"compactIconS__H7G01","compactIconXs":"compactIconXs__ei3A0","link":"link__OB7N-","qualifierWrapper":"qualifierWrapper__QSvCa","iconWrapper":"iconWrapper__avueo","stickStart":"stickStart__XljCt","stickEnd":"stickEnd__KBlxz","stickPrimary":"stickPrimary__5OgXf","stickSecondary":"stickSecondary__mt79y","stickTertiary":"stickTertiary__pRNFE","stickNude":"stickNude__ppKxQ","noUnderline":"noUnderline__4ntOt"};

const{isSVG}=svgUtil;const{concatClasses,resolvePropCollision}=propsUtil;const Button=forwardRef(({children,size="m",primary=false,secondary=false,tertiary=false,nude=false,brand=false,danger=false,system=false,qualifier=null,qualifierEnd=false,stretch=false,icon=false,compact=false,link=false,as:Link="a",asProps={href:"."},stickStart=false,stickEnd=false,stick=false,underline=true,...props},ref)=>{const{collision:variantCollision,value:variant}=resolvePropCollision({primary,secondary,tertiary,nude},"primary");if(variantCollision){console.warn(`Button: Multiple variants detected, falling back to "primary"`);}const{collision:intentCollision,value:intent}=resolvePropCollision({brand,danger,system},"brand");if(intentCollision){console.warn(`Button: Multiple intents detected, falling back to "brand"`);}const{style,className,...rest}=props;const isCompactIcon=icon&&compact;const isCompactButton=!icon&&compact;const resolvedSize=resolveSizeProp(size);const compactIconClass=cn(styles.compactIcon,styles[`${concatClasses("compact","icon",resolvedSize)}`]);const compactClass=cn(styles[`${concatClasses("compact",resolvedSize)}`]);const btnClasses=cn(styles.Button,styles[variant],styles[`${concatClasses(variant,intent)}`],{[styles[`${concatClasses("button",resolvedSize)}`]]:!icon},{[styles[`${concatClasses("icon",resolvedSize)}`]]:icon},{[compactIconClass]:isCompactIcon,[compactClass]:isCompactButton},{[styles.link]:link},{[styles.stretch]:stretch},{[styles.stickStart]:stickStart},{[styles.stickEnd]:stickEnd},{[styles[`${concatClasses("stick",variant)}`]]:stick},{[styles.noUnderline]:link&&!underline});if(link&&opensInNewTab(asProps?.target)&&!qualifier){qualifier=React.createElement(NewTab,null);}const getQualifier=()=>React.createElement("span",{"data-testid":"qualifier",className:cn(styles.qualifier,qualifierEnd?styles.qualifierEnd:styles.qualifierStart)},React.createElement("div",{className:styles.qualifierWrapper},React.createElement(Qualifier,{iconSize:svgSize(qualifierSVGSizes,size)},qualifier)));const getIcon=()=>{if(icon&&!isSVG(children)){console.warn("Icon can only be SVG");children="";}return React.createElement("div",{className:styles.iconWrapper},React.createElement(SvgNormalizer,{dimension:svgSize(iconSVGSizes,size)},children))};const getQualifierWithChildren=()=>{return React.createElement(React.Fragment,null,qualifier&&!qualifierEnd&&getQualifier(),children,qualifier&&qualifierEnd&&getQualifier())};if(link){const{style,...restAsProps}=asProps||{};if(props.disabled){console.warn("Button: LinkButton can not be disabled");}return React.createElement(Link,_extends({},getRelAttributes(asProps?.target),restAsProps,{className:btnClasses,ref:ref}),icon?getIcon():getQualifierWithChildren())}if(icon){return React.createElement("button",_extends({type:"button"},rest,{className:btnClasses,ref:ref}),getIcon())}return React.createElement("button",_extends({type:"button"},rest,{className:btnClasses,ref:ref}),getQualifierWithChildren())});Button.displayName="Button";Button.propTypes={children:PropTypes.node.isRequired,primary:PropTypes.bool,secondary:PropTypes.bool,tertiary:PropTypes.bool,nude:PropTypes.bool,brand:PropTypes.bool,danger:PropTypes.bool,system:PropTypes.bool,link:PropTypes.bool,as:PropTypes.elementType,asProps:PropTypes.object,icon:PropTypes.bool,compact:PropTypes.bool,qualifier:PropTypes.oneOfType([PropTypes.element,PropTypes.string]),qualifierEnd:PropTypes.bool,size:PropTypes.oneOf(["xs","s","m","l"]),stretch:PropTypes.bool,stickStart:PropTypes.bool,stickEnd:PropTypes.bool,stick:PropTypes.bool,underline:PropTypes.bool};Button.defaultProps={size:"m",stretch:false,primary:false,secondary:false,tertiary:false,nude:false,brand:false,danger:false,system:false,qualifier:null,qualifierEnd:false,icon:false,compact:false,link:false,as:"a",asProps:{href:"."},stickEnd:false,stickStart:false,stick:false,underline:true};

export { Button };
//# sourceMappingURL=index.js.map