@primer/react-brand 0.3.0 → 0.3.1-rc.9ad887b

package/lib/index.js

@@ -1,2 +1,2 @@
 /*! For license information please see index.js.LICENSE.txt */
-!function(e,r){"object"==typeof exports&&"object"==typeof module?module.exports=r(require("react")):"function"==typeof define&&define.amd?define("@primer/react-brand",[],r):"object"==typeof exports?exports["@primer/react-brand"]=r(require("react")):e["@primer/react-brand"]=r(e.React)}(this,(e=>(()=>{"use strict";var r={418:e=>{var r=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,a=Object.prototype.propertyIsEnumerable;function _(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var r={},n=0;n<10;n++)r["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(r).map((function(e){return r[e]})).join(""))return!1;var a={};return"abcdefghijklmnopqrst".split("").forEach((function(e){a[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},a)).join("")}catch(e){return!1}}()?Object.assign:function(e,t){for(var i,o,l=_(e),s=1;s<arguments.length;s++){for(var d in i=Object(arguments[s]))n.call(i,d)&&(l[d]=i[d]);if(r){o=r(i);for(var c=0;c<o.length;c++)a.call(i,o[c])&&(l[o[c]]=i[o[c]])}}return l}},921:(e,r)=>{var n=60103,a=60106,_=60107,t=60108,i=60114,o=60109,l=60110,s=60112,d=60113,c=60120,m=60115,u=60116;if("function"==typeof Symbol&&Symbol.for){var p=Symbol.for;n=p("react.element"),a=p("react.portal"),_=p("react.fragment"),t=p("react.strict_mode"),i=p("react.profiler"),o=p("react.provider"),l=p("react.context"),s=p("react.forward_ref"),d=p("react.suspense"),c=p("react.suspense_list"),m=p("react.memo"),u=p("react.lazy"),p("react.block"),p("react.server.block"),p("react.fundamental"),p("react.debug_trace_mode"),p("react.legacy_hidden")}r.isFragment=function(e){return function(e){if("object"==typeof e&&null!==e){var r=e.$$typeof;switch(r){case n:switch(e=e.type){case _:case i:case t:case d:case c:return e;default:switch(e=e&&e.$$typeof){case l:case s:case u:case m:case o:return e;default:return r}}case a:return r}}}(e)===_}},864:(e,r,n)=>{e.exports=n(921)},251:(e,r,n)=>{n(418);var a=n(697),_=60103;if("function"==typeof Symbol&&Symbol.for){var t=Symbol.for;_=t("react.element"),t("react.fragment")}var i=a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,o=Object.prototype.hasOwnProperty,l={key:!0,ref:!0,__self:!0,__source:!0};function s(e,r,n){var a,t={},s=null,d=null;for(a in void 0!==n&&(s=""+n),void 0!==r.key&&(s=""+r.key),void 0!==r.ref&&(d=r.ref),r)o.call(r,a)&&!l.hasOwnProperty(a)&&(t[a]=r[a]);if(e&&e.defaultProps)for(a in r=e.defaultProps)void 0===t[a]&&(t[a]=r[a]);return{$$typeof:_,type:e,key:s,ref:d,props:t,_owner:i.current}}r.jsx=s,r.jsxs=s},893:(e,r,n)=>{e.exports=n(251)},697:r=>{r.exports=e}},n={};function a(e){var _=n[e];if(void 0!==_)return _.exports;var t=n[e]={exports:{}};return r[e](t,t.exports,a),t.exports}a.n=e=>{var r=e&&e.__esModule?()=>e.default:()=>e;return a.d(r,{a:r}),r},a.d=(e,r)=>{for(var n in r)a.o(r,n)&&!a.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:r[n]})},a.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var _={};return(()=>{a.r(_),a.d(_,{Accordion:()=>K,AccordionContent:()=>D,AccordionHeading:()=>G,AccordionRoot:()=>U,Button:()=>v,ColorModesEnum:()=>H,FAQ:()=>Y,Heading:()=>P,HeadingSizes:()=>y,HeadingTags:()=>B,Hero:()=>j,InlineLink:()=>I,Link:()=>z,River:()=>V,Text:()=>g,TextSizes:()=>d,TextTags:()=>c,TextVariants:()=>m,ThemeContext:()=>R,ThemeProvider:()=>N,classMap:()=>A,defaultHeadingTag:()=>b,defaultRiverAlign:()=>O,defaultRiverImageTextRatio:()=>F,defaultTextSize:()=>p,defaultTextTag:()=>u,defaultTextVariant:()=>h,getHeadingWarning:()=>M,useTheme:()=>w});var e=a(893);function r(e){var n,a,_="";if("string"==typeof e||"number"==typeof e)_+=e;else if("object"==typeof e)if(Array.isArray(e))for(n=0;n<e.length;n++)e[n]&&(a=r(e[n]))&&(_&&(_+=" "),_+=a);else for(n in e)e[n]&&(_&&(_+=" "),_+=n);return _}function n(){for(var e,n,a=0,_="";a<arguments.length;)(e=arguments[a++])&&(n=r(e))&&(_&&(_+=" "),_+=n);return _}const t={Hero:"Primer_Brand__Hero-module__Hero___EM3jf","Hero--align-start":"Primer_Brand__Hero-module__Hero--align-start___m8GEr","Hero--align-center":"Primer_Brand__Hero-module__Hero--align-center___HUXm3","Hero-heading":"Primer_Brand__Hero-module__Hero-heading___QuVBH","Hero-description":"Primer_Brand__Hero-module__Hero-description___vG4iA","Hero-actions":"Primer_Brand__Hero-module__Hero-actions___oH1NT"};var i=a(697),o=a.n(i);function l({className:r,expanded:a=!1}){return(0,e.jsxs)("svg",{className:n("Primer_Brand__ExpandableArrow-module__ExpandableArrow___rkfek",a&&"Primer_Brand__ExpandableArrow-module__ExpandableArrow--expanded___gajDr",r),width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[(0,e.jsx)("path",{fill:"currentColor",d:"M7.28033 3.21967C6.98744 2.92678 6.51256 2.92678 6.21967 3.21967C5.92678 3.51256 5.92678 3.98744 6.21967 4.28033L7.28033 3.21967ZM11 8L11.5303 8.53033C11.8232 8.23744 11.8232 7.76256 11.5303 7.46967L11 8ZM6.21967 11.7197C5.92678 12.0126 5.92678 12.4874 6.21967 12.7803C6.51256 13.0732 6.98744 13.0732 7.28033 12.7803L6.21967 11.7197ZM6.21967 4.28033L10.4697 8.53033L11.5303 7.46967L7.28033 3.21967L6.21967 4.28033ZM10.4697 7.46967L6.21967 11.7197L7.28033 12.7803L11.5303 8.53033L10.4697 7.46967Z"}),(0,e.jsx)("path",{className:n("Primer_Brand__ExpandableArrow-module__ExpandableArrow-stem___g4mdy",a&&"Primer_Brand__ExpandableArrow-module__ExpandableArrow-stem--expanded___KwI_9"),stroke:"currentColor",d:"M1.75 8H11",strokeWidth:"1.5",strokeLinecap:"round"})]})}const s={Text:"Primer_Brand__Text-module__Text___pecHN","Text--default":"Primer_Brand__Text-module__Text--default___DChoE","Text--muted":"Primer_Brand__Text-module__Text--muted___lTaVa","Text--700":"Primer_Brand__Text-module__Text--700___cOggy","Text--600":"Primer_Brand__Text-module__Text--600___ThppA","Text--500":"Primer_Brand__Text-module__Text--500___orDRu","Text--400":"Primer_Brand__Text-module__Text--400___y7m4l","Text--300":"Primer_Brand__Text-module__Text--300___TBQTB","Text--200":"Primer_Brand__Text-module__Text--200___XAIGT","Text--100":"Primer_Brand__Text-module__Text--100___csEom"},d=["700","600","500","400","300","200","100"],c=["p","span","div"],m=["default","muted"],u=c[1],p=d[3],h=m[0];function g({as:r=u,className:a,children:_,size:t=p,variant:i=h,...l}){const d=n(s.Text,s[`Text--${i}`],s[`Text--${t}`],a),c=o().Children.toArray(_).map((e=>o().isValidElement(e)&&"string"!=typeof e.type&&e.type===I?o().cloneElement(e,{size:t}):e));return"p"===r?(0,e.jsx)("p",{className:d,...l,children:c}):"div"===r?(0,e.jsx)("div",{className:d,...l,children:c}):(0,e.jsx)("span",{className:d,...l,children:c})}const f={Button:"Primer_Brand__Button-module__Button___lDruK","Button--label":"Primer_Brand__Button-module__Button--label___lUBc0","Button-arrow":"Primer_Brand__Button-module__Button-arrow___SkJXQ","Button--primary":"Primer_Brand__Button-module__Button--primary___xIC7G","Button--label-primary":"Primer_Brand__Button-module__Button--label-primary___Leisi","Button--secondary":"Primer_Brand__Button-module__Button--secondary___akMC2"};function v({as:r,variant:a="secondary",className:_,children:t,onMouseEnter:i,onMouseLeave:s,onFocus:d,onBlur:c,...m}){const[u,p]=o().useState(!1),[h,v]=o().useState(!1),x=r||"button";return(0,e.jsxs)(x,{className:n(f.Button,f[`Button--${a}`],_),onMouseEnter:e=>{p(!0),i?.(e)},onMouseLeave:e=>{p(!1),s?.(e)},onFocus:e=>{v(!0),d?.(e)},onBlur:e=>{v(!1),c?.(e)},...m,children:[(0,e.jsx)(g,{as:"span",size:"400",className:n(f["Button--label"],"primary"===a&&f["Button--label-primary"]),children:t}),(0,e.jsx)(l,{className:f["Button-arrow"],expanded:u||h})]})}const x={Heading:"Primer_Brand__Heading-module__Heading___IVpmp","Heading--1":"Primer_Brand__Heading-module__Heading--1___Ufc7G","Heading--2":"Primer_Brand__Heading-module__Heading--2___TFg09","Heading--3":"Primer_Brand__Heading-module__Heading--3___wsITu","Heading--4":"Primer_Brand__Heading-module__Heading--4___C9jDG","Heading--5":"Primer_Brand__Heading-module__Heading--5___HgypG","Heading--6":"Primer_Brand__Heading-module__Heading--6___FEQ_V"},y=["1","2","3","4","5","6"],B=["h1","h2","h3","h4","h5","h6"],b=B[1],A={h1:y[0],h2:y[1],h3:y[2],h4:y[3],h5:y[4],h6:y[5]};function P({className:r,children:a,as:_=b,...t}){const i=n(x.Heading,x[`Heading--${A[_]}`],r),l=o().useCallback((({...e})=>B.includes(_)?o().createElement(_,e,a):(console.error(`Heading: 'as' prop must be one of ${B.join(", ")}`),null)),[_,a]);return(0,e.jsx)(l,{className:i,...t,children:a})}function j({className:r,heading:a,description:_,primaryAction:i,secondaryAction:o,align:l="start"}){return(0,e.jsxs)("div",{className:n(t.Hero,t[`Hero--align-${l}`],r),children:[(0,e.jsx)(P,{className:t["Hero-heading"],as:"h1",children:a}),_?(0,e.jsx)(g,{className:t["Hero-description"],as:"p",size:"400",variant:"muted",children:_}):null,(0,e.jsxs)("div",{className:t["Hero-actions"],children:[(0,e.jsx)(v,{as:"a",variant:"primary",href:i.href,children:i.text}),o?(0,e.jsx)(v,{as:"a",variant:"secondary",href:o.href,children:o.text}):null]})]})}var H;!function(e){e.LIGHT="light",e.DARK="dark",e.AUTO="auto"}(H||(H={}));const T=H.LIGHT,R=(0,i.createContext)({colorMode:T,availableColorModes:Object.values(H)});function N({colorMode:r=T,children:n,...a}){const[_,t]=(0,i.useState)(r),o=(0,i.useMemo)((()=>Object.values(H)),[]);return(0,i.useEffect)((()=>(r===H.AUTO?t(C()):_!==r&&t(r),L(t))),[r,_,t]),(0,e.jsx)(R.Provider,{value:{colorMode:_,availableColorModes:o},children:(0,e.jsx)("div",{"data-color-mode":_,...a,children:n})})}const E=()=>window.matchMedia(`(prefers-color-scheme: ${H.DARK})`),C=()=>E().matches?H.DARK:H.LIGHT,L=e=>{const r=E(),n=r=>e(r.matches?H.DARK:H.LIGHT);return r.addEventListener("change",n),()=>r.removeEventListener("change",n)},w=()=>(0,i.useContext)(R),k={River:"Primer_Brand__River-module__River___VHPl5",River__visual:"Primer_Brand__River-module__River__visual___sTe_U","River--align-center":"Primer_Brand__River-module__River--align-center___TH7xI","River__visual--has-shadow":"Primer_Brand__River-module__River__visual--has-shadow___cL9nP",River__heading:"Primer_Brand__River-module__River__heading___pwKXi","River__call-to-action":"Primer_Brand__River-module__River__call-to-action___GIOCe",River__text:"Primer_Brand__River-module__River__text___ZlR1K","River--50-50":"Primer_Brand__River-module__River--50-50___cpSFU","River--60-40":"Primer_Brand__River-module__River--60-40___XDKAU","River--align-start":"Primer_Brand__River-module__River--align-start___L0mn_","River--align-end":"Primer_Brand__River-module__River--align-end___UIM3e",River__content:"Primer_Brand__River-module__River__content___opQUA","River__body-text":"Primer_Brand__River-module__River__body-text___tt2Yf"},F="50:50",O="start",M=e=>`River.Content does not accept a Heading with as="${e}". River automatically applies as="h3" by default.`;function Q({children:r,leadingComponent:a,trailingComponent:_}){const t=o().Children.toArray(r).find((e=>o().isValidElement(e)&&e.type===P)),i=o().Children.toArray(r).find((e=>o().isValidElement(e)&&e.type===g)),l=o().Children.toArray(r).find((e=>o().isValidElement(e)&&e.type===z));return(0,e.jsxs)("div",{className:k.River__content,children:[a&&(0,e.jsx)("div",{children:(0,e.jsx)(a,{})}),o().isValidElement(t)&&(0,e.jsx)("div",{className:k.River__heading,children:o().cloneElement(t,{as:(e=>{const{as:r}=e.props;return r&&B.includes(r)&&"h3"!==r&&console.warn(M(r)),"h3"})(t)})}),o().isValidElement(i)&&(0,e.jsx)("div",{className:k["River__body-text"],children:o().cloneElement(i,{variant:"muted",as:"p",className:n(k.River__text,i.props.className)})}),o().isValidElement(l)&&(0,e.jsx)("div",{className:k["River__call-to-action"],children:o().cloneElement(l,{size:"large"})}),_&&(0,e.jsx)("div",{children:(0,e.jsx)(_,{})})]})}function S({children:r,className:a,hasShadow:_=!0}){return(0,e.jsx)("div",{className:n(k.River__visual,_&&k["River__visual--has-shadow"],a),children:r})}const V=Object.assign((function({imageTextRatio:r=F,align:a=O,className:_,children:t,...i}){const{Visual:l,Content:s}=o().Children.toArray(t).reduce(((e,r)=>(o().isValidElement(r)&&"string"!=typeof r.type&&(r.type===S&&(e.Visual=r),r.type===Q&&(e.Content=r)),e)),{Visual:null,Content:null}),d="start"===a||"center"===a?[s,l]:[l,s];return(0,e.jsx)("section",{className:n(k.River,k[`River--${r.replace(":","-")}`],k[`River--align-${a}`],_),...i,children:d})}),{Visual:S,Content:Q});function I({className:r,size:a=p,children:_,href:t,...i}){const o=n("Primer_Brand__InlineLink-module__InlineLink___U_Ama",r);return(0,e.jsx)("a",{href:t,className:o,...i,children:(0,e.jsx)(g,{size:a,as:"span",children:_})})}const $={Link:"Primer_Brand__Link-module__Link___lvKjM","Link--label":"Primer_Brand__Link-module__Link--label___j8etE","Link-arrow":"Primer_Brand__Link-module__Link-arrow___HBMJ9","Link--large":"Primer_Brand__Link-module__Link--large___cXMt5"};function z({size:r="medium",className:a,children:_,onMouseEnter:t,onMouseLeave:s,onFocus:d,onBlur:c,...m}){const[u,p]=o().useState(!1),[h,f]=o().useState(!1),v=(0,i.useCallback)((e=>{p(!u),t?.(e)}),[t,u]),x=(0,i.useCallback)((e=>{p(!u),s?.(e)}),[s,u]),y=(0,i.useCallback)((e=>{f(!h),d?.(e)}),[d,h]),B=(0,i.useCallback)((e=>{f(!h),c?.(e)}),[c,h]);return(0,e.jsxs)("a",{className:n($.Link,$[`Link--${r}`],a),onMouseEnter:v,onMouseLeave:x,onFocus:y,onBlur:B,...m,children:[(0,e.jsx)(g,{as:"span",size:{medium:"300",large:"400"}[r],className:n($["Link--label"]),children:_}),(0,e.jsx)(l,{className:$["Link-arrow"],expanded:u||h})]})}function U({children:r,className:a,open:_=!1,...t}){const{AccordionHeading:i,AccordionContent:l}=o().Children.toArray(r).reduce(((e,r)=>(o().isValidElement(r)&&"string"!=typeof r.type&&(r.type===D&&(e.AccordionContent=r),r.type===G&&(e.AccordionHeading=r)),e)),{AccordionHeading:null,AccordionContent:null});return(0,e.jsxs)("details",{className:n("Primer_Brand__Accordion-module__Accordion___M_LPt",a),open:_,...t,children:[i,l]})}function G({children:r,className:a}){return(0,e.jsx)("summary",{className:n("Primer_Brand__Accordion-module__Accordion__summary___NUIYc",a),children:(0,e.jsx)(P,{as:"h4",className:"Primer_Brand__Accordion-module__Accordion__summary-heading_____snF",children:r})})}function D({children:r,className:a}){const _=o().isValidElement(r)&&r.type===o().Fragment?r.props.children:r,t=o().Children.map(_,(r=>o().isValidElement(r)&&"string"==typeof r.type&&["p","span"].includes(r.type)?o().cloneElement(r,{children:(0,e.jsx)(g,{variant:"muted",size:"300",as:"span",children:r.props.children})}):r));return(0,e.jsx)("section",{className:n("Primer_Brand__Accordion-module__Accordion__content___wMZGe",a),children:o().Children.toArray(t).map((e=>o().isValidElement(e)&&o().cloneElement(e,{className:n("Primer_Brand__Accordion-module__Accordion__content-item___M_dlm",e.props.className)})))})}const K=Object.assign(U,{Content:D,Heading:G});var Z=a(864);const X={FAQ:"Primer_Brand__FAQ-module__FAQ___R3vLU",FAQ__heading:"Primer_Brand__FAQ-module__FAQ__heading___bH0aG",FAQ__subheading:"Primer_Brand__FAQ-module__FAQ__subheading___I4puv","FAQ__heading--start":"Primer_Brand__FAQ-module__FAQ__heading--start___eHaT3","FAQ__heading--center":"Primer_Brand__FAQ-module__FAQ__heading--center___xMpbW","FAQ__heading--large":"Primer_Brand__FAQ-module__FAQ__heading--large___pBEPT","FAQ__heading--with-margin":"Primer_Brand__FAQ-module__FAQ__heading--with-margin___S2_ET"};function q({children:r,className:a,size:_="medium",align:t="center"}){const i="medium"===_?"h3":"h2";return(0,e.jsx)(P,{as:i,className:n(X.FAQ__heading,"large"===_&&X["FAQ__heading--large"],X[`FAQ__heading--${t}`],a),children:r})}function W({children:r,className:a}){return(0,e.jsx)(P,{as:"h3",className:n(X.FAQ__subheading,a),children:r})}const Y=Object.assign((function({children:r,className:a}){const _=o().Children.toArray(r).some((e=>(0,Z.isFragment)(e))),t=o().Children.toArray(r).filter((e=>!(!o().isValidElement(e)||"string"==typeof e.type||!_&&e.type!==q&&e.type!==W&&e.type!==U))),i=o().Children.toArray(r).some((e=>o().isValidElement(e)&&"string"!=typeof e.type&&e.type===W));return(0,e.jsx)("section",{className:n(X.FAQ,a),children:o().Children.toArray(t).map((e=>o().isValidElement(e)&&"string"!=typeof e.type&&e.type===q?o().cloneElement(e,{align:i?"start":e.props.align,size:i?"large":e.props.size,className:n(!i&&X["FAQ__heading--with-margin"],e.props.className)}):e))})}),{Subheading:W,Heading:q,Item:U,Question:G,Answer:D})})(),_})()));
+!function(e,r){"object"==typeof exports&&"object"==typeof module?module.exports=r(require("react")):"function"==typeof define&&define.amd?define("@primer/react-brand",[],r):"object"==typeof exports?exports["@primer/react-brand"]=r(require("react")):e["@primer/react-brand"]=r(e.React)}(this,(e=>(()=>{"use strict";var r={418:e=>{var r=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable;function a(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var r={},n=0;n<10;n++)r["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(r).map((function(e){return r[e]})).join(""))return!1;var _={};return"abcdefghijklmnopqrst".split("").forEach((function(e){_[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},_)).join("")}catch(e){return!1}}()?Object.assign:function(e,t){for(var i,o,l=a(e),s=1;s<arguments.length;s++){for(var d in i=Object(arguments[s]))n.call(i,d)&&(l[d]=i[d]);if(r){o=r(i);for(var c=0;c<o.length;c++)_.call(i,o[c])&&(l[o[c]]=i[o[c]])}}return l}},921:(e,r)=>{var n=60103,_=60106,a=60107,t=60108,i=60114,o=60109,l=60110,s=60112,d=60113,c=60120,m=60115,u=60116;if("function"==typeof Symbol&&Symbol.for){var p=Symbol.for;n=p("react.element"),_=p("react.portal"),a=p("react.fragment"),t=p("react.strict_mode"),i=p("react.profiler"),o=p("react.provider"),l=p("react.context"),s=p("react.forward_ref"),d=p("react.suspense"),c=p("react.suspense_list"),m=p("react.memo"),u=p("react.lazy"),p("react.block"),p("react.server.block"),p("react.fundamental"),p("react.debug_trace_mode"),p("react.legacy_hidden")}r.isFragment=function(e){return function(e){if("object"==typeof e&&null!==e){var r=e.$$typeof;switch(r){case n:switch(e=e.type){case a:case i:case t:case d:case c:return e;default:switch(e=e&&e.$$typeof){case l:case s:case u:case m:case o:return e;default:return r}}case _:return r}}}(e)===a}},864:(e,r,n)=>{e.exports=n(921)},251:(e,r,n)=>{n(418);var _=n(697),a=60103;if("function"==typeof Symbol&&Symbol.for){var t=Symbol.for;a=t("react.element"),t("react.fragment")}var i=_.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,o=Object.prototype.hasOwnProperty,l={key:!0,ref:!0,__self:!0,__source:!0};function s(e,r,n){var _,t={},s=null,d=null;for(_ in void 0!==n&&(s=""+n),void 0!==r.key&&(s=""+r.key),void 0!==r.ref&&(d=r.ref),r)o.call(r,_)&&!l.hasOwnProperty(_)&&(t[_]=r[_]);if(e&&e.defaultProps)for(_ in r=e.defaultProps)void 0===t[_]&&(t[_]=r[_]);return{$$typeof:a,type:e,key:s,ref:d,props:t,_owner:i.current}}r.jsx=s,r.jsxs=s},893:(e,r,n)=>{e.exports=n(251)},697:r=>{r.exports=e}},n={};function _(e){var a=n[e];if(void 0!==a)return a.exports;var t=n[e]={exports:{}};return r[e](t,t.exports,_),t.exports}_.n=e=>{var r=e&&e.__esModule?()=>e.default:()=>e;return _.d(r,{a:r}),r},_.d=(e,r)=>{for(var n in r)_.o(r,n)&&!_.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:r[n]})},_.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),_.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var a={};return(()=>{_.r(a),_.d(a,{Accordion:()=>K,AccordionContent:()=>D,AccordionHeading:()=>G,AccordionRoot:()=>U,Button:()=>v,ColorModesEnum:()=>H,FAQ:()=>Y,Heading:()=>P,HeadingSizes:()=>y,HeadingTags:()=>B,Hero:()=>j,InlineLink:()=>I,Link:()=>z,River:()=>V,Text:()=>g,TextSizes:()=>d,TextTags:()=>c,TextVariants:()=>m,ThemeContext:()=>T,ThemeProvider:()=>N,classMap:()=>b,defaultHeadingTag:()=>A,defaultRiverAlign:()=>M,defaultRiverImageTextRatio:()=>F,defaultTextSize:()=>p,defaultTextTag:()=>u,defaultTextVariant:()=>h,getHeadingWarning:()=>O,useTheme:()=>w});var e=_(893);function r(e){var n,_,a="";if("string"==typeof e||"number"==typeof e)a+=e;else if("object"==typeof e)if(Array.isArray(e))for(n=0;n<e.length;n++)e[n]&&(_=r(e[n]))&&(a&&(a+=" "),a+=_);else for(n in e)e[n]&&(a&&(a+=" "),a+=n);return a}function n(){for(var e,n,_=0,a="";_<arguments.length;)(e=arguments[_++])&&(n=r(e))&&(a&&(a+=" "),a+=n);return a}const t={Hero:"Primer_Brand__Hero-module__Hero___EM3jf","Hero--align-start":"Primer_Brand__Hero-module__Hero--align-start___m8GEr","Hero--align-center":"Primer_Brand__Hero-module__Hero--align-center___HUXm3","Hero-heading":"Primer_Brand__Hero-module__Hero-heading___QuVBH","Hero-description":"Primer_Brand__Hero-module__Hero-description___vG4iA","Hero-actions":"Primer_Brand__Hero-module__Hero-actions___oH1NT"};var i=_(697),o=_.n(i);function l({className:r,expanded:_=!1}){return(0,e.jsxs)("svg",{className:n("Primer_Brand__ExpandableArrow-module__ExpandableArrow___rkfek",_&&"Primer_Brand__ExpandableArrow-module__ExpandableArrow--expanded___gajDr",r),width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:[(0,e.jsx)("path",{fill:"currentColor",d:"M7.28033 3.21967C6.98744 2.92678 6.51256 2.92678 6.21967 3.21967C5.92678 3.51256 5.92678 3.98744 6.21967 4.28033L7.28033 3.21967ZM11 8L11.5303 8.53033C11.8232 8.23744 11.8232 7.76256 11.5303 7.46967L11 8ZM6.21967 11.7197C5.92678 12.0126 5.92678 12.4874 6.21967 12.7803C6.51256 13.0732 6.98744 13.0732 7.28033 12.7803L6.21967 11.7197ZM6.21967 4.28033L10.4697 8.53033L11.5303 7.46967L7.28033 3.21967L6.21967 4.28033ZM10.4697 7.46967L6.21967 11.7197L7.28033 12.7803L11.5303 8.53033L10.4697 7.46967Z"}),(0,e.jsx)("path",{className:n("Primer_Brand__ExpandableArrow-module__ExpandableArrow-stem___g4mdy",_&&"Primer_Brand__ExpandableArrow-module__ExpandableArrow-stem--expanded___KwI_9"),stroke:"currentColor",d:"M1.75 8H11",strokeWidth:"1.5",strokeLinecap:"round"})]})}const s={Text:"Primer_Brand__Text-module__Text___pecHN","Text--default":"Primer_Brand__Text-module__Text--default___DChoE","Text--muted":"Primer_Brand__Text-module__Text--muted___lTaVa","Text--700":"Primer_Brand__Text-module__Text--700___cOggy","Text--600":"Primer_Brand__Text-module__Text--600___ThppA","Text--500":"Primer_Brand__Text-module__Text--500___orDRu","Text--400":"Primer_Brand__Text-module__Text--400___y7m4l","Text--300":"Primer_Brand__Text-module__Text--300___TBQTB","Text--200":"Primer_Brand__Text-module__Text--200___XAIGT","Text--100":"Primer_Brand__Text-module__Text--100___csEom"},d=["700","600","500","400","300","200","100"],c=["p","span","div"],m=["default","muted"],u=c[1],p=d[3],h=m[0];function g({as:r=u,className:_,children:a,size:t=p,variant:i=h,...l}){const d=n(s.Text,s[`Text--${i}`],s[`Text--${t}`],_),c=o().Children.toArray(a).map((e=>o().isValidElement(e)&&"string"!=typeof e.type&&e.type===I?o().cloneElement(e,{size:t}):e));return"p"===r?(0,e.jsx)("p",{className:d,...l,children:c}):"div"===r?(0,e.jsx)("div",{className:d,...l,children:c}):(0,e.jsx)("span",{className:d,...l,children:c})}const f={Button:"Primer_Brand__Button-module__Button___lDruK","Button--label":"Primer_Brand__Button-module__Button--label___lUBc0","Button-arrow":"Primer_Brand__Button-module__Button-arrow___SkJXQ","Button--primary":"Primer_Brand__Button-module__Button--primary___xIC7G","Button--label-primary":"Primer_Brand__Button-module__Button--label-primary___Leisi","Button--secondary":"Primer_Brand__Button-module__Button--secondary___akMC2"};function v({as:r,variant:_="secondary",className:a,children:t,onMouseEnter:i,onMouseLeave:s,onFocus:d,onBlur:c,...m}){const[u,p]=o().useState(!1),[h,v]=o().useState(!1),x=r||"button";return(0,e.jsxs)(x,{className:n(f.Button,f[`Button--${_}`],a),onMouseEnter:e=>{p(!0),i?.(e)},onMouseLeave:e=>{p(!1),s?.(e)},onFocus:e=>{v(!0),d?.(e)},onBlur:e=>{v(!1),c?.(e)},...m,children:[(0,e.jsx)(g,{as:"span",size:"400",className:n(f["Button--label"],"primary"===_&&f["Button--label-primary"]),children:t}),(0,e.jsx)(l,{className:f["Button-arrow"],expanded:u||h})]})}const x={Heading:"Primer_Brand__Heading-module__Heading___IVpmp","Heading--1":"Primer_Brand__Heading-module__Heading--1___Ufc7G","Heading--2":"Primer_Brand__Heading-module__Heading--2___TFg09","Heading--3":"Primer_Brand__Heading-module__Heading--3___wsITu","Heading--4":"Primer_Brand__Heading-module__Heading--4___C9jDG","Heading--5":"Primer_Brand__Heading-module__Heading--5___HgypG","Heading--6":"Primer_Brand__Heading-module__Heading--6___FEQ_V"},y=["1","2","3","4","5","6"],B=["h1","h2","h3","h4","h5","h6"],A=B[1],b={h1:y[0],h2:y[1],h3:y[2],h4:y[3],h5:y[4],h6:y[5]};function P({className:r,children:_,as:a=A,...t}){const i=n(x.Heading,x[`Heading--${b[a]}`],r),l=o().useCallback((({...e})=>B.includes(a)?o().createElement(a,e,_):(console.error(`Heading: 'as' prop must be one of ${B.join(", ")}`),null)),[a,_]);return(0,e.jsx)(l,{className:i,...t,children:_})}function j({className:r,heading:_,description:a,primaryAction:i,secondaryAction:o,align:l="start"}){return(0,e.jsxs)("div",{className:n(t.Hero,t[`Hero--align-${l}`],r),children:[(0,e.jsx)(P,{className:t["Hero-heading"],as:"h1",children:_}),a?(0,e.jsx)(g,{className:t["Hero-description"],as:"p",size:"400",variant:"muted",children:a}):null,(0,e.jsxs)("div",{className:t["Hero-actions"],children:[(0,e.jsx)(v,{as:"a",variant:"primary",href:i.href,children:i.text}),o?(0,e.jsx)(v,{as:"a",variant:"secondary",href:o.href,children:o.text}):null]})]})}var H;!function(e){e.LIGHT="light",e.DARK="dark",e.AUTO="auto"}(H||(H={}));const R=H.LIGHT,T=(0,i.createContext)({colorMode:R,availableColorModes:Object.values(H)});function N({colorMode:r=R,children:n,..._}){const[a,t]=(0,i.useState)(r),o=(0,i.useMemo)((()=>Object.values(H)),[]);return(0,i.useEffect)((()=>(r===H.AUTO?t(C()):a!==r&&t(r),L(t))),[r,a,t]),(0,e.jsx)(T.Provider,{value:{colorMode:a,availableColorModes:o},children:(0,e.jsx)("div",{"data-color-mode":a,..._,children:n})})}const E=()=>window.matchMedia(`(prefers-color-scheme: ${H.DARK})`),C=()=>E().matches?H.DARK:H.LIGHT,L=e=>{const r=E(),n=r=>e(r.matches?H.DARK:H.LIGHT);return r.addEventListener("change",n),()=>r.removeEventListener("change",n)},w=()=>(0,i.useContext)(T),k={River:"Primer_Brand__River-module__River___VHPl5","River--align-center":"Primer_Brand__River-module__River--align-center___TH7xI",River__visual:"Primer_Brand__River-module__River__visual___sTe_U","River__visual--fill-media":"Primer_Brand__River-module__River__visual--fill-media___AVMgH","River__visual--has-shadow":"Primer_Brand__River-module__River__visual--has-shadow___cL9nP",River__heading:"Primer_Brand__River-module__River__heading___pwKXi","River__call-to-action":"Primer_Brand__River-module__River__call-to-action___GIOCe",River__text:"Primer_Brand__River-module__River__text___ZlR1K","River--50-50":"Primer_Brand__River-module__River--50-50___cpSFU","River--60-40":"Primer_Brand__River-module__River--60-40___XDKAU","River--align-start":"Primer_Brand__River-module__River--align-start___L0mn_","River--align-end":"Primer_Brand__River-module__River--align-end___UIM3e",River__content:"Primer_Brand__River-module__River__content___opQUA","River__body-text":"Primer_Brand__River-module__River__body-text___tt2Yf"},F="50:50",M="start",O=e=>`River.Content does not accept a Heading with as="${e}". River automatically applies as="h3" by default.`;function Q({children:r,leadingComponent:_,trailingComponent:a}){const t=o().Children.toArray(r).find((e=>o().isValidElement(e)&&e.type===P)),i=o().Children.toArray(r).find((e=>o().isValidElement(e)&&e.type===g)),l=o().Children.toArray(r).find((e=>o().isValidElement(e)&&e.type===z));return(0,e.jsxs)("div",{className:k.River__content,children:[_&&(0,e.jsx)("div",{children:(0,e.jsx)(_,{})}),o().isValidElement(t)&&(0,e.jsx)("div",{className:k.River__heading,children:o().cloneElement(t,{as:(e=>{const{as:r}=e.props;return r&&B.includes(r)&&"h3"!==r&&console.warn(O(r)),"h3"})(t)})}),o().isValidElement(i)&&(0,e.jsx)("div",{className:k["River__body-text"],children:o().cloneElement(i,{variant:"muted",as:"p",className:n(k.River__text,i.props.className)})}),o().isValidElement(l)&&(0,e.jsx)("div",{className:k["River__call-to-action"],children:o().cloneElement(l,{size:"large"})}),a&&(0,e.jsx)("div",{children:(0,e.jsx)(a,{})})]})}function S({fillMedia:r=!0,children:_,className:a,hasShadow:t=!0}){return(0,e.jsx)("div",{className:n(k.River__visual,t&&k["River__visual--has-shadow"],r&&k["River__visual--fill-media"],a),children:_})}const V=Object.assign((function({imageTextRatio:r=F,align:_=M,className:a,children:t,...i}){const{Visual:l,Content:s}=o().Children.toArray(t).reduce(((e,r)=>(o().isValidElement(r)&&"string"!=typeof r.type&&(r.type===S&&(e.Visual=r),r.type===Q&&(e.Content=r)),e)),{Visual:null,Content:null}),d="start"===_||"center"===_?[s,l]:[l,s];return(0,e.jsx)("section",{className:n(k.River,k[`River--${r.replace(":","-")}`],k[`River--align-${_}`],a),...i,children:d})}),{Visual:S,Content:Q});function I({className:r,size:_=p,children:a,href:t,...i}){const o=n("Primer_Brand__InlineLink-module__InlineLink___U_Ama",r);return(0,e.jsx)("a",{href:t,className:o,...i,children:(0,e.jsx)(g,{size:_,as:"span",children:a})})}const $={Link:"Primer_Brand__Link-module__Link___lvKjM","Link--label":"Primer_Brand__Link-module__Link--label___j8etE","Link-arrow":"Primer_Brand__Link-module__Link-arrow___HBMJ9","Link--large":"Primer_Brand__Link-module__Link--large___cXMt5"};function z({size:r="medium",className:_,children:a,onMouseEnter:t,onMouseLeave:s,onFocus:d,onBlur:c,...m}){const[u,p]=o().useState(!1),[h,f]=o().useState(!1),v=(0,i.useCallback)((e=>{p(!u),t?.(e)}),[t,u]),x=(0,i.useCallback)((e=>{p(!u),s?.(e)}),[s,u]),y=(0,i.useCallback)((e=>{f(!h),d?.(e)}),[d,h]),B=(0,i.useCallback)((e=>{f(!h),c?.(e)}),[c,h]);return(0,e.jsxs)("a",{className:n($.Link,$[`Link--${r}`],_),onMouseEnter:v,onMouseLeave:x,onFocus:y,onBlur:B,...m,children:[(0,e.jsx)(g,{as:"span",size:{medium:"300",large:"400"}[r],className:n($["Link--label"]),children:a}),(0,e.jsx)(l,{className:$["Link-arrow"],expanded:u||h})]})}function U({children:r,className:_,open:a=!1,...t}){const{AccordionHeading:i,AccordionContent:l}=o().Children.toArray(r).reduce(((e,r)=>(o().isValidElement(r)&&"string"!=typeof r.type&&(r.type===D&&(e.AccordionContent=r),r.type===G&&(e.AccordionHeading=r)),e)),{AccordionHeading:null,AccordionContent:null});return(0,e.jsxs)("details",{className:n("Primer_Brand__Accordion-module__Accordion___M_LPt",_),open:a,...t,children:[i,l]})}function G({children:r,className:_}){return(0,e.jsx)("summary",{className:n("Primer_Brand__Accordion-module__Accordion__summary___NUIYc",_),children:(0,e.jsx)(P,{as:"h4",className:"Primer_Brand__Accordion-module__Accordion__summary-heading_____snF",children:r})})}function D({children:r,className:_}){const a=o().isValidElement(r)&&r.type===o().Fragment?r.props.children:r,t=o().Children.map(a,(r=>o().isValidElement(r)&&"string"==typeof r.type&&["p","span"].includes(r.type)?o().cloneElement(r,{children:(0,e.jsx)(g,{variant:"muted",size:"300",as:"span",children:r.props.children})}):r));return(0,e.jsx)("section",{className:n("Primer_Brand__Accordion-module__Accordion__content___wMZGe",_),children:o().Children.toArray(t).map((e=>o().isValidElement(e)&&o().cloneElement(e,{className:n("Primer_Brand__Accordion-module__Accordion__content-item___M_dlm",e.props.className)})))})}const K=Object.assign(U,{Content:D,Heading:G});var Z=_(864);const X={FAQ:"Primer_Brand__FAQ-module__FAQ___R3vLU",FAQ__heading:"Primer_Brand__FAQ-module__FAQ__heading___bH0aG",FAQ__subheading:"Primer_Brand__FAQ-module__FAQ__subheading___I4puv","FAQ__heading--start":"Primer_Brand__FAQ-module__FAQ__heading--start___eHaT3","FAQ__heading--center":"Primer_Brand__FAQ-module__FAQ__heading--center___xMpbW","FAQ__heading--large":"Primer_Brand__FAQ-module__FAQ__heading--large___pBEPT","FAQ__heading--with-margin":"Primer_Brand__FAQ-module__FAQ__heading--with-margin___S2_ET"};function q({children:r,className:_,size:a="medium",align:t="center"}){const i="medium"===a?"h3":"h2";return(0,e.jsx)(P,{as:i,className:n(X.FAQ__heading,"large"===a&&X["FAQ__heading--large"],X[`FAQ__heading--${t}`],_),children:r})}function W({children:r,className:_}){return(0,e.jsx)(P,{as:"h3",className:n(X.FAQ__subheading,_),children:r})}const Y=Object.assign((function({children:r,className:_}){const a=o().Children.toArray(r).some((e=>(0,Z.isFragment)(e))),t=o().Children.toArray(r).filter((e=>!(!o().isValidElement(e)||"string"==typeof e.type||!a&&e.type!==q&&e.type!==W&&e.type!==U))),i=o().Children.toArray(r).some((e=>o().isValidElement(e)&&"string"!=typeof e.type&&e.type===W));return(0,e.jsx)("section",{className:n(X.FAQ,_),children:o().Children.toArray(t).map((e=>o().isValidElement(e)&&"string"!=typeof e.type&&e.type===q?o().cloneElement(e,{align:i?"start":e.props.align,size:i?"large":e.props.size,className:n(!i&&X["FAQ__heading--with-margin"],e.props.className)}):e))})}),{Subheading:W,Heading:q,Item:U,Question:G,Answer:D})})(),a})()));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/react-brand",
-  "version": "0.3.0",
+  "version": "0.3.1-rc.9ad887b",
   "author": "GitHub, Inc.",
   "license": "MIT",
   "bugs": {
@@ -41,11 +41,14 @@
     "start:storybook": "start-storybook -p 6006",
     "start:docs": "cd docs && npm run develop",
     "start:css-types": "tcm -w -p 'src/**/*.css' .",
-    "test": "jest"
+    "test": "jest",
+    "test:visual": "npx build-storybook && scripts/playwright/run-visual-tests",
+    "test:visual:generate": "npm run build:docs && ts-node scripts/playwright/playwright.generate-tests.ts",
+    "test:visual:update-snapshots": "npx build-storybook && scripts/playwright/update-visual-snapshots"
   },
   "peerDependencies": {
-    "react": ">=17.0.0 <= 18.0.0",
-    "react-dom": ">=17.0.0 <= 18.0.0"
+    "react": ">=17 <= 18",
+    "react-dom": ">=17 <= 18"
   },
   "devDependencies": {
     "@changesets/changelog-github": "^0.4.3",
@@ -53,9 +56,12 @@
     "@github/prettier-config": "^0.0.4",
     "@primer/octicons-react": "^17.3.0",
     "@primer/primitives": "^7.8.3",
+    "@storybook/addon-a11y": "^6.5.9",
+    "@storybook/jest": "^0.0.10",
+    "@storybook/test-runner": "^0.5.0",
     "@storybook/addon-actions": "^6.5.6",
     "@storybook/addon-essentials": "^6.5.6",
-    "@storybook/addon-interactions": "^6.5.6",
+    "@storybook/addon-interactions": "^6.5.9",
     "@storybook/addon-links": "^6.5.6",
     "@storybook/builder-webpack5": "^6.5.6",
     "@storybook/manager-webpack5": "^6.5.6",
@@ -72,6 +78,7 @@
     "@types/webpack": "^4.41.25",
     "@typescript-eslint/eslint-plugin": "^5.17.0",
     "@typescript-eslint/parser": "^5.17.0",
+    "axe-playwright": "^1.1.11",
     "autoprefixer": "^9.8.8",
     "color2k": "^2.0.0",
     "cross-env": "7.0.2",
@@ -93,6 +100,7 @@
     "postcss": "^8.4.7",
     "postcss-loader": "^6.2.1",
     "postcss-preset-env": "^7.4.2",
+    "@playwright/test": "^1.24.0",
     "prettier": "^2.5.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
@@ -101,7 +109,7 @@
     "style-loader": "^3.3.1",
     "ts-jest": "^27.1.3",
     "ts-loader": "^9.2.7",
-    "ts-node": "^10.7.0",
+    "ts-node": "^10.9.1",
     "typed-css-modules": "^0.7.0",
     "typescript": "^4.6.3",
     "typescript-plugin-css-modules": "^3.4.0",