@digi-frontend/dgate-api-documentation 1.1.4 → 1.1.7

package/src/components/SVGLoader/SVGLoader.tsx

@@ -1,96 +0,0 @@
-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.tsx

@@ -1,22 +0,0 @@
-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 +0,0 @@
-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 +0,0 @@
-export { default } from './SimpleLabelValue'

package/src/components/Tooltip/Tooltip.tsx

@@ -1,85 +0,0 @@
-import React, { useState, useEffect, ReactNode } from 'react'
-import Tippy, { TippyProps } from '@tippyjs/react'
-import 'tippy.js/dist/tippy.css'
-import './Tooltip.scss'
-
-interface TooltipProps extends TippyProps {
-  content: ReactNode
-  success?: boolean
-  onMouseEnter?: (event: React.MouseEvent<HTMLDivElement>) => void
-  onMouseLeave?: (event: React.MouseEvent<HTMLDivElement>) => void
-  visible?: boolean
-  delay?: [number, number]
-  type?: 'info' | 'function'
-  maxWidth?: number
-  className?: string
-  arrowWithBorder?: boolean
-  disabled?: boolean
-}
-
-const Tooltip: React.FC<TooltipProps> = ({
-  children,
-  content,
-  success,
-  onMouseEnter,
-  onMouseLeave,
-  visible,
-  delay = [200, 400],
-  type = 'info',
-  maxWidth = 390,
-  className,
-  arrowWithBorder,
-  disabled,
-  ...props
-}) => {
-  const [rootFontSize, setRootFontSize] = useState(16)
-
-  useEffect(() => {
-    const handleFontSizeChange = (fontSize: number) => {
-      setRootFontSize((prev) => (prev !== fontSize ? fontSize : prev))
-    }
-
-    if (
-      // @ts-ignore - Ignoring if `applicationUIScaling` doesn't exist
-      window.applicationUIScaling &&
-      // @ts-ignore - Ignoring if `applicationUIScaling` doesn't exist
-      typeof window.applicationUIScaling.addEventHandler === 'function'
-    ) {
-      // @ts-ignore - Ignoring if `applicationUIScaling` doesn't exist
-      window.applicationUIScaling.addEventHandler(handleFontSizeChange)
-    }
-  }, [])
-
-  return (
-    <Tippy
-      visible={visible}
-      allowHTML={typeof content !== 'string'}
-      interactive
-      maxWidth={(maxWidth / 16) * rootFontSize}
-      delay={delay}
-      content={content}
-      placement="bottom-start"
-      className={`${success ? 'success' : ''} ${type} ${className || ''} ${
-        arrowWithBorder ? 'arrow-with-border' : ''
-      }`}
-      disabled={disabled}
-      {...props}
-    >
-      <div
-        className="tooltip-custom-wrapper"
-        onMouseEnter={onMouseEnter}
-        onMouseLeave={onMouseLeave}
-      >
-        <div
-          className="tooltip-custom-wrapper"
-          onMouseEnter={onMouseEnter}
-          onMouseLeave={onMouseLeave}
-        >
-          {children}
-        </div>
-      </div>
-    </Tippy>
-  )
-}
-
-export default Tooltip

package/src/components/dialog/dialog.ts

@@ -1,61 +0,0 @@
-import { JSX } from 'react'
-
-export type DialogStatus = 'error' | 'info' | 'warning'
-export type DialogSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'
-export type ButtonType = 'text' | 'submit' | 'reset'
-export type ButtonVariant = 'outlined' | 'contained' | 'text' | 'link'
-export type ButtonColor =
-  | 'inherit'
-  | 'primary'
-  | 'secondary'
-  | 'success'
-  | 'error'
-  | 'info'
-  | 'warning'
-  | 'action'
-  | 'normal'
-export type ButtonSize = 'small' | 'medium' | 'large'
-
-export interface BaseActionButtonProps {
-  text: string
-  color?: ButtonColor
-  variant?: ButtonVariant
-  type?: ButtonType
-  size?: ButtonSize
-  id?: string
-  className?: string
-  disabled?: boolean
-  startIcon?: JSX.Element
-  endIcon?: JSX.Element
-  dataId?: string
-  loading?: boolean
-  fullWidth?: boolean
-  active?: boolean
-  onKeyDown?: () => void
-}
-
-export interface SubmitButtonProps extends BaseActionButtonProps {
-  onClick: () => void // Required for submit
-}
-
-export interface CancelButtonProps extends BaseActionButtonProps {
-  onClick?: () => void // Optional for cancel
-}
-
-export interface CommonDialogProps {
-  status?: DialogStatus
-  content?: React.ReactElement
-  onSubmit?: SubmitButtonProps
-  onCancel?: CancelButtonProps
-  onClose: () => void
-  open?: boolean
-  icon?: JSX.Element | boolean
-  size?: DialogSize
-  children?: React.ReactElement
-  statusTitle?: boolean
-  isSubmitDisabled?: boolean
-  submitBtnComponent?: JSX.Element | null
-  withClose?: boolean
-  noActions?: boolean
-  closeIcon?: JSX.Element
-}

package/src/components/dialog/index.tsx

@@ -1,88 +0,0 @@
-import React from 'react'
-// @ts-ignore
-import { Dialog, Button } from 'digitinary-ui'
-import SVGLoader from '../SVGLoader/SVGLoader'
-import './style.scss'
-import { CommonDialogProps } from './dialog'
-import { Closecircle, InfoIcon } from './../../assets/icons'
-
-const CommonDialog = ({
-  status = 'info',
-  content,
-  onSubmit,
-  onCancel,
-  onClose,
-  open,
-  size = 'xs',
-  icon = (
-    <>
-      <SVGLoader src={InfoIcon} width="4.0625rem" height="4.0625rem" />
-    </>
-  ),
-  noActions = false,
-  closeIcon,
-}: CommonDialogProps) => {
-  const handleClose = () => {
-    onClose() // Always close the dialog first
-
-    if (onCancel && onCancel.onClick) {
-      onCancel.onClick() // If onCancel.onClick is provided, invoke it after closing the dialog
-    }
-  }
-
-  const body = (
-    <div className="common-dialog">
-      {icon && (
-        <div className="confirmation-dialog-header">
-          <div className={`icon ${status}`}>{icon}</div>
-        </div>
-      )}
-      <div className="close-icon">
-        {closeIcon ?? (
-          <SVGLoader src={Closecircle} width={'1.5rem'} height={'1.5rem'} onClick={handleClose} />
-        )}
-      </div>
-
-      {content}
-      {!!noActions ? null : (
-        <div
-          className="confirmation-dialog-footer"
-          style={{ marginBottom: onCancel || onSubmit ? '1.5rem' : '1rem' }}
-        >
-          {onCancel && (
-            <Button
-              {...onCancel}
-              onClick={handleClose}
-              variant={onCancel.variant || 'outlined'}
-              color={onCancel.color || 'normal'}
-            >
-              {onCancel.text}
-            </Button>
-          )}
-          {onSubmit && (
-            <Button
-              {...onSubmit}
-              variant={onSubmit.variant || 'contained'}
-              color={onSubmit.color || 'secondary'}
-            >
-              {onSubmit.text}
-            </Button>
-          )}
-        </div>
-      )}
-    </div>
-  )
-
-  return (
-    <Dialog
-      open={open}
-      onClose={handleClose}
-      content={body}
-      fullWidth={false}
-      size={size}
-      id="common-dialog"
-    />
-  )
-}
-
-export default CommonDialog