@universityofmaryland/web-components-library 1.14.0 → 1.14.2

package/README.md

@@ -1,6 +1,6 @@
 # University of Maryland Web Components Library
 
-[![Components Version](https://img.shields.io/badge/Components-v1.14.0-blue)](https://www.npmjs.com/package/@universityofmaryland/web-components-library)
+[![Components Version](https://img.shields.io/badge/Components-v1.14.2-blue)](https://www.npmjs.com/package/@universityofmaryland/web-components-library)
 
 High-level web components built on the UMD Elements Library, providing feature-rich, accessible, and brand-compliant UI components for University of Maryland digital experiences.
 
@@ -257,6 +257,7 @@ if (card) {
 - **[Component Reference](./)** - Complete API documentation
 - **[Usage Examples](./usage.html)** - Practical implementation guide with real-world examples
 - **[Advanced Guide](./advanced-usage.html)** - TypeScript, testing, reactive components, and custom development
+- **[Advanced Bundling](./advanced-bundling.html)** - Bundle optimization, tree-shaking, and production build strategies
 - **[Design System](https://designsystem.umd.edu)** - Full design system docs
 
 ## Testing

package/dist/{_event-CGJXrBKT.js → _event-BzvNLqqf.js}

@@ -1,6 +1,6 @@
 import { Atomic as r } from "@universityofmaryland/web-elements-library";
-import { i as D, a as i, s as o } from "./shared/model-BRmBEAso.js";
-import { c, a as m } from "./shared/utilities-3kh9u_Lb.js";
+import { i as D, a as i, s as o } from "./shared/model-4-WQm2Le.js";
+import { c, a as m } from "./shared/utilities-B_sPVa-m.js";
 import "@universityofmaryland/web-styles-library";
 const u = (t) => ({
   startDate: t.querySelector(`[slot="${o.name.DATE_START_ISO}"]`),
@@ -56,4 +56,4 @@ const u = (t) => ({
 export {
   p as e
 };
-//# sourceMappingURL=_event-CGJXrBKT.js.map
+//# sourceMappingURL=_event-BzvNLqqf.js.map

package/dist/{_event-CGJXrBKT.js.map → _event-BzvNLqqf.js.map}

@@ -1 +1 @@
-{"version":3,"file":"_event-CGJXrBKT.js","sources":["../source/api/_event.ts"],"sourcesContent":["import { Atomic } from '@universityofmaryland/web-elements-library';\nimport { Attributes, Slots } from 'model';\nimport { Markup } from 'utilities';\nimport { ComponentRef } from '../_types';\n\n/**\n * Configuration options for creating event components\n */\ninterface EventComponentOptions {\n  /** Whether to use dark theme for event details */\n  isThemeDark?: boolean;\n  /** Whether to show time in event details */\n  showTime?: boolean;\n  /** Whether to use large size for date sign */\n  isLargeSize?: boolean;\n  /** Whether to use dark theme for date sign (separate from event details) */\n  isDateSignDark?: boolean;\n}\n\n/**\n * Parsed event data ready for component creation\n */\ninterface ParsedEventData {\n  /** Processed date and location data from Markup.event.createDetailsData */\n  detailsData: ReturnType<typeof Markup.event.createDetailsData>;\n  /** Parsed start date object */\n  startDate: ReturnType<typeof Markup.event.createDate>;\n  /** Parsed end date object (optional) */\n  endDate: ReturnType<typeof Markup.event.createDate>;\n  /** Location element (optional) */\n  locationElement: Element | null;\n}\n\n/**\n * Element visual structure matching the return type from elements library\n */\ninterface ElementVisualComponent {\n  element: HTMLElement;\n  className: string;\n  styles: string;\n}\n\n/**\n * Result containing created event components\n */\ninterface EventComponents {\n  /** Event details/meta component */\n  eventMeta: ElementVisualComponent;\n  /** Date sign component */\n  dateSign: ElementVisualComponent;\n}\n\n/**\n * Raw event slot elements extracted from the host element\n */\ninterface EventSlots {\n  startDate: Element | null;\n  endDate: Element | null;\n  location: Element | null;\n}\n\n/**\n * Extracts event-related slot elements from the host element\n *\n * @param element - The host HTML element containing slotted content\n * @returns Object containing the extracted slot elements\n */\nconst extractEventSlots = (element: HTMLElement): EventSlots => ({\n  startDate: element.querySelector(`[slot=\"${Slots.name.DATE_START_ISO}\"]`),\n  endDate: element.querySelector(`[slot=\"${Slots.name.DATE_END_ISO}\"]`),\n  location: element.querySelector(`[slot=\"${Slots.name.contact.location}\"]`),\n});\n\n/**\n * Parses event data from slot elements\n *\n * @param slots - The extracted slot elements\n * @returns Parsed event data or null if start date is missing\n */\nconst parseEventData = (slots: EventSlots): ParsedEventData | null => {\n  const startDate = Markup.event.createDate({ element: slots.startDate });\n\n  if (!startDate) {\n    return null;\n  }\n\n  const endDate = Markup.event.createDate({ element: slots.endDate });\n\n  const detailsData = Markup.event.createDetailsData({\n    locationElement: slots.location,\n    startDate,\n    endDate,\n  });\n\n  return {\n    detailsData,\n    startDate,\n    endDate,\n    locationElement: slots.location,\n  };\n};\n\n/**\n * Extracts event configuration from element attributes\n *\n * @param element - The host HTML element\n * @returns Configuration options for event components\n */\nconst extractEventConfig = (element: HTMLElement): EventComponentOptions => ({\n  isThemeDark:\n    Attributes.isTheme.dark({ element }) ||\n    Attributes.isTheme.maryland({ element }),\n  showTime: Attributes.isVisual.showTime({ element }),\n});\n\n/**\n * Creates event meta and date sign components\n *\n * @param eventData - Parsed event data\n * @param options - Configuration options for the components\n * @returns Object containing the created components\n */\nexport const createEventComponents = (\n  eventData: ParsedEventData,\n  options: EventComponentOptions = {},\n): EventComponents => {\n  const {\n    isThemeDark = false,\n    showTime = false,\n    isLargeSize = false,\n    isDateSignDark,\n  } = options;\n\n  return {\n    eventMeta: Atomic.events.meta({\n      ...eventData.detailsData,\n      isThemeDark,\n      showTime,\n    }),\n    dateSign: Atomic.events.sign({\n      ...eventData.detailsData,\n      isThemeDark: isDateSignDark ?? isThemeDark,\n      isLargeSize,\n    }),\n  };\n};\n\n/**\n * Main function to extract and process event data from an element\n *\n * This is the primary API for working with event components. It:\n * 1. Extracts event slots from the element\n * 2. Parses the event data\n * 3. Creates configured event components\n *\n * @param element - The host HTML element containing event data\n * @param options - Optional configuration overrides\n * @returns Event components or null if required data is missing\n *\n * @example\n * ```typescript\n * // Basic usage - extracts everything from element\n * const eventData = extractEventData(element);\n * if (eventData) {\n *   const { eventMeta, dateSign } = eventData;\n *   // Use components...\n * }\n *\n * // With custom options\n * const eventData = extractEventData(element, {\n *   isLargeSize: true,\n *   isDateSignDark: false\n * });\n * ```\n */\nexport const extractEventData = (\n  element: HTMLElement,\n  options?: Partial<EventComponentOptions>,\n): EventComponents | null => {\n  const slots = extractEventSlots(element);\n  const eventData = parseEventData(slots);\n\n  if (!eventData) {\n    return null;\n  }\n\n  const config = {\n    ...extractEventConfig(element),\n    ...options,\n  };\n\n  return createEventComponents(eventData, config);\n};\n"],"names":["extractEventSlots","element","Slots","parseEventData","slots","startDate","Markup.event.createDate","endDate","Markup.event.createDetailsData","extractEventConfig","Attributes.isTheme","Attributes.isVisual","createEventComponents","eventData","options","isThemeDark","showTime","isLargeSize","isDateSignDark","Atomic","extractEventData","config"],"mappings":";;;;AAmEA,MAAMA,IAAoB,CAACC,OAAsC;AAAA,EAC/D,WAAWA,EAAQ,cAAc,UAAUC,EAAM,KAAK,cAAc,IAAI;AAAA,EACxE,SAASD,EAAQ,cAAc,UAAUC,EAAM,KAAK,YAAY,IAAI;AAAA,EACpE,UAAUD,EAAQ,cAAc,UAAUC,EAAM,KAAK,QAAQ,QAAQ,IAAI;AAC3E,IAQMC,IAAiB,CAACC,MAA8C;AACpE,QAAMC,IAAYC,EAAwB,EAAE,SAASF,EAAM,WAAW;AAEtE,MAAI,CAACC;AACH,WAAO;AAGT,QAAME,IAAUD,EAAwB,EAAE,SAASF,EAAM,SAAS;AAQlE,SAAO;AAAA,IACL,aAPkBI,EAA+B;AAAA,MACjD,iBAAiBJ,EAAM;AAAA,MACvB,WAAAC;AAAA,MACA,SAAAE;AAAA,IAAA,CACD;AAAA,IAIC,WAAAF;AAAA,IACA,SAAAE;AAAA,IACA,iBAAiBH,EAAM;AAAA,EAAA;AAE3B,GAQMK,IAAqB,CAACR,OAAiD;AAAA,EAC3E,aACES,EAAmB,KAAK,EAAE,SAAAT,EAAA,CAAS,KACnCS,EAAmB,SAAS,EAAE,SAAAT,GAAS;AAAA,EACzC,UAAUU,EAAoB,SAAS,EAAE,SAAAV,GAAS;AACpD,IASaW,IAAwB,CACnCC,GACAC,IAAiC,OACb;AACpB,QAAM;AAAA,IACJ,aAAAC,IAAc;AAAA,IACd,UAAAC,IAAW;AAAA,IACX,aAAAC,IAAc;AAAA,IACd,gBAAAC;AAAA,EAAA,IACEJ;AAEJ,SAAO;AAAA,IACL,WAAWK,EAAO,OAAO,KAAK;AAAA,MAC5B,GAAGN,EAAU;AAAA,MACb,aAAAE;AAAA,MACA,UAAAC;AAAA,IAAA,CACD;AAAA,IACD,UAAUG,EAAO,OAAO,KAAK;AAAA,MAC3B,GAAGN,EAAU;AAAA,MACb,aAAaK,KAAkBH;AAAA,MAC/B,aAAAE;AAAA,IAAA,CACD;AAAA,EAAA;AAEL,GA8BaG,IAAmB,CAC9BnB,GACAa,MAC2B;AAC3B,QAAMV,IAAQJ,EAAkBC,CAAO,GACjCY,IAAYV,EAAeC,CAAK;AAEtC,MAAI,CAACS;AACH,WAAO;AAGT,QAAMQ,IAAS;AAAA,IACb,GAAGZ,EAAmBR,CAAO;AAAA,IAC7B,GAAGa;AAAA,EAAA;AAGL,SAAOF,EAAsBC,GAAWQ,CAAM;AAChD;"}
+{"version":3,"file":"_event-BzvNLqqf.js","sources":["../source/api/_event.ts"],"sourcesContent":["import { Atomic } from '@universityofmaryland/web-elements-library';\nimport { Attributes, Slots } from 'model';\nimport { Markup } from 'utilities';\nimport { ComponentRef } from '../_types';\n\n/**\n * Configuration options for creating event components\n */\ninterface EventComponentOptions {\n  /** Whether to use dark theme for event details */\n  isThemeDark?: boolean;\n  /** Whether to show time in event details */\n  showTime?: boolean;\n  /** Whether to use large size for date sign */\n  isLargeSize?: boolean;\n  /** Whether to use dark theme for date sign (separate from event details) */\n  isDateSignDark?: boolean;\n}\n\n/**\n * Parsed event data ready for component creation\n */\ninterface ParsedEventData {\n  /** Processed date and location data from Markup.event.createDetailsData */\n  detailsData: ReturnType<typeof Markup.event.createDetailsData>;\n  /** Parsed start date object */\n  startDate: ReturnType<typeof Markup.event.createDate>;\n  /** Parsed end date object (optional) */\n  endDate: ReturnType<typeof Markup.event.createDate>;\n  /** Location element (optional) */\n  locationElement: Element | null;\n}\n\n/**\n * Element visual structure matching the return type from elements library\n */\ninterface ElementVisualComponent {\n  element: HTMLElement;\n  className: string;\n  styles: string;\n}\n\n/**\n * Result containing created event components\n */\ninterface EventComponents {\n  /** Event details/meta component */\n  eventMeta: ElementVisualComponent;\n  /** Date sign component */\n  dateSign: ElementVisualComponent;\n}\n\n/**\n * Raw event slot elements extracted from the host element\n */\ninterface EventSlots {\n  startDate: Element | null;\n  endDate: Element | null;\n  location: Element | null;\n}\n\n/**\n * Extracts event-related slot elements from the host element\n *\n * @param element - The host HTML element containing slotted content\n * @returns Object containing the extracted slot elements\n */\nconst extractEventSlots = (element: HTMLElement): EventSlots => ({\n  startDate: element.querySelector(`[slot=\"${Slots.name.DATE_START_ISO}\"]`),\n  endDate: element.querySelector(`[slot=\"${Slots.name.DATE_END_ISO}\"]`),\n  location: element.querySelector(`[slot=\"${Slots.name.contact.location}\"]`),\n});\n\n/**\n * Parses event data from slot elements\n *\n * @param slots - The extracted slot elements\n * @returns Parsed event data or null if start date is missing\n */\nconst parseEventData = (slots: EventSlots): ParsedEventData | null => {\n  const startDate = Markup.event.createDate({ element: slots.startDate });\n\n  if (!startDate) {\n    return null;\n  }\n\n  const endDate = Markup.event.createDate({ element: slots.endDate });\n\n  const detailsData = Markup.event.createDetailsData({\n    locationElement: slots.location,\n    startDate,\n    endDate,\n  });\n\n  return {\n    detailsData,\n    startDate,\n    endDate,\n    locationElement: slots.location,\n  };\n};\n\n/**\n * Extracts event configuration from element attributes\n *\n * @param element - The host HTML element\n * @returns Configuration options for event components\n */\nconst extractEventConfig = (element: HTMLElement): EventComponentOptions => ({\n  isThemeDark:\n    Attributes.isTheme.dark({ element }) ||\n    Attributes.isTheme.maryland({ element }),\n  showTime: Attributes.isVisual.showTime({ element }),\n});\n\n/**\n * Creates event meta and date sign components\n *\n * @param eventData - Parsed event data\n * @param options - Configuration options for the components\n * @returns Object containing the created components\n */\nexport const createEventComponents = (\n  eventData: ParsedEventData,\n  options: EventComponentOptions = {},\n): EventComponents => {\n  const {\n    isThemeDark = false,\n    showTime = false,\n    isLargeSize = false,\n    isDateSignDark,\n  } = options;\n\n  return {\n    eventMeta: Atomic.events.meta({\n      ...eventData.detailsData,\n      isThemeDark,\n      showTime,\n    }),\n    dateSign: Atomic.events.sign({\n      ...eventData.detailsData,\n      isThemeDark: isDateSignDark ?? isThemeDark,\n      isLargeSize,\n    }),\n  };\n};\n\n/**\n * Main function to extract and process event data from an element\n *\n * This is the primary API for working with event components. It:\n * 1. Extracts event slots from the element\n * 2. Parses the event data\n * 3. Creates configured event components\n *\n * @param element - The host HTML element containing event data\n * @param options - Optional configuration overrides\n * @returns Event components or null if required data is missing\n *\n * @example\n * ```typescript\n * // Basic usage - extracts everything from element\n * const eventData = extractEventData(element);\n * if (eventData) {\n *   const { eventMeta, dateSign } = eventData;\n *   // Use components...\n * }\n *\n * // With custom options\n * const eventData = extractEventData(element, {\n *   isLargeSize: true,\n *   isDateSignDark: false\n * });\n * ```\n */\nexport const extractEventData = (\n  element: HTMLElement,\n  options?: Partial<EventComponentOptions>,\n): EventComponents | null => {\n  const slots = extractEventSlots(element);\n  const eventData = parseEventData(slots);\n\n  if (!eventData) {\n    return null;\n  }\n\n  const config = {\n    ...extractEventConfig(element),\n    ...options,\n  };\n\n  return createEventComponents(eventData, config);\n};\n"],"names":["extractEventSlots","element","Slots","parseEventData","slots","startDate","Markup.event.createDate","endDate","Markup.event.createDetailsData","extractEventConfig","Attributes.isTheme","Attributes.isVisual","createEventComponents","eventData","options","isThemeDark","showTime","isLargeSize","isDateSignDark","Atomic","extractEventData","config"],"mappings":";;;;AAmEA,MAAMA,IAAoB,CAACC,OAAsC;AAAA,EAC/D,WAAWA,EAAQ,cAAc,UAAUC,EAAM,KAAK,cAAc,IAAI;AAAA,EACxE,SAASD,EAAQ,cAAc,UAAUC,EAAM,KAAK,YAAY,IAAI;AAAA,EACpE,UAAUD,EAAQ,cAAc,UAAUC,EAAM,KAAK,QAAQ,QAAQ,IAAI;AAC3E,IAQMC,IAAiB,CAACC,MAA8C;AACpE,QAAMC,IAAYC,EAAwB,EAAE,SAASF,EAAM,WAAW;AAEtE,MAAI,CAACC;AACH,WAAO;AAGT,QAAME,IAAUD,EAAwB,EAAE,SAASF,EAAM,SAAS;AAQlE,SAAO;AAAA,IACL,aAPkBI,EAA+B;AAAA,MACjD,iBAAiBJ,EAAM;AAAA,MACvB,WAAAC;AAAA,MACA,SAAAE;AAAA,IAAA,CACD;AAAA,IAIC,WAAAF;AAAA,IACA,SAAAE;AAAA,IACA,iBAAiBH,EAAM;AAAA,EAAA;AAE3B,GAQMK,IAAqB,CAACR,OAAiD;AAAA,EAC3E,aACES,EAAmB,KAAK,EAAE,SAAAT,EAAA,CAAS,KACnCS,EAAmB,SAAS,EAAE,SAAAT,GAAS;AAAA,EACzC,UAAUU,EAAoB,SAAS,EAAE,SAAAV,GAAS;AACpD,IASaW,IAAwB,CACnCC,GACAC,IAAiC,OACb;AACpB,QAAM;AAAA,IACJ,aAAAC,IAAc;AAAA,IACd,UAAAC,IAAW;AAAA,IACX,aAAAC,IAAc;AAAA,IACd,gBAAAC;AAAA,EAAA,IACEJ;AAEJ,SAAO;AAAA,IACL,WAAWK,EAAO,OAAO,KAAK;AAAA,MAC5B,GAAGN,EAAU;AAAA,MACb,aAAAE;AAAA,MACA,UAAAC;AAAA,IAAA,CACD;AAAA,IACD,UAAUG,EAAO,OAAO,KAAK;AAAA,MAC3B,GAAGN,EAAU;AAAA,MACb,aAAaK,KAAkBH;AAAA,MAC/B,aAAAE;AAAA,IAAA,CACD;AAAA,EAAA;AAEL,GA8BaG,IAAmB,CAC9BnB,GACAa,MAC2B;AAC3B,QAAMV,IAAQJ,EAAkBC,CAAO,GACjCY,IAAYV,EAAeC,CAAK;AAEtC,MAAI,CAACS;AACH,WAAO;AAGT,QAAMQ,IAAS;AAAA,IACb,GAAGZ,EAAmBR,CAAO;AAAA,IAC7B,GAAGa;AAAA,EAAA;AAGL,SAAOF,EAAsBC,GAAWQ,CAAM;AAChD;"}