@digi-frontend/dgate-api-documentation 1.0.7 → 1.0.9

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

@@ -1,2 +1,4 @@
-declare const InfoForm: () => import("react/jsx-runtime").JSX.Element;
+declare const InfoForm: ({ readOnly }: {
+    readOnly?: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
 export default InfoForm;

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

@@ -0,0 +1,13 @@
+declare const JsonInput: ({ placeholder, label, value, onValidation, onChange, dataId, className, errorMessage, acceptType, fieldIsDisabled, }: {
+    placeholder: any;
+    label: any;
+    value: any;
+    onValidation: any;
+    onChange: any;
+    dataId: any;
+    className?: string;
+    errorMessage: any;
+    acceptType?: string;
+    fieldIsDisabled: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export default JsonInput;

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

@@ -1,9 +1,8 @@
 import { TransformedMethod } from '../../types/layout.type';
-declare const MethodsAccordion: ({ method, path, setFieldValue, readOnly, handleSave, }: {
+declare const MethodsAccordion: ({ method, path, setFieldValue, readOnly, }: {
     method: TransformedMethod;
     path: string;
     setFieldValue: (key: string, value: string) => void;
     readOnly?: boolean;
-    handleSave: (data: any) => unknown;
 }) => import("react/jsx-runtime").JSX.Element;
 export default MethodsAccordion;

package/dist/types/components/table/tags-table.d.ts

@@ -0,0 +1,11 @@
+import './style.scss';
+declare const TagsTable: ({ id, headCells, data, isFormOpen, setIsFormOpen, saveNewRow, readOnly }: {
+    id: any;
+    headCells: any;
+    data: any;
+    isFormOpen: any;
+    setIsFormOpen: any;
+    saveNewRow: any;
+    readOnly: any;
+}) => import("react/jsx-runtime").JSX.Element;
+export default TagsTable;

package/dist/types/constants/index.d.ts

@@ -2,36 +2,50 @@ export declare const methodColorMapping: {
     get: {
         label: string;
         color: string;
+        order: number;
     };
     post: {
         label: string;
         color: string;
+        order: number;
     };
     put: {
         label: string;
         color: string;
+        order: number;
     };
     delete: {
         label: string;
         color: string;
+        order: number;
     };
-    PATCH: {
+    patch: {
         label: string;
         color: string;
+        order: number;
     };
-    OPTIONS: {
+    options: {
         label: string;
         color: string;
+        order: number;
     };
-    TRACE: {
+    trace: {
         label: string;
         color: string;
+        order: number;
     };
-    HEAD: {
+    head: {
         label: string;
         color: string;
+        order: number;
     };
 };
+export declare const tagsTableHeaders: {
+    id: string;
+    label: string;
+    sortable: boolean;
+    classes: string;
+}[];
 export declare const paramsTableHeaders: ({
     id: string;
     label: string;

package/dist/types/layout/layout.d.ts

@@ -2,6 +2,7 @@ import { JSX } from 'react';
 import { OpenAPIFile } from '../types/openApi';
 interface ILayoutProps {
     openApiJson?: OpenAPIFile;
+    handleSave?: (values: unknown) => unknown;
 }
 declare const Layout: ({ openApiJson, handleSave }: ILayoutProps) => JSX.Element;
 export default Layout;

package/dist/types/types/layout.type.d.ts

@@ -3,7 +3,15 @@ export type TransformedMethod = {
     type: HTTPMethod;
     tags: string[];
     parameters: any;
-    requestBody: any;
+    requestBody: {
+        content: {
+            contentType: string;
+            schema: {
+                properties: string;
+                type: string;
+            };
+        };
+    };
     responses: {
         code: string;
         content: {

package/dist/types/types/openApi.d.ts

@@ -33,6 +33,18 @@ export interface OpenAPIFile {
     tags?: {
         name: string;
         description?: string;
+        externalDocs?: {
+            url: string;
+            description: string;
+        }[];
+    }[];
+}
+export interface Tags {
+    name: string;
+    description?: string;
+    externalDocs?: {
+        url: string;
+        description: string;
     }[];
 }
 interface Parameter {
@@ -71,7 +83,7 @@ interface Schema {
     enum?: string[];
     required?: string[];
 }
-interface SecurityScheme {
+export interface SecurityScheme {
     type: 'apiKey' | 'http' | 'oauth2' | 'openIdConnect';
     description?: string;
     name?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digi-frontend/dgate-api-documentation",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",
   "types": "dist/types/index.d.ts",
@@ -16,7 +16,7 @@
   "license": "ISC",
   "description": "",
   "dependencies": {
-    "digitinary-ui": "^1.0.156",
+    "digitinary-ui": "1.0.166",
     "formik": "^2.4.6",
     "html-react-parser": "^5.2.2",
     "js-yaml": "^4.1.0",

package/src/components/MethodAccordion/MethodAccordion.module.scss

@@ -3,17 +3,19 @@
   box-shadow: none !important;
   margin-bottom: 0 !important;
 
-  :global(.summary) {
+  :global(.accordion-header) {
     padding: 0 !important;
     margin: 1.25rem 1.875rem 0 1.875rem !important;
     height: 2.625rem;
+    border: none !important;
+    background-color: transparent !important;
   }
 
   :global(.iconContainer .dropdownIcon) {
     display: none !important;
   }
 
-  :global(.details.show) {
+  :global(.accordion-details.expanded) {
     border: none !important;
     padding: 0 !important;
   }
@@ -26,11 +28,13 @@
 
     .methodSummary {
       display: flex;
+      align-items: center;
       gap: 0.3125rem;
       background-color: #f8f9fb;
       width: 100%;
       padding: 0.3125rem;
       border-radius: 0.3125rem;
+      font-size: 0.875rem;
 
       .methodLabel {
         display: grid;
@@ -41,6 +45,11 @@
         border-radius: 0.1875rem;
         text-transform: capitalize;
       }
+
+      .methodPath {
+        display: block;
+        line-height: 1.25rem !important;
+      }
     }
 
     .methodExpandArrowContainer {
@@ -62,6 +71,16 @@
         transition: rotate 0.3s ease-in-out;
       }
     }
+
+    &.readOnly {
+      .methodSummary {
+        background-color: #ebecf2;
+      }
+
+      .methodExpandArrowContainer {
+        background-color: #ebecf2;
+      }
+    }
   }
 
   .methodAccordionContent {
@@ -70,16 +89,6 @@
     gap: 1.25rem;
     padding-inline: 1.875rem;
 
-    .divTest {
-      background-color: red;
-      height: 40px;
-      width: 15px;
-    }
-
-    .divTest:focus {
-      background-color: black;
-    }
-
     .methodDesc {
       margin-top: 1.25rem;
     }
@@ -171,19 +180,24 @@
 
     .requestAccordion,
     .responseAccordion {
-      border-top: 1px solid #babdcc;
+      border: 1px solid #babdcc;
       border-radius: 0.3125rem !important;
       box-shadow: none !important;
       margin-bottom: 0 !important;
       cursor: default !important;
 
-      :global(.summary) {
+      :global(.accordion-header) {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
         margin: 0 !important;
-        padding: 1rem !important;
-        height: auto !important;
+        padding: 0 !important;
+        height: 4.0625rem !important;
+        border-radius: 0.3125rem !important;
+        background-color: white !important;
       }
 
-      :global(.details.show) {
+      :global(.accordion-details.expanded) {
         border-top: 1px solid #babdcc !important;
         padding: 1.25rem !important;
         padding: 0 !important;
@@ -199,23 +213,27 @@
         }
       }
 
-      :global(.details.show .textArea .containerTextArea) {
+      :global(.accordion-details.expanded .textArea .containerTextArea) {
         display: flex;
       }
 
-      :global(.details.show .textArea .containerTextArea .inputField) {
+      :global(.accordion-details.expanded .textArea .containerTextArea .inputField) {
         height: 100%;
         padding: 1.25rem;
       }
 
       .requestAccordionSummary,
       .responseAccordionSummary {
+        width: 100%;
+        display: flex;
+        justify-content: space-between;
         font-weight: 700;
         font-size: 1.125rem;
         line-height: 1.5rem;
         display: flex;
         align-items: center;
         cursor: default !important;
+        margin-inline: 0.625rem 1.25rem;
       }
 
       .responseAccordionSummary_title,
@@ -233,18 +251,18 @@
         }
       }
 
-      :global(.details) {
+      :global(.accordion-details) {
         :global(.textArea .inputField) {
           padding: 0;
           border: none;
         }
       }
 
-      :global(.summary .iconContainer .dropdownIcon) {
+      :global(.accordion-header .iconContainer .dropdownIcon) {
         display: none !important;
       }
 
-      :global(.summary) {
+      :global(.accordion-header) {
         cursor: default;
       }
     }
@@ -272,7 +290,7 @@
         }
       }
 
-      :global(.summary) {
+      :global(.accordion-header) {
         overflow: visible;
         cursor: default;
       }

package/src/components/MethodAccordion/MethodAccordion.tsx

@@ -54,7 +54,7 @@ const MethodsAccordion = ({
   const [selectedParamIndex, setSelectedParamIndex] = useState<number | null>(null)
   const [selectedParamName, setSelectedParamName] = useState<string | null>(null)
   const [tableRecords, setTableRecords] = useState()
-  
+
   const [selectedStatusCode, setSelectedStatusCode] = useState(httpStatusCodeOptions[4])
   const currentResponse =
     method.responses.find((res) => Number(res.code) === selectedStatusCode.value) || '{}'
@@ -220,7 +220,7 @@ const MethodsAccordion = ({
         onChange={() => setIsExpanded((prev) => ({ ...prev, method: !prev.method }))}
         className={styles.methodAccordion}
         summary={
-          <div className={styles.methodSummaryContainer}>
+          <div className={`${styles.methodSummaryContainer} ${readOnly ? styles.readOnly : ''}`}>
             <div className={styles.methodSummary}>
               <span
                 style={{
@@ -339,6 +339,7 @@ const MethodsAccordion = ({
                   <SelectGroup
                     withSearch={false}
                     isMultiple={false}
+                    clearable={false}
                     placeholder="200"
                     options={[
                       {

package/src/components/table/table.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react'
 import './style.scss'
-import { Button, Input, SelectGroup, Switch, TextArea } from 'digitinary-ui'
+import { Button, Input, SelectGroupV2, Switch, TextArea } from 'digitinary-ui'
 import Tooltip from '../Tooltip/Tooltip'
 import SVGLoader from '../SVGLoader/SVGLoader'
 import { AddRow, EditIcon, DeleteIcon } from '../../assets/icons'
@@ -125,7 +125,7 @@ const ParamterTable = ({
 
                 <td key={'parameter in'}>
                   <div data-id="TEXT_DESCRIPTION" className="tableData">
-                    <SelectGroup
+                    <SelectGroupV2
                       disabled={readOnly}
                       value={{
                         label: capitalize(values.in),
@@ -152,7 +152,7 @@ const ParamterTable = ({
 
                 <td key={'parameter schema type'}>
                   <div data-id="TEXT_DESCRIPTION" className="tableData">
-                    <SelectGroup
+                    <SelectGroupV2
                       disabled={readOnly}
                       value={{
                         label: capitalize(values.schema.type),