@x15ventures/x15-ui-library 3.11.4

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

@@ -0,0 +1,287 @@
+/* Popovers */
+.dialogOverlay {
+  position: fixed;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  background: var(--dialogOverlayColor, rgba(0, 0, 0, 0.5));
+  display: none;
+  z-index: 1000000;
+}
+.dialogOverlay.isVisible {
+  display: block;
+}
+
+.dialog {
+  display: none;
+  position: fixed;
+  box-sizing: border-box;
+  background: var(--dialogBg, #fff);
+  color: var(--dialogFg, #222);
+  box-shadow: var(--dialogShadow, 0 0 10px 0 #384147);
+  border: var(--dialogBorder, 1px solid #fff);
+  border-radius: var(--dialogBorderRadius, 3px);
+  z-index: 2000000;
+}
+.dialog.showFocusOutline .dialogContent:focus,
+.dialog.showFocusOutline .dialogHeader:focus,
+.dialog.showFocusOutline .dialogFooter:focus {
+  outline: var(--dialogFocusOutline, 1px dotted #384147);
+}
+.dialog.showFocusOutline .dialogContent:focus {
+  outline-offset: -1px;
+}
+.dialog.isOpen {
+  display: flex;
+}
+.dialog .dialogClose {
+  border-radius: 100%;
+  width: 30px;
+  height: 30px;
+  font-size: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: var(--dialogCloseButtonBorder, none);
+  background: var(--dialogCloseButtonBg, #fff);
+  color: var(--dialogCloseButtonFg, none);
+  box-shadow: var(--dialogCloseButtonShadow, none);
+}
+.dialog .dialogHeader {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  box-sizing: border-box;
+  border-bottom: var(--dialogHeaderBottomBorder, 1px solid #e5ebef);
+  box-shadow: var(--dialogHeaderShadow, none);
+  padding: var(--dialogHeaderPadding, 20px 20px);
+  min-height: var(--dialogHeaderHeight, 50px);
+  width: 100%;
+  max-width: 100%;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.dialog .dialogHeader .dialogHeaderText,
+.dialog .dialogHeader .headerBar {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  max-width: fit-content;
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  width: 100%;
+  max-width: 100%;
+  box-sizing: border-box;
+  margin: 0;
+  font-family: var(--dialogHeaderFont, serif);
+  font-size: var(--dialogHeaderFontSize, clamp(17px, 1vw + 0.5rem, 35px));
+  font-weight: var(--dialogHeaderFontWeight, bold);
+}
+.dialog .dialogHeader .dialogHeaderText h2,
+.dialog .dialogHeader .dialogHeaderText h3,
+.dialog .dialogHeader .dialogHeaderText h4,
+.dialog .dialogHeader .dialogHeaderText h5,
+.dialog .dialogHeader .dialogHeaderText h6,
+.dialog .dialogHeader .headerBar h2,
+.dialog .dialogHeader .headerBar h3,
+.dialog .dialogHeader .headerBar h4,
+.dialog .dialogHeader .headerBar h5,
+.dialog .dialogHeader .headerBar h6 {
+  margin: 0;
+}
+.dialog .dialogContent {
+  padding: var(--dialogContentPadding, 20px);
+  flex: 5;
+  box-sizing: border-box;
+  width: 100%;
+  font-size: var(--dialogContentFontSize, clamp(16px, 0.7vw + 0.5rem, 30px));
+}
+.dialog .dialogFooter {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  box-sizing: border-box;
+  border-top: var(--dialogFooterTopBorder, 1px solid #e5ebef);
+  box-shadow: var(--dialogFooterShadow, none);
+  padding: var(--dialogFooterPadding, 10px 20px);
+  width: 100%;
+  max-width: 100%;
+  font-size: var(--dialogFooterFontSize, clamp(16px, 0.7vw + 0.5rem, 30px));
+}
+.dialog .dialogFooter .dialogFooterText {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  max-width: fit-content;
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  min-height: var(--dialogFooterHeight, 50px);
+}
+.dialog .dialogFullScroller {
+  flex: 1;
+  box-sizing: border-box;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  row-gap: 0;
+  align-items: center;
+  justify-content: flex-start;
+  align-items: flex-start;
+  max-width: 100%;
+}
+.dialog .dialogContentAndFooterScroller {
+  display: flex;
+  flex-direction: column;
+  row-gap: 0;
+  align-items: center;
+  justify-content: flex-start;
+  align-items: flex-start;
+  width: 100%;
+}
+.dialog.dialogScrollBehaviour_all .dialogFullScroller {
+  overflow: auto;
+  max-height: 100%;
+}
+.dialog.dialogScrollBehaviour_contentOnly .dialogContentAndFooterScroller {
+  flex: 1;
+  overflow: auto;
+}
+.dialog.dialogScrollBehaviour_contentOnly .dialogContentAndFooterScroller .dialogContent {
+  overflow: auto;
+  flex: 1;
+}
+.dialog.dialogScrollBehaviour_contentAndFooter .dialogContentAndFooterScroller {
+  overflow: auto;
+  flex: 1;
+}
+.dialog.dialogSize_xs {
+  left: 38vw;
+  top: 38vh;
+  width: 24vw;
+  height: 24vh;
+}
+.dialog.dialogSize_xs .dialogHeaderText,
+.dialog.dialogSize_xs .headerBar {
+  max-width: 24vw;
+}
+.dialog.dialogSize_s {
+  left: 35vw;
+  top: 35vh;
+  width: 30vw;
+  height: 30vh;
+}
+.dialog.dialogSize_s .dialogHeaderText,
+.dialog.dialogSize_s .headerBar {
+  max-width: 30vw;
+}
+.dialog.dialogSize_m {
+  left: 25vw;
+  top: 25vh;
+  width: 50vw;
+  height: 50vh;
+}
+.dialog.dialogSize_l {
+  left: 15vw;
+  top: 15vh;
+  width: 70vw;
+  height: 70vh;
+}
+.dialog.dialogSize_xl {
+  left: 5vw;
+  top: 5vh;
+  width: 90vw;
+  height: 90vh;
+}
+.dialog.dialogSize_dynamic {
+  width: auto;
+  height: auto;
+  max-width: 90vw;
+  max-height: 90vh;
+  overflow: visible;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.dialog.dialogPosition_left {
+  left: 0;
+}
+.dialog.dialogPosition_right {
+  left: auto;
+  right: 0;
+}
+.dialog.dialogPosition_top {
+  top: 0;
+}
+.dialog.dialogPosition_bottom {
+  top: auto;
+  bottom: 0;
+}
+.dialog.dialogPosition_topleft {
+  left: 0;
+  top: 0;
+}
+.dialog.dialogPosition_topright {
+  left: auto;
+  right: 0;
+  top: 0;
+}
+.dialog.dialogPosition_bottomleft {
+  left: 0;
+  top: auto;
+  bottom: 0;
+}
+.dialog.dialogPosition_bottomright {
+  left: auto;
+  right: 0;
+  top: auto;
+  bottom: 0;
+}
+.dialog.dialogAnimation_grow {
+  transform: scale(0.1);
+  animation: grow 2s ease;
+  animation-fill-mode: forwards;
+  animation-iteration-count: 1;
+}
+.dialog.dialogAnimation_reveal {
+  opacity: 0;
+  animation: reveal 2s ease;
+  animation-fill-mode: forwards;
+  animation-iteration-count: 1;
+}
+@media screen and (max-width: 720px) {
+  .dialog .dialog.isOpen:not(.dialogSize_dynamic) {
+    left: 15vw;
+    right: 15vw;
+  }
+}
+@media screen and (max-width: 599px) {
+  .dialog .dialog.isOpen:not(.dialogSize_dynamic) {
+    left: 5vw;
+    right: 5vw;
+  }
+}
+@media screen and (max-height: 720px) {
+  .dialog .dialog.isOpen:not(.dialogSize_dynamic) {
+    top: 15vh;
+    bottom: 15vh;
+  }
+}
+@media screen and (max-height: 599px) {
+  .dialog .dialog.isOpen:not(.dialogSize_dynamic) {
+    top: 5vh;
+    bottom: 5vh;
+  }
+}

package/dist/esm/components/design/headerBar/HeaderBar.js

@@ -0,0 +1,38 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { Icon } from '../icons/basicIcon/Icon';
+import { NotificationIcon } from '../icons/notificationIcon/NotificationIcon';
+import { SimpleButton } from '../../form/buttons/SimpleButton';
+import { NotificationsButton } from '../../form/buttons/notificationsButton/NotificationsButton';
+import './headerBar.css';
+export const HeaderBar = ({
+  text,
+  leftIcon,
+  rightIcon,
+  buttons,
+  notificationIcon,
+  children
+}) => {
+  const headerCssClass = `headerBar 
+    ${leftIcon ? 'withLeftIcon' : ''}
+    ${rightIcon ? 'withRightIcon' : ''}
+    ${notificationIcon ? 'withNotification' : ''}
+    `;
+  return /*#__PURE__*/React.createElement("header", {
+    className: headerCssClass
+  }, leftIcon && /*#__PURE__*/React.createElement(Icon, leftIcon), text && /*#__PURE__*/React.createElement("h2", null, text), children, buttons && /*#__PURE__*/React.createElement("div", {
+    className: "headerButtons"
+  }, buttons.map(button => {
+    if (button.kind === 'notifications') {
+      return /*#__PURE__*/React.createElement(NotificationsButton, _extends({
+        key: button.id
+      }, button));
+    }
+    return /*#__PURE__*/React.createElement(SimpleButton, _extends({
+      key: button.id
+    }, button));
+  })), rightIcon && /*#__PURE__*/React.createElement(Icon, rightIcon), notificationIcon && /*#__PURE__*/React.createElement(NotificationIcon, notificationIcon));
+};
+//# sourceMappingURL=HeaderBar.js.map

package/dist/esm/components/design/headerBar/HeaderBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderBar.js","names":["_extends","React","Icon","NotificationIcon","SimpleButton","NotificationsButton","HeaderBar","text","leftIcon","rightIcon","buttons","notificationIcon","children","headerCssClass","createElement","className","map","button","kind","key","id"],"sources":["../../../../../src/components/design/headerBar/HeaderBar.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { HeaderTextInterface } from '../../../interfaces/headerText.interface';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { NotificationIcon } from '../icons/notificationIcon/NotificationIcon';\nimport { SimpleButton } from '../../form/buttons/SimpleButton';\nimport { NotificationsButton } from '../../form/buttons/notificationsButton/NotificationsButton';\nimport { ButtonProps } from '../../form/buttons/button.interface';\n\nimport './headerBar.scss';\n\nexport const HeaderBar: React.FC<HeaderTextInterface> = (\n  {\n    text,\n    leftIcon,\n    rightIcon,\n    buttons,\n    notificationIcon,\n    children\n  }\n) => {\n  const headerCssClass = `headerBar \n    ${ leftIcon ? 'withLeftIcon' : '' }\n    ${ rightIcon ? 'withRightIcon' : '' }\n    ${ notificationIcon ? 'withNotification' : '' }\n    `;\n\n  return (\n    <header className={ headerCssClass }>\n      {\n        leftIcon && <Icon { ...leftIcon } />\n      }\n\n      {\n        text && <h2>{ text }</h2>\n      }\n\n      { children }\n\n      {\n        buttons\n        && (\n          <div className=\"headerButtons\">\n            {\n              buttons.map((button) => {\n                if (button.kind === 'notifications') {\n                  return <NotificationsButton key={ button.id } { ...button } />;\n                }\n                return <SimpleButton key={ button.id } { ...(button as ButtonProps) } />;\n              })\n            }\n          </div>\n        )\n      }\n\n      {\n        rightIcon && <Icon { ...rightIcon } />\n      }\n\n      {\n        notificationIcon && <NotificationIcon { ...notificationIcon } />\n      }\n    </header>\n  );\n};\n"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,MAAM,OAAO;AAEzB,SAASC,IAAI,QAAQ,yBAAyB;AAC9C,SAASC,gBAAgB,QAAQ,4CAA4C;AAC7E,SAASC,YAAY,QAAQ,iCAAiC;AAC9D,SAASC,mBAAmB,QAAQ,4DAA4D;AAGhG,OAAO,kBAAkB;AAEzB,OAAO,MAAMC,SAAwC,GAAGA,CACtD;EACEC,IAAI;EACJC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,gBAAgB;EAChBC;AACF,CAAC,KACE;EACH,MAAMC,cAAc,GAAG;AACzB,MAAOL,QAAQ,GAAG,cAAc,GAAG,EAAE;AACrC,MAAOC,SAAS,GAAG,eAAe,GAAG,EAAE;AACvC,MAAOE,gBAAgB,GAAG,kBAAkB,GAAG,EAAE;AACjD,KAAK;EAEH,oBACEV,KAAA,CAAAa,aAAA;IAAQC,SAAS,EAAGF;EAAgB,GAEhCL,QAAQ,iBAAIP,KAAA,CAAAa,aAAA,CAACZ,IAAI,EAAMM,QAAY,CAAC,EAIpCD,IAAI,iBAAIN,KAAA,CAAAa,aAAA,aAAMP,IAAU,CAAC,EAGzBK,QAAQ,EAGRF,OAAO,iBAELT,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAC;EAAe,GAE1BL,OAAO,CAACM,GAAG,CAAEC,MAAM,IAAK;IACtB,IAAIA,MAAM,CAACC,IAAI,KAAK,eAAe,EAAE;MACnC,oBAAOjB,KAAA,CAAAa,aAAA,CAACT,mBAAmB,EAAAL,QAAA;QAACmB,GAAG,EAAGF,MAAM,CAACG;MAAI,GAAMH,MAAM,CAAI,CAAC;IAChE;IACA,oBAAOhB,KAAA,CAAAa,aAAA,CAACV,YAAY,EAAAJ,QAAA;MAACmB,GAAG,EAAGF,MAAM,CAACG;IAAI,GAAOH,MAAM,CAAoB,CAAC;EAC1E,CAAC,CAEA,CACN,EAIDR,SAAS,iBAAIR,KAAA,CAAAa,aAAA,CAACZ,IAAI,EAAMO,SAAa,CAAC,EAItCE,gBAAgB,iBAAIV,KAAA,CAAAa,aAAA,CAACX,gBAAgB,EAAMQ,gBAAoB,CAE3D,CAAC;AAEb,CAAC","ignoreList":[]}

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

@@ -0,0 +1,41 @@
+/* Popovers */
+.headerBar {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: space-between;
+  position: relative;
+}
+.headerBar > .icon {
+  position: absolute;
+  top: 50%;
+  margin-top: -15px;
+  font-size: 30px;
+}
+.headerBar.withLeftIcon {
+  padding-left: 50px;
+}
+.headerBar.withLeftIcon .icon:first-of-type {
+  left: 0;
+}
+.headerBar.withRightIcon {
+  padding-right: 50px;
+}
+.headerBar.withRightIcon .icon:last-of-type {
+  right: 0;
+  left: auto;
+}
+.headerBar h2 {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  max-width: fit-content;
+}
+.headerBar .headerButtons {
+  display: flex;
+  flex-direction: row;
+  column-gap: 5px;
+  align-items: center;
+  justify-content: flex-start;
+}

package/dist/esm/components/design/icons/basicIcon/Icon.js

@@ -0,0 +1,30 @@
+'use client';
+
+import React from 'react';
+export const Icon = ({
+  icon,
+  customCssClass = '',
+  isMultiColor = false,
+  pathsCount = 20
+}) => {
+  if (isMultiColor) {
+    return /*#__PURE__*/React.createElement("span", {
+      className: `icon icon-${icon} ${customCssClass}`,
+      role: "presentation",
+      "aria-hidden": "true"
+    }, Array(pathsCount).fill(0).map((pathElement, index) => /*#__PURE__*/React.createElement("span", {
+      key: `${icon}IconPath${index}`,
+      className: `path${index + 1}`
+    })));
+  }
+  if (typeof icon === 'string') {
+    return /*#__PURE__*/React.createElement("i", {
+      className: `icon icon-${icon} ${customCssClass}`,
+      role: "presentation",
+      "aria-hidden": "true"
+    });
+  }
+  return icon;
+};
+export default Icon;
+//# sourceMappingURL=Icon.js.map

package/dist/esm/components/design/icons/basicIcon/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","names":["React","Icon","icon","customCssClass","isMultiColor","pathsCount","createElement","className","role","Array","fill","map","pathElement","index","key"],"sources":["../../../../../../src/components/design/icons/basicIcon/Icon.tsx"],"sourcesContent":["'use client';\n\nimport React, { ReactElement } from 'react';\n\nexport interface IconProps {\n  icon: string | ReactElement;\n  customCssClass?: string;\n  isMultiColor?: boolean;\n  pathsCount?: number;\n}\n\nexport const Icon: React.FC<IconProps> = (\n  {\n    icon,\n    customCssClass = '',\n    isMultiColor = false,\n    pathsCount = 20\n  }\n  : IconProps\n) => {\n  if (isMultiColor) {\n    return (\n      <span\n        className={ `icon icon-${ icon } ${ customCssClass }` }\n        role=\"presentation\"\n        aria-hidden=\"true\"\n      >\n        {   }\n        { Array(pathsCount).fill(0).map((pathElement, index) => (<span key={ `${ icon }IconPath${ index }` } className={ `path${ (index + 1) }` } />)) }\n      </span>\n    );\n  }\n\n  if (typeof icon === 'string') {\n    return (\n      <i\n        className={ `icon icon-${ icon } ${ customCssClass }` }\n        role=\"presentation\"\n        aria-hidden=\"true\"\n      />\n    );\n  }\n\n  return icon;\n};\n\nexport default Icon;\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,MAAwB,OAAO;AAS3C,OAAO,MAAMC,IAAyB,GAAGA,CACvC;EACEC,IAAI;EACJC,cAAc,GAAG,EAAE;EACnBC,YAAY,GAAG,KAAK;EACpBC,UAAU,GAAG;AAEL,CAAC,KACR;EACH,IAAID,YAAY,EAAE;IAChB,oBACEJ,KAAA,CAAAM,aAAA;MACEC,SAAS,EAAG,aAAcL,IAAI,IAAMC,cAAc,EAAK;MACvDK,IAAI,EAAC,cAAc;MACnB,eAAY;IAAM,GAGhBC,KAAK,CAACJ,UAAU,CAAC,CAACK,IAAI,CAAC,CAAC,CAAC,CAACC,GAAG,CAAC,CAACC,WAAW,EAAEC,KAAK,kBAAMb,KAAA,CAAAM,aAAA;MAAMQ,GAAG,EAAG,GAAIZ,IAAI,WAAaW,KAAK,EAAK;MAACN,SAAS,EAAG,OAASM,KAAK,GAAG,CAAC;IAAM,CAAE,CAAE,CACzI,CAAC;EAEX;EAEA,IAAI,OAAOX,IAAI,KAAK,QAAQ,EAAE;IAC5B,oBACEF,KAAA,CAAAM,aAAA;MACEC,SAAS,EAAG,aAAcL,IAAI,IAAMC,cAAc,EAAK;MACvDK,IAAI,EAAC,cAAc;MACnB,eAAY;IAAM,CACnB,CAAC;EAEN;EAEA,OAAON,IAAI;AACb,CAAC;AAED,eAAeD,IAAI","ignoreList":[]}

package/dist/esm/components/design/icons/basicIcon/iconSets.js

@@ -0,0 +1,45 @@
+import iconDefinitions from '../../../../icons/x15Icons.json';
+export const allIconNames = [];
+export const IconSets = iconDefinitions.iconSets.map(iconSet => {
+  const thisSet = {
+    label: '',
+    icons: {}
+  };
+  const {
+    selection,
+    metadata,
+    height
+  } = iconSet;
+  thisSet.label = metadata.name;
+  thisSet.icons = iconSet.icons.reduce((acc, icon) => {
+    // @ts-ignore
+    const {
+      id,
+      paths,
+      isMulticolor
+    } = icon;
+    const match = selection.find(item => item.id === id);
+    const name = match?.name;
+    if (match && name) {
+      allIconNames.push(name);
+      acc[name] = {
+        paths,
+        height,
+        isMulticolor
+      };
+    }
+    return acc;
+  }, {});
+  return thisSet;
+});
+export const FlatIconSet = IconSets?.reduce((acc, iconSet) => ({
+  ...acc,
+  ...iconSet.icons
+}), {});
+export const IconList = allIconNames;
+export default {
+  IconSets,
+  FlatIconSet,
+  IconList
+};
+//# sourceMappingURL=iconSets.js.map

package/dist/esm/components/design/icons/basicIcon/iconSets.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"iconSets.js","names":["iconDefinitions","allIconNames","IconSets","iconSets","map","iconSet","thisSet","label","icons","selection","metadata","height","name","reduce","acc","icon","id","paths","isMulticolor","match","find","item","push","FlatIconSet","IconList"],"sources":["../../../../../../src/components/design/icons/basicIcon/iconSets.ts"],"sourcesContent":["import iconDefinitions from '../../../../icons/x15Icons.json';\n\nexport const allIconNames: string[] = [];\n\nexport interface IconDefinition {\n  paths: string[];\n  width?: number;\n  height?: number;\n  isMulticolor: boolean;\n}\n\nexport interface IconSet {\n  label: string;\n  icons: {\n    [name: string]: IconDefinition\n  };\n}\n\nexport const IconSets = iconDefinitions.iconSets.map((iconSet) => {\n  const thisSet: IconSet = { label: '', icons: {} };\n\n  const { selection, metadata, height } = iconSet;\n\n  thisSet.label = metadata.name;\n\n  thisSet.icons = iconSet.icons.reduce<{ [name: string]: IconDefinition }>((acc, icon) => {\n     \n    // @ts-ignore\n    const { id, paths, isMulticolor } = icon;\n    const match = selection.find((item) => item.id === id);\n    const name = match?.name;\n\n    if (match && name) {\n      allIconNames.push(name);\n\n      acc[name] = {\n        paths,\n        height,\n        isMulticolor\n      };\n    }\n\n    return acc;\n  }, {});\n\n  return thisSet;\n});\n\nexport const FlatIconSet = IconSets?.reduce((acc, iconSet) => ({ ...acc, ...iconSet.icons }), {});\n\nexport const IconList = allIconNames;\n\nexport default {\n  IconSets,\n  FlatIconSet,\n  IconList\n};\n"],"mappings":"AAAA,OAAOA,eAAe,MAAM,iCAAiC;AAE7D,OAAO,MAAMC,YAAsB,GAAG,EAAE;AAgBxC,OAAO,MAAMC,QAAQ,GAAGF,eAAe,CAACG,QAAQ,CAACC,GAAG,CAAEC,OAAO,IAAK;EAChE,MAAMC,OAAgB,GAAG;IAAEC,KAAK,EAAE,EAAE;IAAEC,KAAK,EAAE,CAAC;EAAE,CAAC;EAEjD,MAAM;IAAEC,SAAS;IAAEC,QAAQ;IAAEC;EAAO,CAAC,GAAGN,OAAO;EAE/CC,OAAO,CAACC,KAAK,GAAGG,QAAQ,CAACE,IAAI;EAE7BN,OAAO,CAACE,KAAK,GAAGH,OAAO,CAACG,KAAK,CAACK,MAAM,CAAqC,CAACC,GAAG,EAAEC,IAAI,KAAK;IAEtF;IACA,MAAM;MAAEC,EAAE;MAAEC,KAAK;MAAEC;IAAa,CAAC,GAAGH,IAAI;IACxC,MAAMI,KAAK,GAAGV,SAAS,CAACW,IAAI,CAAEC,IAAI,IAAKA,IAAI,CAACL,EAAE,KAAKA,EAAE,CAAC;IACtD,MAAMJ,IAAI,GAAGO,KAAK,EAAEP,IAAI;IAExB,IAAIO,KAAK,IAAIP,IAAI,EAAE;MACjBX,YAAY,CAACqB,IAAI,CAACV,IAAI,CAAC;MAEvBE,GAAG,CAACF,IAAI,CAAC,GAAG;QACVK,KAAK;QACLN,MAAM;QACNO;MACF,CAAC;IACH;IAEA,OAAOJ,GAAG;EACZ,CAAC,EAAE,CAAC,CAAC,CAAC;EAEN,OAAOR,OAAO;AAChB,CAAC,CAAC;AAEF,OAAO,MAAMiB,WAAW,GAAGrB,QAAQ,EAAEW,MAAM,CAAC,CAACC,GAAG,EAAET,OAAO,MAAM;EAAE,GAAGS,GAAG;EAAE,GAAGT,OAAO,CAACG;AAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAEjG,OAAO,MAAMgB,QAAQ,GAAGvB,YAAY;AAEpC,eAAe;EACbC,QAAQ;EACRqB,WAAW;EACXC;AACF,CAAC","ignoreList":[]}

package/dist/esm/components/design/icons/notificationIcon/NotificationIcon.js

@@ -0,0 +1,21 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { Icon } from '../basicIcon/Icon';
+import './notificationIcon.css';
+export const NotificationIcon = ({
+  icon,
+  customCssClass,
+  text = ''
+}) => {
+  const hoverText = `You have ${text !== 0 ? text : 'no'} notifications`;
+  return /*#__PURE__*/React.createElement("span", {
+    title: hoverText,
+    className: `notificationIcon ${customCssClass || ''}`
+  }, icon && /*#__PURE__*/React.createElement(Icon, _extends({}, icon, {
+    customCssClass: customCssClass
+  })), text);
+};
+export default NotificationIcon;
+//# sourceMappingURL=NotificationIcon.js.map

package/dist/esm/components/design/icons/notificationIcon/NotificationIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationIcon.js","names":["_extends","React","Icon","NotificationIcon","icon","customCssClass","text","hoverText","createElement","title","className"],"sources":["../../../../../../src/components/design/icons/notificationIcon/NotificationIcon.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { Icon, IconProps } from '../basicIcon/Icon';\n\nimport './notificationIcon.scss';\n\nexport interface NotificationIconProps {\n  icon?: IconProps;\n  customCssClass?: string;\n  text?: number | string;\n}\n\nexport const NotificationIcon: React.FC<NotificationIconProps> = (\n  {\n    icon,\n    customCssClass,\n    text = ''\n  }\n) => {\n  const hoverText = `You have ${ text !== 0 ? text : 'no' } notifications`;\n  return (\n    <span title={ hoverText } className={ `notificationIcon ${ customCssClass || '' }` }>\n      {\n        icon\n        && <Icon { ...icon } customCssClass={ customCssClass } />\n      }\n      {\n        text\n      }\n    </span>\n  );\n};\n\nexport default NotificationIcon;\n"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAmB,mBAAmB;AAEnD,OAAO,yBAAyB;AAQhC,OAAO,MAAMC,gBAAiD,GAAGA,CAC/D;EACEC,IAAI;EACJC,cAAc;EACdC,IAAI,GAAG;AACT,CAAC,KACE;EACH,MAAMC,SAAS,GAAG,YAAaD,IAAI,KAAK,CAAC,GAAGA,IAAI,GAAG,IAAI,gBAAiB;EACxE,oBACEL,KAAA,CAAAO,aAAA;IAAMC,KAAK,EAAGF,SAAW;IAACG,SAAS,EAAG,oBAAqBL,cAAc,IAAI,EAAE;EAAK,GAEhFD,IAAI,iBACDH,KAAA,CAAAO,aAAA,CAACN,IAAI,EAAAF,QAAA,KAAMI,IAAI;IAAGC,cAAc,EAAGA;EAAgB,EAAE,CAAC,EAGzDC,IAEE,CAAC;AAEX,CAAC;AAED,eAAeH,gBAAgB","ignoreList":[]}

package/dist/esm/components/design/icons/notificationIcon/notificationIcon.css

@@ -0,0 +1,20 @@
+.notificationIcon {
+  background: var(--notificationIconBg, #c00);
+  color: var(--notificationIconFg, #fff);
+  border: var(--notificationIconBorder, 4px solid #c00);
+  box-shadow: var(--notificationIconShadow, none);
+  border-radius: 50%;
+  width: 16px;
+  height: 16px;
+  line-height: 16px;
+  font-size: 11px;
+  display: block;
+  text-align: center;
+  position: absolute;
+  flex: none;
+  right: -5px;
+  top: -5px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}

package/dist/esm/components/design/loadingMessage/LoadingMessage.js

@@ -0,0 +1,47 @@
+'use client';
+
+import React, { isValidElement } from 'react';
+import Spinner from '../spinner/Spinner';
+import './loadingMessage.css';
+export const LoadingMessage = ({
+  heading = 'Loading',
+  loadingMessage = 'Please wait.',
+  isInline = false,
+  spinner = true
+}) => {
+  const Wrapper = isInline ? 'aside' : 'section';
+  const LoadingMessageHeading = () => {
+    if (typeof heading !== 'string') return heading;
+    return isInline ? /*#__PURE__*/React.createElement("h4", {
+      className: "loadingMessageHeading loadingMessageHeadingInline"
+    }, heading) : /*#__PURE__*/React.createElement("h2", {
+      className: "loadingMessageHeading"
+    }, heading);
+  };
+  const LoadingMessageSpinner = () => {
+    if (typeof spinner === 'boolean') {
+      if (!spinner) return null;
+      return /*#__PURE__*/React.createElement(Spinner, {
+        size: isInline ? 'xs' : 'xl'
+      });
+    }
+    if (/*#__PURE__*/isValidElement(spinner)) return spinner;
+    if (spinner && typeof spinner === 'object') {
+      return /*#__PURE__*/React.createElement(Spinner, spinner);
+    }
+    return null;
+  };
+  const LoadingMessageContent = () => /*#__PURE__*/React.createElement("div", {
+    className: "loadingMessageContent"
+  }, /*#__PURE__*/React.createElement(LoadingMessageHeading, null), /*#__PURE__*/React.createElement("div", {
+    className: "loadingMessageText"
+  }, /*#__PURE__*/React.createElement(LoadingMessageSpinner, null), loadingMessage));
+  return /*#__PURE__*/React.createElement(Wrapper, {
+    role: "status",
+    "aria-live": "polite",
+    "aria-atomic": "true",
+    className: `loadingMessage ${isInline ? 'loadingMessageInline' : 'loadingMessagePage'}`
+  }, /*#__PURE__*/React.createElement(LoadingMessageContent, null));
+};
+export default LoadingMessage;
+//# sourceMappingURL=LoadingMessage.js.map

package/dist/esm/components/design/loadingMessage/LoadingMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingMessage.js","names":["React","isValidElement","Spinner","LoadingMessage","heading","loadingMessage","isInline","spinner","Wrapper","LoadingMessageHeading","createElement","className","LoadingMessageSpinner","size","LoadingMessageContent","role"],"sources":["../../../../../src/components/design/loadingMessage/LoadingMessage.tsx"],"sourcesContent":["'use client';\n\nimport React, { FC, ReactNode, isValidElement } from 'react';\nimport { SpinnersInterface } from '../spinner/spinner.interface';\nimport Spinner from '../spinner/Spinner';\n\nimport './loadingMessage.scss';\n\nexport type LoadingMessageProps = {\n  heading?: string | ReactNode;\n  loadingMessage?: string | ReactNode;\n  isInline?: boolean;\n  spinner?: boolean | ReactNode | SpinnersInterface;\n};\n\nexport const LoadingMessage: FC<LoadingMessageProps> = (\n  {\n    heading = 'Loading',\n    loadingMessage = 'Please wait.',\n    isInline = false,\n    spinner = true,\n  }\n) => {\n  const Wrapper: React.ElementType = isInline ? 'aside' : 'section';\n\n  const LoadingMessageHeading = () => {\n    if (typeof heading !== 'string') return heading;\n\n    return isInline ? (\n      <h4 className=\"loadingMessageHeading loadingMessageHeadingInline\">{ heading }</h4>\n    ) : (\n      <h2 className=\"loadingMessageHeading\">{ heading }</h2>\n    );\n  };\n\n  const LoadingMessageSpinner = () => {\n    if (typeof spinner === 'boolean') {\n      if (!spinner) return null;\n      return <Spinner size={ isInline ? 'xs' : 'xl' } />;\n    }\n\n    if (isValidElement(spinner)) return spinner;\n\n    if (spinner && typeof spinner === 'object') {\n      return <Spinner { ...(spinner as SpinnersInterface) } />;\n    }\n\n    return null;\n  };\n\n  const LoadingMessageContent = () => (\n    <div className=\"loadingMessageContent\">\n      <LoadingMessageHeading />\n      <div className=\"loadingMessageText\">\n        <LoadingMessageSpinner />\n        { loadingMessage }\n      </div>\n    </div>\n  );\n\n  return (\n    <Wrapper\n      role=\"status\"\n      aria-live=\"polite\"\n      aria-atomic=\"true\"\n      className={ `loadingMessage ${ isInline ? 'loadingMessageInline' : 'loadingMessagePage' }` }\n    >\n      <LoadingMessageContent />\n    </Wrapper>\n  );\n};\n\nexport default LoadingMessage;"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,KAAK,IAAmBC,cAAc,QAAQ,OAAO;AAE5D,OAAOC,OAAO,MAAM,oBAAoB;AAExC,OAAO,uBAAuB;AAS9B,OAAO,MAAMC,cAAuC,GAAGA,CACrD;EACEC,OAAO,GAAG,SAAS;EACnBC,cAAc,GAAG,cAAc;EAC/BC,QAAQ,GAAG,KAAK;EAChBC,OAAO,GAAG;AACZ,CAAC,KACE;EACH,MAAMC,OAA0B,GAAGF,QAAQ,GAAG,OAAO,GAAG,SAAS;EAEjE,MAAMG,qBAAqB,GAAGA,CAAA,KAAM;IAClC,IAAI,OAAOL,OAAO,KAAK,QAAQ,EAAE,OAAOA,OAAO;IAE/C,OAAOE,QAAQ,gBACbN,KAAA,CAAAU,aAAA;MAAIC,SAAS,EAAC;IAAmD,GAAGP,OAAa,CAAC,gBAElFJ,KAAA,CAAAU,aAAA;MAAIC,SAAS,EAAC;IAAuB,GAAGP,OAAa,CACtD;EACH,CAAC;EAED,MAAMQ,qBAAqB,GAAGA,CAAA,KAAM;IAClC,IAAI,OAAOL,OAAO,KAAK,SAAS,EAAE;MAChC,IAAI,CAACA,OAAO,EAAE,OAAO,IAAI;MACzB,oBAAOP,KAAA,CAAAU,aAAA,CAACR,OAAO;QAACW,IAAI,EAAGP,QAAQ,GAAG,IAAI,GAAG;MAAM,CAAE,CAAC;IACpD;IAEA,iBAAIL,cAAc,CAACM,OAAO,CAAC,EAAE,OAAOA,OAAO;IAE3C,IAAIA,OAAO,IAAI,OAAOA,OAAO,KAAK,QAAQ,EAAE;MAC1C,oBAAOP,KAAA,CAAAU,aAAA,CAACR,OAAO,EAAOK,OAAiC,CAAC;IAC1D;IAEA,OAAO,IAAI;EACb,CAAC;EAED,MAAMO,qBAAqB,GAAGA,CAAA,kBAC5Bd,KAAA,CAAAU,aAAA;IAAKC,SAAS,EAAC;EAAuB,gBACpCX,KAAA,CAAAU,aAAA,CAACD,qBAAqB,MAAE,CAAC,eACzBT,KAAA,CAAAU,aAAA;IAAKC,SAAS,EAAC;EAAoB,gBACjCX,KAAA,CAAAU,aAAA,CAACE,qBAAqB,MAAE,CAAC,EACvBP,cACC,CACF,CACN;EAED,oBACEL,KAAA,CAAAU,aAAA,CAACF,OAAO;IACNO,IAAI,EAAC,QAAQ;IACb,aAAU,QAAQ;IAClB,eAAY,MAAM;IAClBJ,SAAS,EAAG,kBAAmBL,QAAQ,GAAG,sBAAsB,GAAG,oBAAoB;EAAK,gBAE5FN,KAAA,CAAAU,aAAA,CAACI,qBAAqB,MAAE,CACjB,CAAC;AAEd,CAAC;AAED,eAAeX,cAAc","ignoreList":[]}

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

@@ -0,0 +1,27 @@
+.loadingMessage.loadingMessageInline .loadingMessageText {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+}
+.loadingMessage.loadingMessagePage {
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.loadingMessage.loadingMessagePage .loadingMessageText {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 20px;
+}
+.loadingMessage .loadingMessageContent {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 20px;
+}

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

@@ -0,0 +1,27 @@
+'use client';
+
+import React from 'react';
+export const LogoLink = ({
+  imageUrl,
+  svg,
+  size = 's',
+  customCssClass,
+  label,
+  url,
+  hideLabel = true
+}) => /*#__PURE__*/React.createElement("a", {
+  href: url,
+  title: label,
+  target: "_blank",
+  className: `logoLink logoLink_${size} ${customCssClass || ''}`,
+  rel: "noreferrer"
+}, imageUrl && /*#__PURE__*/React.createElement("img", {
+  src: imageUrl,
+  className: "logoImage",
+  alt: `${label} logo`
+}), svg && /*#__PURE__*/React.createElement("span", {
+  className: "logoSvg"
+}, svg), /*#__PURE__*/React.createElement("span", {
+  className: hideLabel ? 'sr-only' : 'logoLabel'
+}, label));
+//# sourceMappingURL=LogoLink.js.map

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

@@ -0,0 +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":[]}

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

@@ -0,0 +1,37 @@
+'use client';
+
+import React from 'react';
+import { VENTURES } from '../../../constants/ventures';
+import './ventureLogos.css';
+export const VentureLogo = ({
+  ventureKey = 'x15Ventures',
+  ventureDefinition,
+  size = 'full',
+  customCssClass
+}) => {
+  const logoDefinition = ventureDefinition || VENTURES[ventureKey] || VENTURES.x15Ventures;
+  const {
+    logo: {
+      icon,
+      full
+    },
+    name,
+    sites: {
+      public: {
+        name: publicSiteName,
+        url
+      }
+    }
+  } = logoDefinition;
+  const cssClass = `ventureLogo ventureLogo_${size} ${ventureKey}Logo ${customCssClass || ''}`;
+  return /*#__PURE__*/React.createElement("a", {
+    href: url,
+    title: name,
+    target: "_blank",
+    className: cssClass,
+    rel: "noreferrer"
+  }, size === 'icon' ? icon : full, /*#__PURE__*/React.createElement("span", {
+    className: "sr-only"
+  }, "Visit ", publicSiteName));
+};
+//# sourceMappingURL=VentureLogo.js.map