@digi-frontend/dgate-api-documentation 1.0.39 → 1.0.50

package/src/components/SVGLoader/SVGLoader.tsx

@@ -1,94 +1,96 @@
-import React, { useState, useEffect } from 'react'
-import parse from 'html-react-parser'
-
-// Utility function to create an SVG element from a string
-const createSvgElement = (svgString: string): SVGSVGElement | null => {
-  const parser = new DOMParser()
-  const doc = parser.parseFromString(svgString, 'image/svg+xml')
-  return doc.querySelector('svg')
-}
-
-// Define the type for SVG attributes
-type SVGAttributes = React.SVGProps<SVGSVGElement>
-
-interface SVGLoaderProps extends SVGAttributes {
-  src: string
-  cache?: boolean
-}
-
-const SVGLoader: React.FC<SVGLoaderProps> | any = ({ src, cache = true, ...props }) => {
-  const [svgMarkup, setSvgMarkup] = useState<string | null>(null)
-
-  useEffect(() => {
-    if (!src) return
-    if (typeof src !== 'string') console.log({ src })
-    const isUrl = src.startsWith('http') || src.startsWith('/')
-
-    const cacheName = 'svg-cache'
-
-    const fetchSvg = async () => {
-      try {
-        let svgString: string | null = null
-
-        // Use the Cache API if caching is enabled
-        if (cache && isUrl && 'caches' in window) {
-          const cacheStorage = await caches.open(cacheName)
-          const cachedResponse = await cacheStorage.match(src)
-
-          // If SVG is found in cache, use it
-          if (cachedResponse && cachedResponse.ok) {
-            svgString = await cachedResponse.text()
-            setSvgMarkup(svgString)
-            return
-          }
-        }
-
-        // If not cached, fetch from URL
-        if (isUrl) {
-          const response = await fetch(src)
-
-          // Clone the response before consuming it
-          const responseClone = response.clone()
-
-          // Consume the response body for the SVG content
-          svgString = await response.text()
-
-          // Store the cloned response in the cache
-          if (cache && 'caches' in window) {
-            const cacheStorage = await caches.open(cacheName)
-            await cacheStorage.put(src, responseClone)
-          }
-        } else {
-          // If it's not a URL (it's inline), just use the source string
-          svgString = src
-        }
-
-        // If we have valid SVG content, set it
-        if (svgString) {
-          const svg = createSvgElement(svgString)
-          if (svg) {
-            const svgStringWithProps = new XMLSerializer().serializeToString(svg)
-            setSvgMarkup(svgStringWithProps)
-          }
-        }
-      } catch (error) {
-        console.error('Error loading SVG:', error)
-      }
-    }
-
-    fetchSvg()
-  }, [src, props])
-
-  if (!svgMarkup) return null
-
-  // Parse the SVG string and return it as JSX
-  const parsedSvg = parse(svgMarkup)
-  // Sometimes parse returns an array which includes the element
-  const toBeClonedElement = Array.isArray(parsedSvg) ? parsedSvg.find((item) => React.isValidElement(item)) : parsedSvg
-  // Clone the parsed SVG element to apply the props
-  const clonedSvg = React.cloneElement(toBeClonedElement as React.ReactElement, props)
-
-  return <>{clonedSvg}</>
-}
-
-export default SVGLoader
+import React, { useState, useEffect } from 'react'
+import parse from 'html-react-parser'
+
+// Utility function to create an SVG element from a string
+const createSvgElement = (svgString: string): SVGSVGElement | null => {
+  const parser = new DOMParser()
+  const doc = parser.parseFromString(svgString, 'image/svg+xml')
+  return doc.querySelector('svg')
+}
+
+// Define the type for SVG attributes
+type SVGAttributes = React.SVGProps<SVGSVGElement>
+
+interface SVGLoaderProps extends SVGAttributes {
+  src: string
+  cache?: boolean
+}
+
+const SVGLoader: React.FC<SVGLoaderProps> | any = ({ src, cache = true, ...props }) => {
+  const [svgMarkup, setSvgMarkup] = useState<string | null>(null)
+
+  useEffect(() => {
+    if (!src) return
+    if (typeof src !== 'string') console.log({ src })
+    const isUrl = src.startsWith('http') || src.startsWith('/')
+
+    const cacheName = 'svg-cache'
+
+    const fetchSvg = async () => {
+      try {
+        let svgString: string | null = null
+
+        // Use the Cache API if caching is enabled
+        if (cache && isUrl && 'caches' in window) {
+          const cacheStorage = await caches.open(cacheName)
+          const cachedResponse = await cacheStorage.match(src)
+
+          // If SVG is found in cache, use it
+          if (cachedResponse && cachedResponse.ok) {
+            svgString = await cachedResponse.text()
+            setSvgMarkup(svgString)
+            return
+          }
+        }
+
+        // If not cached, fetch from URL
+        if (isUrl) {
+          const response = await fetch(src)
+
+          // Clone the response before consuming it
+          const responseClone = response.clone()
+
+          // Consume the response body for the SVG content
+          svgString = await response.text()
+
+          // Store the cloned response in the cache
+          if (cache && 'caches' in window) {
+            const cacheStorage = await caches.open(cacheName)
+            await cacheStorage.put(src, responseClone)
+          }
+        } else {
+          // If it's not a URL (it's inline), just use the source string
+          svgString = src
+        }
+
+        // If we have valid SVG content, set it
+        if (svgString) {
+          const svg = createSvgElement(svgString)
+          if (svg) {
+            const svgStringWithProps = new XMLSerializer().serializeToString(svg)
+            setSvgMarkup(svgStringWithProps)
+          }
+        }
+      } catch (error) {
+        console.error('Error loading SVG:', error)
+      }
+    }
+
+    fetchSvg()
+  }, [src, props])
+
+  if (!svgMarkup) return null
+
+  // Parse the SVG string and return it as JSX
+  const parsedSvg = parse(svgMarkup)
+  // Sometimes parse returns an array which includes the element
+  const toBeClonedElement = Array.isArray(parsedSvg)
+    ? parsedSvg.find((item) => React.isValidElement(item))
+    : parsedSvg
+  // Clone the parsed SVG element to apply the props
+  const clonedSvg = React.cloneElement(toBeClonedElement as React.ReactElement, props)
+
+  return <>{clonedSvg}</>
+}
+
+export default SVGLoader

package/src/components/SectionHead/SectionHead.scss

@@ -1,29 +1,29 @@
-.containerTitleDrawer {
-  height: 64px;
-  min-height: 64px;
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  background-color: #f1f2f6;
-  padding: 0 30px 0 30px;
-  width: 100%;
-
-  span {
-    color: #12131a;
-    font-weight: 600;
-    font-size: 18px;
-    line-height: 25px;
-    letter-spacing: 0em;
-  }
-
-  svg {
-    path {
-      stroke: #000 !important;
-    }
-  }
-
-  .closeIcon {
-    cursor: pointer;
-  }
-}
+.containerTitleDrawer {
+  height: 64px;
+  min-height: 64px;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  background-color: #f1f2f6;
+  padding: 0 30px 0 30px;
+  width: 100%;
+
+  span {
+    color: #12131a;
+    font-weight: 600;
+    font-size: 18px;
+    line-height: 25px;
+    letter-spacing: 0em;
+  }
+
+  svg {
+    path {
+      stroke: #000 !important;
+    }
+  }
+
+  .closeIcon {
+    cursor: pointer;
+  }
+}

package/src/components/SectionHead/SectionHead.tsx

@@ -1,22 +1,22 @@
-import React, { type JSX } from 'react'
-import './SectionHead.scss'
-import SVGLoader from '../SVGLoader/SVGLoader'
-
-type SectionHeadProps = {
-  text: string | JSX.Element
-  closeFunction?: () => void
-  children?: JSX.Element
-  className?: string
-}
-
-const SectionHead: React.FC<SectionHeadProps> = ({ text, closeFunction, children, className = '' }: SectionHeadProps): any => {
-  return (
-    <div className={`containerTitleDrawer ${className}`}>
-      <span data-id={`${String(text)?.toUpperCase()?.replaceAll(' ', '_')}_ID`}>{text}</span>
-      {children}
-
-      {closeFunction && <SVGLoader className='closeIcon' onClick={closeFunction} width='1.5rem' height='1.5rem' />}
-    </div>
-  )
-}
-export default SectionHead
+import React, { type JSX } from 'react'
+import './SectionHead.scss'
+import SVGLoader from '../SVGLoader/SVGLoader'
+
+type SectionHeadProps = {
+  text: string | JSX.Element
+  closeFunction?: () => void
+  children?: JSX.Element
+  className?: string
+}
+
+const SectionHead: React.FC<SectionHeadProps> = ({ text, closeFunction, children, className = '' }: SectionHeadProps): any => {
+  return (
+    <div className={`containerTitleDrawer ${className}`}>
+      <span data-id={`${String(text)?.toUpperCase()?.replaceAll(' ', '_')}_ID`}>{text}</span>
+      {children}
+
+      {closeFunction && <SVGLoader className='closeIcon' onClick={closeFunction} width='1.5rem' height='1.5rem' />}
+    </div>
+  )
+}
+export default SectionHead

package/src/components/SimpleLabelValue/SimpleLabelValue.tsx

@@ -1,31 +1,31 @@
-import React from 'react'
-import './style.scss'
-
-type SimpleLabelValueProps = {
-  label?: string | JSX.Element
-  value?: string | number | JSX.Element | JSX.Element[]
-  color?: string
-  className?: string
-  dataId?: string
-}
-
-const SimpleLabelValue: React.FC<SimpleLabelValueProps> = ({
-  label,
-  value,
-  color,
-  className = '',
-  dataId,
-}: SimpleLabelValueProps) => {
-  const dataIdLabel =
-    typeof label === 'string' ? label?.toUpperCase()?.replaceAll(' ', '_') + '_LABEL_ID' : dataId
-  return (
-    <div className={`drawerItemContainer ${className}`}>
-      <span className="title" data-id={dataIdLabel}>
-        {label}
-      </span>
-      <span className={`text ${color ? `color-${color}` : ''}`}>{value}</span>
-    </div>
-  )
-}
-
-export default SimpleLabelValue
+import React from 'react'
+import './style.scss'
+
+type SimpleLabelValueProps = {
+  label?: string | JSX.Element
+  value?: string | number | JSX.Element | JSX.Element[]
+  color?: string
+  className?: string
+  dataId?: string
+}
+
+const SimpleLabelValue: React.FC<SimpleLabelValueProps> = ({
+  label,
+  value,
+  color,
+  className = '',
+  dataId,
+}: SimpleLabelValueProps) => {
+  const dataIdLabel =
+    typeof label === 'string' ? label?.toUpperCase()?.replaceAll(' ', '_') + '_LABEL_ID' : dataId
+  return (
+    <div className={`drawerItemContainer ${className}`}>
+      <span className="title" data-id={dataIdLabel}>
+        {label}
+      </span>
+      <span className={`text ${color ? `color-${color}` : ''}`}>{value}</span>
+    </div>
+  )
+}
+
+export default SimpleLabelValue

package/src/components/SimpleLabelValue/index.ts

@@ -1 +1 @@
-export { default } from './SimpleLabelValue'
+export { default } from './SimpleLabelValue'

package/src/components/SimpleLabelValue/style.scss

@@ -1,30 +1,30 @@
-@import '../global';
-
-.drawerItemContainer {
-  display: flex;
-  flex-direction: column;
-
-  .title {
-    color: #000;
-    font-weight: 600;
-    font-size: 24px;
-    line-height: 35px;
-    margin-bottom: 3px;
-    margin-top: 1.5rem;
-  }
-
-  .text {
-    color: #000;
-    font-weight: 400;
-    font-size: 24px;
-    line-height: 25px;
-  }
-
-  .color-green {
-    color: $success-static;
-  }
-
-  .color-red {
-    color: $error-static;
-  }
-}
+@import '../global';
+
+.drawerItemContainer {
+  display: flex;
+  flex-direction: column;
+
+  .title {
+    color: #000;
+    font-weight: 600;
+    font-size: 24px;
+    line-height: 35px;
+    margin-bottom: 3px;
+    margin-top: 1.5rem;
+  }
+
+  .text {
+    color: #000;
+    font-weight: 400;
+    font-size: 24px;
+    line-height: 25px;
+  }
+
+  .color-green {
+    color: $success-static;
+  }
+
+  .color-red {
+    color: $error-static;
+  }
+}