@brad-frost-web/eddie-web-components 0.6.0 → 0.8.0

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.
@@ -8,8 +8,9 @@ export declare class EdHeading extends EdElement {
8
8
  * Heading variant
9
9
  * <ed-text-passage size="sm">
10
10
  * <ul>
11
+ * <li>**display-xl** renders a heading with the heading display-xl preset treatment</li>
12
+ * <li>**display-lg** renders a heading with the heading display-lg preset treatment</li>
11
13
  * <li>**display-default** renders a heading with the heading display-default preset treatment</li>
12
- * <li>**display-sm** renders a heading with the heading display-sm preset treatment</li>
13
14
  * <li>**headline-lg** renders a heading with the heading headline-lg preset treatment</li>
14
15
  * <li>**headline** renders a heading wi dth the heading headline preset treatment</li>
15
16
  * <li>**headline-sm** renders a heading with the heading headline-sm preset treatment</li>
@@ -27,7 +28,7 @@ export declare class EdHeading extends EdElement {
27
28
  * </ul>
28
29
  * </ed-text-passage>
29
30
  */
30
- variant?: 'display-default' | 'display-sm' | 'headline-lg' | 'headline-default' | 'headline-sm' | 'title-lg' | 'title-default' | 'title-sm' | 'label-lg' | 'label-default' | 'label-sm' | 'body-lg' | 'body-default' | 'body-sm' | 'meta-default' | 'meta-sm';
31
+ variant?: 'display-xl' | 'display-lg' | 'display-xl' | 'display-default' | 'headline-lg' | 'headline-default' | 'headline-sm' | 'title-lg' | 'title-default' | 'title-sm' | 'label-lg' | 'label-default' | 'label-sm' | 'body-lg' | 'body-default' | 'body-sm' | 'meta-default' | 'meta-sm';
31
32
  /**
32
33
  * Dynamic tag name for the component
33
34
  * 1) This is needed to use proper semantic heading treatments depending on where the banner lives on the page
@@ -1 +1 @@
1
- {"version":3,"file":"heading.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/heading/heading.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAGtF;;GAEG;AACH,qBAAa,SAAU,SAAQ,SAAS;IACtC,MAAM,KAAK,MAAM,4BAEhB;IAED;;;;;;;;;;;;;;;;;;;;;;OAsBG;IAEH,OAAO,CAAC,EACJ,iBAAiB,GACjB,YAAY,GACZ,aAAa,GACb,kBAAkB,GAClB,aAAa,GACb,UAAU,GACV,eAAe,GACf,UAAU,GACV,UAAU,GACV,eAAe,GACf,UAAU,GACV,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,SAAS,CAAC;IAEd;;;;;;;;;;;;;OAaG;IAEH,OAAO,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAExD,MAAM;CAmCP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,SAAS,CAAC;KACzB;CACF"}
1
+ {"version":3,"file":"heading.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/heading/heading.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAGtF;;GAEG;AACH,qBAAa,SAAU,SAAQ,SAAS;IACtC,MAAM,KAAK,MAAM,4BAEhB;IAED;;;;;;;;;;;;;;;;;;;;;;;OAuBG;IAEH,OAAO,CAAC,EACJ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,iBAAiB,GACjB,aAAa,GACb,kBAAkB,GAClB,aAAa,GACb,UAAU,GACV,eAAe,GACf,UAAU,GACV,UAAU,GACV,eAAe,GACf,UAAU,GACV,SAAS,GACT,cAAc,GACd,SAAS,GACT,cAAc,GACd,SAAS,CAAC;IAEd;;;;;;;;;;;;;OAaG;IAEH,OAAO,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAExD,MAAM;CAoCP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,SAAS,CAAC;KACzB;CACF"}
@@ -1,23 +1,24 @@
1
- import { unsafeCSS as m, html as a } from "lit";
1
+ import { unsafeCSS as y, html as a } from "lit";
2
2
  import { property as n } from "lit/decorators.js";
3
- import { E as y } from "../EdElement.js";
4
- const g = '@charset "UTF-8";:root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6,.ed-c-heading{margin:0}.ed-c-heading--display-default{font-family:var(--ed-theme-typography-display-default-mobile-font-family);font-weight:var(--ed-theme-typography-display-default-mobile-font-weight);font-size:var(--ed-theme-typography-display-default-mobile-font-size);line-height:var(--ed-theme-typography-display-default-mobile-line-height);letter-spacing:var(--ed-theme-typography-display-default-mobile-letter-spacing);text-transform:var(--ed-theme-typography-display-default-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--display-default{font-family:var(--ed-theme-typography-display-default-font-family);font-weight:var(--ed-theme-typography-display-default-font-weight);font-size:var(--ed-theme-typography-display-default-font-size);line-height:var(--ed-theme-typography-display-default-line-height);letter-spacing:var(--ed-theme-typography-display-default-letter-spacing);text-transform:var(--ed-theme-typography-display-default-text-transform)}}.ed-c-heading--display-sm{font-family:var(--ed-theme-typography-display-sm-mobile-font-family);font-weight:var(--ed-theme-typography-display-sm-mobile-font-weight);font-size:var(--ed-theme-typography-display-sm-mobile-font-size);line-height:var(--ed-theme-typography-display-sm-mobile-line-height);letter-spacing:var(--ed-theme-typography-display-sm-mobile-letter-spacing);text-transform:var(--ed-theme-typography-display-sm-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--display-sm{font-family:var(--ed-theme-typography-display-sm-font-family);font-weight:var(--ed-theme-typography-display-sm-font-weight);font-size:var(--ed-theme-typography-display-sm-font-size);line-height:var(--ed-theme-typography-display-sm-line-height);letter-spacing:var(--ed-theme-typography-display-sm-letter-spacing);text-transform:var(--ed-theme-typography-display-sm-text-transform)}}.ed-c-heading--headline-lg{font-family:var(--ed-theme-typography-headline-lg-mobile-font-family);font-weight:var(--ed-theme-typography-headline-lg-mobile-font-weight);font-size:var(--ed-theme-typography-headline-lg-mobile-font-size);line-height:var(--ed-theme-typography-headline-lg-mobile-line-height);letter-spacing:var(--ed-theme-typography-headline-lg-mobile-letter-spacing);text-transform:var(--ed-theme-typography-headline-lg-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--headline-lg{font-family:var(--ed-theme-typography-headline-lg-font-family);font-weight:var(--ed-theme-typography-headline-lg-font-weight);font-size:var(--ed-theme-typography-headline-lg-font-size);line-height:var(--ed-theme-typography-headline-lg-line-height);letter-spacing:var(--ed-theme-typography-headline-lg-letter-spacing);text-transform:var(--ed-theme-typography-headline-lg-text-transform)}}.ed-c-heading--headline-default{font-family:var(--ed-theme-typography-headline-default-mobile-font-family);font-weight:var(--ed-theme-typography-headline-default-mobile-font-weight);font-size:var(--ed-theme-typography-headline-default-mobile-font-size);line-height:var(--ed-theme-typography-headline-default-mobile-line-height);letter-spacing:var(--ed-theme-typography-headline-default-mobile-letter-spacing);text-transform:var(--ed-theme-typography-headline-default-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--headline-default{font-family:var(--ed-theme-typography-headline-default-font-family);font-weight:var(--ed-theme-typography-headline-default-font-weight);font-size:var(--ed-theme-typography-headline-default-font-size);line-height:var(--ed-theme-typography-headline-default-line-height);letter-spacing:var(--ed-theme-typography-headline-default-letter-spacing);text-transform:var(--ed-theme-typography-headline-default-text-transform)}}.ed-c-heading--headline-sm{font-family:var(--ed-theme-typography-headline-sm-mobile-font-family);font-weight:var(--ed-theme-typography-headline-sm-mobile-font-weight);font-size:var(--ed-theme-typography-headline-sm-mobile-font-size);line-height:var(--ed-theme-typography-headline-sm-mobile-line-height);letter-spacing:var(--ed-theme-typography-headline-sm-mobile-letter-spacing);text-transform:var(--ed-theme-typography-headline-sm-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--headline-sm{font-family:var(--ed-theme-typography-headline-sm-font-family);font-weight:var(--ed-theme-typography-headline-sm-font-weight);font-size:var(--ed-theme-typography-headline-sm-font-size);line-height:var(--ed-theme-typography-headline-sm-line-height);letter-spacing:var(--ed-theme-typography-headline-sm-letter-spacing);text-transform:var(--ed-theme-typography-headline-sm-text-transform)}}.ed-c-heading--title-lg{font-family:var(--ed-theme-typography-title-lg-mobile-font-family);font-weight:var(--ed-theme-typography-title-lg-mobile-font-weight);font-size:var(--ed-theme-typography-title-lg-mobile-font-size);line-height:var(--ed-theme-typography-title-lg-mobile-line-height);letter-spacing:var(--ed-theme-typography-title-lg-mobile-letter-spacing);text-transform:var(--ed-theme-typography-title-lg-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--title-lg{font-family:var(--ed-theme-typography-title-lg-font-family);font-weight:var(--ed-theme-typography-title-lg-font-weight);font-size:var(--ed-theme-typography-title-lg-font-size);line-height:var(--ed-theme-typography-title-lg-line-height);letter-spacing:var(--ed-theme-typography-title-lg-letter-spacing);text-transform:var(--ed-theme-typography-title-lg-text-transform)}}.ed-c-heading--title-default{font-family:var(--ed-theme-typography-title-default-font-family);font-weight:var(--ed-theme-typography-title-default-font-weight);font-size:var(--ed-theme-typography-title-default-font-size);line-height:var(--ed-theme-typography-title-default-line-height);letter-spacing:var(--ed-theme-typography-title-default-letter-spacing);text-transform:var(--ed-theme-typography-title-default-text-transform)}.ed-c-heading--title-sm{font-family:var(--ed-theme-typography-title-sm-font-family);font-weight:var(--ed-theme-typography-title-sm-font-weight);font-size:var(--ed-theme-typography-title-sm-font-size);line-height:var(--ed-theme-typography-title-sm-line-height);letter-spacing:var(--ed-theme-typography-title-sm-letter-spacing);text-transform:var(--ed-theme-typography-title-sm-text-transform)}.ed-c-heading--label-lg{font-family:var(--ed-theme-typography-label-lg-font-family);font-weight:var(--ed-theme-typography-label-lg-font-weight);font-size:var(--ed-theme-typography-label-lg-font-size);line-height:var(--ed-theme-typography-label-lg-line-height);letter-spacing:var(--ed-theme-typography-label-lg-letter-spacing);text-transform:var(--ed-theme-typography-label-lg-text-transform)}.ed-c-heading--label-default{font-family:var(--ed-theme-typography-label-default-font-family);font-weight:var(--ed-theme-typography-label-default-font-weight);font-size:var(--ed-theme-typography-label-default-font-size);line-height:var(--ed-theme-typography-label-default-line-height);letter-spacing:var(--ed-theme-typography-label-default-letter-spacing);text-transform:var(--ed-theme-typography-label-default-text-transform)}.ed-c-heading--label-sm{font-family:var(--ed-theme-typography-label-sm-font-family);font-weight:var(--ed-theme-typography-label-sm-font-weight);font-size:var(--ed-theme-typography-label-sm-font-size);line-height:var(--ed-theme-typography-label-sm-line-height);letter-spacing:var(--ed-theme-typography-label-sm-letter-spacing);text-transform:var(--ed-theme-typography-label-sm-text-transform)}.ed-c-heading--body-lg{font-family:var(--ed-theme-typography-body-lg-font-family);font-weight:var(--ed-theme-typography-body-lg-font-weight);font-size:var(--ed-theme-typography-body-lg-font-size);line-height:var(--ed-theme-typography-body-lg-line-height);letter-spacing:var(--ed-theme-typography-body-lg-letter-spacing);text-transform:var(--ed-theme-typography-body-lg-text-transform)}.ed-c-heading--body-default{font-family:var(--ed-theme-typography-body-default-font-family);font-weight:var(--ed-theme-typography-body-default-font-weight);font-size:var(--ed-theme-typography-body-default-font-size);line-height:var(--ed-theme-typography-body-default-line-height);letter-spacing:var(--ed-theme-typography-body-default-letter-spacing);text-transform:var(--ed-theme-typography-body-default-text-transform)}.ed-c-heading--body-sm{font-family:var(--ed-theme-typography-body-sm-font-family);font-weight:var(--ed-theme-typography-body-sm-font-weight);font-size:var(--ed-theme-typography-body-sm-font-size);line-height:var(--ed-theme-typography-body-sm-line-height);letter-spacing:var(--ed-theme-typography-body-sm-letter-spacing);text-transform:var(--ed-theme-typography-body-sm-text-transform)}.ed-c-heading--meta-default{font-family:var(--ed-theme-typography-meta-default-font-family);font-weight:var(--ed-theme-typography-meta-default-font-weight);font-size:var(--ed-theme-typography-meta-default-font-size);line-height:var(--ed-theme-typography-meta-default-line-height);letter-spacing:var(--ed-theme-typography-meta-default-letter-spacing);text-transform:var(--ed-theme-typography-meta-default-text-transform)}.ed-c-heading--meta-sm{font-family:var(--ed-theme-typography-meta-sm-font-family);font-weight:var(--ed-theme-typography-meta-sm-font-weight);font-size:var(--ed-theme-typography-meta-sm-font-size);line-height:var(--ed-theme-typography-meta-sm-line-height);letter-spacing:var(--ed-theme-typography-meta-sm-letter-spacing);text-transform:var(--ed-theme-typography-meta-sm-text-transform)}';
5
- var p = Object.defineProperty, o = (h, e, r, s) => {
6
- for (var t = void 0, i = h.length - 1, d; i >= 0; i--)
7
- (d = h[i]) && (t = d(e, r, t) || t);
8
- return t && p(e, r, t), t;
3
+ import { E as g } from "../EdElement.js";
4
+ const p = '@charset "UTF-8";:root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6,.ed-c-heading{margin:0}.ed-c-heading--display-xl{font-family:var(--ed-theme-typography-display-xl-mobile-font-family);font-weight:var(--ed-theme-typography-display-xl-mobile-font-weight);font-size:var(--ed-theme-typography-display-xl-mobile-font-size);line-height:var(--ed-theme-typography-display-xl-mobile-line-height);letter-spacing:var(--ed-theme-typography-display-xl-mobile-letter-spacing);text-transform:var(--ed-theme-typography-display-xl-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--display-xl{font-family:var(--ed-theme-typography-display-xl-tablet-font-family);font-weight:var(--ed-theme-typography-display-xl-tablet-font-weight);font-size:var(--ed-theme-typography-display-xl-tablet-font-size);line-height:var(--ed-theme-typography-display-xl-tablet-line-height);letter-spacing:var(--ed-theme-typography-display-xl-tablet-letter-spacing);text-transform:var(--ed-theme-typography-display-xl-tablet-text-transform)}}@media all and (min-width:75rem){.ed-c-heading--display-xl{font-family:var(--ed-theme-typography-display-xl-font-family);font-weight:var(--ed-theme-typography-display-xl-font-weight);font-size:var(--ed-theme-typography-display-xl-font-size);line-height:var(--ed-theme-typography-display-xl-line-height);letter-spacing:var(--ed-theme-typography-display-xl-letter-spacing);text-transform:var(--ed-theme-typography-display-xl-text-transform)}}.ed-c-heading--display-lg{font-family:var(--ed-theme-typography-display-lg-mobile-font-family);font-weight:var(--ed-theme-typography-display-lg-mobile-font-weight);font-size:var(--ed-theme-typography-display-lg-mobile-font-size);line-height:var(--ed-theme-typography-display-lg-mobile-line-height);letter-spacing:var(--ed-theme-typography-display-lg-mobile-letter-spacing);text-transform:var(--ed-theme-typography-display-lg-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--display-lg{font-family:var(--ed-theme-typography-display-lg-font-family);font-weight:var(--ed-theme-typography-display-lg-font-weight);font-size:var(--ed-theme-typography-display-lg-font-size);line-height:var(--ed-theme-typography-display-lg-line-height);letter-spacing:var(--ed-theme-typography-display-lg-letter-spacing);text-transform:var(--ed-theme-typography-display-lg-text-transform)}}.ed-c-heading--display-default{font-family:var(--ed-theme-typography-display-default-mobile-font-family);font-weight:var(--ed-theme-typography-display-default-mobile-font-weight);font-size:var(--ed-theme-typography-display-default-mobile-font-size);line-height:var(--ed-theme-typography-display-default-mobile-line-height);letter-spacing:var(--ed-theme-typography-display-default-mobile-letter-spacing);text-transform:var(--ed-theme-typography-display-default-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--display-default{font-family:var(--ed-theme-typography-display-default-font-family);font-weight:var(--ed-theme-typography-display-default-font-weight);font-size:var(--ed-theme-typography-display-default-font-size);line-height:var(--ed-theme-typography-display-default-line-height);letter-spacing:var(--ed-theme-typography-display-default-letter-spacing);text-transform:var(--ed-theme-typography-display-default-text-transform)}}.ed-c-heading--headline-lg{font-family:var(--ed-theme-typography-headline-lg-mobile-font-family);font-weight:var(--ed-theme-typography-headline-lg-mobile-font-weight);font-size:var(--ed-theme-typography-headline-lg-mobile-font-size);line-height:var(--ed-theme-typography-headline-lg-mobile-line-height);letter-spacing:var(--ed-theme-typography-headline-lg-mobile-letter-spacing);text-transform:var(--ed-theme-typography-headline-lg-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--headline-lg{font-family:var(--ed-theme-typography-headline-lg-font-family);font-weight:var(--ed-theme-typography-headline-lg-font-weight);font-size:var(--ed-theme-typography-headline-lg-font-size);line-height:var(--ed-theme-typography-headline-lg-line-height);letter-spacing:var(--ed-theme-typography-headline-lg-letter-spacing);text-transform:var(--ed-theme-typography-headline-lg-text-transform)}}.ed-c-heading--headline-default{font-family:var(--ed-theme-typography-headline-default-mobile-font-family);font-weight:var(--ed-theme-typography-headline-default-mobile-font-weight);font-size:var(--ed-theme-typography-headline-default-mobile-font-size);line-height:var(--ed-theme-typography-headline-default-mobile-line-height);letter-spacing:var(--ed-theme-typography-headline-default-mobile-letter-spacing);text-transform:var(--ed-theme-typography-headline-default-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--headline-default{font-family:var(--ed-theme-typography-headline-default-font-family);font-weight:var(--ed-theme-typography-headline-default-font-weight);font-size:var(--ed-theme-typography-headline-default-font-size);line-height:var(--ed-theme-typography-headline-default-line-height);letter-spacing:var(--ed-theme-typography-headline-default-letter-spacing);text-transform:var(--ed-theme-typography-headline-default-text-transform)}}.ed-c-heading--headline-sm{font-family:var(--ed-theme-typography-headline-sm-mobile-font-family);font-weight:var(--ed-theme-typography-headline-sm-mobile-font-weight);font-size:var(--ed-theme-typography-headline-sm-mobile-font-size);line-height:var(--ed-theme-typography-headline-sm-mobile-line-height);letter-spacing:var(--ed-theme-typography-headline-sm-mobile-letter-spacing);text-transform:var(--ed-theme-typography-headline-sm-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--headline-sm{font-family:var(--ed-theme-typography-headline-sm-font-family);font-weight:var(--ed-theme-typography-headline-sm-font-weight);font-size:var(--ed-theme-typography-headline-sm-font-size);line-height:var(--ed-theme-typography-headline-sm-line-height);letter-spacing:var(--ed-theme-typography-headline-sm-letter-spacing);text-transform:var(--ed-theme-typography-headline-sm-text-transform)}}.ed-c-heading--title-lg{font-family:var(--ed-theme-typography-title-lg-mobile-font-family);font-weight:var(--ed-theme-typography-title-lg-mobile-font-weight);font-size:var(--ed-theme-typography-title-lg-mobile-font-size);line-height:var(--ed-theme-typography-title-lg-mobile-line-height);letter-spacing:var(--ed-theme-typography-title-lg-mobile-letter-spacing);text-transform:var(--ed-theme-typography-title-lg-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-heading--title-lg{font-family:var(--ed-theme-typography-title-lg-font-family);font-weight:var(--ed-theme-typography-title-lg-font-weight);font-size:var(--ed-theme-typography-title-lg-font-size);line-height:var(--ed-theme-typography-title-lg-line-height);letter-spacing:var(--ed-theme-typography-title-lg-letter-spacing);text-transform:var(--ed-theme-typography-title-lg-text-transform)}}.ed-c-heading--title-default{font-family:var(--ed-theme-typography-title-default-font-family);font-weight:var(--ed-theme-typography-title-default-font-weight);font-size:var(--ed-theme-typography-title-default-font-size);line-height:var(--ed-theme-typography-title-default-line-height);letter-spacing:var(--ed-theme-typography-title-default-letter-spacing);text-transform:var(--ed-theme-typography-title-default-text-transform)}.ed-c-heading--title-sm{font-family:var(--ed-theme-typography-title-sm-font-family);font-weight:var(--ed-theme-typography-title-sm-font-weight);font-size:var(--ed-theme-typography-title-sm-font-size);line-height:var(--ed-theme-typography-title-sm-line-height);letter-spacing:var(--ed-theme-typography-title-sm-letter-spacing);text-transform:var(--ed-theme-typography-title-sm-text-transform)}.ed-c-heading--label-lg{font-family:var(--ed-theme-typography-label-lg-font-family);font-weight:var(--ed-theme-typography-label-lg-font-weight);font-size:var(--ed-theme-typography-label-lg-font-size);line-height:var(--ed-theme-typography-label-lg-line-height);letter-spacing:var(--ed-theme-typography-label-lg-letter-spacing);text-transform:var(--ed-theme-typography-label-lg-text-transform)}.ed-c-heading--label-default{font-family:var(--ed-theme-typography-label-default-font-family);font-weight:var(--ed-theme-typography-label-default-font-weight);font-size:var(--ed-theme-typography-label-default-font-size);line-height:var(--ed-theme-typography-label-default-line-height);letter-spacing:var(--ed-theme-typography-label-default-letter-spacing);text-transform:var(--ed-theme-typography-label-default-text-transform)}.ed-c-heading--label-sm{font-family:var(--ed-theme-typography-label-sm-font-family);font-weight:var(--ed-theme-typography-label-sm-font-weight);font-size:var(--ed-theme-typography-label-sm-font-size);line-height:var(--ed-theme-typography-label-sm-line-height);letter-spacing:var(--ed-theme-typography-label-sm-letter-spacing);text-transform:var(--ed-theme-typography-label-sm-text-transform)}.ed-c-heading--body-lg{font-family:var(--ed-theme-typography-body-lg-font-family);font-weight:var(--ed-theme-typography-body-lg-font-weight);font-size:var(--ed-theme-typography-body-lg-font-size);line-height:var(--ed-theme-typography-body-lg-line-height);letter-spacing:var(--ed-theme-typography-body-lg-letter-spacing);text-transform:var(--ed-theme-typography-body-lg-text-transform)}.ed-c-heading--body-default{font-family:var(--ed-theme-typography-body-default-font-family);font-weight:var(--ed-theme-typography-body-default-font-weight);font-size:var(--ed-theme-typography-body-default-font-size);line-height:var(--ed-theme-typography-body-default-line-height);letter-spacing:var(--ed-theme-typography-body-default-letter-spacing);text-transform:var(--ed-theme-typography-body-default-text-transform)}.ed-c-heading--body-sm{font-family:var(--ed-theme-typography-body-sm-font-family);font-weight:var(--ed-theme-typography-body-sm-font-weight);font-size:var(--ed-theme-typography-body-sm-font-size);line-height:var(--ed-theme-typography-body-sm-line-height);letter-spacing:var(--ed-theme-typography-body-sm-letter-spacing);text-transform:var(--ed-theme-typography-body-sm-text-transform)}.ed-c-heading--meta-default{font-family:var(--ed-theme-typography-meta-default-font-family);font-weight:var(--ed-theme-typography-meta-default-font-weight);font-size:var(--ed-theme-typography-meta-default-font-size);line-height:var(--ed-theme-typography-meta-default-line-height);letter-spacing:var(--ed-theme-typography-meta-default-letter-spacing);text-transform:var(--ed-theme-typography-meta-default-text-transform)}.ed-c-heading--meta-sm{font-family:var(--ed-theme-typography-meta-sm-font-family);font-weight:var(--ed-theme-typography-meta-sm-font-weight);font-size:var(--ed-theme-typography-meta-sm-font-size);line-height:var(--ed-theme-typography-meta-sm-line-height);letter-spacing:var(--ed-theme-typography-meta-sm-letter-spacing);text-transform:var(--ed-theme-typography-meta-sm-text-transform)}';
5
+ var m = Object.defineProperty, o = (i, e, r, s) => {
6
+ for (var t = void 0, h = i.length - 1, d; h >= 0; h--)
7
+ (d = i[h]) && (t = d(e, r, t) || t);
8
+ return t && m(e, r, t), t;
9
9
  };
10
- class l extends y {
10
+ class l extends g {
11
11
  constructor() {
12
12
  super(...arguments), this.tagName = "h2";
13
13
  }
14
14
  static get styles() {
15
- return m(g);
15
+ return y(p);
16
16
  }
17
17
  render() {
18
18
  const e = this.componentClassNames("ed-c-heading", {
19
+ "ed-c-heading--display-xl": this.variant === "display-xl",
20
+ "ed-c-heading--display-lg": this.variant === "display-lg",
19
21
  "ed-c-heading--display-default": this.variant === "display-default",
20
- "ed-c-heading--display-sm": this.variant === "display-sm",
21
22
  "ed-c-heading--headline-lg": this.variant ? this.variant === "headline-lg" : this.tagName === "h1",
22
23
  "ed-c-heading--headline-default": this.variant ? this.variant === "headline-default" : this.tagName === "h2",
23
24
  "ed-c-heading--headline-sm": this.variant ? this.variant === "headline-sm" : this.tagName === "h3",
@@ -4,6 +4,15 @@ import { EdElement } from '@brad-frost-web/eddie-web-components/components/EdEle
4
4
  */
5
5
  export declare class EdLayoutContainer extends EdElement {
6
6
  static get styles(): import('lit').CSSResult;
7
+ /**
8
+ * Variant
9
+ * <ed-text-passage size="sm">
10
+ * <ul>
11
+ * <li>**narrow** narrows the layout container to 50rem</li>
12
+ * </ul>
13
+ * </ed-text-passage>
14
+ */
15
+ variant?: 'narrow';
7
16
  render(): import('lit-html').TemplateResult<1>;
8
17
  }
9
18
  declare global {
@@ -1 +1 @@
1
- {"version":3,"file":"layout-container.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/layout-container/layout-container.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAGtF;;GAEG;AACH,qBAAa,iBAAkB,SAAQ,SAAS;IAC9C,MAAM,KAAK,MAAM,4BAEhB;IAED,MAAM;CASP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF"}
1
+ {"version":3,"file":"layout-container.d.ts","sourceRoot":"","sources":["../../../../packages/eddie-web-components/components/layout-container/layout-container.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,2DAA2D,CAAC;AAGtF;;GAEG;AACH,qBAAa,iBAAkB,SAAQ,SAAS;IAC9C,MAAM,KAAK,MAAM,4BAEhB;IAED;;;;;;;OAOG;IAEH,OAAO,CAAC,EAAE,QAAQ,CAAC;IAEnB,MAAM;CAWP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF"}
@@ -1,20 +1,31 @@
1
- import { unsafeCSS as e, html as o } from "lit";
2
- import { E as n } from "../EdElement.js";
3
- const a = '@charset "UTF-8";:root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-l-layout-container{width:100%;max-width:var(--ed-layout-container-max-width, 70rem);padding-right:1rem;padding-left:1rem;margin:0 auto}';
4
- class s extends n {
1
+ import { unsafeCSS as s, html as d } from "lit";
2
+ import { property as l } from "lit/decorators.js";
3
+ import { E as m } from "../EdElement.js";
4
+ const c = '@charset "UTF-8";:root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-l-layout-container{width:100%;max-width:var(--ed-layout-container-max-width, 70rem);padding-right:1rem;padding-left:1rem;margin:0 auto}.ed-l-layout-container--narrow{max-width:50rem}';
5
+ var h = Object.defineProperty, u = (r, e, a, f) => {
6
+ for (var t = void 0, o = r.length - 1, n; o >= 0; o--)
7
+ (n = r[o]) && (t = n(e, a, t) || t);
8
+ return t && h(e, a, t), t;
9
+ };
10
+ class i extends m {
5
11
  static get styles() {
6
- return e(a);
12
+ return s(c);
7
13
  }
8
14
  render() {
9
- const t = this.componentClassNames("ed-l-layout-container", {});
10
- return o`
11
- <div class="${t}">
15
+ const e = this.componentClassNames("ed-l-layout-container", {
16
+ "ed-l-layout-container--narrow": this.variant === "narrow"
17
+ });
18
+ return d`
19
+ <div class="${e}">
12
20
  <slot></slot>
13
21
  </div>
14
22
  `;
15
23
  }
16
24
  }
17
- customElements.get("ed-layout-container") === void 0 && customElements.define("ed-layout-container", s);
25
+ u([
26
+ l()
27
+ ], i.prototype, "variant");
28
+ customElements.get("ed-layout-container") === void 0 && customElements.define("ed-layout-container", i);
18
29
  export {
19
- s as EdLayoutContainer
30
+ i as EdLayoutContainer
20
31
  };
@@ -1,13 +1,13 @@
1
1
  import { unsafeCSS as o, html as d } from "lit";
2
2
  import { property as m } from "lit/decorators.js";
3
3
  import { E as l } from "../EdElement.js";
4
- const p = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-primary-nav--side-by-side{--ed-primary-nav-item-border-bottom: none}.ed-c-primary-nav__list{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}.ed-c-primary-nav--side-by-side .ed-c-primary-nav__list{flex-direction:row;gap:2rem}@media all and (min-width:48rem){.ed-c-primary-nav__list{flex-direction:row;gap:2rem}}";
5
- var v = Object.defineProperty, c = (i, r, t, y) => {
4
+ const p = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-primary-nav--side-by-side{--ed-primary-nav-item-border-bottom: none}.ed-c-primary-nav__list{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}.ed-c-primary-nav--side-by-side .ed-c-primary-nav__list{flex-direction:row;gap:2rem;--ed-primary-nav-link-padding: size(2) 0}@media all and (min-width:48rem){.ed-c-primary-nav__list{flex-direction:row;gap:2rem}}";
5
+ var v = Object.defineProperty, y = (i, r, n, c) => {
6
6
  for (var e = void 0, a = i.length - 1, s; a >= 0; a--)
7
- (s = i[a]) && (e = s(r, t, e) || e);
8
- return e && v(r, t, e), e;
7
+ (s = i[a]) && (e = s(r, n, e) || e);
8
+ return e && v(r, n, e), e;
9
9
  };
10
- class n extends l {
10
+ class t extends l {
11
11
  static get styles() {
12
12
  return o(p);
13
13
  }
@@ -24,10 +24,10 @@ class n extends l {
24
24
  `;
25
25
  }
26
26
  }
27
- c([
27
+ y([
28
28
  m()
29
- ], n.prototype, "behavior");
30
- customElements.get("ed-primary-nav") === void 0 && customElements.define("ed-primary-nav", n);
29
+ ], t.prototype, "behavior");
30
+ customElements.get("ed-primary-nav") === void 0 && customElements.define("ed-primary-nav", t);
31
31
  export {
32
- n as EdPrimaryNav
32
+ t as EdPrimaryNav
33
33
  };
@@ -3,7 +3,7 @@ import { unsafeCSS as h, html as l } from "lit";
3
3
  import { property as n, state as p } from "lit/decorators.js";
4
4
  import { ifDefined as v } from "lit-html/directives/if-defined.js";
5
5
  import "../icon/icon.js";
6
- const y = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-primary-nav__item{border-bottom:var(--ed-primary-nav-item-border-bottom, var(--ed-theme-border-width-sm) solid var(--ed-theme-color-border-subtle))}@media all and (min-width:48rem){.ed-c-primary-nav__item{border-bottom:none}}.ed-c-primary-nav__link{font-family:var(--ed-theme-typography-primary-nav-default-mobile-font-family);font-weight:var(--ed-theme-typography-primary-nav-default-mobile-font-weight);font-size:var(--ed-theme-typography-primary-nav-default-mobile-font-size);line-height:var(--ed-theme-typography-primary-nav-default-mobile-line-height);letter-spacing:var(--ed-theme-typography-primary-nav-default-mobile-letter-spacing);text-transform:var(--ed-theme-typography-primary-nav-default-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-primary-nav__link{font-family:var(--ed-theme-typography-primary-nav-default-font-family);font-weight:var(--ed-theme-typography-primary-nav-default-font-weight);font-size:var(--ed-theme-typography-primary-nav-default-font-size);line-height:var(--ed-theme-typography-primary-nav-default-line-height);letter-spacing:var(--ed-theme-typography-primary-nav-default-letter-spacing);text-transform:var(--ed-theme-typography-primary-nav-default-text-transform)}}.ed-c-primary-nav__link{display:flex;align-items:center;appearance:none;background:none;border:none;border-radius:var(--ed-theme-border-radius-md);white-space:nowrap;width:100%;margin:0;padding:1rem 2rem;color:var(--ed-theme-color-content-knockout);text-decoration:none;transition:all var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease);cursor:pointer}.ed-c-primary-nav__link:hover,.ed-c-primary-nav__link:focus{transform:scale(1.05)}.ed-c-primary-nav__link:focus-visible{outline:var(--ed-theme-border-width-lg) solid var(--ed-theme-focus-ring-color-border-knockout);outline-offset:var(--ed-theme-offset-focus-ring, .25rem )}.ed-c-primary-nav__item--highlight .ed-c-primary-nav__link{padding:1rem;background:var(--ed-theme-color-background-brand-knockout)}.ed-c-primary-nav__item.ed-is-active .ed-c-primary-nav__link{background:var(--ed-theme-color-background-brand-knockout);color:var(--ed-theme-color-content-knockout)}@media all and (min-width:48rem){.ed-c-primary-nav__link{padding:1rem 0}}@media all and (min-width:60rem){.ed-c-primary-nav__link{padding:1rem 0;border-bottom:none}}ed-icon{--ed-icon-height: 1rem ;--ed-icon-width: 1rem ;margin-left:auto;transition:transform var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease)}.ed-c-primary-nav__item.ed-is-active ed-icon{transform:rotate(-180deg)}@media all and (min-width:48rem){ed-icon{margin-left:1rem}}.ed-c-primary-nav__item-panel{visibility:hidden;width:100%;height:0;overflow:hidden;background:transparent;opacity:0;transition:all 0s var(--ed-theme-animation-ease);z-index:-1}@media all and (min-width:48rem){.ed-c-primary-nav__item-panel{position:absolute;top:100%;left:0;height:auto;box-shadow:var(--ed-theme-box-shadow-md)}}.ed-c-primary-nav__item.ed-is-active .ed-c-primary-nav__item-panel{display:block;visibility:visible;height:auto;padding-top:2rem;padding-bottom:2rem;background:var(--ed-theme-color-background-knockout);opacity:1;z-index:1;transition:opacity var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease)}.ed-c-primary-nav__item--megamenu .ed-c-primary-nav__item-panel-inner{max-width:70rem;padding-right:2rem;padding-left:2rem;margin:0 auto}";
6
+ const y = ":root,:host{--size-base-unit: .5rem}*,::slotted(*),*:before,*:after{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0}.ed-c-primary-nav__item{border-bottom:var(--ed-primary-nav-item-border-bottom, var(--ed-theme-border-width-sm) solid var(--ed-theme-color-border-subtle))}@media all and (min-width:48rem){.ed-c-primary-nav__item{border-bottom:none}}.ed-c-primary-nav__link{font-family:var(--ed-theme-typography-primary-nav-default-mobile-font-family);font-weight:var(--ed-theme-typography-primary-nav-default-mobile-font-weight);font-size:var(--ed-theme-typography-primary-nav-default-mobile-font-size);line-height:var(--ed-theme-typography-primary-nav-default-mobile-line-height);letter-spacing:var(--ed-theme-typography-primary-nav-default-mobile-letter-spacing);text-transform:var(--ed-theme-typography-primary-nav-default-mobile-text-transform)}@media all and (min-width:48rem){.ed-c-primary-nav__link{font-family:var(--ed-theme-typography-primary-nav-default-font-family);font-weight:var(--ed-theme-typography-primary-nav-default-font-weight);font-size:var(--ed-theme-typography-primary-nav-default-font-size);line-height:var(--ed-theme-typography-primary-nav-default-line-height);letter-spacing:var(--ed-theme-typography-primary-nav-default-letter-spacing);text-transform:var(--ed-theme-typography-primary-nav-default-text-transform)}}.ed-c-primary-nav__link{display:flex;align-items:center;appearance:none;background:none;border:none;border-radius:var(--ed-theme-border-radius-md);white-space:nowrap;width:100%;margin:0;padding:var(--ed-primary-nav-link-padding, 1rem 2rem );color:var(--ed-theme-color-content-knockout);text-decoration:none;transition:all var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease);cursor:pointer}.ed-c-primary-nav__link:hover,.ed-c-primary-nav__link:focus{transform:scale(1.05)}.ed-c-primary-nav__link:focus-visible{outline:var(--ed-theme-border-width-lg) solid var(--ed-theme-focus-ring-color-border-knockout);outline-offset:var(--ed-theme-offset-focus-ring, .25rem )}.ed-c-primary-nav__item--highlight .ed-c-primary-nav__link{padding:1rem;background:var(--ed-theme-color-background-brand-knockout)}.ed-c-primary-nav__item.ed-is-active .ed-c-primary-nav__link{background:var(--ed-theme-color-background-brand-knockout);color:var(--ed-theme-color-content-knockout)}@media all and (min-width:48rem){.ed-c-primary-nav__link{padding:1rem 0}}@media all and (min-width:60rem){.ed-c-primary-nav__link{padding:1rem 0;border-bottom:none}}ed-icon{--ed-icon-height: 1rem ;--ed-icon-width: 1rem ;margin-left:auto;transition:transform var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease)}.ed-c-primary-nav__item.ed-is-active ed-icon{transform:rotate(-180deg)}@media all and (min-width:48rem){ed-icon{margin-left:1rem}}.ed-c-primary-nav__item-panel{visibility:hidden;width:100%;height:0;overflow:hidden;background:transparent;opacity:0;transition:all 0s var(--ed-theme-animation-ease);z-index:-1}@media all and (min-width:48rem){.ed-c-primary-nav__item-panel{position:absolute;top:100%;left:0;height:auto;box-shadow:var(--ed-theme-box-shadow-md)}}.ed-c-primary-nav__item.ed-is-active .ed-c-primary-nav__item-panel{display:block;visibility:visible;height:auto;padding-top:2rem;padding-bottom:2rem;background:var(--ed-theme-color-background-knockout);opacity:1;z-index:1;transition:opacity var(--ed-theme-animation-fade-quick) var(--ed-theme-animation-ease)}.ed-c-primary-nav__item--megamenu .ed-c-primary-nav__item-panel-inner{max-width:70rem;padding-right:2rem;padding-left:2rem;margin:0 auto}";
7
7
  var f = Object.defineProperty, r = (o, e, t, d) => {
8
8
  for (var a = void 0, m = o.length - 1, s; m >= 0; m--)
9
9
  (s = o[m]) && (a = s(e, t, a) || a);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brad-frost-web/eddie-web-components",
3
- "version": "0.6.0",
3
+ "version": "0.8.0",
4
4
  "type": "module",
5
5
  "scripts": {
6
6
  "start": "npm run build:custom-elements.json && npm run storybook",