@uoguelph/web-components 1.1.3 → 1.2.0-rc.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.
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-bce5df9d.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
@@ -3,186 +3,196 @@ import { F as FontAwesomeIcon } from './font-awesome-icon.js';
3
3
  import { b as faTimes } from './index2.js';
4
4
  import { g as getAllFocusableElements } from './utils.js';
5
5
 
6
- const uofgModalCss = ":host{visibility:visible !important;position:relative !important;z-index:100000 !important}:focus-visible{outline:2px solid #ffc72a;outline-offset:0.5rem}*{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}#uofg-modal{display:flex;position:fixed;top:0;left:0;z-index:10000;width:100vw;height:100vh;background-color:rgba(0, 0, 0, 0.5);visibility:hidden;opacity:0;transition-property:opacity, visibility;transition-duration:0.2s;transition-timing-function:ease-in-out}#uofg-modal.open{visibility:visible;opacity:1}#uofg-modal-dismiss{display:flex;justify-content:center;align-items:center;position:absolute;top:2rem;right:2rem;padding:0.5rem;height:3.5rem;width:3.5rem;font-size:2rem;line-height:1;color:var(--uofg-modal-dismiss-color, white);z-index:2}#uofg-modal-dismiss>svg{display:block;height:1em;fill:currentColor}#uofg-modal-content{position:absolute;width:fit-content;height:fit-content;width:-moz-max-content;height:-moz-max-content;padding:2rem;max-width:100%;max-height:100%;left:50%;transform:translate(-50%, -50px);z-index:1;overflow:auto;transition-property:transform;transition-duration:0.2s;transition-timing-function:ease-in-out}#uofg-modal-content.centered{top:50%;transform:translate(-50%, calc(-50% - 50px))}#uofg-modal.open #uofg-modal-content{visibility:visible;opacity:1;transform:translate(-50%, 0)}#uofg-modal.open #uofg-modal-content.centered{transform:translate(-50%, -50%)}@media (prefers-reduced-motion: reduce){#uofg-modal-content{transition:none}}";
6
+ const uofgModalCss = ":host{visibility:visible !important;position:relative !important;z-index:100000 !important}@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-visible{visibility:visible!important}.tw-invisible{visibility:hidden!important}.tw-fixed{position:fixed!important}.tw-absolute{position:absolute!important}.tw-left-0{left:0!important}.tw-left-1\\/2{left:50%!important}.tw-right-8{right:2rem!important}.tw-top-0{top:0!important}.tw-top-8{top:2rem!important}.tw-z-\\[1000\\]{z-index:1000!important}.tw-z-\\[2\\]{z-index:2!important}.tw-flex{display:flex!important}.tw-h-12{height:3rem!important}.tw-h-fit{height:fit-content!important}.tw-h-screen{height:100vh!important}.tw-max-h-full{max-height:100%!important}.tw-w-12{width:3rem!important}.tw-w-fit{width:fit-content!important}.tw-w-screen{width:100vw!important}.tw-max-w-full{max-width:100%!important}.-tw-translate-x-1\\/2{--tw-translate-x:-50%!important}.-tw-translate-x-1\\/2,.tw-translate-y-\\[-50px\\]{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}.tw-translate-y-\\[-50px\\]{--tw-translate-y:-50px!important}.tw-translate-y-\\[calc\\(-50\\%_-_50px\\)\\]{--tw-translate-y:calc(-50% - 50px)!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}.tw-items-center{align-items:center!important}.tw-justify-center{justify-content:center!important}.tw-overflow-auto{overflow:auto!important}.tw-border-0{border-width:0!important}.tw-bg-black{--tw-bg-opacity:1!important;background-color:rgb(0 0 0/var(--tw-bg-opacity))!important}.tw-bg-transparent{background-color:transparent!important}.tw-bg-opacity-50{--tw-bg-opacity:0.5!important}.tw-p-2{padding:.5rem!important}.tw-p-8{padding:2rem!important}.tw-text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.tw-text-\\[var\\(--uofg-modal-dismiss-color\\,white\\)\\]{color:var(--uofg-modal-dismiss-color,#fff)!important}.tw-opacity-0{opacity:0!important}.tw-opacity-100{opacity:1!important}.tw-transition-\\[opacity\\,visibility\\]{transition-duration:.15s!important;transition-property:opacity,visibility!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.tw-transition-transform{transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}@media (prefers-reduced-motion:reduce){.motion-reduce\\:tw-transition-none{transition-property:none!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;}";
7
+ const UofgModalStyle0 = uofgModalCss;
7
8
 
8
9
  const UofgModal$1 = /*@__PURE__*/ proxyCustomElement(class UofgModal extends HTMLElement {
9
- constructor() {
10
- super();
11
- this.__registerHost();
12
- this.__attachShadow();
13
- this.opened = createEvent(this, "opened", 2);
14
- this.closed = createEvent(this, "closed", 2);
15
- this.inertElements = [];
16
- this.label = undefined;
17
- this.alertDialog = false;
18
- this.centered = false;
19
- this.staticBackdrop = false;
20
- this.autoOpen = false;
21
- this.isOpen = false;
22
- }
23
- connectedCallback() {
24
- // Bind event handlers so that 'this' is always the component instance.
25
- this.handleClick = this.handleClick.bind(this);
26
- this.handleKeyUp = this.handleKeyUp.bind(this);
27
- this.handleFocusOut = this.handleFocusOut.bind(this);
28
- if (this.autoOpen) {
29
- this.isOpen = true;
10
+ constructor() {
11
+ super();
12
+ this.__registerHost();
13
+ this.__attachShadow();
14
+ this.opened = createEvent(this, "opened", 2);
15
+ this.closed = createEvent(this, "closed", 2);
16
+ this.inertElements = [];
17
+ this.label = undefined;
18
+ this.alertDialog = false;
19
+ this.centered = false;
20
+ this.staticBackdrop = false;
21
+ this.autoOpen = false;
22
+ this.isOpen = false;
30
23
  }
31
- }
32
- disconnectedCallback() {
33
- // Just in case the modal is removed from the DOM before it is closed, make sure to remove the inert attribute from all elements that we marked as inert when the modal was opened.
34
- for (const element of this.inertElements) {
35
- element.removeAttribute('inert');
24
+ connectedCallback() {
25
+ // Bind event handlers so that 'this' is always the component instance.
26
+ this.handleClick = this.handleClick.bind(this);
27
+ this.handleKeyUp = this.handleKeyUp.bind(this);
28
+ this.handleFocusOut = this.handleFocusOut.bind(this);
29
+ if (this.autoOpen) {
30
+ this.isOpen = true;
31
+ }
32
+ }
33
+ disconnectedCallback() {
34
+ // Just in case the modal is removed from the DOM before it is closed, make sure to remove the inert attribute from all elements that we marked as inert when the modal was opened.
35
+ for (const element of this.inertElements) {
36
+ element.removeAttribute('inert');
37
+ }
36
38
  }
37
- }
38
- handleClick(e) {
39
- if (!this.staticBackdrop && e.target === e.currentTarget) {
40
- this.isOpen = false;
39
+ handleClick(e) {
40
+ if (!this.staticBackdrop && e.target === e.currentTarget) {
41
+ this.isOpen = false;
42
+ }
41
43
  }
42
- }
43
- handleKeyUp(e) {
44
- if (e.key === 'Escape') {
45
- this.isOpen = false;
44
+ handleKeyUp(e) {
45
+ if (e.key === 'Escape') {
46
+ this.isOpen = false;
47
+ }
46
48
  }
47
- }
48
- handleFocusOut(e) {
49
- var _a;
50
- if (!this.isOpen)
51
- return; // Don't do anything if the modal is closed.
52
- const relatedTarget = e.relatedTarget;
53
- // If the focus is moving outside of the modal
54
- if (!this.container.contains(relatedTarget) && !this.el.contains(relatedTarget)) {
55
- e.preventDefault();
56
- // If the focus is moving away from the dismiss button, focus the last focusable element in the modal.
57
- if (e.target === this.dismissButton) {
58
- const focusableElements = getAllFocusableElements(this.el);
59
- (_a = focusableElements[focusableElements.length - 1]) === null || _a === void 0 ? void 0 : _a.focus();
60
- }
61
- else {
62
- // Otherwise, focus the dismiss button.
63
- this.dismissButton.focus();
64
- }
49
+ handleFocusOut(e) {
50
+ var _a;
51
+ if (!this.isOpen)
52
+ return; // Don't do anything if the modal is closed.
53
+ const relatedTarget = e.relatedTarget;
54
+ // If the focus is moving outside the modal
55
+ if (!this.container.contains(relatedTarget) && !this.el.contains(relatedTarget)) {
56
+ e.preventDefault();
57
+ // If the focus is moving away from the dismiss button, focus the last focusable element in the modal.
58
+ if (e.target === this.dismissButton) {
59
+ const focusableElements = getAllFocusableElements(this.el);
60
+ (_a = focusableElements[focusableElements.length - 1]) === null || _a === void 0 ? void 0 : _a.focus();
61
+ }
62
+ else {
63
+ // Otherwise, focus the dismiss button.
64
+ this.dismissButton.focus();
65
+ }
66
+ }
65
67
  }
66
- }
67
- handleIsOpenChange(newValue) {
68
- if (newValue === true) {
69
- window.requestAnimationFrame(() => {
70
- window.requestAnimationFrame(() => {
71
- window.requestAnimationFrame(() => {
72
- // Focus the container element when the modal is opened, so that the screen reader's will announce the modal when it opens.
73
- this.container.focus();
74
- });
75
- });
76
- });
77
- // Mark outer elements as inert when the modal is open.
78
- let current = this.el;
79
- // We want to mark all elements outside of the modal as inert, so we need to traverse up the DOM tree until we reach the body element.
80
- while (current !== null && current !== document.body) {
81
- const parent = current.parentElement;
82
- // If parent is null, then we may be inside a shadow root. If so, we get the host element and continue traversing up the DOM tree.
83
- if (parent === null) {
84
- const root = current.getRootNode();
85
- if (root instanceof ShadowRoot) {
86
- current = root.host;
87
- continue;
88
- }
68
+ handleIsOpenChange(newValue) {
69
+ if (newValue) {
70
+ window.requestAnimationFrame(() => {
71
+ window.requestAnimationFrame(() => {
72
+ window.requestAnimationFrame(() => {
73
+ // Focus the container element when the modal is opened, so that the screen reader's will announce the modal when it opens.
74
+ this.container.focus();
75
+ });
76
+ });
77
+ });
78
+ // Mark outer elements as inert when the modal is open.
79
+ let current = this.el;
80
+ // We want to mark all elements outside the modal as inert, so we need to traverse up the DOM tree until we reach the body element.
81
+ while (current !== null && current !== document.body) {
82
+ const parent = current.parentElement;
83
+ // If parent is null, then we may be inside a shadow root. If so, we get the host element and continue traversing up the DOM tree.
84
+ if (parent === null) {
85
+ const root = current.getRootNode();
86
+ if (root instanceof ShadowRoot) {
87
+ current = root.host;
88
+ continue;
89
+ }
90
+ }
91
+ if (parent !== null) {
92
+ for (const child of parent.children) {
93
+ if (child !== current && !child.inert) {
94
+ // Mark the element as inert and store it in an array so that we can remove the inert attribute when the modal closes.
95
+ child.inert = true;
96
+ this.inertElements.push(child);
97
+ }
98
+ }
99
+ }
100
+ current = parent;
101
+ this.opened.emit();
102
+ }
89
103
  }
90
- if (parent !== null) {
91
- for (const child of parent.children) {
92
- if (child !== current && !child.inert) {
93
- // Mark the element as inert and store it in an array so that we can remove the inert attribute when the modal closes.
94
- child.inert = true;
95
- this.inertElements.push(child);
104
+ else {
105
+ // Remove the inert attribute from all elements that we marked as inert when the modal was opened.
106
+ for (const element of this.inertElements) {
107
+ element.removeAttribute('inert');
96
108
  }
97
- }
109
+ // Clear the array of inert elements. This is important because we don't want to keep a reference to elements as they may be removed from the DOM and we could cause a memory leak.
110
+ this.inertElements = [];
111
+ this.closed.emit();
98
112
  }
99
- current = parent;
100
- this.opened.emit();
101
- }
113
+ // Prevent scrolling of the body when the modal is open.
114
+ document.body.style.overflow = newValue ? 'hidden' : '';
115
+ }
116
+ render() {
117
+ return (h("div", { key: 'c66f0986068658cc29b9c12715381a0fd40678c9', class: {
118
+ 'tw-visible tw-opacity-100': this.isOpen,
119
+ 'tw-invisible tw-opacity-0': !this.isOpen,
120
+ 'tw-fixed tw-left-0 tw-top-0 tw-z-[1000] tw-flex tw-h-screen tw-w-screen tw-bg-black tw-bg-opacity-50 tw-transition-[opacity,visibility]': true,
121
+ }, role: this.alertDialog ? 'alertdialog' : 'dialog', "aria-modal": this.isOpen ? 'true' : '', "aria-label": this.label, tabIndex: -1, onClick: this.handleClick, onKeyUp: this.handleKeyUp, onFocusout: this.handleFocusOut, ref: (el) => (this.container = el) }, h("div", { key: 'f6d05f9834e3d5398aa5cd0897605d5b16014c2e', part: "content", class: {
122
+ 'tw-visible tw-opacity-100': this.isOpen,
123
+ 'tw-translate-y-[calc(-50%_-_50px)]': !this.isOpen && this.centered,
124
+ 'tw-translate-y-[-50px]': (!this.isOpen && !this.centered) || (this.isOpen && this.centered),
125
+ 'tw-z-1 tw-absolute tw-left-1/2 tw-h-fit tw-max-h-full tw-w-fit tw-max-w-full -tw-translate-x-1/2 tw-overflow-auto tw-p-8 tw-transition-transform motion-reduce:tw-transition-none': true,
126
+ } }, h("button", { key: 'eecbcc13c724410cb085bec5e26f6a2a4c55c32a', class: "[&>svg]:h-[1em] tw-absolute tw-right-8 tw-top-8 tw-z-[2] tw-flex tw-h-12 tw-w-12 tw-items-center tw-justify-center tw-border-0 tw-bg-transparent tw-text-3xl tw-p-2 tw-text-[var(--uofg-modal-dismiss-color,white)] [&>svg]:tw-h-[1em] [&>svg]:tw-fill-current", part: "dismiss-button", "aria-label": "Close modal", ref: (el) => (this.dismissButton = el), onClick: () => (this.isOpen = false) }, h(FontAwesomeIcon, { key: '735ceec0b5bbace91a40db729d7b530767b8593a', icon: faTimes })), h("slot", { key: 'b3b156aa4d3859a1d827a9d826a8d91b8f379f18' }))));
127
+ }
128
+ /**
129
+ * Get the current state of the modal.
130
+ * @returns A promise which will resolve to true when the modal is open, or false when the modal is closed.
131
+ */
132
+ async getState() {
133
+ return this.isOpen;
134
+ }
135
+ /**
136
+ * Set the state of the modal.
137
+ * @param value The new state, set it to true to open the modal, or false to close the modal.
138
+ */
139
+ async setState(value) {
140
+ this.isOpen = value;
102
141
  }
103
- else {
104
- // Remove the inert attribute from all elements that we marked as inert when the modal was opened.
105
- for (const element of this.inertElements) {
106
- element.removeAttribute('inert');
107
- }
108
- // Clear the array of inert elements. This is important because we don't want to keep a reference to elements as they may be removed from the DOM and we could cause a memory leak.
109
- this.inertElements = [];
110
- this.closed.emit();
142
+ /**
143
+ * Toggle the state of the modal.
144
+ * @returns A promise which will resolve to true (if the modal opened) or false (if the modal closed).
145
+ */
146
+ async toggle() {
147
+ this.isOpen = !this.isOpen;
148
+ return this.isOpen;
111
149
  }
112
- // Prevent scrolling of the body when the modal is open.
113
- document.body.style.overflow = newValue ? 'hidden' : '';
114
- }
115
- render() {
116
- return (h("div", { id: "uofg-modal", class: { open: this.isOpen }, role: this.alertDialog ? 'alertdialog' : 'dialog', "aria-modal": this.isOpen ? 'true' : '', "aria-label": this.label, tabIndex: -1, onClick: this.handleClick, onKeyUp: this.handleKeyUp, onFocusout: this.handleFocusOut, ref: (el) => (this.container = el) }, h("div", { id: "uofg-modal-content", part: "content", class: { centered: this.centered } }, h("button", { id: "uofg-modal-dismiss", part: "dismiss-button", "aria-label": "Close modal", ref: (el) => (this.dismissButton = el), onClick: () => (this.isOpen = false) }, h(FontAwesomeIcon, { icon: faTimes })), h("slot", null))));
117
- }
118
- /**
119
- * Get the current state of the modal.
120
- * @returns A promise which will resolve to true when the modal is open, or false when the modal is closed.
121
- */
122
- async getState() {
123
- return this.isOpen;
124
- }
125
- /**
126
- * Set the state of the modal.
127
- * @param value The new state, set it to true to open the modal, or false to close the modal.
128
- */
129
- async setState(value) {
130
- this.isOpen = value;
131
- }
132
- /**
133
- * Toggle the state of the modal.
134
- * @returns A promise which will resolve to true (if the modal opened) or false (if the modal closed).
135
- */
136
- async toggle() {
137
- this.isOpen = !this.isOpen;
138
- return this.isOpen;
139
- }
140
- /**
141
- * Closes the modal.
142
- * @returns empty Promise.
143
- */
144
- async close() {
145
- this.isOpen = false;
146
- }
147
- /**
148
- * Opens the modal.
149
- * @returns empty Promise.
150
- */
151
- async open() {
152
- this.isOpen = true;
153
- }
154
- get el() { return this; }
155
- static get watchers() { return {
156
- "isOpen": ["handleIsOpenChange"]
157
- }; }
158
- static get style() { return uofgModalCss; }
150
+ /**
151
+ * Closes the modal.
152
+ * @returns empty Promise.
153
+ */
154
+ async close() {
155
+ this.isOpen = false;
156
+ }
157
+ /**
158
+ * Opens the modal.
159
+ * @returns empty Promise.
160
+ */
161
+ async open() {
162
+ this.isOpen = true;
163
+ }
164
+ get el() { return this; }
165
+ static get watchers() { return {
166
+ "isOpen": ["handleIsOpenChange"]
167
+ }; }
168
+ static get style() { return UofgModalStyle0; }
159
169
  }, [1, "uofg-modal", {
160
- "label": [1],
161
- "alertDialog": [4, "alert-dialog"],
162
- "centered": [4],
163
- "staticBackdrop": [4, "static-backdrop"],
164
- "autoOpen": [4, "auto-open"],
165
- "isOpen": [32],
166
- "getState": [64],
167
- "setState": [64],
168
- "toggle": [64],
169
- "close": [64],
170
- "open": [64]
171
- }, undefined, {
172
- "isOpen": ["handleIsOpenChange"]
173
- }]);
170
+ "label": [1],
171
+ "alertDialog": [4, "alert-dialog"],
172
+ "centered": [4],
173
+ "staticBackdrop": [4, "static-backdrop"],
174
+ "autoOpen": [4, "auto-open"],
175
+ "isOpen": [32],
176
+ "getState": [64],
177
+ "setState": [64],
178
+ "toggle": [64],
179
+ "close": [64],
180
+ "open": [64]
181
+ }, undefined, {
182
+ "isOpen": ["handleIsOpenChange"]
183
+ }]);
174
184
  function defineCustomElement$1() {
175
- if (typeof customElements === "undefined") {
176
- return;
177
- }
178
- const components = ["uofg-modal"];
179
- components.forEach(tagName => { switch (tagName) {
180
- case "uofg-modal":
181
- if (!customElements.get(tagName)) {
182
- customElements.define(tagName, UofgModal$1);
183
- }
184
- break;
185
- } });
185
+ if (typeof customElements === "undefined") {
186
+ return;
187
+ }
188
+ const components = ["uofg-modal"];
189
+ components.forEach(tagName => { switch (tagName) {
190
+ case "uofg-modal":
191
+ if (!customElements.get(tagName)) {
192
+ customElements.define(tagName, UofgModal$1);
193
+ }
194
+ break;
195
+ } });
186
196
  }
187
197
 
188
198
  const UofgModal = UofgModal$1;
@@ -1,12 +1,12 @@
1
1
  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
  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
  const getAllFocusableElements = (container) => {
8
- 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"])';
9
- return Array.from(container.querySelectorAll(query));
8
+ 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"])';
9
+ return Array.from(container.querySelectorAll(query));
10
10
  };
11
11
 
12
12
  export { PREFERS_REDUCED_MOTION as P, WEB_ANIMATIONS_SUPPORTED as W, getAllFocusableElements as g };
@@ -0,0 +1,3 @@
1
+ const globalScripts = () => {};
2
+
3
+ export { globalScripts as g };