@leafygreen-ui/typography - npm Package Compare versions

Comparing version 16.2.1 to 16.3.0

CHANGELOG.md

 # @leafygreen-ui/typography
 
+## 16.3.0
+
+### Minor Changes
+
+- 07db42330: Exports typography component types
+
+### Patch Changes
+
+- 55d33e435: Update to BaseFontSize prop control for .design live example
+- cf00160ec: Updates TSDocs
+- Updated dependencies [55d33e435]
+- Updated dependencies [55d33e435]
+- Updated dependencies [cf00160ec]
+- Updated dependencies [111b680c5]
+- Updated dependencies [77320a6b8]
+  - @leafygreen-ui/lib@10.3.3
+  - @leafygreen-ui/palette@4.0.4
+  - @leafygreen-ui/tokens@2.0.3
+
 ## 16.2.1
@@ -4,0 +23,0 @@

dist/index.d.ts

 export { default as Body } from './Body/Body';
+export type { BodyProps } from './Body/Body.types';
 export { default as Description } from './Description/Description';
+export type { DescriptionProps } from './Description/Description.types';
 export { default as Disclaimer } from './Disclaimer/Disclaimer';
+export type { DisclaimerProps } from './Disclaimer/Disclaimer.types';
 export { default as Error } from './Error/Error';
+export type { ErrorProps } from './Error/Error.types';
 export { default as H1 } from './H1/H1';
+export type { H1Props } from './H1/H1.types';
 export { default as H2 } from './H2/H2';
+export type { H2Props } from './H2/H2.types';
 export { default as H3 } from './H3/H3';
+export type { H3Props } from './H3/H3.types';
 export { default as InlineCode } from './InlineCode/InlineCode';
+export type { InlineCodeProps } from './InlineCode/InlineCode.types';
 export { default as InlineKeyCode } from './InlineKeyCode/InlineKeyCode';
+export type { InlineKeyCodeProps } from './InlineKeyCode/InlineKeyCode.types';
 export { default as Label } from './Label/Label';
 export { labelTypeScaleStyles } from './Label/Label.styles';
+export type { LabelProps } from './Label/Label.types';
 export { default as Link } from './Link/Link';
 export { anchorClassName } from './Link/Link.styles';
+export type { LinkProps } from './Link/Link.types';
 export { default as Overline } from './Overline/Overline';
@@ -15,0 +26,0 @@ export { bodyTypeScaleStyles } from './styles';

package.json

 {
   "name": "@leafygreen-ui/typography",
-  "version": "16.2.1",
+  "version": "16.3.0",
   "description": "leafyGreen UI Kit Typography",
@@ -25,6 +25,6 @@ "main": "./dist/index.js",
     "@leafygreen-ui/icon": "^11.13.1",
-    "@leafygreen-ui/lib": "^10.3.2",
-    "@leafygreen-ui/palette": "^4.0.3",
+    "@leafygreen-ui/lib": "^10.3.3",
+    "@leafygreen-ui/palette": "^4.0.4",
     "@leafygreen-ui/polymorphic": "^1.3.1",
-    "@leafygreen-ui/tokens": "^2.0.2"
+    "@leafygreen-ui/tokens": "^2.0.3"
   },
@@ -31,0 +31,0 @@ "devDependencies": {

src/index.ts

 export { default as Body } from './Body/Body';
+export type { BodyProps } from './Body/Body.types';
 export { default as Description } from './Description/Description';
+export type { DescriptionProps } from './Description/Description.types';
 export { default as Disclaimer } from './Disclaimer/Disclaimer';
+export type { DisclaimerProps } from './Disclaimer/Disclaimer.types';
 export { default as Error } from './Error/Error';
+export type { ErrorProps } from './Error/Error.types';
 export { default as H1 } from './H1/H1';
+export type { H1Props } from './H1/H1.types';
 export { default as H2 } from './H2/H2';
+export type { H2Props } from './H2/H2.types';
 export { default as H3 } from './H3/H3';
+export type { H3Props } from './H3/H3.types';
 export { default as InlineCode } from './InlineCode/InlineCode';
+export type { InlineCodeProps } from './InlineCode/InlineCode.types';
 export { default as InlineKeyCode } from './InlineKeyCode/InlineKeyCode';
+export type { InlineKeyCodeProps } from './InlineKeyCode/InlineKeyCode.types';
 export { default as Label } from './Label/Label';
 export { labelTypeScaleStyles } from './Label/Label.styles';
+export type { LabelProps } from './Label/Label.types';
 export { default as Link } from './Link/Link';
 export { anchorClassName } from './Link/Link.styles';
+export type { LinkProps } from './Link/Link.types';
 export { default as Overline } from './Overline/Overline';
@@ -15,0 +26,0 @@ export { bodyTypeScaleStyles } from './styles';

stories.js

@@ -1,1 +0,1 @@
-import e,{useState as n,useEffect as t,useMemo as a}from"react";import{css as r,cx as o}from"@leafygreen-ui/emotion";import l from"@leafygreen-ui/icon";import i from"@leafygreen-ui/inline-definition";import s,{useBaseFontSize as c,useDarkMode as d}from"@leafygreen-ui/leafygreen-provider";import{Theme as m,createUniqueClassName as h,getNodeTextContent as p,storybookArgTypes as f}from"@leafygreen-ui/lib";import{palette as u}from"@leafygreen-ui/palette";import{Polymorphic as g,usePolymorphic as y,InferredPolymorphic as b,useInferredPolymorphic as v,Polymorph as x}from"@leafygreen-ui/polymorphic";import{fontFamilies as E,typeScales as N,BaseFontSize as k,focusRing as w}from"@leafygreen-ui/tokens";import z from"prop-types";import F from"@leafygreen-ui/icon/dist/ArrowRight";import S from"@leafygreen-ui/icon/dist/OpenNewTab";function D(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function M(){return M=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e},M.apply(this,arguments)}function C(e,n){if(null==e)return{};var t,a,r=function(e,n){if(null==e)return{};var t,a,r={},o=Object.keys(e);for(a=0;a<o.length;a++)t=o[a],n.indexOf(t)>=0||(r[t]=e[t]);return r}(e,n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(a=0;a<o.length;a++)t=o[a],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(r[t]=e[t])}return r}function L(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function O(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==t)return;var a,r,o=[],l=!0,i=!1;try{for(t=t.call(e);!(l=(a=t.next()).done)&&(o.push(a.value),!n||o.length!==n);l=!0);}catch(e){i=!0,r=e}finally{try{l||null==t.return||t.return()}finally{if(i)throw r}}return o}(e,n)||function(e,n){if(!e)return;if("string"==typeof e)return B(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(e);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return B(e,n)}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function B(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,a=new Array(n);t<n;t++)a[t]=e[t];return a}var H,j,A,I,T,P,W,R,U,_,K,$,q,G,J,Q,V,X,Y,Z,ee,ne=r(H||(H=L(["\n  margin: unset;\n  font-family: ",";\n  color: ",";\n"])),E.default,u.black),te=(D(I={},k.Body1,r(j||(j=L(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.body1.fontSize,N.body1.lineHeight)),D(I,k.Body2,r(A||(A=L(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.body2.fontSize,N.body2.lineHeight)),I),ae=(D(W={},k.Body1,r(T||(T=L(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.code1.fontSize,N.code1.lineHeight)),D(W,k.Body2,r(P||(P=L(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.code2.fontSize,N.code2.lineHeight)),W),re=(D(_={},m.Light,r(R||(R=L(["\n    color: ",";\n  "])),u.black)),D(_,m.Dark,r(U||(U=L(["\n    color: ",";\n  "])),u.gray.light2)),_),oe=function(e){var n=c();return e?16===e?k.Body2:k.Body1:16===n?k.Body2:k.Body1},le=["baseFontSize","darkMode","className","weight","as"],ie={default:{regular:400,medium:500},strong:{regular:700,medium:700}},se=g((function(n){var t=n.baseFontSize,a=n.darkMode,l=n.className,i=n.weight,s=void 0===i?"regular":i,c=n.as,m=void 0===c?"p":c,h=C(n,le),p=d(a).theme,f=oe(t),u=y(m).Component,g=r(K||(K=L(["\n      font-weight: ",";\n      strong,\n      b {\n        font-weight: ",";\n      }\n    "])),ie.default[s],ie.strong[s]);return e.createElement(u,M({className:o(ne,te[f],re[p],g,l)},h))}));se.displayName="Body";var ce,de,me,he,pe=r($||($=L(["\n  font-family: ",";\n  font-weight: normal;\n  margin-top: 0;\n  margin-bottom: 0;\n"])),E.default),fe=(D(J={},m.Light,r(q||(q=L(["\n    color: ",";\n  "])),u.gray.dark1)),D(J,m.Dark,r(G||(G=L(["\n    color: ",";\n  "])),u.gray.light1)),J),ue=(D(X={},m.Light,r(Q||(Q=L(["\n    color: ",";\n  "])),u.gray.dark1)),D(X,m.Dark,r(V||(V=L(["\n    color: ",";\n  "])),u.gray.base)),X),ge=(D(ee={},k.Body1,r(Y||(Y=L(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.body1.fontSize,N.body1.lineHeight)),D(ee,k.Body2,r(Z||(Z=L(["\n    font-size: ","px;\n    line-height: 20px; // Hardcoding because it does not match body2 lineHeight\n  "])),N.body2.fontSize)),ee),ye=["baseFontSize","darkMode","disabled","children","className"],be=function(n){var t=n.baseFontSize,a=n.darkMode,r=n.disabled,l=void 0!==r&&r,i=n.children,s=n.className,c=C(n,ye),m=d(a).theme,h=oe(t);return e.createElement("p",M({className:o(pe,fe[m],ge[h],D({},ue[m],l),s)},c),i)};be.displayName="Description";var ve,xe,Ee,Ne,ke=(D(me={},m.Light,r(ce||(ce=L(["\n    color: ",";\n  "])),u.gray.dark1)),D(me,m.Dark,r(de||(de=L(["\n    color: ",";\n  "])),u.gray.light1)),me),we=r(he||(he=L(["\n  display: block;\n  font-size: 11px;\n  line-height: 16px;\n  letter-spacing: 0.2px;\n"]))),ze=["darkMode","children","className"];function Fe(n){var t=n.darkMode,a=n.children,r=n.className,l=C(n,ze),i=d(t).theme;return e.createElement("small",M({},l,{className:o(ne,we,ke[i],r)}),a)}Fe.displayName="Disclaimer";var Se,De,Me,Ce,Le,Oe,Be,He,je=r(ve||(ve=L(["\n  font-family: ",";\n  font-weight: normal;\n  font-size: inherit;\n  line-height: inherit;\n\n  // Unsets browser default margins\n  margin-block-start: 0;\n  margin-block-end: 0;\n"])),E.default),Ae=(D(Ne={},m.Light,r(xe||(xe=L(["\n    color: ",";\n  "])),u.red.base)),D(Ne,m.Dark,r(Ee||(Ee=L(["\n    color: ",";\n  "])),u.red.light1)),Ne),Ie=["as","darkMode","children","className"],Te=g((function(n){var t=n.as,a=void 0===t?"p":t,r=n.darkMode,l=n.children,i=n.className,s=C(n,Ie),c=d(r).theme,m=y(a).Component;return e.createElement(m,M({},s,{className:o(je,Ae[c],i)}),l)})),Pe=r(Se||(Se=L(["\n  font-weight: 400;\n  font-size: 48px;\n  line-height: 62px;\n  font-family: ",";\n"])),E.serif),We=(D(Ce={},m.Light,r(De||(De=L(["\n    color: ",";\n  "])),u.green.dark2)),D(Ce,m.Dark,r(Me||(Me=L(["\n    color: ",";\n  "])),u.green.light1)),Ce),Re=["darkMode","className","as"],Ue=g((function(n){var t=n.darkMode,a=n.className,r=n.as,l=void 0===r?"h1":r,i=C(n,Re),s=d(t).theme,c=y(l).Component;return e.createElement(c,M({className:o(ne,Pe,We[s],a)},i))}));Ue.displayName="H1";var _e,Ke=r(Le||(Le=L(["\n  font-size: 32px;\n  line-height: 40px;\n  font-weight: 400;\n  font-family: ",";\n"])),E.serif),$e=(D(He={},m.Light,r(Oe||(Oe=L(["\n    color: ",";\n  "])),u.green.dark2)),D(He,m.Dark,r(Be||(Be=L(["\n    color: ",";\n  "])),u.green.light1)),He),qe=["darkMode","className","as"],Ge=g((function(n){var t=n.darkMode,a=n.className,r=n.as,l=void 0===r?"h2":r,i=C(n,qe),s=d(t).theme,c=y(l).Component;return e.createElement(c,M({className:o(ne,Ke,$e[s],a)},i))}));Ge.displayName="H2";var Je,Qe,Ve,Xe,Ye,Ze,en,nn,tn,an,rn,on,ln,sn=r(_e||(_e=L(["\n  font-size: 24px;\n  line-height: 32px;\n  font-weight: 500;\n"]))),cn=["darkMode","className","as"],dn=g((function(n){var t=n.darkMode,a=n.className,r=n.as,l=void 0===r?"h3":r,i=C(n,cn),s=d(t).theme,c=y(l).Component;return e.createElement(c,M({className:o(ne,sn,re[s],a)},i))}));dn.displayName="H3";var mn,hn,pn,fn,un=h(),gn=r(Je||(Je=L(["\n  display: inline;\n  transition: all 0.15s ease-in-out;\n  border-radius: 3px;\n  font-family: ",";\n  line-height: 20px;\n\n  .",":hover > & {\n    text-decoration: none;\n  }\n"])),E.code,un),yn=(D(Xe={},m.Light,r(Qe||(Qe=L(["\n    background-color: ",";\n    border: 1px solid ",";\n    color: ",";\n\n    .",":hover > & {\n      box-shadow: 0 0 0 3px ",";\n      border: 1px solid ",";\n    }\n  "])),u.gray.light3,u.gray.light2,u.gray.dark3,un,u.gray.light2,u.gray.light1)),D(Xe,m.Dark,r(Ve||(Ve=L(["\n    background-color: transparent;\n    border: 1px solid ",";\n    color: ",";\n\n    .",":hover > & {\n      box-shadow: 0 0 0 3px ",";\n      border: 1px solid ",";\n    }\n  "])),u.gray.dark2,u.gray.light1,un,u.gray.dark2,u.gray.dark1)),Xe),bn=(D(en={},m.Light,r(Ye||(Ye=L(["\n    .",":focus-visible > & {\n      box-shadow: ",";\n      border: 1px solid ",";\n    }\n  "])),un,w[m.Light].default,u.blue.base)),D(en,m.Dark,r(Ze||(Ze=L(["\n    .",":focus-visible > & {\n      box-shadow: ",";\n      border: 1px solid ",";\n    }\n  "])),un,w[m.Dark].default,u.blue.base)),en),vn=(D(an={},m.Light,r(nn||(nn=L(["\n    color: ",";\n  "])),u.blue.base)),D(an,m.Dark,r(tn||(tn=L(["\n    color: ",";\n  "])),u.blue.light1)),an),xn=r(rn||(rn=L(["\n  text-decoration: none;\n  margin: 0;\n  padding: 0;\n  line-height: 20px;\n\n  &:focus {\n    outline: none;\n  }\n"]))),En=r(on||(on=L(["\n  white-space: nowrap;\n"]))),Nn=r(ln||(ln=L(["\n  white-space: normal;\n"]))),kn=["children","className","darkMode","baseFontSize","as"],wn=b((function(n,t){var a,r,l=n.children,i=n.className,s=n.darkMode,c=n.baseFontSize,m=n.as,h=C(n,kn),p=d(s).theme,f=oe(c),u=v(m,h,"code").Component,g=(null!==(a="string"==typeof l&&(null===(r=l.match(/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])/g))||void 0===r?void 0:r.length))&&void 0!==a?a:0)<=30?En:Nn,y="code"!==u,b=e.createElement("code",{ref:t,className:o(ae[f],gn,yn[p],bn[p],g,D({},vn[p],y),i)},l);return y?e.createElement(u,M({className:o(un,xn,i)},h),b):e.cloneElement(b,h)}));wn.displayName="InlineCode",wn.propTypes={children:z.node,className:z.string,darkMode:z.bool,baseFontSize:z.oneOf(Object.values(k))};var zn,Fn,Sn,Dn,Mn,Cn,Ln,On,Bn,Hn,jn=r(mn||(mn=L(["\n  font-family: ",";\n  border: 1px solid;\n  border-radius: 3px;\n  padding-left: 5px;\n  padding-right: 5px;\n"])),E.code),An=(D(fn={},m.Light,r(hn||(hn=L(["\n    color: ",";\n    border-color: ",";\n    background-color: ",";\n  "])),u.black,u.gray.dark3,u.white)),D(fn,m.Dark,r(pn||(pn=L(["\n    color: ",";\n    border-color: ",";\n    background-color: ",";\n  "])),u.gray.light2,u.gray.base,u.gray.dark3)),fn),In=["baseFontSize","darkMode","children","className"];function Tn(n){var t=n.baseFontSize,a=n.darkMode,r=n.children,l=n.className,i=C(n,In),s=oe(t),c=d(a).theme;return e.createElement("code",M({className:o(jn,An[c],ae[s],l)},i),r)}Tn.displayName="InlineKeyCode";var Pn,Wn,Rn,Un,_n,Kn,$n,qn,Gn,Jn,Qn,Vn,Xn=r(zn||(zn=L(["\n  font-family: ",";\n  font-weight: bold;\n"])),E.default),Yn=(D(Dn={},m.Light,r(Fn||(Fn=L(["\n    color: ",";\n  "])),u.black)),D(Dn,m.Dark,r(Sn||(Sn=L(["\n    color: ",";\n  "])),u.gray.light2)),Dn),Zn=(D(Ln={},m.Light,r(Mn||(Mn=L(["\n    color: ",";\n  "])),u.gray.dark1)),D(Ln,m.Dark,r(Cn||(Cn=L(["\n    color: ",";\n  "])),u.gray.base)),Ln),et=(D(Hn={},k.Body1,r(On||(On=L(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.body1.fontSize,N.body1.lineHeight)),D(Hn,k.Body2,r(Bn||(Bn=L(["\n    font-size: ","px;\n    line-height: 20px; // Hardcoding because it does not match body2 lineHeight\n  "])),N.body2.fontSize)),Hn),nt=["baseFontSize","darkMode","className","children","disabled","as"],tt=g((function(n){var t=n.baseFontSize,a=n.darkMode,r=n.className,l=n.children,i=n.disabled,s=void 0!==i&&i,c=n.as,m=void 0===c?"label":c,h=C(n,nt),p=d(a).theme,f=oe(t),u=y(m).Component;return e.createElement(u,M({className:o(Xn,Yn[p],et[f],D({},Zn[p],s),r)},h),l)}));tt.displayName="Label";var at,rt,ot=h(),lt=r(Pn||(Pn=L(["\n  &:hover,\n  &:focus,\n  &:visited {\n    text-decoration: none;\n  }\n"]))),it=r(Wn||(Wn=L(["\n  font-family: ",";\n  display: inline-flex;\n  align-items: center;\n  text-decoration: none;\n  cursor: pointer;\n  line-height: 13px;\n\n  &:focus {\n    outline: none;\n  }\n"])),E.default),st=(D(_n={},m.Light,r(Rn||(Rn=L(["\n    color: ",";\n    font-weight: 400;\n  "])),u.blue.base)),D(_n,m.Dark,r(Un||(Un=L(["\n    color: ",";\n    font-weight: 700;\n  "])),u.blue.light1)),_n),ct=r(Kn||(Kn=L(["\n  position: relative;\n  &::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 2px;\n    bottom: -4px;\n    left: 0;\n    border-radius: 2px;\n  }\n\n  .",":focus & {\n    &::after {\n      background-color: ",";\n    }\n  }\n"])),ot,u.blue.light1),dt=(D(Gn={},m.Light,r($n||($n=L(["\n    .",":hover & {\n      &::after {\n        background-color: ",";\n      }\n    }\n  "])),ot,u.gray.light2)),D(Gn,m.Dark,r(qn||(qn=L(["\n    .",":hover & {\n      &::after {\n        background-color: ",";\n      }\n    }\n  "])),ot,u.gray.dark2)),Gn),mt=r(Jn||(Jn=L(["\n  transform: translate3d(3px, 0, 0);\n"]))),ht=r(Qn||(Qn=L(["\n  opacity: 0;\n  transform: translate3d(-3px, 0, 0);\n  transition: all 100ms ease-in;\n\n  .",":hover & {\n    opacity: 1;\n    transform: translate3d(3px, 0, 0);\n  }\n"])),ot),pt=r(Vn||(Vn=L(["\n  position: relative;\n  bottom: 4px;\n  left: -1px;\n  height: 12px;\n"]))),ft="hover",ut="persist",gt="none",yt=["children","className","arrowAppearance","hideExternalIcon","baseFontSize","darkMode","as"],bt=b((function(r){var l=r.children,i=r.className,s=r.arrowAppearance,c=void 0===s?gt:s,m=r.hideExternalIcon,h=void 0!==m&&m,p=r.baseFontSize,f=r.darkMode,u=r.as,g=C(r,yt),y=O(n(""),2),b=y[0],x=y[1];t((function(){x(window.location.hostname)}),[]);var E,N=d(f).theme,k=oe(p),w=v(u,g,"span").Component,z=a((function(){if(void 0!==g.href){return/^http(s)?:\/\//.test(g.href)?new URL(g.href).hostname:b}}),[g,b]),L={target:void 0,rel:void 0};if(g.target||g.rel?(L.target=g.target,L.rel=g.rel):"a"===w&&(z===b?L.target="_self":(L.target="_blank",L.rel="noopener noreferrer")),"_blank"!==L.target||h){if(c!==gt){var B;E=e.createElement(F,{role:"presentation",size:12,className:o((B={},D(B,ht,c===ft),D(B,mt,c===ut),B))})}}else E=e.createElement(S,{role:"presentation",className:pt});return e.createElement(w,M({className:o(ot,lt,te[k],it,st[N],i)},L,g),e.createElement("span",{className:o(ct,dt[N])},l),E)})),vt=r(at||(at=L(["\n  font-size: 12px;\n  font-weight: 700;\n  text-transform: uppercase;\n  line-height: 20px;\n  letter-spacing: 0.4px;\n"]))),xt=["darkMode","className","as"],Et=g((function(n){var t=n.darkMode,a=n.className,r=n.as,l=void 0===r?"div":r,i=C(n,xt),s=d(t).theme,c=y(l).Component;return e.createElement(c,M({className:o(ne,vt,re[s],a)},i))}));Et.displayName="Overline";var Nt=r(rt||(rt=L(["\n  font-size: 18px;\n  line-height: 24px;\n  font-weight: 700;\n"]))),kt=["darkMode","className","as"],wt=g((function(n){var t=n.darkMode,a=n.className,r=n.as,l=void 0===r?"h6":r,i=C(n,kt),s=d(t).theme,c=y(l).Component;return e.createElement(c,M({className:o(ne,Nt,re[s],a)},i))}));wt.displayName="Subtitle";var zt,Ft,St,Dt,Mt,Ct,Lt,Ot,Bt,Ht,jt,At,It,Tt=["as","children","maxFontWeight","pseudoElement","className"],Pt=function(e){var n=e.pseudoElement,t=e.maxFontWeight,a="&:".concat(n);return r(zt||(zt=L(["\n    /* Inherit relevant properties from the parent */\n    font-weight: inherit;\n    font-size: inherit;\n\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    position: relative;\n    display: inline-flex;\n    flex-direction: column;\n    align-items: flex-start;\n    justify-content: center;\n    text-decoration: none;\n    min-width: 0;\n    max-width: 100%;\n\n    "," {\n      content: attr(data-text);\n      height: 0;\n      font-weight: ",";\n      visibility: hidden;\n      overflow: hidden;\n      user-select: none;\n      pointer-events: none;\n    }\n  "])),a,t)},Wt=r(Ft||(Ft=L(["\n  flex: 1;\n  min-width: 0;\n  max-width: 100%;\n\n  white-space: inherit;\n  overflow: inherit;\n  text-overflow: inherit;\n"])));function Rt(n){var t=n.as,a=n.children,r=n.maxFontWeight,l=void 0===r?700:r,i=n.pseudoElement,s=void 0===i?"after":i,c=n.className,d=C(n,Tt),m=p(a);return e.createElement(x,M({className:o(Pt({pseudoElement:s,maxFontWeight:l}),c),as:null!=t?t:"span","data-text":m},d),e.createElement("span",{className:Wt},a))}var Ut=r(St||(St=L(["\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  gap: 10px;\n"]))),_t=r(Dt||(Dt=L(["\n  display: block;\n"]))),Kt=r(Mt||(Mt=L(["\n  display: flex;\n  gap: 8px;\n"]))),$t={title:"Components/Typography",parameters:{controls:{exclude:["className"]}},argTypes:{baseFontSize:{options:[14,16],control:{type:"radio"},description:"Storybook prop only. This font size is passed into the LeafygreenProvider."},darkMode:f.darkMode}},qt=function(n){var t=n.baseFontSize,a=n.darkMode;return e.createElement(s,{baseFontSize:t,darkMode:a},e.createElement("div",{className:o(Ut)},e.createElement(Ue,null,"Heading 1"),e.createElement(Ge,null,"Heading 2"),e.createElement(dn,null,"Heading 3"),e.createElement(wt,null,"Subtitle"),e.createElement("div",{className:o(Kt)},e.createElement(se,null,"Body"),e.createElement(se,null,e.createElement("strong",null,"Body (Semibold)"))),e.createElement("div",{className:o(Kt)},e.createElement(se,null,e.createElement("em",null,"Body (Italic)")),e.createElement(se,null,e.createElement("strong",null,e.createElement("em",null,"Body (Semibold Italic)")))),e.createElement("div",{className:o(Kt)},e.createElement(wn,null,'"Inline Code"'),e.createElement(wn,{href:"https://mongodb.github.io/leafygreen-ui/?path=/story/*"},'"Inline Code Link"')),e.createElement("div",{className:o(Kt)},e.createElement(bt,{href:"http://localhost:9001",arrowAppearance:"hover"},"Local (Arrow on Hover)"),e.createElement(bt,{href:"http://localhost:9001",arrowAppearance:"none"},"Local (No Arrow)"),e.createElement(bt,{href:"?path=/story/button--icon-only",arrowAppearance:"persist"},"Internal (Persist Arrow)"),e.createElement(bt,{href:"https://mongodb.github.io/leafygreen-ui/?path=/story/*"},"External")),e.createElement("div",{className:_t},e.createElement(Tn,null,"CTRL"),e.createElement("code",null," + "),e.createElement(Tn,null,"C")),e.createElement(Et,{className:_t},"Overline"),e.createElement(Fe,{className:_t},"Disclaimer"),e.createElement("div",{className:r(Ct||(Ct=L(["\n            color: ",";\n          "])),a?u.gray.light2:u.black)},e.createElement(i,{definition:"Tooltip Definition"},"Inline definition")),e.createElement(Te,null,"Hello I am an Error!"),e.createElement("div",{className:o(_t)},e.createElement(tt,{htmlFor:"id"},"This is a label"),e.createElement(be,null,"This is the description for said label"))))},Gt=function(){var n=r(Lt||(Lt=L(["\n    font-weight: 400;\n    cursor: pointer;\n    outline: 1px solid ",";\n    outline-offset: -1px;\n\n    &:hover {\n      font-weight: 700;\n    }\n  "])),u.red.light2),t=r(Ot||(Ot=L(["\n    outline: 1px solid ",";\n    padding: 10px;\n    width: max-content;\n    max-width: 200px;\n  "])),u.blue.light1),a=r(Bt||(Bt=L(["\n    outline: 1px solid gray;\n    padding: 10px;\n    width: max-content;\n    max-width: 148px;\n    display: flex;\n    align-items: center;\n  "])));return e.createElement("div",{className:r(Ht||(Ht=L(["\n        position: absolute;\n        top: 0;\n        left: 0;\n        margin: 20px;\n      "])))},e.createElement("div",{className:r(jt||(jt=L(["\n          display: flex;\n        "])))},e.createElement("div",{className:t},e.createElement(Rt,{className:n},"Some Tabs")),e.createElement("div",{className:t},e.createElement(Rt,{className:o(n,r(At||(At=L(["\n                flex: 1;\n              "]))))},"Some long text that will be truncated eventually because its long")),e.createElement("div",{className:t},e.createElement(Rt,{className:n},"Some more text"))),e.createElement("br",null),e.createElement("div",{className:o(n,a)},e.createElement(Rt,null,"Some button"),e.createElement(l,{glyph:"CaretDown"})),e.createElement("br",null),e.createElement("div",{className:o(n,a)},e.createElement(Rt,{className:o(r(It||(It=L(["\n              flex: 1;\n            "]))))},"Some long text button that should be truncated"),e.createElement(l,{glyph:"CaretDown"})))};export{qt as AllTypography,Gt as StaticWidthTextStory,$t as default};
+import e,{useState as n,useEffect as t,useMemo as r}from"react";import{css as a,cx as o}from"@leafygreen-ui/emotion";import l from"@leafygreen-ui/icon";import i from"@leafygreen-ui/inline-definition";import s,{useBaseFontSize as c,useDarkMode as d}from"@leafygreen-ui/leafygreen-provider";import{Theme as m,createUniqueClassName as h,getNodeTextContent as p,StoryMeta as f,storybookArgTypes as u}from"@leafygreen-ui/lib";import{palette as g}from"@leafygreen-ui/palette";import{Polymorphic as y,usePolymorphic as b,InferredPolymorphic as v,useInferredPolymorphic as x,Polymorph as E}from"@leafygreen-ui/polymorphic";import{fontFamilies as k,typeScales as N,BaseFontSize as w,focusRing as z}from"@leafygreen-ui/tokens";import S from"prop-types";import F from"@leafygreen-ui/icon/dist/ArrowRight";import D from"@leafygreen-ui/icon/dist/OpenNewTab";function O(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function M(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?O(Object(t),!0).forEach((function(n){j(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):O(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function j(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function C(){return C=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},C.apply(this,arguments)}function L(e,n){if(null==e)return{};var t,r,a=function(e,n){if(null==e)return{};var t,r,a={},o=Object.keys(e);for(r=0;r<o.length;r++)t=o[r],n.indexOf(t)>=0||(a[t]=e[t]);return a}(e,n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(r=0;r<o.length;r++)t=o[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}function B(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}function H(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==t)return;var r,a,o=[],l=!0,i=!1;try{for(t=t.call(e);!(l=(r=t.next()).done)&&(o.push(r.value),!n||o.length!==n);l=!0);}catch(e){i=!0,a=e}finally{try{l||null==t.return||t.return()}finally{if(i)throw a}}return o}(e,n)||function(e,n){if(!e)return;if("string"==typeof e)return A(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(e);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return A(e,n)}(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function A(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}var I,P,T,W,R,U,_,K,$,q,G,J,Q,V,X,Y,Z,ee,ne,te,re,ae=a(I||(I=B(["\n  margin: unset;\n  font-family: ",";\n  color: ",";\n"])),k.default,g.black),oe=(j(W={},w.Body1,a(P||(P=B(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.body1.fontSize,N.body1.lineHeight)),j(W,w.Body2,a(T||(T=B(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.body2.fontSize,N.body2.lineHeight)),W),le=(j(_={},w.Body1,a(R||(R=B(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.code1.fontSize,N.code1.lineHeight)),j(_,w.Body2,a(U||(U=B(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.code2.fontSize,N.code2.lineHeight)),_),ie=(j(q={},m.Light,a(K||(K=B(["\n    color: ",";\n  "])),g.black)),j(q,m.Dark,a($||($=B(["\n    color: ",";\n  "])),g.gray.light2)),q),se=function(e){var n=c();return e?16===e?w.Body2:w.Body1:16===n?w.Body2:w.Body1},ce=["baseFontSize","darkMode","className","weight","as"],de={default:{regular:400,medium:500},strong:{regular:700,medium:700}},me=y((function(n){var t=n.baseFontSize,r=n.darkMode,l=n.className,i=n.weight,s=void 0===i?"regular":i,c=n.as,m=void 0===c?"p":c,h=L(n,ce),p=d(r).theme,f=se(t),u=b(m).Component,g=a(G||(G=B(["\n      font-weight: ",";\n      strong,\n      b {\n        font-weight: ",";\n      }\n    "])),de.default[s],de.strong[s]);return e.createElement(u,C({className:o(ae,oe[f],ie[p],g,l)},h))}));me.displayName="Body";var he,pe,fe,ue,ge=a(J||(J=B(["\n  font-family: ",";\n  font-weight: normal;\n  margin-top: 0;\n  margin-bottom: 0;\n"])),k.default),ye=(j(X={},m.Light,a(Q||(Q=B(["\n    color: ",";\n  "])),g.gray.dark1)),j(X,m.Dark,a(V||(V=B(["\n    color: ",";\n  "])),g.gray.light1)),X),be=(j(ee={},m.Light,a(Y||(Y=B(["\n    color: ",";\n  "])),g.gray.dark1)),j(ee,m.Dark,a(Z||(Z=B(["\n    color: ",";\n  "])),g.gray.base)),ee),ve=(j(re={},w.Body1,a(ne||(ne=B(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.body1.fontSize,N.body1.lineHeight)),j(re,w.Body2,a(te||(te=B(["\n    font-size: ","px;\n    line-height: 20px; // Hardcoding because it does not match body2 lineHeight\n  "])),N.body2.fontSize)),re),xe=["baseFontSize","darkMode","disabled","children","className"],Ee=function(n){var t=n.baseFontSize,r=n.darkMode,a=n.disabled,l=void 0!==a&&a,i=n.children,s=n.className,c=L(n,xe),m=d(r).theme,h=se(t);return e.createElement("p",C({className:o(ge,ye[m],ve[h],j({},be[m],l),s)},c),i)};Ee.displayName="Description";var ke,Ne,we,ze,Se=(j(fe={},m.Light,a(he||(he=B(["\n    color: ",";\n  "])),g.gray.dark1)),j(fe,m.Dark,a(pe||(pe=B(["\n    color: ",";\n  "])),g.gray.light1)),fe),Fe=a(ue||(ue=B(["\n  display: block;\n  font-size: 11px;\n  line-height: 16px;\n  letter-spacing: 0.2px;\n"]))),De=["darkMode","children","className"];function Oe(n){var t=n.darkMode,r=n.children,a=n.className,l=L(n,De),i=d(t).theme;return e.createElement("small",C({},l,{className:o(ae,Fe,Se[i],a)}),r)}Oe.displayName="Disclaimer";var Me,je,Ce,Le,Be,He,Ae,Ie,Pe=a(ke||(ke=B(["\n  font-family: ",";\n  font-weight: normal;\n  font-size: inherit;\n  line-height: inherit;\n\n  // Unsets browser default margins\n  margin-block-start: 0;\n  margin-block-end: 0;\n"])),k.default),Te=(j(ze={},m.Light,a(Ne||(Ne=B(["\n    color: ",";\n  "])),g.red.base)),j(ze,m.Dark,a(we||(we=B(["\n    color: ",";\n  "])),g.red.light1)),ze),We=["as","darkMode","children","className"],Re=y((function(n){var t=n.as,r=void 0===t?"p":t,a=n.darkMode,l=n.children,i=n.className,s=L(n,We),c=d(a).theme,m=b(r).Component;return e.createElement(m,C({},s,{className:o(Pe,Te[c],i)}),l)})),Ue=a(Me||(Me=B(["\n  font-weight: 400;\n  font-size: 48px;\n  line-height: 62px;\n  font-family: ",";\n"])),k.serif),_e=(j(Le={},m.Light,a(je||(je=B(["\n    color: ",";\n  "])),g.green.dark2)),j(Le,m.Dark,a(Ce||(Ce=B(["\n    color: ",";\n  "])),g.green.light1)),Le),Ke=["darkMode","className","as"],$e=y((function(n){var t=n.darkMode,r=n.className,a=n.as,l=void 0===a?"h1":a,i=L(n,Ke),s=d(t).theme,c=b(l).Component;return e.createElement(c,C({className:o(ae,Ue,_e[s],r)},i))}));$e.displayName="H1";var qe,Ge=a(Be||(Be=B(["\n  font-size: 32px;\n  line-height: 40px;\n  font-weight: 400;\n  font-family: ",";\n"])),k.serif),Je=(j(Ie={},m.Light,a(He||(He=B(["\n    color: ",";\n  "])),g.green.dark2)),j(Ie,m.Dark,a(Ae||(Ae=B(["\n    color: ",";\n  "])),g.green.light1)),Ie),Qe=["darkMode","className","as"],Ve=y((function(n){var t=n.darkMode,r=n.className,a=n.as,l=void 0===a?"h2":a,i=L(n,Qe),s=d(t).theme,c=b(l).Component;return e.createElement(c,C({className:o(ae,Ge,Je[s],r)},i))}));Ve.displayName="H2";var Xe,Ye,Ze,en,nn,tn,rn,an,on,ln,sn,cn,dn,mn=a(qe||(qe=B(["\n  font-size: 24px;\n  line-height: 32px;\n  font-weight: 500;\n"]))),hn=["darkMode","className","as"],pn=y((function(n){var t=n.darkMode,r=n.className,a=n.as,l=void 0===a?"h3":a,i=L(n,hn),s=d(t).theme,c=b(l).Component;return e.createElement(c,C({className:o(ae,mn,ie[s],r)},i))}));pn.displayName="H3";var fn,un,gn,yn,bn=h(),vn=a(Xe||(Xe=B(["\n  display: inline;\n  transition: all 0.15s ease-in-out;\n  border-radius: 3px;\n  font-family: ",";\n  line-height: 20px;\n\n  .",":hover > & {\n    text-decoration: none;\n  }\n"])),k.code,bn),xn=(j(en={},m.Light,a(Ye||(Ye=B(["\n    background-color: ",";\n    border: 1px solid ",";\n    color: ",";\n\n    .",":hover > & {\n      box-shadow: 0 0 0 3px ",";\n      border: 1px solid ",";\n    }\n  "])),g.gray.light3,g.gray.light2,g.gray.dark3,bn,g.gray.light2,g.gray.light1)),j(en,m.Dark,a(Ze||(Ze=B(["\n    background-color: transparent;\n    border: 1px solid ",";\n    color: ",";\n\n    .",":hover > & {\n      box-shadow: 0 0 0 3px ",";\n      border: 1px solid ",";\n    }\n  "])),g.gray.dark2,g.gray.light1,bn,g.gray.dark2,g.gray.dark1)),en),En=(j(rn={},m.Light,a(nn||(nn=B(["\n    .",":focus-visible > & {\n      box-shadow: ",";\n      border: 1px solid ",";\n    }\n  "])),bn,z[m.Light].default,g.blue.base)),j(rn,m.Dark,a(tn||(tn=B(["\n    .",":focus-visible > & {\n      box-shadow: ",";\n      border: 1px solid ",";\n    }\n  "])),bn,z[m.Dark].default,g.blue.base)),rn),kn=(j(ln={},m.Light,a(an||(an=B(["\n    color: ",";\n  "])),g.blue.base)),j(ln,m.Dark,a(on||(on=B(["\n    color: ",";\n  "])),g.blue.light1)),ln),Nn=a(sn||(sn=B(["\n  text-decoration: none;\n  margin: 0;\n  padding: 0;\n  line-height: 20px;\n\n  &:focus {\n    outline: none;\n  }\n"]))),wn=a(cn||(cn=B(["\n  white-space: nowrap;\n"]))),zn=a(dn||(dn=B(["\n  white-space: normal;\n"]))),Sn=["children","className","darkMode","baseFontSize","as"],Fn=v((function(n,t){var r,a,l=n.children,i=n.className,s=n.darkMode,c=n.baseFontSize,m=n.as,h=L(n,Sn),p=d(s).theme,f=se(c),u=x(m,h,"code").Component,g=(null!==(r="string"==typeof l&&(null===(a=l.match(/(?:[\0-\t\x0B\f\x0E-\u2027\u202A-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])/g))||void 0===a?void 0:a.length))&&void 0!==r?r:0)<=30?wn:zn,y="code"!==u,b=e.createElement("code",{ref:t,className:o(le[f],vn,xn[p],En[p],g,j({},kn[p],y),i)},l);return y?e.createElement(u,C({className:o(bn,Nn,i)},h),b):e.cloneElement(b,h)}));Fn.displayName="InlineCode",Fn.propTypes={children:S.node,className:S.string,darkMode:S.bool,baseFontSize:S.oneOf(Object.values(w))};var Dn,On,Mn,jn,Cn,Ln,Bn,Hn,An,In,Pn=a(fn||(fn=B(["\n  font-family: ",";\n  border: 1px solid;\n  border-radius: 3px;\n  padding-left: 5px;\n  padding-right: 5px;\n"])),k.code),Tn=(j(yn={},m.Light,a(un||(un=B(["\n    color: ",";\n    border-color: ",";\n    background-color: ",";\n  "])),g.black,g.gray.dark3,g.white)),j(yn,m.Dark,a(gn||(gn=B(["\n    color: ",";\n    border-color: ",";\n    background-color: ",";\n  "])),g.gray.light2,g.gray.base,g.gray.dark3)),yn),Wn=["baseFontSize","darkMode","children","className"];function Rn(n){var t=n.baseFontSize,r=n.darkMode,a=n.children,l=n.className,i=L(n,Wn),s=se(t),c=d(r).theme;return e.createElement("code",C({className:o(Pn,Tn[c],le[s],l)},i),a)}Rn.displayName="InlineKeyCode";var Un,_n,Kn,$n,qn,Gn,Jn,Qn,Vn,Xn,Yn,Zn,et=a(Dn||(Dn=B(["\n  font-family: ",";\n  font-weight: bold;\n"])),k.default),nt=(j(jn={},m.Light,a(On||(On=B(["\n    color: ",";\n  "])),g.black)),j(jn,m.Dark,a(Mn||(Mn=B(["\n    color: ",";\n  "])),g.gray.light2)),jn),tt=(j(Bn={},m.Light,a(Cn||(Cn=B(["\n    color: ",";\n  "])),g.gray.dark1)),j(Bn,m.Dark,a(Ln||(Ln=B(["\n    color: ",";\n  "])),g.gray.base)),Bn),rt=(j(In={},w.Body1,a(Hn||(Hn=B(["\n    font-size: ","px;\n    line-height: ","px;\n  "])),N.body1.fontSize,N.body1.lineHeight)),j(In,w.Body2,a(An||(An=B(["\n    font-size: ","px;\n    line-height: 20px; // Hardcoding because it does not match body2 lineHeight\n  "])),N.body2.fontSize)),In),at=["baseFontSize","darkMode","className","children","disabled","as"],ot=y((function(n){var t=n.baseFontSize,r=n.darkMode,a=n.className,l=n.children,i=n.disabled,s=void 0!==i&&i,c=n.as,m=void 0===c?"label":c,h=L(n,at),p=d(r).theme,f=se(t),u=b(m).Component;return e.createElement(u,C({className:o(et,nt[p],rt[f],j({},tt[p],s),a)},h),l)}));ot.displayName="Label";var lt,it,st=h(),ct=a(Un||(Un=B(["\n  &:hover,\n  &:focus,\n  &:visited {\n    text-decoration: none;\n  }\n"]))),dt=a(_n||(_n=B(["\n  font-family: ",";\n  display: inline-flex;\n  align-items: center;\n  text-decoration: none;\n  cursor: pointer;\n  line-height: 13px;\n\n  &:focus {\n    outline: none;\n  }\n"])),k.default),mt=(j(qn={},m.Light,a(Kn||(Kn=B(["\n    color: ",";\n    font-weight: 400;\n  "])),g.blue.base)),j(qn,m.Dark,a($n||($n=B(["\n    color: ",";\n    font-weight: 700;\n  "])),g.blue.light1)),qn),ht=a(Gn||(Gn=B(["\n  position: relative;\n  &::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 2px;\n    bottom: -4px;\n    left: 0;\n    border-radius: 2px;\n  }\n\n  .",":focus & {\n    &::after {\n      background-color: ",";\n    }\n  }\n"])),st,g.blue.light1),pt=(j(Vn={},m.Light,a(Jn||(Jn=B(["\n    .",":hover & {\n      &::after {\n        background-color: ",";\n      }\n    }\n  "])),st,g.gray.light2)),j(Vn,m.Dark,a(Qn||(Qn=B(["\n    .",":hover & {\n      &::after {\n        background-color: ",";\n      }\n    }\n  "])),st,g.gray.dark2)),Vn),ft=a(Xn||(Xn=B(["\n  transform: translate3d(3px, 0, 0);\n"]))),ut=a(Yn||(Yn=B(["\n  opacity: 0;\n  transform: translate3d(-3px, 0, 0);\n  transition: all 100ms ease-in;\n\n  .",":hover & {\n    opacity: 1;\n    transform: translate3d(3px, 0, 0);\n  }\n"])),st),gt=a(Zn||(Zn=B(["\n  position: relative;\n  bottom: 4px;\n  left: -1px;\n  height: 12px;\n"]))),yt="hover",bt="persist",vt="none",xt=["children","className","arrowAppearance","hideExternalIcon","baseFontSize","darkMode","as"],Et=v((function(a){var l=a.children,i=a.className,s=a.arrowAppearance,c=void 0===s?vt:s,m=a.hideExternalIcon,h=void 0!==m&&m,p=a.baseFontSize,f=a.darkMode,u=a.as,g=L(a,xt),y=H(n(""),2),b=y[0],v=y[1];t((function(){v(window.location.hostname)}),[]);var E,k=d(f).theme,N=se(p),w=x(u,g,"span").Component,z=r((function(){if(void 0!==g.href){return/^http(s)?:\/\//.test(g.href)?new URL(g.href).hostname:b}}),[g,b]),S={target:void 0,rel:void 0};if(g.target||g.rel?(S.target=g.target,S.rel=g.rel):"a"===w&&(z===b?S.target="_self":(S.target="_blank",S.rel="noopener noreferrer")),"_blank"!==S.target||h){if(c!==vt){var O;E=e.createElement(F,{role:"presentation",size:12,className:o((O={},j(O,ut,c===yt),j(O,ft,c===bt),O))})}}else E=e.createElement(D,{role:"presentation",className:gt});return e.createElement(w,C({className:o(st,ct,oe[N],dt,mt[k],i)},S,g),e.createElement("span",{className:o(ht,pt[k])},l),E)})),kt=a(lt||(lt=B(["\n  font-size: 12px;\n  font-weight: 700;\n  text-transform: uppercase;\n  line-height: 20px;\n  letter-spacing: 0.4px;\n"]))),Nt=["darkMode","className","as"],wt=y((function(n){var t=n.darkMode,r=n.className,a=n.as,l=void 0===a?"div":a,i=L(n,Nt),s=d(t).theme,c=b(l).Component;return e.createElement(c,C({className:o(ae,kt,ie[s],r)},i))}));wt.displayName="Overline";var zt=a(it||(it=B(["\n  font-size: 18px;\n  line-height: 24px;\n  font-weight: 700;\n"]))),St=["darkMode","className","as"],Ft=y((function(n){var t=n.darkMode,r=n.className,a=n.as,l=void 0===a?"h6":a,i=L(n,St),s=d(t).theme,c=b(l).Component;return e.createElement(c,C({className:o(ae,zt,ie[s],r)},i))}));Ft.displayName="Subtitle";var Dt,Ot,Mt,jt,Ct,Lt,Bt,Ht,At,It,Pt,Tt,Wt,Rt=["as","children","maxFontWeight","pseudoElement","className"],Ut=function(e){var n=e.pseudoElement,t=e.maxFontWeight,r="&:".concat(n);return a(Dt||(Dt=B(["\n    /* Inherit relevant properties from the parent */\n    font-weight: inherit;\n    font-size: inherit;\n\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    position: relative;\n    display: inline-flex;\n    flex-direction: column;\n    align-items: flex-start;\n    justify-content: center;\n    text-decoration: none;\n    min-width: 0;\n    max-width: 100%;\n\n    "," {\n      content: attr(data-text);\n      height: 0;\n      font-weight: ",";\n      visibility: hidden;\n      overflow: hidden;\n      user-select: none;\n      pointer-events: none;\n    }\n  "])),r,t)},_t=a(Ot||(Ot=B(["\n  flex: 1;\n  min-width: 0;\n  max-width: 100%;\n\n  white-space: inherit;\n  overflow: inherit;\n  text-overflow: inherit;\n"])));function Kt(n){var t=n.as,r=n.children,a=n.maxFontWeight,l=void 0===a?700:a,i=n.pseudoElement,s=void 0===i?"after":i,c=n.className,d=L(n,Rt),m=p(r);return e.createElement(E,C({className:o(Ut({pseudoElement:s,maxFontWeight:l}),c),as:null!=t?t:"span","data-text":m},d),e.createElement("span",{className:_t},r))}var $t=a(Mt||(Mt=B(["\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  gap: 10px;\n"]))),qt=a(jt||(jt=B(["\n  display: block;\n"]))),Gt=a(Ct||(Ct=B(["\n  display: flex;\n  gap: 8px;\n"]))),Jt=f({title:"Components/Typography",parameters:{default:"AllTypography",controls:{exclude:["className"]}}}),Qt=function(n){var t=n.baseFontSize,r=n.darkMode;return e.createElement(s,{baseFontSize:t,darkMode:r},e.createElement("div",{className:o($t)},e.createElement($e,null,"Heading 1"),e.createElement(Ve,null,"Heading 2"),e.createElement(pn,null,"Heading 3"),e.createElement(Ft,null,"Subtitle"),e.createElement("div",{className:o(Gt)},e.createElement(me,null,"Body"),e.createElement(me,null,e.createElement("strong",null,"Body (Semibold)"))),e.createElement("div",{className:o(Gt)},e.createElement(me,null,e.createElement("em",null,"Body (Italic)")),e.createElement(me,null,e.createElement("strong",null,e.createElement("em",null,"Body (Semibold Italic)")))),e.createElement("div",{className:o(Gt)},e.createElement(Fn,null,'"Inline Code"'),e.createElement(Fn,{href:"https://mongodb.github.io/leafygreen-ui/?path=/story/*"},'"Inline Code Link"')),e.createElement("div",{className:o(Gt)},e.createElement(Et,{href:"http://localhost:9001",arrowAppearance:"hover"},"Local (Arrow on Hover)"),e.createElement(Et,{href:"http://localhost:9001",arrowAppearance:"none"},"Local (No Arrow)"),e.createElement(Et,{href:"?path=/story/button--icon-only",arrowAppearance:"persist"},"Internal (Persist Arrow)"),e.createElement(Et,{href:"https://mongodb.github.io/leafygreen-ui/?path=/story/*"},"External")),e.createElement("div",{className:qt},e.createElement(Rn,null,"CTRL"),e.createElement("code",null," + "),e.createElement(Rn,null,"C")),e.createElement(wt,{className:qt},"Overline"),e.createElement(Oe,{className:qt},"Disclaimer"),e.createElement("div",{className:a(Lt||(Lt=B(["\n            color: ",";\n          "])),r?g.gray.light2:g.black)},e.createElement(i,{definition:"Tooltip Definition"},"Inline definition")),e.createElement(Re,null,"Hello I am an Error!"),e.createElement("div",{className:o(qt)},e.createElement(ot,{htmlFor:"id"},"This is a label"),e.createElement(Ee,null,"This is the description for said label"))))};Qt.argTypes={baseFontSize:M(M({},u.baseFontSize),{},{description:"Storybook prop only. This font size is passed into the LeafygreenProvider."}),darkMode:u.darkMode};var Vt=function(){var n=a(Bt||(Bt=B(["\n    font-weight: 400;\n    cursor: pointer;\n    outline: 1px solid ",";\n    outline-offset: -1px;\n\n    &:hover {\n      font-weight: 700;\n    }\n  "])),g.red.light2),t=a(Ht||(Ht=B(["\n    outline: 1px solid ",";\n    padding: 10px;\n    width: max-content;\n    max-width: 200px;\n  "])),g.blue.light1),r=a(At||(At=B(["\n    outline: 1px solid gray;\n    padding: 10px;\n    width: max-content;\n    max-width: 148px;\n    display: flex;\n    align-items: center;\n  "])));return e.createElement("div",{className:a(It||(It=B(["\n        position: absolute;\n        top: 0;\n        left: 0;\n        margin: 20px;\n      "])))},e.createElement("div",{className:a(Pt||(Pt=B(["\n          display: flex;\n        "])))},e.createElement("div",{className:t},e.createElement(Kt,{className:n},"Some Tabs")),e.createElement("div",{className:t},e.createElement(Kt,{className:o(n,a(Tt||(Tt=B(["\n                flex: 1;\n              "]))))},"Some long text that will be truncated eventually because its long")),e.createElement("div",{className:t},e.createElement(Kt,{className:n},"Some more text"))),e.createElement("br",null),e.createElement("div",{className:o(n,r)},e.createElement(Kt,null,"Some button"),e.createElement(l,{glyph:"CaretDown"})),e.createElement("br",null),e.createElement("div",{className:o(n,r)},e.createElement(Kt,{className:o(a(Wt||(Wt=B(["\n              flex: 1;\n            "]))))},"Some long text button that should be truncated"),e.createElement(l,{glyph:"CaretDown"})))};export{Qt as AllTypography,Vt as StaticWidthTextStory,Jt as default};

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

461508

increased by0.64%

Lines of code

7091

increased by0.34%

Dependency changes

• Updated@leafygreen-ui/lib@^10.3.3

• Updated@leafygreen-ui/palette@^4.0.4

• Updated@leafygreen-ui/tokens@^2.0.3