@primer/components 0.0.0-2021827223713 → 0.0.0-2021828162730

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -413,7 +413,7 @@
413
413
  background: ${vt("colors.border.muted")};
414
414
  margin-top: calc(${vt("space.2")} - 1px);
415
415
  margin-bottom: ${vt("space.2")};
416
- `;function xa(){return n.default.createElement(ha,null)}xa.displayName="Divider",xa.renderItem=xa;const va={default:{hover:{light:"rgba(46, 77, 108, 0.06)",dark:"rgba(201, 206, 212, 0.12)",dark_dimmed:"rgba(201, 206, 212, 0.12)"},focus:{light:"rgba(54, 77, 100, 0.16)",dark:"rgba(201, 206, 212, 0.24)",dark_dimmed:"rgba(201, 206, 212, 0.24)"}},danger:{hover:{light:"rgba(234, 74, 90, 0.08)",dark:"rgba(248, 81, 73, 0.16)",dark_dimmed:"rgba(248, 81, 73, 0.16)"},focus:{light:"rgba(234, 74, 90, 0.14)",dark:"rgba(248, 81, 73, 0.24)",dark_dimmed:"rgba(248, 81, 73, 0.24)"}}},ya=(e="default",t)=>{if(t)return{color:vt("colors.fg.muted"),iconColor:vt("colors.fg.muted"),annotationColor:vt("colors.fg.muted"),hoverCursor:"default"};switch(e){case"danger":return{color:vt("colors.danger.fg"),iconColor:vt("colors.danger.fg"),annotationColor:vt("colors.fg.muted"),hoverCursor:"pointer"};default:return{color:"inherit",iconColor:vt("colors.fg.muted"),annotationColor:vt("colors.fg.muted"),hoverCursor:"pointer"}}},wa=d.default.div`
416
+ `;function xa(){return n.default.createElement(ha,null)}xa.displayName="Divider",xa.renderItem=xa;const va={default:{hover:{light:"rgba(46, 77, 108, 0.06)",dark:"rgba(201, 206, 212, 0.12)",dark_dimmed:"rgba(201, 206, 212, 0.12)"},focus:{light:"rgba(54, 77, 100, 0.16)",dark:"rgba(201, 206, 212, 0.24)",dark_dimmed:"rgba(201, 206, 212, 0.24)"}},danger:{hover:{light:"rgba(234, 74, 90, 0.08)",dark:"rgba(248, 81, 73, 0.16)",dark_dimmed:"rgba(248, 81, 73, 0.16)"},focus:{light:"rgba(234, 74, 90, 0.14)",dark:"rgba(248, 81, 73, 0.24)",dark_dimmed:"rgba(248, 81, 73, 0.24)"}}},ya=(e="default",t)=>{if(t)return{color:vt("colors.fg.muted"),iconColor:vt("colors.fg.muted"),annotationColor:vt("colors.fg.muted"),hoverCursor:"default"};switch(e){case"danger":return{color:vt("colors.danger.fg"),iconColor:vt("colors.danger.fg"),annotationColor:vt("colors.fg.muted"),hoverCursor:"pointer"};default:return{color:vt("colors.fg.default"),iconColor:vt("colors.fg.muted"),annotationColor:vt("colors.fg.muted"),hoverCursor:"pointer"}}},wa=d.default.div`
417
417
  display: flex;
418
418
  min-width: 0;
419
419
 
@@ -438,6 +438,7 @@
438
438
  color: ${({variant:e,item:t})=>ya(e,null==t?void 0:t.disabled).color};
439
439
  // 2 frames on a 60hz monitor
440
440
  transition: background 33.333ms linear;
441
+ text-decoration: none;
441
442
 
442
443
  @media (hover: hover) and (pointer: fine) {
443
444
  :hover {
@@ -541,7 +542,7 @@
541
542
  flex-basis: var(--description-container-flex-basis);
542
543
  `,Aa=d.default.input`
543
544
  pointer-events: none;
544
- `;function Na(e){const{text:r,description:o,descriptionVariant:a="inline",selected:d,selectionVariant:i,leadingVisual:l,trailingIcon:c,trailingText:s,variant:f="default",showDivider:b,disabled:g,onAction:u,onKeyPress:p,children:m,onClick:h,id:x,...v}=e,y=Po(),w=Po(),B=t.useCallback((t=>{if(g)return;null==p||p(t);t.target instanceof HTMLInputElement&&"checkbox"===t.target.type&&" "===t.key||!t.defaultPrevented&&[" ","Enter"].includes(t.key)&&(null==u||u(e,t))}),[u,g,e,p]),$=t.useCallback((t=>{g||(null==h||h(t),t.defaultPrevented||null==u||u(e,t))}),[u,g,e,h]),k=va[f],S=Gt(k.hover,"inherit"),T=Gt(k.focus,"inherit"),{theme:E}=Ut();return n.default.createElement($a,Tt({tabIndex:g?void 0:-1,variant:f,showDivider:b,"aria-selected":d,"aria-labelledby":r?y:void 0,"aria-describedby":o?w:void 0},v,{"data-id":x,onKeyPress:B,onClick:$,hoverBackground:g?"inherit":S,focusBackground:g?"inherit":T}),!!d===d&&n.default.createElement(Sa,null,"multiple"===i?n.default.createElement(n.default.Fragment,null,n.default.createElement(Aa,{disabled:g,tabIndex:-1,type:"checkbox",checked:d,"aria-label":r,readOnly:!0,"aria-readonly":"false"})):d&&n.default.createElement(Qr,{fill:null==E?void 0:E.colors.text.primary})),l&&n.default.createElement(Ea,{variant:f,disabled:g},n.default.createElement(l,null)),n.default.createElement(wa,null,n.default.createElement(Ba,{style:{"--main-content-flex-direction":"inline"===a?"row":"column"}},m,r?n.default.createElement(ka,{id:y},r):null,o?n.default.createElement(Ia,{id:w,style:{"--description-container-margin-left":"inline"===a?vt("space.2")(E):0,"--description-container-flex-basis":"inline"===a?0:"auto"}},"block"===a?o:n.default.createElement(ma,{title:o,inline:!0,maxWidth:"100%"},o)):null),c||s?n.default.createElement(Ca,{variant:f,disabled:g},s,c&&n.default.createElement(c,null)):null))}Na.displayName="Item";const Ra=d.default.div`
545
+ `,Na=n.default.forwardRef(((e,r)=>{const{as:o,text:a,description:d,descriptionVariant:i="inline",selected:l,selectionVariant:c,leadingVisual:s,trailingIcon:f,trailingText:b,variant:g="default",showDivider:u,disabled:p,onAction:m,onKeyPress:h,children:x,onClick:v,id:y,...w}=e,B=Po(),$=Po(),k=t.useCallback((t=>{if(p)return;null==h||h(t);t.target instanceof HTMLInputElement&&"checkbox"===t.target.type&&" "===t.key||!t.defaultPrevented&&[" ","Enter"].includes(t.key)&&(null==m||m(e,t))}),[m,p,e,h]),S=t.useCallback((t=>{p||(null==v||v(t),t.defaultPrevented||null==m||m(e,t))}),[m,p,e,v]),T=va[g],E=Gt(T.hover,"inherit"),C=Gt(T.focus,"inherit"),{theme:I}=Ut();return n.default.createElement($a,Tt({ref:r,as:o,tabIndex:p?void 0:-1,variant:g,showDivider:u,"aria-selected":l,"aria-labelledby":a?B:void 0,"aria-describedby":d?$:void 0},w,{"data-id":y,onKeyPress:k,onClick:S,hoverBackground:p?"inherit":E,focusBackground:p?"inherit":C}),!!l===l&&n.default.createElement(Sa,null,"multiple"===c?n.default.createElement(n.default.Fragment,null,n.default.createElement(Aa,{disabled:p,tabIndex:-1,type:"checkbox",checked:l,"aria-label":a,readOnly:!0,"aria-readonly":"false"})):l&&n.default.createElement(Qr,{fill:null==I?void 0:I.colors.text.primary})),s&&n.default.createElement(Ea,{variant:g,disabled:p},n.default.createElement(s,null)),n.default.createElement(wa,null,n.default.createElement(Ba,{style:{"--main-content-flex-direction":"inline"===i?"row":"column"}},x,a?n.default.createElement(ka,{id:B},a):null,d?n.default.createElement(Ia,{id:$,style:{"--description-container-margin-left":"inline"===i?vt("space.2")(I):0,"--description-container-flex-basis":"inline"===i?0:"auto"}},"block"===i?d:n.default.createElement(ma,{title:d,inline:!0,maxWidth:"100%"},d)):null),f||b?n.default.createElement(Ca,{variant:g,disabled:p},b,f&&n.default.createElement(f,null)):null))}));const Ra=d.default.div`
545
546
  font-size: ${vt("fontSizes.1")};
546
547
  /* 14px font-size * 1.428571429 = 20px line height
547
548
  *
@@ -554,7 +555,7 @@
554
555
  --item-hover-bg-override: none;
555
556
  --item-hover-divider-border-color-override: ${vt("colors.border.muted")};
556
557
  }
557
- `;const za=n.default.forwardRef(((e,t)=>{const{firstGroupStyle:r,lastGroupStyle:o,headerStyle:a,itemStyle:d}=function(e="inset"){switch(e){case"full":return{headerStyle:{paddingX:vt("space.2")},itemStyle:{borderRadius:0}};default:return{firstGroupStyle:{marginTop:vt("space.2")},lastGroupStyle:{marginBottom:vt("space.2")},itemStyle:{marginX:vt("space.2")}}}}(e.variant),i=(t,r,o)=>{var a,i,l;const c="renderItem"in t&&t.renderItem||e.renderItem||Na,s=null!==(a=null!==(i=t.key)&&void 0!==i?i:null===(l=t.id)||void 0===l?void 0:l.toString())&&void 0!==a?a:o.toString();return n.default.createElement(c,Tt({showDivider:e.showItemDividers,selectionVariant:e.selectionVariant},t,{key:s,sx:{...d,...t.sx},item:r}))};let l=[];if(function(e){return"groupMetadata"in e}(e)){const t=e.groupMetadata.reduce(((e,t)=>e.set(t.groupId,t)),new Map);for(const r of e.items){var c,s,f;const e=t.get(r.groupId),o=null!==(c=null==e||null===(s=e.items)||void 0===s?void 0:s.length)&&void 0!==c?c:0;t.set(r.groupId,{...e,items:[...null!==(f=null==e?void 0:e.items)&&void 0!==f?f:[],i({showDivider:null==e?void 0:e.showItemDividers,...e&&"renderItem"in e&&{renderItem:e.renderItem},...r},r,o)]})}l=[...t.values()]}else l=[{items:e.items.map(((e,t)=>i(e,e,t))),groupId:"0"}];return n.default.createElement(Ra,Tt({},e,{ref:t}),l.map((({header:t,...d},i)=>{const c="filled"===(null==t?void 0:t.variant),s=i>0&&!c;return n.default.createElement(n.default.Fragment,{key:d.groupId},s?n.default.createElement(xa,{key:`${d.groupId}-divider`}):null,(t=>{var r;const o=(null!==(r="renderGroup"in t&&t.renderGroup)&&void 0!==r?r:e.renderGroup)||ua;return n.default.createElement(o,Tt({},t,{key:t.groupId}))})({sx:{...0===i&&r,...i===l.length-1&&o,...i>0&&!s&&{mt:2}},...t&&{header:{...t,sx:{...a,...t.sx}}},...d}))})))}));za.displayName="ActionList";const La=Object.assign(za,{Group:ua,Item:Na,Divider:xa}),Ha={xsmall:"192px",small:"256px",medium:"320px",large:"432px",xlarge:"600px",auto:"auto",initial:"auto"},Oa={small:"256px",medium:"320px",large:"480px",xlarge:"640px",xxlarge:"960px",auto:"auto"};const Ma=d.default.div`
558
+ `;const za=n.default.forwardRef(((e,t)=>{const{firstGroupStyle:r,lastGroupStyle:o,headerStyle:a,itemStyle:d}=function(e="inset"){switch(e){case"full":return{headerStyle:{paddingX:vt("space.2")},itemStyle:{borderRadius:0}};default:return{firstGroupStyle:{marginTop:vt("space.2")},lastGroupStyle:{marginBottom:vt("space.2")},itemStyle:{marginX:vt("space.2")}}}}(e.variant),i=(t,r,o)=>{var a,i,l;const c="renderItem"in t&&t.renderItem||e.renderItem||Na,s=null!==(a=null!==(i="key"in t?t.key:void 0)&&void 0!==i?i:null===(l=t.id)||void 0===l?void 0:l.toString())&&void 0!==a?a:o.toString();return n.default.createElement(c,Tt({showDivider:e.showItemDividers,selectionVariant:e.selectionVariant},t,{key:s,sx:{...d,...t.sx},item:r}))};let l=[];if(function(e){return"groupMetadata"in e}(e)){const t=e.groupMetadata.reduce(((e,t)=>e.set(t.groupId,t)),new Map);for(const r of e.items){var c,s,f;const e=t.get(r.groupId),o=null!==(c=null==e||null===(s=e.items)||void 0===s?void 0:s.length)&&void 0!==c?c:0;t.set(r.groupId,{...e,items:[...null!==(f=null==e?void 0:e.items)&&void 0!==f?f:[],i({showDivider:null==e?void 0:e.showItemDividers,...e&&"renderItem"in e&&{renderItem:e.renderItem},...r},r,o)]})}l=[...t.values()]}else l=[{items:e.items.map(((e,t)=>i(e,e,t))),groupId:"0"}];return n.default.createElement(Ra,Tt({},e,{ref:t}),l.map((({header:t,...d},i)=>{const c="filled"===(null==t?void 0:t.variant),s=i>0&&!c;return n.default.createElement(n.default.Fragment,{key:d.groupId},s?n.default.createElement(xa,{key:`${d.groupId}-divider`}):null,(t=>{var r;const o=(null!==(r="renderGroup"in t&&t.renderGroup)&&void 0!==r?r:e.renderGroup)||ua;return n.default.createElement(o,Tt({},t,{key:t.groupId}))})({sx:{...0===i&&r,...i===l.length-1&&o,...i>0&&!s&&{mt:2}},...t&&{header:{...t,sx:{...a,...t.sx}}},...d}))})))}));za.displayName="ActionList";const La=Object.assign(za,{Group:ua,Item:Na,Divider:xa}),Ha={xsmall:"192px",small:"256px",medium:"320px",large:"432px",xlarge:"600px",auto:"auto",initial:"auto"},Oa={small:"256px",medium:"320px",large:"480px",xlarge:"640px",xxlarge:"960px",auto:"auto"};const Ma=d.default.div`
558
559
  background-color: ${vt("colors.canvas.overlay")};
559
560
  box-shadow: ${vt("shadows.overlay.shadow")};
560
561
  position: absolute;
@@ -748,8 +749,10 @@
748
749
  `,on=d.default.nav`
749
750
  display: flex;
750
751
  justify-content: space-between;
752
+ ${yt};
753
+ ${St};
751
754
  ${Xt};
752
- `;function an({className:e,children:t,sx:r}){const o=n.default.Children.map(t,(e=>n.default.createElement(rn,null,e)));return n.default.createElement(on,{className:e,"aria-label":"Breadcrumbs",sx:r},n.default.createElement(Vt,{as:"ol",my:0,pl:0},o))}an.displayName="Breadcrumbs";const nn=d.default.a.attrs((e=>({activeClassName:"string"==typeof e.to?"selected":"",className:Ja(e.selected&&"selected",e.className),"aria-current":e.selected?"page":null})))`
755
+ `;function an({className:e,children:t,theme:r,...o}){const a=n.default.Children.map(t,(e=>n.default.createElement(rn,{theme:r},e)));return n.default.createElement(on,Tt({className:e,"aria-label":"Breadcrumbs",theme:r},o),n.default.createElement(Vt,{as:"ol",my:0,pl:0},a))}an.displayName="Breadcrumbs";const nn=d.default.a.attrs((e=>({activeClassName:"string"==typeof e.to?"selected":"",className:Ja(e.selected&&"selected",e.className),"aria-current":e.selected?"page":null})))`
753
756
  color: ${vt("colors.accent.fg")};
754
757
  display: inline-block;
755
758
  font-size: ${vt("fontSizes.1")};
@@ -761,6 +764,7 @@
761
764
  color: ${vt("colors.fg.default")};
762
765
  pointer-events: none;
763
766
  }
767
+ ${yt}
764
768
  ${Xt};
765
769
  `;an.displayName="Breadcrumbs",nn.displayName="Breadcrumbs.Item";var dn=Object.assign(an,{Item:nn});const ln=Object.assign(an,{Item:nn}),cn={top:"Bottom",right:"Left",bottom:"Top",left:"Right"},sn={top:"Left",right:"Top",bottom:"Left",left:"Top"};function fn(e,t,r){const o=cn[e].toLowerCase(),a=sn[e].toLowerCase();return{[o]:"100%",[t||a]:t?r:"50%"}}const bn=ut({prop:"bg",key:"colors"}),gn=ut({prop:"borderColor",key:"colors"}),un=ut({prop:"borderWidth",key:"borderWidths",scale:[0,1]});function pn(e){var t;const o=n.default.useContext(r.ThemeContext),a={...e,theme:null!==(t=e.theme)&&void 0!==t?t:o},{bg:d}=bn(a),{borderColor:i}=gn(a),{borderWidth:l}=un(a),{size:c=8,location:s="bottom"}=e,[f,b]=function(e){const[t,r]=e.split("-");return[t,r]}(s),g=sn[f],u=[-c,0],p=[0,c],m=[c,0],h=`M${u}L${p}L${m}L${u}Z`,x=`M${u}L${p}L${m}`,v={top:`translate(${[c,2*c]}) rotate(180)`,right:`translate(${[0,c]}) rotate(-90)`,bottom:`translate(${[c,0]})`,left:`translate(${[2*c,c]}) rotate(90)`}[f];return n.default.createElement("svg",{width:2*c,height:2*c,style:{pointerEvents:"none",position:"absolute",...fn(f,b,c),[`margin${g}`]:b?null:-c}},n.default.createElement("g",{transform:v},n.default.createElement("path",{d:h,fill:d}),n.default.createElement("path",{d:x,fill:"none",stroke:i,strokeWidth:l})))}pn.displayName="Caret",pn.locations=["top","top-left","top-right","right","right-top","right-bottom","bottom","bottom-left","bottom-right","left","left-top","left-bottom"],pn.defaultProps={bg:"bg.canvas",borderColor:"border.primary",borderWidth:1};const mn={small:56,medium:96,large:128},hn=d.default.div`
766
770
  display: ${e=>e.inline?"inline-flex":"flex"};