@ulu/frontend 0.2.0-beta.1 → 0.2.0-beta.10

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 (163) hide show
  1. package/dist/README.md +12 -0
  2. package/dist/{types/js → es}/core/component.d.ts +3 -9
  3. package/dist/es/core/component.d.ts.map +1 -0
  4. package/dist/es/core/component.js +134 -0
  5. package/dist/{types/js → es}/core/events.d.ts +1 -1
  6. package/dist/es/core/events.d.ts.map +1 -0
  7. package/dist/es/core/events.js +45 -0
  8. package/dist/es/core/index.d.ts +4 -0
  9. package/dist/{types/js/ui → es/core}/index.d.ts.map +1 -1
  10. package/dist/{types/js → es}/core/settings.d.ts +1 -1
  11. package/dist/es/core/settings.d.ts.map +1 -0
  12. package/dist/es/core/settings.js +44 -0
  13. package/dist/es/index.d.ts +4 -0
  14. package/dist/{types/js → es}/index.d.ts.map +1 -1
  15. package/dist/es/index.js +125 -0
  16. package/dist/{types/js → es}/ui/breakpoints.d.ts +5 -3
  17. package/dist/es/ui/breakpoints.d.ts.map +1 -0
  18. package/dist/es/ui/breakpoints.js +194 -0
  19. package/dist/{types/js → es}/ui/collapsible.d.ts +28 -7
  20. package/dist/es/ui/collapsible.d.ts.map +1 -0
  21. package/dist/es/ui/collapsible.js +140 -0
  22. package/dist/{types/js → es}/ui/details-group.d.ts +1 -1
  23. package/dist/es/ui/details-group.d.ts.map +1 -0
  24. package/dist/es/ui/details-group.js +49 -0
  25. package/dist/{types/js → es}/ui/dialog.d.ts +3 -3
  26. package/dist/es/ui/dialog.d.ts.map +1 -0
  27. package/dist/es/ui/dialog.js +112 -0
  28. package/dist/{types/js → es}/ui/flipcard.d.ts +1 -1
  29. package/dist/es/ui/flipcard.d.ts.map +1 -0
  30. package/dist/es/ui/flipcard.js +97 -0
  31. package/dist/{types/js → es}/ui/grid.d.ts +2 -2
  32. package/dist/es/ui/grid.d.ts.map +1 -0
  33. package/dist/es/ui/grid.js +18 -0
  34. package/dist/{types/js → es}/ui/index.d.ts +22 -21
  35. package/dist/{types/js/core → es/ui}/index.d.ts.map +1 -1
  36. package/dist/{types/js → es}/ui/modal-builder.d.ts +21 -16
  37. package/dist/es/ui/modal-builder.d.ts.map +1 -0
  38. package/dist/es/ui/modal-builder.js +136 -0
  39. package/dist/es/ui/overflow-scroller-pager.d.ts.map +1 -0
  40. package/dist/es/ui/overflow-scroller-pager.js +28 -0
  41. package/dist/{types/js → es}/ui/overflow-scroller.d.ts +3 -3
  42. package/dist/es/ui/overflow-scroller.d.ts.map +1 -0
  43. package/dist/es/ui/overflow-scroller.js +90 -0
  44. package/dist/es/ui/page.d.ts.map +1 -0
  45. package/dist/es/ui/page.js +7 -0
  46. package/dist/{types/js → es}/ui/popover.d.ts +3 -3
  47. package/dist/es/ui/popover.d.ts.map +1 -0
  48. package/dist/es/ui/popover.js +77 -0
  49. package/dist/es/ui/print-details.d.ts.map +1 -0
  50. package/dist/es/ui/print-details.js +22 -0
  51. package/dist/es/ui/print.d.ts.map +1 -0
  52. package/dist/es/ui/print.js +34 -0
  53. package/dist/{types/js → es}/ui/programmatic-modal.d.ts +1 -1
  54. package/dist/es/ui/programmatic-modal.d.ts.map +1 -0
  55. package/dist/es/ui/programmatic-modal.js +55 -0
  56. package/dist/{types/js → es}/ui/proxy-click.d.ts +4 -4
  57. package/dist/es/ui/proxy-click.d.ts.map +1 -0
  58. package/dist/es/ui/proxy-click.js +44 -0
  59. package/dist/{types/js → es}/ui/resizer.d.ts +16 -16
  60. package/dist/es/ui/resizer.d.ts.map +1 -0
  61. package/dist/es/ui/resizer.js +242 -0
  62. package/dist/{types/js → es}/ui/scroll-slider.d.ts +1 -1
  63. package/dist/es/ui/scroll-slider.d.ts.map +1 -0
  64. package/dist/es/ui/scroll-slider.js +29 -0
  65. package/dist/{types/js → es}/ui/scrollpoint.d.ts +79 -11
  66. package/dist/es/ui/scrollpoint.d.ts.map +1 -0
  67. package/dist/es/ui/scrollpoint.js +178 -0
  68. package/dist/{types/js → es}/ui/slider.d.ts +11 -8
  69. package/dist/es/ui/slider.d.ts.map +1 -0
  70. package/dist/es/ui/slider.js +290 -0
  71. package/dist/{types/js → es}/ui/tabs.d.ts +2 -2
  72. package/dist/es/ui/tabs.d.ts.map +1 -0
  73. package/dist/es/ui/tabs.js +64 -0
  74. package/dist/{types/js → es}/ui/theme-toggle.d.ts +4 -4
  75. package/dist/es/ui/theme-toggle.d.ts.map +1 -0
  76. package/dist/es/ui/theme-toggle.js +190 -0
  77. package/dist/{types/js → es}/ui/tooltip.d.ts +5 -5
  78. package/dist/es/ui/tooltip.d.ts.map +1 -0
  79. package/dist/es/ui/tooltip.js +184 -0
  80. package/dist/{types/js → es}/utils/class-logger.d.ts +4 -4
  81. package/dist/es/utils/class-logger.d.ts.map +1 -0
  82. package/dist/es/utils/class-logger.js +37 -0
  83. package/dist/es/utils/css.d.ts.map +1 -0
  84. package/dist/es/utils/css.js +6 -0
  85. package/dist/{types/js → es}/utils/dom.d.ts +1 -1
  86. package/dist/es/utils/dom.d.ts.map +1 -0
  87. package/dist/es/utils/dom.js +29 -0
  88. package/dist/es/utils/file-save.d.ts.map +1 -0
  89. package/dist/es/utils/file-save.js +46 -0
  90. package/dist/{types/js → es}/utils/floating-ui.d.ts +1 -1
  91. package/dist/es/utils/floating-ui.d.ts.map +1 -0
  92. package/dist/es/utils/floating-ui.js +46 -0
  93. package/dist/es/utils/font-awesome.d.ts.map +1 -0
  94. package/dist/es/utils/font-awesome.js +13 -0
  95. package/dist/es/utils/id.d.ts.map +1 -0
  96. package/dist/es/utils/id.js +11 -0
  97. package/dist/{types/js → es}/utils/index.d.ts +7 -7
  98. package/dist/{types/js → es}/utils/index.d.ts.map +1 -1
  99. package/dist/es/utils/pause-youtube-video.d.ts.map +1 -0
  100. package/dist/es/utils/pause-youtube-video.js +27 -0
  101. package/dist/umd/style.css +1 -0
  102. package/dist/umd/ulu-frontend.umd.js +70 -0
  103. package/lib/js/ui/breakpoints.js +13 -5
  104. package/lib/js/ui/index.js +4 -0
  105. package/lib/js/ui/modal-builder.js +5 -3
  106. package/lib/js/ui/slider.js +22 -13
  107. package/lib/scss/_element.scss +10 -4
  108. package/lib/scss/components/_accordion.scss +1 -7
  109. package/lib/scss/components/_button.scss +11 -2
  110. package/lib/scss/components/_card.scss +5 -6
  111. package/lib/scss/components/_form-theme.scss +3 -3
  112. package/lib/scss/components/_menu-stack.scss +1 -0
  113. package/lib/scss/components/_modal.scss +13 -13
  114. package/lib/scss/helpers/_utilities.scss +0 -3
  115. package/package.json +54 -45
  116. package/dist/style.css +0 -1
  117. package/dist/types/js/core/component.d.ts.map +0 -1
  118. package/dist/types/js/core/events.d.ts.map +0 -1
  119. package/dist/types/js/core/index.d.ts +0 -4
  120. package/dist/types/js/core/settings.d.ts.map +0 -1
  121. package/dist/types/js/index.d.ts +0 -4
  122. package/dist/types/js/ui/breakpoints.d.ts.map +0 -1
  123. package/dist/types/js/ui/collapsible.d.ts.map +0 -1
  124. package/dist/types/js/ui/details-group.d.ts.map +0 -1
  125. package/dist/types/js/ui/dialog.d.ts.map +0 -1
  126. package/dist/types/js/ui/flipcard.d.ts.map +0 -1
  127. package/dist/types/js/ui/grid.d.ts.map +0 -1
  128. package/dist/types/js/ui/modal-builder.d.ts.map +0 -1
  129. package/dist/types/js/ui/overflow-scroller-pager.d.ts.map +0 -1
  130. package/dist/types/js/ui/overflow-scroller.d.ts.map +0 -1
  131. package/dist/types/js/ui/page.d.ts.map +0 -1
  132. package/dist/types/js/ui/popover.d.ts.map +0 -1
  133. package/dist/types/js/ui/print-details.d.ts.map +0 -1
  134. package/dist/types/js/ui/print.d.ts.map +0 -1
  135. package/dist/types/js/ui/programmatic-modal.d.ts.map +0 -1
  136. package/dist/types/js/ui/proxy-click.d.ts.map +0 -1
  137. package/dist/types/js/ui/resizer.d.ts.map +0 -1
  138. package/dist/types/js/ui/scroll-slider.d.ts.map +0 -1
  139. package/dist/types/js/ui/scrollpoint.d.ts.map +0 -1
  140. package/dist/types/js/ui/slider.d.ts.map +0 -1
  141. package/dist/types/js/ui/tabs.d.ts.map +0 -1
  142. package/dist/types/js/ui/theme-toggle.d.ts.map +0 -1
  143. package/dist/types/js/ui/tooltip.d.ts.map +0 -1
  144. package/dist/types/js/utils/class-logger.d.ts.map +0 -1
  145. package/dist/types/js/utils/css.d.ts.map +0 -1
  146. package/dist/types/js/utils/dom.d.ts.map +0 -1
  147. package/dist/types/js/utils/file-save.d.ts.map +0 -1
  148. package/dist/types/js/utils/floating-ui.d.ts.map +0 -1
  149. package/dist/types/js/utils/font-awesome.d.ts.map +0 -1
  150. package/dist/types/js/utils/id.d.ts.map +0 -1
  151. package/dist/types/js/utils/pause-youtube-video.d.ts.map +0 -1
  152. package/dist/ulu-frontend.es.js +0 -5737
  153. package/dist/ulu-frontend.umd.js +0 -77
  154. package/lib/scss/components/_card-before-no-position-relative.TRASH.scss +0 -576
  155. /package/dist/{types/js → es}/ui/overflow-scroller-pager.d.ts +0 -0
  156. /package/dist/{types/js → es}/ui/page.d.ts +0 -0
  157. /package/dist/{types/js → es}/ui/print-details.d.ts +0 -0
  158. /package/dist/{types/js → es}/ui/print.d.ts +0 -0
  159. /package/dist/{types/js → es}/utils/css.d.ts +0 -0
  160. /package/dist/{types/js → es}/utils/file-save.d.ts +0 -0
  161. /package/dist/{types/js → es}/utils/font-awesome.d.ts +0 -0
  162. /package/dist/{types/js → es}/utils/id.d.ts +0 -0
  163. /package/dist/{types/js → es}/utils/pause-youtube-video.d.ts +0 -0
@@ -0,0 +1,178 @@
1
+ var m = Object.defineProperty;
2
+ var f = (a, t, s) => t in a ? m(a, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : a[t] = s;
3
+ var d = (a, t, s) => f(a, typeof t != "symbol" ? t + "" : t, s);
4
+ import { ComponentInitializer as p } from "../core/component.js";
5
+ import { logError as g } from "../utils/class-logger.js";
6
+ import { getElement as b } from "@ulu/utils/browser/dom.js";
7
+ const c = new p({
8
+ type: "scrollpoint",
9
+ baseAttribute: "data-ulu-scrollpoint"
10
+ });
11
+ function w() {
12
+ c.init({
13
+ withData: !0,
14
+ coreEvents: ["pageModified"],
15
+ setup({ element: a, data: t, initialize: s }) {
16
+ const e = Object.assign({}, t);
17
+ new h(a, e), s();
18
+ }
19
+ });
20
+ }
21
+ const l = class l {
22
+ /**
23
+ * Setup a new scrollpoint
24
+ * @param {Node} element The element to create the scrollpoint for
25
+ * @param {Object} config Options to configure the scrollpoint see Scrollpoint.defaults for more information on settings
26
+ */
27
+ constructor(t, s) {
28
+ const e = Object.assign({}, l.defaults, s);
29
+ if (!t) {
30
+ g(this, "Missing required element");
31
+ return;
32
+ }
33
+ e.rootSelector && (e.root = document.querySelector(e.rootSelector), delete e.rootSelector), this.options = e, this.observer = null, this.lastPosition = null, this.isActive = !1, this.element = t, this.syncedElements = [
34
+ t,
35
+ ...e.syncElements.map((i) => b(i))
36
+ ], this.classes = {
37
+ enter: this.getClassname("enter"),
38
+ enterForward: this.getClassname("enter--from-forward"),
39
+ enterReverse: this.getClassname("enter--from-reverse"),
40
+ exit: this.getClassname("exit"),
41
+ exitForward: this.getClassname("exit--from-forward"),
42
+ exitReverse: this.getClassname("exit--from-reverse")
43
+ }, this.setupObserver(), e.debug && c.log(this);
44
+ }
45
+ getClassname(t) {
46
+ return this.options.classPrefix + "-" + t;
47
+ }
48
+ getObserverOptions() {
49
+ const { root: t, marginStart: s, marginEnd: e, threshold: i, horizontal: r } = this.options, o = r ? `0px ${s} 0px ${e}` : `${s} 0px ${e} 0px`;
50
+ return { root: t, rootMargin: o, threshold: i };
51
+ }
52
+ /**
53
+ * IntersectionObserver Callback
54
+ * - Should set the state
55
+ */
56
+ onObserve(t) {
57
+ const s = this.getScrollY(), { lastPosition: e, isActive: i, options: r } = this, o = e === null ? null : e < s;
58
+ t.forEach((n) => {
59
+ const { isIntersecting: u } = n;
60
+ u && !i ? this.setState(!0, o) : !u && i && r.exit && (o && r.exitForward || !o && r.exitReverse) && this.setState(!1, o);
61
+ }), this.lastPosition = s;
62
+ }
63
+ setupObserver() {
64
+ const t = (e) => {
65
+ this.onObserve(e);
66
+ }, s = this.getObserverOptions();
67
+ this.options.debug && c.log("IntersectionObserver (options)", s), this.observer = new IntersectionObserver(t, s), this.observer.observe(this.element);
68
+ }
69
+ getScrollY() {
70
+ const { root: t } = this.options;
71
+ return t === null || t === document ? window.scrollY : t.scrollTop;
72
+ }
73
+ setState(t, s) {
74
+ const { element: e } = this, i = { isActive: t, isForward: s, element: e, instance: this }, { setClasses: r, setAttribute: o, onChange: n } = this.options;
75
+ r && this.updateClasses(t, s), o && this.updateStateAttribute(t, s), n && n(i), this.isActive = t;
76
+ }
77
+ getAllClasses() {
78
+ return Object.values(this.classes);
79
+ }
80
+ updateClasses(t, s) {
81
+ const { classes: e } = this, i = this.getAllClasses(), r = [
82
+ e.enter,
83
+ s ? e.enterForward : e.enterReverse
84
+ ], o = [
85
+ e.exit,
86
+ s ? e.exitForward : e.exitReverse
87
+ ];
88
+ this.syncedElements.forEach((n) => {
89
+ n.classList.remove(...i), t ? n.classList.add(...r) : n.classList.add(...o);
90
+ });
91
+ }
92
+ updateStateAttribute(t, s) {
93
+ const e = t ? "enter" : "exit", i = s ? "forward" : "reverse";
94
+ this.syncedElements.forEach((r) => {
95
+ r.setAttribute(this.options.attributeName, `${e}-${i}`);
96
+ });
97
+ }
98
+ destroy() {
99
+ this.observer.disconnect(), this.observer = null, this.options.setClasses && this.element.classList.remove(...this.getAllClasses()), this.options.setAttribute && this.element.removeAttribute(this.options.attributeName);
100
+ }
101
+ };
102
+ d(l, "defaults", {
103
+ /**
104
+ * Default observer root element
105
+ */
106
+ root: null,
107
+ /**
108
+ * Use a selector to select the observer root element
109
+ */
110
+ rootSelector: null,
111
+ /**
112
+ * Log debug info to console
113
+ */
114
+ debug: !1,
115
+ /**
116
+ * Change scroll orientation to horizontal
117
+ */
118
+ horizontal: !1,
119
+ /**
120
+ * Margin for observer top or left (depending on orientation)
121
+ */
122
+ marginStart: "-25%",
123
+ /**
124
+ * Margin for observer bottom or right (depending on orientation)
125
+ */
126
+ marginEnd: "-55%",
127
+ /**
128
+ * Threshold for observer
129
+ */
130
+ threshold: [0, 1],
131
+ /**
132
+ * The point can exited (else persists)
133
+ */
134
+ exit: !0,
135
+ /**
136
+ * The point can exit from the end
137
+ */
138
+ exitForward: !0,
139
+ /**
140
+ * The point can exit from the start
141
+ */
142
+ exitReverse: !0,
143
+ /**
144
+ * Set state classes
145
+ */
146
+ setClasses: !1,
147
+ /**
148
+ * Prefix for classes
149
+ */
150
+ classPrefix: "scrollpoint",
151
+ /**
152
+ * Set attribute for state (less verbose same info as classes)
153
+ */
154
+ setAttribute: !0,
155
+ /**
156
+ * Attribute name to set state info in
157
+ */
158
+ attributeName: "data-ulu-scrollpoint-state",
159
+ /**
160
+ * Group multiple points, one active at a time (scroll menus)
161
+ */
162
+ // groupName: null,
163
+ /**
164
+ * Elements that should also get active state info (classes or attributes)
165
+ */
166
+ syncElements: [],
167
+ /**
168
+ * Callback called when state changes
169
+ */
170
+ onChange(t) {
171
+ }
172
+ });
173
+ let h = l;
174
+ export {
175
+ h as Scrollpoint,
176
+ w as init,
177
+ c as initializer
178
+ };
@@ -1,3 +1,4 @@
1
+ import { ComponentInitializer } from '../core/component.js';
1
2
  /**
2
3
  * Initialize all sliders based on data attribute selectors
3
4
  */
@@ -7,7 +8,7 @@ export function init(): void;
7
8
  * @param {Node} container The slide container to query children from
8
9
  * @param {Object} options Options for slider class
9
10
  */
10
- export function setupSlider(container: Node, options: any): void;
11
+ export function setupSlider(container: Node, options: Object): void;
11
12
  /**
12
13
  * Slider Component Initializer
13
14
  */
@@ -17,6 +18,9 @@ export const initializer: ComponentInitializer;
17
18
  */
18
19
  export class Slider {
19
20
  static instances: any[];
21
+ static globalsInitialized: boolean;
22
+ static reduceMotion: boolean;
23
+ static _initializeGlobals(): void;
20
24
  /**
21
25
  * Default options for slider
22
26
  */
@@ -30,8 +34,8 @@ export class Slider {
30
34
  transitionDurationExit: number;
31
35
  transitionTimingFunction: string;
32
36
  buttonClasses: string[];
33
- iconClassPrevious: any;
34
- iconClassNext: any;
37
+ iconClassPrevious: Object;
38
+ iconClassNext: Object;
35
39
  swipeEnabled: boolean;
36
40
  swipeOptions: {
37
41
  preventScroll: boolean;
@@ -43,11 +47,11 @@ export class Slider {
43
47
  element: any;
44
48
  index: number;
45
49
  number: number;
46
- };
50
+ } | null;
47
51
  index: any;
48
52
  swipeInstance: any;
49
- swipeListener: (event: any) => void;
50
- swipeImageListener: (event: any) => void;
53
+ swipeListener: ((event: any) => void) | null;
54
+ swipeImageListener: ((event: any) => void) | null;
51
55
  transitioning: boolean;
52
56
  slides: {
53
57
  element: any;
@@ -135,7 +139,7 @@ export class Slider {
135
139
  };
136
140
  createNav(container: any): {
137
141
  nav: HTMLUListElement;
138
- navButtons: any[];
142
+ navButtons: HTMLButtonElement[];
139
143
  navItems: HTMLLIElement[];
140
144
  };
141
145
  createNavButton(slide: any, index: any): HTMLButtonElement;
@@ -143,5 +147,4 @@ export class Slider {
143
147
  getNavContent(slide: any): string;
144
148
  emit(name: any, args: any): void;
145
149
  }
146
- import { ComponentInitializer } from "../core/component.js";
147
150
  //# sourceMappingURL=slider.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../lib/js/ui/slider.js"],"names":[],"mappings":"AAgEA;;GAEG;AACH,6BASC;AAED;;;;GAIG;AACH,uCAHW,IAAI,WACJ,MAAM,QAiBhB;AA1DD;;GAEG;AACH,+CAGG;AAsDH;;GAEG;AACH;IACE,wBAAsB;IACtB,mCAAkC;IAClC,6BAA4B;IAE5B,kCAYC;IACD;;OAEG;IACH;;;;;;;;;;;;;;;;MAgBC;IACD,wCAoCC;IAjCC,aAAsB;IACtB;;;;aAAiB;IACjB,WAAiB;IACjB,mBAAyB;IACzB,6CAAyB;IACzB,kDAA8B;IAC9B,uBAA0B;IAQ1B;;;;QAME;IACF,cAIC;IAED;;;wBACgF;IAMlF;;OAEG;IACH,qBAKC;IACD;;OAEG;IACH,2BAOC;IACD;;OAEG;IACH,uBAMC;IACD;;;;;;OAMG;IACH,8BAJW,MAAM,YACN,MAAM,2CAqChB;IACD;;OAEG;IACH,kDASC;IACD;;;OAGG;IACH,oDASC;IACD;;OAEG;IACH,kDAOC;IACD;;OAEG;IACH;;;;;;sBAoDC;IACD;;OAEG;IACH;;;sBAUC;IACD;;OAEG;IACH;;;sBAOC;IACD,qDA2CC;IACD,cAmBC;IACD,mBAsBC;IACD,0BAMC;IACD,+BAKC;IACD,qCAOC;IACD,mBAQC;IACD,mBASC;IACD,yCASC;IACD,oDAUC;IACD;;;;;;MAwBC;IACD;;;;MAmBC;IACD,2DAQC;IACD,uCAMC;IACD,kCAEC;IACD,iCAIC;CACF;qCA1iBoC,sBAAsB"}
@@ -0,0 +1,290 @@
1
+ var w = Object.defineProperty;
2
+ var T = (a, t, s) => t in a ? w(a, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : a[t] = s;
3
+ var m = (a, t, s) => T(a, typeof t != "symbol" ? t + "" : t, s);
4
+ import { ComponentInitializer as x } from "../core/component.js";
5
+ import { wrapSettingString as b } from "../core/settings.js";
6
+ import { hasRequiredProps as S } from "@ulu/utils/object.js";
7
+ import { trimWhitespace as v } from "@ulu/utils/string.js";
8
+ import { debounce as k } from "@ulu/utils/performance.js";
9
+ import { logError as y, log as $, logWarning as L } from "../utils/class-logger.js";
10
+ import I from "swipe-listener";
11
+ const f = new x({
12
+ type: "slider",
13
+ baseAttribute: "data-ulu-slider"
14
+ }), A = f.attributeSelector("track"), z = f.attributeSelector("track-container"), D = f.attributeSelector("control-context"), M = f.attributeSelector("slide"), B = [], h = { once: !0 }, E = (a) => `${a}ms`, N = [
15
+ "container",
16
+ "trackContainer",
17
+ "track",
18
+ "slides"
19
+ ];
20
+ function W() {
21
+ f.init({
22
+ withData: !0,
23
+ coreEvents: ["pageModified"],
24
+ setup({ element: a, data: t, initialize: s }) {
25
+ q(a, t), s();
26
+ }
27
+ });
28
+ }
29
+ function q(a, t) {
30
+ const s = Object.assign({}, t), e = {
31
+ container: a,
32
+ track: a.querySelector(A),
33
+ trackContainer: a.querySelector(z),
34
+ controlContext: a.querySelector(D),
35
+ slides: a.querySelectorAll(M)
36
+ };
37
+ e.slides.length && B.push(new g(e, s, !1));
38
+ }
39
+ const l = class l {
40
+ static _initializeGlobals() {
41
+ l.globalsInitialized || (addEventListener("load", () => {
42
+ addEventListener("resize", k(() => {
43
+ l.instances.forEach((t) => t.handleResize());
44
+ }, 250));
45
+ }), l.reduceMotion = matchMedia("(prefers-reduced-motion: reduce)").matches, l.globalsInitialized = !0);
46
+ }
47
+ constructor(t, s) {
48
+ l._initializeGlobals();
49
+ const e = Object.assign({}, l.defaults, s);
50
+ this.options = e, this.slide = null, this.index = null, this.swipeInstance = null, this.swipeListener = null, this.swipeImageListener = null, this.transitioning = !1, S(N) || y(this, "Missing a required Element"), t.slides.length || y(this, "Missing slides"), this.slides = [...t.slides].map((i, n) => ({
51
+ element: i,
52
+ index: n,
53
+ number: n + 1
54
+ })), this.elements = {
55
+ ...t,
56
+ ...this.createControls(t.controlContext || t.container),
57
+ ...this.createNav(t.navContext || t.container)
58
+ }, this.transition = e.transition ? e.transitionFade || l.reduceMotion ? this.fadeTransition : this.slideTransition : this.noTransition, this.setup(), this.goto(0, null, "init"), $(this, "Slider Instance Created", this), l.instances.push(this);
59
+ }
60
+ /**
61
+ * Sliding mechanism needs translate updated on resize
62
+ */
63
+ handleResize() {
64
+ const { slide: t, transition: s, slideTransition: e } = this;
65
+ s === e && t && this.translateTo(t.element.offsetLeft, 0);
66
+ }
67
+ /**
68
+ * Goto to the previous slide
69
+ */
70
+ previous(t) {
71
+ const { index: s, slides: e } = this, i = e.length - 1, n = s - 1, o = n < 0 ? i : n;
72
+ this.emit("previous", [t, o]), this.goto(o, t, "previous");
73
+ }
74
+ /**
75
+ * Goto to the next slide
76
+ */
77
+ next(t) {
78
+ const { index: s, slides: e } = this, i = s + 1, n = i > e.length - 1 ? 0 : i;
79
+ this.emit("next", [t, n]), this.goto(n, t, "next");
80
+ }
81
+ /**
82
+ * Makes sure that no matter what the callback is called if transition event
83
+ * doesn't start or fails to finish/cancel
84
+ * @param {number} element
85
+ * @param {number} duration Duration to wait for complete
86
+ * @param {Function} beginTransition Css changes to begin/start transtion
87
+ */
88
+ ensureTransitionEnds(t, s, e) {
89
+ return new Promise((i) => {
90
+ const n = {}, o = () => {
91
+ clearTimeout(n.start), n.end = setTimeout(r, s + 500);
92
+ }, r = () => {
93
+ clearTimeout(n.start), clearTimeout(n.end), t.removeEventListener("transitionrun", o, h), t.removeEventListener("transitionend", r, h), t.removeEventListener("transitioncancel", r, h), i();
94
+ };
95
+ t.addEventListener("transitionrun", o, h), t.addEventListener("transitionend", r, h), t.addEventListener("transitioncancel", r, h), n.start = setTimeout(r, s + 500), t.style.transitionDuration = E(s), e(), s || r();
96
+ });
97
+ }
98
+ /**
99
+ * Translate the track to X
100
+ */
101
+ translateTo(t, s) {
102
+ const { track: e } = this.elements, i = () => e.style.transform = `translateX(-${t}px)`;
103
+ return e.style.willChange = "transform", this.ensureTransitionEnds(e, s, i).then(() => {
104
+ e.style.willChange = "auto";
105
+ });
106
+ }
107
+ /**
108
+ * Show's a specifc slide and hides others, except when passing true to show all
109
+ * then all slides will visible
110
+ */
111
+ setVisibility(t, s) {
112
+ s || (t.element.style.visibility = "visible"), this.slides.forEach((e) => {
113
+ e !== t && (e.element.style.visibility = s ? "visible" : "hidden");
114
+ });
115
+ }
116
+ /**
117
+ * Perform a fade on a single slide
118
+ */
119
+ fadeSlide(t, s) {
120
+ const { options: e } = this, { element: i } = t, n = s ? e.transitionDuration : e.transitionDurationExit;
121
+ return this.ensureTransitionEnds(i, n, () => {
122
+ i.style.opacity = s ? "1" : "0";
123
+ });
124
+ }
125
+ /**
126
+ * Handler for the entire slide transtion
127
+ */
128
+ async slideTransition({ slide: t, index: s, old: e, oldIndex: i, triggerType: n }) {
129
+ const o = this.slides.length, r = n === "previous", C = o - 1, u = s === 0 && i === C, d = s === C && i === 0;
130
+ let c, p = this.options.transitionDuration;
131
+ i && !u && !d && (p = p * Math.abs(i - s)), o < 3 ? u && !r ? c = e : d && (c = r ? t : e) : u ? c = e : d && (c = t), this.setVisibility(null, !0), c && (c.element.style.order = "-1", await this.translateTo(u ? 0 : e.element.offsetLeft, 0)), await this.translateTo(t.element.offsetLeft, p), c && (c.element.style.order = "0", await this.translateTo(t.element.offsetLeft, 0)), this.setVisibility(t, !1);
132
+ }
133
+ /**
134
+ * Handler for the entire fade transtion
135
+ */
136
+ async fadeTransition({ slide: t, old: s }) {
137
+ this.setVisibility(null, !0), s && (await this.fadeSlide(s, !1), s.element.style.order = "0"), t.element.style.order = "-1", await this.fadeSlide(t, !0), this.setVisibility(t, !1);
138
+ }
139
+ /**
140
+ * Handler for the entire NO transtion
141
+ */
142
+ noTransition({ slide: t, old: s }) {
143
+ return this.setVisibility(t, !1), s && (s.element.style.order = "0"), t.element.style.order = "-1", Promise.resolve();
144
+ }
145
+ goto(t, s, e) {
146
+ const {
147
+ slide: i,
148
+ index: n,
149
+ slides: o,
150
+ elements: r
151
+ } = this, C = e === "init", u = o[t], d = this.getClass("nav-button--active"), c = this.getClass("transition", !0), p = { slide: u, index: t, old: i, oldIndex: n, triggerType: e };
152
+ if (t === n) {
153
+ L(this, "Could not goto slide, still performing transition");
154
+ return;
155
+ }
156
+ if (this.transitioning) {
157
+ L(this, "Cancel goto(), same slide index as current slide");
158
+ return;
159
+ }
160
+ this.elements.track.inert = !0, this.transitioning = !0, i && i.navButton.classList.remove(d), u.navButton.classList.add(d), r.container.classList.add(c), this.transition(p).then(() => {
161
+ this.index = t, this.slide = u, this.transitioning = !1, this.elements.track.inert = !1, r.container.classList.remove(c), C || (u.element.focus(), this.emit("goto", [s, t, u]));
162
+ });
163
+ }
164
+ setup() {
165
+ const { container: t, track: s, trackContainer: e } = this.elements, i = v(this.trackCss()), n = v(this.trackContainerStyles()), o = v(this.slideCss());
166
+ s.setAttribute("style", i), e.setAttribute("style", n), this.slides.forEach((r) => {
167
+ r.element.setAttribute("style", o), r.element.setAttribute("tabindex", "-1");
168
+ }), t.classList.add(this.getClass()), this.options.swipeEnabled && this.setupSwipe();
169
+ }
170
+ setupSwipe() {
171
+ const t = this.elements.track.querySelectorAll("img");
172
+ this.swipeListener = (s) => {
173
+ this.onSwipe(s);
174
+ }, this.swipeImageListener = (s) => {
175
+ s.preventDefault();
176
+ }, this.slides.forEach((s) => {
177
+ const { element: e } = s;
178
+ s.swipeInstance = I(e, this.options.swipeOptions), e.addEventListener("swipe", this.swipeListener);
179
+ }), t.forEach((s) => {
180
+ s.addEventListener("dragstart", this.swipeImageListener);
181
+ });
182
+ }
183
+ onSwipe(t) {
184
+ const { directions: s } = t.detail, e = s.left ? "next" : s.right ? "previous" : null;
185
+ e && this[e](t);
186
+ }
187
+ trackContainerStyles() {
188
+ return `
189
+ overflow: hidden;
190
+ `;
191
+ }
192
+ transitionCss(t) {
193
+ const { transitionTimingFunction: s, transitionDuration: e } = this.options;
194
+ return `
195
+ transition-property: ${t};
196
+ transition-duration: ${E(e)};
197
+ transition-timing-function: ${s};
198
+ `;
199
+ }
200
+ trackCss() {
201
+ return `
202
+ display: flex;
203
+ position: relative;
204
+ list-style: none;
205
+ ${this.transition === this.slideTransition ? this.transitionCss("transform") : ""}
206
+ `;
207
+ }
208
+ slideCss() {
209
+ const t = this.transition === this.fadeTransition;
210
+ return `
211
+ width: 100%;
212
+ flex: 0 0 100%;
213
+ ${t ? this.transitionCss("opacity") : ""}
214
+ opacity: ${t ? "0" : "1"}
215
+ `;
216
+ }
217
+ getClass(t, s) {
218
+ const { namespace: e } = this.options;
219
+ return s ? `${e}--${t}` : t ? `${e}__${t}` : e;
220
+ }
221
+ createControlButton(t) {
222
+ const s = document.createElement("button");
223
+ return s.classList.add(this.getClass("control-button")), s.classList.add(this.getClass(`control-button--${t}`)), s.classList.add(...this.options.buttonClasses), s.setAttribute("data-slider-control", t), s.setAttribute("type", "button"), s.innerHTML = this.getControlContent(t), s;
224
+ }
225
+ createControls(t) {
226
+ const s = document.createElement("ul"), e = document.createElement("li"), i = document.createElement("li"), n = this.createControlButton("previous"), o = this.createControlButton("next");
227
+ return s.classList.add(this.getClass("controls")), e.appendChild(n), i.appendChild(o), s.appendChild(e), s.appendChild(i), n.addEventListener("click", this.previous.bind(this)), o.addEventListener("click", this.next.bind(this)), t.appendChild(s), {
228
+ controls: s,
229
+ previousItem: e,
230
+ nextItem: i,
231
+ previous: n,
232
+ next: o
233
+ };
234
+ }
235
+ createNav(t) {
236
+ const s = document.createElement("ul"), e = this.slides.map(this.createNavButton.bind(this)), i = e.map((n) => {
237
+ const o = document.createElement("li");
238
+ return o.appendChild(n), s.appendChild(o), o;
239
+ });
240
+ return s.classList.add(this.getClass("nav")), t.appendChild(s), {
241
+ nav: s,
242
+ navButtons: e,
243
+ navItems: i
244
+ };
245
+ }
246
+ createNavButton(t, s) {
247
+ const e = document.createElement("button");
248
+ return e.classList.add(this.getClass("nav-button")), e.setAttribute("type", "button"), e.innerHTML = this.getNavContent(t), t.navButton = e, e.addEventListener("click", this.goto.bind(this, s)), e;
249
+ }
250
+ getControlContent(t) {
251
+ const s = this.options[t === "next" ? "iconClassNext" : "iconClassPrevious"];
252
+ return `
253
+ <span class="${this.options.classAccessiblyHidden}">${t}</span>
254
+ <span class="${this.getClass("control-icon")} ${s}" aria-hidden="true"></span>
255
+ `;
256
+ }
257
+ getNavContent(t) {
258
+ return `<span class="${this.options.classAccessiblyHidden}">Item ${t.number}</span>`;
259
+ }
260
+ emit(t, s) {
261
+ this.options.events[t] && this.options.events[t].apply(this, s);
262
+ }
263
+ };
264
+ m(l, "instances", []), m(l, "globalsInitialized", !1), m(l, "reduceMotion", !1), /**
265
+ * Default options for slider
266
+ */
267
+ m(l, "defaults", {
268
+ classAccessiblyHidden: "hidden-visually",
269
+ namespace: "Slider",
270
+ events: {},
271
+ transition: !0,
272
+ transitionFade: !1,
273
+ transitionDuration: 700,
274
+ transitionDurationExit: 400,
275
+ transitionTimingFunction: "ease-in-out",
276
+ buttonClasses: ["button", "button--icon"],
277
+ iconClassPrevious: b("iconClassPrevious"),
278
+ iconClassNext: b("iconClassNext"),
279
+ swipeEnabled: !0,
280
+ swipeOptions: {
281
+ preventScroll: !0
282
+ }
283
+ });
284
+ let g = l;
285
+ export {
286
+ g as Slider,
287
+ W as init,
288
+ f as initializer,
289
+ q as setupSlider
290
+ };
@@ -1,3 +1,4 @@
1
+ import { ComponentInitializer } from '../core/component.js';
1
2
  /**
2
3
  * Init all instances currently in document
3
4
  */
@@ -8,7 +9,7 @@ export function init(): void;
8
9
  * @param {Node} options Options to set as defaults (can be overridden by element dataset options)
9
10
  * @return {Object} Instance object
10
11
  */
11
- export function setup(element: Node, options?: Node): any;
12
+ export function setup(element: Node, options?: Node): Object;
12
13
  /**
13
14
  * Array of current tab instances (exported if you need to interact with them)
14
15
  * @type {Array}
@@ -18,5 +19,4 @@ export const instances: any[];
18
19
  * Tabs Component Initializer
19
20
  */
20
21
  export const initializer: ComponentInitializer;
21
- import { ComponentInitializer } from "../core/component.js";
22
22
  //# sourceMappingURL=tabs.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../lib/js/ui/tabs.js"],"names":[],"mappings":"AA2BA;;GAEG;AACH,6BAoBC;AAED;;;;;GAKG;AACH,+BAJW,IAAI,YACJ,IAAI,GACH,MAAM,CA0BjB;AArED;;;GAGG;AACH,8BAA4B;AAE5B;;GAEG;AACH,+CAGG;qCAdkC,sBAAsB"}
@@ -0,0 +1,64 @@
1
+ import f from "aria-tablist";
2
+ import { ComponentInitializer as u } from "../core/component.js";
3
+ const l = [], p = new u({
4
+ type: "tabs",
5
+ baseAttribute: "data-ulu-tablist"
6
+ });
7
+ function E() {
8
+ const e = () => {
9
+ p.init({
10
+ coreEvents: ["pageModified"],
11
+ withData: !0,
12
+ setup({ element: n, data: t, initialize: o }) {
13
+ m(n, t), o();
14
+ }
15
+ }), l.forEach(b);
16
+ };
17
+ document.readyState === "complete" ? e() : window.addEventListener("load", e);
18
+ }
19
+ function m(e, n = {}) {
20
+ const t = Object.assign({}, n);
21
+ t.vertical && (t.allArrows = !0);
22
+ const o = { element: e, options: n };
23
+ return o.ariaTablist = f(e, {
24
+ onOpen(...a) {
25
+ a.unshift(o), g.apply(null, a);
26
+ },
27
+ ...t
28
+ }), l.push(o), t.equalHeights && w(e), o;
29
+ }
30
+ function b({ options: e, ariaTablist: n }) {
31
+ if (e.openByUrlHash) {
32
+ const { hash: t } = window.location;
33
+ if (t && t.length > 1) {
34
+ const o = t.substring(1);
35
+ n.tabs.forEach((a) => {
36
+ o === a.id && n.open(a);
37
+ });
38
+ }
39
+ }
40
+ }
41
+ function g({ options: e }, n, t) {
42
+ e.openByUrlHash && window.history && window.history.replaceState(null, "", `#${t.id}`);
43
+ }
44
+ function w(e) {
45
+ const t = [...e.children].map((i) => document.querySelector(`[aria-labelledby="${i.id}"]`)), h = [...t[0].parentElement.querySelectorAll("img")].map((i) => d(i));
46
+ function d(i) {
47
+ return new Promise((r) => {
48
+ i.complete ? r(i) : (i.onload = r, i.onerror = r);
49
+ });
50
+ }
51
+ Promise.all(h).then(() => {
52
+ const i = t.map((s) => {
53
+ let c = s.offsetHeight;
54
+ return s.hidden && (s.hidden = !1, c = s.offsetHeight, s.setAttribute("hidden", "hidden")), c;
55
+ }), r = Math.max(...i);
56
+ t.forEach((s) => s.style.minHeight = `${r}px`);
57
+ });
58
+ }
59
+ export {
60
+ E as init,
61
+ p as initializer,
62
+ l as instances,
63
+ m as setup
64
+ };
@@ -1,7 +1,8 @@
1
+ import { ComponentInitializer } from '../core/component.js';
1
2
  /**
2
3
  * @param {Object} options Change options used as default for dialogs, can then be overridden by data attribute settings on element
3
4
  */
4
- export function setDefaults(options: any): void;
5
+ export function setDefaults(options: Object): void;
5
6
  /**
6
7
  * Initialize everything in document
7
8
  * - This will only initialize elements once, it is safe to call on page changes
@@ -17,7 +18,7 @@ export function setupToggle(toggle: HTMLElement, userOptions: any): {
17
18
  options: any;
18
19
  toggleState: (event: any) => void;
19
20
  setState(themeKey: any): void;
20
- };
21
+ } | undefined;
21
22
  /**
22
23
  * Theme Toggle Component Initializer
23
24
  */
@@ -43,7 +44,7 @@ export namespace defaults {
43
44
  }
44
45
  }
45
46
  let target: string;
46
- let group: any;
47
+ let group: null;
47
48
  /**
48
49
  * Optional callback to do something when the state changes
49
50
  */
@@ -54,5 +55,4 @@ export namespace defaults {
54
55
  let storagePrefix: string;
55
56
  let debug: boolean;
56
57
  }
57
- import { ComponentInitializer } from "../core/component.js";
58
58
  //# sourceMappingURL=theme-toggle.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../../lib/js/ui/theme-toggle.js"],"names":[],"mappings":"AAmGA;;GAEG;AACH,qCAFW,MAAM,QAIhB;AAED;;;GAGG;AACH,6BASC;AAED;;;GAGG;AACH,oCAFW,WAAW;;;;;;cA+FrB;AAhND;;GAEG;AACH,+CAGG;;;;;;;;;;;;;;;;;;;;;;;IAmDD;;OAEG;IACH,mCAAiB;;;;;;;qCAlEkB,sBAAsB"}