npm - @internetarchive/modal-manager - Versions diffs - 2.0.2 → 2.0.4-alpha-webdev7960.0 - Mend

@internetarchive/modal-manager 2.0.2 → 2.0.4-alpha-webdev7960.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 (103) hide show

package/.editorconfig +29 -29
package/.eslintrc.js +14 -14
package/.github/workflows/ci.yml +30 -30
package/.github/workflows/gh-pages-main.yml +42 -42
package/.github/workflows/pr-preview.yml +40 -40
package/LICENSE +661 -661
package/README.md +139 -139
package/custom-elements.json +170 -170
package/dist/index.d.ts +7 -7
package/dist/index.js +5 -5
package/dist/index.js.map +1 -1
package/dist/src/assets/arrow-left-icon.d.ts +2 -0
package/dist/src/assets/arrow-left-icon.js +15 -0
package/dist/src/assets/arrow-left-icon.js.map +1 -0
package/dist/src/assets/ia-logo-icon.d.ts +2 -2
package/dist/src/assets/ia-logo-icon.js +29 -29
package/dist/src/assets/ia-logo-icon.js.map +1 -1
package/dist/src/modal-config.d.ts +104 -92
package/dist/src/modal-config.js +24 -22
package/dist/src/modal-config.js.map +1 -1
package/dist/src/modal-manager-host-bridge-interface.d.ts +12 -12
package/dist/src/modal-manager-host-bridge-interface.js +1 -1
package/dist/src/modal-manager-host-bridge-interface.js.map +1 -1
package/dist/src/modal-manager-host-bridge.d.ts +34 -34
package/dist/src/modal-manager-host-bridge.js +62 -62
package/dist/src/modal-manager-host-bridge.js.map +1 -1
package/dist/src/modal-manager-interface.d.ts +27 -25
package/dist/src/modal-manager-interface.js +1 -1
package/dist/src/modal-manager-interface.js.map +1 -1
package/dist/src/modal-manager-mode.d.ts +10 -10
package/dist/src/modal-manager-mode.js +11 -11
package/dist/src/modal-manager-mode.js.map +1 -1
package/dist/src/modal-manager.d.ts +137 -112
package/dist/src/modal-manager.js +247 -218
package/dist/src/modal-manager.js.map +1 -1
package/dist/src/modal-template.d.ts +41 -33
package/dist/src/modal-template.js +335 -282
package/dist/src/modal-template.js.map +1 -1
package/dist/src/shoelace/active-elements.d.ts +15 -15
package/dist/src/shoelace/active-elements.js +27 -27
package/dist/src/shoelace/active-elements.js.map +1 -1
package/dist/src/shoelace/modal.d.ts +24 -24
package/dist/src/shoelace/modal.js +131 -131
package/dist/src/shoelace/modal.js.map +1 -1
package/dist/src/shoelace/tabbable.d.ts +9 -9
package/dist/src/shoelace/tabbable.js +169 -169
package/dist/src/shoelace/tabbable.js.map +1 -1
package/dist/test/modal-config.test.d.ts +1 -1
package/dist/test/modal-config.test.js +69 -61
package/dist/test/modal-config.test.js.map +1 -1
package/dist/test/modal-manager.test.d.ts +1 -1
package/dist/test/modal-manager.test.js +274 -252
package/dist/test/modal-manager.test.js.map +1 -1
package/dist/test/modal-template.test.d.ts +1 -1
package/dist/test/modal-template.test.js +178 -106
package/dist/test/modal-template.test.js.map +1 -1
package/dist/vite.config.d.ts +2 -2
package/dist/vite.config.js +22 -22
package/dist/vite.config.js.map +1 -1
package/docs/assets/css/main.css +2678 -2678
package/docs/classes/_src_modal_config_.modalconfig.html +429 -429
package/docs/classes/_src_modal_manager_.modalmanager.html +7702 -7702
package/docs/classes/_src_modal_manager_host_bridge_.modalmanagerhostbridge.html +409 -409
package/docs/classes/_src_modal_template_.modaltemplate.html +7096 -7096
package/docs/enums/_src_modal_manager_mode_.modalmanagermode.html +196 -196
package/docs/globals.html +150 -150
package/docs/index.html +252 -252
package/docs/interfaces/_src_modal_manager_host_bridge_interface_.modalmanagerhostbridgeinterface.html +210 -210
package/docs/interfaces/_src_modal_manager_interface_.modalmanagerinterface.html +7095 -7095
package/docs/modules/_index_.html +208 -208
package/docs/modules/_src_modal_config_.html +146 -146
package/docs/modules/_src_modal_manager_.html +146 -146
package/docs/modules/_src_modal_manager_host_bridge_.html +146 -146
package/docs/modules/_src_modal_manager_host_bridge_interface_.html +146 -146
package/docs/modules/_src_modal_manager_interface_.html +146 -146
package/docs/modules/_src_modal_manager_mode_.html +146 -146
package/docs/modules/_src_modal_template_.html +146 -146
package/docs/modules/_test_modal_config_test_.html +106 -106
package/docs/modules/_test_modal_manager_test_.html +106 -106
package/docs/modules/_test_modal_template_test_.html +106 -106
package/index.html +300 -282
package/index.ts +7 -7
package/karma.conf.js +24 -24
package/package.json +85 -85
package/renovate.json +7 -7
package/src/assets/arrow-left-icon.ts +15 -0
package/src/assets/ia-logo-icon.ts +30 -30
package/src/modal-config.ts +133 -117
package/src/modal-manager-host-bridge-interface.ts +13 -13
package/src/modal-manager-host-bridge.ts +82 -82
package/src/modal-manager-interface.ts +30 -28
package/src/modal-manager-mode.ts +10 -10
package/src/modal-manager.ts +303 -258
package/src/modal-template.ts +343 -287
package/src/shoelace/LICENSE.md +6 -6
package/src/shoelace/active-elements.ts +33 -33
package/src/shoelace/modal.ts +166 -166
package/src/shoelace/tabbable.ts +223 -223
package/test/modal-config.test.ts +77 -69
package/test/modal-manager.test.ts +347 -319
package/test/modal-template.test.ts +206 -124
package/tsconfig.json +21 -21
package/vite.config.ts +23 -23

package/src/modal-manager-host-bridge.ts CHANGED Viewed

@@ -1,82 +1,82 @@
-import { throttle } from 'throttle-debounce';
-import { ModalManagerHostBridgeInterface } from './modal-manager-host-bridge-interface';
-import { ModalManagerInterface } from './modal-manager-interface';
-import { ModalManagerMode } from './modal-manager-mode';
-/**
- * The `ModalManagerHostBridge` is a bridge between the `ModalManager` and the
- * host that sets up environment-specific changes when the modal opens and closes.
- *
- * For instance, when the modal opens, this adds a class to the `<body>` tag for styling
- * and adds a `resize` listener to fix a Safari shadow root issue.
- *
- * Consumers can create their own `ModalManagerHostBridgeInterface` classes and pass
- * them into the `ModalManager` if this one does not work for their environment.
- *
- * @export
- * @class ModalManagerHostBridge
- * @implements {ModalManagerHostBridgeInterface}
- */
-export class ModalManagerHostBridge implements ModalManagerHostBridgeInterface {
-  private modalManager: ModalManagerInterface;
-  constructor(modalManager: ModalManagerInterface) {
-    this.modalManager = modalManager;
-  }
-  /**
-   * Handle the mode change
-   *
-   * @private
-   * @memberof ModalManager
-   */
-  handleModeChange(mode: ModalManagerMode): void {
-    switch (mode) {
-      case ModalManagerMode.Open:
-        this.startResizeListener();
-        this.stopDocumentScroll();
-        break;
-      case ModalManagerMode.Closed:
-        this.stopResizeListener();
-        this.resumeDocumentScroll();
-        break;
-    }
-  }
-  private windowResizeThrottler: throttle<() => void> = throttle(
-    100,
-    this.updateModalContainerHeight,
-    { noLeading: false, noTrailing: false }
-  ).bind(this);
-  // This is a workaround for Safari. Safari does not update shadowRoot elements calculated
-  // based on the viewport size (ie. `calc(100vh - 10px)`). It does an initial calculation correctly,
-  // but resizing the window does not cause the calculation to update. Firefox and Chrome both handle
-  // this correctly.
-  // It doesn't matter what css variable you set, it is just forcing Safari to do an update.
-  // Also note that the value has to change on each update for Safari to do the update,
-  // ie. you can't just set a static value.
-  private updateModalContainerHeight(): void {
-    this.modalManager.style.setProperty(
-      '--containerHeight',
-      `${window.innerHeight}px`
-    );
-  }
-  private stopDocumentScroll(): void {
-    document.body.classList.add('modal-manager-open');
-  }
-  private resumeDocumentScroll(): void {
-    document.body.classList.remove('modal-manager-open');
-  }
-  private startResizeListener(): void {
-    window.addEventListener('resize', this.windowResizeThrottler);
-  }
-  private stopResizeListener(): void {
-    window.removeEventListener('resize', this.windowResizeThrottler);
-  }
-}
+import { throttle } from 'throttle-debounce';
+import { ModalManagerHostBridgeInterface } from './modal-manager-host-bridge-interface';
+import { ModalManagerInterface } from './modal-manager-interface';
+import { ModalManagerMode } from './modal-manager-mode';
+/**
+ * The `ModalManagerHostBridge` is a bridge between the `ModalManager` and the
+ * host that sets up environment-specific changes when the modal opens and closes.
+ *
+ * For instance, when the modal opens, this adds a class to the `<body>` tag for styling
+ * and adds a `resize` listener to fix a Safari shadow root issue.
+ *
+ * Consumers can create their own `ModalManagerHostBridgeInterface` classes and pass
+ * them into the `ModalManager` if this one does not work for their environment.
+ *
+ * @export
+ * @class ModalManagerHostBridge
+ * @implements {ModalManagerHostBridgeInterface}
+ */
+export class ModalManagerHostBridge implements ModalManagerHostBridgeInterface {
+  private modalManager: ModalManagerInterface;
+  constructor(modalManager: ModalManagerInterface) {
+    this.modalManager = modalManager;
+  }
+  /**
+   * Handle the mode change
+   *
+   * @private
+   * @memberof ModalManager
+   */
+  handleModeChange(mode: ModalManagerMode): void {
+    switch (mode) {
+      case ModalManagerMode.Open:
+        this.startResizeListener();
+        this.stopDocumentScroll();
+        break;
+      case ModalManagerMode.Closed:
+        this.stopResizeListener();
+        this.resumeDocumentScroll();
+        break;
+    }
+  }
+  private windowResizeThrottler: throttle<() => void> = throttle(
+    100,
+    this.updateModalContainerHeight,
+    { noLeading: false, noTrailing: false }
+  ).bind(this);
+  // This is a workaround for Safari. Safari does not update shadowRoot elements calculated
+  // based on the viewport size (ie. `calc(100vh - 10px)`). It does an initial calculation correctly,
+  // but resizing the window does not cause the calculation to update. Firefox and Chrome both handle
+  // this correctly.
+  // It doesn't matter what css variable you set, it is just forcing Safari to do an update.
+  // Also note that the value has to change on each update for Safari to do the update,
+  // ie. you can't just set a static value.
+  private updateModalContainerHeight(): void {
+    this.modalManager.style.setProperty(
+      '--containerHeight',
+      `${window.innerHeight}px`
+    );
+  }
+  private stopDocumentScroll(): void {
+    document.body.classList.add('modal-manager-open');
+  }
+  private resumeDocumentScroll(): void {
+    document.body.classList.remove('modal-manager-open');
+  }
+  private startResizeListener(): void {
+    window.addEventListener('resize', this.windowResizeThrottler);
+  }
+  private stopResizeListener(): void {
+    window.removeEventListener('resize', this.windowResizeThrottler);
+  }
+}

package/src/modal-manager-interface.ts CHANGED Viewed

@@ -1,28 +1,30 @@
-import { LitElement, TemplateResult } from 'lit';
-import { ModalConfig } from './modal-config';
-import { ModalManagerMode } from './modal-manager-mode';
-export interface ModalManagerInterface extends LitElement {
-  /**
-   * Get the current modal mode.
-   */
-  getMode(): ModalManagerMode;
-  /**
-   * Show a modal from a given ModalConfig
-   *
-   * @param config ModalConfig
-   * @param customModalContent TemplateResult | undefined
-   * @param userClosedModalCallback () => void | undefined an optional callback when the modal is closed
-   */
-  showModal(options: {
-    config: ModalConfig;
-    customModalContent?: TemplateResult;
-    userClosedModalCallback?: () => void;
-  }): Promise<void>;
-  /**
-   * Close the currently open modal
-   */
-  closeModal(): void;
-}
+import { LitElement, TemplateResult } from 'lit';
+import { ModalConfig } from './modal-config';
+import { ModalManagerMode } from './modal-manager-mode';
+export interface ModalManagerInterface extends LitElement {
+  /**
+   * Get the current modal mode.
+   */
+  getMode(): ModalManagerMode;
+  /**
+   * Show a modal from a given ModalConfig
+   *
+   * @param config ModalConfig
+   * @param customModalContent TemplateResult | undefined
+   * @param userClosedModalCallback () => void | undefined an optional callback when the modal is closed
+   * @param userPressedLeftNavButtonCallback () => void | undefined an optional callback when the left nav button is pressed
+   */
+  showModal(options: {
+    config: ModalConfig;
+    customModalContent?: TemplateResult;
+    userClosedModalCallback?: () => void;
+    userPressedLeftNavButtonCallback?: () => void;
+  }): Promise<void>;
+  /**
+   * Close the currently open modal
+   */
+  closeModal(): void;
+}

package/src/modal-manager-mode.ts CHANGED Viewed

@@ -1,10 +1,10 @@
-/**
- * Various modes the modal can be in
- *
- * @export
- * @enum {number}
- */
-export enum ModalManagerMode {
-  Open = 'open',
-  Closed = 'closed',
-}
+/**
+ * Various modes the modal can be in
+ *
+ * @export
+ * @enum {number}
+ */
+export enum ModalManagerMode {
+  Open = 'open',
+  Closed = 'closed',
+}