qaema-ui 0.0.24 → 0.0.26

package/dist/components/TotalsSummary.js

@@ -0,0 +1,84 @@
+import { j as t } from "../_virtual/jsx-runtime.js";
+import o from "styled-components";
+import { device as n } from "../constants/breakPoints.constant.js";
+import p from "../assets/icons/RiyalIcon.js";
+const g = o.div`
+  width: 100%;
+`, c = o.div`
+  font-family: ${({ theme: e }) => e.fonts.english};
+  font-weight: ${({ theme: e }) => e.typography.weights.semiBold};
+  font-size: ${({ theme: e }) => e.typography.sizes.s7};
+  line-height: ${({ theme: e }) => e.typography.lineHeights.l};
+  letter-spacing: ${({ theme: e }) => e.typography.letterSpacings.normal};
+  color: ${({ theme: e }) => e.colors.grey.n800};
+  margin-bottom: ${({ theme: e }) => e.spacing.m};
+`, h = o.div`
+  display: flex;
+  align-items: flex-start;
+  gap: ${({ theme: e }) => e.spacing.xl};
+  flex-wrap: wrap;
+
+  @media ${n.tablet} {
+    gap: ${({ theme: e }) => e.spacing.l};
+  }
+`, y = o.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${({ theme: e }) => e.spacing.xs};
+  min-width: 10.5rem;
+
+  @media ${n.tablet} {
+    min-width: 9.5rem;
+  }
+`, m = o.div`
+  font-family: ${({ theme: e }) => e.fonts.english};
+  font-weight: ${({ theme: e }) => e.typography.weights.semiBold};
+  font-size: ${({ theme: e }) => e.typography.sizes.s4};
+  line-height: ${({ theme: e }) => e.typography.lineHeights.s};
+  letter-spacing: ${({ theme: e }) => e.typography.letterSpacings.balancedNarrow};
+  color: ${({ theme: e }) => e.colors.grey.n650};
+`, d = o.div`
+  display: flex;
+  align-items: baseline;
+  gap: ${({ theme: e }) => e.spacing.xxs};
+  direction: ltr;
+`, $ = o.span`
+  font-family: ${({ theme: e }) => e.fonts.arabic};
+  font-weight: ${({ theme: e }) => e.typography.weights.bold};
+  font-size: ${({ theme: e }) => e.typography.sizes.s10};
+  line-height: ${({ theme: e }) => e.typography.lineHeights.xl};
+  letter-spacing: ${({ theme: e }) => e.typography.letterSpacings.balancedNarrow};
+  text-align: center;
+  color: ${({ theme: e, $color: s }) => s || e.colors.grey.n400};
+`, f = o.span`
+  font-family: ${({ theme: e }) => e.fonts.english};
+  font-weight: ${({ theme: e }) => e.typography.weights.regular};
+  font-size: ${({ theme: e }) => e.typography.sizes.s2};
+  line-height: ${({ theme: e }) => e.typography.lineHeights.xs};
+  letter-spacing: ${({ theme: e }) => e.typography.letterSpacings.normal};
+  color: ${({ theme: e, $color: s }) => s || e.colors.grey.n400};
+`;
+function b({
+  title: e,
+  items: s,
+  showCurrencyIcon: r = !0,
+  currencyIconWidth: l = "18px"
+}) {
+  return /* @__PURE__ */ t.jsxs(g, { children: [
+    /* @__PURE__ */ t.jsx(c, { children: e }),
+    /* @__PURE__ */ t.jsx(h, { children: s.map((i, a) => /* @__PURE__ */ t.jsxs(y, { children: [
+      /* @__PURE__ */ t.jsx(m, { children: i.title }),
+      /* @__PURE__ */ t.jsxs(d, { children: [
+        r && /* @__PURE__ */ t.jsx(p, { width: l, height: "20", color: i.color }),
+        /* @__PURE__ */ t.jsx($, { $color: i.color, children: i.amount }),
+        i.decimal ? /* @__PURE__ */ t.jsxs(f, { $color: i.color, children: [
+          ".",
+          i.decimal
+        ] }) : null
+      ] })
+    ] }, `${i.title}-${a}`)) })
+  ] });
+}
+export {
+  b as default
+};

package/dist/components/index.d.ts

@@ -141,3 +141,9 @@ export { default as PaymentTooltip } from './PaymentTooltip';
 export type { PaymentTooltipProps } from './PaymentTooltip';
 export { default as ModalWithRequestCard } from './ModalWithRequestCard';
 export type { ModalWithRequestCardProps } from './ModalWithRequestCard';
+export { default as DropDownWithTable } from './DropDownWithTable/DropDownWithTable';
+export type { DropDownWithTableProps } from './DropDownWithTable/DropDownWithTable.types';
+export { default as TotalsSummary } from './TotalsSummary';
+export type { TotalsSummaryProps, TotalsSummaryItem } from './TotalsSummary';
+export { default } from './NextActionBox';
+export type { NextActionBoxProps, NextActionItem } from './NextActionBox';

package/dist/index.js

@@ -1,4 +1,4 @@
-import { default as o } from "./components/AccordionCard.js";
+import { default as r } from "./components/AccordionCard.js";
 import { default as t } from "./components/ActionInput.js";
 import { default as d } from "./components/AddOnCard.js";
 import { default as u } from "./components/AddOnCardInput.js";
@@ -8,82 +8,84 @@ import { default as n } from "./components/Badge.js";
 import { default as c } from "./components/BulletItem.js";
 import { default as I } from "./components/Button.js";
 import { Card as k } from "./components/Card.js";
-import { default as h } from "./components/CardsList.js";
+import { default as T } from "./components/CardsList.js";
 import { default as b } from "./components/Chart.js";
-import { default as L } from "./components/Checkbox.js";
+import { default as D } from "./components/Checkbox.js";
 import { default as y } from "./components/CollapsableCard.js";
-import { default as D } from "./components/ConfigList.js";
+import { default as B } from "./components/ConfigList.js";
 import { default as R } from "./components/ConfirmationPopup.js";
 import { default as w } from "./components/DatePicker.js";
 import { default as M } from "./components/Divider.js";
 import { default as O } from "./components/Draggable.js";
 import { default as Q } from "./components/DropDown.js";
-import { default as V } from "./components/FileDownloadCard.js";
-import { default as Z } from "./components/Header.js";
-import { default as E, HelpCardGroup as J } from "./components/HelpCard.js";
-import { default as U } from "./components/Hint.js";
-import { default as Y } from "./components/HorizontalChart.js";
-import { default as $ } from "./components/Image.js";
-import { default as re } from "./components/InfoCard.js";
-import { default as ae } from "./components/InfoItem.js";
-import { default as fe } from "./components/InputField.js";
-import { default as pe } from "./components/Layout.js";
-import { default as le } from "./components/Legend.js";
-import { default as se } from "./components/Link.js";
-import { default as ie } from "./components/ListToolbar.js";
-import { MethodCard as Ce } from "./components/MethodCard.js";
-import { default as ge } from "./components/Modal.js";
-import { default as Pe } from "./components/ModalWithRequestCard.js";
-import { default as Se } from "./components/NavItem.js";
-import { default as Te } from "./components/NavigationPanel.js";
-import { default as Ae } from "./components/NumberInput.js";
+import { default as z } from "./components/DropDownWithTable/DropDownWithTable.js";
+import { default as Z } from "./components/FileDownloadCard.js";
+import { default as E } from "./components/Header.js";
+import { default as K, HelpCardGroup as U } from "./components/HelpCard.js";
+import { default as Y } from "./components/Hint.js";
+import { default as $ } from "./components/HorizontalChart.js";
+import { default as oe } from "./components/Image.js";
+import { default as ae } from "./components/InfoCard.js";
+import { default as fe } from "./components/InfoItem.js";
+import { default as pe } from "./components/InputField.js";
+import { default as le } from "./components/Layout.js";
+import { default as se } from "./components/Legend.js";
+import { default as ie } from "./components/Link.js";
+import { default as Ce } from "./components/ListToolbar.js";
+import { MethodCard as ge } from "./components/MethodCard.js";
+import { default as Pe } from "./components/Modal.js";
+import { default as Se } from "./components/ModalWithRequestCard.js";
+import { default as he } from "./components/NavItem.js";
+import { default as Ae } from "./components/NavigationPanel.js";
+import { default as Le } from "./components/NumberInput.js";
 import { default as He } from "./components/OTP.js";
-import { default as Be } from "./components/PackageCard.js";
-import { default as Fe } from "./components/PageHeader.js";
-import { default as ve } from "./components/Pagination.js";
-import { default as Ge } from "./components/PasswordInputField.js";
-import { default as Ne } from "./components/PaymentLinkDetails.js";
-import { default as qe } from "./components/PaymentTooltip.js";
-import { default as ze } from "./components/PhoneInputField.js";
-import { default as We } from "./components/PriceAmount.js";
-import { default as je } from "./components/ProgressBar.js";
-import { default as Je } from "./components/QuickActionItem.js";
-import { default as Ue } from "./components/QuickStartCard.js";
-import { default as Ye } from "./components/Radio.js";
-import { default as $e } from "./components/RadioInput.js";
-import { default as rr } from "./components/ReconciliationGroups.js";
-import { default as ar } from "./components/RequestCard.js";
-import { default as fr } from "./components/RequestSummaryCard.js";
-import { default as pr } from "./components/SearchBar.js";
-import { default as lr } from "./components/SectionHeader.js";
-import { default as sr } from "./components/SideMenuLinks.js";
-import { default as ir } from "./components/Spinner.js";
-import { default as Cr } from "./components/StatCard.js";
-import { default as gr } from "./components/StatIndicator.js";
-import { default as Pr } from "./components/StatusFeedback.js";
-import { default as Sr } from "./components/Stepper.js";
-import { default as Tr } from "./components/StepperProcess.js";
-import { default as Ar } from "./components/SummaryCard.js";
-import { default as Hr } from "./components/Table/Table.js";
-import { default as Br } from "./components/Tabs.js";
-import { default as Fr } from "./components/TextArea.js";
-import { default as vr } from "./components/ThemeProvider.js";
-import { default as Gr } from "./components/ToastNotification.js";
-import { default as Nr } from "./components/Toggle.js";
-import { default as qr } from "./components/ToggleForm.js";
-import { default as zr } from "./components/ToggleHeader.js";
-import { default as Wr } from "./components/Typography.js";
-import { default as jr } from "./components/ViewItem.js";
-import { default as Jr } from "./hooks/useBreakpointCheck.js";
-import { default as Ur } from "./hooks/useFormikInput.js";
-import { default as Yr } from "./hooks/useZIndex.js";
-import { OptionSelectGroup as $r } from "./components/OptionCardGroup.js";
-import { breakPoints as ro, device as oo } from "./constants/breakPoints.constant.js";
-import { darkColors as to, lightColors as fo } from "./theme/colors.js";
-import { defaultTheme as uo } from "./theme/theme.js";
-import { setQaemaCoreLanguage as mo } from "./i18n/i18n.js";
+import { default as Fe } from "./components/PackageCard.js";
+import { default as ve } from "./components/PageHeader.js";
+import { default as Ge } from "./components/Pagination.js";
+import { default as Ne } from "./components/PasswordInputField.js";
+import { default as qe } from "./components/PaymentLinkDetails.js";
+import { default as We } from "./components/PaymentTooltip.js";
+import { default as Ve } from "./components/PhoneInputField.js";
+import { default as je } from "./components/PriceAmount.js";
+import { default as Je } from "./components/ProgressBar.js";
+import { default as Ue } from "./components/QuickActionItem.js";
+import { default as Ye } from "./components/QuickStartCard.js";
+import { default as $e } from "./components/Radio.js";
+import { default as oo } from "./components/RadioInput.js";
+import { default as ao } from "./components/ReconciliationGroups.js";
+import { default as fo } from "./components/RequestCard.js";
+import { default as uo } from "./components/RequestSummaryCard.js";
+import { default as mo } from "./components/SearchBar.js";
+import { default as xo } from "./components/SectionHeader.js";
+import { default as no } from "./components/SideMenuLinks.js";
+import { default as co } from "./components/Spinner.js";
+import { default as Io } from "./components/StatCard.js";
+import { default as ko } from "./components/StatIndicator.js";
+import { default as To } from "./components/StatusFeedback.js";
+import { default as bo } from "./components/Stepper.js";
+import { default as Do } from "./components/StepperProcess.js";
+import { default as yo } from "./components/SummaryCard.js";
+import { default as Bo } from "./components/Table/Table.js";
+import { default as Ro } from "./components/Tabs.js";
+import { default as wo } from "./components/TextArea.js";
+import { default as Mo } from "./components/ThemeProvider.js";
+import { default as Oo } from "./components/ToastNotification.js";
+import { default as Qo } from "./components/Toggle.js";
+import { default as zo } from "./components/ToggleForm.js";
+import { default as Zo } from "./components/ToggleHeader.js";
+import { default as Eo } from "./components/TotalsSummary.js";
+import { default as Ko } from "./components/Typography.js";
+import { default as Xo } from "./components/ViewItem.js";
+import { default as _o } from "./hooks/useBreakpointCheck.js";
+import { default as er } from "./hooks/useFormikInput.js";
+import { default as rr } from "./hooks/useZIndex.js";
+import { OptionSelectGroup as tr } from "./components/OptionCardGroup.js";
+import { breakPoints as dr, device as pr } from "./constants/breakPoints.constant.js";
+import { darkColors as lr, lightColors as mr } from "./theme/colors.js";
+import { defaultTheme as xr } from "./theme/theme.js";
+import { setQaemaCoreLanguage as nr } from "./i18n/i18n.js";
 export {
-  o as AccordionCard,
+  r as AccordionCard,
   t as ActionInput,
   d as AddOnCard,
   u as AddOnCardInput,
@@ -93,81 +95,83 @@ export {
   c as BulletItem,
   I as Button,
   k as Card,
-  h as CardsList,
+  T as CardsList,
   b as Chart,
-  L as Checkbox,
+  D as Checkbox,
   y as CollapsableCard,
-  D as ConfigList,
+  B as ConfigList,
   R as ConfirmationPopup,
   w as DatePicker,
   M as Divider,
   O as Draggable,
   Q as DropDown,
-  V as FileDownloadCard,
-  Z as Header,
-  E as HelpCard,
-  J as HelpCardGroup,
-  U as Hint,
-  Y as HorizontalChart,
-  $ as Image,
-  re as InfoCard,
-  ae as InfoItem,
-  fe as InputField,
-  pe as Layout,
-  le as Legend,
-  se as Link,
-  ie as ListToolbar,
-  Ce as MethodCard,
-  ge as Modal,
-  Pe as ModalWithRequestCard,
-  Se as NavItem,
-  Te as NavigationPanel,
-  Ae as NumberInput,
-  $r as OptionSelectGroup,
+  z as DropDownWithTable,
+  Z as FileDownloadCard,
+  E as Header,
+  K as HelpCard,
+  U as HelpCardGroup,
+  Y as Hint,
+  $ as HorizontalChart,
+  oe as Image,
+  ae as InfoCard,
+  fe as InfoItem,
+  pe as InputField,
+  le as Layout,
+  se as Legend,
+  ie as Link,
+  Ce as ListToolbar,
+  ge as MethodCard,
+  Pe as Modal,
+  Se as ModalWithRequestCard,
+  he as NavItem,
+  Ae as NavigationPanel,
+  Le as NumberInput,
+  tr as OptionSelectGroup,
   He as OtpInput,
-  Be as PackageCard,
-  Fe as PageHeader,
-  ve as Pagination,
-  Ge as PasswordInputField,
-  Ne as PaymentLinkDetails,
-  qe as PaymentTooltip,
-  ze as PhoneInputField,
-  We as PriceAmount,
-  je as ProgressBar,
-  Je as QuickActionItem,
-  Ue as QuickStartCard,
-  Ye as RadioButton,
-  $e as RadioInput,
-  rr as ReconciliationGroups,
-  ar as RequestCard,
-  fr as RequestSummaryCard,
-  pr as SearchBar,
-  lr as SectionHeader,
-  sr as SideMenuLinks,
-  ir as Spinner,
-  Cr as StatCardGroup,
-  gr as StatIndicator,
-  Pr as StatusFeedback,
-  Sr as Stepper,
-  Tr as StepperProcess,
-  Ar as SummaryCard,
-  Hr as Table,
-  Br as Tabs,
-  Fr as TextArea,
-  vr as ThemeProvider,
-  Gr as ToastNotification,
-  Nr as Toggle,
-  qr as ToggleForm,
-  zr as ToggleHeader,
-  Wr as Typography,
-  jr as ViewItem,
-  ro as breakPoints,
-  to as darkColors,
-  uo as defaultTheme,
-  oo as device,
-  fo as lightColors,
-  mo as setQaemaCoreLanguage,
-  Jr as useBreakpointCheck,
-  Ur as useFormikInput,
-  Yr as useZIndex
+  Fe as PackageCard,
+  ve as PageHeader,
+  Ge as Pagination,
+  Ne as PasswordInputField,
+  qe as PaymentLinkDetails,
+  We as PaymentTooltip,
+  Ve as PhoneInputField,
+  je as PriceAmount,
+  Je as ProgressBar,
+  Ue as QuickActionItem,
+  Ye as QuickStartCard,
+  $e as RadioButton,
+  oo as RadioInput,
+  ao as ReconciliationGroups,
+  fo as RequestCard,
+  uo as RequestSummaryCard,
+  mo as SearchBar,
+  xo as SectionHeader,
+  no as SideMenuLinks,
+  co as Spinner,
+  Io as StatCardGroup,
+  ko as StatIndicator,
+  To as StatusFeedback,
+  bo as Stepper,
+  Do as StepperProcess,
+  yo as SummaryCard,
+  Bo as Table,
+  Ro as Tabs,
+  wo as TextArea,
+  Mo as ThemeProvider,
+  Oo as ToastNotification,
+  Qo as Toggle,
+  zo as ToggleForm,
+  Zo as ToggleHeader,
+  Eo as TotalsSummary,
+  Ko as Typography,
+  Xo as ViewItem,
+  dr as breakPoints,
+  lr as darkColors,
+  xr as defaultTheme,
+  pr as device,
+  mr as lightColors,
+  nr as setQaemaCoreLanguage,
+  _o as useBreakpointCheck,
+  er as useFormikInput,
+  rr as useZIndex
 };

package/dist/node_modules/react-bootstrap/esm/Spinner.js

@@ -0,0 +1,26 @@
+import i from "../../../_virtual/index.js";
+import * as f from "react";
+import { useBootstrapPrefix as c } from "./ThemeProvider.js";
+import { j as d } from "../../../_virtual/jsx-runtime.js";
+const x = /* @__PURE__ */ f.forwardRef(({
+  bsPrefix: r,
+  variant: e,
+  animation: t = "border",
+  size: o,
+  // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+  as: a = "div",
+  className: m,
+  ...p
+}, n) => {
+  r = c(r, "spinner");
+  const s = `${r}-${t}`;
+  return /* @__PURE__ */ d.jsx(a, {
+    ref: n,
+    ...p,
+    className: i(m, s, o && `${s}-${o}`, e && `text-${e}`)
+  });
+});
+x.displayName = "Spinner";
+export {
+  x as default
+};

package/dist/styles/Dropdown.styles.js

@@ -1,7 +1,7 @@
 import r, { css as n } from "styled-components";
 import { Scrollbar as i } from "./Scrollbar.styles.js";
-import t from "../node_modules/react-bootstrap/esm/Dropdown.js";
-import s from "../node_modules/react-bootstrap/esm/DropdownToggle.js";
+import s from "../node_modules/react-bootstrap/esm/Dropdown.js";
+import t from "../node_modules/react-bootstrap/esm/DropdownToggle.js";
 import a from "../node_modules/react-bootstrap/esm/DropdownMenu.js";
 import l from "../node_modules/react-bootstrap/esm/DropdownItem.js";
 const x = r.div`
@@ -47,11 +47,11 @@ const x = r.div`
       color: ${({ theme: o }) => o.colors.state.error.n450};
     }
   }
-`, w = r(t)`
+`, w = r(s)`
   width: 100%;
   max-height: 3.5rem;
   min-width: 5rem !important;
-`, f = r(s)`
+`, f = r(t)`
   width: 100%;
   box-shadow: ${({ $valid: o }) => o ? "0px 1px 2px 0px rgba(0, 0, 0, 0.06), 0px 1px 3px 0px rgba(0, 0, 0, 0.1);" : "none"};
   padding: 0px;
@@ -125,7 +125,7 @@ const x = r.div`
 `, v = r(a)`
   min-width: 19rem !important;
   max-height: 29rem;
-  position: absolute !important;
+  position: absolute;
   inset: 0px auto auto 0px;
   width: ${({ $menuWidth: o }) => `${o}rem`};
   display: flex;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "qaema-ui",
   "private": false,
-  "version": "0.0.24",
+  "version": "0.0.26",
   "type": "module",
   "publishConfig": {
     "access": "public"