@sonic-equipment/ui 239.0.0 → 241.0.0

package/dist/shared/utils/price.js

@@ -1,8 +1,9 @@
-function parseCurrency({ currencyCode, locale, price, }) {
+function parseCurrency({ currencyCode, locale, price, useGrouping = true, }) {
     const formatter = new Intl.NumberFormat(locale, {
         currency: currencyCode,
         currencyDisplay: 'narrowSymbol',
         style: 'currency',
+        useGrouping,
     });
     const parts = formatter.formatToParts(price);
     const namedParts = parts.reduce((result, part) => {
@@ -23,16 +24,18 @@ function parseCurrency({ currencyCode, locale, price, }) {
             : 'before',
     };
 }
-function formatCurrency({ currencyCode, locale, price, replaceNonBreakingSpace = false, }) {
+function formatCurrency({ currencyCode, locale, price, replaceNonBreakingSpace = false, useGrouping = true, }) {
     const formatter = new Intl.NumberFormat(locale, {
         currency: currencyCode,
         currencyDisplay: 'narrowSymbol',
         style: 'currency',
+        useGrouping,
     });
     const string = formatter.format(price);
-    if (replaceNonBreakingSpace)
-        string.replaceAll('\u00A0', ' ');
-    return string;
+    const normalized = replaceNonBreakingSpace
+        ? string.replaceAll(new RegExp('\u00A0', 'g'), ' ')
+        : string;
+    return normalized;
 }
 const countryCodeToCurrencyCode = {
     AR: 'ARS',

package/dist/styles.css

@@ -1178,6 +1178,11 @@ html {
     text-transform: none;
   }
 
+.button-module-Pbwz7 .button-module-XaNWz svg {
+      width: 18px;
+      height: 18px;
+    }
+
 .button-module-GVTEW {
   min-width: 52px;
   min-height: 40px;
@@ -2768,6 +2773,7 @@ html {
 .data-card-module-24uin {
   position: relative;
   display: grid;
+  padding: var(--space-16);
   border: 1px solid var(--color-brand-medium-gray);
   border-radius: var(--border-radius-32);
   grid-area: card;
@@ -2801,7 +2807,6 @@ html {
 .data-card-module-24uin .data-card-module-ZefqY {
     display: grid;
     align-items: start;
-    padding: var(--space-16);
     grid-template-rows: 1fr min-content;
   }
 
@@ -4981,6 +4986,74 @@ button.swiper-pagination-bullet {
       margin-inline: var(--space-4);
     }
 
+.details-module-yz0rE {
+  --duration: var(--transition-duration-short);
+  --arrow-size: 12px;
+  --arrow-space: 12px;
+
+  display: grid;
+  gap: 0 var(--space-4);
+  grid-template-columns: var(--arrow-space) minmax(0, 1fr);
+  interpolate-size: allow-keywords;
+}
+
+  .details-module-yz0rE .details-module-mSgNu {
+    display: grid;
+    flex-direction: row;
+    color: var(--color-brand-red);
+    cursor: pointer;
+    grid-column: 1 / -1;
+    grid-template-areas: 'marker label';
+    grid-template-columns: subgrid;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+            user-select: none;
+  }
+
+  .details-module-yz0rE .details-module-mSgNu::marker {
+      display: none;
+    }
+
+  .details-module-yz0rE .details-module-mSgNu .details-module-2O7TR {
+      block-size: var(--arrow-size);
+      grid-area: marker;
+      inline-size: var(--arrow-size);
+      place-self: center;
+      transition: all var(--duration) ease-in-out;
+    }
+
+  .details-module-yz0rE .details-module-mSgNu:hover {
+      color: var(--color-brand-dark-red);
+    }
+
+  .details-module-yz0rE .details-module-mSgNu:focus-visible {
+      outline: var(--focus-outline);
+    }
+
+  .details-module-yz0rE::details-content {
+    display: grid;
+    overflow: hidden;
+    block-size: 0;
+    grid-column: 1 / -1;
+    grid-template-areas: '. content';
+    grid-template-columns: subgrid;
+    transition: all var(--duration) ease-in-out;
+    transition-behavior: allow-discrete;
+  }
+
+  .details-module-yz0rE .details-module-EJitZ {
+    grid-area: content;
+    padding-block-start: var(--space-8);
+  }
+
+  .details-module-yz0rE:open .details-module-mSgNu .details-module-2O7TR {
+        rotate: 90deg;
+      }
+
+  .details-module-yz0rE:open::details-content {
+      block-size: auto;
+    }
+
 .info-display-module-jsSU0 .info-display-module-aGbJV {
     display: block;
     margin-bottom: var(--space-8);
@@ -7852,6 +7925,41 @@ button.swiper-pagination-bullet {
       padding-block-end: 0;
     }
 
+.default-error-view-module-IXKuf > *:first-child {
+    margin-block-start: 0;
+  }
+  .default-error-view-module-IXKuf > *:last-child {
+    margin-block-end: 0;
+  }
+  .default-error-view-module-IXKuf .default-error-view-module-ZfydO {
+    margin-block-end: var(--space-16);
+  }
+  .default-error-view-module-IXKuf p {
+    margin-block: var(--space-16);
+  }
+  .default-error-view-module-IXKuf .default-error-view-module-pGbzW {
+    margin-block: var(--space-16);
+  }
+  .default-error-view-module-IXKuf .default-error-view-module-LRchn {
+    display: block;
+    font-weight: bold;
+    margin-block-end: var(--space-8);
+  }
+  .default-error-view-module-IXKuf .default-error-view-module-Tz1Vb .default-error-view-module-go6yg {
+      font-size: var(--font-size-12);
+      font-weight: bold;
+      margin-block-end: 0;
+    }
+  .default-error-view-module-IXKuf .default-error-view-module-Tz1Vb .default-error-view-module--B3DB {
+      overflow: auto;
+      margin: 0;
+      font: inherit;
+      font-size: var(--font-size-12);
+    }
+  .default-error-view-module-IXKuf .default-error-view-module-Tz1Vb .default-error-view-module--B3DB:focus-visible {
+        outline: var(--focus-outline-inset);
+      }
+
 .no-results-module-HGe-Y {
   margin-top: var(--space-24);
   text-align: center;
@@ -8896,11 +9004,26 @@ button.swiper-pagination-bullet {
     }
 
   .order-details-content-module-aU3VQ .order-details-content-module--1w7s dl {
-      display: flex;
+      display: grid;
+      align-items: baseline;
+      gap: var(--space-8) var(--space-16);
+      grid-template-columns:
+        [title-start] fit-content(25ch)
+        [title-end data-start] 1fr [data-end];
     }
 
   .order-details-content-module-aU3VQ .order-details-content-module--1w7s dl dt {
         font-weight: var(--font-weight-bold);
+        grid-column: title;
+      }
+
+  .order-details-content-module-aU3VQ .order-details-content-module--1w7s dl dt::after {
+          content: ':';
+        }
+
+  .order-details-content-module-aU3VQ .order-details-content-module--1w7s dl dd {
+        margin: 0;
+        grid-column: data;
       }
 
   .order-details-content-module-aU3VQ .order-details-content-module-BO26h h3 {
@@ -9478,6 +9601,51 @@ button.swiper-pagination-bullet {
     }
   }
 
+.basic-error-view-module-iKnnd {
+  padding: 0;
+  margin: 0;
+  block-size: 100%;
+}
+
+  .basic-error-view-module-iKnnd body {
+    position: relative;
+    display: grid;
+    grid-template-columns: 100%;
+    min-block-size: 100%;
+  }
+
+  .basic-error-view-module-iKnnd main {
+    inline-size: -moz-fit-content;
+    inline-size: fit-content;
+    max-inline-size: min(calc(100% - 32px), 60ch);
+    place-self: center;
+  }
+
+  .basic-error-view-module-iKnnd main > *:last-child {
+      margin-block-end: 0;
+    }
+
+  .basic-error-view-module-iKnnd .basic-error-view-module-vyq6y {
+    margin-block-end: var(--space-16);
+  }
+
+  .basic-error-view-module-iKnnd p {
+    margin-block: var(--space-16);
+  }
+
+  .basic-error-view-module-iKnnd a {
+    color: var(--color-brand-red);
+    text-decoration: underline;
+  }
+
+  .basic-error-view-module-iKnnd a:hover {
+      color: var(--color-brand-dark-red);
+    }
+
+  .basic-error-view-module-iKnnd a:focus-visible {
+      outline: var(--focus-outline);
+    }
+
 .sidebar-provider-module-rjeCL {
   --transition-duration: 0;
 }

package/dist/tooltip/tooltip.js

@@ -3,8 +3,8 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useRef, useMemo, cloneElement } from 'react';
 import { usePress } from 'react-aria';
 import { DialogTrigger, Popover, OverlayArrow, Dialog } from 'react-aria-components';
-import { IconButton } from '../buttons/icon-button/icon-button.js';
 import clsx from 'clsx';
+import { IconButton } from '../buttons/icon-button/icon-button.js';
 import { StrokeInformationIcon } from '../icons/stroke/stroke-information-icon.js';
 import { useDisclosure } from '../shared/hooks/use-disclosure.js';
 import styles from './tooltip.module.css.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sonic-equipment/ui",
-  "version": "239.0.0",
+  "version": "241.0.0",
   "type": "module",
   "license": "MIT",
   "engines": {
@@ -87,6 +87,7 @@
     "eslint-plugin-react": "7.37.5",
     "eslint-plugin-react-hooks": "5.2.0",
     "eslint-plugin-react-server-components": "^1.2.0",
+    "eslint-plugin-require-relative-imports": "1.0.0",
     "eslint-plugin-simple-import-sort": "12.1.1",
     "eslint-plugin-sort-destructure-keys": "2.0.0",
     "eslint-plugin-sort-keys-fix": "1.1.2",