@universityofmaryland/web-feeds-library 1.2.3 → 1.3.0-beta.0

package/dist/feeds/news/featured.mjs

@@ -0,0 +1,379 @@
+import { ElementBuilder } from "@universityofmaryland/web-builder-library";
+import { card } from "@universityofmaryland/web-elements-library/composite";
+import { gridOffset, gridGap } from "@universityofmaryland/web-elements-library/layout";
+import { LoadingState } from "../../states/loading.mjs";
+import { EmptyState } from "../../states/empty.mjs";
+import { PaginationState } from "../../states/pagination.mjs";
+import { Announcer } from "../../states/announcer.mjs";
+import { newsFetchStrategy } from "../../strategies/fetch/news.mjs";
+import { newsDisplayStrategy } from "../../strategies/display/news.mjs";
+import { dispatch, eventNames } from "../../helpers/events/index.mjs";
+import { setShadowStyles } from "../../helpers/styles/shadow.mjs";
+const INITIAL_ITEMS = 3;
+const LOAD_MORE_ITEMS = 2;
+const createFetchProps = (props, offset) => ({
+  token: props.token,
+  categories: props.categories,
+  isUnion: props.isUnion,
+  numberOfRowsToStart: offset === 0 ? INITIAL_ITEMS : LOAD_MORE_ITEMS,
+  numberOfColumnsToShow: 1,
+  getOffset: () => offset
+});
+const createImageConfig = (entry) => ({
+  imageUrl: entry.image[0]?.url,
+  altText: entry.image[0]?.altText || "News Article Image",
+  linkUrl: entry.url,
+  linkLabel: "Maryland Today Article with image"
+});
+const createAnnouncerMessage = (offset, total, isLazyLoad) => {
+  return isLazyLoad ? `Showing ${offset} of ${total} articles` : `Showing ${offset} articles`;
+};
+class FeaturedFeedState {
+  /**
+   * Initialize state with initial styles
+   *
+   * @param initialStyles - Initial CSS styles
+   */
+  constructor(initialStyles) {
+    this.stylesArray = [];
+    this.shadowRoot = null;
+    this.totalEntries = 0;
+    this.offset = 0;
+    this.hasRenderedOffset = false;
+    this.pagination = null;
+    this.stylesArray.push(initialStyles);
+  }
+  /**
+   * Add styles to the accumulated styles
+   *
+   * @param styles - CSS styles to add
+   */
+  addStyles(styles) {
+    this.stylesArray.push(styles);
+  }
+  /**
+   * Set shadow root reference for style updates
+   *
+   * @param shadow - Shadow root element
+   */
+  setShadowRoot(shadow) {
+    this.shadowRoot = shadow;
+  }
+  /**
+   * Update shadow DOM styles
+   *
+   * @returns Promise that resolves when styles are updated
+   */
+  async updateShadowStyles() {
+    if (!this.shadowRoot) return;
+    await setShadowStyles({
+      shadowRoot: this.shadowRoot,
+      styles: this.getStyles()
+    });
+  }
+  /**
+   * Get accumulated styles as single string
+   *
+   * @returns Combined CSS styles
+   */
+  getStyles() {
+    return this.stylesArray.join("\n");
+  }
+  /**
+   * Get shadow root callback for events
+   *
+   * @returns Callback function for shadow root
+   */
+  getShadowCallback() {
+    return (shadow) => this.setShadowRoot(shadow);
+  }
+  /**
+   * Get current offset
+   *
+   * @returns Current offset
+   */
+  getOffset() {
+    return this.offset;
+  }
+  /**
+   * Set offset to specific value
+   *
+   * @param value - New offset value
+   */
+  setOffset(value) {
+    this.offset = value;
+  }
+  /**
+   * Increment offset by count
+   *
+   * @param count - Number to increment by
+   */
+  incrementOffset(count) {
+    this.offset += count;
+  }
+  /**
+   * Get total entries
+   *
+   * @returns Total entries
+   */
+  getTotalEntries() {
+    return this.totalEntries;
+  }
+  /**
+   * Set total entries
+   *
+   * @param total - Total entries
+   */
+  setTotalEntries(total) {
+    this.totalEntries = total;
+  }
+  /**
+   * Check if offset layout has been rendered
+   *
+   * @returns True if offset layout rendered
+   */
+  hasOffset() {
+    return this.hasRenderedOffset;
+  }
+  /**
+   * Mark offset layout as rendered
+   */
+  markOffsetRendered() {
+    this.hasRenderedOffset = true;
+  }
+  /**
+   * Get pagination state
+   *
+   * @returns Pagination state or null
+   */
+  getPagination() {
+    return this.pagination;
+  }
+  /**
+   * Set pagination state
+   *
+   * @param pagination - Pagination state
+   */
+  setPagination(pagination) {
+    this.pagination = pagination;
+  }
+}
+const createOverlayCard = (entry, state, isThemeDark) => {
+  const overlayCard = newsDisplayStrategy.mapEntryToCard(entry, {
+    isOverlay: true,
+    isThemeDark,
+    imageConfig: () => createImageConfig(entry)
+  });
+  state.addStyles(`
+    ${overlayCard.styles}
+
+    .${card.overlay.imageClassRef} {
+      height: inherit;
+    }
+
+    .${card.overlay.imageClassRef} .umd-asset-image-wrapper-scaled {
+      position: absolute;
+    }
+  `);
+  return overlayCard;
+};
+const createBlockCards = (entries, state, options) => {
+  return entries.map((entry) => {
+    const blockCard = newsDisplayStrategy.mapEntryToCard(entry, {
+      isThemeDark: options.isThemeDark,
+      isTransparent: options.isTransparent,
+      isAligned: true,
+      imageConfig: () => createImageConfig(entry)
+    });
+    state.addStyles(blockCard.styles);
+    return blockCard;
+  });
+};
+const renderFeaturedLayout = async (container, entries, state, props, loadMore) => {
+  const {
+    isThemeDark = false,
+    isTransparent = false,
+    isLayoutReversed = false,
+    overwriteStickyPosition,
+    isLazyLoad = false
+  } = props;
+  if (entries.length < 2 || state.hasOffset()) {
+    return renderStandardGrid(container, entries, state, {
+      isThemeDark,
+      isTransparent
+    });
+  }
+  state.markOffsetRendered();
+  const offsetLayout = gridOffset({
+    columns: 2,
+    isLayoutReversed,
+    stickyTopPosition: overwriteStickyPosition
+  });
+  const gridLayout = gridGap({ columns: 2 });
+  gridLayout.element.setAttribute("id", "umd-featured-news-grid-container");
+  const overlayCard = createOverlayCard(entries[0], state, isThemeDark);
+  const blockCards = createBlockCards(entries.slice(1, 3), state, {
+    isThemeDark,
+    isTransparent
+  });
+  blockCards.forEach((card2) => {
+    gridLayout.element.appendChild(card2.element);
+  });
+  offsetLayout.element.appendChild(overlayCard.element);
+  offsetLayout.element.appendChild(gridLayout.element);
+  container.appendChild(offsetLayout.element);
+  state.addStyles(offsetLayout.styles);
+  state.addStyles(gridLayout.styles);
+  state.setOffset(3);
+  if (isLazyLoad && state.getTotalEntries() > state.getOffset()) {
+    const pagination = new PaginationState({
+      totalEntries: state.getTotalEntries(),
+      offset: state.getOffset(),
+      isLazyLoad: true,
+      callback: loadMore
+    });
+    const paginationElement = pagination.render(container);
+    if (paginationElement) state.addStyles(paginationElement.styles);
+    state.setPagination(pagination);
+  }
+  const message = createAnnouncerMessage(
+    INITIAL_ITEMS,
+    state.getTotalEntries(),
+    isLazyLoad
+  );
+  const announcer = new Announcer({ message });
+  container.appendChild(announcer.getElement());
+  await state.updateShadowStyles();
+};
+const renderStandardGrid = async (container, entries, state, options) => {
+  let gridContainer = container.querySelector(
+    "#umd-featured-news-grid-container"
+  );
+  if (!gridContainer) {
+    const gridLayout = gridGap({ columns: 2 });
+    gridLayout.element.setAttribute("id", "umd-featured-news-grid-container");
+    container.appendChild(gridLayout.element);
+    state.addStyles(gridLayout.styles);
+    gridContainer = gridLayout.element;
+  }
+  const blockCards = createBlockCards(entries, state, options);
+  blockCards.forEach((card2) => {
+    gridContainer.appendChild(card2.element);
+  });
+  state.incrementOffset(entries.length);
+  await state.updateShadowStyles();
+};
+const renderError = async (container, message, state, isThemeDark) => {
+  const emptyState = new EmptyState({ message, isThemeDark });
+  emptyState.render(container);
+  state.addStyles(emptyState.styles);
+  await state.updateShadowStyles();
+};
+const featured = (props) => {
+  const {
+    token,
+    categories,
+    isUnion,
+    isThemeDark = false,
+    isLazyLoad = false,
+    isTransparent = false
+  } = props;
+  const containerBuilder = new ElementBuilder("div").withClassName(
+    "featured-news-feed"
+  );
+  const container = containerBuilder.getElement();
+  const loading = new LoadingState({ isThemeDark });
+  const state = new FeaturedFeedState(loading.styles);
+  const loadMore = async () => {
+    const pagination = state.getPagination();
+    if (pagination) {
+      pagination.remove();
+    }
+    loading.show(container);
+    const fetchProps = createFetchProps(
+      { token, categories, isUnion },
+      state.getOffset()
+    );
+    const variables = newsFetchStrategy.composeApiVariables(fetchProps);
+    const entries = await newsFetchStrategy.fetchEntries(variables);
+    loading.hide();
+    if (!entries || entries.length === 0) return;
+    await renderStandardGrid(container, entries, state, {
+      isThemeDark,
+      isTransparent
+    });
+    if (pagination) {
+      pagination.updateState(state.getOffset(), state.getTotalEntries());
+      if (pagination.styles) state.addStyles(pagination.styles);
+      await state.updateShadowStyles();
+    }
+    const existingAnnouncer = container.querySelector(
+      '[role="status"]'
+    );
+    if (existingAnnouncer) {
+      existingAnnouncer.textContent = createAnnouncerMessage(
+        state.getOffset(),
+        state.getTotalEntries(),
+        isLazyLoad
+      );
+    }
+    dispatch(
+      container,
+      eventNames.FEED_LOADED_MORE,
+      {
+        items: entries,
+        count: entries.length,
+        total: state.getTotalEntries()
+      }
+    );
+  };
+  const initialize = async () => {
+    loading.show(container);
+    const fetchProps = createFetchProps({ token, categories, isUnion }, 0);
+    const variables = newsFetchStrategy.composeApiVariables(fetchProps);
+    const [count, entries] = await Promise.all([
+      newsFetchStrategy.fetchCount(variables),
+      newsFetchStrategy.fetchEntries(variables)
+    ]);
+    loading.hide();
+    if (!entries || entries.length === 0) {
+      await renderError(
+        container,
+        "No news articles found",
+        state,
+        isThemeDark
+      );
+      return;
+    }
+    state.setTotalEntries(count || entries.length);
+    dispatch(container, eventNames.FEED_LOADED, {
+      items: entries,
+      count: entries.length,
+      total: state.getTotalEntries()
+    });
+    await renderFeaturedLayout(container, entries, state, props, loadMore);
+  };
+  initialize();
+  const model = containerBuilder.build();
+  const setPosition = (position) => {
+    const overlayElement = container.querySelector(
+      `.${card.overlay.imageClassRef}`
+    );
+    if (overlayElement) overlayElement.style.top = `${position}px`;
+  };
+  return {
+    element: model.element,
+    get styles() {
+      return state.getStyles();
+    },
+    events: {
+      callback: state.getShadowCallback(),
+      setPosition
+      // Custom event for sticky position control
+    }
+  };
+};
+export {
+  featured as default
+};
+//# sourceMappingURL=featured.mjs.map

package/dist/feeds/news/featured.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"featured.mjs","sources":["../../../source/feeds/news/featured.ts"],"sourcesContent":["/**\n * News Featured Feed (Refactored with Element Builder)\n *\n * Displays news articles with a featured layout:\n * - First article: Large overlay card with sticky positioning\n * - Next 2 articles: Block cards in grid layout\n * - Additional articles: Lazy-loaded block cards\n *\n * Uses Element Builder pattern for clean, declarative construction.\n *\n * @module feeds/news/featured\n */\n\nimport { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport { card } from '@universityofmaryland/web-elements-library/composite';\nimport {\n  gridGap,\n  gridOffset,\n} from '@universityofmaryland/web-elements-library/layout';\nimport {\n  LoadingState,\n  PaginationState,\n  EmptyState,\n  Announcer,\n} from '../../states';\nimport { newsFetchStrategy } from '../../strategies/fetch/news';\nimport { newsDisplayStrategy } from '../../strategies/display/news';\nimport {\n  events as eventUtilities,\n  styles as styleUtilities,\n} from '../../helpers';\nimport { type FeaturedProps } from './_types';\nimport { type ElementModel } from '../../_types';\nimport { type NewsEntry } from 'types/data';\n\n// ============================================================================\n// CONSTANTS\n// ============================================================================\n\n/** Featured layout displays 3 items initially: 1 overlay + 2 block cards */\nconst INITIAL_ITEMS = 3;\n\n/** Lazy loading adds 2 items at a time to fill a row in the 2-column grid */\nconst LOAD_MORE_ITEMS = 2;\n\n// ============================================================================\n// PURE HELPER FUNCTIONS\n// ============================================================================\n\n/**\n * Create base props for fetch strategy\n *\n * @param props - Feed props\n * @param offset - Current offset\n * @returns Base props object for strategy's composeApiVariables\n */\nconst createFetchProps = (\n  props: Pick<FeaturedProps, 'token' | 'categories' | 'isUnion'>,\n  offset: number,\n) => ({\n  token: props.token,\n  categories: props.categories,\n  isUnion: props.isUnion,\n  numberOfRowsToStart: offset === 0 ? INITIAL_ITEMS : LOAD_MORE_ITEMS,\n  numberOfColumnsToShow: 1,\n  getOffset: () => offset,\n});\n\n/**\n * Create image configuration for news entry\n *\n * @param entry - News entry\n * @returns Image config object\n */\nconst createImageConfig = (entry: NewsEntry) => ({\n  imageUrl: entry.image[0]?.url,\n  altText: entry.image[0]?.altText || 'News Article Image',\n  linkUrl: entry.url,\n  linkLabel: 'Maryland Today Article with image',\n});\n\n/**\n * Create announcer message\n *\n * @param offset - Current offset\n * @param total - Total entries\n * @param isLazyLoad - Lazy load enabled\n * @returns Announcer message\n */\nconst createAnnouncerMessage = (\n  offset: number,\n  total: number,\n  isLazyLoad: boolean,\n): string => {\n  return isLazyLoad\n    ? `Showing ${offset} of ${total} articles`\n    : `Showing ${offset} articles`;\n};\n\n// ============================================================================\n// STATE MANAGER CLASS\n// ============================================================================\n\n/**\n * Manages featured feed state and shadow DOM synchronization\n *\n * Encapsulates all mutable state including pagination, offset,\n * and shadow DOM management.\n */\nclass FeaturedFeedState {\n  private stylesArray: string[] = [];\n  private shadowRoot: ShadowRoot | null = null;\n  private totalEntries: number = 0;\n  private offset: number = 0;\n  private hasRenderedOffset: boolean = false;\n  private pagination: PaginationState | null = null;\n\n  /**\n   * Initialize state with initial styles\n   *\n   * @param initialStyles - Initial CSS styles\n   */\n  constructor(initialStyles: string) {\n    this.stylesArray.push(initialStyles);\n  }\n\n  /**\n   * Add styles to the accumulated styles\n   *\n   * @param styles - CSS styles to add\n   */\n  addStyles(styles: string): void {\n    this.stylesArray.push(styles);\n  }\n\n  /**\n   * Set shadow root reference for style updates\n   *\n   * @param shadow - Shadow root element\n   */\n  setShadowRoot(shadow: ShadowRoot): void {\n    this.shadowRoot = shadow;\n  }\n\n  /**\n   * Update shadow DOM styles\n   *\n   * @returns Promise that resolves when styles are updated\n   */\n  async updateShadowStyles(): Promise<void> {\n    if (!this.shadowRoot) return;\n    await styleUtilities.setShadowStyles({\n      shadowRoot: this.shadowRoot,\n      styles: this.getStyles(),\n    });\n  }\n\n  /**\n   * Get accumulated styles as single string\n   *\n   * @returns Combined CSS styles\n   */\n  getStyles(): string {\n    return this.stylesArray.join('\\n');\n  }\n\n  /**\n   * Get shadow root callback for events\n   *\n   * @returns Callback function for shadow root\n   */\n  getShadowCallback(): (shadow: ShadowRoot) => void {\n    return (shadow) => this.setShadowRoot(shadow);\n  }\n\n  /**\n   * Get current offset\n   *\n   * @returns Current offset\n   */\n  getOffset(): number {\n    return this.offset;\n  }\n\n  /**\n   * Set offset to specific value\n   *\n   * @param value - New offset value\n   */\n  setOffset(value: number): void {\n    this.offset = value;\n  }\n\n  /**\n   * Increment offset by count\n   *\n   * @param count - Number to increment by\n   */\n  incrementOffset(count: number): void {\n    this.offset += count;\n  }\n\n  /**\n   * Get total entries\n   *\n   * @returns Total entries\n   */\n  getTotalEntries(): number {\n    return this.totalEntries;\n  }\n\n  /**\n   * Set total entries\n   *\n   * @param total - Total entries\n   */\n  setTotalEntries(total: number): void {\n    this.totalEntries = total;\n  }\n\n  /**\n   * Check if offset layout has been rendered\n   *\n   * @returns True if offset layout rendered\n   */\n  hasOffset(): boolean {\n    return this.hasRenderedOffset;\n  }\n\n  /**\n   * Mark offset layout as rendered\n   */\n  markOffsetRendered(): void {\n    this.hasRenderedOffset = true;\n  }\n\n  /**\n   * Get pagination state\n   *\n   * @returns Pagination state or null\n   */\n  getPagination(): PaginationState | null {\n    return this.pagination;\n  }\n\n  /**\n   * Set pagination state\n   *\n   * @param pagination - Pagination state\n   */\n  setPagination(pagination: PaginationState | null): void {\n    this.pagination = pagination;\n  }\n}\n\n// ============================================================================\n// RENDERING FUNCTIONS\n// ============================================================================\n\n/**\n * Create overlay card for featured entry\n *\n * @param entry - News entry\n * @param state - State manager\n * @param isThemeDark - Dark theme flag\n * @returns Overlay card element model\n */\nconst createOverlayCard = (\n  entry: NewsEntry,\n  state: FeaturedFeedState,\n  isThemeDark: boolean,\n): ElementModel => {\n  const overlayCard = newsDisplayStrategy.mapEntryToCard(entry, {\n    isOverlay: true,\n    isThemeDark,\n    imageConfig: () => createImageConfig(entry),\n  });\n\n  // Add custom overlay styles\n  state.addStyles(`\n    ${overlayCard.styles}\n\n    .${card.overlay.imageClassRef} {\n      height: inherit;\n    }\n\n    .${card.overlay.imageClassRef} .umd-asset-image-wrapper-scaled {\n      position: absolute;\n    }\n  `);\n\n  return overlayCard;\n};\n\n/**\n * Create block cards for entries\n *\n * @param entries - News entries\n * @param state - State manager\n * @param options - Card options\n * @returns Array of block card element models\n */\nconst createBlockCards = (\n  entries: NewsEntry[],\n  state: FeaturedFeedState,\n  options: { isThemeDark: boolean; isTransparent: boolean },\n): ElementModel[] => {\n  return entries.map((entry) => {\n    const blockCard = newsDisplayStrategy.mapEntryToCard(entry, {\n      isThemeDark: options.isThemeDark,\n      isTransparent: options.isTransparent,\n      isAligned: true,\n      imageConfig: () => createImageConfig(entry),\n    });\n\n    state.addStyles(blockCard.styles);\n    return blockCard;\n  });\n};\n\n/**\n * Render featured layout (initial load only)\n *\n * @param container - Container element\n * @param entries - News entries\n * @param state - State manager\n * @param props - Feed props\n * @param loadMore - Load more callback\n * @returns Promise that resolves when rendering is complete\n */\nconst renderFeaturedLayout = async (\n  container: HTMLElement,\n  entries: NewsEntry[],\n  state: FeaturedFeedState,\n  props: FeaturedProps,\n  loadMore: () => Promise<void>,\n): Promise<void> => {\n  const {\n    isThemeDark = false,\n    isTransparent = false,\n    isLayoutReversed = false,\n    overwriteStickyPosition,\n    isLazyLoad = false,\n  } = props;\n\n  // Fall back to standard grid if not enough entries or already rendered\n  if (entries.length < 2 || state.hasOffset()) {\n    return renderStandardGrid(container, entries, state, {\n      isThemeDark,\n      isTransparent,\n    });\n  }\n\n  state.markOffsetRendered();\n\n  // Create offset layout\n  const offsetLayout = gridOffset({\n    columns: 2,\n    isLayoutReversed,\n    stickyTopPosition: overwriteStickyPosition,\n  });\n\n  // Create grid for remaining items\n  const gridLayout = gridGap({ columns: 2 });\n  gridLayout.element.setAttribute('id', 'umd-featured-news-grid-container');\n\n  // First item: overlay card\n  const overlayCard = createOverlayCard(entries[0], state, isThemeDark);\n\n  // Next 2 items: block cards\n  const blockCards = createBlockCards(entries.slice(1, 3), state, {\n    isThemeDark,\n    isTransparent,\n  });\n\n  // Append block cards to grid\n  blockCards.forEach((card) => {\n    gridLayout.element.appendChild(card.element);\n  });\n\n  // Assemble offset layout\n  offsetLayout.element.appendChild(overlayCard.element);\n  offsetLayout.element.appendChild(gridLayout.element);\n  container.appendChild(offsetLayout.element);\n\n  state.addStyles(offsetLayout.styles);\n  state.addStyles(gridLayout.styles);\n  state.setOffset(3); // We've shown 3 items\n\n  // Add pagination if needed\n  if (isLazyLoad && state.getTotalEntries() > state.getOffset()) {\n    const pagination = new PaginationState({\n      totalEntries: state.getTotalEntries(),\n      offset: state.getOffset(),\n      isLazyLoad: true,\n      callback: loadMore,\n    });\n\n    const paginationElement = pagination.render(container);\n    if (paginationElement) state.addStyles(paginationElement.styles);\n    state.setPagination(pagination);\n  }\n\n  // Announcer\n  const message = createAnnouncerMessage(\n    INITIAL_ITEMS,\n    state.getTotalEntries(),\n    isLazyLoad,\n  );\n  const announcer = new Announcer({ message });\n  container.appendChild(announcer.getElement());\n\n  await state.updateShadowStyles();\n};\n\n/**\n * Render standard grid (for lazy-loaded items or fallback)\n *\n * @param container - Container element\n * @param entries - News entries\n * @param state - State manager\n * @param options - Rendering options\n * @returns Promise that resolves when rendering is complete\n */\nconst renderStandardGrid = async (\n  container: HTMLElement,\n  entries: NewsEntry[],\n  state: FeaturedFeedState,\n  options: { isThemeDark: boolean; isTransparent: boolean },\n): Promise<void> => {\n  let gridContainer = container.querySelector(\n    '#umd-featured-news-grid-container',\n  ) as HTMLElement;\n\n  // Create grid if it doesn't exist\n  if (!gridContainer) {\n    const gridLayout = gridGap({ columns: 2 });\n    gridLayout.element.setAttribute('id', 'umd-featured-news-grid-container');\n    container.appendChild(gridLayout.element);\n    state.addStyles(gridLayout.styles);\n    gridContainer = gridLayout.element;\n  }\n\n  // Create and append block cards\n  const blockCards = createBlockCards(entries, state, options);\n  blockCards.forEach((card) => {\n    gridContainer.appendChild(card.element);\n  });\n\n  state.incrementOffset(entries.length);\n\n  await state.updateShadowStyles();\n};\n\n/**\n * Render error state\n *\n * @param container - Container element\n * @param message - Error message\n * @param state - State manager\n * @param isThemeDark - Dark theme flag\n * @returns Promise that resolves when rendering is complete\n */\nconst renderError = async (\n  container: HTMLElement,\n  message: string,\n  state: FeaturedFeedState,\n  isThemeDark: boolean,\n): Promise<void> => {\n  const emptyState = new EmptyState({ message, isThemeDark });\n  emptyState.render(container);\n  state.addStyles(emptyState.styles);\n  await state.updateShadowStyles();\n};\n\n// ============================================================================\n// MAIN EXPORT\n// ============================================================================\n\n/**\n * Create a featured news feed\n *\n * Displays news with featured layout: overlay card + grid.\n * Uses Element Builder pattern for clean construction.\n *\n * @param props - Feed configuration\n * @returns ElementModel with feed element, styles, and events\n *\n * @example\n * ```typescript\n * const feed = newsFeatured({\n *   token: 'my-token',\n *   isLazyLoad: true,\n * });\n * ```\n *\n * @example\n * ```typescript\n * // With custom sticky position\n * const feed = newsFeatured({\n *   token: 'my-token',\n *   overwriteStickyPosition: 100,\n *   isLayoutReversed: true,\n * });\n * ```\n */\nexport default (props: FeaturedProps): ElementModel => {\n  const {\n    token,\n    categories,\n    isUnion,\n    isThemeDark = false,\n    isLazyLoad = false,\n    isTransparent = false,\n  } = props;\n\n  // Create container using ElementBuilder\n  const containerBuilder = new ElementBuilder('div').withClassName(\n    'featured-news-feed',\n  );\n\n  // Get element for manipulation (non-destructive)\n  const container = containerBuilder.getElement();\n\n  // Initialize state management\n  const loading = new LoadingState({ isThemeDark });\n  const state = new FeaturedFeedState(loading.styles);\n\n  /**\n   * Load more articles (for lazy loading)\n   */\n  const loadMore = async (): Promise<void> => {\n    // Remove pagination button\n    const pagination = state.getPagination();\n    if (pagination) {\n      pagination.remove();\n    }\n\n    // Show loading indicator\n    loading.show(container);\n\n    // Load more items\n    const fetchProps = createFetchProps(\n      { token, categories, isUnion },\n      state.getOffset(),\n    );\n    const variables = newsFetchStrategy.composeApiVariables(fetchProps);\n\n    const entries = await newsFetchStrategy.fetchEntries(variables);\n\n    // Hide loading indicator\n    loading.hide();\n\n    if (!entries || entries.length === 0) return;\n\n    await renderStandardGrid(container, entries, state, {\n      isThemeDark,\n      isTransparent,\n    });\n\n    // Update pagination state\n    if (pagination) {\n      pagination.updateState(state.getOffset(), state.getTotalEntries());\n      if (pagination.styles) state.addStyles(pagination.styles);\n      await state.updateShadowStyles();\n    }\n\n    // Update announcer\n    const existingAnnouncer = container.querySelector(\n      '[role=\"status\"]',\n    ) as HTMLElement;\n    if (existingAnnouncer) {\n      existingAnnouncer.textContent = createAnnouncerMessage(\n        state.getOffset(),\n        state.getTotalEntries(),\n        isLazyLoad,\n      );\n    }\n\n    // Dispatch update event\n    eventUtilities.dispatch(\n      container,\n      eventUtilities.eventNames.FEED_LOADED_MORE,\n      {\n        items: entries,\n        count: entries.length,\n        total: state.getTotalEntries(),\n      },\n    );\n  };\n\n  /**\n   * Initialize feed\n   */\n  const initialize = async (): Promise<void> => {\n    loading.show(container);\n\n    // Fetch initial items\n    const fetchProps = createFetchProps({ token, categories, isUnion }, 0);\n    const variables = newsFetchStrategy.composeApiVariables(fetchProps);\n\n    const [count, entries] = await Promise.all([\n      newsFetchStrategy.fetchCount(variables),\n      newsFetchStrategy.fetchEntries(variables),\n    ]);\n\n    loading.hide();\n\n    // Handle no results\n    if (!entries || entries.length === 0) {\n      await renderError(\n        container,\n        'No news articles found',\n        state,\n        isThemeDark,\n      );\n      return;\n    }\n\n    state.setTotalEntries(count || entries.length);\n\n    // Dispatch loaded event\n    eventUtilities.dispatch(container, eventUtilities.eventNames.FEED_LOADED, {\n      items: entries,\n      count: entries.length,\n      total: state.getTotalEntries(),\n    });\n\n    // Render featured layout\n    await renderFeaturedLayout(container, entries, state, props, loadMore);\n  };\n\n  // Start initialization\n  initialize();\n\n  // Build and return element model\n  const model = containerBuilder.build();\n\n  // Custom event: allow external control of sticky position\n  const setPosition = (position: number) => {\n    const overlayElement = container.querySelector(\n      `.${card.overlay.imageClassRef}`,\n    ) as HTMLElement;\n    if (overlayElement) overlayElement.style.top = `${position}px`;\n  };\n\n  return {\n    element: model.element,\n    get styles() {\n      return state.getStyles();\n    },\n    events: {\n      callback: state.getShadowCallback(),\n      setPosition, // Custom event for sticky position control\n    },\n  };\n};\n"],"names":["styleUtilities.setShadowStyles","card","eventUtilities.dispatch","eventUtilities.eventNames"],"mappings":"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"}

package/dist/feeds/news/grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../../source/feeds/news/grid.ts"],"names":[],"mappings":"AAgBA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAC3C,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;yBA6BjC,OAAO,UAAU,KAAG,YAAY;AAAhD,wBAiBE"}

package/dist/feeds/news/grid.js

@@ -0,0 +1,36 @@
+"use strict";
+const createBaseFeed = require("../../factory/core/createBaseFeed.js");
+require("@universityofmaryland/web-builder-library");
+require("@universityofmaryland/web-styles-library");
+require("@universityofmaryland/web-styles-library/typography");
+require("@universityofmaryland/web-utilities-library/theme");
+require("@universityofmaryland/web-elements-library");
+require("@universityofmaryland/web-elements-library/composite");
+require("@universityofmaryland/web-elements-library/atomic");
+require("@universityofmaryland/web-utilities-library/elements");
+const news$1 = require("../../strategies/display/news.js");
+require("@universityofmaryland/web-utilities-library/network");
+require("../../strategies/fetch/events.js");
+const news = require("../../strategies/fetch/news.js");
+require("../../strategies/fetch/experts.js");
+const grid$1 = require("../../strategies/layout/grid.js");
+require("@universityofmaryland/web-elements-library/layout");
+const grid = (props) => {
+  const { isTypeOverlay = false } = props;
+  return createBaseFeed.createBaseFeed({
+    ...props,
+    isOverlay: isTypeOverlay,
+    isAligned: !isTypeOverlay,
+    fetchStrategy: news.newsFetchStrategy,
+    displayStrategy: news$1.newsDisplayStrategy,
+    layoutStrategy: isTypeOverlay ? grid$1.gridLayout : grid$1.gridGapLayout,
+    imageConfig: (entry) => ({
+      imageUrl: entry.image[0].url,
+      altText: entry.image[0].altText || "News Article Image",
+      linkUrl: entry.url,
+      linkLabel: "Maryland Today Article with image"
+    })
+  });
+};
+module.exports = grid;
+//# sourceMappingURL=grid.js.map

package/dist/feeds/news/grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.js","sources":["../../../source/feeds/news/grid.ts"],"sourcesContent":["/**\n * News Grid Feed (Factory Pattern)\n *\n * Grid layout for news article entries using the feed factory pattern.\n * This is the NEW implementation using factory + strategies.\n *\n * @module composite/news/grid-new\n */\n\nimport { createBaseFeed } from 'factory';\nimport {\n  newsFetchStrategy,\n  newsDisplayStrategy,\n  gridLayout,\n  gridGapLayout,\n} from 'strategies';\nimport { type BlockProps } from './_types';\nimport { type ElementModel } from '../../_types';\n\n/**\n * Create a news grid feed\n *\n * @param props - Feed configuration\n * @returns ElementModel with feed element and styles\n *\n * @example\n * ```typescript\n * // Standard grid with gap\n * const feed = newsGrid({\n *   token: 'my-token',\n *   numberOfColumnsToShow: 3,\n *   numberOfRowsToStart: 2,\n *   isLazyLoad: true,\n * });\n *\n * // Overlay grid\n * const overlayFeed = newsGrid({\n *   token: 'my-token',\n *   numberOfColumnsToShow: 3,\n *   numberOfRowsToStart: 2,\n *   isTypeOverlay: true,\n * });\n *\n * document.body.appendChild(feed.element);\n * ```\n */\nexport default (props: BlockProps): ElementModel => {\n  const { isTypeOverlay = false } = props;\n\n  return createBaseFeed({\n    ...props,\n    isOverlay: isTypeOverlay,\n    isAligned: !isTypeOverlay,\n    fetchStrategy: newsFetchStrategy,\n    displayStrategy: newsDisplayStrategy,\n    layoutStrategy: isTypeOverlay ? gridLayout : gridGapLayout,\n    imageConfig: (entry) => ({\n      imageUrl: entry.image[0].url,\n      altText: entry.image[0].altText || 'News Article Image',\n      linkUrl: entry.url,\n      linkLabel: 'Maryland Today Article with image',\n    }),\n  });\n};\n"],"names":["createBaseFeed","newsFetchStrategy","newsDisplayStrategy","gridLayout","gridGapLayout"],"mappings":";;;;;;;;;;;;;;;;;AA8CA,MAAA,OAAe,CAAC,UAAoC;AAClD,QAAM,EAAE,gBAAgB,MAAA,IAAU;AAElC,SAAOA,8BAAe;AAAA,IACpB,GAAG;AAAA,IACH,WAAW;AAAA,IACX,WAAW,CAAC;AAAA,IACZ,eAAeC,KAAAA;AAAAA,IACf,iBAAiBC,OAAAA;AAAAA,IACjB,gBAAgB,gBAAgBC,OAAAA,aAAaC,OAAAA;AAAAA,IAC7C,aAAa,CAAC,WAAW;AAAA,MACvB,UAAU,MAAM,MAAM,CAAC,EAAE;AAAA,MACzB,SAAS,MAAM,MAAM,CAAC,EAAE,WAAW;AAAA,MACnC,SAAS,MAAM;AAAA,MACf,WAAW;AAAA,IAAA;AAAA,EACb,CACD;AACH;;"}

package/dist/feeds/news/grid.mjs

@@ -0,0 +1,37 @@
+import { createBaseFeed } from "../../factory/core/createBaseFeed.mjs";
+import "@universityofmaryland/web-builder-library";
+import "@universityofmaryland/web-styles-library";
+import "@universityofmaryland/web-styles-library/typography";
+import "@universityofmaryland/web-utilities-library/theme";
+import "@universityofmaryland/web-elements-library";
+import "@universityofmaryland/web-elements-library/composite";
+import "@universityofmaryland/web-elements-library/atomic";
+import "@universityofmaryland/web-utilities-library/elements";
+import { newsDisplayStrategy } from "../../strategies/display/news.mjs";
+import "@universityofmaryland/web-utilities-library/network";
+import "../../strategies/fetch/events.mjs";
+import { newsFetchStrategy } from "../../strategies/fetch/news.mjs";
+import "../../strategies/fetch/experts.mjs";
+import { gridLayout, gridGapLayout } from "../../strategies/layout/grid.mjs";
+import "@universityofmaryland/web-elements-library/layout";
+const grid = (props) => {
+  const { isTypeOverlay = false } = props;
+  return createBaseFeed({
+    ...props,
+    isOverlay: isTypeOverlay,
+    isAligned: !isTypeOverlay,
+    fetchStrategy: newsFetchStrategy,
+    displayStrategy: newsDisplayStrategy,
+    layoutStrategy: isTypeOverlay ? gridLayout : gridGapLayout,
+    imageConfig: (entry) => ({
+      imageUrl: entry.image[0].url,
+      altText: entry.image[0].altText || "News Article Image",
+      linkUrl: entry.url,
+      linkLabel: "Maryland Today Article with image"
+    })
+  });
+};
+export {
+  grid as default
+};
+//# sourceMappingURL=grid.mjs.map

package/dist/feeds/news/grid.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid.mjs","sources":["../../../source/feeds/news/grid.ts"],"sourcesContent":["/**\n * News Grid Feed (Factory Pattern)\n *\n * Grid layout for news article entries using the feed factory pattern.\n * This is the NEW implementation using factory + strategies.\n *\n * @module composite/news/grid-new\n */\n\nimport { createBaseFeed } from 'factory';\nimport {\n  newsFetchStrategy,\n  newsDisplayStrategy,\n  gridLayout,\n  gridGapLayout,\n} from 'strategies';\nimport { type BlockProps } from './_types';\nimport { type ElementModel } from '../../_types';\n\n/**\n * Create a news grid feed\n *\n * @param props - Feed configuration\n * @returns ElementModel with feed element and styles\n *\n * @example\n * ```typescript\n * // Standard grid with gap\n * const feed = newsGrid({\n *   token: 'my-token',\n *   numberOfColumnsToShow: 3,\n *   numberOfRowsToStart: 2,\n *   isLazyLoad: true,\n * });\n *\n * // Overlay grid\n * const overlayFeed = newsGrid({\n *   token: 'my-token',\n *   numberOfColumnsToShow: 3,\n *   numberOfRowsToStart: 2,\n *   isTypeOverlay: true,\n * });\n *\n * document.body.appendChild(feed.element);\n * ```\n */\nexport default (props: BlockProps): ElementModel => {\n  const { isTypeOverlay = false } = props;\n\n  return createBaseFeed({\n    ...props,\n    isOverlay: isTypeOverlay,\n    isAligned: !isTypeOverlay,\n    fetchStrategy: newsFetchStrategy,\n    displayStrategy: newsDisplayStrategy,\n    layoutStrategy: isTypeOverlay ? gridLayout : gridGapLayout,\n    imageConfig: (entry) => ({\n      imageUrl: entry.image[0].url,\n      altText: entry.image[0].altText || 'News Article Image',\n      linkUrl: entry.url,\n      linkLabel: 'Maryland Today Article with image',\n    }),\n  });\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AA8CA,MAAA,OAAe,CAAC,UAAoC;AAClD,QAAM,EAAE,gBAAgB,MAAA,IAAU;AAElC,SAAO,eAAe;AAAA,IACpB,GAAG;AAAA,IACH,WAAW;AAAA,IACX,WAAW,CAAC;AAAA,IACZ,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,gBAAgB,gBAAgB,aAAa;AAAA,IAC7C,aAAa,CAAC,WAAW;AAAA,MACvB,UAAU,MAAM,MAAM,CAAC,EAAE;AAAA,MACzB,SAAS,MAAM,MAAM,CAAC,EAAE,WAAW;AAAA,MACnC,SAAS,MAAM;AAAA,MACf,WAAW;AAAA,IAAA;AAAA,EACb,CACD;AACH;"}

package/dist/feeds/news/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../source/feeds/news/index.ts"],"names":[],"mappings":"AAqBA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AAqBjD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AAoBzC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC"}

package/dist/feeds/news/list.d.ts

@@ -0,0 +1,5 @@
+import { ListProps } from './_types';
+import { ElementModel } from '../../_types';
+declare const _default: (props: ListProps) => ElementModel;
+export default _default;
+//# sourceMappingURL=list.d.ts.map

package/dist/feeds/news/list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../source/feeds/news/list.ts"],"names":[],"mappings":"AAeA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;yBAoBjC,OAAO,SAAS,KAAG,YAAY;AAA/C,wBAcK"}

package/dist/feeds/news/list.js

@@ -0,0 +1,33 @@
+"use strict";
+const createBaseFeed = require("../../factory/core/createBaseFeed.js");
+require("@universityofmaryland/web-builder-library");
+require("@universityofmaryland/web-styles-library");
+require("@universityofmaryland/web-styles-library/typography");
+require("@universityofmaryland/web-utilities-library/theme");
+require("@universityofmaryland/web-elements-library");
+require("@universityofmaryland/web-elements-library/composite");
+require("@universityofmaryland/web-elements-library/atomic");
+require("@universityofmaryland/web-utilities-library/elements");
+const news$1 = require("../../strategies/display/news.js");
+require("@universityofmaryland/web-utilities-library/network");
+require("../../strategies/fetch/events.js");
+const news = require("../../strategies/fetch/news.js");
+require("../../strategies/fetch/experts.js");
+const grid = require("../../strategies/layout/grid.js");
+require("@universityofmaryland/web-elements-library/layout");
+const list = (props) => createBaseFeed.createBaseFeed({
+  ...props,
+  cardType: "list",
+  isAligned: false,
+  fetchStrategy: news.newsFetchStrategy,
+  displayStrategy: news$1.newsDisplayStrategy,
+  layoutStrategy: grid.stackedLayout,
+  imageConfig: (entry) => ({
+    imageUrl: entry.image[0].url,
+    altText: entry.image[0].altText || "News Article Image",
+    linkUrl: entry.url,
+    linkLabel: "Maryland Today Article with image"
+  })
+});
+module.exports = list;
+//# sourceMappingURL=list.js.map

package/dist/feeds/news/list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.js","sources":["../../../source/feeds/news/list.ts"],"sourcesContent":["/**\n * News List Feed (Factory Pattern)\n *\n * List layout for news article entries using the feed factory pattern.\n * This is the NEW implementation using factory + strategies.\n *\n * @module composite/news/list-new\n */\n\nimport { createBaseFeed } from 'factory';\nimport {\n  newsFetchStrategy,\n  newsDisplayStrategy,\n  stackedLayout,\n} from 'strategies';\nimport { type ListProps } from './_types';\nimport { type ElementModel } from '../../_types';\n\n/**\n * Create a news list feed\n *\n * @param props - Feed configuration\n * @returns ElementModel with feed element and styles\n *\n * @example\n * ```typescript\n * const feed = newsList({\n *   token: 'my-token',\n *   numberOfRowsToStart: 5,\n *   isLazyLoad: true,\n *   categories: ['research', 'campus-life'],\n * });\n *\n * document.body.appendChild(feed.element);\n * ```\n */\nexport default (props: ListProps): ElementModel =>\n  createBaseFeed({\n    ...props,\n    cardType: 'list',\n    isAligned: false,\n    fetchStrategy: newsFetchStrategy,\n    displayStrategy: newsDisplayStrategy,\n    layoutStrategy: stackedLayout,\n    imageConfig: (entry) => ({\n      imageUrl: entry.image[0].url,\n      altText: entry.image[0].altText || 'News Article Image',\n      linkUrl: entry.url,\n      linkLabel: 'Maryland Today Article with image',\n    }),\n  });\n"],"names":["createBaseFeed","newsFetchStrategy","newsDisplayStrategy","stackedLayout"],"mappings":";;;;;;;;;;;;;;;;;AAoCA,MAAA,OAAe,CAAC,UACdA,eAAAA,eAAe;AAAA,EACb,GAAG;AAAA,EACH,UAAU;AAAA,EACV,WAAW;AAAA,EACX,eAAeC,KAAAA;AAAAA,EACf,iBAAiBC,OAAAA;AAAAA,EACjB,gBAAgBC,KAAAA;AAAAA,EAChB,aAAa,CAAC,WAAW;AAAA,IACvB,UAAU,MAAM,MAAM,CAAC,EAAE;AAAA,IACzB,SAAS,MAAM,MAAM,CAAC,EAAE,WAAW;AAAA,IACnC,SAAS,MAAM;AAAA,IACf,WAAW;AAAA,EAAA;AAEf,CAAC;;"}

package/dist/feeds/news/list.mjs

@@ -0,0 +1,34 @@
+import { createBaseFeed } from "../../factory/core/createBaseFeed.mjs";
+import "@universityofmaryland/web-builder-library";
+import "@universityofmaryland/web-styles-library";
+import "@universityofmaryland/web-styles-library/typography";
+import "@universityofmaryland/web-utilities-library/theme";
+import "@universityofmaryland/web-elements-library";
+import "@universityofmaryland/web-elements-library/composite";
+import "@universityofmaryland/web-elements-library/atomic";
+import "@universityofmaryland/web-utilities-library/elements";
+import { newsDisplayStrategy } from "../../strategies/display/news.mjs";
+import "@universityofmaryland/web-utilities-library/network";
+import "../../strategies/fetch/events.mjs";
+import { newsFetchStrategy } from "../../strategies/fetch/news.mjs";
+import "../../strategies/fetch/experts.mjs";
+import { stackedLayout } from "../../strategies/layout/grid.mjs";
+import "@universityofmaryland/web-elements-library/layout";
+const list = (props) => createBaseFeed({
+  ...props,
+  cardType: "list",
+  isAligned: false,
+  fetchStrategy: newsFetchStrategy,
+  displayStrategy: newsDisplayStrategy,
+  layoutStrategy: stackedLayout,
+  imageConfig: (entry) => ({
+    imageUrl: entry.image[0].url,
+    altText: entry.image[0].altText || "News Article Image",
+    linkUrl: entry.url,
+    linkLabel: "Maryland Today Article with image"
+  })
+});
+export {
+  list as default
+};
+//# sourceMappingURL=list.mjs.map

package/dist/feeds/news/list.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.mjs","sources":["../../../source/feeds/news/list.ts"],"sourcesContent":["/**\n * News List Feed (Factory Pattern)\n *\n * List layout for news article entries using the feed factory pattern.\n * This is the NEW implementation using factory + strategies.\n *\n * @module composite/news/list-new\n */\n\nimport { createBaseFeed } from 'factory';\nimport {\n  newsFetchStrategy,\n  newsDisplayStrategy,\n  stackedLayout,\n} from 'strategies';\nimport { type ListProps } from './_types';\nimport { type ElementModel } from '../../_types';\n\n/**\n * Create a news list feed\n *\n * @param props - Feed configuration\n * @returns ElementModel with feed element and styles\n *\n * @example\n * ```typescript\n * const feed = newsList({\n *   token: 'my-token',\n *   numberOfRowsToStart: 5,\n *   isLazyLoad: true,\n *   categories: ['research', 'campus-life'],\n * });\n *\n * document.body.appendChild(feed.element);\n * ```\n */\nexport default (props: ListProps): ElementModel =>\n  createBaseFeed({\n    ...props,\n    cardType: 'list',\n    isAligned: false,\n    fetchStrategy: newsFetchStrategy,\n    displayStrategy: newsDisplayStrategy,\n    layoutStrategy: stackedLayout,\n    imageConfig: (entry) => ({\n      imageUrl: entry.image[0].url,\n      altText: entry.image[0].altText || 'News Article Image',\n      linkUrl: entry.url,\n      linkLabel: 'Maryland Today Article with image',\n    }),\n  });\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAoCA,MAAA,OAAe,CAAC,UACd,eAAe;AAAA,EACb,GAAG;AAAA,EACH,UAAU;AAAA,EACV,WAAW;AAAA,EACX,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,aAAa,CAAC,WAAW;AAAA,IACvB,UAAU,MAAM,MAAM,CAAC,EAAE;AAAA,IACzB,SAAS,MAAM,MAAM,CAAC,EAAE,WAAW;AAAA,IACnC,SAAS,MAAM;AAAA,IACf,WAAW;AAAA,EAAA;AAEf,CAAC;"}

package/dist/{utilities → helpers}/events/index.d.ts

@@ -1,5 +1,6 @@
 export declare const eventNames: {
     FEED_LOADED: string;
+    FEED_LOADED_MORE: string;
     FEED_ERROR: string;
 };
 export interface FeedEventDetails {

package/dist/helpers/events/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../source/helpers/events/index.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,UAAU;;;;CAStB,CAAC;AAKF,MAAM,WAAW,gBAAgB;IAE/B,KAAK,CAAC,EAAE,GAAG,EAAE,CAAC;IAGd,KAAK,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAGvB,IAAI,CAAC,EAAE,GAAG,CAAC;IAGX,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAuBD,eAAO,MAAM,QAAQ,GACnB,SAAS,WAAW,EACpB,WAAW,MAAM,EACjB,QAAQ,gBAAgB,KACvB,OAQF,CAAC;AA0BF,eAAO,MAAM,MAAM,GACjB,SAAS,WAAW,EACpB,WAAW,MAAM,EACjB,UAAU,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,EAC5C,UAAU,uBAAuB,KAChC,CAAC,MAAM,IAAI,CAWb,CAAC"}

package/dist/{utilities → helpers}/events/index.js

@@ -3,6 +3,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const eventNames = {
   /** Triggered when a feed has finished loading its content */
   FEED_LOADED: "feed:loaded",
+  /** Triggered when a feed loads more content (lazy loading/pagination) */
+  FEED_LOADED_MORE: "feed:loaded:more",
   /** Triggered when an error occurs during feed loading or processing */
   FEED_ERROR: "feed:error"
 };

package/dist/helpers/events/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../source/helpers/events/index.ts"],"sourcesContent":["/**\n * Event names supported by the feeds library.\n * These can be used for consistent event handling across implementations.\n */\nexport const eventNames = {\n  /** Triggered when a feed has finished loading its content */\n  FEED_LOADED: 'feed:loaded',\n\n  /** Triggered when a feed loads more content (lazy loading/pagination) */\n  FEED_LOADED_MORE: 'feed:loaded:more',\n\n  /** Triggered when an error occurs during feed loading or processing */\n  FEED_ERROR: 'feed:error',\n};\n\n/**\n * Custom event details for different feed events.\n */\nexport interface FeedEventDetails {\n  /** Items in the feed that have been loaded */\n  items?: any[];\n\n  /** Error information if a feed failed to load */\n  error?: Error | string;\n\n  /** Information about a specific item that was clicked */\n  item?: any;\n\n  /** Additional custom data that may be included with any event */\n  [key: string]: any;\n}\n\n/**\n * Dispatches a custom feed event on the specified element.\n *\n * @param element - The element to dispatch the event on\n * @param eventName - Name of the event to dispatch (use eventNames constants for consistency)\n * @param detail - Event details to include\n * @returns True if the event was dispatched successfully and not cancelled\n *\n * @example\n * ```typescript\n * import { events } from '@universityofmaryland/web-feeds-library/utilities';\n *\n * // Dispatch a feed loaded event\n * events.dispatch(feedContainer, events.eventNames.FEED_LOADED, { items: loadedItems });\n *\n * // Listen for feed loaded events\n * feedContainer.addEventListener(events.eventNames.FEED_LOADED, (event) => {\n *   console.log('Feed loaded with', event.detail.items.length, 'items');\n * });\n * ```\n */\nexport const dispatch = (\n  element: HTMLElement,\n  eventName: string,\n  detail: FeedEventDetails,\n): boolean => {\n  const event = new CustomEvent(eventName, {\n    detail,\n    bubbles: true,\n    cancelable: true,\n  });\n\n  return element.dispatchEvent(event);\n};\n\n/**\n * Adds an event listener for a specific feed event with proper TypeScript typings for the event detail.\n *\n * @param element - The element to attach the event listener to\n * @param eventName - Name of the event to listen for (use eventNames constants for consistency)\n * @param callback - Function to call when the event is triggered\n * @param options - Standard addEventListener options (capture, once, passive, etc.)\n * @returns A function that removes the event listener when called\n *\n * @example\n * ```typescript\n * import { events } from '@universityofmaryland/web-feeds-library/utilities';\n *\n * // Add a typed event listener\n * const removeListener = events.listen(\n *   feedContainer,\n *   events.eventNames.FEED_LOADED,\n *   (detail) => console.log('Feed loaded with', detail.items.length, 'items')\n * );\n *\n * // Later, if needed:\n * removeListener();\n * ```\n */\nexport const listen = (\n  element: HTMLElement,\n  eventName: string,\n  callback: (detail: FeedEventDetails) => void,\n  options?: AddEventListenerOptions,\n): (() => void) => {\n  const eventListener = (event: Event) => {\n    const customEvent = event as CustomEvent<FeedEventDetails>;\n    callback(customEvent.detail);\n  };\n\n  element.addEventListener(eventName, eventListener, options);\n\n  return () => {\n    element.removeEventListener(eventName, eventListener, options);\n  };\n};\n"],"names":[],"mappings":";;AAIO,MAAM,aAAa;AAAA;AAAA,EAExB,aAAa;AAAA;AAAA,EAGb,kBAAkB;AAAA;AAAA,EAGlB,YAAY;AACd;AAwCO,MAAM,WAAW,CACtB,SACA,WACA,WACY;AACZ,QAAM,QAAQ,IAAI,YAAY,WAAW;AAAA,IACvC;AAAA,IACA,SAAS;AAAA,IACT,YAAY;AAAA,EAAA,CACb;AAED,SAAO,QAAQ,cAAc,KAAK;AACpC;;;"}