@universityofmaryland/web-elements-library 1.5.9 → 1.6.0-beta.1

package/dist/composite/carousel/wide/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../source/composite/carousel/wide/index.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport { assets } from 'atomic';\nimport { createContainer } from './container';\nimport { type CarouselWideProps } from '../_types';\n\ninterface CarouselState {\n  currentIndex: number;\n  isAnimating: boolean;\n  slides: CarouselWideProps['slides'];\n}\n\ninterface CarouselRefs {\n  container: HTMLElement;\n  slidesContainer: HTMLDivElement;\n  slides: HTMLElement[];\n  previews: {\n    left: HTMLElement;\n    right: HTMLElement;\n  };\n  controls: {\n    prev: HTMLButtonElement;\n    next: HTMLButtonElement;\n  };\n  indicator: {\n    element: HTMLElement;\n    position: (index: number) => void;\n  };\n  info: HTMLParagraphElement;\n}\n\n// Constants\nconst ANIMATION_TIME: 500 = 500;\nconst PREVIEW_ANIMATION_TIME: 440 = 440; // 60ms faster than main animation\n\n// Pure animation functions\nconst getAdjacentIndices = (\n  currentIndex: number,\n  totalSlides: number,\n): { leftIndex: number; rightIndex: number } => {\n  const lastIndex = totalSlides - 1;\n  return {\n    leftIndex: currentIndex === 0 ? lastIndex : currentIndex - 1,\n    rightIndex: currentIndex === lastIndex ? 0 : currentIndex + 1,\n  };\n};\n\nconst positionSlideOffScreen = (\n  slide: HTMLElement,\n  direction: 'left' | 'right',\n): void => {\n  slide.setAttribute('data-direction', direction);\n  slide.setAttribute('data-animating', 'true');\n  slide.offsetHeight; // Force reflow\n};\n\nconst activateSlideTransition = (\n  slide: HTMLElement,\n  direction?: 'left' | 'right',\n): void => {\n  if (direction) {\n    slide.setAttribute('data-direction', direction);\n  } else {\n    slide.removeAttribute('data-direction');\n    slide.setAttribute('data-active', 'true');\n  }\n};\n\nconst cleanupSlideTransition = (slide: HTMLElement, isNew: boolean): void => {\n  if (isNew) {\n    slide.removeAttribute('data-animating');\n  } else {\n    slide.removeAttribute('data-active');\n    slide.removeAttribute('data-direction');\n    slide.removeAttribute('data-content-visible');\n  }\n};\n\n// Pure preview functions\nconst createPreviewElement = (\n  slide: CarouselWideProps['slides'][0],\n): HTMLElement => {\n  const imageCopy = slide.image.cloneNode(true) as HTMLImageElement;\n  const preview = assets.image.background({\n    element: imageCopy,\n    isScaled: true,\n  });\n\n  preview.element.style.transition = `transform ${PREVIEW_ANIMATION_TIME}ms ease-in-out`;\n  return preview.element;\n};\n\nconst clearPreviewContainer = (container: HTMLElement): void => {\n  while (container.firstChild) {\n    container.removeChild(container.firstChild);\n  }\n};\n\nconst appendPreviewWithAnimation = (\n  container: HTMLElement,\n  preview: HTMLElement,\n  animationDirection: 'reverse' | 'advance',\n): void => {\n  // Position off-screen initially based on animation direction\n  // For advance (forward), new content comes from right\n  // For reverse (backward), new content comes from left\n  preview.style.transform =\n    animationDirection === 'advance' ? 'translateX(100%)' : 'translateX(-100%)';\n\n  container.appendChild(preview);\n\n  // Trigger animation to slide in\n  requestAnimationFrame(() => {\n    preview.style.transform = 'translateX(0)';\n  });\n};\n\nconst animatePreviewOut = (\n  preview: HTMLElement,\n  animationDirection: 'reverse' | 'advance',\n): Promise<void> => {\n  return new Promise((resolve) => {\n    // For advance (forward), old content exits to left\n    // For reverse (backward), old content exits to right\n    preview.style.transform =\n      animationDirection === 'advance'\n        ? 'translateX(-100%)'\n        : 'translateX(100%)';\n\n    setTimeout(() => {\n      if (preview.parentNode) {\n        preview.parentNode.removeChild(preview);\n      }\n      resolve();\n    }, PREVIEW_ANIMATION_TIME);\n  });\n};\n\n// State management\nconst updatePreviews = (\n  refs: CarouselRefs,\n  state: CarouselState,\n  direction?: 'reverse' | 'advance',\n): void => {\n  const { currentIndex, slides } = state;\n  const { leftIndex, rightIndex } = getAdjacentIndices(\n    currentIndex,\n    slides.length,\n  );\n\n  // Handle left preview\n  if (slides[leftIndex]) {\n    const existingLeft = refs.previews.left.firstElementChild as HTMLElement;\n    if (existingLeft && direction) {\n      animatePreviewOut(existingLeft, direction);\n    } else if (existingLeft) {\n      clearPreviewContainer(refs.previews.left);\n    }\n\n    const leftPreview = createPreviewElement(slides[leftIndex]);\n    if (direction) {\n      appendPreviewWithAnimation(refs.previews.left, leftPreview, direction);\n    } else {\n      refs.previews.left.appendChild(leftPreview);\n    }\n  }\n\n  // Handle right preview\n  if (slides[rightIndex]) {\n    const existingRight = refs.previews.right.firstElementChild as HTMLElement;\n    if (existingRight && direction) {\n      animatePreviewOut(existingRight, direction);\n    } else if (existingRight) {\n      clearPreviewContainer(refs.previews.right);\n    }\n\n    const rightPreview = createPreviewElement(slides[rightIndex]);\n    if (direction) {\n      appendPreviewWithAnimation(refs.previews.right, rightPreview, direction);\n    } else {\n      refs.previews.right.appendChild(rightPreview);\n    }\n  }\n};\n\nconst updateInfo = (refs: CarouselRefs, newIndex: number) => {\n  refs.info.textContent = `Slide ${newIndex + 1} Selected`;\n};\n\nconst animateSlides = (\n  refs: CarouselRefs,\n  state: CarouselState,\n  newIndex: number,\n  direction: 'reverse' | 'advance',\n) => {\n  if (state.isAnimating || state.currentIndex === newIndex) return;\n  state.isAnimating = true;\n\n  const currentSlide = refs.slides[state.currentIndex];\n  const newSlide = refs.slides[newIndex];\n\n  // Disable controls during animation\n  refs.controls.prev.setAttribute('disabled', '');\n  refs.controls.next.setAttribute('disabled', '');\n\n  // Position new slide off-screen\n  const newSlideDirection = direction === 'reverse' ? 'left' : 'right';\n  positionSlideOffScreen(newSlide, newSlideDirection);\n\n  // Update indicator position\n  refs.indicator.position(newIndex);\n\n  // Start synchronized animations for all frames\n  requestAnimationFrame(() => {\n    // Animate main slides\n    activateSlideTransition(newSlide);\n    const currentSlideDirection = direction === 'reverse' ? 'right' : 'left';\n    activateSlideTransition(currentSlide, currentSlideDirection);\n\n    // Update previews with animation (this will animate in sync)\n    const nextState = { ...state, currentIndex: newIndex };\n    updatePreviews(refs, nextState, direction);\n  });\n\n  // Clean up after animation\n  setTimeout(() => {\n    // Clean up main slides\n    cleanupSlideTransition(currentSlide, false);\n    cleanupSlideTransition(newSlide, true);\n\n    // Show content with fade-in animation\n    newSlide.setAttribute('data-content-visible', 'true');\n\n    // Re-enable controls\n    refs.controls.prev.removeAttribute('disabled');\n    refs.controls.next.removeAttribute('disabled');\n\n    // Update state\n    state.currentIndex = newIndex;\n    state.isAnimating = false;\n\n    // Update accessibility info\n    updateInfo(refs, newIndex);\n  }, ANIMATION_TIME);\n};\n\nconst setupSliderControls = (refs: CarouselRefs, state: CarouselState) => {\n  const lastIndex = state.slides.length - 1;\n\n  refs.controls.prev.addEventListener('click', () => {\n    if (state.isAnimating) return;\n\n    const newIndex =\n      state.currentIndex === lastIndex ? 0 : state.currentIndex + 1;\n    animateSlides(refs, state, newIndex, 'advance');\n  });\n\n  refs.controls.next.addEventListener('click', () => {\n    if (state.isAnimating) return;\n\n    const newIndex =\n      state.currentIndex === 0 ? lastIndex : state.currentIndex - 1;\n    animateSlides(refs, state, newIndex, 'reverse');\n  });\n};\n\n// Main component\nexport default (props: CarouselWideProps) => {\n  const { title } = props;\n\n  // Initialize state early\n  const state: CarouselState = {\n    currentIndex: 0,\n    isAnimating: false,\n    slides: props.slides,\n  };\n\n  const container = createContainer(props, (index: number) => {\n    if (state.isAnimating || state.currentIndex === index) return;\n\n    const direction = state.currentIndex > index ? 'reverse' : 'advance';\n    animateSlides(refs, state, index, direction);\n  });\n\n  const builder = new ElementBuilder();\n\n  builder.withClassName('umd-carousel-wide');\n  builder.withChild(container);\n\n  if (title) {\n    builder.withAttribute('title', title);\n  } else {\n    builder.withAttribute('title', 'Animated Image Carousel');\n  }\n\n  builder.withStyles({\n    element: {\n      container: 'umd-carousel-wide / inline-size',\n      display: 'block',\n      position: 'relative',\n\n      [`@media (${token.media.queries.large.min})`]: {\n        paddingBottom: 0,\n      },\n    },\n  });\n\n  const composite = builder.build();\n\n  // Initialize refs\n  const refs: CarouselRefs = {\n    container: composite.element,\n    ...container.refs,\n  };\n\n  // Set up event handlers after DOM is ready\n  requestAnimationFrame(() => {\n    setupSliderControls(refs, state);\n    updatePreviews(refs, state); // Initial preview setup without animation\n  });\n\n  return composite;\n};\n"],"names":["assets.image.background","container","createContainer","index","ElementBuilder","token"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../source/composite/carousel/wide/index.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport { assets } from 'atomic';\nimport { createContainer } from './container';\nimport { type CarouselWideProps } from '../_types';\n\ninterface CarouselState {\n  currentIndex: number;\n  isAnimating: boolean;\n  slides: CarouselWideProps['slides'];\n}\n\ninterface CarouselRefs {\n  container: HTMLElement;\n  slidesContainer: HTMLDivElement;\n  slides: HTMLElement[];\n  previews: {\n    left: HTMLElement;\n    right: HTMLElement;\n  };\n  controls: {\n    prev: HTMLButtonElement;\n    next: HTMLButtonElement;\n  };\n  indicator: {\n    element: HTMLElement;\n    position: (index: number) => void;\n  };\n  info: HTMLParagraphElement;\n}\n\n// Constants\nconst ANIMATION_TIME: 500 = 500;\nconst PREVIEW_ANIMATION_TIME: 440 = 440; // 60ms faster than main animation\n\n// Pure animation functions\nconst getAdjacentIndices = (\n  currentIndex: number,\n  totalSlides: number,\n): { leftIndex: number; rightIndex: number } => {\n  const lastIndex = totalSlides - 1;\n  return {\n    leftIndex: currentIndex === 0 ? lastIndex : currentIndex - 1,\n    rightIndex: currentIndex === lastIndex ? 0 : currentIndex + 1,\n  };\n};\n\nconst positionSlideOffScreen = (\n  slide: HTMLElement,\n  direction: 'left' | 'right',\n): void => {\n  slide.setAttribute('data-direction', direction);\n  slide.setAttribute('data-animating', 'true');\n  slide.offsetHeight; // Force reflow\n};\n\nconst activateSlideTransition = (\n  slide: HTMLElement,\n  direction?: 'left' | 'right',\n): void => {\n  if (direction) {\n    slide.setAttribute('data-direction', direction);\n  } else {\n    slide.removeAttribute('data-direction');\n    slide.setAttribute('data-active', 'true');\n  }\n};\n\nconst cleanupSlideTransition = (slide: HTMLElement, isNew: boolean): void => {\n  if (isNew) {\n    slide.removeAttribute('data-animating');\n  } else {\n    slide.removeAttribute('data-active');\n    slide.removeAttribute('data-direction');\n    slide.removeAttribute('data-content-visible');\n  }\n};\n\n// Pure preview functions\nconst createPreviewElement = (\n  slide: CarouselWideProps['slides'][0],\n): HTMLElement => {\n  const imageCopy = slide.image.cloneNode(true) as HTMLImageElement;\n  const preview = assets.image.background({\n    element: imageCopy,\n    isScaled: true,\n  });\n\n  preview.element.style.transition = `transform ${PREVIEW_ANIMATION_TIME}ms ease-in-out`;\n  return preview.element;\n};\n\nconst clearPreviewContainer = (container: HTMLElement): void => {\n  while (container.firstChild) {\n    container.removeChild(container.firstChild);\n  }\n};\n\nconst appendPreviewWithAnimation = (\n  container: HTMLElement,\n  preview: HTMLElement,\n  animationDirection: 'reverse' | 'advance',\n): void => {\n  // Position off-screen initially based on animation direction\n  // For advance (forward), new content comes from right\n  // For reverse (backward), new content comes from left\n  preview.style.transform =\n    animationDirection === 'advance' ? 'translateX(100%)' : 'translateX(-100%)';\n\n  container.appendChild(preview);\n\n  // Trigger animation to slide in\n  requestAnimationFrame(() => {\n    preview.style.transform = 'translateX(0)';\n  });\n};\n\nconst animatePreviewOut = (\n  preview: HTMLElement,\n  animationDirection: 'reverse' | 'advance',\n): Promise<void> => {\n  return new Promise((resolve) => {\n    // For advance (forward), old content exits to left\n    // For reverse (backward), old content exits to right\n    preview.style.transform =\n      animationDirection === 'advance'\n        ? 'translateX(-100%)'\n        : 'translateX(100%)';\n\n    setTimeout(() => {\n      if (preview.parentNode) {\n        preview.parentNode.removeChild(preview);\n      }\n      resolve();\n    }, PREVIEW_ANIMATION_TIME);\n  });\n};\n\n// State management\nconst updatePreviews = (\n  refs: CarouselRefs,\n  state: CarouselState,\n  direction?: 'reverse' | 'advance',\n): void => {\n  const { currentIndex, slides } = state;\n  const { leftIndex, rightIndex } = getAdjacentIndices(\n    currentIndex,\n    slides.length,\n  );\n\n  // Handle left preview\n  if (slides[leftIndex]) {\n    const existingLeft = refs.previews.left.firstElementChild as HTMLElement;\n    if (existingLeft && direction) {\n      animatePreviewOut(existingLeft, direction);\n    } else if (existingLeft) {\n      clearPreviewContainer(refs.previews.left);\n    }\n\n    const leftPreview = createPreviewElement(slides[leftIndex]);\n    if (direction) {\n      appendPreviewWithAnimation(refs.previews.left, leftPreview, direction);\n    } else {\n      refs.previews.left.appendChild(leftPreview);\n    }\n  }\n\n  // Handle right preview\n  if (slides[rightIndex]) {\n    const existingRight = refs.previews.right.firstElementChild as HTMLElement;\n    if (existingRight && direction) {\n      animatePreviewOut(existingRight, direction);\n    } else if (existingRight) {\n      clearPreviewContainer(refs.previews.right);\n    }\n\n    const rightPreview = createPreviewElement(slides[rightIndex]);\n    if (direction) {\n      appendPreviewWithAnimation(refs.previews.right, rightPreview, direction);\n    } else {\n      refs.previews.right.appendChild(rightPreview);\n    }\n  }\n};\n\nconst updateInfo = (refs: CarouselRefs, newIndex: number) => {\n  refs.info.textContent = `Slide ${newIndex + 1} Selected`;\n};\n\nconst animateSlides = (\n  refs: CarouselRefs,\n  state: CarouselState,\n  newIndex: number,\n  direction: 'reverse' | 'advance',\n) => {\n  if (state.isAnimating || state.currentIndex === newIndex) return;\n  state.isAnimating = true;\n\n  const currentSlide = refs.slides[state.currentIndex];\n  const newSlide = refs.slides[newIndex];\n\n  // Disable controls during animation\n  refs.controls.prev.setAttribute('disabled', '');\n  refs.controls.next.setAttribute('disabled', '');\n\n  // Position new slide off-screen\n  const newSlideDirection = direction === 'reverse' ? 'left' : 'right';\n  positionSlideOffScreen(newSlide, newSlideDirection);\n\n  // Update indicator position\n  refs.indicator.position(newIndex);\n\n  // Start synchronized animations for all frames\n  requestAnimationFrame(() => {\n    // Animate main slides\n    activateSlideTransition(newSlide);\n    const currentSlideDirection = direction === 'reverse' ? 'right' : 'left';\n    activateSlideTransition(currentSlide, currentSlideDirection);\n\n    // Update previews with animation (this will animate in sync)\n    const nextState = { ...state, currentIndex: newIndex };\n    updatePreviews(refs, nextState, direction);\n  });\n\n  // Clean up after animation\n  setTimeout(() => {\n    // Clean up main slides\n    cleanupSlideTransition(currentSlide, false);\n    cleanupSlideTransition(newSlide, true);\n\n    // Show content with fade-in animation\n    newSlide.setAttribute('data-content-visible', 'true');\n\n    // Re-enable controls\n    refs.controls.prev.removeAttribute('disabled');\n    refs.controls.next.removeAttribute('disabled');\n\n    // Update state\n    state.currentIndex = newIndex;\n    state.isAnimating = false;\n\n    // Update accessibility info\n    updateInfo(refs, newIndex);\n  }, ANIMATION_TIME);\n};\n\nconst setupSliderControls = (refs: CarouselRefs, state: CarouselState) => {\n  const lastIndex = state.slides.length - 1;\n\n  refs.controls.prev.addEventListener('click', () => {\n    if (state.isAnimating) return;\n\n    const newIndex =\n      state.currentIndex === lastIndex ? 0 : state.currentIndex + 1;\n    animateSlides(refs, state, newIndex, 'advance');\n  });\n\n  refs.controls.next.addEventListener('click', () => {\n    if (state.isAnimating) return;\n\n    const newIndex =\n      state.currentIndex === 0 ? lastIndex : state.currentIndex - 1;\n    animateSlides(refs, state, newIndex, 'reverse');\n  });\n};\n\n// Main component\nexport const createCompositeCarouselWide = (props: CarouselWideProps) => {\n  const { title } = props;\n\n  // Initialize state early\n  const state: CarouselState = {\n    currentIndex: 0,\n    isAnimating: false,\n    slides: props.slides,\n  };\n\n  const container = createContainer(props, (index: number) => {\n    if (state.isAnimating || state.currentIndex === index) return;\n\n    const direction = state.currentIndex > index ? 'reverse' : 'advance';\n    animateSlides(refs, state, index, direction);\n  });\n\n  const builder = new ElementBuilder();\n\n  builder.withClassName('umd-carousel-wide');\n  builder.withChild(container);\n\n  if (title) {\n    builder.withAttribute('title', title);\n  } else {\n    builder.withAttribute('title', 'Animated Image Carousel');\n  }\n\n  builder.withStyles({\n    element: {\n      container: 'umd-carousel-wide / inline-size',\n      display: 'block',\n      position: 'relative',\n\n      [`@media (${token.media.queries.large.min})`]: {\n        paddingBottom: 0,\n      },\n    },\n  });\n\n  const composite = builder.build();\n\n  // Initialize refs\n  const refs: CarouselRefs = {\n    container: composite.element,\n    ...container.refs,\n  };\n\n  // Set up event handlers after DOM is ready\n  requestAnimationFrame(() => {\n    setupSliderControls(refs, state);\n    updatePreviews(refs, state); // Initial preview setup without animation\n  });\n\n  return composite;\n};\n"],"names":["assets.image.background"],"mappings":"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"}

package/dist/composite/footer/base.d.ts

@@ -1,5 +1,4 @@
 import { FooterProps } from './_types';
 import { ElementModel } from '_types';
-declare const _default: (props: FooterProps, childElements: Array<ElementModel>) => import('@universityofmaryland/web-builder-library').ElementModel<HTMLElement>;
-export default _default;
+export declare const createCompositeFooterBase: (props: FooterProps, childElements: Array<ElementModel>) => import('@universityofmaryland/web-builder-library').ElementModel<HTMLElement>;
 //# sourceMappingURL=base.d.ts.map

package/dist/composite/footer/base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../source/composite/footer/base.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;yBAEtB,OAAO,WAAW,EAAE,eAAe,KAAK,CAAC,YAAY,CAAC;AAAtE,wBAiCE"}
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../source/composite/footer/base.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAqCtC,eAAO,MAAM,yBAAyB,UAnCE,WAAW,iBAAiB,KAAK,CAAC,YAAY,CAAC,kFAmCvB,CAAC"}

package/dist/composite/footer/base.js

@@ -1,48 +1,32 @@
-"use strict";
-const token = require("@universityofmaryland/web-token-library");
-const animation = require("@universityofmaryland/web-styles-library/animation");
-const webBuilderLibrary = require("@universityofmaryland/web-builder-library");
-function _interopNamespaceDefault(e) {
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-  if (e) {
-    for (const k in e) {
-      if (k !== "default") {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-const token__namespace = /* @__PURE__ */ _interopNamespaceDefault(token);
-const animation__namespace = /* @__PURE__ */ _interopNamespaceDefault(animation);
-const buildFooter = (props, childElements) => {
+import * as token from "@universityofmaryland/web-token-library";
+import * as animation from "@universityofmaryland/web-styles-library/animation";
+import { ElementBuilder } from "@universityofmaryland/web-builder-library";
+const CreateFooterBaseElement = (props, childElements) => {
   const { isThemeLight } = props;
-  return new webBuilderLibrary.ElementBuilder().withClassName("umd-footer-element-wrapper").withStyles({
+  return new ElementBuilder().withClassName("umd-footer-element-wrapper").withStyles({
     element: {
       containerType: "inline-size",
       overflow: "hidden",
       ...isThemeLight && {
-        backgroundColor: token__namespace.color.gray.lightest,
+        backgroundColor: token.color.gray.lightest,
         ["& a"]: {
-          ...animation__namespace.line.slideUnderBlack,
+          ...animation.line.slideUnderBlack,
           ["&:not(:first-child)::before"]: {
-            backgroundColor: token__namespace.color.black
+            backgroundColor: token.color.black
           }
         }
       },
       ["& p, & a, & span"]: {
-        color: token__namespace.color.white,
+        color: token.color.white,
         ...isThemeLight && {
-          color: token__namespace.color.gray.dark
+          color: token.color.gray.dark
         }
       }
     }
   }).withChildren(...childElements).build();
 };
-module.exports = buildFooter;
+const createCompositeFooterBase = CreateFooterBaseElement;
+export {
+  createCompositeFooterBase
+};
 //# sourceMappingURL=base.js.map

package/dist/composite/footer/base.js.map

@@ -1 +1 @@
-{"version":3,"file":"base.js","sources":["../../../source/composite/footer/base.ts"],"sourcesContent":["import * as token from '@universityofmaryland/web-token-library';\nimport * as animation from '@universityofmaryland/web-styles-library/animation';\nimport { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport { FooterProps } from './_types';\nimport { ElementModel } from '_types';\n\nexport default (props: FooterProps, childElements: Array<ElementModel>) => {\n  const { isThemeLight } = props;\n\n  return new ElementBuilder()\n    .withClassName('umd-footer-element-wrapper')\n    .withStyles({\n      element: {\n        containerType: 'inline-size',\n        overflow: 'hidden',\n\n        ...(isThemeLight && {\n          backgroundColor: token.color.gray.lightest,\n\n          ['& a']: {\n            ...animation.line.slideUnderBlack,\n\n            ['&:not(:first-child)::before']: {\n              backgroundColor: token.color.black,\n            },\n          },\n        }),\n\n        ['& p, & a, & span']: {\n          color: token.color.white,\n\n          ...(isThemeLight && {\n            color: token.color.gray.dark,\n          }),\n        },\n      },\n    })\n    .withChildren(...childElements)\n    .build();\n};\n"],"names":["ElementBuilder","token","animation"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAMA,MAAA,cAAe,CAAC,OAAoB,kBAAuC;AACzE,QAAM,EAAE,iBAAiB;AAEzB,SAAO,IAAIA,kBAAAA,eAAA,EACR,cAAc,4BAA4B,EAC1C,WAAW;AAAA,IACV,SAAS;AAAA,MACP,eAAe;AAAA,MACf,UAAU;AAAA,MAEV,GAAI,gBAAgB;AAAA,QAClB,iBAAiBC,iBAAM,MAAM,KAAK;AAAA,QAElC,CAAC,KAAK,GAAG;AAAA,UACP,GAAGC,qBAAU,KAAK;AAAA,UAElB,CAAC,6BAA6B,GAAG;AAAA,YAC/B,iBAAiBD,iBAAM,MAAM;AAAA,UAAA;AAAA,QAC/B;AAAA,MACF;AAAA,MAGF,CAAC,kBAAkB,GAAG;AAAA,QACpB,OAAOA,iBAAM,MAAM;AAAA,QAEnB,GAAI,gBAAgB;AAAA,UAClB,OAAOA,iBAAM,MAAM,KAAK;AAAA,QAAA;AAAA,MAC1B;AAAA,IACF;AAAA,EACF,CACD,EACA,aAAa,GAAG,aAAa,EAC7B,MAAA;AACL;;"}
+{"version":3,"file":"base.js","sources":["../../../source/composite/footer/base.ts"],"sourcesContent":["import * as token from '@universityofmaryland/web-token-library';\nimport * as animation from '@universityofmaryland/web-styles-library/animation';\nimport { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport { FooterProps } from './_types';\nimport { ElementModel } from '_types';\n\nconst CreateFooterBaseElement = (props: FooterProps, childElements: Array<ElementModel>) => {\n  const { isThemeLight } = props;\n\n  return new ElementBuilder()\n    .withClassName('umd-footer-element-wrapper')\n    .withStyles({\n      element: {\n        containerType: 'inline-size',\n        overflow: 'hidden',\n\n        ...(isThemeLight && {\n          backgroundColor: token.color.gray.lightest,\n\n          ['& a']: {\n            ...animation.line.slideUnderBlack,\n\n            ['&:not(:first-child)::before']: {\n              backgroundColor: token.color.black,\n            },\n          },\n        }),\n\n        ['& p, & a, & span']: {\n          color: token.color.white,\n\n          ...(isThemeLight && {\n            color: token.color.gray.dark,\n          }),\n        },\n      },\n    })\n    .withChildren(...childElements)\n    .build();\n};\n\nexport const createCompositeFooterBase = CreateFooterBaseElement;\n"],"names":[],"mappings":";;;AAMA,MAAM,0BAA0B,CAAC,OAAoB,kBAAuC;AAC1F,QAAM,EAAE,iBAAiB;AAEzB,SAAO,IAAI,eAAA,EACR,cAAc,4BAA4B,EAC1C,WAAW;AAAA,IACV,SAAS;AAAA,MACP,eAAe;AAAA,MACf,UAAU;AAAA,MAEV,GAAI,gBAAgB;AAAA,QAClB,iBAAiB,MAAM,MAAM,KAAK;AAAA,QAElC,CAAC,KAAK,GAAG;AAAA,UACP,GAAG,UAAU,KAAK;AAAA,UAElB,CAAC,6BAA6B,GAAG;AAAA,YAC/B,iBAAiB,MAAM,MAAM;AAAA,UAAA;AAAA,QAC/B;AAAA,MACF;AAAA,MAGF,CAAC,kBAAkB,GAAG;AAAA,QACpB,OAAO,MAAM,MAAM;AAAA,QAEnB,GAAI,gBAAgB;AAAA,UAClB,OAAO,MAAM,MAAM,KAAK;AAAA,QAAA;AAAA,MAC1B;AAAA,IACF;AAAA,EACF,CACD,EACA,aAAa,GAAG,aAAa,EAC7B,MAAA;AACL;AAEO,MAAM,4BAA4B;"}

package/dist/composite/footer/elements/main-section/call-to-action.d.ts

@@ -1,5 +1,4 @@
 import { CallToActionProps } from '../../_types';
 import { UMDElement } from '../../../../_types';
-declare const _default: (props: Pick<CallToActionProps, "isTypeSimple" | "slotCta">) => UMDElement;
-export default _default;
+export declare const createCompositeFooterCallToAction: (props: Pick<CallToActionProps, "isTypeSimple" | "slotCta">) => UMDElement;
 //# sourceMappingURL=call-to-action.d.ts.map

package/dist/composite/footer/elements/main-section/call-to-action.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"call-to-action.d.ts","sourceRoot":"","sources":["../../../../../source/composite/footer/elements/main-section/call-to-action.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;yBA8BnD,OAAO,IAAI,CAAC,iBAAiB,EAAE,cAAc,GAAG,SAAS,CAAC,KACzD,UAAU;AAFb,wBA0BE"}
+{"version":3,"file":"call-to-action.d.ts","sourceRoot":"","sources":["../../../../../source/composite/footer/elements/main-section/call-to-action.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAyDrD,eAAO,MAAM,iCAAiC,UA3BrC,IAAI,CAAC,iBAAiB,EAAE,cAAc,GAAG,SAAS,CAAC,KACzD,UA0BuE,CAAC"}

package/dist/composite/footer/elements/main-section/call-to-action.js

@@ -1,27 +1,8 @@
-"use strict";
-const webBuilderLibrary = require("@universityofmaryland/web-builder-library");
-const token = require("@universityofmaryland/web-token-library");
-const Styles = require("@universityofmaryland/web-styles-library");
-const globals = require("../../globals.js");
-function _interopNamespaceDefault(e) {
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-  if (e) {
-    for (const k in e) {
-      if (k !== "default") {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-const token__namespace = /* @__PURE__ */ _interopNamespaceDefault(token);
-const Styles__namespace = /* @__PURE__ */ _interopNamespaceDefault(Styles);
-const { LARGE } = globals.BREAKPOINTS;
+import { ElementBuilder } from "@universityofmaryland/web-builder-library";
+import * as token from "@universityofmaryland/web-token-library";
+import * as Styles from "@universityofmaryland/web-styles-library";
+import { BREAKPOINTS } from "../../globals.js";
+const { LARGE } = BREAKPOINTS;
 const makeGivingLink = () => {
   const defaultLink = document.createElement("a");
   defaultLink.textContent = "Support UMD";
@@ -32,19 +13,19 @@ const makeGivingLink = () => {
 };
 const createLinkElement = (link) => {
   const childLink = link.cloneNode(true);
-  return new webBuilderLibrary.ElementBuilder("div").withClassName("umd-action-primary").styled(Styles__namespace.element.action.primary.normal).withStyles({
+  return new ElementBuilder("div").withClassName("umd-action-primary").styled(Styles.element.action.primary.normal).withStyles({
     element: {
       ["& a"]: {
-        color: `${token__namespace.color.white} !important`
+        color: `${token.color.white} !important`
       }
     }
   }).withChild(childLink).build();
 };
-const createCallToActionContainer = (props) => {
+const CreateCallToActionElement = (props) => {
   const { isTypeSimple, slotCta } = props;
   const baseLink = slotCta ?? makeGivingLink();
   const styledLink = createLinkElement(baseLink);
-  return new webBuilderLibrary.ElementBuilder().withClassName("umd-footer-call-to-action-container").withChild(styledLink).withStyles({
+  return new ElementBuilder().withClassName("umd-footer-call-to-action-container").withChild(styledLink).withStyles({
     element: {
       marginLeft: "auto",
       ...isTypeSimple && {
@@ -58,5 +39,8 @@ const createCallToActionContainer = (props) => {
     }
   }).build();
 };
-module.exports = createCallToActionContainer;
+const createCompositeFooterCallToAction = CreateCallToActionElement;
+export {
+  createCompositeFooterCallToAction
+};
 //# sourceMappingURL=call-to-action.js.map

package/dist/composite/footer/elements/main-section/call-to-action.js.map

@@ -1 +1 @@
-{"version":3,"file":"call-to-action.js","sources":["../../../../../source/composite/footer/elements/main-section/call-to-action.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport * as Styles from '@universityofmaryland/web-styles-library';\nimport { BREAKPOINTS } from '../../globals';\nimport { CallToActionProps } from '../../_types';\nimport { type UMDElement } from '../../../../_types';\n\nconst { LARGE } = BREAKPOINTS;\n\nconst makeGivingLink = (): HTMLAnchorElement => {\n  const defaultLink = document.createElement('a');\n  defaultLink.textContent = 'Support UMD';\n  defaultLink.href = 'https://giving.umd.edu/';\n  defaultLink.target = '_blank';\n  defaultLink.rel = 'noopener noreferrer';\n  return defaultLink;\n};\n\nconst createLinkElement = (link: HTMLAnchorElement): UMDElement => {\n  const childLink = link.cloneNode(true) as HTMLAnchorElement;\n  return new ElementBuilder('div')\n    .withClassName('umd-action-primary')\n    .styled(Styles.element.action.primary.normal)\n    .withStyles({\n      element: {\n        ['& a']: {\n          color: `${token.color.white} !important`,\n        },\n      },\n    })\n    .withChild(childLink)\n    .build();\n};\n\nexport default (\n  props: Pick<CallToActionProps, 'isTypeSimple' | 'slotCta'>,\n): UMDElement => {\n  const { isTypeSimple, slotCta } = props;\n  const baseLink = slotCta ?? makeGivingLink();\n  const styledLink = createLinkElement(baseLink);\n\n  return new ElementBuilder()\n    .withClassName('umd-footer-call-to-action-container')\n    .withChild(styledLink)\n    .withStyles({\n      element: {\n        marginLeft: 'auto',\n\n        ...(isTypeSimple && {\n          display: 'none',\n        }),\n\n        [`@container (min-width: ${LARGE}px)`]: {\n          [`& .umd-footer-logo-container`]: {\n            display: 'none',\n          },\n        },\n      },\n    })\n    .build();\n};\n"],"names":["BREAKPOINTS","ElementBuilder","Styles","token"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,EAAE,UAAUA,QAAAA;AAElB,MAAM,iBAAiB,MAAyB;AAC9C,QAAM,cAAc,SAAS,cAAc,GAAG;AAC9C,cAAY,cAAc;AAC1B,cAAY,OAAO;AACnB,cAAY,SAAS;AACrB,cAAY,MAAM;AAClB,SAAO;AACT;AAEA,MAAM,oBAAoB,CAAC,SAAwC;AACjE,QAAM,YAAY,KAAK,UAAU,IAAI;AACrC,SAAO,IAAIC,kBAAAA,eAAe,KAAK,EAC5B,cAAc,oBAAoB,EAClC,OAAOC,kBAAO,QAAQ,OAAO,QAAQ,MAAM,EAC3C,WAAW;AAAA,IACV,SAAS;AAAA,MACP,CAAC,KAAK,GAAG;AAAA,QACP,OAAO,GAAGC,iBAAM,MAAM,KAAK;AAAA,MAAA;AAAA,IAC7B;AAAA,EACF,CACD,EACA,UAAU,SAAS,EACnB,MAAA;AACL;AAEA,MAAA,8BAAe,CACb,UACe;AACf,QAAM,EAAE,cAAc,QAAA,IAAY;AAClC,QAAM,WAAW,WAAW,eAAA;AAC5B,QAAM,aAAa,kBAAkB,QAAQ;AAE7C,SAAO,IAAIF,kBAAAA,iBACR,cAAc,qCAAqC,EACnD,UAAU,UAAU,EACpB,WAAW;AAAA,IACV,SAAS;AAAA,MACP,YAAY;AAAA,MAEZ,GAAI,gBAAgB;AAAA,QAClB,SAAS;AAAA,MAAA;AAAA,MAGX,CAAC,0BAA0B,KAAK,KAAK,GAAG;AAAA,QACtC,CAAC,8BAA8B,GAAG;AAAA,UAChC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,IACF;AAAA,EACF,CACD,EACA,MAAA;AACL;;"}
+{"version":3,"file":"call-to-action.js","sources":["../../../../../source/composite/footer/elements/main-section/call-to-action.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport * as Styles from '@universityofmaryland/web-styles-library';\nimport { BREAKPOINTS } from '../../globals';\nimport { CallToActionProps } from '../../_types';\nimport { type UMDElement } from '../../../../_types';\n\nconst { LARGE } = BREAKPOINTS;\n\nconst makeGivingLink = (): HTMLAnchorElement => {\n  const defaultLink = document.createElement('a');\n  defaultLink.textContent = 'Support UMD';\n  defaultLink.href = 'https://giving.umd.edu/';\n  defaultLink.target = '_blank';\n  defaultLink.rel = 'noopener noreferrer';\n  return defaultLink;\n};\n\nconst createLinkElement = (link: HTMLAnchorElement): UMDElement => {\n  const childLink = link.cloneNode(true) as HTMLAnchorElement;\n  return new ElementBuilder('div')\n    .withClassName('umd-action-primary')\n    .styled(Styles.element.action.primary.normal)\n    .withStyles({\n      element: {\n        ['& a']: {\n          color: `${token.color.white} !important`,\n        },\n      },\n    })\n    .withChild(childLink)\n    .build();\n};\n\nconst CreateCallToActionElement = (\n  props: Pick<CallToActionProps, 'isTypeSimple' | 'slotCta'>,\n): UMDElement => {\n  const { isTypeSimple, slotCta } = props;\n  const baseLink = slotCta ?? makeGivingLink();\n  const styledLink = createLinkElement(baseLink);\n\n  return new ElementBuilder()\n    .withClassName('umd-footer-call-to-action-container')\n    .withChild(styledLink)\n    .withStyles({\n      element: {\n        marginLeft: 'auto',\n\n        ...(isTypeSimple && {\n          display: 'none',\n        }),\n\n        [`@container (min-width: ${LARGE}px)`]: {\n          [`& .umd-footer-logo-container`]: {\n            display: 'none',\n          },\n        },\n      },\n    })\n    .build();\n};\n\nexport const createCompositeFooterCallToAction = CreateCallToActionElement;\n"],"names":[],"mappings":";;;;AAOA,MAAM,EAAE,UAAU;AAElB,MAAM,iBAAiB,MAAyB;AAC9C,QAAM,cAAc,SAAS,cAAc,GAAG;AAC9C,cAAY,cAAc;AAC1B,cAAY,OAAO;AACnB,cAAY,SAAS;AACrB,cAAY,MAAM;AAClB,SAAO;AACT;AAEA,MAAM,oBAAoB,CAAC,SAAwC;AACjE,QAAM,YAAY,KAAK,UAAU,IAAI;AACrC,SAAO,IAAI,eAAe,KAAK,EAC5B,cAAc,oBAAoB,EAClC,OAAO,OAAO,QAAQ,OAAO,QAAQ,MAAM,EAC3C,WAAW;AAAA,IACV,SAAS;AAAA,MACP,CAAC,KAAK,GAAG;AAAA,QACP,OAAO,GAAG,MAAM,MAAM,KAAK;AAAA,MAAA;AAAA,IAC7B;AAAA,EACF,CACD,EACA,UAAU,SAAS,EACnB,MAAA;AACL;AAEA,MAAM,4BAA4B,CAChC,UACe;AACf,QAAM,EAAE,cAAc,QAAA,IAAY;AAClC,QAAM,WAAW,WAAW,eAAA;AAC5B,QAAM,aAAa,kBAAkB,QAAQ;AAE7C,SAAO,IAAI,iBACR,cAAc,qCAAqC,EACnD,UAAU,UAAU,EACpB,WAAW;AAAA,IACV,SAAS;AAAA,MACP,YAAY;AAAA,MAEZ,GAAI,gBAAgB;AAAA,QAClB,SAAS;AAAA,MAAA;AAAA,MAGX,CAAC,0BAA0B,KAAK,KAAK,GAAG;AAAA,QACtC,CAAC,8BAA8B,GAAG;AAAA,UAChC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,IACF;AAAA,EACF,CACD,EACA,MAAA;AACL;AAEO,MAAM,oCAAoC;"}

package/dist/composite/footer/elements/main-section/campaign.d.ts

@@ -1,5 +1,4 @@
 import { CampaignProps } from '../../_types';
 import { UMDElement } from '../../../../_types';
-declare const _default: (props: Pick<CampaignProps, "isThemeLight" | "isCampaignForward">) => UMDElement;
-export default _default;
+export declare const createCompositeFooterCampaign: (props: Pick<CampaignProps, "isThemeLight" | "isCampaignForward">) => UMDElement;
 //# sourceMappingURL=campaign.d.ts.map

package/dist/composite/footer/elements/main-section/campaign.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"campaign.d.ts","sourceRoot":"","sources":["../../../../../source/composite/footer/elements/main-section/campaign.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;yBA+CnD,OAAO,IAAI,CAAC,aAAa,EAAE,cAAc,GAAG,mBAAmB,CAAC,KAC/D,UAAU;AAFb,wBAgDE"}
+{"version":3,"file":"campaign.d.ts","sourceRoot":"","sources":["../../../../../source/composite/footer/elements/main-section/campaign.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAgGrD,eAAO,MAAM,6BAA6B,UAjDjC,IAAI,CAAC,aAAa,EAAE,cAAc,GAAG,mBAAmB,CAAC,KAC/D,UAgD+D,CAAC"}

package/dist/composite/footer/elements/main-section/campaign.js

@@ -1,32 +1,13 @@
-"use strict";
-const webBuilderLibrary = require("@universityofmaryland/web-builder-library");
-const token = require("@universityofmaryland/web-token-library");
-const media = require("@universityofmaryland/web-utilities-library/media");
-const Logos = require("@universityofmaryland/web-icons-library/logos");
-const globals = require("../../globals.js");
-function _interopNamespaceDefault(e) {
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-  if (e) {
-    for (const k in e) {
-      if (k !== "default") {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-const token__namespace = /* @__PURE__ */ _interopNamespaceDefault(token);
-const Logos__namespace = /* @__PURE__ */ _interopNamespaceDefault(Logos);
-const { LARGE } = globals.BREAKPOINTS;
+import { ElementBuilder } from "@universityofmaryland/web-builder-library";
+import * as token from "@universityofmaryland/web-token-library";
+import { imageFromSvg } from "@universityofmaryland/web-utilities-library/media";
+import * as Logos from "@universityofmaryland/web-icons-library/logos";
+import { BREAKPOINTS } from "../../globals.js";
+const { LARGE } = BREAKPOINTS;
 const createFearlesslyForwardCampaign = (props) => {
   const { isThemeLight } = props;
-  const SVG = !isThemeLight && Logos__namespace.campaign.light || Logos__namespace.campaign.dark;
-  const img = media.imageFromSvg({ SVG });
+  const SVG = !isThemeLight && Logos.campaign.light || Logos.campaign.dark;
+  const img = imageFromSvg({ SVG });
   const link = document.createElement("a");
   img.alt = "University of Maryland Fearlessly Forward Campaign Logo";
   link.href = "https://fearlesslyforward.umd.edu";
@@ -41,8 +22,8 @@ const createFearlesslyForwardCampaign = (props) => {
 };
 const createForwardCampaign = (props) => {
   const { isThemeLight } = props;
-  const SVG = !isThemeLight && Logos__namespace.forward.light || Logos__namespace.forward.dark;
-  const img = media.imageFromSvg({ SVG });
+  const SVG = !isThemeLight && Logos.forward.light || Logos.forward.dark;
+  const img = imageFromSvg({ SVG });
   const link = document.createElement("a");
   img.alt = `University of Maryland's Forward Campaign Logo`;
   link.href = "https://forward.umd.edu";
@@ -52,17 +33,17 @@ const createForwardCampaign = (props) => {
   link.appendChild(img);
   return link;
 };
-const createCampaignRow = (props) => {
+const CreateCampaignElement = (props) => {
   const { isCampaignForward } = props;
   const link = isCampaignForward ? createForwardCampaign(props) : createFearlesslyForwardCampaign(props);
-  const linkElement = new webBuilderLibrary.ElementBuilder(link).withClassName("campaign-column-link").withStyles({
+  const linkElement = new ElementBuilder(link).withClassName("campaign-column-link").withStyles({
     element: {
       display: "block",
-      marginTop: token__namespace.spacing.lg,
+      marginTop: token.spacing.lg,
       maxWidth: "250px"
     }
   }).build();
-  return new webBuilderLibrary.ElementBuilder().withClassName("campaign-column-wrapper").withStyles({
+  return new ElementBuilder().withClassName("campaign-column-wrapper").withStyles({
     element: {
       [`& img`]: {
         maxWidth: "144px",
@@ -84,5 +65,8 @@ const createCampaignRow = (props) => {
     }
   }).withChild(linkElement).build();
 };
-module.exports = createCampaignRow;
+const createCompositeFooterCampaign = CreateCampaignElement;
+export {
+  createCompositeFooterCampaign
+};
 //# sourceMappingURL=campaign.js.map

package/dist/composite/footer/elements/main-section/campaign.js.map

@@ -1 +1 @@
-{"version":3,"file":"campaign.js","sources":["../../../../../source/composite/footer/elements/main-section/campaign.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport { imageFromSvg } from '@universityofmaryland/web-utilities-library/media';\nimport * as Logos from '@universityofmaryland/web-icons-library/logos';\nimport { CampaignProps } from '../../_types';\nimport { BREAKPOINTS } from '../../globals';\nimport { type UMDElement } from '../../../../_types';\n\nconst { LARGE } = BREAKPOINTS;\n\nconst createFearlesslyForwardCampaign = (\n  props: Pick<CampaignProps, 'isThemeLight'>,\n) => {\n  const { isThemeLight } = props;\n  const SVG = (!isThemeLight && Logos.campaign.light) || Logos.campaign.dark;\n  const img = imageFromSvg({ SVG });\n  const link = document.createElement('a');\n\n  img.alt = 'University of Maryland Fearlessly Forward Campaign Logo';\n\n  link.href = 'https://fearlesslyforward.umd.edu';\n  link.setAttribute('target', '_blank');\n  link.setAttribute('rel', 'noopener noreferrer');\n  link.setAttribute(\n    'aria-label',\n    'Link to the Fearlessly Forward Brand website',\n  );\n\n  link.appendChild(img);\n\n  return link;\n};\n\nconst createForwardCampaign = (props: Pick<CampaignProps, 'isThemeLight'>) => {\n  const { isThemeLight } = props;\n\n  const SVG = (!isThemeLight && Logos.forward.light) || Logos.forward.dark;\n  const img = imageFromSvg({ SVG });\n  const link = document.createElement('a');\n\n  img.alt = `University of Maryland's Forward Campaign Logo`;\n\n  link.href = 'https://forward.umd.edu';\n  link.setAttribute('target', '_blank');\n  link.setAttribute('rel', 'noopener noreferrer');\n  link.setAttribute('aria-label', 'Link to the Forward Brand website');\n\n  link.appendChild(img);\n\n  return link;\n};\n\nexport default (\n  props: Pick<CampaignProps, 'isThemeLight' | 'isCampaignForward'>,\n): UMDElement => {\n  const { isCampaignForward } = props;\n\n  const link = isCampaignForward\n    ? createForwardCampaign(props)\n    : createFearlesslyForwardCampaign(props);\n\n  const linkElement = new ElementBuilder(link)\n    .withClassName('campaign-column-link')\n    .withStyles({\n      element: {\n        display: 'block',\n        marginTop: token.spacing.lg,\n        maxWidth: '250px',\n      },\n    })\n    .build();\n\n  return new ElementBuilder()\n    .withClassName('campaign-column-wrapper')\n    .withStyles({\n      element: {\n        [`& img`]: {\n          maxWidth: '144px',\n          width: '100%',\n        },\n\n        [`@container (min-width: ${LARGE}px)`]: {\n          display: 'flex',\n          justifyContent: 'flex-end',\n          marginLeft: 'auto',\n\n          [`& .umd-footer-logo-container`]: {\n            display: 'none',\n          },\n        },\n\n        [`@container (max-width: ${LARGE - 1}px)`]: {\n          [`& .umd-footer-social-column_wrapper &`]: {\n            display: 'none',\n          },\n        },\n      },\n    })\n    .withChild(linkElement)\n    .build();\n};\n"],"names":["BREAKPOINTS","Logos","imageFromSvg","ElementBuilder","token"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,EAAE,UAAUA,QAAAA;AAElB,MAAM,kCAAkC,CACtC,UACG;AACH,QAAM,EAAE,iBAAiB;AACzB,QAAM,MAAO,CAAC,gBAAgBC,iBAAM,SAAS,SAAUA,iBAAM,SAAS;AACtE,QAAM,MAAMC,MAAAA,aAAa,EAAE,KAAK;AAChC,QAAM,OAAO,SAAS,cAAc,GAAG;AAEvC,MAAI,MAAM;AAEV,OAAK,OAAO;AACZ,OAAK,aAAa,UAAU,QAAQ;AACpC,OAAK,aAAa,OAAO,qBAAqB;AAC9C,OAAK;AAAA,IACH;AAAA,IACA;AAAA,EAAA;AAGF,OAAK,YAAY,GAAG;AAEpB,SAAO;AACT;AAEA,MAAM,wBAAwB,CAAC,UAA+C;AAC5E,QAAM,EAAE,iBAAiB;AAEzB,QAAM,MAAO,CAAC,gBAAgBD,iBAAM,QAAQ,SAAUA,iBAAM,QAAQ;AACpE,QAAM,MAAMC,MAAAA,aAAa,EAAE,KAAK;AAChC,QAAM,OAAO,SAAS,cAAc,GAAG;AAEvC,MAAI,MAAM;AAEV,OAAK,OAAO;AACZ,OAAK,aAAa,UAAU,QAAQ;AACpC,OAAK,aAAa,OAAO,qBAAqB;AAC9C,OAAK,aAAa,cAAc,mCAAmC;AAEnE,OAAK,YAAY,GAAG;AAEpB,SAAO;AACT;AAEA,MAAA,oBAAe,CACb,UACe;AACf,QAAM,EAAE,sBAAsB;AAE9B,QAAM,OAAO,oBACT,sBAAsB,KAAK,IAC3B,gCAAgC,KAAK;AAEzC,QAAM,cAAc,IAAIC,iCAAe,IAAI,EACxC,cAAc,sBAAsB,EACpC,WAAW;AAAA,IACV,SAAS;AAAA,MACP,SAAS;AAAA,MACT,WAAWC,iBAAM,QAAQ;AAAA,MACzB,UAAU;AAAA,IAAA;AAAA,EACZ,CACD,EACA,MAAA;AAEH,SAAO,IAAID,kBAAAA,eAAA,EACR,cAAc,yBAAyB,EACvC,WAAW;AAAA,IACV,SAAS;AAAA,MACP,CAAC,OAAO,GAAG;AAAA,QACT,UAAU;AAAA,QACV,OAAO;AAAA,MAAA;AAAA,MAGT,CAAC,0BAA0B,KAAK,KAAK,GAAG;AAAA,QACtC,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,YAAY;AAAA,QAEZ,CAAC,8BAA8B,GAAG;AAAA,UAChC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,MAGF,CAAC,0BAA0B,QAAQ,CAAC,KAAK,GAAG;AAAA,QAC1C,CAAC,uCAAuC,GAAG;AAAA,UACzC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,IACF;AAAA,EACF,CACD,EACA,UAAU,WAAW,EACrB,MAAA;AACL;;"}
+{"version":3,"file":"campaign.js","sources":["../../../../../source/composite/footer/elements/main-section/campaign.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport { imageFromSvg } from '@universityofmaryland/web-utilities-library/media';\nimport * as Logos from '@universityofmaryland/web-icons-library/logos';\nimport { CampaignProps } from '../../_types';\nimport { BREAKPOINTS } from '../../globals';\nimport { type UMDElement } from '../../../../_types';\n\nconst { LARGE } = BREAKPOINTS;\n\nconst createFearlesslyForwardCampaign = (\n  props: Pick<CampaignProps, 'isThemeLight'>,\n) => {\n  const { isThemeLight } = props;\n  const SVG = (!isThemeLight && Logos.campaign.light) || Logos.campaign.dark;\n  const img = imageFromSvg({ SVG });\n  const link = document.createElement('a');\n\n  img.alt = 'University of Maryland Fearlessly Forward Campaign Logo';\n\n  link.href = 'https://fearlesslyforward.umd.edu';\n  link.setAttribute('target', '_blank');\n  link.setAttribute('rel', 'noopener noreferrer');\n  link.setAttribute(\n    'aria-label',\n    'Link to the Fearlessly Forward Brand website',\n  );\n\n  link.appendChild(img);\n\n  return link;\n};\n\nconst createForwardCampaign = (props: Pick<CampaignProps, 'isThemeLight'>) => {\n  const { isThemeLight } = props;\n\n  const SVG = (!isThemeLight && Logos.forward.light) || Logos.forward.dark;\n  const img = imageFromSvg({ SVG });\n  const link = document.createElement('a');\n\n  img.alt = `University of Maryland's Forward Campaign Logo`;\n\n  link.href = 'https://forward.umd.edu';\n  link.setAttribute('target', '_blank');\n  link.setAttribute('rel', 'noopener noreferrer');\n  link.setAttribute('aria-label', 'Link to the Forward Brand website');\n\n  link.appendChild(img);\n\n  return link;\n};\n\nconst CreateCampaignElement = (\n  props: Pick<CampaignProps, 'isThemeLight' | 'isCampaignForward'>,\n): UMDElement => {\n  const { isCampaignForward } = props;\n\n  const link = isCampaignForward\n    ? createForwardCampaign(props)\n    : createFearlesslyForwardCampaign(props);\n\n  const linkElement = new ElementBuilder(link)\n    .withClassName('campaign-column-link')\n    .withStyles({\n      element: {\n        display: 'block',\n        marginTop: token.spacing.lg,\n        maxWidth: '250px',\n      },\n    })\n    .build();\n\n  return new ElementBuilder()\n    .withClassName('campaign-column-wrapper')\n    .withStyles({\n      element: {\n        [`& img`]: {\n          maxWidth: '144px',\n          width: '100%',\n        },\n\n        [`@container (min-width: ${LARGE}px)`]: {\n          display: 'flex',\n          justifyContent: 'flex-end',\n          marginLeft: 'auto',\n\n          [`& .umd-footer-logo-container`]: {\n            display: 'none',\n          },\n        },\n\n        [`@container (max-width: ${LARGE - 1}px)`]: {\n          [`& .umd-footer-social-column_wrapper &`]: {\n            display: 'none',\n          },\n        },\n      },\n    })\n    .withChild(linkElement)\n    .build();\n};\n\nexport const createCompositeFooterCampaign = CreateCampaignElement;\n"],"names":[],"mappings":";;;;;AAQA,MAAM,EAAE,UAAU;AAElB,MAAM,kCAAkC,CACtC,UACG;AACH,QAAM,EAAE,iBAAiB;AACzB,QAAM,MAAO,CAAC,gBAAgB,MAAM,SAAS,SAAU,MAAM,SAAS;AACtE,QAAM,MAAM,aAAa,EAAE,KAAK;AAChC,QAAM,OAAO,SAAS,cAAc,GAAG;AAEvC,MAAI,MAAM;AAEV,OAAK,OAAO;AACZ,OAAK,aAAa,UAAU,QAAQ;AACpC,OAAK,aAAa,OAAO,qBAAqB;AAC9C,OAAK;AAAA,IACH;AAAA,IACA;AAAA,EAAA;AAGF,OAAK,YAAY,GAAG;AAEpB,SAAO;AACT;AAEA,MAAM,wBAAwB,CAAC,UAA+C;AAC5E,QAAM,EAAE,iBAAiB;AAEzB,QAAM,MAAO,CAAC,gBAAgB,MAAM,QAAQ,SAAU,MAAM,QAAQ;AACpE,QAAM,MAAM,aAAa,EAAE,KAAK;AAChC,QAAM,OAAO,SAAS,cAAc,GAAG;AAEvC,MAAI,MAAM;AAEV,OAAK,OAAO;AACZ,OAAK,aAAa,UAAU,QAAQ;AACpC,OAAK,aAAa,OAAO,qBAAqB;AAC9C,OAAK,aAAa,cAAc,mCAAmC;AAEnE,OAAK,YAAY,GAAG;AAEpB,SAAO;AACT;AAEA,MAAM,wBAAwB,CAC5B,UACe;AACf,QAAM,EAAE,sBAAsB;AAE9B,QAAM,OAAO,oBACT,sBAAsB,KAAK,IAC3B,gCAAgC,KAAK;AAEzC,QAAM,cAAc,IAAI,eAAe,IAAI,EACxC,cAAc,sBAAsB,EACpC,WAAW;AAAA,IACV,SAAS;AAAA,MACP,SAAS;AAAA,MACT,WAAW,MAAM,QAAQ;AAAA,MACzB,UAAU;AAAA,IAAA;AAAA,EACZ,CACD,EACA,MAAA;AAEH,SAAO,IAAI,eAAA,EACR,cAAc,yBAAyB,EACvC,WAAW;AAAA,IACV,SAAS;AAAA,MACP,CAAC,OAAO,GAAG;AAAA,QACT,UAAU;AAAA,QACV,OAAO;AAAA,MAAA;AAAA,MAGT,CAAC,0BAA0B,KAAK,KAAK,GAAG;AAAA,QACtC,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,YAAY;AAAA,QAEZ,CAAC,8BAA8B,GAAG;AAAA,UAChC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,MAGF,CAAC,0BAA0B,QAAQ,CAAC,KAAK,GAAG;AAAA,QAC1C,CAAC,uCAAuC,GAAG;AAAA,UACzC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,IACF;AAAA,EACF,CACD,EACA,UAAU,WAAW,EACrB,MAAA;AACL;AAEO,MAAM,gCAAgC;"}

package/dist/composite/footer/elements/main-section/index.d.ts

@@ -1,5 +1,4 @@
 import { MainSectionProps } from '../../_types';
 import { UMDElement } from '../../../../_types';
-declare const _default: (props: MainSectionProps) => UMDElement;
-export default _default;
+export declare const createCompositeFooterMainSection: (props: MainSectionProps) => UMDElement;
 //# sourceMappingURL=index.d.ts.map

package/dist/composite/footer/elements/main-section/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../source/composite/footer/elements/main-section/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;yBAsFrC,OAAO,gBAAgB,KAAG,UAAU;AAApD,wBAqBE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../source/composite/footer/elements/main-section/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AA6GrD,eAAO,MAAM,gCAAgC,UAvBJ,gBAAgB,KAAG,UAuBY,CAAC"}