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

package/README.md

@@ -1,6 +1,6 @@
 # University of Maryland Web Elements Library
 
-[![Elements Version](https://img.shields.io/badge/Elements-v1.5.9-blue)](https://www.npmjs.com/package/@universityofmaryland/web-elements-library)
+[![Elements Version](https://img.shields.io/badge/Elements-v1.6.0-blue)](https://www.npmjs.com/package/@universityofmaryland/web-elements-library)
 
 Foundational UI building blocks for the UMD Design System, providing atomic elements that combine to create complex, accessible, and brand-compliant University of Maryland digital experiences.
 

package/dist/atomic/_types.d.ts

@@ -6,7 +6,7 @@ export interface PersonContactProps extends PersonCtaProps, Pick<ThemeProps, 'is
     additionalContact?: ContentElement;
     address?: ContentElement;
     email?: ContentElement;
-    linkendIn?: ContentElement;
+    linkedin?: ContentElement;
     phone?: ContentElement;
 }
 export interface PersonTextLockupProps extends PersonCtaProps, Pick<ThemeProps, 'isThemeDark'> {

package/dist/atomic/_types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_types.d.ts","sourceRoot":"","sources":["../../source/atomic/_types.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,UAAU,EACf,KAAK,UAAU,EAChB,MAAM,WAAW,CAAC;AAEnB,MAAM,WAAW,cAAc;IAC7B,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B;AAKD,MAAM,WAAW,kBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC;IACjC,iBAAiB,CAAC,EAAE,cAAc,CAAC;IACnC,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,KAAK,CAAC,EAAE,cAAc,CAAC;CACxB;AAGD,MAAM,WAAW,qBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC;IACjC,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,aAAa,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B;AAGD,MAAM,WAAW,4BAA6B,SAAQ,kBAAkB;IACtE,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACpC;AAED,MAAM,WAAW,+BAAgC,SAAQ,qBAAqB;IAC5E,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACpC;AAGD,MAAM,WAAW,eACf,SAAQ,qBAAqB,EAC3B,kBAAkB;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACpC;AAGD,MAAM,WAAW,oBAAqB,SAAQ,eAAe;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B"}
+{"version":3,"file":"_types.d.ts","sourceRoot":"","sources":["../../source/atomic/_types.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,UAAU,EACf,KAAK,UAAU,EAChB,MAAM,WAAW,CAAC;AAEnB,MAAM,WAAW,cAAc;IAC7B,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B;AAKD,MAAM,WAAW,kBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC;IACjC,iBAAiB,CAAC,EAAE,cAAc,CAAC;IACnC,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,KAAK,CAAC,EAAE,cAAc,CAAC;CACxB;AAGD,MAAM,WAAW,qBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC;IACjC,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B,GAAG,CAAC,EAAE,cAAc,CAAC;IACrB,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,aAAa,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B;AAGD,MAAM,WAAW,4BAA6B,SAAQ,kBAAkB;IACtE,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACpC;AAED,MAAM,WAAW,+BAAgC,SAAQ,qBAAqB;IAC5E,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACpC;AAGD,MAAM,WAAW,eACf,SAAQ,qBAAqB,EAC3B,kBAAkB;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CACpC;AAGD,MAAM,WAAW,oBAAqB,SAAQ,eAAe;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B"}

package/dist/atomic/actions/icon.d.ts

@@ -2,6 +2,6 @@ interface ActionIconProps {
     ctaIcon: HTMLElement;
     isThemeLight?: boolean;
 }
-declare const _default: ({ ctaIcon, isThemeLight }: ActionIconProps) => import('@universityofmaryland/web-builder-library').ElementModel<HTMLElement>;
-export default _default;
+export declare const createActionIcon: ({ ctaIcon, isThemeLight }: ActionIconProps) => import('@universityofmaryland/web-builder-library').ElementModel<HTMLElement>;
+export {};
 //# sourceMappingURL=icon.d.ts.map

package/dist/atomic/actions/icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../source/atomic/actions/icon.ts"],"names":[],"mappings":"AAMA,UAAU,eAAe;IACvB,OAAO,EAAE,WAAW,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;yBAEe,2BAA2B,eAAe;AAA1D,wBAqFE"}
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../source/atomic/actions/icon.ts"],"names":[],"mappings":"AAMA,UAAU,eAAe;IACvB,OAAO,EAAE,WAAW,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,gBAAgB,GAAI,2BAA2B,eAAe,kFAqF1E,CAAC"}

package/dist/atomic/actions/icon.js

@@ -1,27 +1,9 @@
-"use strict";
-const webBuilderLibrary = require("@universityofmaryland/web-builder-library");
-const token = require("@universityofmaryland/web-token-library");
-const controls = require("@universityofmaryland/web-icons-library/controls");
-const files = require("@universityofmaryland/web-icons-library/files");
-const arrows = require("@universityofmaryland/web-icons-library/arrows");
-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 icon = ({ ctaIcon, isThemeLight }) => {
+import { ElementBuilder } from "@universityofmaryland/web-builder-library";
+import * as token from "@universityofmaryland/web-token-library";
+import { external_link } from "@universityofmaryland/web-icons-library/controls";
+import { document } from "@universityofmaryland/web-icons-library/files";
+import { arrow_long } from "@universityofmaryland/web-icons-library/arrows";
+const createActionIcon = ({ ctaIcon, isThemeLight }) => {
   const href = ctaIcon.getAttribute("href");
   const message = `Open Link to ${href}`;
   const hasIcon = ctaIcon.querySelector("svg");
@@ -31,20 +13,20 @@ const icon = ({ ctaIcon, isThemeLight }) => {
     const isExternalLink = ctaIcon.getAttribute("target") === "_blank";
     const isDownloadLink = ctaIcon.getAttribute("download") === "";
     if (isExternalLink) {
-      ctaIcon.innerHTML = controls.external_link;
+      ctaIcon.innerHTML = external_link;
     }
     if (isDownloadLink) {
-      ctaIcon.innerHTML = files.document;
+      ctaIcon.innerHTML = document;
     }
     if (!isExternalLink && !isDownloadLink) {
-      ctaIcon.innerHTML = arrows.arrow_long;
+      ctaIcon.innerHTML = arrow_long;
     }
   }
-  return new webBuilderLibrary.ElementBuilder().withClassName("actions-cta-icon").withStyles({
+  return new ElementBuilder().withClassName("actions-cta-icon").withStyles({
     element: {
       position: "absolute",
-      bottom: token__namespace.spacing.sm,
-      right: token__namespace.spacing.sm,
+      bottom: token.spacing.sm,
+      right: token.spacing.sm,
       zIndex: 9999,
       ["& a"]: {
         borderRadius: "50%",
@@ -53,40 +35,42 @@ const icon = ({ ctaIcon, isThemeLight }) => {
         display: "flex",
         justifyContent: "center",
         alignItems: "center",
-        backgroundColor: token__namespace.color.white,
+        backgroundColor: token.color.white,
         transition: "background-color 0.3s ease-in-out",
         ...isThemeLight && {
-          backgroundColor: `${token__namespace.color.gray.darker}`
+          backgroundColor: `${token.color.gray.darker}`
         }
       },
       ["& a:hover, & a:focus"]: {
-        backgroundColor: `${token__namespace.color.gray.darker}`,
-        border: `1px solid ${token__namespace.color.white}`,
+        backgroundColor: `${token.color.gray.darker}`,
+        border: `1px solid ${token.color.white}`,
         ...isThemeLight && {
-          backgroundColor: `${token__namespace.color.white}`,
-          border: `1px solid ${token__namespace.color.gray.darker}`
+          backgroundColor: `${token.color.white}`,
+          border: `1px solid ${token.color.gray.darker}`
         },
         [`& svg, & path`]: {
-          fill: token__namespace.color.white,
+          fill: token.color.white,
           ...isThemeLight && {
-            fill: `${token__namespace.color.gray.darker}`
+            fill: `${token.color.gray.darker}`
           }
         }
       },
       ["& svg"]: {
         height: "15px",
         width: "15px",
-        fill: token__namespace.color.gray.darker,
+        fill: token.color.gray.darker,
         transition: "background-color 0.3s ease-in-out"
       },
       ["& svg, & path"]: {
-        fill: `${token__namespace.color.gray.darker}`,
+        fill: `${token.color.gray.darker}`,
         ...isThemeLight && {
-          fill: `${token__namespace.color.white}`
+          fill: `${token.color.white}`
         }
       }
     }
   }).withChild(ctaIcon).build();
 };
-module.exports = icon;
+export {
+  createActionIcon
+};
 //# sourceMappingURL=icon.js.map

package/dist/atomic/actions/icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.js","sources":["../../../source/atomic/actions/icon.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport { external_link as iconExternalLink } from '@universityofmaryland/web-icons-library/controls';\nimport { document as iconDocument } from '@universityofmaryland/web-icons-library/files';\nimport { arrow_long as iconArrowLong } from '@universityofmaryland/web-icons-library/arrows';\n\ninterface ActionIconProps {\n  ctaIcon: HTMLElement;\n  isThemeLight?: boolean;\n}\n\nexport default ({ ctaIcon, isThemeLight }: ActionIconProps) => {\n  const href = ctaIcon.getAttribute('href');\n  const message = `Open Link to ${href}`;\n  const hasIcon = ctaIcon.querySelector('svg');\n  const label = ctaIcon.getAttribute('aria-label') || message;\n\n  ctaIcon.setAttribute('aria-label', label);\n\n  if (!hasIcon) {\n    const isExternalLink = ctaIcon.getAttribute('target') === '_blank';\n    const isDownloadLink = ctaIcon.getAttribute('download') === '';\n\n    if (isExternalLink) {\n      ctaIcon.innerHTML = iconExternalLink;\n    }\n\n    if (isDownloadLink) {\n      ctaIcon.innerHTML = iconDocument;\n    }\n\n    if (!isExternalLink && !isDownloadLink) {\n      ctaIcon.innerHTML = iconArrowLong;\n    }\n  }\n\n  return new ElementBuilder()\n    .withClassName('actions-cta-icon')\n    .withStyles({\n      element: {\n        position: 'absolute',\n        bottom: token.spacing.sm,\n        right: token.spacing.sm,\n        zIndex: 9999,\n\n        ['& a']: {\n          borderRadius: '50%',\n          height: '40px',\n          width: '40px',\n          display: 'flex',\n          justifyContent: 'center',\n          alignItems: 'center',\n          backgroundColor: token.color.white,\n          transition: 'background-color 0.3s ease-in-out',\n\n          ...(isThemeLight && {\n            backgroundColor: `${token.color.gray.darker}`,\n          }),\n        },\n\n        ['& a:hover, & a:focus']: {\n          backgroundColor: `${token.color.gray.darker}`,\n          border: `1px solid ${token.color.white}`,\n\n          ...(isThemeLight && {\n            backgroundColor: `${token.color.white}`,\n            border: `1px solid ${token.color.gray.darker}`,\n          }),\n\n          [`& svg, & path`]: {\n            fill: token.color.white,\n\n            ...(isThemeLight && {\n              fill: `${token.color.gray.darker}`,\n            }),\n          },\n        },\n\n        ['& svg']: {\n          height: '15px',\n          width: '15px',\n          fill: token.color.gray.darker,\n          transition: 'background-color 0.3s ease-in-out',\n        },\n\n        ['& svg, & path']: {\n          fill: `${token.color.gray.darker}`,\n\n          ...(isThemeLight && {\n            fill: `${token.color.white}`,\n          }),\n        },\n      },\n    })\n    .withChild(ctaIcon)\n    .build();\n};\n"],"names":["iconExternalLink","iconDocument","iconArrowLong","ElementBuilder","token"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAA,OAAe,CAAC,EAAE,SAAS,mBAAoC;AAC7D,QAAM,OAAO,QAAQ,aAAa,MAAM;AACxC,QAAM,UAAU,gBAAgB,IAAI;AACpC,QAAM,UAAU,QAAQ,cAAc,KAAK;AAC3C,QAAM,QAAQ,QAAQ,aAAa,YAAY,KAAK;AAEpD,UAAQ,aAAa,cAAc,KAAK;AAExC,MAAI,CAAC,SAAS;AACZ,UAAM,iBAAiB,QAAQ,aAAa,QAAQ,MAAM;AAC1D,UAAM,iBAAiB,QAAQ,aAAa,UAAU,MAAM;AAE5D,QAAI,gBAAgB;AAClB,cAAQ,YAAYA,SAAAA;AAAAA,IACtB;AAEA,QAAI,gBAAgB;AAClB,cAAQ,YAAYC,MAAAA;AAAAA,IACtB;AAEA,QAAI,CAAC,kBAAkB,CAAC,gBAAgB;AACtC,cAAQ,YAAYC,OAAAA;AAAAA,IACtB;AAAA,EACF;AAEA,SAAO,IAAIC,kBAAAA,eAAA,EACR,cAAc,kBAAkB,EAChC,WAAW;AAAA,IACV,SAAS;AAAA,MACP,UAAU;AAAA,MACV,QAAQC,iBAAM,QAAQ;AAAA,MACtB,OAAOA,iBAAM,QAAQ;AAAA,MACrB,QAAQ;AAAA,MAER,CAAC,KAAK,GAAG;AAAA,QACP,cAAc;AAAA,QACd,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,YAAY;AAAA,QACZ,iBAAiBA,iBAAM,MAAM;AAAA,QAC7B,YAAY;AAAA,QAEZ,GAAI,gBAAgB;AAAA,UAClB,iBAAiB,GAAGA,iBAAM,MAAM,KAAK,MAAM;AAAA,QAAA;AAAA,MAC7C;AAAA,MAGF,CAAC,sBAAsB,GAAG;AAAA,QACxB,iBAAiB,GAAGA,iBAAM,MAAM,KAAK,MAAM;AAAA,QAC3C,QAAQ,aAAaA,iBAAM,MAAM,KAAK;AAAA,QAEtC,GAAI,gBAAgB;AAAA,UAClB,iBAAiB,GAAGA,iBAAM,MAAM,KAAK;AAAA,UACrC,QAAQ,aAAaA,iBAAM,MAAM,KAAK,MAAM;AAAA,QAAA;AAAA,QAG9C,CAAC,eAAe,GAAG;AAAA,UACjB,MAAMA,iBAAM,MAAM;AAAA,UAElB,GAAI,gBAAgB;AAAA,YAClB,MAAM,GAAGA,iBAAM,MAAM,KAAK,MAAM;AAAA,UAAA;AAAA,QAClC;AAAA,MACF;AAAA,MAGF,CAAC,OAAO,GAAG;AAAA,QACT,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,MAAMA,iBAAM,MAAM,KAAK;AAAA,QACvB,YAAY;AAAA,MAAA;AAAA,MAGd,CAAC,eAAe,GAAG;AAAA,QACjB,MAAM,GAAGA,iBAAM,MAAM,KAAK,MAAM;AAAA,QAEhC,GAAI,gBAAgB;AAAA,UAClB,MAAM,GAAGA,iBAAM,MAAM,KAAK;AAAA,QAAA;AAAA,MAC5B;AAAA,IACF;AAAA,EACF,CACD,EACA,UAAU,OAAO,EACjB,MAAA;AACL;;"}
+{"version":3,"file":"icon.js","sources":["../../../source/atomic/actions/icon.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport { external_link as iconExternalLink } from '@universityofmaryland/web-icons-library/controls';\nimport { document as iconDocument } from '@universityofmaryland/web-icons-library/files';\nimport { arrow_long as iconArrowLong } from '@universityofmaryland/web-icons-library/arrows';\n\ninterface ActionIconProps {\n  ctaIcon: HTMLElement;\n  isThemeLight?: boolean;\n}\n\nexport const createActionIcon = ({ ctaIcon, isThemeLight }: ActionIconProps) => {\n  const href = ctaIcon.getAttribute('href');\n  const message = `Open Link to ${href}`;\n  const hasIcon = ctaIcon.querySelector('svg');\n  const label = ctaIcon.getAttribute('aria-label') || message;\n\n  ctaIcon.setAttribute('aria-label', label);\n\n  if (!hasIcon) {\n    const isExternalLink = ctaIcon.getAttribute('target') === '_blank';\n    const isDownloadLink = ctaIcon.getAttribute('download') === '';\n\n    if (isExternalLink) {\n      ctaIcon.innerHTML = iconExternalLink;\n    }\n\n    if (isDownloadLink) {\n      ctaIcon.innerHTML = iconDocument;\n    }\n\n    if (!isExternalLink && !isDownloadLink) {\n      ctaIcon.innerHTML = iconArrowLong;\n    }\n  }\n\n  return new ElementBuilder()\n    .withClassName('actions-cta-icon')\n    .withStyles({\n      element: {\n        position: 'absolute',\n        bottom: token.spacing.sm,\n        right: token.spacing.sm,\n        zIndex: 9999,\n\n        ['& a']: {\n          borderRadius: '50%',\n          height: '40px',\n          width: '40px',\n          display: 'flex',\n          justifyContent: 'center',\n          alignItems: 'center',\n          backgroundColor: token.color.white,\n          transition: 'background-color 0.3s ease-in-out',\n\n          ...(isThemeLight && {\n            backgroundColor: `${token.color.gray.darker}`,\n          }),\n        },\n\n        ['& a:hover, & a:focus']: {\n          backgroundColor: `${token.color.gray.darker}`,\n          border: `1px solid ${token.color.white}`,\n\n          ...(isThemeLight && {\n            backgroundColor: `${token.color.white}`,\n            border: `1px solid ${token.color.gray.darker}`,\n          }),\n\n          [`& svg, & path`]: {\n            fill: token.color.white,\n\n            ...(isThemeLight && {\n              fill: `${token.color.gray.darker}`,\n            }),\n          },\n        },\n\n        ['& svg']: {\n          height: '15px',\n          width: '15px',\n          fill: token.color.gray.darker,\n          transition: 'background-color 0.3s ease-in-out',\n        },\n\n        ['& svg, & path']: {\n          fill: `${token.color.gray.darker}`,\n\n          ...(isThemeLight && {\n            fill: `${token.color.white}`,\n          }),\n        },\n      },\n    })\n    .withChild(ctaIcon)\n    .build();\n};\n"],"names":["iconExternalLink","iconDocument","iconArrowLong"],"mappings":";;;;;AAWO,MAAM,mBAAmB,CAAC,EAAE,SAAS,mBAAoC;AAC9E,QAAM,OAAO,QAAQ,aAAa,MAAM;AACxC,QAAM,UAAU,gBAAgB,IAAI;AACpC,QAAM,UAAU,QAAQ,cAAc,KAAK;AAC3C,QAAM,QAAQ,QAAQ,aAAa,YAAY,KAAK;AAEpD,UAAQ,aAAa,cAAc,KAAK;AAExC,MAAI,CAAC,SAAS;AACZ,UAAM,iBAAiB,QAAQ,aAAa,QAAQ,MAAM;AAC1D,UAAM,iBAAiB,QAAQ,aAAa,UAAU,MAAM;AAE5D,QAAI,gBAAgB;AAClB,cAAQ,YAAYA;AAAAA,IACtB;AAEA,QAAI,gBAAgB;AAClB,cAAQ,YAAYC;AAAAA,IACtB;AAEA,QAAI,CAAC,kBAAkB,CAAC,gBAAgB;AACtC,cAAQ,YAAYC;AAAAA,IACtB;AAAA,EACF;AAEA,SAAO,IAAI,eAAA,EACR,cAAc,kBAAkB,EAChC,WAAW;AAAA,IACV,SAAS;AAAA,MACP,UAAU;AAAA,MACV,QAAQ,MAAM,QAAQ;AAAA,MACtB,OAAO,MAAM,QAAQ;AAAA,MACrB,QAAQ;AAAA,MAER,CAAC,KAAK,GAAG;AAAA,QACP,cAAc;AAAA,QACd,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,YAAY;AAAA,QACZ,iBAAiB,MAAM,MAAM;AAAA,QAC7B,YAAY;AAAA,QAEZ,GAAI,gBAAgB;AAAA,UAClB,iBAAiB,GAAG,MAAM,MAAM,KAAK,MAAM;AAAA,QAAA;AAAA,MAC7C;AAAA,MAGF,CAAC,sBAAsB,GAAG;AAAA,QACxB,iBAAiB,GAAG,MAAM,MAAM,KAAK,MAAM;AAAA,QAC3C,QAAQ,aAAa,MAAM,MAAM,KAAK;AAAA,QAEtC,GAAI,gBAAgB;AAAA,UAClB,iBAAiB,GAAG,MAAM,MAAM,KAAK;AAAA,UACrC,QAAQ,aAAa,MAAM,MAAM,KAAK,MAAM;AAAA,QAAA;AAAA,QAG9C,CAAC,eAAe,GAAG;AAAA,UACjB,MAAM,MAAM,MAAM;AAAA,UAElB,GAAI,gBAAgB;AAAA,YAClB,MAAM,GAAG,MAAM,MAAM,KAAK,MAAM;AAAA,UAAA;AAAA,QAClC;AAAA,MACF;AAAA,MAGF,CAAC,OAAO,GAAG;AAAA,QACT,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,MAAM,MAAM,MAAM,KAAK;AAAA,QACvB,YAAY;AAAA,MAAA;AAAA,MAGd,CAAC,eAAe,GAAG;AAAA,QACjB,MAAM,GAAG,MAAM,MAAM,KAAK,MAAM;AAAA,QAEhC,GAAI,gBAAgB;AAAA,UAClB,MAAM,GAAG,MAAM,MAAM,KAAK;AAAA,QAAA;AAAA,MAC5B;AAAA,IACF;AAAA,EACF,CACD,EACA,UAAU,OAAO,EACjB,MAAA;AACL;"}

package/dist/atomic/actions/index.d.ts

@@ -1,3 +1,3 @@
 export { primary, secondary, outline, options } from './text';
-export { default as icon } from './icon';
+export { createActionIcon as icon } from './icon';
 //# sourceMappingURL=index.d.ts.map

package/dist/atomic/actions/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../source/atomic/actions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../source/atomic/actions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAC9D,OAAO,EAAE,gBAAgB,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC"}

package/dist/atomic/actions/index.js

@@ -1,10 +1,10 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const text = require("./text.js");
-const icon = require("./icon.js");
-exports.options = text.options;
-exports.outline = text.outline;
-exports.primary = text.primary;
-exports.secondary = text.secondary;
-exports.icon = icon;
+import { options, outline, primary, secondary } from "./text.js";
+import { createActionIcon } from "./icon.js";
+export {
+  createActionIcon as icon,
+  options,
+  outline,
+  primary,
+  secondary
+};
 //# sourceMappingURL=index.js.map

package/dist/atomic/actions/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/atomic/actions/text.js

@@ -1,45 +1,22 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const webBuilderLibrary = require("@universityofmaryland/web-builder-library");
-const token = require("@universityofmaryland/web-token-library");
-const elementStyles = require("@universityofmaryland/web-styles-library/element");
-const layout = require("@universityofmaryland/web-styles-library/layout");
-const animation = require("@universityofmaryland/web-styles-library/animation");
-const typography = require("@universityofmaryland/web-styles-library/typography");
-const media = require("@universityofmaryland/web-utilities-library/media");
-const dom = require("@universityofmaryland/web-utilities-library/dom");
-const controls = require("@universityofmaryland/web-icons-library/controls");
-const communication = require("@universityofmaryland/web-icons-library/communication");
-const files = require("@universityofmaryland/web-icons-library/files");
-const brand = require("@universityofmaryland/web-icons-library/brand");
-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 elementStyles__namespace = /* @__PURE__ */ _interopNamespaceDefault(elementStyles);
-const layout__namespace = /* @__PURE__ */ _interopNamespaceDefault(layout);
-const animation__namespace = /* @__PURE__ */ _interopNamespaceDefault(animation);
-const typography__namespace = /* @__PURE__ */ _interopNamespaceDefault(typography);
+import { ElementBuilder } from "@universityofmaryland/web-builder-library";
+import * as token from "@universityofmaryland/web-token-library";
+import * as elementStyles from "@universityofmaryland/web-styles-library/element";
+import * as layout from "@universityofmaryland/web-styles-library/layout";
+import * as animation from "@universityofmaryland/web-styles-library/animation";
+import * as typography from "@universityofmaryland/web-styles-library/typography";
+import { parseSvgString } from "@universityofmaryland/web-utilities-library/media";
+import { wrapTextNodeInSpan, extractIconElement } from "@universityofmaryland/web-utilities-library/dom";
+import { external_link } from "@universityofmaryland/web-icons-library/controls";
+import { email } from "@universityofmaryland/web-icons-library/communication";
+import { document } from "@universityofmaryland/web-icons-library/files";
+import { fearless } from "@universityofmaryland/web-icons-library/brand";
 const createLinkIcon = (element, type) => {
-  const existingIcon = dom.extractIconElement({ element });
+  const existingIcon = extractIconElement({ element });
   const ICONS = {
-    email: communication.email,
-    newWindow: controls.external_link,
-    document: files.document,
-    fearless: brand.fearless
+    email,
+    newWindow: external_link,
+    document,
+    fearless
   };
   if (existingIcon) {
     element.insertBefore(existingIcon, element.firstChild);
@@ -50,7 +27,7 @@ const createLinkIcon = (element, type) => {
   const isDownload = element.getAttribute("download") !== null;
   const isMail = href?.includes("mailto:");
   const insertIcon = (element2, svg) => {
-    const icon = media.parseSvgString(svg);
+    const icon = parseSvgString(svg);
     if (icon) element2.insertBefore(icon, element2.firstChild);
   };
   if (isMail) {
@@ -69,13 +46,13 @@ const createPlainText = ({
   plainText
 }) => {
   if (!plainText) return null;
-  return new webBuilderLibrary.ElementBuilder(plainText).styled(
-    typography__namespace.sans.compose("min", { theme: isThemeDark ? "dark" : "light" })
+  return new ElementBuilder(plainText).styled(
+    typography.sans.compose("min", { theme: isThemeDark ? "dark" : "light" })
   ).withStyles({
     element: {
       textDecoration: "underline",
       ...isTypeSecondary && {
-        marginLeft: `${token__namespace.spacing.lg}`,
+        marginLeft: `${token.spacing.lg}`,
         alignSelf: "baseline"
       }
     }
@@ -86,7 +63,7 @@ const createElement = (type, props) => {
   const size = props.isSizeLarge ? "large" : "normal";
   let styleObject;
   if (type === "primary") {
-    styleObject = elementStyles__namespace.action.primary.composePrimary({ size });
+    styleObject = elementStyles.action.primary.composePrimary({ size });
   } else if (type === "secondary") {
     let color = "default";
     if (props.isThemeGold) {
@@ -95,20 +72,20 @@ const createElement = (type, props) => {
       color = "white";
     }
     styleObject = {
-      ...elementStyles__namespace.action.secondary.composeSecondary({
+      ...elementStyles.action.secondary.composeSecondary({
         size,
         color
       }),
-      ...animation__namespace.line.slideUnderRed
+      ...animation.line.slideUnderRed
     };
   } else if (type === "outline") {
     const color = props.isThemeDark ? "white" : "default";
-    styleObject = elementStyles__namespace.action.outline.composeOutline({ size, color });
+    styleObject = elementStyles.action.outline.composeOutline({ size, color });
   }
-  const element = new webBuilderLibrary.ElementBuilder(props.element).styled(styleObject).withStylesIf(!!props.elementStyles, props.elementStyles || {});
+  const element = new ElementBuilder(props.element).styled(styleObject).withStylesIf(!!props.elementStyles, props.elementStyles || {});
   if (type === "secondary") {
     element.withModifier((el) => {
-      dom.wrapTextNodeInSpan(el);
+      wrapTextNodeInSpan(el);
     });
   }
   return element.build();
@@ -129,10 +106,10 @@ const options = (props) => {
   if (plainText) {
     const plainTextElement = createPlainText(props);
     if (plainTextElement) {
-      return new webBuilderLibrary.ElementBuilder().styled(layout__namespace.grid.stacked).withStyles({
+      return new ElementBuilder().styled(layout.grid.stacked).withStyles({
         element: {
           display: "grid",
-          gap: token__namespace.spacing.sm,
+          gap: token.spacing.sm,
           ["& > *"]: {
             marginBottom: "0 !important",
             ...!isTypeSecondary && { justifySelf: "center" }
@@ -141,10 +118,12 @@ const options = (props) => {
       }).withChild(actionModel).withChild(plainTextElement).build();
     }
   }
-  return new webBuilderLibrary.ElementBuilder().withChild(actionModel).build();
+  return new ElementBuilder().withChild(actionModel).build();
+};
+export {
+  options,
+  outline,
+  primary,
+  secondary
 };
-exports.options = options;
-exports.outline = outline;
-exports.primary = primary;
-exports.secondary = secondary;
 //# sourceMappingURL=text.js.map

package/dist/atomic/actions/text.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.js","sources":["../../../source/atomic/actions/text.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport * as elementStyles from '@universityofmaryland/web-styles-library/element';\nimport * as layoutStyles from '@universityofmaryland/web-styles-library/layout';\nimport * as animation from '@universityofmaryland/web-styles-library/animation';\nimport * as typography from '@universityofmaryland/web-styles-library/typography';\nimport { parseSvgString } from '@universityofmaryland/web-utilities-library/media';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport {\n  extractIconElement,\n  wrapTextNodeInSpan,\n} from '@universityofmaryland/web-utilities-library/dom';\nimport { external_link as iconExternalLink } from '@universityofmaryland/web-icons-library/controls';\nimport { email as iconEmail } from '@universityofmaryland/web-icons-library/communication';\nimport { document as iconDocument } from '@universityofmaryland/web-icons-library/files';\nimport { fearless as iconFearless } from '@universityofmaryland/web-icons-library/brand';\n\ninterface ElementProps {\n  element: HTMLElement;\n  isThemeDark?: boolean;\n  isThemeGold?: boolean;\n  isSizeLarge?: boolean;\n  elementStyles?: Record<string, any>;\n}\n\ninterface OptionProps extends ElementProps {\n  isTypePrimary?: boolean;\n  isTypeSecondary?: boolean;\n  isTypeOutline?: boolean;\n  plainText?: HTMLElement | null;\n}\n\ntype ElementType = 'primary' | 'secondary' | 'outline';\ntype IconType = 'email' | 'newWindow' | 'document' | 'fearless';\n\nconst createLinkIcon = (element: HTMLElement, type: ElementType): void => {\n  const existingIcon = extractIconElement({ element });\n  const ICONS: Record<IconType, string> = {\n    email: iconEmail,\n    newWindow: iconExternalLink,\n    document: iconDocument,\n    fearless: iconFearless,\n  };\n\n  if (existingIcon) {\n    element.insertBefore(existingIcon, element.firstChild);\n    return;\n  }\n\n  const href = element.getAttribute('href');\n  const isExternalTab = element.getAttribute('target') === '_blank';\n  const isDownload = element.getAttribute('download') !== null;\n  const isMail = href?.includes('mailto:');\n  const insertIcon = (element: HTMLElement, svg: string): void => {\n    const icon = parseSvgString(svg);\n    if (icon) element.insertBefore(icon, element.firstChild);\n  };\n\n  if (isMail) {\n    insertIcon(element, ICONS.email);\n  } else if (isExternalTab) {\n    insertIcon(element, ICONS.newWindow);\n  } else if (isDownload) {\n    insertIcon(element, ICONS.document);\n  } else if (type === 'secondary') {\n    insertIcon(element, ICONS.fearless);\n  }\n};\n\nconst createPlainText = ({\n  isThemeDark,\n  isTypeSecondary,\n  plainText,\n}: Pick<OptionProps, 'isThemeDark' | 'isTypeSecondary' | 'plainText'>) => {\n  if (!plainText) return null;\n\n  return new ElementBuilder(plainText)\n    .styled(\n      typography.sans.compose('min', { theme: isThemeDark ? 'dark' : 'light' }),\n    )\n    .withStyles({\n      element: {\n        textDecoration: 'underline',\n\n        ...(isTypeSecondary && {\n          marginLeft: `${token.spacing.lg}`,\n          alignSelf: 'baseline',\n        }),\n      },\n    })\n    .build();\n};\n\nconst createElement = (type: ElementType, props: ElementProps) => {\n  createLinkIcon(props.element, type);\n\n  const size = props.isSizeLarge ? 'large' : 'normal';\n  let styleObject;\n\n  if (type === 'primary') {\n    styleObject = elementStyles.action.primary.composePrimary({ size });\n  } else if (type === 'secondary') {\n    let color: 'default' | 'white' | 'gold' = 'default';\n    if (props.isThemeGold) {\n      color = 'gold';\n    } else if (props.isThemeDark) {\n      color = 'white';\n    }\n    styleObject = {\n      ...elementStyles.action.secondary.composeSecondary({\n        size,\n        color,\n      }),\n      ...animation.line.slideUnderRed,\n    };\n  } else if (type === 'outline') {\n    const color = props.isThemeDark ? 'white' : 'default';\n    styleObject = elementStyles.action.outline.composeOutline({ size, color });\n  }\n\n  const element = new ElementBuilder(props.element)\n    .styled(styleObject!)\n    .withStylesIf(!!props.elementStyles, props.elementStyles || {});\n\n  if (type === 'secondary') {\n    element.withModifier((el) => {\n      wrapTextNodeInSpan(el);\n    });\n  }\n\n  return element.build();\n};\n\nexport const primary = (props: ElementProps) => createElement('primary', props);\nexport const secondary = (props: ElementProps) =>\n  createElement('secondary', props);\nexport const outline = (props: ElementProps) => createElement('outline', props);\n\nexport const options = (props: OptionProps) => {\n  const { plainText, isTypePrimary, isTypeSecondary, isTypeOutline } = props;\n\n  let actionModel;\n\n  if (isTypePrimary) {\n    actionModel = primary(props);\n  } else if (isTypeSecondary) {\n    actionModel = secondary(props);\n  } else if (isTypeOutline) {\n    actionModel = outline(props);\n  }\n\n  if (plainText) {\n    const plainTextElement = createPlainText(props);\n\n    if (plainTextElement) {\n      return new ElementBuilder()\n        .styled(layoutStyles.grid.stacked)\n        .withStyles({\n          element: {\n            display: 'grid',\n            gap: token.spacing.sm,\n\n            ['& > *']: {\n              marginBottom: '0 !important',\n              ...(!isTypeSecondary && { justifySelf: 'center' }),\n            },\n          },\n        })\n        .withChild(actionModel)\n        .withChild(plainTextElement)\n        .build();\n    }\n  }\n\n  return new ElementBuilder().withChild(actionModel).build();\n};\n"],"names":["extractIconElement","iconEmail","iconExternalLink","iconDocument","iconFearless","element","parseSvgString","ElementBuilder","typography","token","elementStyles","animation","wrapTextNodeInSpan","layoutStyles"],"mappings":"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"}
+{"version":3,"file":"text.js","sources":["../../../source/atomic/actions/text.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport * as elementStyles from '@universityofmaryland/web-styles-library/element';\nimport * as layoutStyles from '@universityofmaryland/web-styles-library/layout';\nimport * as animation from '@universityofmaryland/web-styles-library/animation';\nimport * as typography from '@universityofmaryland/web-styles-library/typography';\nimport { parseSvgString } from '@universityofmaryland/web-utilities-library/media';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport {\n  extractIconElement,\n  wrapTextNodeInSpan,\n} from '@universityofmaryland/web-utilities-library/dom';\nimport { external_link as iconExternalLink } from '@universityofmaryland/web-icons-library/controls';\nimport { email as iconEmail } from '@universityofmaryland/web-icons-library/communication';\nimport { document as iconDocument } from '@universityofmaryland/web-icons-library/files';\nimport { fearless as iconFearless } from '@universityofmaryland/web-icons-library/brand';\n\ninterface ElementProps {\n  element: HTMLElement;\n  isThemeDark?: boolean;\n  isThemeGold?: boolean;\n  isSizeLarge?: boolean;\n  elementStyles?: Record<string, any>;\n}\n\ninterface OptionProps extends ElementProps {\n  isTypePrimary?: boolean;\n  isTypeSecondary?: boolean;\n  isTypeOutline?: boolean;\n  plainText?: HTMLElement | null;\n}\n\ntype ElementType = 'primary' | 'secondary' | 'outline';\ntype IconType = 'email' | 'newWindow' | 'document' | 'fearless';\n\nconst createLinkIcon = (element: HTMLElement, type: ElementType): void => {\n  const existingIcon = extractIconElement({ element });\n  const ICONS: Record<IconType, string> = {\n    email: iconEmail,\n    newWindow: iconExternalLink,\n    document: iconDocument,\n    fearless: iconFearless,\n  };\n\n  if (existingIcon) {\n    element.insertBefore(existingIcon, element.firstChild);\n    return;\n  }\n\n  const href = element.getAttribute('href');\n  const isExternalTab = element.getAttribute('target') === '_blank';\n  const isDownload = element.getAttribute('download') !== null;\n  const isMail = href?.includes('mailto:');\n  const insertIcon = (element: HTMLElement, svg: string): void => {\n    const icon = parseSvgString(svg);\n    if (icon) element.insertBefore(icon, element.firstChild);\n  };\n\n  if (isMail) {\n    insertIcon(element, ICONS.email);\n  } else if (isExternalTab) {\n    insertIcon(element, ICONS.newWindow);\n  } else if (isDownload) {\n    insertIcon(element, ICONS.document);\n  } else if (type === 'secondary') {\n    insertIcon(element, ICONS.fearless);\n  }\n};\n\nconst createPlainText = ({\n  isThemeDark,\n  isTypeSecondary,\n  plainText,\n}: Pick<OptionProps, 'isThemeDark' | 'isTypeSecondary' | 'plainText'>) => {\n  if (!plainText) return null;\n\n  return new ElementBuilder(plainText)\n    .styled(\n      typography.sans.compose('min', { theme: isThemeDark ? 'dark' : 'light' }),\n    )\n    .withStyles({\n      element: {\n        textDecoration: 'underline',\n\n        ...(isTypeSecondary && {\n          marginLeft: `${token.spacing.lg}`,\n          alignSelf: 'baseline',\n        }),\n      },\n    })\n    .build();\n};\n\nconst createElement = (type: ElementType, props: ElementProps) => {\n  createLinkIcon(props.element, type);\n\n  const size = props.isSizeLarge ? 'large' : 'normal';\n  let styleObject;\n\n  if (type === 'primary') {\n    styleObject = elementStyles.action.primary.composePrimary({ size });\n  } else if (type === 'secondary') {\n    let color: 'default' | 'white' | 'gold' = 'default';\n    if (props.isThemeGold) {\n      color = 'gold';\n    } else if (props.isThemeDark) {\n      color = 'white';\n    }\n    styleObject = {\n      ...elementStyles.action.secondary.composeSecondary({\n        size,\n        color,\n      }),\n      ...animation.line.slideUnderRed,\n    };\n  } else if (type === 'outline') {\n    const color = props.isThemeDark ? 'white' : 'default';\n    styleObject = elementStyles.action.outline.composeOutline({ size, color });\n  }\n\n  const element = new ElementBuilder(props.element)\n    .styled(styleObject!)\n    .withStylesIf(!!props.elementStyles, props.elementStyles || {});\n\n  if (type === 'secondary') {\n    element.withModifier((el) => {\n      wrapTextNodeInSpan(el);\n    });\n  }\n\n  return element.build();\n};\n\nexport const primary = (props: ElementProps) => createElement('primary', props);\nexport const secondary = (props: ElementProps) =>\n  createElement('secondary', props);\nexport const outline = (props: ElementProps) => createElement('outline', props);\n\nexport const options = (props: OptionProps) => {\n  const { plainText, isTypePrimary, isTypeSecondary, isTypeOutline } = props;\n\n  let actionModel;\n\n  if (isTypePrimary) {\n    actionModel = primary(props);\n  } else if (isTypeSecondary) {\n    actionModel = secondary(props);\n  } else if (isTypeOutline) {\n    actionModel = outline(props);\n  }\n\n  if (plainText) {\n    const plainTextElement = createPlainText(props);\n\n    if (plainTextElement) {\n      return new ElementBuilder()\n        .styled(layoutStyles.grid.stacked)\n        .withStyles({\n          element: {\n            display: 'grid',\n            gap: token.spacing.sm,\n\n            ['& > *']: {\n              marginBottom: '0 !important',\n              ...(!isTypeSecondary && { justifySelf: 'center' }),\n            },\n          },\n        })\n        .withChild(actionModel)\n        .withChild(plainTextElement)\n        .build();\n    }\n  }\n\n  return new ElementBuilder().withChild(actionModel).build();\n};\n"],"names":["iconExternalLink","element","layoutStyles"],"mappings":"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"}

package/dist/atomic/animations/actions/index.d.ts

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

package/dist/atomic/animations/actions/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../source/atomic/animations/actions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../source/atomic/animations/actions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC"}

package/dist/atomic/animations/actions/index.js

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

package/dist/atomic/animations/actions/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/atomic/animations/actions/indicator.d.ts

@@ -1,4 +1,4 @@
-declare const _default: ({ count, overlayColor, isThemeDark, isThemeLight, callback, }: {
+export declare const createAnimationIndicator: ({ count, overlayColor, isThemeDark, isThemeLight, callback, }: {
     count: number;
     overlayColor?: string;
     isThemeDark?: boolean;
@@ -10,5 +10,4 @@ declare const _default: ({ count, overlayColor, isThemeDark, isThemeLight, callb
     styles: string;
     position: (index: number) => void;
 };
-export default _default;
 //# sourceMappingURL=indicator.d.ts.map

package/dist/atomic/animations/actions/indicator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"indicator.d.ts","sourceRoot":"","sources":["../../../../source/atomic/animations/actions/indicator.ts"],"names":[],"mappings":"yBAiEgB,+DAMb;IACD,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC;;;;sBAyCiC,MAAM;;AArDxC,wBAiHO"}
+{"version":3,"file":"indicator.d.ts","sourceRoot":"","sources":["../../../../source/atomic/animations/actions/indicator.ts"],"names":[],"mappings":"AAiEA,eAAO,MAAM,wBAAwB,GAAI,+DAMtC;IACD,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC;;;;sBAyCiC,MAAM;CA4DlC,CAAC"}

package/dist/atomic/animations/actions/indicator.js

@@ -1,23 +1,5 @@
-"use strict";
-const token = require("@universityofmaryland/web-token-library");
-const performance = require("@universityofmaryland/web-utilities-library/performance");
-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);
+import * as token from "@universityofmaryland/web-token-library";
+import { debounce } from "@universityofmaryland/web-utilities-library/performance";
 const ELEMENT_SLIDE_INDICATOR_CONTAINER = "slide-indicator-container";
 const ELEMENT_SLIDE_INDICATOR_LINE = "slide-indicator-line";
 const ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER = "slide-indicator-button-wrapper";
@@ -29,7 +11,7 @@ const LineStyles = `
     height: 24px;
     width: 80px;
     transition: left 500ms;
-    background-color: ${token__namespace.color.red};
+    background-color: ${token.color.red};
     z-index: 99;
   }
 `;
@@ -37,7 +19,7 @@ const ButtonStyles = `
   .${ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER} {
     width: 80px;
     height: 100%;
-    background-color: ${token__namespace.color.gray.light};
+    background-color: ${token.color.gray.light};
     position: relative;
   }
 
@@ -48,7 +30,7 @@ const ButtonStyles = `
     width: 100%;
     height: 22px;
     display: block;
-    background-color: ${token__namespace.color.gray.lightest};
+    background-color: ${token.color.gray.lightest};
     z-index: 99;
   }
 `;
@@ -64,7 +46,7 @@ const STYLES_INDICATOR = `
 
   .${ELEMENT_SLIDE_INDICATOR_CONTAINER} > span {
     display: block;
-    width: ${token__namespace.spacing.sm};
+    width: ${token.spacing.sm};
     height:  22px;
     z-index: 999;
     position: relative;
@@ -74,7 +56,7 @@ const STYLES_INDICATOR = `
   ${ButtonStyles}
 
 `;
-const indicator = ({
+const createAnimationIndicator = ({
   count,
   overlayColor,
   isThemeDark,
@@ -138,12 +120,12 @@ const indicator = ({
   buttons.forEach((button) => {
     const spacer = document.createElement("span");
     const overlay = document.createElement("span");
-    let spacerColor = token__namespace.color.white;
+    let spacerColor = token.color.white;
     if (isThemeDark && !overlayColor) {
-      spacerColor = token__namespace.color.black;
+      spacerColor = token.color.black;
     }
     if (isThemeLight && !overlayColor) {
-      spacerColor = token__namespace.color.gray.lightest;
+      spacerColor = token.color.gray.lightest;
     }
     spacer.style.backgroundColor = spacerColor;
     overlay.style.backgroundColor = spacerColor;
@@ -152,7 +134,7 @@ const indicator = ({
     container.appendChild(spacer);
   });
   load();
-  window.addEventListener("resize", performance.debounce(eventResize, 20));
+  window.addEventListener("resize", debounce(eventResize, 20));
   return {
     element: container,
     className: ELEMENT_SLIDE_INDICATOR_CONTAINER,
@@ -160,5 +142,7 @@ const indicator = ({
     position: eventPosition
   };
 })();
-module.exports = indicator;
+export {
+  createAnimationIndicator
+};
 //# sourceMappingURL=indicator.js.map

package/dist/atomic/animations/actions/indicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"indicator.js","sources":["../../../../source/atomic/animations/actions/indicator.ts"],"sourcesContent":["import * as token from '@universityofmaryland/web-token-library';\nimport { debounce } from '@universityofmaryland/web-utilities-library/performance';\n\nconst ELEMENT_SLIDE_INDICATOR_CONTAINER = 'slide-indicator-container';\nconst ELEMENT_SLIDE_INDICATOR_LINE = 'slide-indicator-line';\nconst ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER = 'slide-indicator-button-wrapper';\n\n// prettier-ignore\nconst LineStyles = `\n  .${ELEMENT_SLIDE_INDICATOR_LINE} {\n    position: absolute;\n    left: 0;\n    top: 0;\n    height: 24px;\n    width: 80px;\n    transition: left 500ms;\n    background-color: ${token.color.red};\n    z-index: 99;\n  }\n`\n\n// prettier-ignore\nconst ButtonStyles = `\n  .${ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER} {\n    width: 80px;\n    height: 100%;\n    background-color: ${token.color.gray.light};\n    position: relative;\n  }\n\n  .${ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER} > span {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 22px;\n    display: block;\n    background-color: ${token.color.gray.lightest};\n    z-index: 99;\n  }\n`\n\nconst STYLES_INDICATOR = `\n  .${ELEMENT_SLIDE_INDICATOR_CONTAINER} {\n    position: relative;\n    height: 24px;\n    display: flex;\n    align-items: flex-start;\n    max-width: 100%;\n    overflow: hidden;\n  }\n\n  .${ELEMENT_SLIDE_INDICATOR_CONTAINER} > span {\n    display: block;\n    width: ${token.spacing.sm};\n    height:  22px;\n    z-index: 999;\n    position: relative;\n  }\n  \n  ${LineStyles}\n  ${ButtonStyles}\n\n`;\n\nexport default ({\n  count,\n  overlayColor,\n  isThemeDark,\n  isThemeLight,\n  callback,\n}: {\n  count: number;\n  overlayColor?: string;\n  isThemeDark?: boolean;\n  isThemeLight?: boolean;\n  callback: (arg: number) => void;\n}) =>\n  (() => {\n    const container = document.createElement('div');\n    const line = document.createElement('div');\n    let styles = STYLES_INDICATOR;\n\n    const buttons = Array.from({ length: count }).map((count, i) => {\n      const button = document.createElement('button');\n\n      button.classList.add(ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER);\n      button.addEventListener('click', () => callback(i));\n      button.setAttribute('aria-label', `Slide ${i + 1}`);\n\n      return button;\n    });\n\n    const positionLine = (index: number) => {\n      const button = buttons[index];\n      const buttonSize = button.clientWidth;\n      const buttonPosition = button.offsetLeft;\n\n      line.style.width = `${buttonSize}px`;\n      line.style.left = `${buttonPosition}px`;\n    };\n    const sizeButtons = () => {\n      const maxWidth = 80;\n      const containerSize = container.clientWidth;\n      let buttonSize = containerSize / count;\n\n      if (buttonSize > maxWidth) buttonSize = maxWidth;\n\n      buttons.forEach((button) => {\n        button.style.width = `${buttonSize}px`;\n      });\n    };\n\n    const eventResize = () => {\n      sizeButtons();\n      positionLine(position);\n    };\n\n    const eventPosition = (index: number) => {\n      positionLine(index);\n      position = index;\n    };\n\n    const load = () => {\n      const reload = () => {\n        setTimeout(() => {\n          const isLoaded = container.clientWidth > 0;\n          if (!isLoaded) {\n            reload();\n          } else {\n            sizeButtons();\n            positionLine(position);\n            line.style.display = 'block';\n          }\n        }, 500);\n      };\n\n      line.style.display = 'none';\n      reload();\n    };\n\n    let position = 0;\n\n    line.classList.add(ELEMENT_SLIDE_INDICATOR_LINE);\n\n    container.classList.add(ELEMENT_SLIDE_INDICATOR_CONTAINER);\n    container.appendChild(line);\n    buttons.forEach((button) => {\n      const spacer = document.createElement('span');\n      const overlay = document.createElement('span');\n      let spacerColor: string = token.color.white;\n\n      if (isThemeDark && !overlayColor) {\n        spacerColor = token.color.black;\n      }\n\n      if (isThemeLight && !overlayColor) {\n        spacerColor = token.color.gray.lightest;\n      }\n\n      spacer.style.backgroundColor = spacerColor;\n      overlay.style.backgroundColor = spacerColor;\n\n      button.appendChild(overlay);\n      container.appendChild(button);\n      container.appendChild(spacer);\n    });\n\n    load();\n\n    window.addEventListener('resize', debounce(eventResize, 20));\n\n    return {\n      element: container,\n      className: ELEMENT_SLIDE_INDICATOR_CONTAINER,\n      styles,\n      position: eventPosition,\n    };\n  })();\n"],"names":["token","count","debounce"],"mappings":"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"}
+{"version":3,"file":"indicator.js","sources":["../../../../source/atomic/animations/actions/indicator.ts"],"sourcesContent":["import * as token from '@universityofmaryland/web-token-library';\nimport { debounce } from '@universityofmaryland/web-utilities-library/performance';\n\nconst ELEMENT_SLIDE_INDICATOR_CONTAINER = 'slide-indicator-container';\nconst ELEMENT_SLIDE_INDICATOR_LINE = 'slide-indicator-line';\nconst ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER = 'slide-indicator-button-wrapper';\n\n// prettier-ignore\nconst LineStyles = `\n  .${ELEMENT_SLIDE_INDICATOR_LINE} {\n    position: absolute;\n    left: 0;\n    top: 0;\n    height: 24px;\n    width: 80px;\n    transition: left 500ms;\n    background-color: ${token.color.red};\n    z-index: 99;\n  }\n`\n\n// prettier-ignore\nconst ButtonStyles = `\n  .${ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER} {\n    width: 80px;\n    height: 100%;\n    background-color: ${token.color.gray.light};\n    position: relative;\n  }\n\n  .${ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER} > span {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 22px;\n    display: block;\n    background-color: ${token.color.gray.lightest};\n    z-index: 99;\n  }\n`\n\nconst STYLES_INDICATOR = `\n  .${ELEMENT_SLIDE_INDICATOR_CONTAINER} {\n    position: relative;\n    height: 24px;\n    display: flex;\n    align-items: flex-start;\n    max-width: 100%;\n    overflow: hidden;\n  }\n\n  .${ELEMENT_SLIDE_INDICATOR_CONTAINER} > span {\n    display: block;\n    width: ${token.spacing.sm};\n    height:  22px;\n    z-index: 999;\n    position: relative;\n  }\n  \n  ${LineStyles}\n  ${ButtonStyles}\n\n`;\n\nexport const createAnimationIndicator = ({\n  count,\n  overlayColor,\n  isThemeDark,\n  isThemeLight,\n  callback,\n}: {\n  count: number;\n  overlayColor?: string;\n  isThemeDark?: boolean;\n  isThemeLight?: boolean;\n  callback: (arg: number) => void;\n}) =>\n  (() => {\n    const container = document.createElement('div');\n    const line = document.createElement('div');\n    let styles = STYLES_INDICATOR;\n\n    const buttons = Array.from({ length: count }).map((count, i) => {\n      const button = document.createElement('button');\n\n      button.classList.add(ELEMENT_SLIDE_INDICATOR_BUTTON_WRAPPER);\n      button.addEventListener('click', () => callback(i));\n      button.setAttribute('aria-label', `Slide ${i + 1}`);\n\n      return button;\n    });\n\n    const positionLine = (index: number) => {\n      const button = buttons[index];\n      const buttonSize = button.clientWidth;\n      const buttonPosition = button.offsetLeft;\n\n      line.style.width = `${buttonSize}px`;\n      line.style.left = `${buttonPosition}px`;\n    };\n    const sizeButtons = () => {\n      const maxWidth = 80;\n      const containerSize = container.clientWidth;\n      let buttonSize = containerSize / count;\n\n      if (buttonSize > maxWidth) buttonSize = maxWidth;\n\n      buttons.forEach((button) => {\n        button.style.width = `${buttonSize}px`;\n      });\n    };\n\n    const eventResize = () => {\n      sizeButtons();\n      positionLine(position);\n    };\n\n    const eventPosition = (index: number) => {\n      positionLine(index);\n      position = index;\n    };\n\n    const load = () => {\n      const reload = () => {\n        setTimeout(() => {\n          const isLoaded = container.clientWidth > 0;\n          if (!isLoaded) {\n            reload();\n          } else {\n            sizeButtons();\n            positionLine(position);\n            line.style.display = 'block';\n          }\n        }, 500);\n      };\n\n      line.style.display = 'none';\n      reload();\n    };\n\n    let position = 0;\n\n    line.classList.add(ELEMENT_SLIDE_INDICATOR_LINE);\n\n    container.classList.add(ELEMENT_SLIDE_INDICATOR_CONTAINER);\n    container.appendChild(line);\n    buttons.forEach((button) => {\n      const spacer = document.createElement('span');\n      const overlay = document.createElement('span');\n      let spacerColor: string = token.color.white;\n\n      if (isThemeDark && !overlayColor) {\n        spacerColor = token.color.black;\n      }\n\n      if (isThemeLight && !overlayColor) {\n        spacerColor = token.color.gray.lightest;\n      }\n\n      spacer.style.backgroundColor = spacerColor;\n      overlay.style.backgroundColor = spacerColor;\n\n      button.appendChild(overlay);\n      container.appendChild(button);\n      container.appendChild(spacer);\n    });\n\n    load();\n\n    window.addEventListener('resize', debounce(eventResize, 20));\n\n    return {\n      element: container,\n      className: ELEMENT_SLIDE_INDICATOR_CONTAINER,\n      styles,\n      position: eventPosition,\n    };\n  })();\n"],"names":["count"],"mappings":"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"}

package/dist/atomic/animations/brand/card-stack.d.ts

@@ -3,7 +3,7 @@ interface CardStackProps {
     images: HTMLImageElement[];
     isExpandFeature: boolean;
 }
-declare const _default: (props: CardStackProps) => {
+export declare const createAnimationCardStack: (props: CardStackProps) => {
     events: {
         loadAnimation: () => Promise<void>;
     };
@@ -12,5 +12,5 @@ declare const _default: (props: CardStackProps) => {
     update?: (props: Partial<import('@universityofmaryland/web-builder-library').BuilderOptions>) => void;
     destroy?: () => void;
 };
-export default _default;
+export {};
 //# sourceMappingURL=card-stack.d.ts.map