bord-design-system 0.0.11 → 0.0.12

package/dist/components/BordEmptyState/BordEmptyState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BordEmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/BordEmptyState/BordEmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAK9D,OAAO,uCAAuC,CAAC;AAE/C,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,oBAAoB,CAkC5C,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"BordEmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/BordEmptyState/BordEmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAK9D,OAAO,uCAAuC,CAAC;AAE/C,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,oBAAoB,CAmC5C,CAAC;AAEF,eAAe,cAAc,CAAC"}

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

@@ -11,5 +11,6 @@ export interface IBordEmptyStateProps {
     buttonOneProps?: IBordButton;
     buttonTwoProps?: IBordButton;
     customClassNameSubTitle?: string;
+    customClassNameTitle?: string;
 }
 //# sourceMappingURL=BordEmptyState.types.d.ts.map

package/dist/components/BordEmptyState/BordEmptyState.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BordEmptyState.types.d.ts","sourceRoot":"","sources":["../../../src/components/BordEmptyState/BordEmptyState.types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,yBAAyB,EAAE,MAAM,8CAA8C,CAAC;AACzF,OAAO,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAC;AAEjF,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oBAAoB,CAAC,EAAE,yBAAyB,CAAC;IACjD,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC"}
+{"version":3,"file":"BordEmptyState.types.d.ts","sourceRoot":"","sources":["../../../src/components/BordEmptyState/BordEmptyState.types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,yBAAyB,EAAE,MAAM,8CAA8C,CAAC;AACzF,OAAO,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAC;AAEjF,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oBAAoB,CAAC,EAAE,yBAAyB,CAAC;IACjD,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B"}

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

@@ -10,7 +10,7 @@ export interface IBordInfoCardItem {
 }
 export interface IBordInfoCardHeader {
     icon?: ReactNode;
-    title?: string;
+    title?: string | ReactNode;
     subtitle?: string;
     description?: string | ReactNode;
 }

package/dist/components/BordInfoCard/BordInfoCard.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BordInfoCard.types.d.ts","sourceRoot":"","sources":["../../../src/components/BordInfoCard/BordInfoCard.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,8DAA8D,CAAC;AAC/F,OAAO,EAAE,wBAAwB,EAAE,MAAM,8CAA8C,CAAC;AAExF,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,oBAAoB,CAAC,EAAE,SAAS,CAAC;CAClC;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAClC;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,KAAK,CAAC;IAC1D,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC5B,kBAAkB,CAAC,EAAE,WAAW,CAAC;IACjC,oBAAoB,CAAC,EAAE,WAAW,CAAC;IACnC,mBAAmB,CAAC,EAAE,WAAW,CAAC;IAClC,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iCAAiC,CAAC,EAAE,eAAe,CAAC;IACpD,eAAe,CAAC,EAAE,wBAAwB,EAAE,CAAC;CAC9C"}
+{"version":3,"file":"BordInfoCard.types.d.ts","sourceRoot":"","sources":["../../../src/components/BordInfoCard/BordInfoCard.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,8DAA8D,CAAC;AAC/F,OAAO,EAAE,wBAAwB,EAAE,MAAM,8CAA8C,CAAC;AAExF,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,oBAAoB,CAAC,EAAE,SAAS,CAAC;CAClC;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAClC;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,KAAK,CAAC;IAC1D,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC5B,kBAAkB,CAAC,EAAE,WAAW,CAAC;IACjC,oBAAoB,CAAC,EAAE,WAAW,CAAC;IACnC,mBAAmB,CAAC,EAAE,WAAW,CAAC;IAClC,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iCAAiC,CAAC,EAAE,eAAe,CAAC;IACpD,eAAe,CAAC,EAAE,wBAAwB,EAAE,CAAC;CAC9C"}

package/dist/components/BordMetricCard/BordMetricCard.d.ts

@@ -19,7 +19,8 @@ export interface IBordMetricCardProps {
         className?: string;
     };
     isConcatenatedSecondary?: boolean;
+    customClassName?: string;
 }
-declare const BordMetricCard: ({ title, value, subvalue, description, icon, textColor, colorVariant, size, titleProps, valueProps, isConcatenatedSecondary, }: IBordMetricCardProps) => import("react/jsx-runtime").JSX.Element;
+declare const BordMetricCard: ({ title, value, subvalue, description, icon, textColor, colorVariant, size, titleProps, valueProps, isConcatenatedSecondary, customClassName, }: IBordMetricCardProps) => import("react/jsx-runtime").JSX.Element;
 export default BordMetricCard;
 //# sourceMappingURL=BordMetricCard.d.ts.map

package/dist/components/BordMetricCard/BordMetricCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BordMetricCard.d.ts","sourceRoot":"","sources":["../../../src/components/BordMetricCard/BordMetricCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlC,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAE5E,OAAO,uBAAuB,CAAC;AAE/B,MAAM,MAAM,oBAAoB,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/C,MAAM,MAAM,2BAA2B,GAAG,OAAO,GAAG,SAAS,CAAC;AAoD9D,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,SAAS,GAAG,MAAM,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,2BAA2B,CAAC;IAC3C,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAC5B,UAAU,CAAC,EAAE;QACX,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,UAAU,CAAC,EAAE;QACX,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC;AAED,QAAA,MAAM,cAAc,mIAYjB,oBAAoB,4CAsEtB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"BordMetricCard.d.ts","sourceRoot":"","sources":["../../../src/components/BordMetricCard/BordMetricCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlC,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAE5E,OAAO,uBAAuB,CAAC;AAE/B,MAAM,MAAM,oBAAoB,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/C,MAAM,MAAM,2BAA2B,GAAG,OAAO,GAAG,SAAS,CAAC;AAoD9D,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,SAAS,GAAG,MAAM,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,2BAA2B,CAAC;IAC3C,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAC5B,UAAU,CAAC,EAAE;QACX,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,UAAU,CAAC,EAAE;QACX,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,QAAA,MAAM,cAAc,oJAajB,oBAAoB,4CAsEtB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/index.d.ts

@@ -861,7 +861,7 @@ interface IBordInfoCardItem {
 }
 interface IBordInfoCardHeader {
     icon?: ReactNode;
-    title?: string;
+    title?: string | ReactNode;
     subtitle?: string;
     description?: string | ReactNode;
 }
@@ -908,8 +908,9 @@ interface IBordMetricCardProps {
         className?: string;
     };
     isConcatenatedSecondary?: boolean;
+    customClassName?: string;
 }
-declare const BordMetricCard: ({ title, value, subvalue, description, icon, textColor, colorVariant, size, titleProps, valueProps, isConcatenatedSecondary, }: IBordMetricCardProps) => react_jsx_runtime.JSX.Element;
+declare const BordMetricCard: ({ title, value, subvalue, description, icon, textColor, colorVariant, size, titleProps, valueProps, isConcatenatedSecondary, customClassName, }: IBordMetricCardProps) => react_jsx_runtime.JSX.Element;
 
 interface IBordTabItem {
     id: string;
@@ -1255,6 +1256,7 @@ interface IBordEmptyStateProps {
     buttonOneProps?: IBordButton;
     buttonTwoProps?: IBordButton;
     customClassNameSubTitle?: string;
+    customClassNameTitle?: string;
 }
 
 declare const BordEmptyState: FC<IBordEmptyStateProps>;

package/dist/index.esm.js

@@ -4792,7 +4792,7 @@ const setOpacityToHex = (hexColor, opacity) => {
     return hexWithOpacity;
 };
 
-var css_248z$p = ".bordMetricCard{align-items:center;border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0}@media (max-width:1023){.bordMetricCard{height:6.4rem}}@media (min-width:1024px){.bordMetricCard{height:8.4rem}}.bordMetricCard{min-width:0;padding:1.2rem}.bordMetricCard.bordMetricCardWithIcon{overflow:hidden}.bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0 .8rem}.bordMetricCardContent{flex:1 1 0%;gap:.4rem;justify-content:flex-end}.bordMetricCardContent,.bordMetricCardValueBlock{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.bordMetricCardValueBlock{gap:.2rem;width:100%}.bordMetricCardIcon{align-items:center;border:none;border-radius:15998.4rem;display:flex;flex-shrink:0;justify-content:center}.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:4.8rem;width:4.8rem}.bordMetricCardWithIcon.bordMetricCard--sizeSm .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardTitle{color:var(--ds-c-content-secondary);font-weight:400}.bordMetricCardValueRow{align-items:baseline;display:flex;gap:.4rem}.bordMetricCardValue{font-weight:700}.bordMetricCard--sizeLg .bordMetricCardValue{font-size:3.2rem;line-height:1.15}.bordMetricCard--sizeSm .bordMetricCardValue,.bordMetricCardSubvalue{font-size:1.6rem;line-height:1.25}.bordMetricCardSubvalue{font-weight:700}.bordMetricCardDescription{color:var(--ds-c-content-secondary);font-size:1.2rem;font-weight:400;line-height:1.5}.bordMetricCard.bordMetricCard--legacyDefault{border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0;height:auto;justify-content:space-between;min-height:0;min-width:23.3rem;padding-left:1.2rem;padding-right:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerSm{padding:.7rem 1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerLg{gap:.4rem;padding:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleSm{font-size:1rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleLg{font-size:1.4rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardContent{display:flex;flex:1 1 0%;flex-direction:column;gap:0;justify-content:flex-start;min-width:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardValue{font-size:3.2rem;font-weight:700}";
+var css_248z$p = ".bordMetricCard{align-items:center;border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0}@media (max-width:1022.4px){.bordMetricCard{height:6.4rem}}@media (min-width:1024px){.bordMetricCard{height:8.4rem}}.bordMetricCard{min-width:0;padding:1.2rem}.bordMetricCard.bordMetricCardWithIcon{overflow:hidden}.bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0 .8rem}.bordMetricCardContent{flex:1 1 0%;gap:.4rem;justify-content:flex-end}.bordMetricCardContent,.bordMetricCardValueBlock{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.bordMetricCardValueBlock{gap:.2rem;width:100%}.bordMetricCardIcon{align-items:center;border:none;border-radius:15998.4rem;display:flex;flex-shrink:0;justify-content:center}.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:4.8rem;width:4.8rem}.bordMetricCardWithIcon.bordMetricCard--sizeSm .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardTitle{color:var(--ds-c-content-secondary);font-weight:400}.bordMetricCardValueRow{align-items:baseline;display:flex;gap:.4rem}.bordMetricCardValue{font-weight:700}.bordMetricCard--sizeLg .bordMetricCardValue{font-size:3.2rem;line-height:1.15}.bordMetricCard--sizeSm .bordMetricCardValue{font-size:1.6rem;line-height:1.25}@media (max-width:1024){.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardSubvalue,.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardValue{font-size:1.6rem;line-height:1.25}}.bordMetricCardSubvalue{font-size:1.6rem;font-weight:700;line-height:1.25}.bordMetricCardDescription{color:var(--ds-c-content-secondary);font-size:1.2rem;font-weight:400;line-height:1.5}.bordMetricCard.bordMetricCard--legacyDefault{border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0;height:auto;justify-content:space-between;min-height:0;min-width:23.3rem;padding-left:1.2rem;padding-right:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerSm{padding:.7rem 1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerLg{gap:.4rem;padding:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleSm{font-size:1rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleLg{font-size:1.4rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardContent{display:flex;flex:1 1 0%;flex-direction:column;gap:0;justify-content:flex-start;min-width:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardValue{font-size:3.2rem;font-weight:700}";
 styleInject(css_248z$p);
 
 const COLOR_VARIANT_MAP = {
@@ -4832,7 +4832,7 @@ const getResolvedColors = (textColor, colorVariant) => {
 };
 const getBackgroundColor = (textColor, colorVariant, bgColor) => (hasCustomTextColor(textColor) || colorVariant === 'green' ? bgColor : 'var(--ds-c-layout-l1)');
 const getFormattedValue = (value) => (value === 0 ? '00' : (value ?? ''));
-const BordMetricCard = ({ title, value, subvalue, description, icon, textColor, colorVariant = 'default', size = 'sm', titleProps, valueProps, isConcatenatedSecondary = false, }) => {
+const BordMetricCard = ({ title, value, subvalue, description, icon, textColor, colorVariant = 'default', size = 'sm', titleProps, valueProps, isConcatenatedSecondary = false, customClassName = '', }) => {
     const { resolvedColor, iconStroke, bgColor, iconCircleBg } = getResolvedColors(textColor, colorVariant);
     const bgStyle = { backgroundColor: getBackgroundColor(textColor, colorVariant, bgColor) };
     const valueClassName = ['bordMetricCardValue', valueProps?.className].filter(Boolean).join(' ');
@@ -4845,7 +4845,7 @@ const BordMetricCard = ({ title, value, subvalue, description, icon, textColor,
     }
     const sizeModifier = size === 'lg' ? 'bordMetricCard--sizeLg' : 'bordMetricCard--sizeSm';
     const titleSizeClass = size === 'lg' ? 'bordMetricCardTitle--lg' : 'bordMetricCardTitle--sm';
-    const containerClassName = ['bordMetricCard', sizeModifier, 'bordMetricCardWithIcon'].join(' ');
+    const containerClassName = ['bordMetricCard', sizeModifier, 'bordMetricCardWithIcon', customClassName].join(' ');
     const titleClassName = ['bordMetricCardTitle', titleSizeClass, titleProps?.className].filter(Boolean).join(' ');
     const iconStandardSize = isConcatenatedSecondary ? ICON_STANDARD_SIZE.sm : ICON_STANDARD_SIZE[size];
     return (jsx("div", { style: bgStyle, className: containerClassName, children: jsxs("div", { className: "bordMetricCardMetricContent", children: [jsx("div", { className: "bordMetricCardIcon", style: { backgroundColor: iconCircleBg }, children: jsx(BordOneToneIcon, { variant: icon, standardSize: iconStandardSize, stroke: iconStroke }) }), jsxs("div", { className: "bordMetricCardContent", children: [jsx("h3", { className: titleClassName, children: title }), jsxs("div", { className: "bordMetricCardValueBlock", children: [valueRow, descriptionEl] })] })] }) }));
@@ -5846,7 +5846,7 @@ const BordToast = ({ variant = 'informative', title = '', description = '', onCl
     return (jsxs("div", { className: className, style: animationStyle, onAnimationEnd: onAnimationEnd, onClick: handleClose, children: [jsx(BordOneToneIcon, { variant: TOAST_VARIANTS[variant], customWidth: "2.4rem", className: "toastVariantIcon h-full w-24 mb-auto flex-shrink-0" }), jsxs("div", { className: `toastData ${renderItemsPosition}`, children: [jsxs("div", { className: `toastBody ${renderStyles}`, children: [jsxs("div", { className: "toastTextBlock", children: [!!customJSXMessage && customJSXMessage, !customJSXMessage && (jsxs(Fragment, { children: [jsx("div", { className: "toastTitle", children: title }), jsx("div", { className: "toastDescription", children: description })] }))] }), !hideAction && renderButtons] }), jsx(BordOneToneIcon, { variant: "x", customWidth: "1.8rem", className: "closeIcon toastCloseIcon" })] })] }));
 };
 
-var css_248z$b = ".bordMetricCards{display:flex;flex-wrap:wrap;gap:.4rem}.bordMetricCardsConcatenatedRoot{width:auto}.bordMetricCardsGroup{display:flex;flex-direction:row;gap:.8rem;min-width:0;width:100%}@media (min-width:1024px){.bordMetricCardsGroup{width:118rem}}@media (max-width:1022.4px){.bordMetricCardsGroup{width:97.2rem}}.bordMetricCardsGroupParent{flex-shrink:0}@media (max-width:1022.4px){.bordMetricCardsGroupParent{width:31.2rem}}@media (min-width:1024px){.bordMetricCardsGroupParent{flex-shrink:0;width:57.55rem}}.bordMetricCardsGroupCards{justify-content:space-between}.bordMetricCardsConcatenatedInner,.bordMetricCardsGroupCards{display:flex;flex:1 1 0%;min-width:0}.bordMetricCardsConcatenatedInner{background-color:var(--ds-c-layout-l1);border-color:var(--ds-c-stroke-default);border-radius:.8rem;border-width:1px;box-sizing:border-box;flex-wrap:nowrap;width:100%}@media (max-width:1022.4px){.bordMetricCardsConcatenatedInner{height:6.4rem;min-height:6.4rem}}@media (min-width:1024px){.bordMetricCardsConcatenatedInner{height:8.4rem;min-height:8.4rem}}.bordMetricCardsConcatenatedInner{align-items:center}.bordMetricCardsConcatenatedInner .bordMetricCard{align-self:stretch;border:none;border-radius:.8rem;flex:1 0 0;height:100%;min-height:0;min-width:0;min-width:17.4rem;padding:1.2rem 0;width:auto}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardMetricContent{justify-content:space-between;width:100%}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardSubvalue,.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardValue{font-size:1.6rem;line-height:1.25}.bordMetricCardsDivider{min-height:2rem;width:.1rem}@media (max-width:1023){.bordMetricCardsDivider{height:4rem;min-height:4rem}}@media (min-width:1024px){.bordMetricCardsDivider{height:6rem;min-height:6rem}}.bordMetricCardsDivider{align-self:center;background-color:var(--ds-c-stroke-interactive);flex-shrink:0}";
+var css_248z$b = ".bordMetricCards{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:2.4rem}.bordMetricCardsConcatenatedRoot{width:auto}.bordMetricCardsGroup{display:flex;flex-direction:row;gap:.8rem;min-width:0;width:100%}@media (min-width:1024px){.bordMetricCardsGroup{width:118rem}}@media (max-width:1022.4px){.bordMetricCardsGroup{width:97.2rem}}.bordMetricCardsGroupParent{flex-shrink:0}@media (max-width:1022.4px){.bordMetricCardsGroupParent{width:31.2rem}}@media (min-width:1024px){.bordMetricCardsGroupParent{flex-shrink:0;width:57.55rem}}.bordMetricCardsGroupCards{justify-content:space-between}.bordMetricCardsConcatenatedInner,.bordMetricCardsGroupCards{display:flex;flex:1 1 0%;min-width:0}.bordMetricCardsConcatenatedInner{background-color:var(--ds-c-layout-l1);border-color:var(--ds-c-stroke-default);border-radius:.8rem;border-width:1px;box-sizing:border-box;flex-wrap:nowrap;width:100%}@media (max-width:1022.4px){.bordMetricCardsConcatenatedInner{height:6.4rem;min-height:6.4rem}}@media (min-width:1024px){.bordMetricCardsConcatenatedInner{height:8.4rem;min-height:8.4rem}}.bordMetricCardsConcatenatedInner{align-items:center}.bordMetricCardsConcatenatedInner .bordMetricCard{align-self:stretch;border:none;border-radius:.8rem;flex:1 0 0;height:100%;min-height:0;min-width:0;min-width:17.4rem;padding:1.2rem 0;width:auto}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardMetricContent{justify-content:space-between;width:100%}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardSubvalue,.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardValue{font-size:1.6rem;line-height:1.25}.bordMetricCardsDivider{min-height:2rem;width:.1rem}@media (max-width:1022.4px){.bordMetricCardsDivider{height:4rem;min-height:4rem}}@media (min-width:1024px){.bordMetricCardsDivider{height:6rem;min-height:6rem}}.bordMetricCardsDivider{align-self:center;background-color:var(--ds-c-stroke-interactive);flex-shrink:0}";
 styleInject(css_248z$b);
 
 const resolveConcatenatedParentColorVariant = (item) => {
@@ -5996,7 +5996,7 @@ const BordSortSelect = ({ triggerLabel, sortByOptions, selectedSortById, order,
 var css_248z$7 = ".bordEmptyStateDS{align-items:center;display:flex;flex-direction:column;gap:2.4rem;text-align:center}.bordEmptyStateDS .titleAndSubTitleContainer{max-width:58rem;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:-moz-max-content;width:max-content}.bordEmptyStateDS .titleAndSubTitleContainer .title{color:var(--ds-c-content-default);font-size:2rem;font-weight:700;line-height:2.6rem}.bordEmptyStateDS .titleAndSubTitleContainer .subTitle{color:var(--ds-c-content-secondary);font-size:1.6rem;font-weight:400;line-height:2.1rem;margin-top:.8rem}.bordEmptyStateDS .buttonsContainer{align-items:center;display:flex;gap:1.2rem}";
 styleInject(css_248z$7);
 
-const BordEmptyState = ({ title = 'title', subTitle, customClassNameSubTitle, buttonOneProps, buttonTwoProps, ilustrationIconProps, oneToneIconProps, twoToneIconProps, }) => {
+const BordEmptyState = ({ title = 'title', subTitle, customClassNameTitle = '', customClassNameSubTitle = '', buttonOneProps, buttonTwoProps, ilustrationIconProps, oneToneIconProps, twoToneIconProps, }) => {
     const defaultIcon = 'search';
     const defaultStandardSize = 100;
     const getIlustration = () => {
@@ -6009,7 +6009,7 @@ const BordEmptyState = ({ title = 'title', subTitle, customClassNameSubTitle, bu
         return jsx(BordIlustrationIcon, { standardSize: defaultStandardSize, variant: defaultIcon });
     };
     const ilustration = getIlustration();
-    return (jsxs("div", { className: "bordEmptyStateDS", children: [ilustration, jsxs("div", { className: "titleAndSubTitleContainer", children: [jsx("div", { className: "title", children: title }), subTitle && jsx("div", { className: `subTitle ${customClassNameSubTitle}`, children: subTitle })] }), jsxs("div", { className: "buttonsContainer", children: [buttonOneProps && jsx(BordButton, { ...buttonOneProps }), buttonTwoProps && jsx(BordButton, { ...buttonTwoProps })] })] }));
+    return (jsxs("div", { className: "bordEmptyStateDS", children: [ilustration, jsxs("div", { className: "titleAndSubTitleContainer", children: [jsx("div", { className: `title ${customClassNameTitle}`, children: title }), subTitle && jsx("div", { className: `subTitle ${customClassNameSubTitle}`, children: subTitle })] }), jsxs("div", { className: "buttonsContainer", children: [buttonOneProps && jsx(BordButton, { ...buttonOneProps }), buttonTwoProps && jsx(BordButton, { ...buttonTwoProps })] })] }));
 };
 
 var css_248z$6 = ".dsSwitchRoot{background-color:transparent;border-color:var(--ds-c-stroke-default);border-radius:4rem;border-style:solid;border-width:1px;border-width:.1rem;cursor:pointer;flex-shrink:0;height:2.2rem;position:relative;transition-duration:.2s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(0,0,.2,1);width:5.6rem}.dsSwitchRoot:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-offset-width:2px;--tw-ring-color:var(--ds-c-primary-bg-default);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);outline:2px solid transparent;outline-offset:2px}.dsSwitchRoot:disabled{border-color:var(--ds-c-bool-disabled-bg);cursor:not-allowed;opacity:.5}.dsSwitchThumb{border-radius:15998.4rem;display:grid;height:1.6rem;left:.2rem;overflow:hidden;padding:0;place-items:center;position:absolute;top:50%;transform:translateY(-50%);transition:transform .2s ease-out,background-color .2s ease-out,color .2s ease-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:1.6rem}.dsSwitchRoot:not(.dsSwitchRootOn) .dsSwitchThumb{background-color:var(--ds-c-stroke-default);color:var(--ds-c-content-secondary)}.dsSwitchRootOn .dsSwitchThumb{background-color:var(--ds-c-primary-bg-default);color:var(--ds-c-secondary-bg-default);transform:translateY(-50%) translateX(3.4rem)}.dsSwitchThumbLabel{align-items:center;color:inherit;display:flex;font-size:.8rem;font-weight:600;height:100%;justify-content:center;line-height:1;margin:0;text-align:center;width:100%}.dsSwitchSkeleton{background-color:var(--ds-c-stroke-default);border-radius:4rem;flex-shrink:0;height:2.2rem;pointer-events:none;width:5.6rem}";

package/dist/index.js

@@ -4798,7 +4798,7 @@ const setOpacityToHex = (hexColor, opacity) => {
     return hexWithOpacity;
 };
 
-var css_248z$p = ".bordMetricCard{align-items:center;border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0}@media (max-width:1023){.bordMetricCard{height:6.4rem}}@media (min-width:1024px){.bordMetricCard{height:8.4rem}}.bordMetricCard{min-width:0;padding:1.2rem}.bordMetricCard.bordMetricCardWithIcon{overflow:hidden}.bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0 .8rem}.bordMetricCardContent{flex:1 1 0%;gap:.4rem;justify-content:flex-end}.bordMetricCardContent,.bordMetricCardValueBlock{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.bordMetricCardValueBlock{gap:.2rem;width:100%}.bordMetricCardIcon{align-items:center;border:none;border-radius:15998.4rem;display:flex;flex-shrink:0;justify-content:center}.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:4.8rem;width:4.8rem}.bordMetricCardWithIcon.bordMetricCard--sizeSm .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardTitle{color:var(--ds-c-content-secondary);font-weight:400}.bordMetricCardValueRow{align-items:baseline;display:flex;gap:.4rem}.bordMetricCardValue{font-weight:700}.bordMetricCard--sizeLg .bordMetricCardValue{font-size:3.2rem;line-height:1.15}.bordMetricCard--sizeSm .bordMetricCardValue,.bordMetricCardSubvalue{font-size:1.6rem;line-height:1.25}.bordMetricCardSubvalue{font-weight:700}.bordMetricCardDescription{color:var(--ds-c-content-secondary);font-size:1.2rem;font-weight:400;line-height:1.5}.bordMetricCard.bordMetricCard--legacyDefault{border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0;height:auto;justify-content:space-between;min-height:0;min-width:23.3rem;padding-left:1.2rem;padding-right:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerSm{padding:.7rem 1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerLg{gap:.4rem;padding:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleSm{font-size:1rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleLg{font-size:1.4rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardContent{display:flex;flex:1 1 0%;flex-direction:column;gap:0;justify-content:flex-start;min-width:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardValue{font-size:3.2rem;font-weight:700}";
+var css_248z$p = ".bordMetricCard{align-items:center;border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0}@media (max-width:1022.4px){.bordMetricCard{height:6.4rem}}@media (min-width:1024px){.bordMetricCard{height:8.4rem}}.bordMetricCard{min-width:0;padding:1.2rem}.bordMetricCard.bordMetricCardWithIcon{overflow:hidden}.bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0 .8rem}.bordMetricCardContent{flex:1 1 0%;gap:.4rem;justify-content:flex-end}.bordMetricCardContent,.bordMetricCardValueBlock{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.bordMetricCardValueBlock{gap:.2rem;width:100%}.bordMetricCardIcon{align-items:center;border:none;border-radius:15998.4rem;display:flex;flex-shrink:0;justify-content:center}.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:4.8rem;width:4.8rem}.bordMetricCardWithIcon.bordMetricCard--sizeSm .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardTitle{color:var(--ds-c-content-secondary);font-weight:400}.bordMetricCardValueRow{align-items:baseline;display:flex;gap:.4rem}.bordMetricCardValue{font-weight:700}.bordMetricCard--sizeLg .bordMetricCardValue{font-size:3.2rem;line-height:1.15}.bordMetricCard--sizeSm .bordMetricCardValue{font-size:1.6rem;line-height:1.25}@media (max-width:1024){.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardSubvalue,.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardValue{font-size:1.6rem;line-height:1.25}}.bordMetricCardSubvalue{font-size:1.6rem;font-weight:700;line-height:1.25}.bordMetricCardDescription{color:var(--ds-c-content-secondary);font-size:1.2rem;font-weight:400;line-height:1.5}.bordMetricCard.bordMetricCard--legacyDefault{border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0;height:auto;justify-content:space-between;min-height:0;min-width:23.3rem;padding-left:1.2rem;padding-right:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerSm{padding:.7rem 1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerLg{gap:.4rem;padding:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleSm{font-size:1rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleLg{font-size:1.4rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardContent{display:flex;flex:1 1 0%;flex-direction:column;gap:0;justify-content:flex-start;min-width:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardValue{font-size:3.2rem;font-weight:700}";
 styleInject(css_248z$p);
 
 const COLOR_VARIANT_MAP = {
@@ -4838,7 +4838,7 @@ const getResolvedColors = (textColor, colorVariant) => {
 };
 const getBackgroundColor = (textColor, colorVariant, bgColor) => (hasCustomTextColor(textColor) || colorVariant === 'green' ? bgColor : 'var(--ds-c-layout-l1)');
 const getFormattedValue = (value) => (value === 0 ? '00' : (value ?? ''));
-const BordMetricCard = ({ title, value, subvalue, description, icon, textColor, colorVariant = 'default', size = 'sm', titleProps, valueProps, isConcatenatedSecondary = false, }) => {
+const BordMetricCard = ({ title, value, subvalue, description, icon, textColor, colorVariant = 'default', size = 'sm', titleProps, valueProps, isConcatenatedSecondary = false, customClassName = '', }) => {
     const { resolvedColor, iconStroke, bgColor, iconCircleBg } = getResolvedColors(textColor, colorVariant);
     const bgStyle = { backgroundColor: getBackgroundColor(textColor, colorVariant, bgColor) };
     const valueClassName = ['bordMetricCardValue', valueProps?.className].filter(Boolean).join(' ');
@@ -4851,7 +4851,7 @@ const BordMetricCard = ({ title, value, subvalue, description, icon, textColor,
     }
     const sizeModifier = size === 'lg' ? 'bordMetricCard--sizeLg' : 'bordMetricCard--sizeSm';
     const titleSizeClass = size === 'lg' ? 'bordMetricCardTitle--lg' : 'bordMetricCardTitle--sm';
-    const containerClassName = ['bordMetricCard', sizeModifier, 'bordMetricCardWithIcon'].join(' ');
+    const containerClassName = ['bordMetricCard', sizeModifier, 'bordMetricCardWithIcon', customClassName].join(' ');
     const titleClassName = ['bordMetricCardTitle', titleSizeClass, titleProps?.className].filter(Boolean).join(' ');
     const iconStandardSize = isConcatenatedSecondary ? ICON_STANDARD_SIZE.sm : ICON_STANDARD_SIZE[size];
     return (jsxRuntime.jsx("div", { style: bgStyle, className: containerClassName, children: jsxRuntime.jsxs("div", { className: "bordMetricCardMetricContent", children: [jsxRuntime.jsx("div", { className: "bordMetricCardIcon", style: { backgroundColor: iconCircleBg }, children: jsxRuntime.jsx(BordOneToneIcon, { variant: icon, standardSize: iconStandardSize, stroke: iconStroke }) }), jsxRuntime.jsxs("div", { className: "bordMetricCardContent", children: [jsxRuntime.jsx("h3", { className: titleClassName, children: title }), jsxRuntime.jsxs("div", { className: "bordMetricCardValueBlock", children: [valueRow, descriptionEl] })] })] }) }));
@@ -5852,7 +5852,7 @@ const BordToast = ({ variant = 'informative', title = '', description = '', onCl
     return (jsxRuntime.jsxs("div", { className: className, style: animationStyle, onAnimationEnd: onAnimationEnd, onClick: handleClose, children: [jsxRuntime.jsx(BordOneToneIcon, { variant: TOAST_VARIANTS[variant], customWidth: "2.4rem", className: "toastVariantIcon h-full w-24 mb-auto flex-shrink-0" }), jsxRuntime.jsxs("div", { className: `toastData ${renderItemsPosition}`, children: [jsxRuntime.jsxs("div", { className: `toastBody ${renderStyles}`, children: [jsxRuntime.jsxs("div", { className: "toastTextBlock", children: [!!customJSXMessage && customJSXMessage, !customJSXMessage && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "toastTitle", children: title }), jsxRuntime.jsx("div", { className: "toastDescription", children: description })] }))] }), !hideAction && renderButtons] }), jsxRuntime.jsx(BordOneToneIcon, { variant: "x", customWidth: "1.8rem", className: "closeIcon toastCloseIcon" })] })] }));
 };
 
-var css_248z$b = ".bordMetricCards{display:flex;flex-wrap:wrap;gap:.4rem}.bordMetricCardsConcatenatedRoot{width:auto}.bordMetricCardsGroup{display:flex;flex-direction:row;gap:.8rem;min-width:0;width:100%}@media (min-width:1024px){.bordMetricCardsGroup{width:118rem}}@media (max-width:1022.4px){.bordMetricCardsGroup{width:97.2rem}}.bordMetricCardsGroupParent{flex-shrink:0}@media (max-width:1022.4px){.bordMetricCardsGroupParent{width:31.2rem}}@media (min-width:1024px){.bordMetricCardsGroupParent{flex-shrink:0;width:57.55rem}}.bordMetricCardsGroupCards{justify-content:space-between}.bordMetricCardsConcatenatedInner,.bordMetricCardsGroupCards{display:flex;flex:1 1 0%;min-width:0}.bordMetricCardsConcatenatedInner{background-color:var(--ds-c-layout-l1);border-color:var(--ds-c-stroke-default);border-radius:.8rem;border-width:1px;box-sizing:border-box;flex-wrap:nowrap;width:100%}@media (max-width:1022.4px){.bordMetricCardsConcatenatedInner{height:6.4rem;min-height:6.4rem}}@media (min-width:1024px){.bordMetricCardsConcatenatedInner{height:8.4rem;min-height:8.4rem}}.bordMetricCardsConcatenatedInner{align-items:center}.bordMetricCardsConcatenatedInner .bordMetricCard{align-self:stretch;border:none;border-radius:.8rem;flex:1 0 0;height:100%;min-height:0;min-width:0;min-width:17.4rem;padding:1.2rem 0;width:auto}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardMetricContent{justify-content:space-between;width:100%}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardSubvalue,.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardValue{font-size:1.6rem;line-height:1.25}.bordMetricCardsDivider{min-height:2rem;width:.1rem}@media (max-width:1023){.bordMetricCardsDivider{height:4rem;min-height:4rem}}@media (min-width:1024px){.bordMetricCardsDivider{height:6rem;min-height:6rem}}.bordMetricCardsDivider{align-self:center;background-color:var(--ds-c-stroke-interactive);flex-shrink:0}";
+var css_248z$b = ".bordMetricCards{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:2.4rem}.bordMetricCardsConcatenatedRoot{width:auto}.bordMetricCardsGroup{display:flex;flex-direction:row;gap:.8rem;min-width:0;width:100%}@media (min-width:1024px){.bordMetricCardsGroup{width:118rem}}@media (max-width:1022.4px){.bordMetricCardsGroup{width:97.2rem}}.bordMetricCardsGroupParent{flex-shrink:0}@media (max-width:1022.4px){.bordMetricCardsGroupParent{width:31.2rem}}@media (min-width:1024px){.bordMetricCardsGroupParent{flex-shrink:0;width:57.55rem}}.bordMetricCardsGroupCards{justify-content:space-between}.bordMetricCardsConcatenatedInner,.bordMetricCardsGroupCards{display:flex;flex:1 1 0%;min-width:0}.bordMetricCardsConcatenatedInner{background-color:var(--ds-c-layout-l1);border-color:var(--ds-c-stroke-default);border-radius:.8rem;border-width:1px;box-sizing:border-box;flex-wrap:nowrap;width:100%}@media (max-width:1022.4px){.bordMetricCardsConcatenatedInner{height:6.4rem;min-height:6.4rem}}@media (min-width:1024px){.bordMetricCardsConcatenatedInner{height:8.4rem;min-height:8.4rem}}.bordMetricCardsConcatenatedInner{align-items:center}.bordMetricCardsConcatenatedInner .bordMetricCard{align-self:stretch;border:none;border-radius:.8rem;flex:1 0 0;height:100%;min-height:0;min-width:0;min-width:17.4rem;padding:1.2rem 0;width:auto}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardMetricContent{justify-content:space-between;width:100%}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardSubvalue,.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardValue{font-size:1.6rem;line-height:1.25}.bordMetricCardsDivider{min-height:2rem;width:.1rem}@media (max-width:1022.4px){.bordMetricCardsDivider{height:4rem;min-height:4rem}}@media (min-width:1024px){.bordMetricCardsDivider{height:6rem;min-height:6rem}}.bordMetricCardsDivider{align-self:center;background-color:var(--ds-c-stroke-interactive);flex-shrink:0}";
 styleInject(css_248z$b);
 
 const resolveConcatenatedParentColorVariant = (item) => {
@@ -6002,7 +6002,7 @@ const BordSortSelect = ({ triggerLabel, sortByOptions, selectedSortById, order,
 var css_248z$7 = ".bordEmptyStateDS{align-items:center;display:flex;flex-direction:column;gap:2.4rem;text-align:center}.bordEmptyStateDS .titleAndSubTitleContainer{max-width:58rem;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:-moz-max-content;width:max-content}.bordEmptyStateDS .titleAndSubTitleContainer .title{color:var(--ds-c-content-default);font-size:2rem;font-weight:700;line-height:2.6rem}.bordEmptyStateDS .titleAndSubTitleContainer .subTitle{color:var(--ds-c-content-secondary);font-size:1.6rem;font-weight:400;line-height:2.1rem;margin-top:.8rem}.bordEmptyStateDS .buttonsContainer{align-items:center;display:flex;gap:1.2rem}";
 styleInject(css_248z$7);
 
-const BordEmptyState = ({ title = 'title', subTitle, customClassNameSubTitle, buttonOneProps, buttonTwoProps, ilustrationIconProps, oneToneIconProps, twoToneIconProps, }) => {
+const BordEmptyState = ({ title = 'title', subTitle, customClassNameTitle = '', customClassNameSubTitle = '', buttonOneProps, buttonTwoProps, ilustrationIconProps, oneToneIconProps, twoToneIconProps, }) => {
     const defaultIcon = 'search';
     const defaultStandardSize = 100;
     const getIlustration = () => {
@@ -6015,7 +6015,7 @@ const BordEmptyState = ({ title = 'title', subTitle, customClassNameSubTitle, bu
         return jsxRuntime.jsx(BordIlustrationIcon, { standardSize: defaultStandardSize, variant: defaultIcon });
     };
     const ilustration = getIlustration();
-    return (jsxRuntime.jsxs("div", { className: "bordEmptyStateDS", children: [ilustration, jsxRuntime.jsxs("div", { className: "titleAndSubTitleContainer", children: [jsxRuntime.jsx("div", { className: "title", children: title }), subTitle && jsxRuntime.jsx("div", { className: `subTitle ${customClassNameSubTitle}`, children: subTitle })] }), jsxRuntime.jsxs("div", { className: "buttonsContainer", children: [buttonOneProps && jsxRuntime.jsx(BordButton, { ...buttonOneProps }), buttonTwoProps && jsxRuntime.jsx(BordButton, { ...buttonTwoProps })] })] }));
+    return (jsxRuntime.jsxs("div", { className: "bordEmptyStateDS", children: [ilustration, jsxRuntime.jsxs("div", { className: "titleAndSubTitleContainer", children: [jsxRuntime.jsx("div", { className: `title ${customClassNameTitle}`, children: title }), subTitle && jsxRuntime.jsx("div", { className: `subTitle ${customClassNameSubTitle}`, children: subTitle })] }), jsxRuntime.jsxs("div", { className: "buttonsContainer", children: [buttonOneProps && jsxRuntime.jsx(BordButton, { ...buttonOneProps }), buttonTwoProps && jsxRuntime.jsx(BordButton, { ...buttonTwoProps })] })] }));
 };
 
 var css_248z$6 = ".dsSwitchRoot{background-color:transparent;border-color:var(--ds-c-stroke-default);border-radius:4rem;border-style:solid;border-width:1px;border-width:.1rem;cursor:pointer;flex-shrink:0;height:2.2rem;position:relative;transition-duration:.2s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(0,0,.2,1);width:5.6rem}.dsSwitchRoot:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-offset-width:2px;--tw-ring-color:var(--ds-c-primary-bg-default);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);outline:2px solid transparent;outline-offset:2px}.dsSwitchRoot:disabled{border-color:var(--ds-c-bool-disabled-bg);cursor:not-allowed;opacity:.5}.dsSwitchThumb{border-radius:15998.4rem;display:grid;height:1.6rem;left:.2rem;overflow:hidden;padding:0;place-items:center;position:absolute;top:50%;transform:translateY(-50%);transition:transform .2s ease-out,background-color .2s ease-out,color .2s ease-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:1.6rem}.dsSwitchRoot:not(.dsSwitchRootOn) .dsSwitchThumb{background-color:var(--ds-c-stroke-default);color:var(--ds-c-content-secondary)}.dsSwitchRootOn .dsSwitchThumb{background-color:var(--ds-c-primary-bg-default);color:var(--ds-c-secondary-bg-default);transform:translateY(-50%) translateX(3.4rem)}.dsSwitchThumbLabel{align-items:center;color:inherit;display:flex;font-size:.8rem;font-weight:600;height:100%;justify-content:center;line-height:1;margin:0;text-align:center;width:100%}.dsSwitchSkeleton{background-color:var(--ds-c-stroke-default);border-radius:4rem;flex-shrink:0;height:2.2rem;pointer-events:none;width:5.6rem}";

package/dist/index.webpack.js

@@ -4792,7 +4792,7 @@ const setOpacityToHex = (hexColor, opacity) => {
     return hexWithOpacity;
 };
 
-var css_248z$p = ".bordMetricCard{align-items:center;border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0}@media (max-width:1023){.bordMetricCard{height:6.4rem}}@media (min-width:1024px){.bordMetricCard{height:8.4rem}}.bordMetricCard{min-width:0;padding:1.2rem}.bordMetricCard.bordMetricCardWithIcon{overflow:hidden}.bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0 .8rem}.bordMetricCardContent{flex:1 1 0%;gap:.4rem;justify-content:flex-end}.bordMetricCardContent,.bordMetricCardValueBlock{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.bordMetricCardValueBlock{gap:.2rem;width:100%}.bordMetricCardIcon{align-items:center;border:none;border-radius:15998.4rem;display:flex;flex-shrink:0;justify-content:center}.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:4.8rem;width:4.8rem}.bordMetricCardWithIcon.bordMetricCard--sizeSm .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardTitle{color:var(--ds-c-content-secondary);font-weight:400}.bordMetricCardValueRow{align-items:baseline;display:flex;gap:.4rem}.bordMetricCardValue{font-weight:700}.bordMetricCard--sizeLg .bordMetricCardValue{font-size:3.2rem;line-height:1.15}.bordMetricCard--sizeSm .bordMetricCardValue,.bordMetricCardSubvalue{font-size:1.6rem;line-height:1.25}.bordMetricCardSubvalue{font-weight:700}.bordMetricCardDescription{color:var(--ds-c-content-secondary);font-size:1.2rem;font-weight:400;line-height:1.5}.bordMetricCard.bordMetricCard--legacyDefault{border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0;height:auto;justify-content:space-between;min-height:0;min-width:23.3rem;padding-left:1.2rem;padding-right:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerSm{padding:.7rem 1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerLg{gap:.4rem;padding:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleSm{font-size:1rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleLg{font-size:1.4rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardContent{display:flex;flex:1 1 0%;flex-direction:column;gap:0;justify-content:flex-start;min-width:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardValue{font-size:3.2rem;font-weight:700}";
+var css_248z$p = ".bordMetricCard{align-items:center;border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0}@media (max-width:1022.4px){.bordMetricCard{height:6.4rem}}@media (min-width:1024px){.bordMetricCard{height:8.4rem}}.bordMetricCard{min-width:0;padding:1.2rem}.bordMetricCard.bordMetricCardWithIcon{overflow:hidden}.bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0 .8rem}.bordMetricCardContent{flex:1 1 0%;gap:.4rem;justify-content:flex-end}.bordMetricCardContent,.bordMetricCardValueBlock{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.bordMetricCardValueBlock{gap:.2rem;width:100%}.bordMetricCardIcon{align-items:center;border:none;border-radius:15998.4rem;display:flex;flex-shrink:0;justify-content:center}.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:4.8rem;width:4.8rem}.bordMetricCardWithIcon.bordMetricCard--sizeSm .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardTitle{color:var(--ds-c-content-secondary);font-weight:400}.bordMetricCardValueRow{align-items:baseline;display:flex;gap:.4rem}.bordMetricCardValue{font-weight:700}.bordMetricCard--sizeLg .bordMetricCardValue{font-size:3.2rem;line-height:1.15}.bordMetricCard--sizeSm .bordMetricCardValue{font-size:1.6rem;line-height:1.25}@media (max-width:1024){.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardSubvalue,.bordMetricCard.bordMetricCardWithIcon.bordMetricCard--sizeLg .bordMetricCardValue{font-size:1.6rem;line-height:1.25}}.bordMetricCardSubvalue{font-size:1.6rem;font-weight:700;line-height:1.25}.bordMetricCardDescription{color:var(--ds-c-content-secondary);font-size:1.2rem;font-weight:400;line-height:1.5}.bordMetricCard.bordMetricCard--legacyDefault{border-color:var(--ds-c-stroke-default);border-radius:.95rem;border-width:1px;box-sizing:border-box;display:flex;flex-shrink:0;height:auto;justify-content:space-between;min-height:0;min-width:23.3rem;padding-left:1.2rem;padding-right:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerSm{padding:.7rem 1.2rem}.bordMetricCard.bordMetricCard--legacyDefault.bordMetricCardContainerLg{gap:.4rem;padding:1.2rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleSm{font-size:1rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardTitleLg{font-size:1.4rem}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardMetricContent{align-items:center;display:flex;flex:1 1 0%;gap:1.2rem;min-width:0;padding:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardContent{display:flex;flex:1 1 0%;flex-direction:column;gap:0;justify-content:flex-start;min-width:0}.bordMetricCard.bordMetricCard--legacyDefault .bordMetricCardValue{font-size:3.2rem;font-weight:700}";
 styleInject(css_248z$p);
 
 const COLOR_VARIANT_MAP = {
@@ -4832,7 +4832,7 @@ const getResolvedColors = (textColor, colorVariant) => {
 };
 const getBackgroundColor = (textColor, colorVariant, bgColor) => (hasCustomTextColor(textColor) || colorVariant === 'green' ? bgColor : 'var(--ds-c-layout-l1)');
 const getFormattedValue = (value) => (value === 0 ? '00' : (value ?? ''));
-const BordMetricCard = ({ title, value, subvalue, description, icon, textColor, colorVariant = 'default', size = 'sm', titleProps, valueProps, isConcatenatedSecondary = false, }) => {
+const BordMetricCard = ({ title, value, subvalue, description, icon, textColor, colorVariant = 'default', size = 'sm', titleProps, valueProps, isConcatenatedSecondary = false, customClassName = '', }) => {
     const { resolvedColor, iconStroke, bgColor, iconCircleBg } = getResolvedColors(textColor, colorVariant);
     const bgStyle = { backgroundColor: getBackgroundColor(textColor, colorVariant, bgColor) };
     const valueClassName = ['bordMetricCardValue', valueProps?.className].filter(Boolean).join(' ');
@@ -4845,7 +4845,7 @@ const BordMetricCard = ({ title, value, subvalue, description, icon, textColor,
     }
     const sizeModifier = size === 'lg' ? 'bordMetricCard--sizeLg' : 'bordMetricCard--sizeSm';
     const titleSizeClass = size === 'lg' ? 'bordMetricCardTitle--lg' : 'bordMetricCardTitle--sm';
-    const containerClassName = ['bordMetricCard', sizeModifier, 'bordMetricCardWithIcon'].join(' ');
+    const containerClassName = ['bordMetricCard', sizeModifier, 'bordMetricCardWithIcon', customClassName].join(' ');
     const titleClassName = ['bordMetricCardTitle', titleSizeClass, titleProps?.className].filter(Boolean).join(' ');
     const iconStandardSize = isConcatenatedSecondary ? ICON_STANDARD_SIZE.sm : ICON_STANDARD_SIZE[size];
     return (jsx("div", { style: bgStyle, className: containerClassName, children: jsxs("div", { className: "bordMetricCardMetricContent", children: [jsx("div", { className: "bordMetricCardIcon", style: { backgroundColor: iconCircleBg }, children: jsx(BordOneToneIcon, { variant: icon, standardSize: iconStandardSize, stroke: iconStroke }) }), jsxs("div", { className: "bordMetricCardContent", children: [jsx("h3", { className: titleClassName, children: title }), jsxs("div", { className: "bordMetricCardValueBlock", children: [valueRow, descriptionEl] })] })] }) }));
@@ -5846,7 +5846,7 @@ const BordToast = ({ variant = 'informative', title = '', description = '', onCl
     return (jsxs("div", { className: className, style: animationStyle, onAnimationEnd: onAnimationEnd, onClick: handleClose, children: [jsx(BordOneToneIcon, { variant: TOAST_VARIANTS[variant], customWidth: "2.4rem", className: "toastVariantIcon h-full w-24 mb-auto flex-shrink-0" }), jsxs("div", { className: `toastData ${renderItemsPosition}`, children: [jsxs("div", { className: `toastBody ${renderStyles}`, children: [jsxs("div", { className: "toastTextBlock", children: [!!customJSXMessage && customJSXMessage, !customJSXMessage && (jsxs(Fragment, { children: [jsx("div", { className: "toastTitle", children: title }), jsx("div", { className: "toastDescription", children: description })] }))] }), !hideAction && renderButtons] }), jsx(BordOneToneIcon, { variant: "x", customWidth: "1.8rem", className: "closeIcon toastCloseIcon" })] })] }));
 };
 
-var css_248z$b = ".bordMetricCards{display:flex;flex-wrap:wrap;gap:.4rem}.bordMetricCardsConcatenatedRoot{width:auto}.bordMetricCardsGroup{display:flex;flex-direction:row;gap:.8rem;min-width:0;width:100%}@media (min-width:1024px){.bordMetricCardsGroup{width:118rem}}@media (max-width:1022.4px){.bordMetricCardsGroup{width:97.2rem}}.bordMetricCardsGroupParent{flex-shrink:0}@media (max-width:1022.4px){.bordMetricCardsGroupParent{width:31.2rem}}@media (min-width:1024px){.bordMetricCardsGroupParent{flex-shrink:0;width:57.55rem}}.bordMetricCardsGroupCards{justify-content:space-between}.bordMetricCardsConcatenatedInner,.bordMetricCardsGroupCards{display:flex;flex:1 1 0%;min-width:0}.bordMetricCardsConcatenatedInner{background-color:var(--ds-c-layout-l1);border-color:var(--ds-c-stroke-default);border-radius:.8rem;border-width:1px;box-sizing:border-box;flex-wrap:nowrap;width:100%}@media (max-width:1022.4px){.bordMetricCardsConcatenatedInner{height:6.4rem;min-height:6.4rem}}@media (min-width:1024px){.bordMetricCardsConcatenatedInner{height:8.4rem;min-height:8.4rem}}.bordMetricCardsConcatenatedInner{align-items:center}.bordMetricCardsConcatenatedInner .bordMetricCard{align-self:stretch;border:none;border-radius:.8rem;flex:1 0 0;height:100%;min-height:0;min-width:0;min-width:17.4rem;padding:1.2rem 0;width:auto}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardMetricContent{justify-content:space-between;width:100%}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardSubvalue,.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardValue{font-size:1.6rem;line-height:1.25}.bordMetricCardsDivider{min-height:2rem;width:.1rem}@media (max-width:1023){.bordMetricCardsDivider{height:4rem;min-height:4rem}}@media (min-width:1024px){.bordMetricCardsDivider{height:6rem;min-height:6rem}}.bordMetricCardsDivider{align-self:center;background-color:var(--ds-c-stroke-interactive);flex-shrink:0}";
+var css_248z$b = ".bordMetricCards{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:2.4rem}.bordMetricCardsConcatenatedRoot{width:auto}.bordMetricCardsGroup{display:flex;flex-direction:row;gap:.8rem;min-width:0;width:100%}@media (min-width:1024px){.bordMetricCardsGroup{width:118rem}}@media (max-width:1022.4px){.bordMetricCardsGroup{width:97.2rem}}.bordMetricCardsGroupParent{flex-shrink:0}@media (max-width:1022.4px){.bordMetricCardsGroupParent{width:31.2rem}}@media (min-width:1024px){.bordMetricCardsGroupParent{flex-shrink:0;width:57.55rem}}.bordMetricCardsGroupCards{justify-content:space-between}.bordMetricCardsConcatenatedInner,.bordMetricCardsGroupCards{display:flex;flex:1 1 0%;min-width:0}.bordMetricCardsConcatenatedInner{background-color:var(--ds-c-layout-l1);border-color:var(--ds-c-stroke-default);border-radius:.8rem;border-width:1px;box-sizing:border-box;flex-wrap:nowrap;width:100%}@media (max-width:1022.4px){.bordMetricCardsConcatenatedInner{height:6.4rem;min-height:6.4rem}}@media (min-width:1024px){.bordMetricCardsConcatenatedInner{height:8.4rem;min-height:8.4rem}}.bordMetricCardsConcatenatedInner{align-items:center}.bordMetricCardsConcatenatedInner .bordMetricCard{align-self:stretch;border:none;border-radius:.8rem;flex:1 0 0;height:100%;min-height:0;min-width:0;min-width:17.4rem;padding:1.2rem 0;width:auto}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardMetricContent{justify-content:space-between;width:100%}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardIcon{height:3.2rem;width:3.2rem}.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardSubvalue,.bordMetricCardsConcatenatedInner .bordMetricCard .bordMetricCardValue{font-size:1.6rem;line-height:1.25}.bordMetricCardsDivider{min-height:2rem;width:.1rem}@media (max-width:1022.4px){.bordMetricCardsDivider{height:4rem;min-height:4rem}}@media (min-width:1024px){.bordMetricCardsDivider{height:6rem;min-height:6rem}}.bordMetricCardsDivider{align-self:center;background-color:var(--ds-c-stroke-interactive);flex-shrink:0}";
 styleInject(css_248z$b);
 
 const resolveConcatenatedParentColorVariant = (item) => {
@@ -5996,7 +5996,7 @@ const BordSortSelect = ({ triggerLabel, sortByOptions, selectedSortById, order,
 var css_248z$7 = ".bordEmptyStateDS{align-items:center;display:flex;flex-direction:column;gap:2.4rem;text-align:center}.bordEmptyStateDS .titleAndSubTitleContainer{max-width:58rem;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:-moz-max-content;width:max-content}.bordEmptyStateDS .titleAndSubTitleContainer .title{color:var(--ds-c-content-default);font-size:2rem;font-weight:700;line-height:2.6rem}.bordEmptyStateDS .titleAndSubTitleContainer .subTitle{color:var(--ds-c-content-secondary);font-size:1.6rem;font-weight:400;line-height:2.1rem;margin-top:.8rem}.bordEmptyStateDS .buttonsContainer{align-items:center;display:flex;gap:1.2rem}";
 styleInject(css_248z$7);
 
-const BordEmptyState = ({ title = 'title', subTitle, customClassNameSubTitle, buttonOneProps, buttonTwoProps, ilustrationIconProps, oneToneIconProps, twoToneIconProps, }) => {
+const BordEmptyState = ({ title = 'title', subTitle, customClassNameTitle = '', customClassNameSubTitle = '', buttonOneProps, buttonTwoProps, ilustrationIconProps, oneToneIconProps, twoToneIconProps, }) => {
     const defaultIcon = 'search';
     const defaultStandardSize = 100;
     const getIlustration = () => {
@@ -6009,7 +6009,7 @@ const BordEmptyState = ({ title = 'title', subTitle, customClassNameSubTitle, bu
         return jsx(BordIlustrationIcon, { standardSize: defaultStandardSize, variant: defaultIcon });
     };
     const ilustration = getIlustration();
-    return (jsxs("div", { className: "bordEmptyStateDS", children: [ilustration, jsxs("div", { className: "titleAndSubTitleContainer", children: [jsx("div", { className: "title", children: title }), subTitle && jsx("div", { className: `subTitle ${customClassNameSubTitle}`, children: subTitle })] }), jsxs("div", { className: "buttonsContainer", children: [buttonOneProps && jsx(BordButton, { ...buttonOneProps }), buttonTwoProps && jsx(BordButton, { ...buttonTwoProps })] })] }));
+    return (jsxs("div", { className: "bordEmptyStateDS", children: [ilustration, jsxs("div", { className: "titleAndSubTitleContainer", children: [jsx("div", { className: `title ${customClassNameTitle}`, children: title }), subTitle && jsx("div", { className: `subTitle ${customClassNameSubTitle}`, children: subTitle })] }), jsxs("div", { className: "buttonsContainer", children: [buttonOneProps && jsx(BordButton, { ...buttonOneProps }), buttonTwoProps && jsx(BordButton, { ...buttonTwoProps })] })] }));
 };
 
 var css_248z$6 = ".dsSwitchRoot{background-color:transparent;border-color:var(--ds-c-stroke-default);border-radius:4rem;border-style:solid;border-width:1px;border-width:.1rem;cursor:pointer;flex-shrink:0;height:2.2rem;position:relative;transition-duration:.2s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(0,0,.2,1);width:5.6rem}.dsSwitchRoot:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-offset-width:2px;--tw-ring-color:var(--ds-c-primary-bg-default);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);outline:2px solid transparent;outline-offset:2px}.dsSwitchRoot:disabled{border-color:var(--ds-c-bool-disabled-bg);cursor:not-allowed;opacity:.5}.dsSwitchThumb{border-radius:15998.4rem;display:grid;height:1.6rem;left:.2rem;overflow:hidden;padding:0;place-items:center;position:absolute;top:50%;transform:translateY(-50%);transition:transform .2s ease-out,background-color .2s ease-out,color .2s ease-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:1.6rem}.dsSwitchRoot:not(.dsSwitchRootOn) .dsSwitchThumb{background-color:var(--ds-c-stroke-default);color:var(--ds-c-content-secondary)}.dsSwitchRootOn .dsSwitchThumb{background-color:var(--ds-c-primary-bg-default);color:var(--ds-c-secondary-bg-default);transform:translateY(-50%) translateX(3.4rem)}.dsSwitchThumbLabel{align-items:center;color:inherit;display:flex;font-size:.8rem;font-weight:600;height:100%;justify-content:center;line-height:1;margin:0;text-align:center;width:100%}.dsSwitchSkeleton{background-color:var(--ds-c-stroke-default);border-radius:4rem;flex-shrink:0;height:2.2rem;pointer-events:none;width:5.6rem}";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bord-design-system",
-  "version": "0.0.11",
+  "version": "0.0.12",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.esm.js",