@zenpatient-org/healthspan-marketing-ui 0.2.73 → 0.2.75

package/dist/components/HighlightCard/HighlightCard.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("../Icon/constants.cjs.js"),a=require("../../src/components/HighlightCard/highlightCard.module.css"),s=require("../Typography/Typography.cjs.js"),m=require("../IconButton/IconButton.cjs.js"),u=({image:g,eyebrow:i,title:r,description:o,link:t,colorScheme:n="light"})=>{const c=n==="light"?"muted-invert":"muted",l=e.jsxs(e.Fragment,{children:[i&&e.jsx(s.Typography,{as:"p",defaultVariant:"labelSm",emphasis:!0,className:a.eyebrow,children:i}),e.jsxs("div",{className:a.bottomContainer,children:[e.jsxs("div",{className:a.titleContainer,children:[r&&e.jsx(s.Typography,{as:"p",defaultVariant:"headingXl",mobileVariant:"headingLg",className:a.title,children:r}),t&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:a.desktop,children:e.jsx(m.IconButton,{variant:c,size:"lg",iconName:h.EIconName.ARROW_FORWARD})}),e.jsx("div",{className:a.mobile,children:e.jsx(m.IconButton,{variant:c,size:"md",iconName:h.EIconName.ARROW_FORWARD})})]})]}),o&&e.jsx(s.Typography,{as:"p",defaultVariant:"bodySm",className:a.description,children:o})]})]}),d={backgroundImage:`url(${g})`,backgroundSize:"cover",backgroundPosition:"center"};return t?e.jsx("a",{href:t,className:a.highlightCard,style:d,"data-scheme":n,children:l}):e.jsx("div",{className:a.highlightCard,style:d,"data-scheme":n,children:l})};exports.HighlightCard=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),h=require("../Icon/constants.cjs.js"),a=require("../../src/components/HighlightCard/highlightCard.module.css"),s=require("../Typography/Typography.cjs.js"),m=require("../IconButton/IconButton.cjs.js"),u=({image:g,eyebrow:i,title:r,description:o,link:t,colorScheme:n="light"})=>{const c=n==="light"?"muted-invert":"muted",l=e.jsxs(e.Fragment,{children:[i&&e.jsx(s.Typography,{as:"p",defaultVariant:"labelXs",emphasis:!0,className:a.eyebrow,children:i}),e.jsxs("div",{className:a.bottomContainer,children:[e.jsxs("div",{className:a.titleContainer,children:[r&&e.jsx(s.Typography,{as:"p",defaultVariant:"headingLg",mobileVariant:"headingLg",className:a.title,children:r}),t&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:a.desktop,children:e.jsx(m.IconButton,{variant:c,size:"lg",iconName:h.EIconName.ARROW_FORWARD})}),e.jsx("div",{className:a.mobile,children:e.jsx(m.IconButton,{variant:c,size:"md",iconName:h.EIconName.ARROW_FORWARD})})]})]}),o&&e.jsx(s.Typography,{as:"p",defaultVariant:"bodySm",className:a.description,children:o})]})]}),d={backgroundImage:`url(${g})`,backgroundSize:"cover",backgroundPosition:"center"};return t?e.jsx("a",{href:t,className:a.highlightCard,style:d,"data-scheme":n,children:l}):e.jsx("div",{className:a.highlightCard,style:d,"data-scheme":n,children:l})};exports.HighlightCard=u;

package/dist/components/HighlightCard/HighlightCard.es.js

@@ -6,23 +6,23 @@ import { IconButton as p } from "../IconButton/IconButton.es.js";
 const y = ({
   image: u,
   eyebrow: s,
-  title: l,
-  description: d,
+  title: d,
+  description: l,
   link: i,
   colorScheme: r = "light"
 }) => {
   const c = r === "light" ? "muted-invert" : "muted", o = /* @__PURE__ */ t(h, { children: [
-    s && /* @__PURE__ */ a(n, { as: "p", defaultVariant: "labelSm", emphasis: !0, className: e.eyebrow, children: s }),
+    s && /* @__PURE__ */ a(n, { as: "p", defaultVariant: "labelXs", emphasis: !0, className: e.eyebrow, children: s }),
     /* @__PURE__ */ t("div", { className: e.bottomContainer, children: [
       /* @__PURE__ */ t("div", { className: e.titleContainer, children: [
-        l && /* @__PURE__ */ a(
+        d && /* @__PURE__ */ a(
           n,
           {
             as: "p",
-            defaultVariant: "headingXl",
+            defaultVariant: "headingLg",
             mobileVariant: "headingLg",
             className: e.title,
-            children: l
+            children: d
           }
         ),
         i && /* @__PURE__ */ t(h, { children: [
@@ -30,7 +30,7 @@ const y = ({
           /* @__PURE__ */ a("div", { className: e.mobile, children: /* @__PURE__ */ a(p, { variant: c, size: "md", iconName: g.ARROW_FORWARD }) })
         ] })
       ] }),
-      d && /* @__PURE__ */ a(n, { as: "p", defaultVariant: "bodySm", className: e.description, children: d })
+      l && /* @__PURE__ */ a(n, { as: "p", defaultVariant: "bodySm", className: e.description, children: l })
     ] })
   ] }), m = { backgroundImage: `url(${u})`, backgroundSize: "cover", backgroundPosition: "center" };
   return i ? /* @__PURE__ */ a("a", { href: i, className: e.highlightCard, style: m, "data-scheme": r, children: o }) : /* @__PURE__ */ a("div", { className: e.highlightCard, style: m, "data-scheme": r, children: o });

package/dist/components/HighlightCard/highlightCard.module.css

@@ -7,7 +7,7 @@
     justify-content: space-between;
     padding: 32px;
     border-radius: var(--border-radius-lg);
-    aspect-ratio: 389 / 483;
+    aspect-ratio: 309 / 383;
     color: var(--primary-inverted);
     text-decoration: none;
 }
@@ -58,19 +58,21 @@
 }
 
 @media (width <= 1200px) {
-    .highlightCard {
-        padding: 24px;
-    }
-
     .bottomContainer {
         max-width: 321px;
-        gap: 8px;
+    }
+}
+
+@media (width <= 930px) {
+    .highlightCard {
+        aspect-ratio: 380 / 397;
     }
 }
 
 @media (width <= 768px) {
     .highlightCard {
         padding: 24px;
+        aspect-ratio: 309 / 383;
     }
 
     .bottomContainer {

package/dist/components/Label/Label.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),o=require("../../utils/cn/cn.cjs.js"),e=require("../../src/components/Label/label.module.css"),r={nano:e.labelXs,sm:e.labelXs,lg:e.labelSm},c=({children:l,color:t,size:s="sm",className:a})=>n.jsx("div",{className:o.cn(e.root,e.labelEmphasis,r[s],a),"data-size":s,"data-color":t,children:l});exports.Label=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),c=require("../../utils/cn/cn.cjs.js"),e=require("../../src/components/Label/label.module.css"),n={pico:e.labelPico,nano:e.labelXs,sm:e.labelXs,lg:e.labelSm},r=({children:s,color:t,size:l="sm",className:a})=>o.jsx("div",{className:c.cn(e.root,e.labelEmphasis,n[l],a),"data-size":l,"data-color":t,children:s});exports.Label=r;

package/dist/components/Label/Label.es.js

@@ -2,18 +2,19 @@ import { jsx as r } from "react/jsx-runtime";
 import { cn as t } from "../../utils/cn/cn.es.js";
 import o from "../../components/Label/label.module.css";
 const e = {
+  pico: o.labelPico,
   nano: o.labelXs,
   sm: o.labelXs,
   lg: o.labelSm
-}, i = ({ children: l, color: s, size: a = "sm", className: m }) => /* @__PURE__ */ r(
+}, n = ({ children: a, color: s, size: l = "sm", className: m }) => /* @__PURE__ */ r(
   "div",
   {
-    className: t(o.root, o.labelEmphasis, e[a], m),
-    "data-size": a,
+    className: t(o.root, o.labelEmphasis, e[l], m),
+    "data-size": l,
     "data-color": s,
-    children: l
+    children: a
   }
 );
 export {
-  i as Label
+  n as Label
 };

package/dist/components/Label/label.module.css

@@ -22,6 +22,11 @@
     padding: var(--spacing-4) var(--spacing-8);
 }
 
+.root[data-size='pico'] {
+    min-height: 16px;
+    padding: var(--spacing-4) var(--spacing-8);
+}
+
 .root[data-color='black'] {
     background-color: var(--color-bg-fill-primary);
     color: var(--color-text-primary-inverted);
@@ -147,6 +152,15 @@
     font-size: var(--font-size-xxs);
 }
 
+.labelPico {
+    font-family: var(--font-default), sans-serif;
+    line-height: var(--line-height-xs);
+    letter-spacing: var(--letter-spacing-null);
+    font-weight: var(--font-weight-regular);
+    font-style: normal;
+    font-size: var(--font-size-xxxs);
+}
+
 .labelEmphasis {
     font-family: var(--font-decorative), monospace;
     text-transform: uppercase;

package/dist/components/Label/types.d.ts

@@ -1,4 +1,4 @@
-export type LabelSize = 'nano' | 'sm' | 'lg';
+export type LabelSize = 'pico' | 'nano' | 'sm' | 'lg';
 export type LabelColor = 'black' | 'white' | 'grey' | 'alpha-white' | 'sage' | 'indigo' | 'orchre' | 'solar' | 'lilac' | 'success' | 'warning' | 'danger' | 'info' | 'supportive' | 'indigo-gradient' | 'ochre-gradient' | 'solar-gradient' | 'lilac-gradient';
 export type LabelProps = {
     children: string;

package/dist/components/Typography/Typography.d.ts

@@ -1,6 +1,6 @@
 import { default as React, ElementType } from 'react';
 
-export type TypographyVariant = 'displayXl' | 'displayLg' | 'displayMd' | 'displaySm' | 'displayXs' | 'headingXl' | 'headingLg' | 'headingMd' | 'headingSm' | 'headingXs' | 'headingXxs' | 'preambleLg' | 'preambleMd' | 'preambleSm' | 'bodyXl' | 'bodyLg' | 'bodyMd' | 'bodySm' | 'bodyXs' | 'linkLg' | 'linkMd' | 'linkSm' | 'linkXs' | 'labelXl' | 'labelLg' | 'labelMd' | 'labelSm' | 'labelXs' | 'profileXl' | 'profileLg' | 'profileMd' | 'profileSm';
+export type TypographyVariant = 'displayXl' | 'displayLg' | 'displayMd' | 'displaySm' | 'displayXs' | 'headingXl' | 'headingLg' | 'headingMd' | 'headingSm' | 'headingXs' | 'headingXxs' | 'preambleLg' | 'preambleMd' | 'preambleSm' | 'bodyXl' | 'bodyLg' | 'bodyMd' | 'bodySm' | 'bodyXs' | 'linkLg' | 'linkMd' | 'linkSm' | 'linkXs' | 'labelXl' | 'labelLg' | 'labelMd' | 'labelSm' | 'labelXs' | 'labelXxs' | 'profileXl' | 'profileLg' | 'profileMd' | 'profileSm';
 type FontWeight = 'regular' | 'medium';
 export interface TypographyProps {
     defaultVariant: TypographyVariant;

package/dist/components/Typography/typography.module.css

@@ -273,6 +273,15 @@
     font-size: var(--font-size-xxs);
 }
 
+.labelXxs {
+    font-family: var(--font-default), sans-serif;
+    line-height: var(--line-height-xs);
+    letter-spacing: var(--letter-spacing-null);
+    font-weight: var(--font-weight-regular);
+    font-style: normal;
+    font-size: var(--font-size-xxxs);
+}
+
 .labelEmphasis {
     font-family: var(--font-decorative), monospace;
     text-transform: uppercase;
@@ -644,7 +653,7 @@
         font-style: normal;
         font-size: var(--font-size-heading-lg);
     }
-    
+
     .profileLg {
         font-family: var(--font-default), sans-serif;
         line-height: var(--line-height-sm);
@@ -653,7 +662,7 @@
         font-style: normal;
         font-size: var(--font-size-xxl);
     }
-    
+
     .profileMd {
         font-family: var(--font-default), sans-serif;
         line-height: var(--line-height-sm);
@@ -662,7 +671,7 @@
         font-style: normal;
         font-size: var(--font-size-lg);
     }
-    
+
     .profileSm {
         font-family: var(--font-default), sans-serif;
         line-height: var(--line-height-xs);

package/dist/modules/Highlight/highlight.module.css

@@ -74,17 +74,15 @@
     width: 100%;
 }
 
-@media (min-width: 900px) and (max-width: 1200px) {
-    .cardGridItem {
-        max-width: 290px;
-        width: 100%;
-    }
-}
 @media (min-width: 769px) and (max-width: 1200px) {
     .cardGrid {
         max-width: 100%;
     }
 
+    .cardGridItem {
+        max-width: 309px;
+    }
+
     .title {
         font-size: 56px;
         letter-spacing: -2.24px;
@@ -96,15 +94,18 @@
 
     .container {
         padding: 64px 17px;
-        gap: 32px;
     }
 }
 
-@media (max-width: 900px) {
+@media (max-width: 930px) {
     .cardGrid {
         flex-direction: column;
         align-items: center;
     }
+
+    .cardGridItem {
+        max-width: 389px;
+    }
 }
 
 @media (max-width: 768px) {

package/dist/styles/core.css

@@ -1 +1 @@
-:root{--color-black: #000000;--color-white: #ffffff;--color-midnight-50: #f1f0f4;--color-midnight-100: #e3e1ea;--color-midnight-200: #aaa6bf;--color-midnight-300: #5b5676;--color-midnight-400: #2e2b3b;--color-midnight-500: #111016;--color-navy-50: #e9f5fc;--color-navy-100: #d2eaf9;--color-navy-200: #79c0ec;--color-navy-300: #1a78b2;--color-navy-400: #0d3c59;--color-navy-500: #092a3e;--color-copper-50: #f8f1ec;--color-copper-100: #f1e3da;--color-copper-200: #d5ac90;--color-copper-300: #955d37;--color-copper-400: #835231;--color-copper-500: #4a2e1c;--color-orchre-50: #fff5e6;--color-orchre-100: #feeacd;--color-orchre-200: #fcc169;--color-orchre-300: #fba626;--color-orchre-400: #c87a04;--color-orchre-500: #643d02;--color-indigo-50: #eaf2fa;--color-indigo-100: #cadff3;--color-indigo-200: #81b1e2;--color-indigo-300: #5999d9;--color-indigo-400: #2666a6;--color-indigo-500: #133353;--color-sage-50: #f1f8ed;--color-sage-100: #e3f1da;--color-sage-200: #a5d088;--color-sage-300: #90c56d;--color-sage-400: #5d923a;--color-sage-500: #2f491d;--color-solar-50: #fffce6;--color-solar-100: #fffacc;--color-solar-200: #fef38e;--color-solar-300: #feef67;--color-solar-400: #cab602;--color-solar-500: #655b01;--color-ivory-50: #fbf3e9;--color-ivory-100: #fbf1e6;--color-ivory-200: #f1cda7;--color-ivory-300: #e39b4f;--color-ivory-400: #b0681c;--color-ivory-500: #58340e;--color-lilac-50: #d6cefb;--color-lilac-100: #bdb0f8;--color-lilac-200: #b0a4e8;--color-lilac-300: #625793;--color-lilac-400: #4e4879;--color-lilac-500: #0a151c;--color-neutral-100: #f7f7f7;--color-neutral-200: #e5e5e5;--color-neutral-300: #adadad;--color-neutral-400: #888888;--color-neutral-500: #676767;--color-neutral-900: #1a1a1a;--color-urgent-red-100: #ffe2e1;--color-urgent-red-200: #ffcabe;--color-urgent-red-300: #ff5850;--color-urgent-red-400: #e4271d;--color-urgent-red-500: #841d18;--color-calm-green-100: #e1f7e6;--color-calm-green-200: #beecc8;--color-calm-green-300: #56d391;--color-calm-green-400: #0d9051;--color-calm-green-500: #084b2e;--color-powder-blue-100: #deecfa;--color-powder-blue-200: #c4e0f8;--color-powder-blue-300: #5a9bea;--color-powder-blue-400: #3375dc;--color-powder-blue-500: #264582;--color-heal-yellow-100: #fff8c8;--color-heal-yellow-200: #ffec88;--color-heal-yellow-300: #f6c64f;--color-heal-yellow-400: #eeab04;--color-heal-yellow-500: #733b10;--color-cell-pink-100: #fee5f1;--color-cell-pink-200: #fed7ea;--color-cell-pink-300: #ff81b8;--color-cell-pink-400: #eb1664;--color-cell-pink-500: #8d0e37;--color-bg-base-light: var(--color-white);--color-bg-base-dark: var(--color-black);--color-bg-neutral-light: var(--color-neutral-100);--color-bg-neutral-medium: var(--color-neutral-200);--color-bg-success: var(--color-calm-green-100);--color-bg-warning: var(--color-heal-yellow-100);--color-bg-danger: var(--color-urgent-red-300);--color-bg-info: var(--color-powder-blue-100);--color-bg-supportive: var(--color-cell-pink-100);--color-bg-success-fill: var(--color-calm-green-300);--color-bg-warning-fill: var(--color-heal-yellow-300);--color-bg-danger-fill: var(--color-urgent-red-300);--color-bg-info-fill: var(--color-powder-blue-300);--color-bg-supportive-fill: var(--color-cell-pink-300);--color-bg-fill-primary: var(--color-black);--color-bg-fill-brand-solar: var(--color-solar-200);--color-bg-fill-brand-indigo: var(--color-indigo-200);--color-bg-fill-brand-sage: var(--color-sage-200);--color-bg-fill-brand-orchre: var(--color-orchre-300);--color-bg-fill-brand-lilac: var(--color-lilac-100);--color-bg-fill-brand-disabled: var(--color-neutral-400);--color-bg-fill-brand-inverse: var(--color-white);--color-bg-fill-neutral-dark: var(--color-neutral-900);--color-bg-fill-alpha-white-10: rgba(255, 255, 255, .1);--color-bg-fill-alpha-white-20: rgba(255, 255, 255, .2);--color-bg-fill-alpha-black-10: rgba(0, 0, 0, .1);--color-bg-fill-alpha-black-40: rgba(0, 0, 0, .4);--color-text-primary: var(--color-black);--color-text-primary-brand-solar: var(--color-solar-200);--color-text-primary-brand-indigo: var(--color-indigo-300);--color-text-primary-brand-lilac: var(--color-lilac-300);--color-text-primary-disabled: var(--color-neutral-300);--color-text-primary-inverted: var(--color-white);--color-text-secondary: var(--color-neutral-500);--color-text-secondary-hover: var(--color-neutral-400);--color-text-secondary-disabled: var(--color-neutral-300);--color-text-secondary-inverted: var(--color-neutral-200);--color-text-success-dark: var(--color-calm-green-500);--color-text-success-light: var(--color-calm-green-400);--color-text-success-hover: var(--color-calm-green-300);--color-text-success-disabled: var(--color-calm-green-200);--color-text-warning-dark: var(--color-heal-yellow-500);--color-text-warning-light: var(--color-heal-yellow-400);--color-text-warning-hover: var(--color-heal-yellow-300);--color-text-warning-disabled: var(--color-heal-yellow-200);--color-text-danger-dark: var(--color-urgent-red-500);--color-text-danger-light: var(--color-urgent-red-400);--color-text-danger-hover: var(--color-urgent-red-300);--color-text-danger-disabled: var(--color-urgent-red-200);--color-text-info-dark: var(--color-powder-blue-500);--color-text-info-light: var(--color-powder-blue-400);--color-text-info-hover: var(--color-powder-blue-300);--color-text-info-disabled: var(--color-powder-blue-200);--color-text-supportive-dark: var(--color-cell-pink-500);--color-text-supportive-light: var(--color-cell-pink-400);--color-text-supportive-hover: var(--color-cell-pink-300);--color-text-supportive-disabled: var(--color-cell-pink-200);--border-color-light: var(--color-neutral-200);--border-color-medium: var(--color-neutral-300);--border-color-dark: var(--color-black);--border-color-indigo: var(--color-indigo-200);--border-color-solar: var(--color-solar-200);--border-color-lilac: var(--color-lilac-100);--border-color-invert: var(--color-white);--border-color-alpha-white-10: rgba(255, 255, 255, .1);--border-color-alpha-white-20: rgba(255, 255, 255, .2);--border-color-alpha-white-50: rgba(255, 255, 255, .5);--border-color-alpha-black-10: rgba(0, 0, 0, .1);--border-color-alpha-black-20: rgba(0, 0, 0, .2);--border-color-success: var(--color-calm-green-300);--border-color-success-en: var(--color-calm-green-500);--border-color-warning: var(--color-heal-yellow-300);--border-color-warning-en: var(--color-heal-yellow-500);--border-color-danger: var(--color-urgent-red-300);--border-color-danger-en: var(--color-urgent-red-500);--border-color-info: var(--color-powder-blue-300);--border-color-info-en: var(--color-powder-blue-500);--border-color-decorative: var(--color-cell-pink-300);--border-color-decorative-en: var(--color-cell-pink-500)}:root{--font-default: "Suisse Intl", sans-serif;--font-decorative: "Soehne Mono", monospace;--font-size-xxs: 10px;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-xxl: 24px;--font-size-heading-xxs: 18px;--font-size-heading-xs: 20px;--font-size-heading-sm: 24px;--font-size-heading-md: 28px;--font-size-heading-lg: 32px;--font-size-heading-xl: 40px;--font-size-display-xs: 48px;--font-size-display-sm: 56px;--font-size-display-md: 64px;--font-size-display-lg: 96px;--font-size-display-xl: 120px;--line-height-xxs: .9;--line-height-xs: 1;--line-height-sm: 1.1;--line-height-md: 1.2;--line-height-lg: 1.35;--line-height-xl: 1.4;--line-height-xxl: 1.5;--letter-spacing-negative-xxl: -.06em;--letter-spacing-negative-xl: -.04em;--letter-spacing-negative-lg: -.03em;--letter-spacing-negative-md: -.02em;--letter-spacing-negative-sm: -.01em;--letter-spacing-null: 0;--letter-spacing-sm: .01em;--letter-spacing-md: .02em;--letter-spacing-lg: .03em;--letter-spacing-xl: .05em;--letter-spacing-xxl: .1em;--font-weight-extra-light: 200;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semi-bold: 600;--font-weight-bold: 700;--font-weight-extra-bold: 800}:root{--border-radius-none: 0;--border-radius-xxs: 4px;--border-radius-xs: 8px;--border-radius-sm: 12px;--border-radius-md: 16px;--border-radius-lg: 24px;--border-radius-xl: 40px;--border-radius-xxl: 48px;--border-radius-xxxl: 120px;--border-radius-full: 999px;--border-width-sm: 1px;--border-width-md: 2px}:root{--spacing-0: 0;--spacing-4: 4px;--spacing-8: 8px;--spacing-12: 12px;--spacing-14: 14px;--spacing-16: 16px;--spacing-18: 18px;--spacing-20: 20px;--spacing-24: 24px;--spacing-28: 28px;--spacing-32: 32px;--spacing-36: 36px;--spacing-40: 40px;--spacing-48: 48px;--spacing-52: 52px;--spacing-56: 56px;--spacing-64: 64px;--spacing-72: 72px;--spacing-80: 80px;--spacing-88: 88px;--spacing-96: 96px;--spacing-104: 104px;--spacing-112: 112px;--spacing-120: 120px;--spacing-180: 180px;--content-max-width: 1440px;--content-max-height: 1285px}html{scroll-behavior:smooth}
+:root{--color-black: #000000;--color-white: #ffffff;--color-midnight-50: #f1f0f4;--color-midnight-100: #e3e1ea;--color-midnight-200: #aaa6bf;--color-midnight-300: #5b5676;--color-midnight-400: #2e2b3b;--color-midnight-500: #111016;--color-navy-50: #e9f5fc;--color-navy-100: #d2eaf9;--color-navy-200: #79c0ec;--color-navy-300: #1a78b2;--color-navy-400: #0d3c59;--color-navy-500: #092a3e;--color-copper-50: #f8f1ec;--color-copper-100: #f1e3da;--color-copper-200: #d5ac90;--color-copper-300: #955d37;--color-copper-400: #835231;--color-copper-500: #4a2e1c;--color-orchre-50: #fff5e6;--color-orchre-100: #feeacd;--color-orchre-200: #fcc169;--color-orchre-300: #fba626;--color-orchre-400: #c87a04;--color-orchre-500: #643d02;--color-indigo-50: #eaf2fa;--color-indigo-100: #cadff3;--color-indigo-200: #81b1e2;--color-indigo-300: #5999d9;--color-indigo-400: #2666a6;--color-indigo-500: #133353;--color-sage-50: #f1f8ed;--color-sage-100: #e3f1da;--color-sage-200: #a5d088;--color-sage-300: #90c56d;--color-sage-400: #5d923a;--color-sage-500: #2f491d;--color-solar-50: #fffce6;--color-solar-100: #fffacc;--color-solar-200: #fef38e;--color-solar-300: #feef67;--color-solar-400: #cab602;--color-solar-500: #655b01;--color-ivory-50: #fbf3e9;--color-ivory-100: #fbf1e6;--color-ivory-200: #f1cda7;--color-ivory-300: #e39b4f;--color-ivory-400: #b0681c;--color-ivory-500: #58340e;--color-lilac-50: #d6cefb;--color-lilac-100: #bdb0f8;--color-lilac-200: #b0a4e8;--color-lilac-300: #625793;--color-lilac-400: #4e4879;--color-lilac-500: #0a151c;--color-neutral-100: #f7f7f7;--color-neutral-200: #e5e5e5;--color-neutral-300: #adadad;--color-neutral-400: #888888;--color-neutral-500: #676767;--color-neutral-900: #1a1a1a;--color-urgent-red-100: #ffe2e1;--color-urgent-red-200: #ffcabe;--color-urgent-red-300: #ff5850;--color-urgent-red-400: #e4271d;--color-urgent-red-500: #841d18;--color-calm-green-100: #e1f7e6;--color-calm-green-200: #beecc8;--color-calm-green-300: #56d391;--color-calm-green-400: #0d9051;--color-calm-green-500: #084b2e;--color-powder-blue-100: #deecfa;--color-powder-blue-200: #c4e0f8;--color-powder-blue-300: #5a9bea;--color-powder-blue-400: #3375dc;--color-powder-blue-500: #264582;--color-heal-yellow-100: #fff8c8;--color-heal-yellow-200: #ffec88;--color-heal-yellow-300: #f6c64f;--color-heal-yellow-400: #eeab04;--color-heal-yellow-500: #733b10;--color-cell-pink-100: #fee5f1;--color-cell-pink-200: #fed7ea;--color-cell-pink-300: #ff81b8;--color-cell-pink-400: #eb1664;--color-cell-pink-500: #8d0e37;--color-bg-base-light: var(--color-white);--color-bg-base-dark: var(--color-black);--color-bg-neutral-light: var(--color-neutral-100);--color-bg-neutral-medium: var(--color-neutral-200);--color-bg-success: var(--color-calm-green-100);--color-bg-warning: var(--color-heal-yellow-100);--color-bg-danger: var(--color-urgent-red-300);--color-bg-info: var(--color-powder-blue-100);--color-bg-supportive: var(--color-cell-pink-100);--color-bg-success-fill: var(--color-calm-green-300);--color-bg-warning-fill: var(--color-heal-yellow-300);--color-bg-danger-fill: var(--color-urgent-red-300);--color-bg-info-fill: var(--color-powder-blue-300);--color-bg-supportive-fill: var(--color-cell-pink-300);--color-bg-fill-primary: var(--color-black);--color-bg-fill-brand-solar: var(--color-solar-200);--color-bg-fill-brand-indigo: var(--color-indigo-200);--color-bg-fill-brand-sage: var(--color-sage-200);--color-bg-fill-brand-orchre: var(--color-orchre-300);--color-bg-fill-brand-lilac: var(--color-lilac-100);--color-bg-fill-brand-disabled: var(--color-neutral-400);--color-bg-fill-brand-inverse: var(--color-white);--color-bg-fill-neutral-dark: var(--color-neutral-900);--color-bg-fill-alpha-white-10: rgba(255, 255, 255, .1);--color-bg-fill-alpha-white-20: rgba(255, 255, 255, .2);--color-bg-fill-alpha-black-10: rgba(0, 0, 0, .1);--color-bg-fill-alpha-black-40: rgba(0, 0, 0, .4);--color-text-primary: var(--color-black);--color-text-primary-brand-solar: var(--color-solar-200);--color-text-primary-brand-indigo: var(--color-indigo-300);--color-text-primary-brand-lilac: var(--color-lilac-300);--color-text-primary-disabled: var(--color-neutral-300);--color-text-primary-inverted: var(--color-white);--color-text-secondary: var(--color-neutral-500);--color-text-secondary-hover: var(--color-neutral-400);--color-text-secondary-disabled: var(--color-neutral-300);--color-text-secondary-inverted: var(--color-neutral-200);--color-text-success-dark: var(--color-calm-green-500);--color-text-success-light: var(--color-calm-green-400);--color-text-success-hover: var(--color-calm-green-300);--color-text-success-disabled: var(--color-calm-green-200);--color-text-warning-dark: var(--color-heal-yellow-500);--color-text-warning-light: var(--color-heal-yellow-400);--color-text-warning-hover: var(--color-heal-yellow-300);--color-text-warning-disabled: var(--color-heal-yellow-200);--color-text-danger-dark: var(--color-urgent-red-500);--color-text-danger-light: var(--color-urgent-red-400);--color-text-danger-hover: var(--color-urgent-red-300);--color-text-danger-disabled: var(--color-urgent-red-200);--color-text-info-dark: var(--color-powder-blue-500);--color-text-info-light: var(--color-powder-blue-400);--color-text-info-hover: var(--color-powder-blue-300);--color-text-info-disabled: var(--color-powder-blue-200);--color-text-supportive-dark: var(--color-cell-pink-500);--color-text-supportive-light: var(--color-cell-pink-400);--color-text-supportive-hover: var(--color-cell-pink-300);--color-text-supportive-disabled: var(--color-cell-pink-200);--border-color-light: var(--color-neutral-200);--border-color-medium: var(--color-neutral-300);--border-color-dark: var(--color-black);--border-color-indigo: var(--color-indigo-200);--border-color-solar: var(--color-solar-200);--border-color-lilac: var(--color-lilac-100);--border-color-invert: var(--color-white);--border-color-alpha-white-10: rgba(255, 255, 255, .1);--border-color-alpha-white-20: rgba(255, 255, 255, .2);--border-color-alpha-white-50: rgba(255, 255, 255, .5);--border-color-alpha-black-10: rgba(0, 0, 0, .1);--border-color-alpha-black-20: rgba(0, 0, 0, .2);--border-color-success: var(--color-calm-green-300);--border-color-success-en: var(--color-calm-green-500);--border-color-warning: var(--color-heal-yellow-300);--border-color-warning-en: var(--color-heal-yellow-500);--border-color-danger: var(--color-urgent-red-300);--border-color-danger-en: var(--color-urgent-red-500);--border-color-info: var(--color-powder-blue-300);--border-color-info-en: var(--color-powder-blue-500);--border-color-decorative: var(--color-cell-pink-300);--border-color-decorative-en: var(--color-cell-pink-500)}:root{--font-default: "Suisse Intl", sans-serif;--font-decorative: "Soehne Mono", monospace;--font-size-xxxs: 8px;--font-size-xxs: 10px;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-xxl: 24px;--font-size-heading-xxs: 18px;--font-size-heading-xs: 20px;--font-size-heading-sm: 24px;--font-size-heading-md: 28px;--font-size-heading-lg: 32px;--font-size-heading-xl: 40px;--font-size-display-xs: 48px;--font-size-display-sm: 56px;--font-size-display-md: 64px;--font-size-display-lg: 96px;--font-size-display-xl: 120px;--line-height-xxs: .9;--line-height-xs: 1;--line-height-sm: 1.1;--line-height-md: 1.2;--line-height-lg: 1.35;--line-height-xl: 1.4;--line-height-xxl: 1.5;--letter-spacing-negative-xxl: -.06em;--letter-spacing-negative-xl: -.04em;--letter-spacing-negative-lg: -.03em;--letter-spacing-negative-md: -.02em;--letter-spacing-negative-sm: -.01em;--letter-spacing-null: 0;--letter-spacing-sm: .01em;--letter-spacing-md: .02em;--letter-spacing-lg: .03em;--letter-spacing-xl: .05em;--letter-spacing-xxl: .1em;--font-weight-extra-light: 200;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semi-bold: 600;--font-weight-bold: 700;--font-weight-extra-bold: 800}:root{--border-radius-none: 0;--border-radius-xxs: 4px;--border-radius-xs: 8px;--border-radius-sm: 12px;--border-radius-md: 16px;--border-radius-lg: 24px;--border-radius-xl: 40px;--border-radius-xxl: 48px;--border-radius-xxxl: 120px;--border-radius-full: 999px;--border-width-sm: 1px;--border-width-md: 2px}:root{--spacing-0: 0;--spacing-4: 4px;--spacing-8: 8px;--spacing-12: 12px;--spacing-14: 14px;--spacing-16: 16px;--spacing-18: 18px;--spacing-20: 20px;--spacing-24: 24px;--spacing-28: 28px;--spacing-32: 32px;--spacing-36: 36px;--spacing-40: 40px;--spacing-48: 48px;--spacing-52: 52px;--spacing-56: 56px;--spacing-64: 64px;--spacing-72: 72px;--spacing-80: 80px;--spacing-88: 88px;--spacing-96: 96px;--spacing-104: 104px;--spacing-112: 112px;--spacing-120: 120px;--spacing-180: 180px;--content-max-width: 1440px;--content-max-height: 1285px}html{scroll-behavior:smooth}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@zenpatient-org/healthspan-marketing-ui",
-    "version": "0.2.73",
+    "version": "0.2.75",
     "description": "Design system",
     "main": "dist/index.cjs.js",
     "module": "dist/index.es.js",