@x15ventures/x15-ui-library 3.18.0 → 3.20.0

package/dist/esm/components/design/card/cardHeader/CardHeaderItem.js

@@ -2,6 +2,7 @@
 
 import React from 'react';
 import { renderIcon } from '../../../../helpers/iconHelpers';
+import { getSafeLinkHref } from '../../../../helpers/urlHelpers';
 import { LogoLink } from '../../logos/LogoLink';
 import { OwnerDetailsPopup } from '../../ownerDetailsPopup/OwnerDetailsPopup';
 import { SimpleButton } from '../../../form/buttons/SimpleButton';
@@ -15,19 +16,25 @@ export const CardHeaderItem = ({
   hideTitle = false,
   url,
   actionButton
-}) => /*#__PURE__*/React.createElement("div", {
-  className: "cardHeaderItem",
-  title: title
-}, url ? /*#__PURE__*/React.createElement("a", {
-  className: "cardHeaderItemLink",
-  href: url
-}, renderIcon(icon), logo && /*#__PURE__*/React.createElement(LogoLink, logo), graphic && /*#__PURE__*/React.createElement("img", {
-  src: graphic.imageUrl,
-  className: "logoImage",
-  alt: `${graphic.label}`
-}), /*#__PURE__*/React.createElement("span", {
-  className: hideTitle ? 'sr-only' : 'cardHeaderItemTitle'
-}, content || title)) : content, owner && /*#__PURE__*/React.createElement(OwnerDetailsPopup, {
-  owner: owner
-}), actionButton && /*#__PURE__*/React.createElement(SimpleButton, actionButton));
+}) => {
+  const safeUrl = url ? getSafeLinkHref(url) : undefined;
+  const headerContent = /*#__PURE__*/React.createElement(React.Fragment, null, renderIcon(icon), logo && /*#__PURE__*/React.createElement(LogoLink, logo), graphic && /*#__PURE__*/React.createElement("img", {
+    src: graphic.imageUrl,
+    className: "logoImage",
+    alt: `${graphic.label}`
+  }), /*#__PURE__*/React.createElement("span", {
+    className: hideTitle ? 'sr-only' : 'cardHeaderItemTitle'
+  }, content || title));
+  return /*#__PURE__*/React.createElement("div", {
+    className: "cardHeaderItem",
+    title: title
+  }, safeUrl ? /*#__PURE__*/React.createElement("a", {
+    className: "cardHeaderItemLink",
+    href: safeUrl
+  }, headerContent) : url ? /*#__PURE__*/React.createElement("span", {
+    className: "cardHeaderItemLink"
+  }, headerContent) : content, owner && /*#__PURE__*/React.createElement(OwnerDetailsPopup, {
+    owner: owner
+  }), actionButton && /*#__PURE__*/React.createElement(SimpleButton, actionButton));
+};
 //# sourceMappingURL=CardHeaderItem.js.map

package/dist/esm/components/design/card/cardHeader/CardHeaderItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeaderItem.js","names":["React","renderIcon","LogoLink","OwnerDetailsPopup","SimpleButton","CardHeaderItem","icon","logo","graphic","owner","title","content","hideTitle","url","actionButton","createElement","className","href","src","imageUrl","alt","label"],"sources":["../../../../../../src/components/design/card/cardHeader/CardHeaderItem.tsx"],"sourcesContent":["'use client';\n\nimport React, { ReactElement, ReactNode } from 'react';\nimport { IconSource, renderIcon } from '../../../../helpers/iconHelpers';\nimport { LogoLink, LogoLinkProps } from '../../logos/LogoLink';\nimport { OwnerDetailsPopup } from '../../ownerDetailsPopup/OwnerDetailsPopup';\nimport { ButtonProps } from '../../../form/buttons/button.interface';\nimport { SimpleButton } from '../../../form/buttons/SimpleButton';\n\nexport interface CardHeaderItemProps {\n  icon?: IconSource;\n  logo?: LogoLinkProps;\n  graphic?: {\n    imageUrl: string;\n    label: string;\n  },\n  owner?: {\n    name: string;\n    email?: string;\n    phone?: string;\n  },\n  title?: string;\n  content?: ReactNode | ReactElement;\n  hideTitle?: boolean;\n  url?: string;\n  actionButton?: ButtonProps;\n}\n\nexport const CardHeaderItem: React.FC<CardHeaderItemProps> = (\n  {\n    icon,\n    logo,\n    graphic,\n    owner,\n    title,\n    content,\n    hideTitle = false,\n    url,\n    actionButton\n  }\n) => (\n  <div className=\"cardHeaderItem\" title={ title }>\n    {\n      url\n        ? (\n          <a className=\"cardHeaderItemLink\" href={ url }>\n            { renderIcon(icon) }\n\n            { logo && <LogoLink { ...logo } /> }\n\n            { graphic && <img src={ graphic.imageUrl } className=\"logoImage\" alt={ `${ graphic.label }` } /> }\n\n            <span className={ hideTitle ? 'sr-only' : 'cardHeaderItemTitle' }>{ content || title }</span>\n          </a>\n        )\n        : content\n    }\n\n    {\n      owner && <OwnerDetailsPopup owner={ owner } />\n    }\n\n    {\n      actionButton && <SimpleButton { ...actionButton } />\n    }\n  </div>\n);\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,MAAmC,OAAO;AACtD,SAAqBC,UAAU,QAAQ,iCAAiC;AACxE,SAASC,QAAQ,QAAuB,sBAAsB;AAC9D,SAASC,iBAAiB,QAAQ,2CAA2C;AAE7E,SAASC,YAAY,QAAQ,oCAAoC;AAqBjE,OAAO,MAAMC,cAA6C,GAAGA,CAC3D;EACEC,IAAI;EACJC,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,SAAS,GAAG,KAAK;EACjBC,GAAG;EACHC;AACF,CAAC,kBAEDd,KAAA,CAAAe,aAAA;EAAKC,SAAS,EAAC,gBAAgB;EAACN,KAAK,EAAGA;AAAO,GAE3CG,GAAG,gBAECb,KAAA,CAAAe,aAAA;EAAGC,SAAS,EAAC,oBAAoB;EAACC,IAAI,EAAGJ;AAAK,GAC1CZ,UAAU,CAACK,IAAI,CAAC,EAEhBC,IAAI,iBAAIP,KAAA,CAAAe,aAAA,CAACb,QAAQ,EAAMK,IAAQ,CAAC,EAEhCC,OAAO,iBAAIR,KAAA,CAAAe,aAAA;EAAKG,GAAG,EAAGV,OAAO,CAACW,QAAU;EAACH,SAAS,EAAC,WAAW;EAACI,GAAG,EAAG,GAAIZ,OAAO,CAACa,KAAK;AAAK,CAAE,CAAC,eAEhGrB,KAAA,CAAAe,aAAA;EAAMC,SAAS,EAAGJ,SAAS,GAAG,SAAS,GAAG;AAAuB,GAAGD,OAAO,IAAID,KAAa,CAC3F,CAAC,GAEJC,OAAO,EAIXF,KAAK,iBAAIT,KAAA,CAAAe,aAAA,CAACZ,iBAAiB;EAACM,KAAK,EAAGA;AAAO,CAAE,CAAC,EAI9CK,YAAY,iBAAId,KAAA,CAAAe,aAAA,CAACX,YAAY,EAAMU,YAAgB,CAElD,CACN","ignoreList":[]}
+{"version":3,"file":"CardHeaderItem.js","names":["React","renderIcon","getSafeLinkHref","LogoLink","OwnerDetailsPopup","SimpleButton","CardHeaderItem","icon","logo","graphic","owner","title","content","hideTitle","url","actionButton","safeUrl","undefined","headerContent","createElement","Fragment","src","imageUrl","className","alt","label","href"],"sources":["../../../../../../src/components/design/card/cardHeader/CardHeaderItem.tsx"],"sourcesContent":["'use client';\n\nimport React, { ReactElement, ReactNode } from 'react';\nimport { IconSource, renderIcon } from '../../../../helpers/iconHelpers';\nimport { getSafeLinkHref } from '../../../../helpers/urlHelpers';\nimport { LogoLink, LogoLinkProps } from '../../logos/LogoLink';\nimport { OwnerDetailsPopup } from '../../ownerDetailsPopup/OwnerDetailsPopup';\nimport { ButtonProps } from '../../../form/buttons/button.interface';\nimport { SimpleButton } from '../../../form/buttons/SimpleButton';\n\nexport interface CardHeaderItemProps {\n  icon?: IconSource;\n  logo?: LogoLinkProps;\n  graphic?: {\n    imageUrl: string;\n    label: string;\n  },\n  owner?: {\n    name: string;\n    email?: string;\n    phone?: string;\n  },\n  title?: string;\n  content?: ReactNode | ReactElement;\n  hideTitle?: boolean;\n  url?: string;\n  actionButton?: ButtonProps;\n}\n\nexport const CardHeaderItem: React.FC<CardHeaderItemProps> = (\n  {\n    icon,\n    logo,\n    graphic,\n    owner,\n    title,\n    content,\n    hideTitle = false,\n    url,\n    actionButton\n  }\n) => {\n  const safeUrl = url ? getSafeLinkHref(url) : undefined;\n  const headerContent = (\n    <>\n      { renderIcon(icon) }\n\n      { logo && <LogoLink { ...logo } /> }\n\n      { graphic && <img src={ graphic.imageUrl } className=\"logoImage\" alt={ `${ graphic.label }` } /> }\n\n      <span className={ hideTitle ? 'sr-only' : 'cardHeaderItemTitle' }>{ content || title }</span>\n    </>\n  );\n\n  return (\n    <div className=\"cardHeaderItem\" title={ title }>\n      { safeUrl\n        ? <a className=\"cardHeaderItemLink\" href={ safeUrl }>{ headerContent }</a>\n        : url\n          ? <span className=\"cardHeaderItemLink\">{ headerContent }</span>\n          : content\n      }\n\n      { owner && <OwnerDetailsPopup owner={ owner } /> }\n\n      { actionButton && <SimpleButton { ...actionButton } /> }\n    </div>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,MAAmC,OAAO;AACtD,SAAqBC,UAAU,QAAQ,iCAAiC;AACxE,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,QAAQ,QAAuB,sBAAsB;AAC9D,SAASC,iBAAiB,QAAQ,2CAA2C;AAE7E,SAASC,YAAY,QAAQ,oCAAoC;AAqBjE,OAAO,MAAMC,cAA6C,GAAGA,CAC3D;EACEC,IAAI;EACJC,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,SAAS,GAAG,KAAK;EACjBC,GAAG;EACHC;AACF,CAAC,KACE;EACH,MAAMC,OAAO,GAAGF,GAAG,GAAGZ,eAAe,CAACY,GAAG,CAAC,GAAGG,SAAS;EACtD,MAAMC,aAAa,gBACjBlB,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAAoB,QAAA,QACInB,UAAU,CAACM,IAAI,CAAC,EAEhBC,IAAI,iBAAIR,KAAA,CAAAmB,aAAA,CAAChB,QAAQ,EAAMK,IAAQ,CAAC,EAEhCC,OAAO,iBAAIT,KAAA,CAAAmB,aAAA;IAAKE,GAAG,EAAGZ,OAAO,CAACa,QAAU;IAACC,SAAS,EAAC,WAAW;IAACC,GAAG,EAAG,GAAIf,OAAO,CAACgB,KAAK;EAAK,CAAE,CAAC,eAEhGzB,KAAA,CAAAmB,aAAA;IAAMI,SAAS,EAAGV,SAAS,GAAG,SAAS,GAAG;EAAuB,GAAGD,OAAO,IAAID,KAAa,CAC5F,CACH;EAED,oBACEX,KAAA,CAAAmB,aAAA;IAAKI,SAAS,EAAC,gBAAgB;IAACZ,KAAK,EAAGA;EAAO,GAC3CK,OAAO,gBACLhB,KAAA,CAAAmB,aAAA;IAAGI,SAAS,EAAC,oBAAoB;IAACG,IAAI,EAAGV;EAAS,GAAGE,aAAkB,CAAC,GACxEJ,GAAG,gBACDd,KAAA,CAAAmB,aAAA;IAAMI,SAAS,EAAC;EAAoB,GAAGL,aAAqB,CAAC,GAC7DN,OAAO,EAGXF,KAAK,iBAAIV,KAAA,CAAAmB,aAAA,CAACf,iBAAiB;IAACM,KAAK,EAAGA;EAAO,CAAE,CAAC,EAE9CK,YAAY,iBAAIf,KAAA,CAAAmB,aAAA,CAACd,YAAY,EAAMU,YAAgB,CAClD,CAAC;AAEV,CAAC","ignoreList":[]}

package/dist/esm/components/design/dialog/dialog.css

@@ -41,6 +41,7 @@
   height: 30px;
   font-size: 10px;
   display: flex;
+  flex-shrink: 0;
   align-items: center;
   justify-content: center;
   border: var(--dialogCloseButtonBorder, none);
@@ -65,6 +66,9 @@
   flex-direction: row;
   justify-content: space-between;
 }
+.dialog .dialogHeader .dialogHeaderTextWrapper {
+  min-width: 0;
+}
 .dialog .dialogHeader .dialogHeaderText,
 .dialog .dialogHeader .headerBar {
   text-overflow: ellipsis;

package/dist/esm/components/design/logos/LogoLink.js

@@ -1,6 +1,7 @@
 'use client';
 
 import React from 'react';
+import { getSafeLinkHref } from '../../../helpers/urlHelpers';
 export const LogoLink = ({
   imageUrl,
   svg,
@@ -10,7 +11,7 @@ export const LogoLink = ({
   url,
   hideLabel = true
 }) => /*#__PURE__*/React.createElement("a", {
-  href: url,
+  href: getSafeLinkHref(url),
   title: label,
   target: "_blank",
   className: `logoLink logoLink_${size} ${customCssClass || ''}`,

package/dist/esm/components/design/logos/LogoLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"LogoLink.js","names":["React","LogoLink","imageUrl","svg","size","customCssClass","label","url","hideLabel","createElement","href","title","target","className","rel","src","alt"],"sources":["../../../../../src/components/design/logos/LogoLink.tsx"],"sourcesContent":["'use client';\n\nimport React, { ReactElement, ReactNode } from 'react';\n\nexport interface LogoLinkProps {\n  imageUrl?: string;\n  svg?: ReactElement | ReactNode;\n  size?: 'xs' | 's' | 'm'\n  customCssClass?: string;\n  label: string;\n  url: string;\n  hideLabel?: boolean;\n}\n\nexport const LogoLink: React.FC<LogoLinkProps> = (\n  {\n    imageUrl,\n    svg,\n    size = 's',\n    customCssClass,\n    label,\n    url,\n    hideLabel = true\n  }\n) => (\n  <a href={ url } title={ label } target=\"_blank\" className={ `logoLink logoLink_${ size } ${ customCssClass || '' }` } rel=\"noreferrer\">\n    {\n      imageUrl && (\n        <img src={ imageUrl }\n          className=\"logoImage\"\n          alt={ `${ label } logo` }\n        />\n      )\n    }\n    {\n      svg && <span className=\"logoSvg\">{ svg }</span>\n    }\n    <span className={ hideLabel ? 'sr-only' : 'logoLabel' }>\n      { label }\n    </span>\n  </a>\n);\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,MAAmC,OAAO;AAYtD,OAAO,MAAMC,QAAiC,GAAGA,CAC/C;EACEC,QAAQ;EACRC,GAAG;EACHC,IAAI,GAAG,GAAG;EACVC,cAAc;EACdC,KAAK;EACLC,GAAG;EACHC,SAAS,GAAG;AACd,CAAC,kBAEDR,KAAA,CAAAS,aAAA;EAAGC,IAAI,EAAGH,GAAK;EAACI,KAAK,EAAGL,KAAO;EAACM,MAAM,EAAC,QAAQ;EAACC,SAAS,EAAG,qBAAsBT,IAAI,IAAMC,cAAc,IAAI,EAAE,EAAK;EAACS,GAAG,EAAC;AAAY,GAElIZ,QAAQ,iBACNF,KAAA,CAAAS,aAAA;EAAKM,GAAG,EAAGb,QAAU;EACnBW,SAAS,EAAC,WAAW;EACrBG,GAAG,EAAG,GAAIV,KAAK;AAAU,CAC1B,CACF,EAGDH,GAAG,iBAAIH,KAAA,CAAAS,aAAA;EAAMI,SAAS,EAAC;AAAS,GAAGV,GAAW,CAAC,eAEjDH,KAAA,CAAAS,aAAA;EAAMI,SAAS,EAAGL,SAAS,GAAG,SAAS,GAAG;AAAa,GACnDF,KACE,CACL,CACJ","ignoreList":[]}
+{"version":3,"file":"LogoLink.js","names":["React","getSafeLinkHref","LogoLink","imageUrl","svg","size","customCssClass","label","url","hideLabel","createElement","href","title","target","className","rel","src","alt"],"sources":["../../../../../src/components/design/logos/LogoLink.tsx"],"sourcesContent":["'use client';\n\nimport React, { ReactElement, ReactNode } from 'react';\nimport { getSafeLinkHref } from '../../../helpers/urlHelpers';\n\nexport interface LogoLinkProps {\n  imageUrl?: string;\n  svg?: ReactElement | ReactNode;\n  size?: 'xs' | 's' | 'm'\n  customCssClass?: string;\n  label: string;\n  url: string;\n  hideLabel?: boolean;\n}\n\nexport const LogoLink: React.FC<LogoLinkProps> = (\n  {\n    imageUrl,\n    svg,\n    size = 's',\n    customCssClass,\n    label,\n    url,\n    hideLabel = true\n  }\n) => (\n  <a href={ getSafeLinkHref(url) } title={ label } target=\"_blank\" className={ `logoLink logoLink_${ size } ${ customCssClass || '' }` } rel=\"noreferrer\">\n    {\n      imageUrl && (\n        <img src={ imageUrl }\n          className=\"logoImage\"\n          alt={ `${ label } logo` }\n        />\n      )\n    }\n    {\n      svg && <span className=\"logoSvg\">{ svg }</span>\n    }\n    <span className={ hideLabel ? 'sr-only' : 'logoLabel' }>\n      { label }\n    </span>\n  </a>\n);\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,MAAmC,OAAO;AACtD,SAASC,eAAe,QAAQ,6BAA6B;AAY7D,OAAO,MAAMC,QAAiC,GAAGA,CAC/C;EACEC,QAAQ;EACRC,GAAG;EACHC,IAAI,GAAG,GAAG;EACVC,cAAc;EACdC,KAAK;EACLC,GAAG;EACHC,SAAS,GAAG;AACd,CAAC,kBAEDT,KAAA,CAAAU,aAAA;EAAGC,IAAI,EAAGV,eAAe,CAACO,GAAG,CAAG;EAACI,KAAK,EAAGL,KAAO;EAACM,MAAM,EAAC,QAAQ;EAACC,SAAS,EAAG,qBAAsBT,IAAI,IAAMC,cAAc,IAAI,EAAE,EAAK;EAACS,GAAG,EAAC;AAAY,GAEnJZ,QAAQ,iBACNH,KAAA,CAAAU,aAAA;EAAKM,GAAG,EAAGb,QAAU;EACnBW,SAAS,EAAC,WAAW;EACrBG,GAAG,EAAG,GAAIV,KAAK;AAAU,CAC1B,CACF,EAGDH,GAAG,iBAAIJ,KAAA,CAAAU,aAAA;EAAMI,SAAS,EAAC;AAAS,GAAGV,GAAW,CAAC,eAEjDJ,KAAA,CAAAU,aAAA;EAAMI,SAAS,EAAGL,SAAS,GAAG,SAAS,GAAG;AAAa,GACnDF,KACE,CACL,CACJ","ignoreList":[]}

package/dist/esm/components/design/logos/VentureLogo.js

@@ -2,6 +2,7 @@
 
 import React from 'react';
 import { VENTURES } from '../../../constants/ventures';
+import { getSafeLinkHref } from '../../../helpers/urlHelpers';
 import './ventureLogos.css';
 export const VentureLogo = ({
   ventureKey = 'x15Ventures',
@@ -25,7 +26,7 @@ export const VentureLogo = ({
   } = logoDefinition;
   const cssClass = `ventureLogo ventureLogo_${size} ${ventureKey}Logo ${customCssClass || ''}`;
   return /*#__PURE__*/React.createElement("a", {
-    href: url,
+    href: getSafeLinkHref(url),
     title: name,
     target: "_blank",
     className: cssClass,

package/dist/esm/components/design/logos/VentureLogo.js.map

@@ -1 +1 @@
-{"version":3,"file":"VentureLogo.js","names":["React","VENTURES","VentureLogo","ventureKey","ventureDefinition","size","customCssClass","logoDefinition","x15Ventures","logo","icon","full","name","sites","public","publicSiteName","url","cssClass","createElement","href","title","target","className","rel"],"sources":["../../../../../src/components/design/logos/VentureLogo.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { VENTURES, VentureDefinition } from '../../../constants/ventures';\n\nimport './ventureLogos.scss';\n\nexport interface VentureLogoProps {\n  ventureDefinition?: VentureDefinition;\n  ventureKey: string;\n  size?: 'icon' | 'full';\n  customCssClass?: string;\n}\n\nexport const VentureLogo: React.FC<VentureLogoProps> = (\n  {\n    ventureKey = 'x15Ventures',\n    ventureDefinition,\n    size = 'full',\n    customCssClass\n  }\n) => {\n  const logoDefinition = ventureDefinition || VENTURES[ ventureKey ] || VENTURES.x15Ventures;\n\n  const { logo: { icon, full }, name, sites: { public: { name: publicSiteName, url } } } = logoDefinition;\n\n  const cssClass = `ventureLogo ventureLogo_${ size } ${ ventureKey }Logo ${ customCssClass || '' }`;\n\n  return (\n    <a href={ url } title={ name } target=\"_blank\" className={ cssClass } rel=\"noreferrer\">\n      {\n        size === 'icon'\n          ? icon\n          : full\n      }\n\n      <span className=\"sr-only\">\n        Visit { publicSiteName }\n      </span>\n    </a>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAA2B,6BAA6B;AAEzE,OAAO,qBAAqB;AAS5B,OAAO,MAAMC,WAAuC,GAAGA,CACrD;EACEC,UAAU,GAAG,aAAa;EAC1BC,iBAAiB;EACjBC,IAAI,GAAG,MAAM;EACbC;AACF,CAAC,KACE;EACH,MAAMC,cAAc,GAAGH,iBAAiB,IAAIH,QAAQ,CAAEE,UAAU,CAAE,IAAIF,QAAQ,CAACO,WAAW;EAE1F,MAAM;IAAEC,IAAI,EAAE;MAAEC,IAAI;MAAEC;IAAK,CAAC;IAAEC,IAAI;IAAEC,KAAK,EAAE;MAAEC,MAAM,EAAE;QAAEF,IAAI,EAAEG,cAAc;QAAEC;MAAI;IAAE;EAAE,CAAC,GAAGT,cAAc;EAEvG,MAAMU,QAAQ,GAAG,2BAA4BZ,IAAI,IAAMF,UAAU,QAAUG,cAAc,IAAI,EAAE,EAAG;EAElG,oBACEN,KAAA,CAAAkB,aAAA;IAAGC,IAAI,EAAGH,GAAK;IAACI,KAAK,EAAGR,IAAM;IAACS,MAAM,EAAC,QAAQ;IAACC,SAAS,EAAGL,QAAU;IAACM,GAAG,EAAC;EAAY,GAElFlB,IAAI,KAAK,MAAM,GACXK,IAAI,GACJC,IAAI,eAGVX,KAAA,CAAAkB,aAAA;IAAMI,SAAS,EAAC;EAAS,GAAC,QAClB,EAAEP,cACJ,CACL,CAAC;AAER,CAAC","ignoreList":[]}
+{"version":3,"file":"VentureLogo.js","names":["React","VENTURES","getSafeLinkHref","VentureLogo","ventureKey","ventureDefinition","size","customCssClass","logoDefinition","x15Ventures","logo","icon","full","name","sites","public","publicSiteName","url","cssClass","createElement","href","title","target","className","rel"],"sources":["../../../../../src/components/design/logos/VentureLogo.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { VENTURES, VentureDefinition } from '../../../constants/ventures';\nimport { getSafeLinkHref } from '../../../helpers/urlHelpers';\n\nimport './ventureLogos.scss';\n\nexport interface VentureLogoProps {\n  ventureDefinition?: VentureDefinition;\n  ventureKey: string;\n  size?: 'icon' | 'full';\n  customCssClass?: string;\n}\n\nexport const VentureLogo: React.FC<VentureLogoProps> = (\n  {\n    ventureKey = 'x15Ventures',\n    ventureDefinition,\n    size = 'full',\n    customCssClass\n  }\n) => {\n  const logoDefinition = ventureDefinition || VENTURES[ ventureKey ] || VENTURES.x15Ventures;\n\n  const { logo: { icon, full }, name, sites: { public: { name: publicSiteName, url } } } = logoDefinition;\n\n  const cssClass = `ventureLogo ventureLogo_${ size } ${ ventureKey }Logo ${ customCssClass || '' }`;\n\n  return (\n    <a href={ getSafeLinkHref(url) } title={ name } target=\"_blank\" className={ cssClass } rel=\"noreferrer\">\n      {\n        size === 'icon'\n          ? icon\n          : full\n      }\n\n      <span className=\"sr-only\">\n        Visit { publicSiteName }\n      </span>\n    </a>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAA2B,6BAA6B;AACzE,SAASC,eAAe,QAAQ,6BAA6B;AAE7D,OAAO,qBAAqB;AAS5B,OAAO,MAAMC,WAAuC,GAAGA,CACrD;EACEC,UAAU,GAAG,aAAa;EAC1BC,iBAAiB;EACjBC,IAAI,GAAG,MAAM;EACbC;AACF,CAAC,KACE;EACH,MAAMC,cAAc,GAAGH,iBAAiB,IAAIJ,QAAQ,CAAEG,UAAU,CAAE,IAAIH,QAAQ,CAACQ,WAAW;EAE1F,MAAM;IAAEC,IAAI,EAAE;MAAEC,IAAI;MAAEC;IAAK,CAAC;IAAEC,IAAI;IAAEC,KAAK,EAAE;MAAEC,MAAM,EAAE;QAAEF,IAAI,EAAEG,cAAc;QAAEC;MAAI;IAAE;EAAE,CAAC,GAAGT,cAAc;EAEvG,MAAMU,QAAQ,GAAG,2BAA4BZ,IAAI,IAAMF,UAAU,QAAUG,cAAc,IAAI,EAAE,EAAG;EAElG,oBACEP,KAAA,CAAAmB,aAAA;IAAGC,IAAI,EAAGlB,eAAe,CAACe,GAAG,CAAG;IAACI,KAAK,EAAGR,IAAM;IAACS,MAAM,EAAC,QAAQ;IAACC,SAAS,EAAGL,QAAU;IAACM,GAAG,EAAC;EAAY,GAEnGlB,IAAI,KAAK,MAAM,GACXK,IAAI,GACJC,IAAI,eAGVZ,KAAA,CAAAmB,aAAA;IAAMI,SAAS,EAAC;EAAS,GAAC,QAClB,EAAEP,cACJ,CACL,CAAC;AAER,CAAC","ignoreList":[]}

package/dist/esm/components/design/revealMore/RevealMoreBelow.js

@@ -1,7 +1,7 @@
 'use client';
 
 import React, { useRef, useEffect } from 'react';
-import { SimpleButton } from '../../..';
+import { SimpleButton } from '../../form/buttons/SimpleButton';
 import { useRevealMoreLogic } from './hooks/useRevealMoreLogic';
 import { useCustomButton } from './hooks/useCustomButton';
 export const RevealMoreBelow = props => {

package/dist/esm/components/design/revealMore/RevealMoreBelow.js.map

@@ -1 +1 @@
-{"version":3,"file":"RevealMoreBelow.js","names":["React","useRef","useEffect","SimpleButton","useRevealMoreLogic","useCustomButton","RevealMoreBelow","props","children","lineClamp","customCssClass","isExpanded","isOverflowing","setIsOverflowing","toggleExpand","renderCustomButton","contentRef","isCustomButton","el","current","scrollHeight","clientHeight","elementStyle","overflow","display","WebkitBoxOrient","WebkitLineClamp","createElement","className","ref","style","revealLessButton","revealMoreButton","onClickHandler","revealLessLabelOnClickHandler","revealMoreLabelOnClickHandler","id","cssClass","label","revealLessLabel","revealMoreLabel","leftIcon","icon","onRevealLess","onRevealMore"],"sources":["../../../../../src/components/design/revealMore/RevealMoreBelow.tsx"],"sourcesContent":["'use client';\n\nimport React, { useRef, useEffect } from 'react';\nimport { SimpleButton } from '../../..';\nimport { RevealMoreBelowProps, ManagedButtonProps } from './types/revealMoreTypes';\nimport { useRevealMoreLogic } from './hooks/useRevealMoreLogic';\nimport { useCustomButton } from './hooks/useCustomButton';\n\nexport const RevealMoreBelow: React.FC<RevealMoreBelowProps> = (props) => {\n  const {\n    children,\n    lineClamp = 2,\n    customCssClass\n  } = props;\n\n  const { isExpanded, isOverflowing, setIsOverflowing, toggleExpand } = useRevealMoreLogic();\n  const { renderCustomButton } = useCustomButton(toggleExpand);\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  const isCustomButton = 'revealMoreButton' in props && 'revealLessButton' in props;\n\n  useEffect(() => {\n    const el = contentRef.current;\n    if (el) {\n      setIsOverflowing(el.scrollHeight > el.clientHeight);\n    }\n  }, [children, lineClamp]);\n\n  const elementStyle: React.CSSProperties = {\n    overflow: 'hidden',\n    display: '-webkit-box',\n    WebkitBoxOrient: 'vertical',\n    WebkitLineClamp: lineClamp,\n  };\n\n  return (\n    <div className={ `revealMore revealMore_below ${ customCssClass || '' }` }>\n      <div\n        ref={ contentRef }\n        className={ 'revealMore_content' }\n        style={ isExpanded ? { ...elementStyle, WebkitLineClamp: 'none' } : elementStyle }\n      >\n        { children }\n      </div>\n      { isOverflowing && (\n        isCustomButton ? (\n          renderCustomButton(\n            isExpanded ? props.revealLessButton : props.revealMoreButton\n          )\n        ) : (\n          <SimpleButton\n            onClickHandler={ () => {\n              toggleExpand();\n              if (isExpanded) {\n                (props as ManagedButtonProps).revealLessLabelOnClickHandler?.();\n              } else {\n                (props as ManagedButtonProps).revealMoreLabelOnClickHandler?.();\n              }\n            } }\n            id='revealMore_button-below'\n            cssClass=\"button compact\"\n            label={\n              isExpanded \n                ? (props as ManagedButtonProps).revealLessLabel || 'Reveal Less' \n                : (props as ManagedButtonProps).revealMoreLabel || 'Reveal More'\n            }\n            leftIcon={\n              isExpanded\n                ? (props as ManagedButtonProps).icon?.onRevealLess\n                : (props as ManagedButtonProps).icon?.onRevealMore\n            }\n            aria-hidden = { props.revealLessLabelOnClickHandler || props.revealMoreLabelOnClickHandler ? false : true }\n          />\n        )\n      ) }\n    </div>\n  );\n};"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,IAAIC,MAAM,EAAEC,SAAS,QAAQ,OAAO;AAChD,SAASC,YAAY,QAAQ,UAAU;AAEvC,SAASC,kBAAkB,QAAQ,4BAA4B;AAC/D,SAASC,eAAe,QAAQ,yBAAyB;AAEzD,OAAO,MAAMC,eAA+C,GAAIC,KAAK,IAAK;EACxE,MAAM;IACJC,QAAQ;IACRC,SAAS,GAAG,CAAC;IACbC;EACF,CAAC,GAAGH,KAAK;EAET,MAAM;IAAEI,UAAU;IAAEC,aAAa;IAAEC,gBAAgB;IAAEC;EAAa,CAAC,GAAGV,kBAAkB,CAAC,CAAC;EAC1F,MAAM;IAAEW;EAAmB,CAAC,GAAGV,eAAe,CAACS,YAAY,CAAC;EAC5D,MAAME,UAAU,GAAGf,MAAM,CAAiB,IAAI,CAAC;EAE/C,MAAMgB,cAAc,GAAG,kBAAkB,IAAIV,KAAK,IAAI,kBAAkB,IAAIA,KAAK;EAEjFL,SAAS,CAAC,MAAM;IACd,MAAMgB,EAAE,GAAGF,UAAU,CAACG,OAAO;IAC7B,IAAID,EAAE,EAAE;MACNL,gBAAgB,CAACK,EAAE,CAACE,YAAY,GAAGF,EAAE,CAACG,YAAY,CAAC;IACrD;EACF,CAAC,EAAE,CAACb,QAAQ,EAAEC,SAAS,CAAC,CAAC;EAEzB,MAAMa,YAAiC,GAAG;IACxCC,QAAQ,EAAE,QAAQ;IAClBC,OAAO,EAAE,aAAa;IACtBC,eAAe,EAAE,UAAU;IAC3BC,eAAe,EAAEjB;EACnB,CAAC;EAED,oBACET,KAAA,CAAA2B,aAAA;IAAKC,SAAS,EAAG,+BAAgClB,cAAc,IAAI,EAAE;EAAK,gBACxEV,KAAA,CAAA2B,aAAA;IACEE,GAAG,EAAGb,UAAY;IAClBY,SAAS,EAAG,oBAAsB;IAClCE,KAAK,EAAGnB,UAAU,GAAG;MAAE,GAAGW,YAAY;MAAEI,eAAe,EAAE;IAAO,CAAC,GAAGJ;EAAc,GAEhFd,QACC,CAAC,EACJI,aAAa,KACbK,cAAc,GACZF,kBAAkB,CAChBJ,UAAU,GAAGJ,KAAK,CAACwB,gBAAgB,GAAGxB,KAAK,CAACyB,gBAC9C,CAAC,gBAEDhC,KAAA,CAAA2B,aAAA,CAACxB,YAAY;IACX8B,cAAc,EAAGA,CAAA,KAAM;MACrBnB,YAAY,CAAC,CAAC;MACd,IAAIH,UAAU,EAAE;QACbJ,KAAK,CAAwB2B,6BAA6B,GAAG,CAAC;MACjE,CAAC,MAAM;QACJ3B,KAAK,CAAwB4B,6BAA6B,GAAG,CAAC;MACjE;IACF,CAAG;IACHC,EAAE,EAAC,yBAAyB;IAC5BC,QAAQ,EAAC,gBAAgB;IACzBC,KAAK,EACH3B,UAAU,GACLJ,KAAK,CAAwBgC,eAAe,IAAI,aAAa,GAC7DhC,KAAK,CAAwBiC,eAAe,IAAI,aACtD;IACDC,QAAQ,EACN9B,UAAU,GACLJ,KAAK,CAAwBmC,IAAI,EAAEC,YAAY,GAC/CpC,KAAK,CAAwBmC,IAAI,EAAEE,YACzC;IACD,eAAgBrC,KAAK,CAAC2B,6BAA6B,IAAI3B,KAAK,CAAC4B,6BAA6B,GAAG,KAAK,GAAG;EAAM,CAC5G,CACF,CAEA,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"file":"RevealMoreBelow.js","names":["React","useRef","useEffect","SimpleButton","useRevealMoreLogic","useCustomButton","RevealMoreBelow","props","children","lineClamp","customCssClass","isExpanded","isOverflowing","setIsOverflowing","toggleExpand","renderCustomButton","contentRef","isCustomButton","el","current","scrollHeight","clientHeight","elementStyle","overflow","display","WebkitBoxOrient","WebkitLineClamp","createElement","className","ref","style","revealLessButton","revealMoreButton","onClickHandler","revealLessLabelOnClickHandler","revealMoreLabelOnClickHandler","id","cssClass","label","revealLessLabel","revealMoreLabel","leftIcon","icon","onRevealLess","onRevealMore"],"sources":["../../../../../src/components/design/revealMore/RevealMoreBelow.tsx"],"sourcesContent":["'use client';\n\nimport React, { useRef, useEffect } from 'react';\nimport { SimpleButton } from '../../form/buttons/SimpleButton';\nimport { RevealMoreBelowProps, ManagedButtonProps } from './types/revealMoreTypes';\nimport { useRevealMoreLogic } from './hooks/useRevealMoreLogic';\nimport { useCustomButton } from './hooks/useCustomButton';\n\nexport const RevealMoreBelow: React.FC<RevealMoreBelowProps> = (props) => {\n  const {\n    children,\n    lineClamp = 2,\n    customCssClass\n  } = props;\n\n  const { isExpanded, isOverflowing, setIsOverflowing, toggleExpand } = useRevealMoreLogic();\n  const { renderCustomButton } = useCustomButton(toggleExpand);\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  const isCustomButton = 'revealMoreButton' in props && 'revealLessButton' in props;\n\n  useEffect(() => {\n    const el = contentRef.current;\n    if (el) {\n      setIsOverflowing(el.scrollHeight > el.clientHeight);\n    }\n  }, [children, lineClamp]);\n\n  const elementStyle: React.CSSProperties = {\n    overflow: 'hidden',\n    display: '-webkit-box',\n    WebkitBoxOrient: 'vertical',\n    WebkitLineClamp: lineClamp,\n  };\n\n  return (\n    <div className={ `revealMore revealMore_below ${ customCssClass || '' }` }>\n      <div\n        ref={ contentRef }\n        className={ 'revealMore_content' }\n        style={ isExpanded ? { ...elementStyle, WebkitLineClamp: 'none' } : elementStyle }\n      >\n        { children }\n      </div>\n      { isOverflowing && (\n        isCustomButton ? (\n          renderCustomButton(\n            isExpanded ? props.revealLessButton : props.revealMoreButton\n          )\n        ) : (\n          <SimpleButton\n            onClickHandler={ () => {\n              toggleExpand();\n              if (isExpanded) {\n                (props as ManagedButtonProps).revealLessLabelOnClickHandler?.();\n              } else {\n                (props as ManagedButtonProps).revealMoreLabelOnClickHandler?.();\n              }\n            } }\n            id='revealMore_button-below'\n            cssClass=\"button compact\"\n            label={\n              isExpanded \n                ? (props as ManagedButtonProps).revealLessLabel || 'Reveal Less' \n                : (props as ManagedButtonProps).revealMoreLabel || 'Reveal More'\n            }\n            leftIcon={\n              isExpanded\n                ? (props as ManagedButtonProps).icon?.onRevealLess\n                : (props as ManagedButtonProps).icon?.onRevealMore\n            }\n            aria-hidden = { props.revealLessLabelOnClickHandler || props.revealMoreLabelOnClickHandler ? false : true }\n          />\n        )\n      ) }\n    </div>\n  );\n};"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,IAAIC,MAAM,EAAEC,SAAS,QAAQ,OAAO;AAChD,SAASC,YAAY,QAAQ,iCAAiC;AAE9D,SAASC,kBAAkB,QAAQ,4BAA4B;AAC/D,SAASC,eAAe,QAAQ,yBAAyB;AAEzD,OAAO,MAAMC,eAA+C,GAAIC,KAAK,IAAK;EACxE,MAAM;IACJC,QAAQ;IACRC,SAAS,GAAG,CAAC;IACbC;EACF,CAAC,GAAGH,KAAK;EAET,MAAM;IAAEI,UAAU;IAAEC,aAAa;IAAEC,gBAAgB;IAAEC;EAAa,CAAC,GAAGV,kBAAkB,CAAC,CAAC;EAC1F,MAAM;IAAEW;EAAmB,CAAC,GAAGV,eAAe,CAACS,YAAY,CAAC;EAC5D,MAAME,UAAU,GAAGf,MAAM,CAAiB,IAAI,CAAC;EAE/C,MAAMgB,cAAc,GAAG,kBAAkB,IAAIV,KAAK,IAAI,kBAAkB,IAAIA,KAAK;EAEjFL,SAAS,CAAC,MAAM;IACd,MAAMgB,EAAE,GAAGF,UAAU,CAACG,OAAO;IAC7B,IAAID,EAAE,EAAE;MACNL,gBAAgB,CAACK,EAAE,CAACE,YAAY,GAAGF,EAAE,CAACG,YAAY,CAAC;IACrD;EACF,CAAC,EAAE,CAACb,QAAQ,EAAEC,SAAS,CAAC,CAAC;EAEzB,MAAMa,YAAiC,GAAG;IACxCC,QAAQ,EAAE,QAAQ;IAClBC,OAAO,EAAE,aAAa;IACtBC,eAAe,EAAE,UAAU;IAC3BC,eAAe,EAAEjB;EACnB,CAAC;EAED,oBACET,KAAA,CAAA2B,aAAA;IAAKC,SAAS,EAAG,+BAAgClB,cAAc,IAAI,EAAE;EAAK,gBACxEV,KAAA,CAAA2B,aAAA;IACEE,GAAG,EAAGb,UAAY;IAClBY,SAAS,EAAG,oBAAsB;IAClCE,KAAK,EAAGnB,UAAU,GAAG;MAAE,GAAGW,YAAY;MAAEI,eAAe,EAAE;IAAO,CAAC,GAAGJ;EAAc,GAEhFd,QACC,CAAC,EACJI,aAAa,KACbK,cAAc,GACZF,kBAAkB,CAChBJ,UAAU,GAAGJ,KAAK,CAACwB,gBAAgB,GAAGxB,KAAK,CAACyB,gBAC9C,CAAC,gBAEDhC,KAAA,CAAA2B,aAAA,CAACxB,YAAY;IACX8B,cAAc,EAAGA,CAAA,KAAM;MACrBnB,YAAY,CAAC,CAAC;MACd,IAAIH,UAAU,EAAE;QACbJ,KAAK,CAAwB2B,6BAA6B,GAAG,CAAC;MACjE,CAAC,MAAM;QACJ3B,KAAK,CAAwB4B,6BAA6B,GAAG,CAAC;MACjE;IACF,CAAG;IACHC,EAAE,EAAC,yBAAyB;IAC5BC,QAAQ,EAAC,gBAAgB;IACzBC,KAAK,EACH3B,UAAU,GACLJ,KAAK,CAAwBgC,eAAe,IAAI,aAAa,GAC7DhC,KAAK,CAAwBiC,eAAe,IAAI,aACtD;IACDC,QAAQ,EACN9B,UAAU,GACLJ,KAAK,CAAwBmC,IAAI,EAAEC,YAAY,GAC/CpC,KAAK,CAAwBmC,IAAI,EAAEE,YACzC;IACD,eAAgBrC,KAAK,CAAC2B,6BAA6B,IAAI3B,KAAK,CAAC4B,6BAA6B,GAAG,KAAK,GAAG;EAAM,CAC5G,CACF,CAEA,CAAC;AAEV,CAAC","ignoreList":[]}

package/dist/esm/components/design/skeleton/Skeleton.js

@@ -1,6 +1,14 @@
 import React from 'react';
 import './skeleton.css';
-const toCssSize = value => typeof value === 'number' ? `${value}px` : value;
+// Sizes, calc(), min(), var(--x) and the like. Excludes `;`, `:`, quotes, braces and backslashes, which
+// could end the declaration in a server-rendered style attribute, since React does not escape them.
+const CSS_SIZE_PATTERN = /^[\w\s.%()+\-*/,]+$/;
+const toCssSize = value => {
+  if (typeof value === 'number') {
+    return Number.isFinite(value) ? `${value}px` : undefined;
+  }
+  return typeof value === 'string' && CSS_SIZE_PATTERN.test(value) ? value : undefined;
+};
 export const Skeleton = ({
   variant = 'text',
   width,
@@ -18,11 +26,13 @@ export const Skeleton = ({
   const barCount = variant === 'text' ? rowCount : 1;
   const animationCssClass = animation ? `skeleton_${animation}` : 'skeleton_noAnimation';
   const skeletonStyle = {};
-  if (width !== undefined) {
-    skeletonStyle['--skeletonWidth'] = toCssSize(width);
+  const cssWidth = width === undefined ? undefined : toCssSize(width);
+  const cssHeight = height === undefined || variant === 'circle' ? undefined : toCssSize(height);
+  if (cssWidth) {
+    skeletonStyle['--skeletonWidth'] = cssWidth;
   }
-  if (height !== undefined && variant !== 'circle') {
-    skeletonStyle['--skeletonHeight'] = toCssSize(height);
+  if (cssHeight) {
+    skeletonStyle['--skeletonHeight'] = cssHeight;
   }
   return /*#__PURE__*/React.createElement("span", {
     id: id,

package/dist/esm/components/design/skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","names":["React","toCssSize","value","Skeleton","variant","width","height","lines","animation","appearance","isLoaded","children","id","customCssClass","createElement","Fragment","rowCount","Number","isFinite","Math","max","floor","barCount","animationCssClass","skeletonStyle","undefined","className","style","Array","from","length","_bar","index","key"],"sources":["../../../../../src/components/design/skeleton/Skeleton.tsx"],"sourcesContent":["import React from 'react';\n\nimport './skeleton.scss';\n\nexport interface SkeletonProps {\n  /** Structural style of the placeholder. `text` renders line sized bars, `block` a sharp cornered area, `rounded` a softened one, and `circle` an avatar style disc. */\n  variant?: 'text' | 'block' | 'circle' | 'rounded';\n  /** Inline size of the placeholder. Numbers are treated as pixels, strings are passed through as written (for example `'50%'`). */\n  width?: string | number;\n  /** Block size of the placeholder. Numbers are treated as pixels. Ignored for the `circle` variant, which stays square. */\n  height?: string | number;\n  /** How many placeholder rows to render. Applies to the `text` variant only; all other variants render a single bar. */\n  lines?: number;\n  /** Animation style, or `false` for a static placeholder. Both animations are suppressed under `prefers-reduced-motion`. */\n  animation?: 'pulse' | 'wave' | false;\n  /** Visual intensity. `opaque` gives a higher contrast fill for busier or lower contrast surfaces. */\n  appearance?: 'subtle' | 'opaque';\n  /** When true, `children` are rendered in place of the placeholder. */\n  isLoaded?: boolean;\n  /** Real content, rendered once `isLoaded` is true. */\n  children?: React.ReactNode;\n  /** Applied to the placeholder wrapper. Note the wrapper is `aria-hidden`, so this is intended for styling and testing rather than as an ARIA target. */\n  id?: string;\n  /** Additional class names appended to the placeholder wrapper. */\n  customCssClass?: string;\n}\n\nconst toCssSize = (value: string | number): string => (\n  typeof value === 'number' ? `${ value }px` : value\n);\n\nexport const Skeleton: React.FC<SkeletonProps> = (\n  {\n    variant = 'text',\n    width,\n    height,\n    lines = 1,\n    animation = 'wave',\n    appearance = 'subtle',\n    isLoaded = false,\n    children,\n    id,\n    customCssClass = ''\n  }\n) => {\n  if (isLoaded) return <>{ children }</>;\n\n  const rowCount = Number.isFinite(lines) ? Math.max(1, Math.floor(lines)) : 1;\n  const barCount = variant === 'text' ? rowCount : 1;\n  const animationCssClass = animation ? `skeleton_${ animation }` : 'skeleton_noAnimation';\n\n  const skeletonStyle: Record<string, string> = {};\n\n  if (width !== undefined) {\n    skeletonStyle['--skeletonWidth'] = toCssSize(width);\n  }\n\n  if (height !== undefined && variant !== 'circle') {\n    skeletonStyle['--skeletonHeight'] = toCssSize(height);\n  }\n\n  return (\n    <span\n      id={ id }\n      aria-hidden=\"true\"\n      className={ `skeleton skeleton_${ variant } skeleton_${ appearance } ${ animationCssClass } ${ customCssClass }` }\n      style={ skeletonStyle as React.CSSProperties }\n    >\n      { Array.from({ length: barCount }, (_bar, index) => (\n        <span key={ index } className=\"skeletonBar\" />\n      )) }\n    </span>\n  );\n};\n\nexport default Skeleton;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,iBAAiB;AAyBxB,MAAMC,SAAS,GAAIC,KAAsB,IACvC,OAAOA,KAAK,KAAK,QAAQ,GAAG,GAAIA,KAAK,IAAK,GAAGA,KAC9C;AAED,OAAO,MAAMC,QAAiC,GAAGA,CAC/C;EACEC,OAAO,GAAG,MAAM;EAChBC,KAAK;EACLC,MAAM;EACNC,KAAK,GAAG,CAAC;EACTC,SAAS,GAAG,MAAM;EAClBC,UAAU,GAAG,QAAQ;EACrBC,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,EAAE;EACFC,cAAc,GAAG;AACnB,CAAC,KACE;EACH,IAAIH,QAAQ,EAAE,oBAAOV,KAAA,CAAAc,aAAA,CAAAd,KAAA,CAAAe,QAAA,QAAIJ,QAAY,CAAC;EAEtC,MAAMK,QAAQ,GAAGC,MAAM,CAACC,QAAQ,CAACX,KAAK,CAAC,GAAGY,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAACd,KAAK,CAAC,CAAC,GAAG,CAAC;EAC5E,MAAMe,QAAQ,GAAGlB,OAAO,KAAK,MAAM,GAAGY,QAAQ,GAAG,CAAC;EAClD,MAAMO,iBAAiB,GAAGf,SAAS,GAAG,YAAaA,SAAS,EAAG,GAAG,sBAAsB;EAExF,MAAMgB,aAAqC,GAAG,CAAC,CAAC;EAEhD,IAAInB,KAAK,KAAKoB,SAAS,EAAE;IACvBD,aAAa,CAAC,iBAAiB,CAAC,GAAGvB,SAAS,CAACI,KAAK,CAAC;EACrD;EAEA,IAAIC,MAAM,KAAKmB,SAAS,IAAIrB,OAAO,KAAK,QAAQ,EAAE;IAChDoB,aAAa,CAAC,kBAAkB,CAAC,GAAGvB,SAAS,CAACK,MAAM,CAAC;EACvD;EAEA,oBACEN,KAAA,CAAAc,aAAA;IACEF,EAAE,EAAGA,EAAI;IACT,eAAY,MAAM;IAClBc,SAAS,EAAG,qBAAsBtB,OAAO,aAAeK,UAAU,IAAMc,iBAAiB,IAAMV,cAAc,EAAK;IAClHc,KAAK,EAAGH;EAAsC,GAE5CI,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAER;EAAS,CAAC,EAAE,CAACS,IAAI,EAAEC,KAAK,kBAC7ChC,KAAA,CAAAc,aAAA;IAAMmB,GAAG,EAAGD,KAAO;IAACN,SAAS,EAAC;EAAa,CAAE,CAC9C,CACG,CAAC;AAEX,CAAC;AAED,eAAevB,QAAQ","ignoreList":[]}
+{"version":3,"file":"Skeleton.js","names":["React","CSS_SIZE_PATTERN","toCssSize","value","Number","isFinite","undefined","test","Skeleton","variant","width","height","lines","animation","appearance","isLoaded","children","id","customCssClass","createElement","Fragment","rowCount","Math","max","floor","barCount","animationCssClass","skeletonStyle","cssWidth","cssHeight","className","style","Array","from","length","_bar","index","key"],"sources":["../../../../../src/components/design/skeleton/Skeleton.tsx"],"sourcesContent":["import React from 'react';\n\nimport './skeleton.scss';\n\nexport interface SkeletonProps {\n  /** Structural style of the placeholder. `text` renders line sized bars, `block` a sharp cornered area, `rounded` a softened one, and `circle` an avatar style disc. */\n  variant?: 'text' | 'block' | 'circle' | 'rounded';\n  /** Inline size of the placeholder. Numbers are treated as pixels, strings are passed through as written (for example `'50%'` or `'calc(100% - 2rem)'`). Strings containing characters that could not be part of a size, such as `;` or quotes, are ignored. */\n  width?: string | number;\n  /** Block size of the placeholder. Numbers are treated as pixels. Ignored for the `circle` variant, which stays square. */\n  height?: string | number;\n  /** How many placeholder rows to render. Applies to the `text` variant only; all other variants render a single bar. */\n  lines?: number;\n  /** Animation style, or `false` for a static placeholder. Both animations are suppressed under `prefers-reduced-motion`. */\n  animation?: 'pulse' | 'wave' | false;\n  /** Visual intensity. `opaque` gives a higher contrast fill for busier or lower contrast surfaces. */\n  appearance?: 'subtle' | 'opaque';\n  /** When true, `children` are rendered in place of the placeholder. */\n  isLoaded?: boolean;\n  /** Real content, rendered once `isLoaded` is true. */\n  children?: React.ReactNode;\n  /** Applied to the placeholder wrapper. Note the wrapper is `aria-hidden`, so this is intended for styling and testing rather than as an ARIA target. */\n  id?: string;\n  /** Additional class names appended to the placeholder wrapper. */\n  customCssClass?: string;\n}\n\n// Sizes, calc(), min(), var(--x) and the like. Excludes `;`, `:`, quotes, braces and backslashes, which\n// could end the declaration in a server-rendered style attribute, since React does not escape them.\nconst CSS_SIZE_PATTERN = /^[\\w\\s.%()+\\-*/,]+$/;\n\nconst toCssSize = (value: string | number): string | undefined => {\n  if (typeof value === 'number') {\n    return Number.isFinite(value) ? `${ value }px` : undefined;\n  }\n  return typeof value === 'string' && CSS_SIZE_PATTERN.test(value) ? value : undefined;\n};\n\nexport const Skeleton: React.FC<SkeletonProps> = (\n  {\n    variant = 'text',\n    width,\n    height,\n    lines = 1,\n    animation = 'wave',\n    appearance = 'subtle',\n    isLoaded = false,\n    children,\n    id,\n    customCssClass = ''\n  }\n) => {\n  if (isLoaded) return <>{ children }</>;\n\n  const rowCount = Number.isFinite(lines) ? Math.max(1, Math.floor(lines)) : 1;\n  const barCount = variant === 'text' ? rowCount : 1;\n  const animationCssClass = animation ? `skeleton_${ animation }` : 'skeleton_noAnimation';\n\n  const skeletonStyle: Record<string, string> = {};\n\n  const cssWidth = width === undefined ? undefined : toCssSize(width);\n  const cssHeight = height === undefined || variant === 'circle' ? undefined : toCssSize(height);\n\n  if (cssWidth) {\n    skeletonStyle['--skeletonWidth'] = cssWidth;\n  }\n\n  if (cssHeight) {\n    skeletonStyle['--skeletonHeight'] = cssHeight;\n  }\n\n  return (\n    <span\n      id={ id }\n      aria-hidden=\"true\"\n      className={ `skeleton skeleton_${ variant } skeleton_${ appearance } ${ animationCssClass } ${ customCssClass }` }\n      style={ skeletonStyle as React.CSSProperties }\n    >\n      { Array.from({ length: barCount }, (_bar, index) => (\n        <span key={ index } className=\"skeletonBar\" />\n      )) }\n    </span>\n  );\n};\n\nexport default Skeleton;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,iBAAiB;AAyBxB;AACA;AACA,MAAMC,gBAAgB,GAAG,qBAAqB;AAE9C,MAAMC,SAAS,GAAIC,KAAsB,IAAyB;EAChE,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;IAC7B,OAAOC,MAAM,CAACC,QAAQ,CAACF,KAAK,CAAC,GAAG,GAAIA,KAAK,IAAK,GAAGG,SAAS;EAC5D;EACA,OAAO,OAAOH,KAAK,KAAK,QAAQ,IAAIF,gBAAgB,CAACM,IAAI,CAACJ,KAAK,CAAC,GAAGA,KAAK,GAAGG,SAAS;AACtF,CAAC;AAED,OAAO,MAAME,QAAiC,GAAGA,CAC/C;EACEC,OAAO,GAAG,MAAM;EAChBC,KAAK;EACLC,MAAM;EACNC,KAAK,GAAG,CAAC;EACTC,SAAS,GAAG,MAAM;EAClBC,UAAU,GAAG,QAAQ;EACrBC,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,EAAE;EACFC,cAAc,GAAG;AACnB,CAAC,KACE;EACH,IAAIH,QAAQ,EAAE,oBAAOf,KAAA,CAAAmB,aAAA,CAAAnB,KAAA,CAAAoB,QAAA,QAAIJ,QAAY,CAAC;EAEtC,MAAMK,QAAQ,GAAGjB,MAAM,CAACC,QAAQ,CAACO,KAAK,CAAC,GAAGU,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAACZ,KAAK,CAAC,CAAC,GAAG,CAAC;EAC5E,MAAMa,QAAQ,GAAGhB,OAAO,KAAK,MAAM,GAAGY,QAAQ,GAAG,CAAC;EAClD,MAAMK,iBAAiB,GAAGb,SAAS,GAAG,YAAaA,SAAS,EAAG,GAAG,sBAAsB;EAExF,MAAMc,aAAqC,GAAG,CAAC,CAAC;EAEhD,MAAMC,QAAQ,GAAGlB,KAAK,KAAKJ,SAAS,GAAGA,SAAS,GAAGJ,SAAS,CAACQ,KAAK,CAAC;EACnE,MAAMmB,SAAS,GAAGlB,MAAM,KAAKL,SAAS,IAAIG,OAAO,KAAK,QAAQ,GAAGH,SAAS,GAAGJ,SAAS,CAACS,MAAM,CAAC;EAE9F,IAAIiB,QAAQ,EAAE;IACZD,aAAa,CAAC,iBAAiB,CAAC,GAAGC,QAAQ;EAC7C;EAEA,IAAIC,SAAS,EAAE;IACbF,aAAa,CAAC,kBAAkB,CAAC,GAAGE,SAAS;EAC/C;EAEA,oBACE7B,KAAA,CAAAmB,aAAA;IACEF,EAAE,EAAGA,EAAI;IACT,eAAY,MAAM;IAClBa,SAAS,EAAG,qBAAsBrB,OAAO,aAAeK,UAAU,IAAMY,iBAAiB,IAAMR,cAAc,EAAK;IAClHa,KAAK,EAAGJ;EAAsC,GAE5CK,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAET;EAAS,CAAC,EAAE,CAACU,IAAI,EAAEC,KAAK,kBAC7CpC,KAAA,CAAAmB,aAAA;IAAMkB,GAAG,EAAGD,KAAO;IAACN,SAAS,EAAC;EAAa,CAAE,CAC9C,CACG,CAAC;AAEX,CAAC;AAED,eAAetB,QAAQ","ignoreList":[]}

package/dist/esm/components/design/themeLoader/ThemeLoader.js

@@ -11,7 +11,7 @@ export const ThemeLoader = ({
   forceProd = false,
   forceCacheBusting = false,
   userTheme,
-  useLatest = true
+  useLatest = false
 }) => {
   const baseCssLink = useRef(null);
   const themeCssLink = useRef(null);

package/dist/esm/components/design/themeLoader/ThemeLoader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeLoader.js","names":["React","useContext","useEffect","useRef","useMemo","libraryThemes","AppContext","CURRENT_DOMAIN","LIBRARY_CDN_DEV_BASE_URL","LIBRARY_CDN_PROD_BASE_URL","LIBRARY_VERSION","themes","ThemeLoader","useMin","forceProd","forceCacheBusting","userTheme","useLatest","baseCssLink","themeCssLink","appContextProvider","appTheme","appContext","theme","activeTheme","publicLibraryDomain","env","process","NODE_ENV","isProduction","isDevelopment","cdnBaseUrl","getThemeCss","console","warn","buildPath","dev","min","versioned","cssFile","css","cacheBuster","Date","getTime","libraryDomain","baseCss","themeCss","current","href","createElement","Fragment","ref","rel","as"],"sources":["../../../../../src/components/design/themeLoader/ThemeLoader.tsx"],"sourcesContent":["'use client';\n\nimport React, { useContext, useEffect, useRef, useMemo } from 'react';\n\nimport libraryThemes from '../../../autoGenerated/libraryThemes';\nimport { AppContext } from '../../../contextProviders/appContext/AppContextProvider';\nimport { CURRENT_DOMAIN } from '../../../constants/appEnvironment';\nimport { LIBRARY_CDN_DEV_BASE_URL, LIBRARY_CDN_PROD_BASE_URL, LIBRARY_VERSION } from '../../../constants/libraryCDN';\n\nexport type ThemeStructure = {\n  buildPath: string;\n  dev: {\n    css: string;\n    map: string;\n  };\n  min: {\n    css: string;\n    map: string;\n  };\n  versioned: {\n    css: string;\n    map: string;\n  };\n};\n\ntype AvailableThemes = {\n  [themeName: string]: ThemeStructure;\n};\n\ntype themeLoaderProps = {\n  useMin?: boolean,\n  forceProd?: boolean,\n  forceCacheBusting?: boolean,\n  userTheme?: string;\n  useLatest?: boolean;\n};\n\nconst themes: AvailableThemes = libraryThemes || {};\n\nexport const ThemeLoader: React.FC<themeLoaderProps> = (\n  {\n    useMin = false,\n    forceProd = false,\n    forceCacheBusting = false,\n    userTheme,\n    useLatest = true,\n  }\n) => {\n  const baseCssLink = useRef<HTMLLinkElement>(null);\n  const themeCssLink = useRef<HTMLLinkElement>(null);\n\n  const appContextProvider = useContext(AppContext);\n  const appTheme = appContextProvider?.appContext?.theme;\n\n  const activeTheme = userTheme || appTheme;\n  const publicLibraryDomain = appContextProvider?.appContext?.publicLibraryDomain || '';\n\n  const env = process.env.NODE_ENV;\n  const isProduction = env === 'production' || env === 'prod';\n  const isDevelopment = env === 'development' || env === 'dev';\n\n  const cdnBaseUrl = `${ isProduction ? LIBRARY_CDN_PROD_BASE_URL : LIBRARY_CDN_DEV_BASE_URL }/${ useLatest ? 'latest' : LIBRARY_VERSION }`;\n\n  const getThemeCss = (theme: string | undefined) => {\n    if (!theme || !themes[theme]) {\n      console.warn(`Theme \"${ theme }\" not found. Using default variables instead.`);\n      return null;\n    }\n\n    const {\n      buildPath, dev, min, versioned\n    } = themes[theme];\n\n    const cssFile = () => {\n      if (forceProd) {\n        return versioned.css;\n      }\n\n      if (isProduction) {\n        return useMin ? versioned.css : min.css;\n      }\n\n      if (isDevelopment) {\n        return useMin ? min.css : dev.css;\n      }\n\n      return dev.css;\n    };\n\n    const cacheBuster = CURRENT_DOMAIN === 'localhost' || forceCacheBusting ? `?v=${ new Date().getTime() }` : '';\n    const libraryDomain = publicLibraryDomain !== '' ? `${ publicLibraryDomain }` : cdnBaseUrl;\n\n    return `${ libraryDomain }/${ buildPath }/${ cssFile() }${ cacheBuster }`;\n  };\n\n  const baseCss = useMemo(() => getThemeCss('base'), [activeTheme, useMin, forceProd, forceCacheBusting]);\n  const themeCss = useMemo(() => getThemeCss(activeTheme), [activeTheme, useMin, forceProd, forceCacheBusting]);\n\n  useEffect(() => {\n    if (baseCss && baseCssLink.current) {\n      baseCssLink.current.href = baseCss;\n    }\n    if (themeCss && themeCssLink.current) {\n      themeCssLink.current.href = themeCss;\n    }\n  }, [activeTheme]);\n\n  return (\n    <>\n      <link ref={ baseCssLink } rel=\"stylesheet\" as=\"style\" />\n      <link ref={ themeCssLink } rel=\"stylesheet\" as=\"style\" />\n    </>\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ThemeLoader.js","names":["React","useContext","useEffect","useRef","useMemo","libraryThemes","AppContext","CURRENT_DOMAIN","LIBRARY_CDN_DEV_BASE_URL","LIBRARY_CDN_PROD_BASE_URL","LIBRARY_VERSION","themes","ThemeLoader","useMin","forceProd","forceCacheBusting","userTheme","useLatest","baseCssLink","themeCssLink","appContextProvider","appTheme","appContext","theme","activeTheme","publicLibraryDomain","env","process","NODE_ENV","isProduction","isDevelopment","cdnBaseUrl","getThemeCss","console","warn","buildPath","dev","min","versioned","cssFile","css","cacheBuster","Date","getTime","libraryDomain","baseCss","themeCss","current","href","createElement","Fragment","ref","rel","as"],"sources":["../../../../../src/components/design/themeLoader/ThemeLoader.tsx"],"sourcesContent":["'use client';\n\nimport React, { useContext, useEffect, useRef, useMemo } from 'react';\n\nimport libraryThemes from '../../../autoGenerated/libraryThemes';\nimport { AppContext } from '../../../contextProviders/appContext/AppContextProvider';\nimport { CURRENT_DOMAIN } from '../../../constants/appEnvironment';\nimport { LIBRARY_CDN_DEV_BASE_URL, LIBRARY_CDN_PROD_BASE_URL, LIBRARY_VERSION } from '../../../constants/libraryCDN';\n\nexport type ThemeStructure = {\n  buildPath: string;\n  dev: {\n    css: string;\n    map: string;\n  };\n  min: {\n    css: string;\n    map: string;\n  };\n  versioned: {\n    css: string;\n    map: string;\n  };\n};\n\ntype AvailableThemes = {\n  [themeName: string]: ThemeStructure;\n};\n\ntype themeLoaderProps = {\n  useMin?: boolean,\n  forceProd?: boolean,\n  forceCacheBusting?: boolean,\n  userTheme?: string;\n  // Load the CDN's `latest` stylesheets instead of those for the installed library version. Off by\n  // default: `latest` changes under the app on every release, so it can restyle apps that never\n  // upgraded with CSS written for components they do not have.\n  useLatest?: boolean;\n};\n\nconst themes: AvailableThemes = libraryThemes || {};\n\nexport const ThemeLoader: React.FC<themeLoaderProps> = (\n  {\n    useMin = false,\n    forceProd = false,\n    forceCacheBusting = false,\n    userTheme,\n    useLatest = false,\n  }\n) => {\n  const baseCssLink = useRef<HTMLLinkElement>(null);\n  const themeCssLink = useRef<HTMLLinkElement>(null);\n\n  const appContextProvider = useContext(AppContext);\n  const appTheme = appContextProvider?.appContext?.theme;\n\n  const activeTheme = userTheme || appTheme;\n  const publicLibraryDomain = appContextProvider?.appContext?.publicLibraryDomain || '';\n\n  const env = process.env.NODE_ENV;\n  const isProduction = env === 'production' || env === 'prod';\n  const isDevelopment = env === 'development' || env === 'dev';\n\n  const cdnBaseUrl = `${ isProduction ? LIBRARY_CDN_PROD_BASE_URL : LIBRARY_CDN_DEV_BASE_URL }/${ useLatest ? 'latest' : LIBRARY_VERSION }`;\n\n  const getThemeCss = (theme: string | undefined) => {\n    if (!theme || !themes[theme]) {\n      console.warn(`Theme \"${ theme }\" not found. Using default variables instead.`);\n      return null;\n    }\n\n    const {\n      buildPath, dev, min, versioned\n    } = themes[theme];\n\n    const cssFile = () => {\n      if (forceProd) {\n        return versioned.css;\n      }\n\n      if (isProduction) {\n        return useMin ? versioned.css : min.css;\n      }\n\n      if (isDevelopment) {\n        return useMin ? min.css : dev.css;\n      }\n\n      return dev.css;\n    };\n\n    const cacheBuster = CURRENT_DOMAIN === 'localhost' || forceCacheBusting ? `?v=${ new Date().getTime() }` : '';\n    const libraryDomain = publicLibraryDomain !== '' ? `${ publicLibraryDomain }` : cdnBaseUrl;\n\n    return `${ libraryDomain }/${ buildPath }/${ cssFile() }${ cacheBuster }`;\n  };\n\n  const baseCss = useMemo(() => getThemeCss('base'), [activeTheme, useMin, forceProd, forceCacheBusting]);\n  const themeCss = useMemo(() => getThemeCss(activeTheme), [activeTheme, useMin, forceProd, forceCacheBusting]);\n\n  useEffect(() => {\n    if (baseCss && baseCssLink.current) {\n      baseCssLink.current.href = baseCss;\n    }\n    if (themeCss && themeCssLink.current) {\n      themeCssLink.current.href = themeCss;\n    }\n  }, [activeTheme]);\n\n  return (\n    <>\n      <link ref={ baseCssLink } rel=\"stylesheet\" as=\"style\" />\n      <link ref={ themeCssLink } rel=\"stylesheet\" as=\"style\" />\n    </>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/form/buttons/SimpleButton.js

@@ -17,6 +17,7 @@ export const SimpleButton = /*#__PURE__*/forwardRef(({
   disabledMessage = 'This button has been disabled temporarily. There is likely an issue elsewhere on your form that needs to be resolved first.',
   onClickHandler = () => {},
   buttonStyle,
+  ariaPressed,
   children
 }, ref) => {
   const buttonCssClass = useMemo(() => {
@@ -42,7 +43,8 @@ export const SimpleButton = /*#__PURE__*/forwardRef(({
     className: buttonCssClass,
     type: buttonType,
     onClick: onClickHandler,
-    disabled: disabled
+    disabled: disabled,
+    "aria-pressed": ariaPressed
   }, disabled && {
     'aria-describedby': disabledMessageId
   }), renderIcon(leftIcon), /*#__PURE__*/React.createElement("span", {

package/dist/esm/components/form/buttons/SimpleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleButton.js","names":["_extends","React","useMemo","forwardRef","renderIcon","generateButtonClass","SimpleButton","buttonType","leftIcon","rightIcon","hideLabel","label","title","id","cssClass","disabled","disabledMessage","onClickHandler","buttonStyle","children","ref","buttonCssClass","disabledMessageId","buttonHoverTitle","createElement","Fragment","className","type","onClick","Button"],"sources":["../../../../../src/components/form/buttons/SimpleButton.tsx"],"sourcesContent":["'use client';\n\nimport React, { useMemo, forwardRef } from 'react';\nimport { ButtonProps } from './button.interface';\nimport { renderIcon } from '../../../helpers/iconHelpers';\nimport { generateButtonClass } from './button.helpers';\n\nexport const SimpleButton = forwardRef<HTMLButtonElement, ButtonProps>((\n  {\n    buttonType = 'button',\n    leftIcon,\n    rightIcon,\n    hideLabel = false,\n    label = 'A button',\n    title,\n    id = 'buttonIdRequired',\n    cssClass = 'button primary',\n    disabled = false,\n    disabledMessage = 'This button has been disabled temporarily. There is likely an issue elsewhere on your form that needs to be resolved first.',\n    onClickHandler = () => { },\n    buttonStyle,\n    children\n  },\n  ref\n) => {\n  \n  const buttonCssClass = useMemo(() => {\n    return generateButtonClass({ cssClass, buttonStyle, hideLabel });\n  }, [cssClass, buttonStyle, hideLabel]);\n\n  const disabledMessageId = `${ id }-disabledMessage`;\n\n  const buttonHoverTitle = () => {\n    if (title) {\n      return title;\n    }\n    if (hideLabel && typeof label === 'string') {\n      return label;\n    }\n  };\n\n  return (\n    <>\n      <button\n        ref={ ref }\n        id={ id }\n        title={ buttonHoverTitle() }\n        className={ buttonCssClass }\n        type={ buttonType }\n        onClick={ onClickHandler }\n        disabled={ disabled }\n        { ...(disabled && { 'aria-describedby': disabledMessageId }) }\n      >\n        { renderIcon(leftIcon) }\n\n        <span className={ `${ hideLabel ? 'sr-only' : 'labelText' }` }>{ label }</span>\n\n        { children }\n\n        { renderIcon(rightIcon) }\n      </button>\n      {\n        disabled && (\n          <span id={ disabledMessageId } className=\"sr-only\">\n            {\n              disabledMessage\n            }\n          </span>\n        )\n      }\n    </>\n  );\n});\n\nexport default SimpleButton;\n\nexport { SimpleButton as Button };"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,IAAIC,OAAO,EAAEC,UAAU,QAAQ,OAAO;AAElD,SAASC,UAAU,QAAQ,8BAA8B;AACzD,SAASC,mBAAmB,QAAQ,kBAAkB;AAEtD,OAAO,MAAMC,YAAY,gBAAGH,UAAU,CAAiC,CACrE;EACEI,UAAU,GAAG,QAAQ;EACrBC,QAAQ;EACRC,SAAS;EACTC,SAAS,GAAG,KAAK;EACjBC,KAAK,GAAG,UAAU;EAClBC,KAAK;EACLC,EAAE,GAAG,kBAAkB;EACvBC,QAAQ,GAAG,gBAAgB;EAC3BC,QAAQ,GAAG,KAAK;EAChBC,eAAe,GAAG,6HAA6H;EAC/IC,cAAc,GAAGA,CAAA,KAAM,CAAE,CAAC;EAC1BC,WAAW;EACXC;AACF,CAAC,EACDC,GAAG,KACA;EAEH,MAAMC,cAAc,GAAGnB,OAAO,CAAC,MAAM;IACnC,OAAOG,mBAAmB,CAAC;MAAES,QAAQ;MAAEI,WAAW;MAAER;IAAU,CAAC,CAAC;EAClE,CAAC,EAAE,CAACI,QAAQ,EAAEI,WAAW,EAAER,SAAS,CAAC,CAAC;EAEtC,MAAMY,iBAAiB,GAAG,GAAIT,EAAE,kBAAmB;EAEnD,MAAMU,gBAAgB,GAAGA,CAAA,KAAM;IAC7B,IAAIX,KAAK,EAAE;MACT,OAAOA,KAAK;IACd;IACA,IAAIF,SAAS,IAAI,OAAOC,KAAK,KAAK,QAAQ,EAAE;MAC1C,OAAOA,KAAK;IACd;EACF,CAAC;EAED,oBACEV,KAAA,CAAAuB,aAAA,CAAAvB,KAAA,CAAAwB,QAAA,qBACExB,KAAA,CAAAuB,aAAA,WAAAxB,QAAA;IACEoB,GAAG,EAAGA,GAAK;IACXP,EAAE,EAAGA,EAAI;IACTD,KAAK,EAAGW,gBAAgB,CAAC,CAAG;IAC5BG,SAAS,EAAGL,cAAgB;IAC5BM,IAAI,EAAGpB,UAAY;IACnBqB,OAAO,EAAGX,cAAgB;IAC1BF,QAAQ,EAAGA;EAAU,GACfA,QAAQ,IAAI;IAAE,kBAAkB,EAAEO;EAAkB,CAAC,GAEzDlB,UAAU,CAACI,QAAQ,CAAC,eAEtBP,KAAA,CAAAuB,aAAA;IAAME,SAAS,EAAG,GAAIhB,SAAS,GAAG,SAAS,GAAG,WAAW;EAAK,GAAGC,KAAa,CAAC,EAE7EQ,QAAQ,EAERf,UAAU,CAACK,SAAS,CAChB,CAAC,EAEPM,QAAQ,iBACNd,KAAA,CAAAuB,aAAA;IAAMX,EAAE,EAAGS,iBAAmB;IAACI,SAAS,EAAC;EAAS,GAE9CV,eAEE,CAGV,CAAC;AAEP,CAAC,CAAC;AAEF,eAAeV,YAAY;AAE3B,SAASA,YAAY,IAAIuB,MAAM","ignoreList":[]}
+{"version":3,"file":"SimpleButton.js","names":["_extends","React","useMemo","forwardRef","renderIcon","generateButtonClass","SimpleButton","buttonType","leftIcon","rightIcon","hideLabel","label","title","id","cssClass","disabled","disabledMessage","onClickHandler","buttonStyle","ariaPressed","children","ref","buttonCssClass","disabledMessageId","buttonHoverTitle","createElement","Fragment","className","type","onClick","Button"],"sources":["../../../../../src/components/form/buttons/SimpleButton.tsx"],"sourcesContent":["'use client';\n\nimport React, { useMemo, forwardRef } from 'react';\nimport { ButtonProps } from './button.interface';\nimport { renderIcon } from '../../../helpers/iconHelpers';\nimport { generateButtonClass } from './button.helpers';\n\nexport const SimpleButton = forwardRef<HTMLButtonElement, ButtonProps>((\n  {\n    buttonType = 'button',\n    leftIcon,\n    rightIcon,\n    hideLabel = false,\n    label = 'A button',\n    title,\n    id = 'buttonIdRequired',\n    cssClass = 'button primary',\n    disabled = false,\n    disabledMessage = 'This button has been disabled temporarily. There is likely an issue elsewhere on your form that needs to be resolved first.',\n    onClickHandler = () => { },\n    buttonStyle,\n    ariaPressed,\n    children\n  },\n  ref\n) => {\n  \n  const buttonCssClass = useMemo(() => {\n    return generateButtonClass({ cssClass, buttonStyle, hideLabel });\n  }, [cssClass, buttonStyle, hideLabel]);\n\n  const disabledMessageId = `${ id }-disabledMessage`;\n\n  const buttonHoverTitle = () => {\n    if (title) {\n      return title;\n    }\n    if (hideLabel && typeof label === 'string') {\n      return label;\n    }\n  };\n\n  return (\n    <>\n      <button\n        ref={ ref }\n        id={ id }\n        title={ buttonHoverTitle() }\n        className={ buttonCssClass }\n        type={ buttonType }\n        onClick={ onClickHandler }\n        disabled={ disabled }\n        aria-pressed={ ariaPressed }\n        { ...(disabled && { 'aria-describedby': disabledMessageId }) }\n      >\n        { renderIcon(leftIcon) }\n\n        <span className={ `${ hideLabel ? 'sr-only' : 'labelText' }` }>{ label }</span>\n\n        { children }\n\n        { renderIcon(rightIcon) }\n      </button>\n      {\n        disabled && (\n          <span id={ disabledMessageId } className=\"sr-only\">\n            {\n              disabledMessage\n            }\n          </span>\n        )\n      }\n    </>\n  );\n});\n\nexport default SimpleButton;\n\nexport { SimpleButton as Button };"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,IAAIC,OAAO,EAAEC,UAAU,QAAQ,OAAO;AAElD,SAASC,UAAU,QAAQ,8BAA8B;AACzD,SAASC,mBAAmB,QAAQ,kBAAkB;AAEtD,OAAO,MAAMC,YAAY,gBAAGH,UAAU,CAAiC,CACrE;EACEI,UAAU,GAAG,QAAQ;EACrBC,QAAQ;EACRC,SAAS;EACTC,SAAS,GAAG,KAAK;EACjBC,KAAK,GAAG,UAAU;EAClBC,KAAK;EACLC,EAAE,GAAG,kBAAkB;EACvBC,QAAQ,GAAG,gBAAgB;EAC3BC,QAAQ,GAAG,KAAK;EAChBC,eAAe,GAAG,6HAA6H;EAC/IC,cAAc,GAAGA,CAAA,KAAM,CAAE,CAAC;EAC1BC,WAAW;EACXC,WAAW;EACXC;AACF,CAAC,EACDC,GAAG,KACA;EAEH,MAAMC,cAAc,GAAGpB,OAAO,CAAC,MAAM;IACnC,OAAOG,mBAAmB,CAAC;MAAES,QAAQ;MAAEI,WAAW;MAAER;IAAU,CAAC,CAAC;EAClE,CAAC,EAAE,CAACI,QAAQ,EAAEI,WAAW,EAAER,SAAS,CAAC,CAAC;EAEtC,MAAMa,iBAAiB,GAAG,GAAIV,EAAE,kBAAmB;EAEnD,MAAMW,gBAAgB,GAAGA,CAAA,KAAM;IAC7B,IAAIZ,KAAK,EAAE;MACT,OAAOA,KAAK;IACd;IACA,IAAIF,SAAS,IAAI,OAAOC,KAAK,KAAK,QAAQ,EAAE;MAC1C,OAAOA,KAAK;IACd;EACF,CAAC;EAED,oBACEV,KAAA,CAAAwB,aAAA,CAAAxB,KAAA,CAAAyB,QAAA,qBACEzB,KAAA,CAAAwB,aAAA,WAAAzB,QAAA;IACEqB,GAAG,EAAGA,GAAK;IACXR,EAAE,EAAGA,EAAI;IACTD,KAAK,EAAGY,gBAAgB,CAAC,CAAG;IAC5BG,SAAS,EAAGL,cAAgB;IAC5BM,IAAI,EAAGrB,UAAY;IACnBsB,OAAO,EAAGZ,cAAgB;IAC1BF,QAAQ,EAAGA,QAAU;IACrB,gBAAeI;EAAa,GACtBJ,QAAQ,IAAI;IAAE,kBAAkB,EAAEQ;EAAkB,CAAC,GAEzDnB,UAAU,CAACI,QAAQ,CAAC,eAEtBP,KAAA,CAAAwB,aAAA;IAAME,SAAS,EAAG,GAAIjB,SAAS,GAAG,SAAS,GAAG,WAAW;EAAK,GAAGC,KAAa,CAAC,EAE7ES,QAAQ,EAERhB,UAAU,CAACK,SAAS,CAChB,CAAC,EAEPM,QAAQ,iBACNd,KAAA,CAAAwB,aAAA;IAAMZ,EAAE,EAAGU,iBAAmB;IAACI,SAAS,EAAC;EAAS,GAE9CX,eAEE,CAGV,CAAC;AAEP,CAAC,CAAC;AAEF,eAAeV,YAAY;AAE3B,SAASA,YAAY,IAAIwB,MAAM","ignoreList":[]}

package/dist/esm/components/form/buttons/button.interface.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.interface.js","names":[],"sources":["../../../../../src/components/form/buttons/button.interface.ts"],"sourcesContent":["import { ReactElement, ReactNode, RefObject } from 'react';\nimport { IconSource } from '../../../helpers/iconHelpers';\nimport { GenericFunction } from '../../../interfaces/generic.interface';\nimport { ButtonClassCombination } from './buttonVariations';\n\nexport interface ButtonStyles {\n  color?: 'primary' | 'secondary' | 'tertiary';\n  variant?: 'solid' | 'outline' | 'text-only' | 'icon-only';\n  size?: 'default' | 'compact';\n}\n\nexport interface ButtonProps {\n  label: string | ReactNode;\n  id: string;\n  title?: string;\n  cssClass?: string | ButtonClassCombination;\n  onClickHandler?: GenericFunction;\n  buttonType?: 'button' | 'submit' | 'reset';\n  buttonStyle?: ButtonStyles;\n  leftIcon?: IconSource;\n  rightIcon?: IconSource;\n  hideLabel?: boolean;\n  children?: ReactNode | ReactElement;\n  disabled?: boolean;\n  disabledMessage?: string;\n  ref?: RefObject<HTMLButtonElement>;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"button.interface.js","names":[],"sources":["../../../../../src/components/form/buttons/button.interface.ts"],"sourcesContent":["import { ReactElement, ReactNode, RefObject } from 'react';\nimport { IconSource } from '../../../helpers/iconHelpers';\nimport { GenericFunction } from '../../../interfaces/generic.interface';\nimport { ButtonClassCombination } from './buttonVariations';\n\nexport interface ButtonStyles {\n  color?: 'primary' | 'secondary' | 'tertiary';\n  variant?: 'solid' | 'outline' | 'text-only' | 'icon-only';\n  size?: 'default' | 'compact';\n}\n\nexport interface ButtonProps {\n  label: string | ReactNode;\n  id: string;\n  title?: string;\n  cssClass?: string | ButtonClassCombination;\n  onClickHandler?: GenericFunction;\n  buttonType?: 'button' | 'submit' | 'reset';\n  buttonStyle?: ButtonStyles;\n  leftIcon?: IconSource;\n  rightIcon?: IconSource;\n  hideLabel?: boolean;\n  children?: ReactNode | ReactElement;\n  disabled?: boolean;\n  disabledMessage?: string;\n  // Makes the button a toggle; set for buttons that switch a state on or off, e.g. a view selector.\n  ariaPressed?: boolean;\n  ref?: RefObject<HTMLButtonElement>;\n}\n"],"mappings":"","ignoreList":[]}

package/dist/esm/components/form/buttons/userPicButton/UserPicButton.js

@@ -5,12 +5,14 @@ import React from 'react';
 import { SimpleButton } from '../SimpleButton';
 import { Icon } from '../../../design/icons/basicIcon/Icon';
 import { getInitialsOrAcronym } from '../../../../helpers/stringHelpers';
+import { toCssImageUrl } from '../../../../helpers/urlHelpers';
 import './userPicButton.css';
 export const UserPicButton = props => {
   const {
     user,
     ...buttonProps
   } = props;
+  const backgroundImage = toCssImageUrl(user.imageUrl);
   return /*#__PURE__*/React.createElement(SimpleButton, _extends({}, buttonProps, {
     hideLabel: true,
     cssClass: "button icon_only userPicButton"
@@ -18,9 +20,9 @@ export const UserPicButton = props => {
     title: user.fullName || 'User profile',
     className: "userPicFallbacks"
   }, /*#__PURE__*/React.createElement("span", {
-    style: {
-      backgroundImage: `url(${user.imageUrl})`
-    },
+    style: backgroundImage ? {
+      backgroundImage
+    } : undefined,
     className: "userPic"
   }), user.fullName && /*#__PURE__*/React.createElement("span", {
     className: "userInitials"

package/dist/esm/components/form/buttons/userPicButton/UserPicButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserPicButton.js","names":["_extends","React","SimpleButton","Icon","getInitialsOrAcronym","UserPicButton","props","user","buttonProps","createElement","hideLabel","cssClass","title","fullName","className","style","backgroundImage","imageUrl","icon","customCssClass"],"sources":["../../../../../../src/components/form/buttons/userPicButton/UserPicButton.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { ButtonProps } from '../button.interface';\nimport { SimpleButton } from '../SimpleButton';\nimport { Icon } from '../../../design/icons/basicIcon/Icon';\nimport { getInitialsOrAcronym } from '../../../../helpers/stringHelpers';\n\nimport './userPicButton.scss';\n\nexport interface UserPicButtonProps extends ButtonProps {\n  user: {\n    imageUrl?: string;\n    fullName?: string;\n  }\n}\n\nexport const UserPicButton: React.FC<UserPicButtonProps> = (props) => {\n  const {\n    user, ...buttonProps\n  } = props;\n\n  return (\n    <SimpleButton { ...buttonProps } hideLabel cssClass=\"button icon_only userPicButton\">\n      <span title={ user.fullName || 'User profile' } className=\"userPicFallbacks\">\n        <span\n          style={\n            {\n              backgroundImage: `url(${ user.imageUrl })`\n            }\n          }\n          className=\"userPic\"\n        />\n        {\n          user.fullName\n          && (\n            <span className=\"userInitials\">\n              { getInitialsOrAcronym(user.fullName) }\n            </span>\n          )\n        }\n        <Icon icon=\"user\" customCssClass=\"userPicFallbackIcon\" />\n      </span>\n    </SimpleButton>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,IAAI,QAAQ,sCAAsC;AAC3D,SAASC,oBAAoB,QAAQ,mCAAmC;AAExE,OAAO,sBAAsB;AAS7B,OAAO,MAAMC,aAA2C,GAAIC,KAAK,IAAK;EACpE,MAAM;IACJC,IAAI;IAAE,GAAGC;EACX,CAAC,GAAGF,KAAK;EAET,oBACEL,KAAA,CAAAQ,aAAA,CAACP,YAAY,EAAAF,QAAA,KAAMQ,WAAW;IAAGE,SAAS;IAACC,QAAQ,EAAC;EAAgC,iBAClFV,KAAA,CAAAQ,aAAA;IAAMG,KAAK,EAAGL,IAAI,CAACM,QAAQ,IAAI,cAAgB;IAACC,SAAS,EAAC;EAAkB,gBAC1Eb,KAAA,CAAAQ,aAAA;IACEM,KAAK,EACH;MACEC,eAAe,EAAE,OAAQT,IAAI,CAACU,QAAQ;IACxC,CACD;IACDH,SAAS,EAAC;EAAS,CACpB,CAAC,EAEAP,IAAI,CAACM,QAAQ,iBAEXZ,KAAA,CAAAQ,aAAA;IAAMK,SAAS,EAAC;EAAc,GAC1BV,oBAAoB,CAACG,IAAI,CAACM,QAAQ,CAChC,CACP,eAEHZ,KAAA,CAAAQ,aAAA,CAACN,IAAI;IAACe,IAAI,EAAC,MAAM;IAACC,cAAc,EAAC;EAAqB,CAAE,CACpD,CACM,CAAC;AAEnB,CAAC","ignoreList":[]}
+{"version":3,"file":"UserPicButton.js","names":["_extends","React","SimpleButton","Icon","getInitialsOrAcronym","toCssImageUrl","UserPicButton","props","user","buttonProps","backgroundImage","imageUrl","createElement","hideLabel","cssClass","title","fullName","className","style","undefined","icon","customCssClass"],"sources":["../../../../../../src/components/form/buttons/userPicButton/UserPicButton.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { ButtonProps } from '../button.interface';\nimport { SimpleButton } from '../SimpleButton';\nimport { Icon } from '../../../design/icons/basicIcon/Icon';\nimport { getInitialsOrAcronym } from '../../../../helpers/stringHelpers';\nimport { toCssImageUrl } from '../../../../helpers/urlHelpers';\n\nimport './userPicButton.scss';\n\nexport interface UserPicButtonProps extends ButtonProps {\n  user: {\n    imageUrl?: string;\n    fullName?: string;\n  }\n}\n\nexport const UserPicButton: React.FC<UserPicButtonProps> = (props) => {\n  const {\n    user, ...buttonProps\n  } = props;\n  const backgroundImage = toCssImageUrl(user.imageUrl);\n\n  return (\n    <SimpleButton { ...buttonProps } hideLabel cssClass=\"button icon_only userPicButton\">\n      <span title={ user.fullName || 'User profile' } className=\"userPicFallbacks\">\n        <span\n          style={ backgroundImage ? { backgroundImage } : undefined }\n          className=\"userPic\"\n        />\n        {\n          user.fullName\n          && (\n            <span className=\"userInitials\">\n              { getInitialsOrAcronym(user.fullName) }\n            </span>\n          )\n        }\n        <Icon icon=\"user\" customCssClass=\"userPicFallbackIcon\" />\n      </span>\n    </SimpleButton>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,IAAI,QAAQ,sCAAsC;AAC3D,SAASC,oBAAoB,QAAQ,mCAAmC;AACxE,SAASC,aAAa,QAAQ,gCAAgC;AAE9D,OAAO,sBAAsB;AAS7B,OAAO,MAAMC,aAA2C,GAAIC,KAAK,IAAK;EACpE,MAAM;IACJC,IAAI;IAAE,GAAGC;EACX,CAAC,GAAGF,KAAK;EACT,MAAMG,eAAe,GAAGL,aAAa,CAACG,IAAI,CAACG,QAAQ,CAAC;EAEpD,oBACEV,KAAA,CAAAW,aAAA,CAACV,YAAY,EAAAF,QAAA,KAAMS,WAAW;IAAGI,SAAS;IAACC,QAAQ,EAAC;EAAgC,iBAClFb,KAAA,CAAAW,aAAA;IAAMG,KAAK,EAAGP,IAAI,CAACQ,QAAQ,IAAI,cAAgB;IAACC,SAAS,EAAC;EAAkB,gBAC1EhB,KAAA,CAAAW,aAAA;IACEM,KAAK,EAAGR,eAAe,GAAG;MAAEA;IAAgB,CAAC,GAAGS,SAAW;IAC3DF,SAAS,EAAC;EAAS,CACpB,CAAC,EAEAT,IAAI,CAACQ,QAAQ,iBAEXf,KAAA,CAAAW,aAAA;IAAMK,SAAS,EAAC;EAAc,GAC1Bb,oBAAoB,CAACI,IAAI,CAACQ,QAAQ,CAChC,CACP,eAEHf,KAAA,CAAAW,aAAA,CAACT,IAAI;IAACiB,IAAI,EAAC,MAAM;IAACC,cAAc,EAAC;EAAqB,CAAE,CACpD,CACM,CAAC;AAEnB,CAAC","ignoreList":[]}

package/dist/esm/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js

@@ -3,6 +3,7 @@
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { arrowUpFromBracket } from '@x15ventures/x15-ui-library-icons/iconDefinitions';
 import { useFormContext } from 'react-hook-form';
+import { getFileExtension } from '../../../../../../../helpers/fileHelpers';
 import { renderIcon } from '../../../../../../../helpers/iconHelpers';
 import { HookFormWrapper } from '../../../../../hookFormWrapper/HookFormWrapper';
 import { Spinner } from '../../../../../../design/spinner/Spinner';
@@ -13,6 +14,53 @@ import { generateButtonClass } from '../../../../../buttons/button.helpers';
 import { FileAttachmentsList } from '../fileAttachmentList/FileAttachmentsList';
 import { DEFAULT_UPLOAD_FILE_EXTENSIONS, DEFAULT_UPLOAD_FILE_TYPES, BLACKLISTED_FILE_TYPES } from '../../../../../../../constants';
 import './dragAndDropFileUpload.css';
+
+// A dot-file such as `.exe` has no extension by convention, but its name is still checked as one so
+// it cannot slip past the blacklist.
+const getUploadExtension = fileName => getFileExtension(fileName.startsWith('.') ? `upload${fileName}` : fileName);
+const DEFAULT_VALID_FILES = {
+  extensions: DEFAULT_UPLOAD_FILE_EXTENSIONS,
+  fileTypes: DEFAULT_UPLOAD_FILE_TYPES,
+  maxFileCount: 5,
+  maxFileSize: 52428800 // 50 MB
+};
+
+/*
+  Limits-only configurations keep the default type restrictions. Once either `extensions` or
+  `fileTypes` is supplied (even as undefined), both are taken from the configuration so the picker
+  filter and the validation cannot disagree.
+ */
+const resolveValidFiles = customValidFiles => {
+  if (!customValidFiles) {
+    return DEFAULT_VALID_FILES;
+  }
+  const customisesTypes = 'extensions' in customValidFiles || 'fileTypes' in customValidFiles;
+  return customisesTypes ? {
+    ...DEFAULT_VALID_FILES,
+    ...customValidFiles,
+    extensions: customValidFiles.extensions,
+    fileTypes: customValidFiles.fileTypes
+  } : {
+    ...DEFAULT_VALID_FILES,
+    ...customValidFiles
+  };
+};
+
+// Matches a file against `accept`-style tokens: `.ext`, `type/*` or an exact MIME type.
+const matchesFileTypes = (file, fileTypes) => {
+  const extension = getUploadExtension(file.name);
+  const mimeType = file.type.toLowerCase();
+  return fileTypes.some(token => {
+    const normalised = token.trim().toLowerCase();
+    if (normalised.startsWith('.')) {
+      return normalised.slice(1) === extension;
+    }
+    if (normalised.endsWith('/*')) {
+      return mimeType.startsWith(normalised.slice(0, -1));
+    }
+    return normalised !== '' && normalised === mimeType;
+  });
+};
 export const DragAndDropFileUpload = props => /*#__PURE__*/React.createElement(HookFormWrapper, {
   formContext: props.formContext
 }, /*#__PURE__*/React.createElement(DragAndDropFileUploadField, props));
@@ -34,14 +82,10 @@ const DragAndDropFileUploadField = ({
   labelUploadIcon = arrowUpFromBracket,
   multiple = false,
   restrictionsTxt = '',
-  validFiles = {
-    extensions: DEFAULT_UPLOAD_FILE_EXTENSIONS,
-    fileTypes: DEFAULT_UPLOAD_FILE_TYPES,
-    maxFileCount: 5,
-    maxFileSize: 52428800 // 50 MB
-  },
+  validFiles: customValidFiles,
   onFilesChange = () => {}
 }) => {
+  const validFiles = useMemo(() => resolveValidFiles(customValidFiles), [customValidFiles]);
   const {
     setValue,
     trigger
@@ -73,15 +117,16 @@ const DragAndDropFileUploadField = ({
     return () => window.removeEventListener('focus', onFocus);
   }, [trigger, field.name]);
   const supportedFileTypes = useMemo(() => validFiles?.fileTypes?.join(', ') || '', [validFiles?.fileTypes]);
+  const isFileAllowed = useCallback(file => {
+    const ext = getUploadExtension(file.name);
+    const isBlacklisted = BLACKLISTED_FILE_TYPES.includes(ext);
+    // Without an extension allowlist, the picker's file types are enforced so dropped files obey them too.
+    const isValidExt = validFiles.extensions ? validFiles.extensions.includes(ext) : validFiles.fileTypes?.length ? matchesFileTypes(file, validFiles.fileTypes) : true;
+    const isValidSize = validFiles.maxFileSize ? file.size <= validFiles.maxFileSize : true;
+    return !isBlacklisted && isValidExt && isValidSize;
+  }, [validFiles]);
   const validateAndCommit = useCallback(files => {
-    // basic validations
-    const validated = files.filter(file => {
-      const ext = file.name.split('.').pop()?.toLowerCase() || '';
-      const isBlacklisted = BLACKLISTED_FILE_TYPES.includes(ext);
-      const isValidExt = validFiles.extensions ? validFiles.extensions.includes(ext) : true;
-      const isValidSize = validFiles.maxFileSize ? file.size <= validFiles.maxFileSize : true;
-      return !isBlacklisted && isValidExt && isValidSize;
-    });
+    const validated = files.filter(isFileAllowed);
     const clipped = validFiles.maxFileCount ? validated.slice(0, validFiles.maxFileCount) : validated;
     setFileList(clipped);
     setIsTouched(true);
@@ -91,7 +136,7 @@ const DragAndDropFileUploadField = ({
       shouldTouch: true
     });
     onFilesChange(clipped);
-  }, [field.name, onFilesChange, setValue, fileDisplayStyle, validFiles]);
+  }, [field.name, onFilesChange, setValue, isFileAllowed, validFiles]);
   const handleFileInputChange = useCallback(event => {
     const target = event.target;
     const files = Array.from(target.files ?? []);
@@ -103,9 +148,10 @@ const DragAndDropFileUploadField = ({
     validateAndCommit(dropped);
     trigger(field.name);
   }, [trigger, field.name, validateAndCommit]);
-  const handleFilesEdited = useCallback(files => {
-    // No need to validate again as they were already validated
-    // Changes may include renaming or removing files
+  const handleFilesEdited = useCallback(editedFiles => {
+    // Edits may rename files, so they are checked again: renaming `notes.txt` to `notes.exe` must not
+    // get past the extension rules the original name passed.
+    const files = editedFiles.filter(isFileAllowed);
     setFileList(files);
     setValue(field.name, files.length > 0 ? files : null, {
       shouldValidate: true,
@@ -113,7 +159,7 @@ const DragAndDropFileUploadField = ({
       shouldTouch: true
     });
     onFilesChange(files);
-  }, [field.name, setValue, onFilesChange]);
+  }, [field.name, setValue, onFilesChange, isFileAllowed]);
   const wrapperCssClass = `
     formField 
     dragAndDropFileUpload