@uoguelph/web-components 1.1.3 → 1.2.0-rc.1

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.
Files changed (82) hide show
  1. package/dist/cjs/app-globals-3a1e7e63.js +5 -0
  2. package/dist/cjs/{index-469a8261.js → index-06b58d35.js} +5 -5
  3. package/dist/cjs/{index-4e3091d0.js → index-cdb046b4.js} +134 -40
  4. package/dist/cjs/loader.cjs.js +5 -3
  5. package/dist/cjs/uofg-alert.cjs.entry.js +11 -10
  6. package/dist/cjs/uofg-back-to-top_5.cjs.entry.js +1374 -0
  7. package/dist/cjs/uofg-modal.cjs.entry.js +152 -142
  8. package/dist/cjs/uofg-web-components.cjs.js +6 -4
  9. package/dist/cjs/utils-3d4b7e2e.js +16 -0
  10. package/dist/collection/collection-manifest.json +2 -2
  11. package/dist/collection/components/uofg-alert/uofg-alert.css +1 -75
  12. package/dist/collection/components/uofg-alert/uofg-alert.js +15 -15
  13. package/dist/collection/components/uofg-back-to-top/uofg-back-to-top.css +1 -40
  14. package/dist/collection/components/uofg-back-to-top/uofg-back-to-top.js +66 -63
  15. package/dist/collection/components/uofg-card/uofg-card.css +1 -95
  16. package/dist/collection/components/uofg-card/uofg-card.js +42 -40
  17. package/dist/collection/components/uofg-footer/uofg-footer.css +1 -249
  18. package/dist/collection/components/uofg-footer/uofg-footer.js +132 -40
  19. package/dist/collection/components/uofg-header/uofg-header.css +1 -542
  20. package/dist/collection/components/uofg-header/uofg-header.js +238 -157
  21. package/dist/collection/components/uofg-menu/uofg-menu.js +414 -410
  22. package/dist/collection/components/uofg-modal/uofg-modal.css +1 -113
  23. package/dist/collection/components/uofg-modal/uofg-modal.js +393 -386
  24. package/dist/collection/utils/font-awesome-icon.js +4 -4
  25. package/dist/collection/utils/utils.js +5 -5
  26. package/dist/components/font-awesome-icon.js +4 -4
  27. package/dist/components/uofg-alert.d.ts +2 -2
  28. package/dist/components/uofg-alert.js +22 -21
  29. package/dist/components/uofg-back-to-top.d.ts +2 -2
  30. package/dist/components/uofg-back-to-top.js +38 -34
  31. package/dist/components/uofg-card.d.ts +2 -2
  32. package/dist/components/uofg-card.js +28 -25
  33. package/dist/components/uofg-footer.d.ts +2 -2
  34. package/dist/components/uofg-footer.js +243 -115
  35. package/dist/components/uofg-header.d.ts +2 -2
  36. package/dist/components/uofg-header.js +234 -143
  37. package/dist/components/uofg-menu.d.ts +2 -2
  38. package/dist/components/uofg-menu2.js +245 -239
  39. package/dist/components/uofg-modal.d.ts +2 -2
  40. package/dist/components/uofg-modal.js +176 -166
  41. package/dist/components/utils.js +4 -4
  42. package/dist/esm/app-globals-0f993ce5.js +3 -0
  43. package/dist/esm/{index-f644a780.js → index-0b0002d2.js} +134 -40
  44. package/dist/esm/{index-26c6582e.js → index-e685921a.js} +5 -5
  45. package/dist/esm/loader.js +6 -4
  46. package/dist/esm/uofg-alert.entry.js +11 -10
  47. package/dist/esm/uofg-back-to-top_5.entry.js +1366 -0
  48. package/dist/esm/uofg-modal.entry.js +152 -142
  49. package/dist/esm/uofg-web-components.js +7 -5
  50. package/dist/esm/utils-379bb71a.js +12 -0
  51. package/dist/types/components/uofg-alert/uofg-alert.d.ts +1 -1
  52. package/dist/types/components/uofg-back-to-top/uofg-back-to-top.d.ts +8 -8
  53. package/dist/types/components/uofg-card/uofg-card.d.ts +5 -5
  54. package/dist/types/components/uofg-footer/uofg-footer.d.ts +6 -6
  55. package/dist/types/components/uofg-header/uofg-header.d.ts +30 -29
  56. package/dist/types/components/uofg-menu/uofg-menu.d.ts +65 -65
  57. package/dist/types/components/uofg-modal/uofg-modal.d.ts +70 -70
  58. package/dist/types/components.d.ts +1 -1
  59. package/dist/types/stencil-public-runtime.d.ts +8 -0
  60. package/dist/types/utils/font-awesome-icon.d.ts +1 -1
  61. package/dist/uofg-web-components/{p-afff1fb0.js → p-6fa0f8f6.js} +1 -1
  62. package/dist/uofg-web-components/p-7569d8f2.entry.js +1 -0
  63. package/dist/uofg-web-components/p-c0449c39.entry.js +1 -0
  64. package/dist/uofg-web-components/p-e1255160.js +1 -0
  65. package/dist/uofg-web-components/p-ee27db22.js +2 -0
  66. package/dist/uofg-web-components/p-fde6370b.entry.js +1 -0
  67. package/dist/uofg-web-components/uofg-web-components.css +1 -1
  68. package/dist/uofg-web-components/uofg-web-components.esm.js +1 -1
  69. package/package.json +10 -5
  70. package/dist/cjs/uofg-back-to-top_4.cjs.entry.js +0 -1139
  71. package/dist/cjs/uofg-card.cjs.entry.js +0 -21
  72. package/dist/cjs/utils-582c8cb9.js +0 -16
  73. package/dist/components/_commonjsHelpers.js +0 -15
  74. package/dist/esm/uofg-back-to-top_4.entry.js +0 -1132
  75. package/dist/esm/uofg-card.entry.js +0 -17
  76. package/dist/esm/utils-cfa32fa2.js +0 -12
  77. package/dist/uofg-web-components/p-579599fd.js +0 -2
  78. package/dist/uofg-web-components/p-5f29369c.entry.js +0 -1
  79. package/dist/uofg-web-components/p-b55cb256.entry.js +0 -1
  80. package/dist/uofg-web-components/p-b81838c7.entry.js +0 -1
  81. package/dist/uofg-web-components/p-f42ff310.entry.js +0 -1
  82. /package/dist/uofg-web-components/{p-826dc478.js → p-fec87f9d.js} +0 -0
@@ -1,7 +1,7 @@
1
1
  import { h } from "@stencil/core";
2
2
  export const FontAwesomeIcon = props => {
3
- const width = props.icon.icon[0];
4
- const height = props.icon.icon[1];
5
- const iconPathData = props.icon.icon[4];
6
- return (h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: `0 0 ${width} ${height}` }, Array.isArray(iconPathData) ? (iconPathData.map(path => h("path", { d: path }))) : (h("path", { d: iconPathData }))));
3
+ const width = props.icon.icon[0];
4
+ const height = props.icon.icon[1];
5
+ const iconPathData = props.icon.icon[4];
6
+ return (h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: `0 0 ${width} ${height}` }, Array.isArray(iconPathData) ? (iconPathData.map(path => h("path", { d: path }))) : (h("path", { d: iconPathData }))));
7
7
  };
@@ -1,13 +1,13 @@
1
1
  export const WEB_ANIMATIONS_SUPPORTED = () => {
2
- return typeof window !== 'undefined' && 'animate' in HTMLElement.prototype;
2
+ return typeof window !== 'undefined' && 'animate' in HTMLElement.prototype;
3
3
  };
4
4
  export const PREFERS_REDUCED_MOTION = () => {
5
- return typeof window !== 'undefined' && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
5
+ return typeof window !== 'undefined' && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
6
6
  };
7
7
  export const IS_INERT_SUPPORTED = () => {
8
- return typeof window !== 'undefined' && 'inert' in HTMLElement.prototype;
8
+ return typeof window !== 'undefined' && 'inert' in HTMLElement.prototype;
9
9
  };
10
10
  export const getAllFocusableElements = (container) => {
11
- const query = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [contenteditable], audio[controls], video[controls], details, summary, [tabindex]:not([tabindex="-1"])';
12
- return Array.from(container.querySelectorAll(query));
11
+ const query = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [contenteditable], audio[controls], video[controls], details, summary, [tabindex]:not([tabindex="-1"])';
12
+ return Array.from(container.querySelectorAll(query));
13
13
  };
@@ -1,10 +1,10 @@
1
1
  import { h } from '@stencil/core/internal/client';
2
2
 
3
3
  const FontAwesomeIcon = props => {
4
- const width = props.icon.icon[0];
5
- const height = props.icon.icon[1];
6
- const iconPathData = props.icon.icon[4];
7
- return (h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: `0 0 ${width} ${height}` }, Array.isArray(iconPathData) ? (iconPathData.map(path => h("path", { d: path }))) : (h("path", { d: iconPathData }))));
4
+ const width = props.icon.icon[0];
5
+ const height = props.icon.icon[1];
6
+ const iconPathData = props.icon.icon[4];
7
+ return (h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: `0 0 ${width} ${height}` }, Array.isArray(iconPathData) ? (iconPathData.map(path => h("path", { d: path }))) : (h("path", { d: iconPathData }))));
8
8
  };
9
9
 
10
10
  export { FontAwesomeIcon as F };
@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
2
2
 
3
3
  interface UofgAlert extends Components.UofgAlert, HTMLElement {}
4
4
  export const UofgAlert: {
5
- prototype: UofgAlert;
6
- new (): UofgAlert;
5
+ prototype: UofgAlert;
6
+ new (): UofgAlert;
7
7
  };
8
8
  /**
9
9
  * Used to define this component and all nested components recursively.
@@ -2,31 +2,32 @@ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/clien
2
2
  import { F as FontAwesomeIcon } from './font-awesome-icon.js';
3
3
  import { f as faCircleExclamation } from './index2.js';
4
4
 
5
- const uofgAlertCss = "*{box-sizing:border-box}button{border:none;background-color:transparent;cursor:pointer}a{color:inherit;text-decoration:none}ul{list-style:none;padding:0;margin:unset}ul>li{display:contents}:focus-visible{outline:2px solid #ffc72a;outline-offset:0.5rem}:host{display:block;max-width:100rem}#uofg-alert{display:flex;flex-direction:column;font-size:2rem}#uofg-alert-title{display:flex;align-items:center;font-size:2.25rem;padding:2rem;color:white;background-color:#c20430}#uofg-alert-title>svg{margin-right:1rem;fill:currentColor;height:1.5em}#uofg-alert-body{display:flex;flex-direction:column;padding:1.5rem 2rem;background-color:white}#uofg-alert-body slot[name=subtitle]::slotted(*){font-size:2rem;margin-bottom:2rem;font-weight:bold}#uofg-alert-body slot[name=message]::slotted(*){font-size:1.6rem}#uofg-alert-footer{display:flex;padding:1rem 2rem;background-color:#dddddd;font-size:1.4rem}";
5
+ const uofgAlertCss = ":host{display:block;max-width:100rem}*{box-sizing:border-box}a{text-decoration:none;color:inherit}button{border:none;background:none;cursor:pointer;font-size:inherit;font-family:inherit;color:inherit;line-height:inherit;word-spacing:inherit;letter-spacing:inherit}ul{list-style:none;padding:0;margin:0}@defaults border-spacing{--tw-border-spacing-x:0;--tw-border-spacing-y:0}@defaults transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1}@defaults touch-action{}@defaults scroll-snap-type{--tw-scroll-snap-strictness:proximity}@defaults gradient-color-stops{}@defaults font-variant-numeric{}@defaults box-shadow{--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}@defaults ring-width{--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}@defaults filter{}@defaults backdrop-filter{}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}.tw-flex{display:flex!important}.tw-flex-col{flex-direction:column!important}.tw-items-center{align-items:center!important}.tw-bg-uofg-grey{--tw-bg-opacity:1!important;background-color:rgb(221 221 221/var(--tw-bg-opacity))!important}.tw-bg-uofg-red{--tw-bg-opacity:1!important;background-color:rgb(194 4 48/var(--tw-bg-opacity))!important}.tw-bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.tw-p-8{padding:2rem!important}.tw-px-8{padding-left:2rem!important;padding-right:2rem!important}.tw-py-4{padding-bottom:1rem!important;padding-top:1rem!important}.tw-py-6{padding-bottom:1.5rem!important;padding-top:1.5rem!important}.tw-text-2xl{font-size:1.5rem!important;line-height:2rem!important}.tw-text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.tw-text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.tw-text-white{--tw-text-opacity:1!important;color:rgb(255 255 255/var(--tw-text-opacity))!important}.\\[\\&\\>slot\\[name\\=\\\"message\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-text-2xl>slot[name=message]::slotted(*){font-size:1.5rem!important;line-height:2rem!important}.\\[\\&\\>slot\\[name\\=\\\"subtitle\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-mb-8>slot[name=subtitle]::slotted(*){margin-bottom:2rem!important}.\\[\\&\\>slot\\[name\\=\\\"subtitle\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-text-4xl>slot[name=subtitle]::slotted(*){font-size:2.25rem!important;line-height:2.5rem!important}.\\[\\&\\>slot\\[name\\=\\\"subtitle\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-font-bold>slot[name=subtitle]::slotted(*){font-weight:700!important}.\\[\\&\\>svg\\]\\:tw-mr-4>svg{margin-right:1rem!important}.\\[\\&\\>svg\\]\\:tw-h-\\[1\\.5em\\]>svg{height:1.5em!important}.\\[\\&\\>svg\\]\\:tw-fill-current>svg{fill:currentColor!important}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}";
6
+ const UofgAlertStyle0 = uofgAlertCss;
6
7
 
7
8
  const UofgAlert$1 = /*@__PURE__*/ proxyCustomElement(class UofgAlert extends HTMLElement {
8
- constructor() {
9
- super();
10
- this.__registerHost();
11
- this.__attachShadow();
12
- }
13
- render() {
14
- return (h("div", { id: "uofg-alert" }, h("div", { id: "uofg-alert-title" }, h(FontAwesomeIcon, { icon: faCircleExclamation }), h("slot", { name: "title" })), h("div", { id: "uofg-alert-body" }, h("slot", { name: "subtitle" }), h("slot", { name: "message" })), h("div", { id: "uofg-alert-footer" }, h("slot", { name: "footer" }))));
15
- }
16
- static get style() { return uofgAlertCss; }
9
+ constructor() {
10
+ super();
11
+ this.__registerHost();
12
+ this.__attachShadow();
13
+ }
14
+ render() {
15
+ return (h("div", { key: '43637578cd80a54999db4a08bf6a5fa09c76c402', class: "tw-flex tw-flex-col tw-text-3xl" }, h("div", { key: '22313ab033d01b2271fd7dfe7d7747b5fd59e776', class: "tw-flex tw-items-center tw-bg-uofg-red tw-p-8 tw-text-4xl tw-text-white [&>svg]:tw-mr-4 [&>svg]:tw-h-[1.5em] [&>svg]:tw-fill-current" }, h(FontAwesomeIcon, { key: 'a742d78bcb8a8215d55a6270eabba0a53b165f26', icon: faCircleExclamation }), h("slot", { key: '5afc5e3a18c0fb3ab5662af2fa912752fda379c8', name: "title" })), h("div", { key: 'd2ff3754074ce3b5e7e254cdf72711b1174222a7', class: 'tw-flex tw-flex-col tw-bg-white tw-px-8 tw-py-6 [&>slot[name="message"]::slotted(*)]:tw-text-2xl [&>slot[name="subtitle"]::slotted(*)]:tw-mb-8 [&>slot[name="subtitle"]::slotted(*)]:tw-text-4xl [&>slot[name="subtitle"]::slotted(*)]:tw-font-bold' }, h("slot", { key: '261b7f2434eecdc63cd0746bdb11539be6e3edf9', name: "subtitle" }), h("slot", { key: '438ef72be3746c53ee8f628e553163a7af93fe3e', name: "message" })), h("div", { key: '6b3a020c4a6d98e7f7fe90b922a0be997a6f341a', class: "tw-flex tw-bg-uofg-grey tw-py-4 tw-px-8 tw-text-2xl" }, h("slot", { key: '588ae6afce9d76c96768b807c3135cb1714f2889', name: "footer" }))));
16
+ }
17
+ static get style() { return UofgAlertStyle0; }
17
18
  }, [1, "uofg-alert"]);
18
19
  function defineCustomElement$1() {
19
- if (typeof customElements === "undefined") {
20
- return;
21
- }
22
- const components = ["uofg-alert"];
23
- components.forEach(tagName => { switch (tagName) {
24
- case "uofg-alert":
25
- if (!customElements.get(tagName)) {
26
- customElements.define(tagName, UofgAlert$1);
27
- }
28
- break;
29
- } });
20
+ if (typeof customElements === "undefined") {
21
+ return;
22
+ }
23
+ const components = ["uofg-alert"];
24
+ components.forEach(tagName => { switch (tagName) {
25
+ case "uofg-alert":
26
+ if (!customElements.get(tagName)) {
27
+ customElements.define(tagName, UofgAlert$1);
28
+ }
29
+ break;
30
+ } });
30
31
  }
31
32
 
32
33
  const UofgAlert = UofgAlert$1;
@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
2
2
 
3
3
  interface UofgBackToTop extends Components.UofgBackToTop, HTMLElement {}
4
4
  export const UofgBackToTop: {
5
- prototype: UofgBackToTop;
6
- new (): UofgBackToTop;
5
+ prototype: UofgBackToTop;
6
+ new (): UofgBackToTop;
7
7
  };
8
8
  /**
9
9
  * Used to define this component and all nested components recursively.
@@ -2,44 +2,48 @@ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/clien
2
2
  import { F as FontAwesomeIcon } from './font-awesome-icon.js';
3
3
  import { a as faChevronUp } from './index2.js';
4
4
 
5
- const uofgBackToTopCss = ":host{display:block}:focus-visible{outline:2px solid #ffc72a;outline-offset:0.5rem}#uofg-back-to-top{position:fixed;margin:10px;height:35px;width:35px;right:0;bottom:0;z-index:1000;cursor:pointer;background-color:black;color:white;transition-duration:0.3s;transition-timing-function:ease-in-out;transition-property:opacity, visibility, background-color;opacity:0;visibility:hidden;border-radius:50%;border:1px solid #fff}#uofg-back-to-top:hover{background-color:#d50029}#uofg-back-to-top>svg{width:1em;height:1em;fill:currentColor}#uofg-back-to-top.visible{opacity:1;visibility:visible}";
5
+ const uofgBackToTopCss = ":host{display:block}@defaults border-spacing{--tw-border-spacing-x:0;--tw-border-spacing-y:0}@defaults transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1}@defaults touch-action{}@defaults scroll-snap-type{--tw-scroll-snap-strictness:proximity}@defaults gradient-color-stops{}@defaults font-variant-numeric{}@defaults box-shadow{--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}@defaults ring-width{--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}@defaults filter{}@defaults backdrop-filter{}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}.tw-fixed{position:fixed!important}.tw-bottom-0{bottom:0!important}.tw-right-0{right:0!important}.tw-z-\\[1000\\]{z-index:1000!important}.tw-m-4{margin:1rem!important}.tw-flex{display:flex!important}.tw-h-\\[3\\.5rem\\]{height:3.5rem!important}.tw-w-\\[3\\.5rem\\]{width:3.5rem!important}.tw-cursor-pointer{cursor:pointer!important}.tw-items-center{align-items:center!important}.tw-justify-center{justify-content:center!important}.tw-rounded-\\[50\\%\\]{border-radius:50%!important}.tw-border{border-width:1px!important}.tw-border-solid{border-style:solid!important}.tw-border-white{--tw-border-opacity:1!important;border-color:rgb(255 255 255/var(--tw-border-opacity))!important}.tw-bg-black{--tw-bg-opacity:1!important;background-color:rgb(0 0 0/var(--tw-bg-opacity))!important}.tw-fill-current{fill:currentColor!important}.tw-text-white{--tw-text-opacity:1!important;color:rgb(255 255 255/var(--tw-text-opacity))!important}.tw-opacity-0{opacity:0!important}.tw-opacity-100{opacity:1!important}.tw-transition{transition-duration:.15s!important;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.hocus\\:tw-bg-uofg-red:focus,.hocus\\:tw-bg-uofg-red:hover{--tw-bg-opacity:1!important;background-color:rgb(194 4 48/var(--tw-bg-opacity))!important}.\\[\\&\\>svg\\]\\:tw-h-\\[1em\\]>svg{height:1em!important}.\\[\\&\\>svg\\]\\:tw-fill-current>svg{fill:currentColor!important}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}";
6
+ const UofgBackToTopStyle0 = uofgBackToTopCss;
6
7
 
7
8
  const UofgBackToTop$1 = /*@__PURE__*/ proxyCustomElement(class UofgBackToTop extends HTMLElement {
8
- constructor() {
9
- super();
10
- this.__registerHost();
11
- this.__attachShadow();
12
- this.threshold = 50;
13
- this.isVisible = false;
14
- }
15
- connectedCallback() {
16
- this.onScroll();
17
- }
18
- onScroll() {
19
- this.isVisible = window.scrollY >= this.threshold;
20
- }
21
- render() {
22
- return (h("button", { id: "uofg-back-to-top", "aria-label": "Go back to the top", class: { visible: this.isVisible }, onClick: () => {
23
- window.scrollTo({ top: 0, behavior: 'smooth' });
24
- } }, h(FontAwesomeIcon, { icon: faChevronUp })));
25
- }
26
- static get style() { return uofgBackToTopCss; }
9
+ constructor() {
10
+ super();
11
+ this.__registerHost();
12
+ this.__attachShadow();
13
+ this.threshold = 50;
14
+ this.isVisible = false;
15
+ }
16
+ connectedCallback() {
17
+ this.onScroll();
18
+ }
19
+ onScroll() {
20
+ this.isVisible = window.scrollY >= this.threshold;
21
+ }
22
+ render() {
23
+ return (h("button", { key: '5224240c1039f7484aca93cc6e7014d9cfb06702', "aria-label": "Go back to the top", class: {
24
+ 'tw-opacity-100': this.isVisible,
25
+ 'tw-fixed tw-bottom-0 tw-right-0 tw-z-[1000] tw-m-4 tw-flex tw-h-[3.5rem] tw-w-[3.5rem] tw-cursor-pointer tw-items-center tw-justify-center tw-rounded-[50%] tw-border tw-border-solid tw-border-white tw-bg-black tw-text-white tw-opacity-0 tw-transition hocus:tw-bg-uofg-red [&>svg]:tw-h-[1em] [&>svg]:tw-fill-current': true,
26
+ }, onClick: () => {
27
+ window.scrollTo({ top: 0, behavior: 'smooth' });
28
+ } }, h(FontAwesomeIcon, { key: '5674c3ab4da096c466e75aeaf446c8335a569ffd', icon: faChevronUp })));
29
+ }
30
+ static get style() { return UofgBackToTopStyle0; }
27
31
  }, [1, "uofg-back-to-top", {
28
- "threshold": [2],
29
- "isVisible": [32]
30
- }, [[9, "scroll", "onScroll"]]]);
32
+ "threshold": [2],
33
+ "isVisible": [32]
34
+ }, [[9, "scroll", "onScroll"]]]);
31
35
  function defineCustomElement$1() {
32
- if (typeof customElements === "undefined") {
33
- return;
34
- }
35
- const components = ["uofg-back-to-top"];
36
- components.forEach(tagName => { switch (tagName) {
37
- case "uofg-back-to-top":
38
- if (!customElements.get(tagName)) {
39
- customElements.define(tagName, UofgBackToTop$1);
40
- }
41
- break;
42
- } });
36
+ if (typeof customElements === "undefined") {
37
+ return;
38
+ }
39
+ const components = ["uofg-back-to-top"];
40
+ components.forEach(tagName => { switch (tagName) {
41
+ case "uofg-back-to-top":
42
+ if (!customElements.get(tagName)) {
43
+ customElements.define(tagName, UofgBackToTop$1);
44
+ }
45
+ break;
46
+ } });
43
47
  }
44
48
 
45
49
  const UofgBackToTop = UofgBackToTop$1;
@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
2
2
 
3
3
  interface UofgCard extends Components.UofgCard, HTMLElement {}
4
4
  export const UofgCard: {
5
- prototype: UofgCard;
6
- new (): UofgCard;
5
+ prototype: UofgCard;
6
+ new (): UofgCard;
7
7
  };
8
8
  /**
9
9
  * Used to define this component and all nested components recursively.
@@ -1,34 +1,37 @@
1
1
  import { proxyCustomElement, HTMLElement, h, Fragment } from '@stencil/core/internal/client';
2
2
 
3
- const uofgCardCss = "*{box-sizing:border-box}button{border:none;background-color:transparent;cursor:pointer}a{color:inherit;text-decoration:none}ul{list-style:none;padding:0;margin:unset}ul>li{display:contents}:focus-visible{outline:2px solid #ffc72a;outline-offset:0.5rem}:host{display:block;width:300px;margin:1rem}#uofg-card{display:flex;flex-direction:column;background-color:#f1f8fa;font-size:1.6rem;border-radius:5px;overflow:hidden}a#uofg-card{border:1px solid transparent;transition-property:border-color;transition-duration:0.2s;transition-timing-function:ease-in-out}a#uofg-card:hover,a#uofg-card:focus,a#uofg-card:focus-within{border-color:#69a3b9}#uofg-card-img{display:flex;justify-content:center;align-items:center;overflow:hidden}#uofg-card-img>slot::slotted(img){width:100%;object-fit:cover;transition-property:transform;transition-duration:0.2s;transition-timing-function:ease-in-out}a#uofg-card:hover #uofg-card-img>slot::slotted(img),a#uofg-card:focus #uofg-card-img>slot::slotted(img),a#uofg-card:focus-within #uofg-card-img>slot::slotted(img){transform:scale(1.1)}#uofg-card-content{padding:1rem}#uofg-card-content>slot[name=title]::slotted(*){font-size:2.25rem;font-weight:normal;margin:0;padding:1rem 0}#uofg-card-content>slot[name=subtitle]::slotted(*){font-size:1.8rem;font-weight:normal;margin:0;padding:1rem 0}#uofg-card-content>slot[name=body]::slotted(*){font-size:1.6rem;font-weight:normal;margin:0}#uofg-card-footer{background-color:#bedae3}";
3
+ const uofgCardCss = ":host{display:block;width:300px;margin:1rem}*{box-sizing:border-box}a{text-decoration:none;color:inherit}button{border:none;background:none;cursor:pointer;font-size:inherit;font-family:inherit;color:inherit;line-height:inherit;word-spacing:inherit;letter-spacing:inherit}ul{list-style:none;padding:0;margin:0}@defaults border-spacing{--tw-border-spacing-x:0;--tw-border-spacing-y:0}@defaults transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1}@defaults touch-action{}@defaults scroll-snap-type{--tw-scroll-snap-strictness:proximity}@defaults gradient-color-stops{}@defaults font-variant-numeric{}@defaults box-shadow{--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}@defaults ring-width{--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}@defaults filter{}@defaults backdrop-filter{}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}.tw-flex{display:flex!important}.tw-flex-col{flex-direction:column!important}.tw-items-center{align-items:center!important}.tw-justify-center{justify-content:center!important}.tw-overflow-hidden{overflow:hidden!important}.tw-rounded{border-radius:.25rem!important}.tw-border{border-width:1px!important}.tw-border-solid{border-style:solid!important}.tw-border-transparent{border-color:transparent!important}.tw-bg-uofg-blue-200{--tw-bg-opacity:1!important;background-color:rgb(190 218 227/var(--tw-bg-opacity))!important}.tw-bg-uofg-blue-50{--tw-bg-opacity:1!important;background-color:rgb(241 248 250/var(--tw-bg-opacity))!important}.tw-p-4{padding:1rem!important}.tw-px-4{padding-left:1rem!important;padding-right:1rem!important}.tw-py-2{padding-bottom:.5rem!important;padding-top:.5rem!important}.tw-text-2xl{font-size:1.5rem!important;line-height:2rem!important}.tw-transition-colors{transition-duration:.15s!important;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.focus-within\\:tw-border-uofg-blue-400:focus-within{--tw-border-opacity:1!important;border-color:rgb(105 163 185/var(--tw-border-opacity))!important}.hocus\\:tw-border-uofg-blue-400:focus,.hocus\\:tw-border-uofg-blue-400:hover{--tw-border-opacity:1!important;border-color:rgb(105 163 185/var(--tw-border-opacity))!important}.\\[\\&\\>div\\>slot\\:\\:slotted\\(img\\)\\]\\:hocus\\:tw-scale-110:hover>div>slot::slotted(img){--tw-scale-x:1.1!important;--tw-scale-y:1.1!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.\\[\\&\\>div\\>slot\\:\\:slotted\\(img\\)\\]\\:hocus\\:tw-transform:hover>div>slot::slotted(img){transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.\\[\\&\\>div\\>slot\\:\\:slotted\\(img\\)\\]\\:hocus\\:tw-transition-transform:hover>div>slot::slotted(img){transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.\\[\\&\\>div\\>slot\\:\\:slotted\\(img\\)\\]\\:hocus\\:tw-scale-110:focus>div>slot::slotted(img){--tw-scale-x:1.1!important;--tw-scale-y:1.1!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.\\[\\&\\>div\\>slot\\:\\:slotted\\(img\\)\\]\\:hocus\\:tw-transform:focus>div>slot::slotted(img){transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.\\[\\&\\>div\\>slot\\:\\:slotted\\(img\\)\\]\\:hocus\\:tw-transition-transform:focus>div>slot::slotted(img){transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.\\[\\&\\>slot\\:\\:slotted\\(img\\)\\]\\:tw-w-full>slot::slotted(img){width:100%!important}.\\[\\&\\>slot\\:\\:slotted\\(img\\)\\]\\:tw-object-cover>slot::slotted(img){object-fit:cover!important}.\\[\\&\\>slot\\:\\:slotted\\(img\\)\\]\\:tw-transition-transform>slot::slotted(img){transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.\\[\\&\\>slot\\[name\\=\\\"body\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-m-0>slot[name=body]::slotted(*){margin:0!important}.\\[\\&\\>slot\\[name\\=\\\"body\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-text-xl>slot[name=body]::slotted(*){font-size:1.25rem!important;line-height:1.75rem!important}.\\[\\&\\>slot\\[name\\=\\\"body\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-font-normal>slot[name=body]::slotted(*){font-weight:400!important}.\\[\\&\\>slot\\[name\\=\\\"subtitle\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-m-0>slot[name=subtitle]::slotted(*){margin:0!important}.\\[\\&\\>slot\\[name\\=\\\"subtitle\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-py-4>slot[name=subtitle]::slotted(*){padding-bottom:1rem!important;padding-top:1rem!important}.\\[\\&\\>slot\\[name\\=\\\"subtitle\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-text-2xl>slot[name=subtitle]::slotted(*){font-size:1.5rem!important;line-height:2rem!important}.\\[\\&\\>slot\\[name\\=\\\"subtitle\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-font-normal>slot[name=subtitle]::slotted(*){font-weight:400!important}.\\[\\&\\>slot\\[name\\=\\\"title\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-m-0>slot[name=title]::slotted(*){margin:0!important}.\\[\\&\\>slot\\[name\\=\\\"title\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-py-4>slot[name=title]::slotted(*){padding-bottom:1rem!important;padding-top:1rem!important}.\\[\\&\\>slot\\[name\\=\\\"title\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-text-4xl>slot[name=title]::slotted(*){font-size:2.25rem!important;line-height:2.5rem!important}.\\[\\&\\>slot\\[name\\=\\\"title\\\"\\]\\:\\:slotted\\(\\*\\)\\]\\:tw-font-normal>slot[name=title]::slotted(*){font-weight:400!important}";
4
+ const UofgCardStyle0 = uofgCardCss;
4
5
 
5
6
  const UofgCard$1 = /*@__PURE__*/ proxyCustomElement(class UofgCard extends HTMLElement {
6
- constructor() {
7
- super();
8
- this.__registerHost();
9
- this.__attachShadow();
10
- this.href = undefined;
11
- }
12
- render() {
13
- const Body = () => (h(Fragment, null, h("div", { id: "uofg-card-img" }, h("slot", { name: "img" })), h("div", { id: "uofg-card-content" }, h("slot", { name: "title" }), h("slot", { name: "subtitle" }), h("slot", { name: "body" })), h("div", { id: "uofg-card-footer" }, h("slot", { name: "footer" }))));
14
- return this.href ? (h("a", { href: this.href, id: "uofg-card" }, h(Body, null))) : (h("div", { id: "uofg-card" }, h(Body, null)));
15
- }
16
- static get style() { return uofgCardCss; }
7
+ constructor() {
8
+ super();
9
+ this.__registerHost();
10
+ this.__attachShadow();
11
+ this.href = undefined;
12
+ }
13
+ render() {
14
+ var _a;
15
+ const Body = () => (h(Fragment, { key: '8eb35c1aaeb19f187b7dbcb9be2990a947128c06' }, h("div", { key: '6812c189df6d70a5495db38d14fb37f656892603', class: "tw-flex tw-items-center tw-justify-center tw-overflow-hidden [&>slot::slotted(img)]:tw-w-full [&>slot::slotted(img)]:tw-object-cover [&>slot::slotted(img)]:tw-transition-transform" }, h("slot", { key: '65a609cdbc7b3e5bf9364bef31f6e063932568cf', name: "img" })), h("div", { key: '3d936244cb22e8b74e24745a059b8decdcd7868c', class: 'tw-flex tw-p-4 tw-flex-col [&>slot[name="body"]::slotted(*)]:tw-m-0 [&>slot[name="body"]::slotted(*)]:tw-text-xl [&>slot[name="body"]::slotted(*)]:tw-font-normal [&>slot[name="subtitle"]::slotted(*)]:tw-m-0 [&>slot[name="subtitle"]::slotted(*)]:tw-py-4 [&>slot[name="subtitle"]::slotted(*)]:tw-text-2xl [&>slot[name="subtitle"]::slotted(*)]:tw-font-normal [&>slot[name="title"]::slotted(*)]:tw-m-0 [&>slot[name="title"]::slotted(*)]:tw-py-4 [&>slot[name="title"]::slotted(*)]:tw-text-4xl [&>slot[name="title"]::slotted(*)]:tw-font-normal' }, h("slot", { key: '4db7245929e655f4acbeab7f603b22464caf096e', name: "title" }), h("slot", { key: 'b0482adba0ca4a994f6d3f100e1c483cb6a72452', name: "subtitle" }), h("slot", { key: '083146dd845200f2356c88535a8127f65f7ab229', name: "body" })), h("div", { key: 'fa7c4af274ad6865bd2e12d291f45469cb40952f', class: "tw-bg-uofg-blue-200 tw-px-4 tw-py-2" }, h("slot", { key: '8197a63f9551f979b8f7426370c098ec8aa8f37b', name: "footer" }))));
16
+ const classes = 'tw-flex tw-flex-col tw-bg-uofg-blue-50 tw-text-2xl tw-rounded tw-overflow-hidden';
17
+ return ((_a = this === null || this === void 0 ? void 0 : this.href) !== null && _a !== void 0 ? _a : '') != '' ? (h("a", { href: this.href, class: `${classes} tw-border tw-border-solid tw-border-transparent tw-transition-colors focus-within:tw-border-uofg-blue-400 hocus:tw-border-uofg-blue-400 [&>div>slot::slotted(img)]:hocus:tw-scale-110 [&>div>slot::slotted(img)]:hocus:tw-transform [&>div>slot::slotted(img)]:hocus:tw-transition-transform` }, h(Body, null))) : (h("div", { class: classes }, h(Body, null)));
18
+ }
19
+ static get style() { return UofgCardStyle0; }
17
20
  }, [1, "uofg-card", {
18
- "href": [1]
19
- }]);
21
+ "href": [1]
22
+ }]);
20
23
  function defineCustomElement$1() {
21
- if (typeof customElements === "undefined") {
22
- return;
23
- }
24
- const components = ["uofg-card"];
25
- components.forEach(tagName => { switch (tagName) {
26
- case "uofg-card":
27
- if (!customElements.get(tagName)) {
28
- customElements.define(tagName, UofgCard$1);
29
- }
30
- break;
31
- } });
24
+ if (typeof customElements === "undefined") {
25
+ return;
26
+ }
27
+ const components = ["uofg-card"];
28
+ components.forEach(tagName => { switch (tagName) {
29
+ case "uofg-card":
30
+ if (!customElements.get(tagName)) {
31
+ customElements.define(tagName, UofgCard$1);
32
+ }
33
+ break;
34
+ } });
32
35
  }
33
36
 
34
37
  const UofgCard = UofgCard$1;
@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
2
2
 
3
3
  interface UofgFooter extends Components.UofgFooter, HTMLElement {}
4
4
  export const UofgFooter: {
5
- prototype: UofgFooter;
6
- new (): UofgFooter;
5
+ prototype: UofgFooter;
6
+ new (): UofgFooter;
7
7
  };
8
8
  /**
9
9
  * Used to define this component and all nested components recursively.