@digi-frontend/dgate-api-documentation 1.0.95 → 1.0.96

package/dist/src/layout/docsComponents/DocsHeader/DocsHeader.js

@@ -1,2 +1,2 @@
-import{j as e}from"../../../../_virtual/jsx-runtime.js";import{useState as s}from"react";import{d as o}from"../../../../_virtual/index3.js";import t from"../../../components/SVGLoader/SVGLoader.js";import r from"../../../assets/icons/UpArrow.svg.js";import i from"../../../assets/icons/DownArrow.svg.js";import a from"../../../assets/icons/ApiIcon.svg.js";import n from"../../../assets/icons/FilterIcon.svg.js";import l from"../../../assets/icons/BookIcon.svg.js";import c from"../../../assets/icons/searchIcon.svg.js";import d from"../../../components/Tooltip/Tooltip.js";import m from"../../../components/dialog/index.js";import{METHOD_OPTIONS as h}from"../../../constants/methods.constant.js";import p from"./DocsHeader.module.scss.js";const j=({transformedOpenApis:j,updateFilteredData:u})=>{const[x,v]=s(!1),[f,g]=s(""),[N,b]=s([]),[_,C]=s(!1);return e.jsxs(e.Fragment,{children:[e.jsx("header",{className:p.api_docs_header,children:e.jsxs("div",{className:p.header_content,children:[e.jsxs(o.Button,{variant:"outlined",size:"small",className:p.search_filter_btn,onClick:()=>{v(!0)},children:["Search & Filter",e.jsx(t,{src:n})]}),e.jsxs("div",{className:p.nav_buttons,children:[e.jsx(d,{placement:"bottom",delay:[0,0],className:`guides-tooltip ${p.tippy_box_color}`,content:e.jsx("div",{children:"Coming Soon"}),children:e.jsxs(o.Button,{variant:"outlined",size:"small",className:"guide-btn",disabled:!0,children:[e.jsx(t,{src:l}),"GUIDES"]})}),e.jsxs(o.Button,{variant:"outlined",size:"small",className:p.api_btn,children:[e.jsx(t,{src:a}),"   API reference"]})]})]})}),e.jsx(m,{size:"sm",open:x,onClose:()=>{v(!1),C(!1)},icon:!1,withClose:!1,noActions:!0,content:e.jsxs("div",{className:"search-filter-form "+(_?"expanded":""),children:[e.jsx("div",{className:"search-filter-form__header",children:e.jsx("p",{className:"search-filter-form__header__title",children:"Search & Filter"})}),e.jsx(o.Input,{className:"name-input",placeholder:"Search by API name",value:f,onChange:e=>g(e),size:o.Size.Medium,clearable:!0,endAdornment:e.jsx(t,{src:c})}),e.jsxs("div",{className:"method-container",children:[e.jsx("label",{children:"Method"}),e.jsxs("div",{className:"typeDdl",onClick:()=>C(e=>!e),children:[e.jsx("span",{children:"Select Method"}),e.jsx(t,{src:_?r:i})]}),_&&e.jsx("div",{className:"methodList",children:h.map(s=>e.jsxs("div",{className:"method-item",children:[e.jsx("input",{type:"checkbox",className:"agreement-checkbox",checked:N.includes(s.value),onChange:e=>((e,s)=>{const{target:{checked:o}}=e;o?b(e=>[...e,s.value]):N.includes(s.value)&&b(e=>e.filter(e=>e!=s.value))})(e,s)}),e.jsx("span",{style:{color:s.color},children:s.label})]}))})]}),e.jsx("div",{className:"button-container",children:e.jsx(o.Button,{variant:"contained",color:"primary",size:"large",onClick:()=>{if(!((null==f?void 0:f.trim())||N&&0!==N.length))return u(j,!0),void v(!1);let e=[...j];if(null==f?void 0:f.trim()){const s=f.toLowerCase();e=e.filter(e=>e.title.toLowerCase().includes(s))}(null==N?void 0:N.length)&&(e=e.filter(e=>{const s=Object.values(e.tags||{}).flat().map(e=>{var s;return null===(s=e.method)||void 0===s?void 0:s.toLowerCase()});return N.some(e=>s.includes(e.toLowerCase()))})),u(e),v(!1)},className:"dialog-submit-btn",children:"Apply"})})]})})]})};export{j as default};
+import{j as e}from"../../../../_virtual/jsx-runtime.js";import{useState as s}from"react";import{d as o}from"../../../../_virtual/index3.js";import t from"../../../components/SVGLoader/SVGLoader.js";import r from"../../../assets/icons/UpArrow.svg.js";import i from"../../../assets/icons/DownArrow.svg.js";import a from"../../../assets/icons/ApiIcon.svg.js";import n from"../../../assets/icons/FilterIcon.svg.js";import l from"../../../assets/icons/BookIcon.svg.js";import c from"../../../assets/icons/searchIcon.svg.js";import d from"../../../components/Tooltip/Tooltip.js";import m from"../../../components/dialog/index.js";import{METHOD_OPTIONS as h}from"../../../constants/methods.constant.js";import j from"./DocsHeader.module.scss.js";const p=({transformedOpenApis:p,updateFilteredData:u})=>{const[v,x]=s(!1),[f,g]=s(""),[N,b]=s([]),[_,C]=s(!1);return e.jsxs(e.Fragment,{children:[e.jsx("header",{className:j.api_docs_header,children:e.jsxs("div",{className:j.header_content,children:[e.jsxs(o.Button,{variant:"outlined",size:"small",className:j.search_filter_btn,onClick:()=>{x(!0)},children:["Search & Filter",e.jsx(t,{src:n})]}),e.jsxs("div",{className:j.nav_buttons,children:[e.jsx(d,{placement:"bottom",offset:[10,5],delay:[0,0],className:"guide-tooltip",content:e.jsx("div",{children:"Coming Soon"}),children:e.jsxs(o.Button,{variant:"outlined",size:"small",className:"guide-btn",disabled:!0,children:[e.jsx(t,{src:l}),"GUIDES"]})}),e.jsxs(o.Button,{variant:"outlined",size:"small",className:j.api_btn,children:[e.jsx(t,{src:a}),"   API reference"]})]})]})}),e.jsx(m,{size:"sm",open:v,onClose:()=>{x(!1),C(!1)},icon:!1,withClose:!1,noActions:!0,content:e.jsxs("div",{className:"search-filter-form "+(_?"expanded":""),children:[e.jsx("div",{className:"search-filter-form__header",children:e.jsx("p",{className:"search-filter-form__header__title",children:"Search & Filter"})}),e.jsx(o.Input,{className:"name-input",placeholder:"Search by API name",value:f,onChange:e=>g(e),size:o.Size.Medium,clearable:!0,endAdornment:e.jsx(t,{src:c})}),e.jsxs("div",{className:"method-container",children:[e.jsx("label",{children:"Method"}),e.jsxs("div",{className:"typeDdl",onClick:()=>C(e=>!e),children:[e.jsx("span",{children:"Select Method"}),e.jsx(t,{src:_?r:i})]}),_&&e.jsx("div",{className:"methodList",children:h.map(s=>e.jsxs("div",{className:"method-item",children:[e.jsx("input",{type:"checkbox",className:"agreement-checkbox",checked:N.includes(s.value),onChange:e=>((e,s)=>{const{target:{checked:o}}=e;o?b(e=>[...e,s.value]):N.includes(s.value)&&b(e=>e.filter(e=>e!=s.value))})(e,s)}),e.jsx("span",{style:{color:s.color},children:s.label})]}))})]}),e.jsx("div",{className:"button-container",children:e.jsx(o.Button,{variant:"contained",color:"primary",size:"large",onClick:()=>{if(!((null==f?void 0:f.trim())||N&&0!==N.length))return u(p,!0),void x(!1);let e=[...p];if(null==f?void 0:f.trim()){const s=f.toLowerCase();e=e.filter(e=>e.title.toLowerCase().includes(s))}(null==N?void 0:N.length)&&(e=e.filter(e=>{const s=Object.values(e.tags||{}).flat().map(e=>{var s;return null===(s=e.method)||void 0===s?void 0:s.toLowerCase()});return N.some(e=>s.includes(e.toLowerCase()))})),u(e),x(!1)},className:"dialog-submit-btn",children:"Apply"})})]})})]})};export{p as default};
 //# sourceMappingURL=DocsHeader.js.map

package/dist/src/layout/docsComponents/DocsHeader/DocsHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocsHeader.js","sources":["../../../../../src/layout/docsComponents/DocsHeader/DocsHeader.tsx"],"sourcesContent":["import React, { useState, useRef } from 'react'\nimport { Button, Size, Input } from 'digitinary-ui'\nimport SVGLoader from '../../../components/SVGLoader/SVGLoader'\nimport {\n  FilterIcon,\n  BookIcon,\n  ApiIcon,\n  SearchIcon,\n  UpArrowIcon,\n  DownArrowIcon,\n} from '../../../assets/icons'\nimport Tooltip from '../../../components/Tooltip/Tooltip'\nimport CommonDialog from '../../../components/dialog/index'\nimport { METHOD_OPTIONS } from '../../../constants/methods.constant'\nimport styles from './DocsHeader.module.scss'\nimport { OverviewData } from '../../../../src/layout/docsLayout'\n\nconst DocsHeader = ({\n  transformedOpenApis,\n  updateFilteredData,\n}: {\n  transformedOpenApis: OverviewData[]\n  updateFilteredData: (filteredItems: OverviewData[], isReset?: boolean) => void\n}) => {\n  const [showSearchFilter, setShowSearchFilter] = useState<boolean>(false)\n  const [apiName, setApiName] = useState<string>('')\n  const [selectedMethods, setSelectedMethods] = useState<any[]>([])\n  const [isMethodDropdownOpen, setIsMethodDropdownOpen] = useState<boolean>(false)\n\n  const handleOpenSearchFilter = (): void => {\n    setShowSearchFilter(true)\n  }\n\n  const handleCloseSearchFilter = (): void => {\n    setShowSearchFilter(false)\n    setIsMethodDropdownOpen(false)\n  }\n\n  const handleApplyFilters = (): void => {\n    // Reset: no filters applied\n    if (!apiName?.trim() && (!selectedMethods || selectedMethods.length === 0)) {\n      updateFilteredData(transformedOpenApis, true)\n      setShowSearchFilter(false)\n      return\n    }\n\n    let filteredItems = [...transformedOpenApis]\n\n    // Filter by API name\n    if (apiName?.trim()) {\n      const lowerApiName = apiName.toLowerCase()\n      filteredItems = filteredItems.filter((api) => api.title.toLowerCase().includes(lowerApiName))\n    }\n\n    // Filter by selected HTTP methods\n    if (selectedMethods?.length) {\n      filteredItems = filteredItems.filter((api) => {\n        const allMethods = Object.values(api.tags || {})\n          .flat()\n          .map((endpoint: any) => endpoint.method?.toLowerCase())\n\n        return selectedMethods.some((method) => allMethods.includes(method.toLowerCase()))\n      })\n    }\n\n    updateFilteredData(filteredItems)\n    setShowSearchFilter(false)\n  }\n\n  const handleCheckMethod = (e, method: (typeof METHOD_OPTIONS)[0]) => {\n    const {\n      target: { checked },\n    } = e\n    if (checked) {\n      setSelectedMethods((prev) => [...prev, method.value])\n    } else {\n      if (selectedMethods.includes(method.value)) {\n        setSelectedMethods((prev) => prev.filter((_m) => _m != method.value))\n      }\n    }\n  }\n\n  return (\n    <>\n      <header className={styles.api_docs_header}>\n        <div className={styles.header_content}>\n          <Button\n            variant=\"outlined\"\n            size=\"small\"\n            className={styles.search_filter_btn}\n            onClick={handleOpenSearchFilter}\n          >\n            Search & Filter\n            <SVGLoader src={FilterIcon} />\n          </Button>\n          <div className={styles.nav_buttons}>\n            <Tooltip\n              placement=\"bottom\"\n              delay={[0, 0]}\n              className={`guides-tooltip ${styles.tippy_box_color}`}\n              content={<div>Coming Soon</div>}\n            >\n              <Button variant=\"outlined\" size=\"small\" className=\"guide-btn\" disabled={true}>\n                <SVGLoader src={BookIcon} />\n                GUIDES\n              </Button>\n            </Tooltip>\n            <Button variant=\"outlined\" size=\"small\" className={styles.api_btn}>\n              <SVGLoader src={ApiIcon} /> &nbsp; API reference\n            </Button>\n          </div>\n        </div>\n      </header>\n      <CommonDialog\n        size=\"sm\"\n        open={showSearchFilter}\n        onClose={handleCloseSearchFilter}\n        icon={false}\n        withClose={false}\n        noActions\n        content={\n          <div className={`search-filter-form ${isMethodDropdownOpen ? 'expanded' : ''}`}>\n            <div className=\"search-filter-form__header\">\n              <p className=\"search-filter-form__header__title\">Search & Filter</p>\n            </div>\n            <Input\n              className=\"name-input\"\n              placeholder=\"Search by API name\"\n              value={apiName}\n              onChange={(value) => setApiName(value as string)}\n              size={Size.Medium}\n              clearable\n              endAdornment={<SVGLoader src={SearchIcon} />}\n            />\n            <div className=\"method-container\">\n              <label>Method</label>\n              {/* <SelectGroup\n                isMultiple={true}\n                size={Size.Medium}\n                placeholder=\"Select Method\"\n                value={selectedMethods}\n                onChange={(value) => setSelectedMethods(value || [])}\n                options={[\n                  \n                ]}\n                withSearch={false}\n                className=\"method-select custom-select-border\"\n              /> */}\n              <div className=\"typeDdl\" onClick={() => setIsMethodDropdownOpen((prev) => !prev)}>\n                <span>Select Method</span>\n                <SVGLoader src={!isMethodDropdownOpen ? DownArrowIcon : UpArrowIcon} />\n              </div>\n              {isMethodDropdownOpen && (\n                <div className=\"methodList\">\n                  {METHOD_OPTIONS.map((_m) => (\n                    <div className=\"method-item\">\n                      <input\n                        type=\"checkbox\"\n                        className=\"agreement-checkbox\"\n                        checked={selectedMethods.includes(_m.value)}\n                        onChange={(e) => handleCheckMethod(e, _m)}\n                      />\n                      <span style={{ color: _m.color }}>{_m.label}</span>\n                    </div>\n                  ))}\n                </div>\n              )}\n            </div>\n            <div className=\"button-container\">\n              <Button\n                variant=\"contained\"\n                color=\"primary\"\n                size=\"large\"\n                onClick={handleApplyFilters}\n                className=\"dialog-submit-btn\"\n              >\n                Apply\n              </Button>\n            </div>\n          </div>\n        }\n      />\n    </>\n  )\n}\n\nexport default DocsHeader\n"],"names":["DocsHeader","transformedOpenApis","updateFilteredData","showSearchFilter","setShowSearchFilter","useState","apiName","setApiName","selectedMethods","setSelectedMethods","isMethodDropdownOpen","setIsMethodDropdownOpen","_jsxs","_jsx","jsx","className","styles","api_docs_header","children","header_content","Button","variant","size","search_filter_btn","onClick","SVGLoader","src","FilterIcon","jsxs","nav_buttons","Tooltip","placement","delay","tippy_box_color","content","disabled","BookIcon","api_btn","ApiIcon","CommonDialog","open","onClose","icon","withClose","noActions","Input","placeholder","value","onChange","Size","Medium","clearable","endAdornment","SearchIcon","prev","UpArrowIcon","DownArrowIcon","METHOD_OPTIONS","map","_m","type","checked","includes","e","method","target","filter","handleCheckMethod","style","color","label","trim","length","filteredItems","lowerApiName","toLowerCase","api","title","allMethods","Object","values","tags","flat","endpoint","_a","some"],"mappings":"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"}
+{"version":3,"file":"DocsHeader.js","sources":["../../../../../src/layout/docsComponents/DocsHeader/DocsHeader.tsx"],"sourcesContent":["import React, { useState, useRef } from 'react'\nimport { Button, Size, Input } from 'digitinary-ui'\nimport SVGLoader from '../../../components/SVGLoader/SVGLoader'\nimport {\n  FilterIcon,\n  BookIcon,\n  ApiIcon,\n  SearchIcon,\n  UpArrowIcon,\n  DownArrowIcon,\n} from '../../../assets/icons'\nimport Tooltip from '../../../components/Tooltip/Tooltip'\nimport CommonDialog from '../../../components/dialog/index'\nimport { METHOD_OPTIONS } from '../../../constants/methods.constant'\nimport styles from './DocsHeader.module.scss'\nimport { OverviewData } from '../../../../src/layout/docsLayout'\n\nconst DocsHeader = ({\n  transformedOpenApis,\n  updateFilteredData,\n}: {\n  transformedOpenApis: OverviewData[]\n  updateFilteredData: (filteredItems: OverviewData[], isReset?: boolean) => void\n}) => {\n  const [showSearchFilter, setShowSearchFilter] = useState<boolean>(false)\n  const [apiName, setApiName] = useState<string>('')\n  const [selectedMethods, setSelectedMethods] = useState<any[]>([])\n  const [isMethodDropdownOpen, setIsMethodDropdownOpen] = useState<boolean>(false)\n\n  const handleOpenSearchFilter = (): void => {\n    setShowSearchFilter(true)\n  }\n\n  const handleCloseSearchFilter = (): void => {\n    setShowSearchFilter(false)\n    setIsMethodDropdownOpen(false)\n  }\n\n  const handleApplyFilters = (): void => {\n    // Reset: no filters applied\n    if (!apiName?.trim() && (!selectedMethods || selectedMethods.length === 0)) {\n      updateFilteredData(transformedOpenApis, true)\n      setShowSearchFilter(false)\n      return\n    }\n\n    let filteredItems = [...transformedOpenApis]\n\n    // Filter by API name\n    if (apiName?.trim()) {\n      const lowerApiName = apiName.toLowerCase()\n      filteredItems = filteredItems.filter((api) => api.title.toLowerCase().includes(lowerApiName))\n    }\n\n    // Filter by selected HTTP methods\n    if (selectedMethods?.length) {\n      filteredItems = filteredItems.filter((api) => {\n        const allMethods = Object.values(api.tags || {})\n          .flat()\n          .map((endpoint: any) => endpoint.method?.toLowerCase())\n\n        return selectedMethods.some((method) => allMethods.includes(method.toLowerCase()))\n      })\n    }\n\n    updateFilteredData(filteredItems)\n    setShowSearchFilter(false)\n  }\n\n  const handleCheckMethod = (e, method: (typeof METHOD_OPTIONS)[0]) => {\n    const {\n      target: { checked },\n    } = e\n    if (checked) {\n      setSelectedMethods((prev) => [...prev, method.value])\n    } else {\n      if (selectedMethods.includes(method.value)) {\n        setSelectedMethods((prev) => prev.filter((_m) => _m != method.value))\n      }\n    }\n  }\n\n  return (\n    <>\n      <header className={styles.api_docs_header}>\n        <div className={styles.header_content}>\n          <Button\n            variant=\"outlined\"\n            size=\"small\"\n            className={styles.search_filter_btn}\n            onClick={handleOpenSearchFilter}\n          >\n            Search & Filter\n            <SVGLoader src={FilterIcon} />\n          </Button>\n          <div className={styles.nav_buttons}>\n            <Tooltip\n              placement=\"bottom\"\n              offset={[10, 5]}\n              delay={[0, 0]}\n              className=\"guide-tooltip\"\n              content={<div>Coming Soon</div>}\n            >\n              <Button variant=\"outlined\" size=\"small\" className=\"guide-btn\" disabled={true}>\n                <SVGLoader src={BookIcon} />\n                GUIDES\n              </Button>\n            </Tooltip>\n            <Button variant=\"outlined\" size=\"small\" className={styles.api_btn}>\n              <SVGLoader src={ApiIcon} /> &nbsp; API reference\n            </Button>\n          </div>\n        </div>\n      </header>\n      <CommonDialog\n        size=\"sm\"\n        open={showSearchFilter}\n        onClose={handleCloseSearchFilter}\n        icon={false}\n        withClose={false}\n        noActions\n        content={\n          <div className={`search-filter-form ${isMethodDropdownOpen ? 'expanded' : ''}`}>\n            <div className=\"search-filter-form__header\">\n              <p className=\"search-filter-form__header__title\">Search & Filter</p>\n            </div>\n            <Input\n              className=\"name-input\"\n              placeholder=\"Search by API name\"\n              value={apiName}\n              onChange={(value) => setApiName(value as string)}\n              size={Size.Medium}\n              clearable\n              endAdornment={<SVGLoader src={SearchIcon} />}\n            />\n            <div className=\"method-container\">\n              <label>Method</label>\n              {/* <SelectGroup\n                isMultiple={true}\n                size={Size.Medium}\n                placeholder=\"Select Method\"\n                value={selectedMethods}\n                onChange={(value) => setSelectedMethods(value || [])}\n                options={[\n                  \n                ]}\n                withSearch={false}\n                className=\"method-select custom-select-border\"\n              /> */}\n              <div className=\"typeDdl\" onClick={() => setIsMethodDropdownOpen((prev) => !prev)}>\n                <span>Select Method</span>\n                <SVGLoader src={!isMethodDropdownOpen ? DownArrowIcon : UpArrowIcon} />\n              </div>\n              {isMethodDropdownOpen && (\n                <div className=\"methodList\">\n                  {METHOD_OPTIONS.map((_m) => (\n                    <div className=\"method-item\">\n                      <input\n                        type=\"checkbox\"\n                        className=\"agreement-checkbox\"\n                        checked={selectedMethods.includes(_m.value)}\n                        onChange={(e) => handleCheckMethod(e, _m)}\n                      />\n                      <span style={{ color: _m.color }}>{_m.label}</span>\n                    </div>\n                  ))}\n                </div>\n              )}\n            </div>\n            <div className=\"button-container\">\n              <Button\n                variant=\"contained\"\n                color=\"primary\"\n                size=\"large\"\n                onClick={handleApplyFilters}\n                className=\"dialog-submit-btn\"\n              >\n                Apply\n              </Button>\n            </div>\n          </div>\n        }\n      />\n    </>\n  )\n}\n\nexport default DocsHeader\n"],"names":["DocsHeader","transformedOpenApis","updateFilteredData","showSearchFilter","setShowSearchFilter","useState","apiName","setApiName","selectedMethods","setSelectedMethods","isMethodDropdownOpen","setIsMethodDropdownOpen","_jsxs","_jsx","jsx","className","styles","api_docs_header","children","header_content","Button","variant","size","search_filter_btn","onClick","SVGLoader","src","FilterIcon","nav_buttons","Tooltip","placement","offset","delay","content","jsxs","disabled","BookIcon","api_btn","ApiIcon","CommonDialog","open","onClose","icon","withClose","noActions","Input","placeholder","value","onChange","Size","Medium","clearable","endAdornment","SearchIcon","prev","UpArrowIcon","DownArrowIcon","METHOD_OPTIONS","map","_m","type","checked","includes","e","method","target","filter","handleCheckMethod","style","color","label","trim","length","filteredItems","lowerApiName","toLowerCase","api","title","allMethods","Object","values","tags","flat","endpoint","_a","some"],"mappings":"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"}

package/dist/styles.css

@@ -39,176 +39,29 @@
   grid-row: 2;
   grid-column: 2;
   background-color: white;
-}.livePreviewContainer .titleContainer {
-  margin-top: 1.875rem;
+}.containerTitleDrawer {
+  height: 64px;
+  min-height: 64px;
   display: flex;
+  flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  flex-wrap: wrap;
-  max-width: 100%;
-  gap: 1.25rem;
-}
-.livePreviewContainer .titleContainer p.apiName {
-  font-size: 40px;
-  line-height: 30px;
-  font-weight: 500;
-  word-wrap: break-word;
-  overflow-wrap: break-word;
-  word-break: break-all;
+  background-color: #f1f2f6;
+  padding: 0 30px 0 30px;
+  width: 100%;
 }
-.livePreviewContainer .titleContainer .livePreviewChip {
-  background-color: #ebecf2;
+.containerTitleDrawer span {
   color: #12131a;
+  font-weight: 600;
+  font-size: 18px;
+  line-height: 25px;
+  letter-spacing: 0em;
 }
-.livePreviewContainer .description_preview {
-  word-break: break-all;
-}
-
-.requestAccordion,
-.responseAccordion {
-  background-color: #f4c5c5;
-  border: 1px solid #da3f3f;
-  border-radius: 0.3125rem !important;
-  box-shadow: none !important;
-  margin-bottom: 0 !important;
-  cursor: default !important;
-  margin-top: 0.625rem;
-}
-.requestAccordion :global(.accordion-header),
-.responseAccordion :global(.accordion-header) {
-  background-color: #f4c5c5;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin: 0 !important;
-  padding: 0 !important;
-  height: 4.0625rem !important;
-  border-radius: 0.3125rem !important;
-}
-.requestAccordion :global(.accordion-details.expanded),
-.responseAccordion :global(.accordion-details.expanded) {
-  border-top: 1px solid #000 !important;
-  padding: 1.25rem !important;
-  padding: 0 !important;
-  background-color: #f4c5c5;
-}
-.requestAccordion :global(.accordion-details.expanded) :global(.jsonField) div textarea,
-.responseAccordion :global(.accordion-details.expanded) :global(.jsonField) div textarea {
-  border-top-right-radius: 0;
-  border-top-left-radius: 0;
-  height: 10rem;
-}
-.requestAccordion :global(.accordion-details.expanded .textArea .containerTextArea),
-.responseAccordion :global(.accordion-details.expanded .textArea .containerTextArea) {
-  display: flex;
-}
-.requestAccordion :global(.accordion-details.expanded .textArea .containerTextArea .inputField),
-.responseAccordion :global(.accordion-details.expanded .textArea .containerTextArea .inputField) {
-  height: 100%;
-  padding: 1.25rem;
-}
-.requestAccordion .accordionContent,
-.responseAccordion .accordionContent {
-  max-width: 100%;
-  padding-left: 0.625rem;
-  padding-right: 0.625rem;
-  padding-top: 0.9375rem;
-}
-.requestAccordion .accordionContent ol,
-.responseAccordion .accordionContent ol {
-  padding-left: 1.7rem;
-}
-.requestAccordion .accordionContent ol li,
-.responseAccordion .accordionContent ol li {
-  max-width: 100%;
-  word-break: break-all;
+.containerTitleDrawer svg path {
+  stroke: #000 !important;
 }
-.requestAccordion .requestAccordionSummary,
-.requestAccordion .responseAccordionSummary,
-.responseAccordion .requestAccordionSummary,
-.responseAccordion .responseAccordionSummary {
-  width: 100%;
+.containerTitleDrawer .closeIcon {
   cursor: pointer;
-  display: flex;
-  justify-content: space-between;
-  font-weight: 700;
-  font-size: 1.125rem;
-  line-height: 1.5rem;
-  display: flex;
-  align-items: center;
-  margin-inline: 0.625rem 1.25rem;
-}
-.requestAccordion .responseAccordionSummary_title,
-.requestAccordion .requestAccordionSummary_title,
-.requestAccordion .responseAccordionSummary,
-.responseAccordion .responseAccordionSummary_title,
-.responseAccordion .requestAccordionSummary_title,
-.responseAccordion .responseAccordionSummary {
-  display: flex;
-  align-items: center;
-}
-.requestAccordion .responseAccordionSummary_title svg,
-.requestAccordion .requestAccordionSummary_title svg,
-.requestAccordion .responseAccordionSummary svg,
-.responseAccordion .responseAccordionSummary_title svg,
-.responseAccordion .requestAccordionSummary_title svg,
-.responseAccordion .responseAccordionSummary svg {
-  transition: rotate 0.2s ease-in-out;
-}
-.requestAccordion .responseAccordionSummary_title .expanded,
-.requestAccordion .requestAccordionSummary_title .expanded,
-.requestAccordion .responseAccordionSummary .expanded,
-.responseAccordion .responseAccordionSummary_title .expanded,
-.responseAccordion .requestAccordionSummary_title .expanded,
-.responseAccordion .responseAccordionSummary .expanded {
-  rotate: 180deg;
-}
-.requestAccordion :global(.accordion-details) :global(.textArea .inputField),
-.responseAccordion :global(.accordion-details) :global(.textArea .inputField) {
-  padding: 0;
-  border: none;
-}
-.requestAccordion :global(.accordion-header .iconContainer .dropdownIcon),
-.responseAccordion :global(.accordion-header .iconContainer .dropdownIcon) {
-  display: none !important;
-}
-.requestAccordion :global(.accordion-header),
-.responseAccordion :global(.accordion-header) {
-  cursor: default;
-}
-
-.responseAccordion .responseAccordionSummary {
-  display: flex;
-  align-items: center;
-}
-.responseAccordion .responseAccordionSummary :global(.multiSelectGroup .optionsList) {
-  width: 8rem !important;
-  min-width: 8rem !important;
-}
-.responseAccordion .responseAccordionSummary :global(.multiSelectGroup) {
-  width: 8rem;
-  margin-left: auto;
-}
-.responseAccordion .responseAccordionSummary :global(.multiSelectGroup) :global(.selectDisplay) {
-  height: 2.0625rem !important;
-  min-height: 2.0625rem !important;
-  padding: 0;
-  padding-left: 0.625rem;
-}
-.responseAccordion :global(.accordion-header) {
-  overflow: visible;
-  cursor: default;
-}
-.responseAccordion .statusCodeOptionContainer {
-  display: grid;
-  grid-template-columns: min-content min-content;
-  align-items: center;
-  gap: 0.625rem;
-}
-.responseAccordion .statusCodeOptionContainer .statusCodeOptionCircle {
-  width: 0.625rem;
-  aspect-ratio: 1/1;
-  border-radius: 100%;
 }.apiInfoForm {
   display: grid;
   padding: 1.25rem 1.875rem;
@@ -658,29 +511,176 @@
 }
 .methodAccordion.readOnly .methodSummaryContainer .methodExpandArrowContainer {
   background-color: #ebecf2;
-}.containerTitleDrawer {
-  height: 64px;
-  min-height: 64px;
+}.livePreviewContainer .titleContainer {
+  margin-top: 1.875rem;
   display: flex;
-  flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  background-color: #f1f2f6;
-  padding: 0 30px 0 30px;
-  width: 100%;
+  flex-wrap: wrap;
+  max-width: 100%;
+  gap: 1.25rem;
 }
-.containerTitleDrawer span {
+.livePreviewContainer .titleContainer p.apiName {
+  font-size: 40px;
+  line-height: 30px;
+  font-weight: 500;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  word-break: break-all;
+}
+.livePreviewContainer .titleContainer .livePreviewChip {
+  background-color: #ebecf2;
   color: #12131a;
-  font-weight: 600;
-  font-size: 18px;
-  line-height: 25px;
-  letter-spacing: 0em;
 }
-.containerTitleDrawer svg path {
-  stroke: #000 !important;
+.livePreviewContainer .description_preview {
+  word-break: break-all;
 }
-.containerTitleDrawer .closeIcon {
+
+.requestAccordion,
+.responseAccordion {
+  background-color: #f4c5c5;
+  border: 1px solid #da3f3f;
+  border-radius: 0.3125rem !important;
+  box-shadow: none !important;
+  margin-bottom: 0 !important;
+  cursor: default !important;
+  margin-top: 0.625rem;
+}
+.requestAccordion :global(.accordion-header),
+.responseAccordion :global(.accordion-header) {
+  background-color: #f4c5c5;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin: 0 !important;
+  padding: 0 !important;
+  height: 4.0625rem !important;
+  border-radius: 0.3125rem !important;
+}
+.requestAccordion :global(.accordion-details.expanded),
+.responseAccordion :global(.accordion-details.expanded) {
+  border-top: 1px solid #000 !important;
+  padding: 1.25rem !important;
+  padding: 0 !important;
+  background-color: #f4c5c5;
+}
+.requestAccordion :global(.accordion-details.expanded) :global(.jsonField) div textarea,
+.responseAccordion :global(.accordion-details.expanded) :global(.jsonField) div textarea {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+  height: 10rem;
+}
+.requestAccordion :global(.accordion-details.expanded .textArea .containerTextArea),
+.responseAccordion :global(.accordion-details.expanded .textArea .containerTextArea) {
+  display: flex;
+}
+.requestAccordion :global(.accordion-details.expanded .textArea .containerTextArea .inputField),
+.responseAccordion :global(.accordion-details.expanded .textArea .containerTextArea .inputField) {
+  height: 100%;
+  padding: 1.25rem;
+}
+.requestAccordion .accordionContent,
+.responseAccordion .accordionContent {
+  max-width: 100%;
+  padding-left: 0.625rem;
+  padding-right: 0.625rem;
+  padding-top: 0.9375rem;
+}
+.requestAccordion .accordionContent ol,
+.responseAccordion .accordionContent ol {
+  padding-left: 1.7rem;
+}
+.requestAccordion .accordionContent ol li,
+.responseAccordion .accordionContent ol li {
+  max-width: 100%;
+  word-break: break-all;
+}
+.requestAccordion .requestAccordionSummary,
+.requestAccordion .responseAccordionSummary,
+.responseAccordion .requestAccordionSummary,
+.responseAccordion .responseAccordionSummary {
+  width: 100%;
   cursor: pointer;
+  display: flex;
+  justify-content: space-between;
+  font-weight: 700;
+  font-size: 1.125rem;
+  line-height: 1.5rem;
+  display: flex;
+  align-items: center;
+  margin-inline: 0.625rem 1.25rem;
+}
+.requestAccordion .responseAccordionSummary_title,
+.requestAccordion .requestAccordionSummary_title,
+.requestAccordion .responseAccordionSummary,
+.responseAccordion .responseAccordionSummary_title,
+.responseAccordion .requestAccordionSummary_title,
+.responseAccordion .responseAccordionSummary {
+  display: flex;
+  align-items: center;
+}
+.requestAccordion .responseAccordionSummary_title svg,
+.requestAccordion .requestAccordionSummary_title svg,
+.requestAccordion .responseAccordionSummary svg,
+.responseAccordion .responseAccordionSummary_title svg,
+.responseAccordion .requestAccordionSummary_title svg,
+.responseAccordion .responseAccordionSummary svg {
+  transition: rotate 0.2s ease-in-out;
+}
+.requestAccordion .responseAccordionSummary_title .expanded,
+.requestAccordion .requestAccordionSummary_title .expanded,
+.requestAccordion .responseAccordionSummary .expanded,
+.responseAccordion .responseAccordionSummary_title .expanded,
+.responseAccordion .requestAccordionSummary_title .expanded,
+.responseAccordion .responseAccordionSummary .expanded {
+  rotate: 180deg;
+}
+.requestAccordion :global(.accordion-details) :global(.textArea .inputField),
+.responseAccordion :global(.accordion-details) :global(.textArea .inputField) {
+  padding: 0;
+  border: none;
+}
+.requestAccordion :global(.accordion-header .iconContainer .dropdownIcon),
+.responseAccordion :global(.accordion-header .iconContainer .dropdownIcon) {
+  display: none !important;
+}
+.requestAccordion :global(.accordion-header),
+.responseAccordion :global(.accordion-header) {
+  cursor: default;
+}
+
+.responseAccordion .responseAccordionSummary {
+  display: flex;
+  align-items: center;
+}
+.responseAccordion .responseAccordionSummary :global(.multiSelectGroup .optionsList) {
+  width: 8rem !important;
+  min-width: 8rem !important;
+}
+.responseAccordion .responseAccordionSummary :global(.multiSelectGroup) {
+  width: 8rem;
+  margin-left: auto;
+}
+.responseAccordion .responseAccordionSummary :global(.multiSelectGroup) :global(.selectDisplay) {
+  height: 2.0625rem !important;
+  min-height: 2.0625rem !important;
+  padding: 0;
+  padding-left: 0.625rem;
+}
+.responseAccordion :global(.accordion-header) {
+  overflow: visible;
+  cursor: default;
+}
+.responseAccordion .statusCodeOptionContainer {
+  display: grid;
+  grid-template-columns: min-content min-content;
+  align-items: center;
+  gap: 0.625rem;
+}
+.responseAccordion .statusCodeOptionContainer .statusCodeOptionCircle {
+  width: 0.625rem;
+  aspect-ratio: 1/1;
+  border-radius: 100%;
 }.tooltip-custom-wrapper {
   display: flex;
 }
@@ -1642,15 +1642,6 @@ div.endBtnIcon {
   margin-right: 0.4075rem;
 }
 
-.tippy_box_color {
-  margin-left: 2rem;
-  background-color: #000 !important;
-  border: none;
-  height: 1.875rem;
-  border-radius: 0.75rem;
-  margin-top: -0.5rem;
-}
-
 :global(.tippy-arrow) {
   transform: translateX(12px) !important;
 }
@@ -1807,6 +1798,58 @@ div.endBtnIcon {
   opacity: 1 !important;
   backdrop-filter: blur(0.5rem);
   background-color: rgba(0, 0, 0, 0.281) !important;
+}
+:global .guide-tooltip.guide-tooltip.guide-tooltip.guide-tooltip {
+  background-color: #000;
+  border: none;
+  border-radius: 0.75rem;
+}
+:global .guide-tooltip.guide-tooltip.guide-tooltip.guide-tooltip.tippy-box .tippy-content.tippy-content {
+  border-radius: 0.75rem;
+  color: #fff;
+  background-color: #000;
+}
+:global .guide-tooltip.guide-tooltip.guide-tooltip.guide-tooltip .tippy-arrow.tippy-arrow.tippy-arrow.tippy-arrow {
+  color: #000;
+}
+:global .guide-tooltip.guide-tooltip.guide-tooltip.guide-tooltip .tippy-arrow.tippy-arrow.tippy-arrow.tippy-arrow::before {
+  color: #000;
+}.codebox {
+  border-radius: 0.25rem;
+  overflow: hidden;
+}
+.codebox_header {
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+  padding-left: 0.5rem;
+  height: 1.75rem;
+  border: 1px solid #bbbec5;
+  border-top-right-radius: 0.25rem;
+  border-top-left-radius: 0.25rem;
+}
+.codebox_header_themeToggle {
+  width: 0.75rem;
+  min-width: 0.75rem;
+  aspect-ratio: 1/1;
+  border: 1px solid transparent;
+  border-radius: 100%;
+  cursor: pointer;
+}
+.codebox_header_themeToggle_dark {
+  background-color: #455162;
+  border-color: #6b7280;
+}
+.codebox_header_themeToggle_light {
+  background-color: #edf1fb;
+  border-color: #6b7280;
+}
+.codebox_header_copyIcon {
+  cursor: pointer;
+}
+.codebox :global(.custom-code-line),
+.codebox :global(.custom-code-line span) {
+  font-family: "Cascadia Code", sans-serif;
 }.apiDocsAside {
   width: 22.5rem;
   padding: 3rem 1.5rem;
@@ -1893,42 +1936,6 @@ div.endBtnIcon {
 }
 .apiDocsAside :global(.multiSelectGroup .selectDisplay .displayValueContainer .iconsContainer) {
   padding-right: 0.75rem !important;
-}.codebox {
-  border-radius: 0.25rem;
-  overflow: hidden;
-}
-.codebox_header {
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-  padding-left: 0.5rem;
-  height: 1.75rem;
-  border: 1px solid #bbbec5;
-  border-top-right-radius: 0.25rem;
-  border-top-left-radius: 0.25rem;
-}
-.codebox_header_themeToggle {
-  width: 0.75rem;
-  min-width: 0.75rem;
-  aspect-ratio: 1/1;
-  border: 1px solid transparent;
-  border-radius: 100%;
-  cursor: pointer;
-}
-.codebox_header_themeToggle_dark {
-  background-color: #455162;
-  border-color: #6b7280;
-}
-.codebox_header_themeToggle_light {
-  background-color: #edf1fb;
-  border-color: #6b7280;
-}
-.codebox_header_copyIcon {
-  cursor: pointer;
-}
-.codebox :global(.custom-code-line),
-.codebox :global(.custom-code-line span) {
-  font-family: "Cascadia Code", sans-serif;
 }.api-details-page {
   padding: 2rem;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digi-frontend/dgate-api-documentation",
-  "version": "1.0.95",
+  "version": "1.0.96",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",
   "types": "dist/types/index.d.ts",

package/src/layout/docsComponents/DocsHeader/DocsHeader.module.scss

@@ -28,7 +28,7 @@
     line-height: 1.25rem;
 
     .btnContentWrapper {
-      .btnContent{
+      .btnContent {
         font-size: 0.918rem !important;
       }
     }
@@ -81,7 +81,7 @@
     height: 2.25rem;
 
     .btnContentWrapper {
-      .btnContent{
+      .btnContent {
         font-size: 0.918rem !important;
       }
     }
@@ -96,15 +96,6 @@
   }
 }
 
-.tippy_box_color {
-  margin-left: 2rem;
-  background-color: #000 !important;
-  border: none;
-  height: 1.875rem;
-  border-radius: 0.75rem;
-  margin-top: -0.5rem;
-}
-
 :global(.tippy-arrow) {
   transform: translateX(12px) !important;
 }
@@ -280,4 +271,27 @@
     backdrop-filter: blur(0.5rem);
     background-color: rgba(0, 0, 0, 0.281) !important;
   }
+
+  // Tooltip overrides
+  .guide-tooltip.guide-tooltip.guide-tooltip.guide-tooltip {
+    background-color: #000;
+    border: none;
+    border-radius: 0.75rem;
+
+    &.tippy-box {
+      .tippy-content.tippy-content {
+        border-radius: 0.75rem;
+        color: #fff;
+        background-color: #000;
+      }
+    }
+
+    .tippy-arrow.tippy-arrow.tippy-arrow.tippy-arrow {
+      color: #000;
+
+      &::before {
+        color: #000;
+      }
+    }
+  }
 }

package/src/layout/docsComponents/DocsHeader/DocsHeader.tsx

@@ -96,8 +96,9 @@ const DocsHeader = ({
           <div className={styles.nav_buttons}>
             <Tooltip
               placement="bottom"
+              offset={[10, 5]}
               delay={[0, 0]}
-              className={`guides-tooltip ${styles.tippy_box_color}`}
+              className="guide-tooltip"
               content={<div>Coming Soon</div>}
             >
               <Button variant="outlined" size="small" className="guide-btn" disabled={true}>

package/variables.txt

@@ -1 +1 @@
-export APP_VERSION=1.0.94
+export APP_VERSION=1.0.95