@npm_leadtech/legal-lib-components 7.106.3 → 7.106.5

package/dist/images/componentsSvg/LockOutlineIcon.d.ts

@@ -0,0 +1,7 @@
+import { type FC } from 'react';
+interface LockOutlineIconProps {
+    className?: string;
+    fill?: string;
+}
+export declare const LockOutlineIcon: FC<LockOutlineIconProps>;
+export {};

package/dist/images/componentsSvg/LockOutlineIcon.js

@@ -0,0 +1,2 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const LockOutlineIcon = ({ className = '', fill = '#6D7275' }) => (_jsx("svg", { className: className, width: '20', height: '20', viewBox: '0 0 20 20', fill: 'none', children: _jsx("path", { d: 'M5 18.25C4.54167 18.25 4.14931 18.0868 3.82292 17.7604C3.49653 17.434 3.33333 17.0417 3.33333 16.5833V8.25C3.33333 7.79167 3.49653 7.39931 3.82292 7.07292C4.14931 6.74653 4.54167 6.58333 5 6.58333H5.83333V4.91667C5.83333 3.76389 6.23958 2.78125 7.05208 1.96875C7.86458 1.15625 8.84722 0.75 10 0.75C11.1528 0.75 12.1354 1.15625 12.9479 1.96875C13.7604 2.78125 14.1667 3.76389 14.1667 4.91667V6.58333H15C15.4583 6.58333 15.8507 6.74653 16.1771 7.07292C16.5035 7.39931 16.6667 7.79167 16.6667 8.25V16.5833C16.6667 17.0417 16.5035 17.434 16.1771 17.7604C15.8507 18.0868 15.4583 18.25 15 18.25H5ZM5 16.5833H15V8.25H5V16.5833ZM11.1771 13.5938C11.5035 13.2674 11.6667 12.875 11.6667 12.4167C11.6667 11.9583 11.5035 11.566 11.1771 11.2396C10.8507 10.9132 10.4583 10.75 10 10.75C9.54167 10.75 9.1493 10.9132 8.82292 11.2396C8.49653 11.566 8.33333 11.9583 8.33333 12.4167C8.33333 12.875 8.49653 13.2674 8.82292 13.5938C9.1493 13.9201 9.54167 14.0833 10 14.0833C10.4583 14.0833 10.8507 13.9201 11.1771 13.5938ZM7.5 6.58333H12.5V4.91667C12.5 4.22222 12.2569 3.63194 11.7708 3.14583C11.2847 2.65972 10.6944 2.41667 10 2.41667C9.30555 2.41667 8.71528 2.65972 8.22917 3.14583C7.74305 3.63194 7.5 4.22222 7.5 4.91667V6.58333Z', fill: fill }) }));

package/dist/images/componentsSvg/LockOutlineIcon.tsx

@@ -0,0 +1,19 @@
+/* eslint-disable max-len */
+import React, { type FC } from 'react'
+
+interface LockOutlineIconProps {
+  className?: string
+  fill?: string
+}
+
+export const LockOutlineIcon: FC<LockOutlineIconProps> = ({
+  className = '',
+  fill = '#6D7275'
+}: LockOutlineIconProps) => (
+  <svg className={className} width='20' height='20' viewBox='0 0 20 20' fill='none'>
+    <path
+      d='M5 18.25C4.54167 18.25 4.14931 18.0868 3.82292 17.7604C3.49653 17.434 3.33333 17.0417 3.33333 16.5833V8.25C3.33333 7.79167 3.49653 7.39931 3.82292 7.07292C4.14931 6.74653 4.54167 6.58333 5 6.58333H5.83333V4.91667C5.83333 3.76389 6.23958 2.78125 7.05208 1.96875C7.86458 1.15625 8.84722 0.75 10 0.75C11.1528 0.75 12.1354 1.15625 12.9479 1.96875C13.7604 2.78125 14.1667 3.76389 14.1667 4.91667V6.58333H15C15.4583 6.58333 15.8507 6.74653 16.1771 7.07292C16.5035 7.39931 16.6667 7.79167 16.6667 8.25V16.5833C16.6667 17.0417 16.5035 17.434 16.1771 17.7604C15.8507 18.0868 15.4583 18.25 15 18.25H5ZM5 16.5833H15V8.25H5V16.5833ZM11.1771 13.5938C11.5035 13.2674 11.6667 12.875 11.6667 12.4167C11.6667 11.9583 11.5035 11.566 11.1771 11.2396C10.8507 10.9132 10.4583 10.75 10 10.75C9.54167 10.75 9.1493 10.9132 8.82292 11.2396C8.49653 11.566 8.33333 11.9583 8.33333 12.4167C8.33333 12.875 8.49653 13.2674 8.82292 13.5938C9.1493 13.9201 9.54167 14.0833 10 14.0833C10.4583 14.0833 10.8507 13.9201 11.1771 13.5938ZM7.5 6.58333H12.5V4.91667C12.5 4.22222 12.2569 3.63194 11.7708 3.14583C11.2847 2.65972 10.6944 2.41667 10 2.41667C9.30555 2.41667 8.71528 2.65972 8.22917 3.14583C7.74305 3.63194 7.5 4.22222 7.5 4.91667V6.58333Z'
+      fill={fill}
+    />
+  </svg>
+)

package/dist/src/components/molecules/CheckoutSummary/CheckoutSummary.js

@@ -1,6 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { CheckoutSummaryStyled } from './CheckoutSummary.styled';
+import { BalanceSvg } from '../../../../images/componentsSvg/Balance';
+import { LockOutlineIcon } from '../../../../images/componentsSvg/LockOutlineIcon';
 import checkoutSummaryDocument from '../../../../images/CheckoutSummary/checkout-summary-document-56586a.png';
 const hasPreviewContent = (content) => {
     if (content == null || typeof content === 'boolean')
@@ -16,9 +18,7 @@ const hasPreviewContent = (content) => {
     }
     return false;
 };
-const LockIcon = () => (_jsxs("svg", { "aria-hidden": 'true', width: '20', height: '20', viewBox: '0 0 24 24', fill: 'none', children: [_jsx("rect", { x: '5', y: '10', width: '14', height: '11', rx: '2', fill: 'currentColor' }), _jsx("path", { d: 'M8 10V7a4 4 0 1 1 8 0v3', stroke: 'currentColor', strokeWidth: '2', strokeLinecap: 'round' }), _jsx("circle", { cx: '12', cy: '15', r: '1.25', fill: 'var(--others-white)' })] }));
-const BalanceIcon = () => (_jsx("svg", { "aria-hidden": 'true', width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', children: _jsx("path", { d: 'M12 3v17m-5 1h10M5 7h14M5 7l-3 6h6L5 7Zm14 0-3 6h6l-3-6Z', stroke: 'currentColor', strokeWidth: '1.7', strokeLinecap: 'round', strokeLinejoin: 'round' }) }));
 export const CheckoutSummary = ({ documentName, documentDescription, verificationLabel, totalDueLabel, totalDueAmount, previewImage, className }) => {
     const previewContent = hasPreviewContent(previewImage) ? previewImage : _jsx("img", { src: checkoutSummaryDocument, alt: '' });
-    return (_jsxs(CheckoutSummaryStyled, { className: ['checkout-summary', className].filter(Boolean).join(' '), children: [_jsxs("div", { className: 'checkout-summary__document', children: [_jsxs("div", { className: 'checkout-summary__preview', "aria-hidden": 'true', children: [previewContent, _jsx("span", { className: 'checkout-summary__preview-lock', children: _jsx(LockIcon, {}) })] }), _jsxs("div", { className: 'checkout-summary__content', children: [_jsxs("span", { className: 'checkout-summary__verification', children: [_jsx(BalanceIcon, {}), _jsx("span", { children: verificationLabel })] }), _jsx("h2", { className: 'checkout-summary__name', children: documentName }), _jsx("p", { className: 'checkout-summary__description', children: documentDescription })] })] }), _jsx("dl", { className: 'checkout-summary__pricing', children: _jsxs("div", { className: 'checkout-summary__total', children: [_jsx("dt", { children: totalDueLabel }), _jsx("dd", { children: totalDueAmount })] }) })] }));
+    return (_jsxs(CheckoutSummaryStyled, { className: ['checkout-summary', className].filter(Boolean).join(' '), children: [_jsxs("div", { className: 'checkout-summary__document', children: [_jsxs("div", { className: 'checkout-summary__preview', "aria-hidden": 'true', children: [previewContent, _jsx("span", { className: 'checkout-summary__preview-lock', children: _jsx(LockOutlineIcon, {}) })] }), _jsxs("div", { className: 'checkout-summary__content', children: [_jsxs("span", { className: 'checkout-summary__verification', children: [_jsx(BalanceSvg, { fill: '#936C2F' }), _jsx("span", { children: verificationLabel })] }), _jsx("h2", { className: 'checkout-summary__name', children: documentName }), _jsx("p", { className: 'checkout-summary__description', children: documentDescription })] })] }), _jsx("dl", { className: 'checkout-summary__pricing', children: _jsxs("div", { className: 'checkout-summary__total', children: [_jsx("dt", { children: totalDueLabel }), _jsx("dd", { children: totalDueAmount })] }) })] }));
 };

package/dist/src/components/molecules/CheckoutSummary/CheckoutSummary.tsx

@@ -2,6 +2,9 @@ import React, { type FC } from 'react'
 
 import { type CheckoutSummaryProps } from './CheckoutSummaryProps.types'
 import { CheckoutSummaryStyled } from './CheckoutSummary.styled'
+
+import { BalanceSvg } from '../../../../images/componentsSvg/Balance'
+import { LockOutlineIcon } from '../../../../images/componentsSvg/LockOutlineIcon'
 import checkoutSummaryDocument from '../../../../images/CheckoutSummary/checkout-summary-document-56586a.png'
 
 const hasPreviewContent = (content: React.ReactNode): boolean => {
@@ -16,26 +19,6 @@ const hasPreviewContent = (content: React.ReactNode): boolean => {
   return false
 }
 
-const LockIcon: FC = () => (
-  <svg aria-hidden='true' width='20' height='20' viewBox='0 0 24 24' fill='none'>
-    <rect x='5' y='10' width='14' height='11' rx='2' fill='currentColor' />
-    <path d='M8 10V7a4 4 0 1 1 8 0v3' stroke='currentColor' strokeWidth='2' strokeLinecap='round' />
-    <circle cx='12' cy='15' r='1.25' fill='var(--others-white)' />
-  </svg>
-)
-
-const BalanceIcon: FC = () => (
-  <svg aria-hidden='true' width='16' height='16' viewBox='0 0 24 24' fill='none'>
-    <path
-      d='M12 3v17m-5 1h10M5 7h14M5 7l-3 6h6L5 7Zm14 0-3 6h6l-3-6Z'
-      stroke='currentColor'
-      strokeWidth='1.7'
-      strokeLinecap='round'
-      strokeLinejoin='round'
-    />
-  </svg>
-)
-
 export const CheckoutSummary: FC<CheckoutSummaryProps> = ({
   documentName,
   documentDescription,
@@ -53,12 +36,12 @@ export const CheckoutSummary: FC<CheckoutSummaryProps> = ({
         <div className='checkout-summary__preview' aria-hidden='true'>
           {previewContent}
           <span className='checkout-summary__preview-lock'>
-            <LockIcon />
+            <LockOutlineIcon />
           </span>
         </div>
         <div className='checkout-summary__content'>
           <span className='checkout-summary__verification'>
-            <BalanceIcon />
+            <BalanceSvg fill={'#936C2F'} />
             <span>{verificationLabel}</span>
           </span>
           <h2 className='checkout-summary__name'>{documentName}</h2>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@npm_leadtech/legal-lib-components",
-  "version": "7.106.3",
+  "version": "7.106.5",
   "license": "ISC",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",