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

package/dist/composite/alert/page.js

@@ -1,33 +1,15 @@
-"use strict";
-const webBuilderLibrary = require("@universityofmaryland/web-builder-library");
-const token = require("@universityofmaryland/web-token-library");
-const indicators = require("@universityofmaryland/web-icons-library/indicators");
-const theme = require("@universityofmaryland/web-utilities-library/theme");
-const text = require("./elements/text.js");
-const closeButton = require("./elements/closeButton.js");
-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 { MEDIUM } = globals.BREAKPOINTS;
-const createIcon = (iconMarkup) => new webBuilderLibrary.ElementBuilder().withClassName("alert-page-icon").withHTML(iconMarkup).withStyles({
+import { ElementBuilder } from "@universityofmaryland/web-builder-library";
+import * as token from "@universityofmaryland/web-token-library";
+import { warning } from "@universityofmaryland/web-icons-library/indicators";
+import { theme } from "@universityofmaryland/web-utilities-library/theme";
+import { CreateAlertText } from "./elements/text.js";
+import { CreateCloseButton } from "./elements/closeButton.js";
+import { BREAKPOINTS } from "./globals.js";
+const { MEDIUM } = BREAKPOINTS;
+const createIcon = (iconMarkup) => new ElementBuilder().withClassName("alert-page-icon").withHTML(iconMarkup).withStyles({
   element: {
     display: "block",
-    fill: token__namespace.color.gold,
+    fill: token.color.gold,
     [`@container (max-width: ${MEDIUM}px)`]: {
       position: "absolute",
       top: "-20px"
@@ -36,34 +18,36 @@ const createIcon = (iconMarkup) => new webBuilderLibrary.ElementBuilder().withCl
 }).build();
 const createContainer = (props) => {
   const { isShowIcon = true, isThemeDark } = props;
-  const textModel = text.CreateAlertText(props);
-  const iconModel = isShowIcon ? createIcon(indicators.warning) : null;
-  const closeButtonModel = closeButton.CreateCloseButton({
+  const textModel = CreateAlertText(props);
+  const iconModel = isShowIcon ? createIcon(warning) : null;
+  const closeButtonModel = CreateCloseButton({
     isThemeDark: !!isThemeDark,
     targetSelector: ".alert-page-declaration"
   });
   const children = [iconModel, textModel, closeButtonModel].filter(
     Boolean
   );
-  return new webBuilderLibrary.ElementBuilder().withClassName("alert-page-container").withChildren(...children).withStyles({
+  return new ElementBuilder().withClassName("alert-page-container").withChildren(...children).withStyles({
     element: {
-      color: theme.theme.foreground(isThemeDark),
+      color: theme.foreground(isThemeDark),
       display: "flex",
       position: "relative",
-      padding: token__namespace.spacing.lg,
-      paddingRight: token__namespace.spacing["2xl"],
-      gap: token__namespace.spacing.lg,
-      border: `solid 4px ${token__namespace.color.gold}`,
+      padding: token.spacing.lg,
+      paddingRight: token.spacing["2xl"],
+      gap: token.spacing.lg,
+      border: `solid 4px ${token.color.gold}`,
       [`@container (max-width: ${MEDIUM}px)`]: {
-        paddingRight: token__namespace.spacing.lg
+        paddingRight: token.spacing.lg
       }
     }
   }).build();
 };
-const page = (props) => new webBuilderLibrary.ElementBuilder().withClassName("alert-page-declaration").withChild(createContainer(props)).withStyles({
+const createCompositeAlertPage = (props) => new ElementBuilder().withClassName("alert-page-declaration").withChild(createContainer(props)).withStyles({
   element: {
     containerType: "inline-size"
   }
 }).build();
-module.exports = page;
+export {
+  createCompositeAlertPage
+};
 //# sourceMappingURL=page.js.map

package/dist/composite/alert/page.js.map

@@ -1 +1 @@
-{"version":3,"file":"page.js","sources":["../../../source/composite/alert/page.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport { warning as iconWarning } from '@universityofmaryland/web-icons-library/indicators';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport { CreateAlertText as AlertText, AlertTextProps } from './elements/text';\nimport { CreateCloseButton } from './elements/closeButton';\nimport { BREAKPOINTS } from './globals';\nimport { type ElementModel } from '../../_types';\n\nexport interface AlertPageProps extends AlertTextProps {\n  isThemeLight?: boolean;\n  isShowIcon?: boolean;\n}\n\nconst { MEDIUM } = BREAKPOINTS;\n\nconst createIcon = (iconMarkup: string) =>\n  new ElementBuilder()\n    .withClassName('alert-page-icon')\n    .withHTML(iconMarkup)\n    .withStyles({\n      element: {\n        display: 'block',\n        fill: token.color.gold,\n\n        [`@container (max-width: ${MEDIUM}px)`]: {\n          position: 'absolute',\n          top: '-20px',\n        },\n      },\n    })\n    .build();\n\nconst createContainer = (\n  props: Pick<\n    AlertPageProps,\n    | 'isShowIcon'\n    | 'isThemeDark'\n    | 'isThemeLight'\n    | 'headline'\n    | 'text'\n    | 'actions'\n  >,\n) => {\n  const { isShowIcon = true, isThemeDark } = props;\n\n  const textModel = AlertText(props);\n  const iconModel = isShowIcon ? createIcon(iconWarning) : null;\n  const closeButtonModel = CreateCloseButton({\n    isThemeDark: !!isThemeDark,\n    targetSelector: '.alert-page-declaration',\n  });\n\n  const children = [iconModel, textModel, closeButtonModel].filter(\n    Boolean,\n  ) as ElementModel[];\n\n  return new ElementBuilder()\n    .withClassName('alert-page-container')\n    .withChildren(...children)\n    .withStyles({\n      element: {\n        color: theme.foreground(isThemeDark),\n        display: 'flex',\n        position: 'relative',\n        padding: token.spacing.lg,\n        paddingRight: token.spacing['2xl'],\n        gap: token.spacing.lg,\n        border: `solid 4px ${token.color.gold}`,\n\n        [`@container (max-width: ${MEDIUM}px)`]: {\n          paddingRight: token.spacing.lg,\n        },\n      },\n    })\n    .build();\n};\n\nexport default (props: AlertPageProps) =>\n  new ElementBuilder()\n    .withClassName('alert-page-declaration')\n    .withChild(createContainer(props))\n    .withStyles({\n      element: {\n        containerType: 'inline-size',\n      },\n    })\n    .build();\n"],"names":["BREAKPOINTS","ElementBuilder","token","AlertText","iconWarning","CreateCloseButton","theme"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAM,EAAE,WAAWA,QAAAA;AAEnB,MAAM,aAAa,CAAC,eAClB,IAAIC,kBAAAA,iBACD,cAAc,iBAAiB,EAC/B,SAAS,UAAU,EACnB,WAAW;AAAA,EACV,SAAS;AAAA,IACP,SAAS;AAAA,IACT,MAAMC,iBAAM,MAAM;AAAA,IAElB,CAAC,0BAA0B,MAAM,KAAK,GAAG;AAAA,MACvC,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,EACP;AAEJ,CAAC,EACA,MAAA;AAEL,MAAM,kBAAkB,CACtB,UASG;AACH,QAAM,EAAE,aAAa,MAAM,YAAA,IAAgB;AAE3C,QAAM,YAAYC,KAAAA,gBAAU,KAAK;AACjC,QAAM,YAAY,aAAa,WAAWC,WAAAA,OAAW,IAAI;AACzD,QAAM,mBAAmBC,YAAAA,kBAAkB;AAAA,IACzC,aAAa,CAAC,CAAC;AAAA,IACf,gBAAgB;AAAA,EAAA,CACjB;AAED,QAAM,WAAW,CAAC,WAAW,WAAW,gBAAgB,EAAE;AAAA,IACxD;AAAA,EAAA;AAGF,SAAO,IAAIJ,kBAAAA,eAAA,EACR,cAAc,sBAAsB,EACpC,aAAa,GAAG,QAAQ,EACxB,WAAW;AAAA,IACV,SAAS;AAAA,MACP,OAAOK,MAAAA,MAAM,WAAW,WAAW;AAAA,MACnC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAASJ,iBAAM,QAAQ;AAAA,MACvB,cAAcA,iBAAM,QAAQ,KAAK;AAAA,MACjC,KAAKA,iBAAM,QAAQ;AAAA,MACnB,QAAQ,aAAaA,iBAAM,MAAM,IAAI;AAAA,MAErC,CAAC,0BAA0B,MAAM,KAAK,GAAG;AAAA,QACvC,cAAcA,iBAAM,QAAQ;AAAA,MAAA;AAAA,IAC9B;AAAA,EACF,CACD,EACA,MAAA;AACL;AAEA,MAAA,OAAe,CAAC,UACd,IAAID,iCAAA,EACD,cAAc,wBAAwB,EACtC,UAAU,gBAAgB,KAAK,CAAC,EAChC,WAAW;AAAA,EACV,SAAS;AAAA,IACP,eAAe;AAAA,EAAA;AAEnB,CAAC,EACA,MAAA;;"}
+{"version":3,"file":"page.js","sources":["../../../source/composite/alert/page.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport { warning as iconWarning } from '@universityofmaryland/web-icons-library/indicators';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport { CreateAlertText as AlertText, AlertTextProps } from './elements/text';\nimport { CreateCloseButton } from './elements/closeButton';\nimport { BREAKPOINTS } from './globals';\nimport { type ElementModel } from '../../_types';\n\nexport interface AlertPageProps extends AlertTextProps {\n  isThemeLight?: boolean;\n  isShowIcon?: boolean;\n}\n\nconst { MEDIUM } = BREAKPOINTS;\n\nconst createIcon = (iconMarkup: string) =>\n  new ElementBuilder()\n    .withClassName('alert-page-icon')\n    .withHTML(iconMarkup)\n    .withStyles({\n      element: {\n        display: 'block',\n        fill: token.color.gold,\n\n        [`@container (max-width: ${MEDIUM}px)`]: {\n          position: 'absolute',\n          top: '-20px',\n        },\n      },\n    })\n    .build();\n\nconst createContainer = (\n  props: Pick<\n    AlertPageProps,\n    | 'isShowIcon'\n    | 'isThemeDark'\n    | 'isThemeLight'\n    | 'headline'\n    | 'text'\n    | 'actions'\n  >,\n) => {\n  const { isShowIcon = true, isThemeDark } = props;\n\n  const textModel = AlertText(props);\n  const iconModel = isShowIcon ? createIcon(iconWarning) : null;\n  const closeButtonModel = CreateCloseButton({\n    isThemeDark: !!isThemeDark,\n    targetSelector: '.alert-page-declaration',\n  });\n\n  const children = [iconModel, textModel, closeButtonModel].filter(\n    Boolean,\n  ) as ElementModel[];\n\n  return new ElementBuilder()\n    .withClassName('alert-page-container')\n    .withChildren(...children)\n    .withStyles({\n      element: {\n        color: theme.foreground(isThemeDark),\n        display: 'flex',\n        position: 'relative',\n        padding: token.spacing.lg,\n        paddingRight: token.spacing['2xl'],\n        gap: token.spacing.lg,\n        border: `solid 4px ${token.color.gold}`,\n\n        [`@container (max-width: ${MEDIUM}px)`]: {\n          paddingRight: token.spacing.lg,\n        },\n      },\n    })\n    .build();\n};\n\nexport const createCompositeAlertPage = (props: AlertPageProps) =>\n  new ElementBuilder()\n    .withClassName('alert-page-declaration')\n    .withChild(createContainer(props))\n    .withStyles({\n      element: {\n        containerType: 'inline-size',\n      },\n    })\n    .build();\n"],"names":["AlertText","iconWarning"],"mappings":";;;;;;;AAcA,MAAM,EAAE,WAAW;AAEnB,MAAM,aAAa,CAAC,eAClB,IAAI,iBACD,cAAc,iBAAiB,EAC/B,SAAS,UAAU,EACnB,WAAW;AAAA,EACV,SAAS;AAAA,IACP,SAAS;AAAA,IACT,MAAM,MAAM,MAAM;AAAA,IAElB,CAAC,0BAA0B,MAAM,KAAK,GAAG;AAAA,MACvC,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,EACP;AAEJ,CAAC,EACA,MAAA;AAEL,MAAM,kBAAkB,CACtB,UASG;AACH,QAAM,EAAE,aAAa,MAAM,YAAA,IAAgB;AAE3C,QAAM,YAAYA,gBAAU,KAAK;AACjC,QAAM,YAAY,aAAa,WAAWC,OAAW,IAAI;AACzD,QAAM,mBAAmB,kBAAkB;AAAA,IACzC,aAAa,CAAC,CAAC;AAAA,IACf,gBAAgB;AAAA,EAAA,CACjB;AAED,QAAM,WAAW,CAAC,WAAW,WAAW,gBAAgB,EAAE;AAAA,IACxD;AAAA,EAAA;AAGF,SAAO,IAAI,eAAA,EACR,cAAc,sBAAsB,EACpC,aAAa,GAAG,QAAQ,EACxB,WAAW;AAAA,IACV,SAAS;AAAA,MACP,OAAO,MAAM,WAAW,WAAW;AAAA,MACnC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS,MAAM,QAAQ;AAAA,MACvB,cAAc,MAAM,QAAQ,KAAK;AAAA,MACjC,KAAK,MAAM,QAAQ;AAAA,MACnB,QAAQ,aAAa,MAAM,MAAM,IAAI;AAAA,MAErC,CAAC,0BAA0B,MAAM,KAAK,GAAG;AAAA,QACvC,cAAc,MAAM,QAAQ;AAAA,MAAA;AAAA,IAC9B;AAAA,EACF,CACD,EACA,MAAA;AACL;AAEO,MAAM,2BAA2B,CAAC,UACvC,IAAI,iBACD,cAAc,wBAAwB,EACtC,UAAU,gBAAgB,KAAK,CAAC,EAChC,WAAW;AAAA,EACV,SAAS;AAAA,IACP,eAAe;AAAA,EAAA;AAEnB,CAAC,EACA,MAAA;"}

package/dist/composite/alert/site.d.ts

@@ -2,6 +2,5 @@ import { AlertTextProps } from './elements/text';
 export interface AlertSiteProps extends AlertTextProps {
     daysToHide?: string;
 }
-declare const _default: (props: AlertSiteProps) => import('@universityofmaryland/web-builder-library').ElementModel<HTMLElement>;
-export default _default;
+export declare const createCompositeAlertSite: (props: AlertSiteProps) => import('@universityofmaryland/web-builder-library').ElementModel<HTMLElement>;
 //# sourceMappingURL=site.d.ts.map

package/dist/composite/alert/site.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"site.d.ts","sourceRoot":"","sources":["../../../source/composite/alert/site.ts"],"names":[],"mappings":"AAQA,OAAO,EAAgC,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAK/E,MAAM,WAAW,cAAe,SAAQ,cAAc;IACpD,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;yBAmGe,OAAO,cAAc;AAArC,wBASE"}
+{"version":3,"file":"site.d.ts","sourceRoot":"","sources":["../../../source/composite/alert/site.ts"],"names":[],"mappings":"AAQA,OAAO,EAAgC,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAK/E,MAAM,WAAW,cAAe,SAAQ,cAAc;IACpD,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAmGD,eAAO,MAAM,wBAAwB,GAAI,OAAO,cAAc,kFAS7D,CAAC"}

package/dist/composite/alert/site.js

@@ -1,38 +1,19 @@
-"use strict";
-const webBuilderLibrary = require("@universityofmaryland/web-builder-library");
-const token = require("@universityofmaryland/web-token-library");
-const layout = require("@universityofmaryland/web-styles-library/layout");
-const storage = require("@universityofmaryland/web-utilities-library/storage");
-const theme = require("@universityofmaryland/web-utilities-library/theme");
-const text = require("./elements/text.js");
-const closeButton = require("./elements/closeButton.js");
-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 layout__namespace = /* @__PURE__ */ _interopNamespaceDefault(layout);
-const { MEDIUM } = globals.BREAKPOINTS;
+import { ElementBuilder } from "@universityofmaryland/web-builder-library";
+import * as token from "@universityofmaryland/web-token-library";
+import * as layout from "@universityofmaryland/web-styles-library/layout";
+import { getLocalStorageInt, setLocalStorageTimestamp } from "@universityofmaryland/web-utilities-library/storage";
+import { theme } from "@universityofmaryland/web-utilities-library/theme";
+import { CreateAlertText } from "./elements/text.js";
+import { CreateCloseButton } from "./elements/closeButton.js";
+import { BREAKPOINTS } from "./globals.js";
+const { MEDIUM } = BREAKPOINTS;
 const DEFAULT_HIDE_TIME = 30;
 const ALERT_LOCAL_STORAGE_KEY = "umd-alert-site-time";
 const shouldShow = (props) => {
   const { daysToHide } = props;
   const now = (/* @__PURE__ */ new Date()).getTime();
   const millisecondsPerDay = 24 * 60 * 60 * 1e3;
-  const lastClosedTime = storage.getLocalStorageInt({
+  const lastClosedTime = getLocalStorageInt({
     key: ALERT_LOCAL_STORAGE_KEY
   });
   if (!lastClosedTime) return false;
@@ -43,20 +24,20 @@ const shouldShow = (props) => {
 };
 const createLock = (props) => {
   const { isThemeDark } = props;
-  const textModel = text.CreateAlertText(props);
-  return new webBuilderLibrary.ElementBuilder().styled(layout__namespace.space.horizontal.larger).withChild(textModel).withStyles({
+  const textModel = CreateAlertText(props);
+  return new ElementBuilder().styled(layout.space.horizontal.larger).withChild(textModel).withStyles({
     element: {
       width: "100%"
     },
     subElement: {
-      color: theme.theme.foreground(isThemeDark),
-      maxWidth: token__namespace.spacing.maxWidth.large
+      color: theme.foreground(isThemeDark),
+      maxWidth: token.spacing.maxWidth.large
     }
   }).build();
 };
-const createCloseButton = () => closeButton.CreateCloseButton({
+const createCloseButton = () => CreateCloseButton({
   targetSelector: ".alert-site-declaration",
-  onBeforeClose: () => storage.setLocalStorageTimestamp({ key: ALERT_LOCAL_STORAGE_KEY })
+  onBeforeClose: () => setLocalStorageTimestamp({ key: ALERT_LOCAL_STORAGE_KEY })
 });
 const createContainer = (props) => {
   const lockElement = createLock(props);
@@ -64,27 +45,27 @@ const createContainer = (props) => {
   const children = [lockElement, closeButtonElement].filter(
     Boolean
   );
-  return new webBuilderLibrary.ElementBuilder().withClassName("alert-site-container").withChildren(...children).withStyles({
+  return new ElementBuilder().withClassName("alert-site-container").withChildren(...children).withStyles({
     element: {
       display: "flex",
       position: "relative",
-      padding: `${token__namespace.spacing.lg} 0`,
-      gap: token__namespace.spacing.lg,
-      backgroundColor: token__namespace.color.gold,
-      borderLeft: `4px solid ${token__namespace.color.red}`,
+      padding: `${token.spacing.lg} 0`,
+      gap: token.spacing.lg,
+      backgroundColor: token.color.gold,
+      borderLeft: `4px solid ${token.color.red}`,
       [`@container (min-width: ${MEDIUM}px)`]: {
-        borderLeft: `8px solid ${token__namespace.color.red}`,
-        paddingRight: token__namespace.spacing["2xl"]
+        borderLeft: `8px solid ${token.color.red}`,
+        paddingRight: token.spacing["2xl"]
       }
     }
   }).build();
 };
-const createWrapper = (container) => new webBuilderLibrary.ElementBuilder().withClassName("alert-site-declaration").withChild(container).withStyles({
+const createWrapper = (container) => new ElementBuilder().withClassName("alert-site-declaration").withChild(container).withStyles({
   element: {
     containerType: "inline-size"
   }
 }).build();
-const site = (props) => {
+const createCompositeAlertSite = (props) => {
   const containerModel = createContainer(props);
   const declarationModel = createWrapper(containerModel);
   if (shouldShow(props)) {
@@ -92,5 +73,7 @@ const site = (props) => {
   }
   return declarationModel;
 };
-module.exports = site;
+export {
+  createCompositeAlertSite
+};
 //# sourceMappingURL=site.js.map

package/dist/composite/alert/site.js.map

@@ -1 +1 @@
-{"version":3,"file":"site.js","sources":["../../../source/composite/alert/site.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport * as layout from '@universityofmaryland/web-styles-library/layout';\nimport {\n  getLocalStorageInt,\n  setLocalStorageTimestamp,\n} from '@universityofmaryland/web-utilities-library/storage';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport { CreateAlertText as AlertText, AlertTextProps } from './elements/text';\nimport { CreateCloseButton } from './elements/closeButton';\nimport { BREAKPOINTS } from './globals';\nimport { type ElementModel } from '../../_types';\n\nexport interface AlertSiteProps extends AlertTextProps {\n  daysToHide?: string;\n}\n\nconst { MEDIUM } = BREAKPOINTS;\nconst DEFAULT_HIDE_TIME = 30;\nconst ALERT_LOCAL_STORAGE_KEY = 'umd-alert-site-time';\n\nconst shouldShow = (props: Pick<AlertSiteProps, 'daysToHide'>) => {\n  const { daysToHide } = props;\n\n  const now = new Date().getTime();\n  const millisecondsPerDay = 24 * 60 * 60 * 1000;\n  const lastClosedTime = getLocalStorageInt({\n    key: ALERT_LOCAL_STORAGE_KEY,\n  });\n\n  if (!lastClosedTime) return false;\n\n  const daysUntilAlertDisplay = daysToHide\n    ? parseInt(daysToHide)\n    : DEFAULT_HIDE_TIME;\n  const futureTimeStamp =\n    lastClosedTime + millisecondsPerDay * daysUntilAlertDisplay;\n  const futureTime = new Date(futureTimeStamp).getTime();\n\n  return futureTime > now;\n};\n\nconst createLock = (\n  props: Pick<AlertSiteProps, 'headline' | 'text' | 'actions' | 'isThemeDark'>,\n) => {\n  const { isThemeDark } = props;\n  const textModel = AlertText(props);\n\n  return new ElementBuilder()\n    .styled(layout.space.horizontal.larger)\n    .withChild(textModel)\n    .withStyles({\n      element: {\n        width: '100%',\n      },\n      subElement: {\n        color: theme.foreground(isThemeDark),\n        maxWidth: token.spacing.maxWidth.large,\n      },\n    })\n    .build();\n};\n\nconst createCloseButton = () =>\n  CreateCloseButton({\n    targetSelector: '.alert-site-declaration',\n    onBeforeClose: () =>\n      setLocalStorageTimestamp({ key: ALERT_LOCAL_STORAGE_KEY }),\n  });\n\nconst createContainer = (\n  props: Pick<\n    AlertSiteProps,\n    'daysToHide' | 'isThemeDark' | 'headline' | 'text' | 'actions'\n  >,\n) => {\n  const lockElement = createLock(props);\n  const closeButtonElement = createCloseButton();\n  const children = [lockElement, closeButtonElement].filter(\n    Boolean,\n  ) as ElementModel[];\n\n  return new ElementBuilder()\n    .withClassName('alert-site-container')\n    .withChildren(...children)\n    .withStyles({\n      element: {\n        display: 'flex',\n        position: 'relative',\n        padding: `${token.spacing.lg} 0`,\n        gap: token.spacing.lg,\n        backgroundColor: token.color.gold,\n        borderLeft: `4px solid ${token.color.red}`,\n\n        [`@container (min-width: ${MEDIUM}px)`]: {\n          borderLeft: `8px solid ${token.color.red}`,\n          paddingRight: token.spacing['2xl'],\n        },\n      },\n    })\n    .build();\n};\n\nconst createWrapper = (container: ElementModel) =>\n  new ElementBuilder()\n    .withClassName('alert-site-declaration')\n    .withChild(container)\n    .withStyles({\n      element: {\n        containerType: 'inline-size',\n      },\n    })\n    .build();\n\nexport default (props: AlertSiteProps) => {\n  const containerModel = createContainer(props);\n  const declarationModel = createWrapper(containerModel);\n\n  if (shouldShow(props)) {\n    (declarationModel.element as HTMLElement).style.display = 'none';\n  }\n\n  return declarationModel;\n};\n"],"names":["BREAKPOINTS","getLocalStorageInt","AlertText","ElementBuilder","layout","theme","token","CreateCloseButton","setLocalStorageTimestamp"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,EAAE,WAAWA,QAAAA;AACnB,MAAM,oBAAoB;AAC1B,MAAM,0BAA0B;AAEhC,MAAM,aAAa,CAAC,UAA8C;AAChE,QAAM,EAAE,eAAe;AAEvB,QAAM,OAAM,oBAAI,KAAA,GAAO,QAAA;AACvB,QAAM,qBAAqB,KAAK,KAAK,KAAK;AAC1C,QAAM,iBAAiBC,QAAAA,mBAAmB;AAAA,IACxC,KAAK;AAAA,EAAA,CACN;AAED,MAAI,CAAC,eAAgB,QAAO;AAE5B,QAAM,wBAAwB,aAC1B,SAAS,UAAU,IACnB;AACJ,QAAM,kBACJ,iBAAiB,qBAAqB;AACxC,QAAM,aAAa,IAAI,KAAK,eAAe,EAAE,QAAA;AAE7C,SAAO,aAAa;AACtB;AAEA,MAAM,aAAa,CACjB,UACG;AACH,QAAM,EAAE,gBAAgB;AACxB,QAAM,YAAYC,KAAAA,gBAAU,KAAK;AAEjC,SAAO,IAAIC,kBAAAA,eAAA,EACR,OAAOC,kBAAO,MAAM,WAAW,MAAM,EACrC,UAAU,SAAS,EACnB,WAAW;AAAA,IACV,SAAS;AAAA,MACP,OAAO;AAAA,IAAA;AAAA,IAET,YAAY;AAAA,MACV,OAAOC,MAAAA,MAAM,WAAW,WAAW;AAAA,MACnC,UAAUC,iBAAM,QAAQ,SAAS;AAAA,IAAA;AAAA,EACnC,CACD,EACA,MAAA;AACL;AAEA,MAAM,oBAAoB,MACxBC,YAAAA,kBAAkB;AAAA,EAChB,gBAAgB;AAAA,EAChB,eAAe,MACbC,QAAAA,yBAAyB,EAAE,KAAK,yBAAyB;AAC7D,CAAC;AAEH,MAAM,kBAAkB,CACtB,UAIG;AACH,QAAM,cAAc,WAAW,KAAK;AACpC,QAAM,qBAAqB,kBAAA;AAC3B,QAAM,WAAW,CAAC,aAAa,kBAAkB,EAAE;AAAA,IACjD;AAAA,EAAA;AAGF,SAAO,IAAIL,kBAAAA,eAAA,EACR,cAAc,sBAAsB,EACpC,aAAa,GAAG,QAAQ,EACxB,WAAW;AAAA,IACV,SAAS;AAAA,MACP,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS,GAAGG,iBAAM,QAAQ,EAAE;AAAA,MAC5B,KAAKA,iBAAM,QAAQ;AAAA,MACnB,iBAAiBA,iBAAM,MAAM;AAAA,MAC7B,YAAY,aAAaA,iBAAM,MAAM,GAAG;AAAA,MAExC,CAAC,0BAA0B,MAAM,KAAK,GAAG;AAAA,QACvC,YAAY,aAAaA,iBAAM,MAAM,GAAG;AAAA,QACxC,cAAcA,iBAAM,QAAQ,KAAK;AAAA,MAAA;AAAA,IACnC;AAAA,EACF,CACD,EACA,MAAA;AACL;AAEA,MAAM,gBAAgB,CAAC,cACrB,IAAIH,kBAAAA,iBACD,cAAc,wBAAwB,EACtC,UAAU,SAAS,EACnB,WAAW;AAAA,EACV,SAAS;AAAA,IACP,eAAe;AAAA,EAAA;AAEnB,CAAC,EACA,MAAA;AAEL,MAAA,OAAe,CAAC,UAA0B;AACxC,QAAM,iBAAiB,gBAAgB,KAAK;AAC5C,QAAM,mBAAmB,cAAc,cAAc;AAErD,MAAI,WAAW,KAAK,GAAG;AACpB,qBAAiB,QAAwB,MAAM,UAAU;AAAA,EAC5D;AAEA,SAAO;AACT;;"}
+{"version":3,"file":"site.js","sources":["../../../source/composite/alert/site.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport * as layout from '@universityofmaryland/web-styles-library/layout';\nimport {\n  getLocalStorageInt,\n  setLocalStorageTimestamp,\n} from '@universityofmaryland/web-utilities-library/storage';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport { CreateAlertText as AlertText, AlertTextProps } from './elements/text';\nimport { CreateCloseButton } from './elements/closeButton';\nimport { BREAKPOINTS } from './globals';\nimport { type ElementModel } from '../../_types';\n\nexport interface AlertSiteProps extends AlertTextProps {\n  daysToHide?: string;\n}\n\nconst { MEDIUM } = BREAKPOINTS;\nconst DEFAULT_HIDE_TIME = 30;\nconst ALERT_LOCAL_STORAGE_KEY = 'umd-alert-site-time';\n\nconst shouldShow = (props: Pick<AlertSiteProps, 'daysToHide'>) => {\n  const { daysToHide } = props;\n\n  const now = new Date().getTime();\n  const millisecondsPerDay = 24 * 60 * 60 * 1000;\n  const lastClosedTime = getLocalStorageInt({\n    key: ALERT_LOCAL_STORAGE_KEY,\n  });\n\n  if (!lastClosedTime) return false;\n\n  const daysUntilAlertDisplay = daysToHide\n    ? parseInt(daysToHide)\n    : DEFAULT_HIDE_TIME;\n  const futureTimeStamp =\n    lastClosedTime + millisecondsPerDay * daysUntilAlertDisplay;\n  const futureTime = new Date(futureTimeStamp).getTime();\n\n  return futureTime > now;\n};\n\nconst createLock = (\n  props: Pick<AlertSiteProps, 'headline' | 'text' | 'actions' | 'isThemeDark'>,\n) => {\n  const { isThemeDark } = props;\n  const textModel = AlertText(props);\n\n  return new ElementBuilder()\n    .styled(layout.space.horizontal.larger)\n    .withChild(textModel)\n    .withStyles({\n      element: {\n        width: '100%',\n      },\n      subElement: {\n        color: theme.foreground(isThemeDark),\n        maxWidth: token.spacing.maxWidth.large,\n      },\n    })\n    .build();\n};\n\nconst createCloseButton = () =>\n  CreateCloseButton({\n    targetSelector: '.alert-site-declaration',\n    onBeforeClose: () =>\n      setLocalStorageTimestamp({ key: ALERT_LOCAL_STORAGE_KEY }),\n  });\n\nconst createContainer = (\n  props: Pick<\n    AlertSiteProps,\n    'daysToHide' | 'isThemeDark' | 'headline' | 'text' | 'actions'\n  >,\n) => {\n  const lockElement = createLock(props);\n  const closeButtonElement = createCloseButton();\n  const children = [lockElement, closeButtonElement].filter(\n    Boolean,\n  ) as ElementModel[];\n\n  return new ElementBuilder()\n    .withClassName('alert-site-container')\n    .withChildren(...children)\n    .withStyles({\n      element: {\n        display: 'flex',\n        position: 'relative',\n        padding: `${token.spacing.lg} 0`,\n        gap: token.spacing.lg,\n        backgroundColor: token.color.gold,\n        borderLeft: `4px solid ${token.color.red}`,\n\n        [`@container (min-width: ${MEDIUM}px)`]: {\n          borderLeft: `8px solid ${token.color.red}`,\n          paddingRight: token.spacing['2xl'],\n        },\n      },\n    })\n    .build();\n};\n\nconst createWrapper = (container: ElementModel) =>\n  new ElementBuilder()\n    .withClassName('alert-site-declaration')\n    .withChild(container)\n    .withStyles({\n      element: {\n        containerType: 'inline-size',\n      },\n    })\n    .build();\n\nexport const createCompositeAlertSite = (props: AlertSiteProps) => {\n  const containerModel = createContainer(props);\n  const declarationModel = createWrapper(containerModel);\n\n  if (shouldShow(props)) {\n    (declarationModel.element as HTMLElement).style.display = 'none';\n  }\n\n  return declarationModel;\n};\n"],"names":["AlertText"],"mappings":";;;;;;;;AAiBA,MAAM,EAAE,WAAW;AACnB,MAAM,oBAAoB;AAC1B,MAAM,0BAA0B;AAEhC,MAAM,aAAa,CAAC,UAA8C;AAChE,QAAM,EAAE,eAAe;AAEvB,QAAM,OAAM,oBAAI,KAAA,GAAO,QAAA;AACvB,QAAM,qBAAqB,KAAK,KAAK,KAAK;AAC1C,QAAM,iBAAiB,mBAAmB;AAAA,IACxC,KAAK;AAAA,EAAA,CACN;AAED,MAAI,CAAC,eAAgB,QAAO;AAE5B,QAAM,wBAAwB,aAC1B,SAAS,UAAU,IACnB;AACJ,QAAM,kBACJ,iBAAiB,qBAAqB;AACxC,QAAM,aAAa,IAAI,KAAK,eAAe,EAAE,QAAA;AAE7C,SAAO,aAAa;AACtB;AAEA,MAAM,aAAa,CACjB,UACG;AACH,QAAM,EAAE,gBAAgB;AACxB,QAAM,YAAYA,gBAAU,KAAK;AAEjC,SAAO,IAAI,eAAA,EACR,OAAO,OAAO,MAAM,WAAW,MAAM,EACrC,UAAU,SAAS,EACnB,WAAW;AAAA,IACV,SAAS;AAAA,MACP,OAAO;AAAA,IAAA;AAAA,IAET,YAAY;AAAA,MACV,OAAO,MAAM,WAAW,WAAW;AAAA,MACnC,UAAU,MAAM,QAAQ,SAAS;AAAA,IAAA;AAAA,EACnC,CACD,EACA,MAAA;AACL;AAEA,MAAM,oBAAoB,MACxB,kBAAkB;AAAA,EAChB,gBAAgB;AAAA,EAChB,eAAe,MACb,yBAAyB,EAAE,KAAK,yBAAyB;AAC7D,CAAC;AAEH,MAAM,kBAAkB,CACtB,UAIG;AACH,QAAM,cAAc,WAAW,KAAK;AACpC,QAAM,qBAAqB,kBAAA;AAC3B,QAAM,WAAW,CAAC,aAAa,kBAAkB,EAAE;AAAA,IACjD;AAAA,EAAA;AAGF,SAAO,IAAI,eAAA,EACR,cAAc,sBAAsB,EACpC,aAAa,GAAG,QAAQ,EACxB,WAAW;AAAA,IACV,SAAS;AAAA,MACP,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS,GAAG,MAAM,QAAQ,EAAE;AAAA,MAC5B,KAAK,MAAM,QAAQ;AAAA,MACnB,iBAAiB,MAAM,MAAM;AAAA,MAC7B,YAAY,aAAa,MAAM,MAAM,GAAG;AAAA,MAExC,CAAC,0BAA0B,MAAM,KAAK,GAAG;AAAA,QACvC,YAAY,aAAa,MAAM,MAAM,GAAG;AAAA,QACxC,cAAc,MAAM,QAAQ,KAAK;AAAA,MAAA;AAAA,IACnC;AAAA,EACF,CACD,EACA,MAAA;AACL;AAEA,MAAM,gBAAgB,CAAC,cACrB,IAAI,iBACD,cAAc,wBAAwB,EACtC,UAAU,SAAS,EACnB,WAAW;AAAA,EACV,SAAS;AAAA,IACP,eAAe;AAAA,EAAA;AAEnB,CAAC,EACA,MAAA;AAEE,MAAM,2BAA2B,CAAC,UAA0B;AACjE,QAAM,iBAAiB,gBAAgB,KAAK;AAC5C,QAAM,mBAAmB,cAAc,cAAc;AAErD,MAAI,WAAW,KAAK,GAAG;AACpB,qBAAiB,QAAwB,MAAM,UAAU;AAAA,EAC5D;AAEA,SAAO;AACT;"}

package/dist/composite/banner/index.d.ts

@@ -1,2 +1,2 @@
-export { default as promo } from './promo';
+export { createCompositeBannerPromo as promo } from './promo';
 //# sourceMappingURL=index.d.ts.map

package/dist/composite/banner/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../source/composite/banner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../source/composite/banner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC"}

package/dist/composite/banner/index.js

@@ -1,5 +1,5 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const promo = require("./promo.js");
-exports.promo = promo;
+import { createCompositeBannerPromo } from "./promo.js";
+export {
+  createCompositeBannerPromo as promo
+};
 //# sourceMappingURL=index.js.map

package/dist/composite/banner/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/composite/banner/promo.d.ts

@@ -5,9 +5,6 @@ type TypeBannerPromoProps = {
     isThemeDark?: boolean;
     includeSeal?: boolean;
 };
-declare const CreateBannerPromoElement: (props: TypeBannerPromoProps) => {
-    element: HTMLDivElement;
-    styles: string;
-};
-export default CreateBannerPromoElement;
+export declare const createCompositeBannerPromo: (props: TypeBannerPromoProps) => import('@universityofmaryland/web-builder-library').ElementModel<HTMLElement>;
+export {};
 //# sourceMappingURL=promo.d.ts.map

package/dist/composite/banner/promo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"promo.d.ts","sourceRoot":"","sources":["../../../source/composite/banner/promo.ts"],"names":[],"mappings":"AAUA,KAAK,oBAAoB,GAAG;IAC1B,QAAQ,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC9B,IAAI,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAyLF,QAAA,MAAM,wBAAwB,GAAI,OAAO,oBAAoB;;;CAiCvD,CAAC;AAEP,eAAe,wBAAwB,CAAC"}
+{"version":3,"file":"promo.d.ts","sourceRoot":"","sources":["../../../source/composite/banner/promo.ts"],"names":[],"mappings":"AAUA,KAAK,oBAAoB,GAAG;IAC1B,QAAQ,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC9B,IAAI,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AA2MF,eAAO,MAAM,0BAA0B,GAAI,OAAO,oBAAoB,kFAkBrE,CAAC"}