@digi-frontend/dgate-api-documentation 1.0.6 → 1.0.8

package/dist/src/components/table/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","sources":["../../../../src/components/table/table.tsx"],"sourcesContent":["import React, { useState } from 'react'\r\nimport './style.scss'\r\nimport { Button, Input, SelectGroup, Switch, TextArea } from 'digitinary-ui'\r\nimport Tooltip from '../Tooltip/Tooltip'\r\nimport SVGLoader from '../SVGLoader/SVGLoader'\r\nimport { AddRow, EditIcon, DeleteIcon } from '../../assets/icons'\r\nimport styles from '../MethodAccordion/MethodAccordion.module.scss'\r\nimport { useFormik } from 'formik'\r\nimport * as yup from 'yup'\r\nimport { capitalize } from '../../helpers/methodAccordion.helper'\r\n\r\nconst ParamterTable = ({\r\n  id,\r\n  headCells,\r\n  data,\r\n  isFormOpen,\r\n  setIsFormOpen,\r\n  saveNewRow,\r\n  readOnly,\r\n}) => {\r\n  const [text, setText] = useState('')\r\n  const [tooltipRef, setTooltipRef] = useState(null)\r\n  const { values, errors, setFieldValue, isValid, submitForm, resetForm } = useFormik({\r\n    initialValues: {\r\n      name: '',\r\n      in: 'Query',\r\n      schema: {\r\n        type: 'String',\r\n      },\r\n      required: true,\r\n      description: '',\r\n    },\r\n    validationSchema: yup.object().shape({\r\n      name: yup.string().required('Parameter name is required'),\r\n      in: yup.string().required('Paramter type is required'),\r\n      schema: yup.object().shape({\r\n        type: yup.string().required('Parameter schema type is required'),\r\n      }),\r\n      required: yup.boolean().optional(),\r\n      description: yup.string().optional(),\r\n    }),\r\n    onSubmit: (values) => {\r\n      saveNewRow(values)\r\n      setIsFormOpen(false)\r\n      setText('')\r\n      resetForm()\r\n    },\r\n  })\r\n  return (\r\n    <div className=\"tableSectionContainer\">\r\n      <div className=\"tableContainer\">\r\n        <table id={id || ''} className={`table borderRadiusTop borderRadiusBottom`}>\r\n          <thead className=\"tableHead\">\r\n            <tr>\r\n              {headCells?.map((headCell) => (\r\n                <th\r\n                  key={headCell.id}\r\n                  className={`tableHeadCell ${headCell.classes || ''}`}\r\n                  style={{ width: headCell.width, minWidth: headCell.minWidth }}\r\n                >\r\n                  <div\r\n                    className=\"headContainer\"\r\n                    data-id={`${\r\n                      typeof headCell.label === 'string'\r\n                        ? headCell.label.toUpperCase().replace(/[^a-zA-Z0-9]+/g, '_')\r\n                        : 'UNKNOWN_LABEL'\r\n                    }_COLUMN`}\r\n                  >\r\n                    {headCell.label}\r\n                  </div>\r\n                </th>\r\n              ))}\r\n            </tr>\r\n          </thead>\r\n          <tbody className=\"tableBody\" data-id=\"TABLE_BODY\">\r\n            {data?.map((row, rowIndex) => {\r\n              return (\r\n                <tr key={rowIndex} data-i={rowIndex} className={`row`}>\r\n                  {headCells?.map((headCell) => {\r\n                    const cellContent = row[headCell.id] !== '_' && (\r\n                      <div\r\n                        data-id=\"TEXT_DESCRIPTION\"\r\n                        className=\"tableData\"\r\n                        style={{\r\n                          width: headCell.width,\r\n                          minWidth: headCell.minWidth,\r\n                        }}\r\n                      >\r\n                        {row[headCell.id]}\r\n                      </div>\r\n                    )\r\n\r\n                    return (\r\n                      <td\r\n                        key={headCell.id}\r\n                        style={{\r\n                          width: headCell.width,\r\n                          minWidth: headCell.minWidth,\r\n                        }}\r\n                      >\r\n                        {cellContent}\r\n                      </td>\r\n                    )\r\n                  })}\r\n                </tr>\r\n              )\r\n            })}\r\n            {isFormOpen ? (\r\n              <tr key={''} data-i={''} className={`row`}>\r\n                <td key={'Parameter name'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <Input\r\n                      placeholder=\"paramter name\"\r\n                      size=\"large\"\r\n                      type=\"text\"\r\n                      //   errorMsg={!!errors.name && errors.name}\r\n                      onChange={(value) => {\r\n                        setFieldValue('name', value)\r\n                      }} // Pass the value directly\r\n                      value={values.name} // Bind value to the state\r\n                      disabled={readOnly}\r\n                    />\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'parameter in'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <SelectGroup\r\n                      disabled={readOnly}\r\n                      value={{\r\n                        label: capitalize(values.in),\r\n                        value: capitalize(values.in),\r\n                      }}\r\n                      onChange={(item) => setFieldValue('in', item?.value?.toLowerCase())} // Updates state on selection\r\n                      options={[\r\n                        {\r\n                          list: [\r\n                            { label: 'Query', value: 'query' },\r\n                            { label: 'Header', value: 'header' },\r\n                            { label: 'Path', value: 'path' },\r\n                            { label: 'Body', value: 'body' },\r\n                          ],\r\n                        },\r\n                      ]}\r\n                      errorMsg={!!errors.in && errors.in}\r\n                      isMultiple={false}\r\n                      withSearch={false}\r\n                      clearable={false}\r\n                    />{' '}\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'parameter schema type'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <SelectGroup\r\n                      disabled={readOnly}\r\n                      value={{\r\n                        label: capitalize(values.schema.type),\r\n                        value: capitalize(values.schema.type),\r\n                      }}\r\n                      errorMsg={!!errors.schema && errors.schema}\r\n                      onChange={(item) => setFieldValue('schema.type', item?.value?.toLowerCase())} // Updates state on selection\r\n                      options={[\r\n                        {\r\n                          list: [\r\n                            { label: 'String', value: 'string' },\r\n                            { label: 'Integer', value: 'integer' },\r\n                            { label: 'Boolean', value: 'boolean' },\r\n                            { label: 'Object', value: 'object' },\r\n                            { label: 'Array', value: 'array' },\r\n                            { label: 'Number', value: 'number' },\r\n                          ],\r\n                        },\r\n                      ]}\r\n                      isMultiple={false}\r\n                      withSearch={false}\r\n                    />{' '}\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'parameter required'}>\r\n                  <div data-id=\"is required\" className=\"tableData\">\r\n                    {\r\n                      readOnly ?\r\n                      <>{values.required ? 'True': 'False'}</>\r\n                      :\r\n                      <Switch\r\n                      checked={values.required}\r\n                      onClick={() => {\r\n                        if (readOnly) {\r\n                          return\r\n                        }\r\n                        setFieldValue('required', !values.required)\r\n                      }}\r\n                    />\r\n                    }\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'parameter schema desc'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <div className={styles.paramDescContainer}>\r\n                      <Tooltip\r\n                        arrowWithBorder\r\n                        placement=\"bottom-end\"\r\n                        type=\"function\"\r\n                        trigger=\"click\"\r\n                        delay={[0, 0]}\r\n                        onCreate={(instance) => setTooltipRef(instance)}\r\n                        content={\r\n                          <div className={styles.editDescTooltipContent}>\r\n                            <p className={styles.editDescTooltipContent_header}>Description</p>\r\n                            <TextArea\r\n                              value={text || values.description}\r\n                              onChange={(value) => {\r\n                                setText(value)\r\n                              }}\r\n                              disabled={readOnly}\r\n                              placeholder=\"Describe parameter...\"\r\n                            />\r\n                            {!readOnly && (\r\n                              <Button\r\n                                className={styles.editDescTooltipContent_btn}\r\n                                variant=\"outlined\"\r\n                                size=\"small\"\r\n                                onClick={() => {\r\n                                  setFieldValue('description', text)\r\n                                  tooltipRef?.hide()\r\n                                }}\r\n                              >\r\n                                Apply\r\n                              </Button>\r\n                            )}\r\n                          </div>\r\n                        }\r\n                      >\r\n                        <Button\r\n                          className={styles.editDescBtn}\r\n                          variant=\"link\"\r\n                          color=\"action\"\r\n                          endIcon={<SVGLoader src={EditIcon} width=\"1.5rem\" height=\"1.5rem\" />}\r\n                        >\r\n                          {readOnly ? 'View ' : 'Add '} Description\r\n                        </Button>\r\n                      </Tooltip>\r\n\r\n                      <div className={styles.paramDescContainer_separator}></div>\r\n                      {!readOnly && (\r\n                        <Button\r\n                          className={styles.deleteParamBtn}\r\n                          variant=\"link\"\r\n                          color=\"error\"\r\n                          endIcon={\r\n                            <SVGLoader src={DeleteIcon} width=\"1.125rem\" height=\"1.125rem\" />\r\n                          }\r\n                          onClick={() => {\r\n                            resetForm()\r\n                            setText('')\r\n                            setIsFormOpen(false)\r\n                          }} // Correctly delete the new row\r\n                        />\r\n                      )}\r\n\r\n                      {!readOnly && (\r\n                        <Button\r\n                          className={styles.deleteParamBtn}\r\n                          variant=\"link\"\r\n                          color=\"success\"\r\n                          disabled={!isValid}\r\n                          endIcon={<SVGLoader src={AddRow} width=\"0.125rem\" height=\"0.125rem\" />}\r\n                          onClick={() => {\r\n                            setText('')\r\n                            submitForm()\r\n                          }} // Save the new row when clicked\r\n                        />\r\n                      )}\r\n                    </div>{' '}\r\n                  </div>\r\n                </td>\r\n              </tr>\r\n            ) : (\r\n              <>\r\n                {!readOnly && (\r\n                  <tr key={'addNew'} data-i={'addNew'} className={`row`}>\r\n                    <td colSpan={5}>\r\n                      <Button\r\n                        variant=\"link\"\r\n                        color=\"primary\"\r\n                        onClick={() => {\r\n                          setIsFormOpen((prev) => !prev)\r\n                        }}\r\n                      >\r\n                        + Add Parameter\r\n                      </Button>\r\n                    </td>\r\n                  </tr>\r\n                )}\r\n              </>\r\n            )}\r\n          </tbody>\r\n        </table>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default ParamterTable\r\n"],"names":["ParamterTable","id","headCells","data","isFormOpen","setIsFormOpen","saveNewRow","readOnly","text","setText","useState","tooltipRef","setTooltipRef","values","errors","setFieldValue","isValid","submitForm","resetForm","useFormik","initialValues","name","in","schema","type","required","description","validationSchema","yup.object","shape","yup.string","yup.boolean","optional","onSubmit","_jsx","className","_jsxs","jsxs","children","map","headCell","classes","style","width","minWidth","jsx","label","toUpperCase","replace","row","rowIndex","cellContent","Input","placeholder","size","onChange","value","disabled","SelectGroup","capitalize","item","_a","toLowerCase","options","list","errorMsg","isMultiple","withSearch","clearable","_Fragment","Fragment","Switch","checked","onClick","styles","paramDescContainer","Tooltip","arrowWithBorder","placement","trigger","delay","onCreate","instance","content","editDescTooltipContent","editDescTooltipContent_header","TextArea","Button","editDescTooltipContent_btn","variant","hide","editDescBtn","color","endIcon","SVGLoader","src","EditIcon","height","paramDescContainer_separator","deleteParamBtn","DeleteIcon","AddRow","colSpan","prev"],"mappings":"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"}
+{"version":3,"file":"table.js","sources":["../../../../src/components/table/table.tsx"],"sourcesContent":["import React, { useState } from 'react'\r\nimport './style.scss'\r\nimport { Button, Input, SelectGroupV2, Switch, TextArea } from 'digitinary-ui'\r\nimport Tooltip from '../Tooltip/Tooltip'\r\nimport SVGLoader from '../SVGLoader/SVGLoader'\r\nimport { AddRow, EditIcon, DeleteIcon } from '../../assets/icons'\r\nimport styles from '../MethodAccordion/MethodAccordion.module.scss'\r\nimport { useFormik } from 'formik'\r\nimport * as yup from 'yup'\r\nimport { capitalize } from '../../helpers/methodAccordion.helper'\r\n\r\nconst ParamterTable = ({\r\n  id,\r\n  headCells,\r\n  data,\r\n  isFormOpen,\r\n  setIsFormOpen,\r\n  saveNewRow,\r\n  readOnly,\r\n}) => {\r\n  const [text, setText] = useState('')\r\n  const [tooltipRef, setTooltipRef] = useState(null)\r\n  const { values, errors, setFieldValue, isValid, submitForm, resetForm } = useFormik({\r\n    initialValues: {\r\n      name: '',\r\n      in: 'Query',\r\n      schema: {\r\n        type: 'String',\r\n      },\r\n      required: true,\r\n      description: '',\r\n    },\r\n    validationSchema: yup.object().shape({\r\n      name: yup.string().required('Parameter name is required'),\r\n      in: yup.string().required('Paramter type is required'),\r\n      schema: yup.object().shape({\r\n        type: yup.string().required('Parameter schema type is required'),\r\n      }),\r\n      required: yup.boolean().optional(),\r\n      description: yup.string().optional(),\r\n    }),\r\n    onSubmit: (values) => {\r\n      saveNewRow(values)\r\n      setIsFormOpen(false)\r\n      setText('')\r\n      resetForm()\r\n    },\r\n  })\r\n  return (\r\n    <div className=\"tableSectionContainer\">\r\n      <div className=\"tableContainer\">\r\n        <table id={id || ''} className={`table borderRadiusTop borderRadiusBottom`}>\r\n          <thead className=\"tableHead\">\r\n            <tr>\r\n              {headCells?.map((headCell) => (\r\n                <th\r\n                  key={headCell.id}\r\n                  className={`tableHeadCell ${headCell.classes || ''}`}\r\n                  style={{ width: headCell.width, minWidth: headCell.minWidth }}\r\n                >\r\n                  <div\r\n                    className=\"headContainer\"\r\n                    data-id={`${\r\n                      typeof headCell.label === 'string'\r\n                        ? headCell.label.toUpperCase().replace(/[^a-zA-Z0-9]+/g, '_')\r\n                        : 'UNKNOWN_LABEL'\r\n                    }_COLUMN`}\r\n                  >\r\n                    {headCell.label}\r\n                  </div>\r\n                </th>\r\n              ))}\r\n            </tr>\r\n          </thead>\r\n          <tbody className=\"tableBody\" data-id=\"TABLE_BODY\">\r\n            {data?.map((row, rowIndex) => {\r\n              return (\r\n                <tr key={rowIndex} data-i={rowIndex} className={`row`}>\r\n                  {headCells?.map((headCell) => {\r\n                    const cellContent = row[headCell.id] !== '_' && (\r\n                      <div\r\n                        data-id=\"TEXT_DESCRIPTION\"\r\n                        className=\"tableData\"\r\n                        style={{\r\n                          width: headCell.width,\r\n                          minWidth: headCell.minWidth,\r\n                        }}\r\n                      >\r\n                        {row[headCell.id]}\r\n                      </div>\r\n                    )\r\n\r\n                    return (\r\n                      <td\r\n                        key={headCell.id}\r\n                        style={{\r\n                          width: headCell.width,\r\n                          minWidth: headCell.minWidth,\r\n                        }}\r\n                      >\r\n                        {cellContent}\r\n                      </td>\r\n                    )\r\n                  })}\r\n                </tr>\r\n              )\r\n            })}\r\n            {isFormOpen ? (\r\n              <tr key={''} data-i={''} className={`row`}>\r\n                <td key={'Parameter name'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <Input\r\n                      placeholder=\"paramter name\"\r\n                      size=\"large\"\r\n                      type=\"text\"\r\n                      //   errorMsg={!!errors.name && errors.name}\r\n                      onChange={(value) => {\r\n                        setFieldValue('name', value)\r\n                      }} // Pass the value directly\r\n                      value={values.name} // Bind value to the state\r\n                      disabled={readOnly}\r\n                    />\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'parameter in'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <SelectGroupV2\r\n                      disabled={readOnly}\r\n                      value={{\r\n                        label: capitalize(values.in),\r\n                        value: capitalize(values.in),\r\n                      }}\r\n                      onChange={(item) => setFieldValue('in', item?.value?.toLowerCase())} // Updates state on selection\r\n                      options={[\r\n                        {\r\n                          list: [\r\n                            { label: 'Query', value: 'query' },\r\n                            { label: 'Header', value: 'header' },\r\n                            { label: 'Path', value: 'path' },\r\n                            { label: 'Body', value: 'body' },\r\n                          ],\r\n                        },\r\n                      ]}\r\n                      errorMsg={!!errors.in && errors.in}\r\n                      isMultiple={false}\r\n                      withSearch={false}\r\n                      clearable={false}\r\n                    />{' '}\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'parameter schema type'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <SelectGroupV2\r\n                      disabled={readOnly}\r\n                      value={{\r\n                        label: capitalize(values.schema.type),\r\n                        value: capitalize(values.schema.type),\r\n                      }}\r\n                      errorMsg={!!errors.schema && errors.schema}\r\n                      onChange={(item) => setFieldValue('schema.type', item?.value?.toLowerCase())} // Updates state on selection\r\n                      options={[\r\n                        {\r\n                          list: [\r\n                            { label: 'String', value: 'string' },\r\n                            { label: 'Integer', value: 'integer' },\r\n                            { label: 'Boolean', value: 'boolean' },\r\n                            { label: 'Object', value: 'object' },\r\n                            { label: 'Array', value: 'array' },\r\n                            { label: 'Number', value: 'number' },\r\n                          ],\r\n                        },\r\n                      ]}\r\n                      isMultiple={false}\r\n                      withSearch={false}\r\n                    />{' '}\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'parameter required'}>\r\n                  <div data-id=\"is required\" className=\"tableData\">\r\n                    {\r\n                      readOnly ?\r\n                      <>{values.required ? 'True': 'False'}</>\r\n                      :\r\n                      <Switch\r\n                      checked={values.required}\r\n                      onClick={() => {\r\n                        if (readOnly) {\r\n                          return\r\n                        }\r\n                        setFieldValue('required', !values.required)\r\n                      }}\r\n                    />\r\n                    }\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'parameter schema desc'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <div className={styles.paramDescContainer}>\r\n                      <Tooltip\r\n                        arrowWithBorder\r\n                        placement=\"bottom-end\"\r\n                        type=\"function\"\r\n                        trigger=\"click\"\r\n                        delay={[0, 0]}\r\n                        onCreate={(instance) => setTooltipRef(instance)}\r\n                        content={\r\n                          <div className={styles.editDescTooltipContent}>\r\n                            <p className={styles.editDescTooltipContent_header}>Description</p>\r\n                            <TextArea\r\n                              value={text || values.description}\r\n                              onChange={(value) => {\r\n                                setText(value)\r\n                              }}\r\n                              disabled={readOnly}\r\n                              placeholder=\"Describe parameter...\"\r\n                            />\r\n                            {!readOnly && (\r\n                              <Button\r\n                                className={styles.editDescTooltipContent_btn}\r\n                                variant=\"outlined\"\r\n                                size=\"small\"\r\n                                onClick={() => {\r\n                                  setFieldValue('description', text)\r\n                                  tooltipRef?.hide()\r\n                                }}\r\n                              >\r\n                                Apply\r\n                              </Button>\r\n                            )}\r\n                          </div>\r\n                        }\r\n                      >\r\n                        <Button\r\n                          className={styles.editDescBtn}\r\n                          variant=\"link\"\r\n                          color=\"action\"\r\n                          endIcon={<SVGLoader src={EditIcon} width=\"1.5rem\" height=\"1.5rem\" />}\r\n                        >\r\n                          {readOnly ? 'View ' : 'Add '} Description\r\n                        </Button>\r\n                      </Tooltip>\r\n\r\n                      <div className={styles.paramDescContainer_separator}></div>\r\n                      {!readOnly && (\r\n                        <Button\r\n                          className={styles.deleteParamBtn}\r\n                          variant=\"link\"\r\n                          color=\"error\"\r\n                          endIcon={\r\n                            <SVGLoader src={DeleteIcon} width=\"1.125rem\" height=\"1.125rem\" />\r\n                          }\r\n                          onClick={() => {\r\n                            resetForm()\r\n                            setText('')\r\n                            setIsFormOpen(false)\r\n                          }} // Correctly delete the new row\r\n                        />\r\n                      )}\r\n\r\n                      {!readOnly && (\r\n                        <Button\r\n                          className={styles.deleteParamBtn}\r\n                          variant=\"link\"\r\n                          color=\"success\"\r\n                          disabled={!isValid}\r\n                          endIcon={<SVGLoader src={AddRow} width=\"0.125rem\" height=\"0.125rem\" />}\r\n                          onClick={() => {\r\n                            setText('')\r\n                            submitForm()\r\n                          }} // Save the new row when clicked\r\n                        />\r\n                      )}\r\n                    </div>{' '}\r\n                  </div>\r\n                </td>\r\n              </tr>\r\n            ) : (\r\n              <>\r\n                {!readOnly && (\r\n                  <tr key={'addNew'} data-i={'addNew'} className={`row`}>\r\n                    <td colSpan={5}>\r\n                      <Button\r\n                        variant=\"link\"\r\n                        color=\"primary\"\r\n                        onClick={() => {\r\n                          setIsFormOpen((prev) => !prev)\r\n                        }}\r\n                      >\r\n                        + Add Parameter\r\n                      </Button>\r\n                    </td>\r\n                  </tr>\r\n                )}\r\n              </>\r\n            )}\r\n          </tbody>\r\n        </table>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default ParamterTable\r\n"],"names":["ParamterTable","id","headCells","data","isFormOpen","setIsFormOpen","saveNewRow","readOnly","text","setText","useState","tooltipRef","setTooltipRef","values","errors","setFieldValue","isValid","submitForm","resetForm","useFormik","initialValues","name","in","schema","type","required","description","validationSchema","yup.object","shape","yup.string","yup.boolean","optional","onSubmit","_jsx","className","_jsxs","jsxs","children","map","headCell","classes","style","width","minWidth","jsx","label","toUpperCase","replace","row","rowIndex","cellContent","Input","placeholder","size","onChange","value","disabled","SelectGroupV2","capitalize","item","_a","toLowerCase","options","list","errorMsg","isMultiple","withSearch","clearable","_Fragment","Fragment","Switch","checked","onClick","styles","paramDescContainer","Tooltip","arrowWithBorder","placement","trigger","delay","onCreate","instance","content","editDescTooltipContent","editDescTooltipContent_header","TextArea","Button","editDescTooltipContent_btn","variant","hide","editDescBtn","color","endIcon","SVGLoader","src","EditIcon","height","paramDescContainer_separator","deleteParamBtn","DeleteIcon","AddRow","colSpan","prev"],"mappings":"ipBAWA,MAAMA,EAAgB,EACpBC,KACAC,YACAC,OACAC,aACAC,gBACAC,aACAC,eAEA,MAAOC,EAAMC,GAAWC,EAAS,KAC1BC,EAAYC,GAAiBF,EAAS,OACvCG,OAAEA,EAAMC,OAAEA,EAAMC,cAAEA,EAAaC,QAAEA,EAAOC,WAAEA,EAAUC,UAAEA,GAAcC,EAAU,CAClFC,cAAe,CACbC,KAAM,GACNC,GAAI,QACJC,OAAQ,CACNC,KAAM,UAERC,UAAU,EACVC,YAAa,IAEfC,iBAAkBC,IAAaC,MAAM,CACnCR,KAAMS,IAAaL,SAAS,8BAC5BH,GAAIQ,IAAaL,SAAS,6BAC1BF,OAAQK,IAAaC,MAAM,CACzBL,KAAMM,IAAaL,SAAS,uCAE9BA,SAAUM,IAAcC,WACxBN,YAAaI,IAAaE,aAE5BC,SAAWpB,IACTP,EAAWO,GACXR,GAAc,GACdI,EAAQ,IACRS,GAAW,IAGf,OACEgB,EAAAA,IAAK,MAAA,CAAAC,UAAU,iCACbD,MAAK,MAAA,CAAAC,UAAU,0BACbC,EAAOC,KAAA,QAAA,CAAApC,GAAIA,GAAM,GAAIkC,UAAW,qDAC9BD,EAAAA,IAAO,QAAA,CAAAC,UAAU,qBACfD,EAAAA,IACG,KAAA,CAAAI,SAAApC,eAAAA,EAAWqC,KAAKC,GACfN,EAAAA,UAEEC,UAAW,iBAAiBK,EAASC,SAAW,KAChDC,MAAO,CAAEC,MAAOH,EAASG,MAAOC,SAAUJ,EAASI,mBAEnDV,EACEW,IAAA,MAAA,CAAAV,UAAU,0BACD,GACmB,iBAAnBK,EAASM,MACZN,EAASM,MAAMC,cAAcC,QAAQ,iBAAkB,KACvD,yBAGLV,SAAAE,EAASM,SAZPN,EAASvC,UAkBtBmC,EAAAA,KAAA,QAAA,CAAOD,UAAU,YAAoB,UAAA,aAClCG,SAAA,CAAAnC,aAAI,EAAJA,EAAMoC,KAAI,CAACU,EAAKC,IAEbhB,EAA2BW,IAAA,KAAA,CAAA,SAAAK,EAAUf,UAAW,MAC7CG,SAAApC,aAAS,EAATA,EAAWqC,KAAKC,IACf,MAAMW,EAAmC,MAArBF,EAAIT,EAASvC,KAC/BiC,EAAAA,IAAA,MAAA,CAAA,UACU,mBACRC,UAAU,YACVO,MAAO,CACLC,MAAOH,EAASG,MAChBC,SAAUJ,EAASI,UAGpBN,SAAAW,EAAIT,EAASvC,MAIlB,OACEiC,EAEEW,IAAA,KAAA,CAAAH,MAAO,CACLC,MAAOH,EAASG,MAChBC,SAAUJ,EAASI,UACpBN,SAEAa,GANIX,EAASvC,GAQjB,KAzBIiD,KA8BZ9C,EACCgC,EAAAA,KAAqB,KAAA,CAAA,SAAA,GAAID,UAAW,MAAKG,SAAA,CACvCJ,EAAAA,mBACEA,EAAaW,IAAA,MAAA,CAAA,UAAA,mBAAmBV,UAAU,YAAWG,SACnDJ,EAAAA,IAACkB,EAAAA,OACCC,YAAY,gBACZC,KAAK,QACL9B,KAAK,OAEL+B,SAAWC,IACTzC,EAAc,OAAQyC,EAAM,EAE9BA,MAAO3C,EAAOQ,KACdoC,SAAUlD,OAXP,kBAgBT2B,MACE,KAAA,CAAAI,SAAAF,OAAA,MAAA,CAAA,UAAa,mBAAmBD,UAAU,YACxCG,SAAA,CAAAJ,EAAAA,IAACwB,EAAAA,cAAa,CACZD,SAAUlD,EACViD,MAAO,CACLV,MAAOa,EAAW9C,EAAOS,IACzBkC,MAAOG,EAAW9C,EAAOS,KAE3BiC,SAAWK,IAAS,IAAAC,EAAA,OAAA9C,EAAc,KAAmB,QAAb8C,EAAAD,aAAA,EAAAA,EAAMJ,aAAO,IAAAK,OAAA,EAAAA,EAAAC,cAAc,EACnEC,QAAS,CACP,CACEC,KAAM,CACJ,CAAElB,MAAO,QAASU,MAAO,SACzB,CAAEV,MAAO,SAAUU,MAAO,UAC1B,CAAEV,MAAO,OAAQU,MAAO,QACxB,CAAEV,MAAO,OAAQU,MAAO,WAI9BS,WAAYnD,EAAOQ,IAAMR,EAAOQ,GAChC4C,YAAY,EACZC,YAAY,EACZC,WAAW,IACV,QAvBE,gBA2BTlC,EAAAW,IAAA,KAAA,CAAAP,SACEF,EAAaC,KAAA,MAAA,CAAA,UAAA,mBAAmBF,UAAU,YAAWG,SAAA,CACnDJ,MAACwB,EAAaA,cAAA,CACZD,SAAUlD,EACViD,MAAO,CACLV,MAAOa,EAAW9C,EAAOU,OAAOC,MAChCgC,MAAOG,EAAW9C,EAAOU,OAAOC,OAElCyC,WAAYnD,EAAOS,QAAUT,EAAOS,OACpCgC,SAAWK,IAAS,IAAAC,EAAA,OAAA9C,EAAc,cAA0B,QAAX8C,EAAAD,eAAAA,EAAMJ,aAAK,IAAAK,OAAA,EAAAA,EAAEC,cAAc,EAC5EC,QAAS,CACP,CACEC,KAAM,CACJ,CAAElB,MAAO,SAAUU,MAAO,UAC1B,CAAEV,MAAO,UAAWU,MAAO,WAC3B,CAAEV,MAAO,UAAWU,MAAO,WAC3B,CAAEV,MAAO,SAAUU,MAAO,UAC1B,CAAEV,MAAO,QAASU,MAAO,SACzB,CAAEV,MAAO,SAAUU,MAAO,aAIhCU,YAAY,EACZC,YAAY,IACX,QAxBE,yBA4BTjC,EAAAA,IACE,KAAA,CAAAI,SAAAJ,EAAAW,IAAA,MAAA,CAAA,UAAa,cAAcV,UAAU,YAAWG,SAE5C/B,EACA2B,EAAGW,IAAAwB,EAAAC,SAAA,CAAAhC,SAAAzB,EAAOY,SAAW,OAAQ,UAE7BS,EAACW,IAAA0B,EAAMA,OACP,CAAAC,QAAS3D,EAAOY,SAChBgD,QAAS,KACHlE,GAGJQ,EAAc,YAAaF,EAAOY,SAAS,OAZ1C,sBAmBTS,EAAAA,mBACEE,EAAAA,KAAa,MAAA,CAAA,UAAA,mBAAmBD,UAAU,YACxCG,SAAA,CAAAF,EAAAC,KAAA,MAAA,CAAKF,UAAWuC,EAAOC,mBAAkBrC,SAAA,CACvCJ,MAAC0C,EAAO,CACNC,iBACA,EAAAC,UAAU,aACVtD,KAAK,WACLuD,QAAQ,QACRC,MAAO,CAAC,EAAG,GACXC,SAAWC,GAAatE,EAAcsE,GACtCC,QACE/C,EAAAA,YAAKD,UAAWuC,EAAOU,iCACrBlD,EAAAA,IAAG,IAAA,CAAAC,UAAWuC,EAAOW,8BAA8C/C,SAAA,gBACnEJ,EAAAA,IAACoD,EAAAA,SAAQ,CACP9B,MAAOhD,GAAQK,EAAOa,YACtB6B,SAAWC,IACT/C,EAAQ+C,EAAM,EAEhBC,SAAUlD,EACV8C,YAAY,2BAEZ9C,GACA2B,MAACqD,EAAAA,OAAM,CACLpD,UAAWuC,EAAOc,2BAClBC,QAAQ,WACRnC,KAAK,QACLmB,QAAS,KACP1D,EAAc,cAAeP,GAC7BG,SAAAA,EAAY+E,MAAM,EACnBpD,SAAA,aAKDA,SAGRF,EAAAA,KAACmD,EAAAA,OAAM,CACLpD,UAAWuC,EAAOiB,YAClBF,QAAQ,OACRG,MAAM,SACNC,QAAS3D,EAAAW,IAACiD,EAAU,CAAAC,IAAKC,EAAUrD,MAAM,SAASsD,OAAO,WAExD3D,SAAA,CAAA/B,EAAW,QAAU,OACf,oBAGX2B,EAAKW,IAAA,MAAA,CAAAV,UAAWuC,EAAOwB,gCACrB3F,GACA2B,MAACqD,EAAMA,OAAA,CACLpD,UAAWuC,EAAOyB,eAClBV,QAAQ,OACRG,MAAM,QACNC,QACE3D,MAAC4D,EAAS,CAACC,IAAKK,EAAYzD,MAAM,WAAWsD,OAAO,aAEtDxB,QAAS,KACPvD,IACAT,EAAQ,IACRJ,GAAc,EAAM,KAKxBE,GACA2B,EAAAA,IAACqD,EAAAA,OACC,CAAApD,UAAWuC,EAAOyB,eAClBV,QAAQ,OACRG,MAAM,UACNnC,UAAWzC,EACX6E,QAAS3D,EAAAA,IAAC4D,EAAS,CAACC,IAAKM,EAAQ1D,MAAM,WAAWsD,OAAO,aACzDxB,QAAS,KACPhE,EAAQ,IACRQ,GAAY,OAIb,QA7EF,2BA3FF,IA6KTiB,EAAAA,0BACI3B,GACA2B,EAAAA,IAA2B,KAAA,CAAA,SAAA,SAAUC,UAAW,MAC9CG,SAAAJ,MAAA,KAAA,CAAIoE,QAAS,EACXhE,SAAAJ,EAAAW,IAAC0C,EAAMA,OAAA,CACLE,QAAQ,OACRG,MAAM,UACNnB,QAAS,KACPpE,GAAekG,IAAUA,GAAK,EAIzBjE,SAAA,uBAVJ,qBAoBxB"}

package/dist/src/components/table/tags-table.js

@@ -0,0 +1,2 @@
+import{j as e}from"../../../_virtual/jsx-runtime.js";import{useState as i}from"react";import t from"../InfoForm/InfoForm.module.scss.js";import{d as s}from"../../../_virtual/index.js";import a from"../Tooltip/Tooltip.js";import n from"../SVGLoader/SVGLoader.js";import l from"../../assets/icons/DeleteIcon.svg.js";import o from"../../assets/icons/EditIcon.svg.js";import r from"../../assets/icons/AddRow.svg.js";import d from"../MethodAccordion/MethodAccordion.module.scss.js";import{useFormik as c}from"../../../node_modules/formik/dist/formik.esm.js";import{object as m,string as h}from"../../../node_modules/yup/index.esm.js";const p=({id:p,headCells:x,data:u,isFormOpen:j,setIsFormOpen:v,saveNewRow:D,readOnly:N})=>{var b,C,g,T,f,w;const[k,B]=i(""),[_,y]=i(""),[E,I]=i(""),[A,L]=i(null),[O,S]=i(null),{values:W,errors:F,setFieldValue:R,isValid:V,submitForm:P,resetForm:z}=c({initialValues:{name:"",description:"",externalDocs:{url:"",description:""}},validationSchema:m().shape({name:h().required("Tag name is required"),description:h().optional(),externalDocs:m().optional()}),onSubmit:e=>{B(""),y(""),I(""),z(),v(!1),D(e)}});return e.jsx("div",{className:"tableSectionContainer",children:e.jsx("div",{className:"tableContainer",children:e.jsxs("table",{id:p||"",className:"table borderRadiusTop borderRadiusBottom",children:[e.jsx("thead",{className:"tableHead",children:e.jsx("tr",{children:null==x?void 0:x.map((i=>e.jsx("th",{className:`tableHeadCell ${i.classes||""}`,style:{width:i.width,minWidth:i.minWidth},children:e.jsx("div",{className:"headContainer","data-id":`${"string"==typeof i.label?i.label.toUpperCase().replace(/[^a-zA-Z0-9]+/g,"_"):"UNKNOWN_LABEL"}_COLUMN`,children:i.label})},i.id)))})}),e.jsxs("tbody",{className:"tableBody","data-id":"TABLE_BODY",children:[null==u?void 0:u.map(((i,t)=>e.jsx("tr",{"data-i":t,className:"row",children:null==x?void 0:x.map((t=>{const s="_"!==i[t.id]&&e.jsx("div",{"data-id":"TEXT_DESCRIPTION",className:"tableData",style:{width:t.width,minWidth:t.minWidth},children:i[t.id]});return e.jsx("td",{style:{width:t.width,minWidth:t.minWidth},children:s},t.id)}))},t))),j?e.jsxs("tr",{"data-i":"",className:"row",children:[e.jsx("td",{children:e.jsx("div",{"data-id":"TEXT_DESCRIPTION",className:"tableData",children:e.jsx(s.Input,{placeholder:"Tag name",size:"large",type:"text",onChange:e=>{R("name",e)},value:W.name,disabled:N})})},"tag name"),e.jsx("td",{children:e.jsxs("div",{"data-id":"TEXT_DESCRIPTION",className:"tableData",children:[e.jsx("div",{className:d.paramDescContainer,children:e.jsx(a,{arrowWithBorder:!0,placement:"bottom-end",type:"function",trigger:"click",delay:[0,0],onCreate:e=>L(e),content:e.jsxs("div",{className:t.editDescTooltipContent,children:[e.jsx("p",{className:t.editDescTooltipContent_header,children:"Description"}),e.jsx(s.TextArea,{value:k||W.description,onChange:e=>{B(e)},disabled:N,placeholder:"Describe Tag..."}),!N&&e.jsx(s.Button,{className:t.editDescTooltipContent_btn,variant:"outlined",size:"small",onClick:()=>{R("description",k),null==A||A.hide()},children:"Apply"})]}),children:e.jsxs(s.Button,{className:t.editDescBtn,style:{paddingLeft:0},variant:"link",color:"action",endIcon:e.jsx(n,{src:o,width:"1.5rem",height:"1.5rem"}),children:[N?"View ":"Add "," Description"]})})})," "]})},"tagDescRequired"),e.jsx("td",{children:e.jsx("div",{className:"tableData",children:e.jsxs("div",{className:t.paramDescContainer,children:[e.jsx(a,{arrowWithBorder:!0,placement:"bottom-end",type:"function",trigger:"click",delay:[0,0],onCreate:e=>S(e),content:e.jsxs("div",{className:t.editDescTooltipContent,children:[e.jsx("p",{className:t.editDescTooltipContent_header,children:"External Docs Description"}),e.jsx(s.TextArea,{placeholder:"Describe External Doc...",value:_||W.externalDocs.description,disabled:N,onChange:e=>y(e)}),e.jsx("p",{className:t.editDescTooltipContent_header,children:"External Docs Link"}),e.jsx(s.TextArea,{placeholder:"External Docs Link...",value:E||W.externalDocs.url,disabled:N,onChange:e=>I(e)}),!N&&e.jsx(s.Button,{className:t.editDescTooltipContent_btn,variant:"outlined",size:"small",onClick:()=>{R("externalDocs",{description:_,url:E}),y(""),I(""),null==O||O.hide()},children:"Apply"})]}),children:N?e.jsxs(s.Button,{className:t.editDescBtn,variant:"link",color:"action",onClick:()=>{var e;const i=document.createElement("a");i.href=null===(e=W.externalDocs)||void 0===e?void 0:e.url,i.click()},children:[(null===(b=null==W?void 0:W.externalDocs)||void 0===b?void 0:b.description)?null===(g=null===(C=null==W?void 0:W.externalDocs)||void 0===C?void 0:C.description)||void 0===g?void 0:g.substring(0,12):"-",(null===(T=null==W?void 0:W.externalDocs)||void 0===T?void 0:T.description)&&(null===(w=null===(f=null==W?void 0:W.externalDocs)||void 0===f?void 0:f.description)||void 0===w?void 0:w.length)>12?"...":""]}):e.jsxs(s.Button,{className:t.editDescBtn,variant:"link",color:"action",endIcon:e.jsx(n,{src:o,width:"1.5rem",height:"1.5rem"}),children:[N?"View ":"Add "," External Docs Link"]})}),e.jsx("div",{className:t.paramDescContainer_separator}),!N&&e.jsx(s.Button,{className:t.deleteParamBtn,variant:"link",color:"error",endIcon:e.jsx(n,{src:l,width:"1.125rem",height:"1.125rem"}),onClick:()=>{z(),B(""),v(!1)}}),!N&&e.jsx(s.Button,{className:t.deleteParamBtn,variant:"link",color:"success",disabled:!V,endIcon:e.jsx(n,{src:r,width:"0.125rem",height:"0.125rem"}),onClick:()=>{B(""),P()}})]})})},"tagExternal")]},""):e.jsx(e.Fragment,{children:!N&&e.jsx("tr",{"data-i":"addNew",className:"row",children:e.jsx("td",{colSpan:5,children:e.jsx(s.Button,{variant:"link",color:"primary",onClick:()=>{v((e=>!e))},children:"+ Add Tag"})})},"addNew")})]})]})})})};export{p as default};
+//# sourceMappingURL=tags-table.js.map

package/dist/src/components/table/tags-table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tags-table.js","sources":["../../../../src/components/table/tags-table.tsx"],"sourcesContent":["import { useState } from 'react'\r\nimport './style.scss'\r\nimport _styles from '../InfoForm/InfoForm.module.scss'\r\nimport { Button, Input, TextArea } from 'digitinary-ui'\r\nimport Tooltip from '../Tooltip/Tooltip'\r\nimport SVGLoader from '../SVGLoader/SVGLoader'\r\nimport { AddRow, EditIcon, DeleteIcon } from '../../assets/icons'\r\nimport styles from '../MethodAccordion/MethodAccordion.module.scss'\r\nimport { useFormik } from 'formik'\r\nimport * as yup from 'yup'\r\n\r\nconst TagsTable = ({ id, headCells, data, isFormOpen, setIsFormOpen, saveNewRow, readOnly }) => {\r\n  const [text, setText] = useState('')\r\n  const [externalDesc, setExternalDesc] = useState('')\r\n  const [externalUrl, setExternalUrl] = useState('')\r\n  const [tooltipRef, setTooltipRef] = useState(null)\r\n  const [externalTooltipRefs, setExternalTooltipRefs] = useState(null)\r\n  const { values, errors, setFieldValue, isValid, submitForm, resetForm } = useFormik({\r\n    initialValues: {\r\n      name: '',\r\n      description: '',\r\n      externalDocs: {\r\n        url: '',\r\n        description: '',\r\n      },\r\n    },\r\n    validationSchema: yup.object().shape({\r\n      name: yup.string().required('Tag name is required'),\r\n      description: yup.string().optional(),\r\n      externalDocs: yup.object().optional(),\r\n    }),\r\n    onSubmit: (values) => {\r\n      setText('')\r\n      setExternalDesc('')\r\n      setExternalUrl('')\r\n      resetForm()\r\n      setIsFormOpen(false)\r\n      saveNewRow(values)\r\n    },\r\n  })\r\n  return (\r\n    <div className=\"tableSectionContainer\">\r\n      <div className=\"tableContainer\">\r\n        <table id={id || ''} className={`table borderRadiusTop borderRadiusBottom`}>\r\n          <thead className=\"tableHead\">\r\n            <tr>\r\n              {headCells?.map((headCell) => (\r\n                <th\r\n                  key={headCell.id}\r\n                  className={`tableHeadCell ${headCell.classes || ''}`}\r\n                  style={{ width: headCell.width, minWidth: headCell.minWidth }}\r\n                >\r\n                  <div\r\n                    className=\"headContainer\"\r\n                    data-id={`${\r\n                      typeof headCell.label === 'string'\r\n                        ? headCell.label.toUpperCase().replace(/[^a-zA-Z0-9]+/g, '_')\r\n                        : 'UNKNOWN_LABEL'\r\n                    }_COLUMN`}\r\n                  >\r\n                    {headCell.label}\r\n                  </div>\r\n                </th>\r\n              ))}\r\n            </tr>\r\n          </thead>\r\n          <tbody className=\"tableBody\" data-id=\"TABLE_BODY\">\r\n            {data?.map((row, rowIndex) => {\r\n              return (\r\n                <tr key={rowIndex} data-i={rowIndex} className={`row`}>\r\n                  {headCells?.map((headCell) => {\r\n                    const cellContent = row[headCell.id] !== '_' && (\r\n                      <div\r\n                        data-id=\"TEXT_DESCRIPTION\"\r\n                        className=\"tableData\"\r\n                        style={{\r\n                          width: headCell.width,\r\n                          minWidth: headCell.minWidth,\r\n                        }}\r\n                      >\r\n                        {row[headCell.id]}\r\n                      </div>\r\n                    )\r\n\r\n                    return (\r\n                      <td\r\n                        key={headCell.id}\r\n                        style={{\r\n                          width: headCell.width,\r\n                          minWidth: headCell.minWidth,\r\n                        }}\r\n                      >\r\n                        {cellContent}\r\n                      </td>\r\n                    )\r\n                  })}\r\n                </tr>\r\n              )\r\n            })}\r\n            {isFormOpen ? (\r\n              <tr key={''} data-i={''} className={`row`}>\r\n                <td key={'tag name'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <Input\r\n                      placeholder=\"Tag name\"\r\n                      size=\"large\"\r\n                      type=\"text\"\r\n                      onChange={(value) => {\r\n                        setFieldValue('name', value)\r\n                      }} // Pass the value directly\r\n                      value={values.name} // Bind value to the state\r\n                      disabled={readOnly}\r\n                    />\r\n                  </div>\r\n                </td>\r\n\r\n                <td key={'tagDescRequired'}>\r\n                  <div data-id=\"TEXT_DESCRIPTION\" className=\"tableData\">\r\n                    <div className={styles.paramDescContainer}>\r\n                      <Tooltip\r\n                        arrowWithBorder\r\n                        placement=\"bottom-end\"\r\n                        type=\"function\"\r\n                        trigger=\"click\"\r\n                        delay={[0, 0]}\r\n                        onCreate={(instance) => setTooltipRef(instance)}\r\n                        content={\r\n                          <div className={_styles.editDescTooltipContent}>\r\n                            <p className={_styles.editDescTooltipContent_header}>Description</p>\r\n                            <TextArea\r\n                              value={text || values.description}\r\n                              onChange={(value) => {\r\n                                setText(value)\r\n                              }}\r\n                              disabled={readOnly}\r\n                              placeholder=\"Describe Tag...\"\r\n                            />\r\n                            {!readOnly && (\r\n                              <Button\r\n                                className={_styles.editDescTooltipContent_btn}\r\n                                variant=\"outlined\"\r\n                                size=\"small\"\r\n                                onClick={() => {\r\n                                  setFieldValue('description', text)\r\n                                  tooltipRef?.hide()\r\n                                }}\r\n                              >\r\n                                Apply\r\n                              </Button>\r\n                            )}\r\n                          </div>\r\n                        }\r\n                      >\r\n                        <Button\r\n                          className={_styles.editDescBtn}\r\n                          style={{ paddingLeft: 0 }}\r\n                          variant=\"link\"\r\n                          color=\"action\"\r\n                          endIcon={<SVGLoader src={EditIcon} width=\"1.5rem\" height=\"1.5rem\" />}\r\n                        >\r\n                          {readOnly ? 'View ' : 'Add '} Description\r\n                        </Button>\r\n                      </Tooltip>\r\n                    </div>{' '}\r\n                  </div>\r\n                </td>\r\n                <td key={'tagExternal'}>\r\n                  <div className=\"tableData\">\r\n                    <div className={_styles.paramDescContainer}>\r\n                      <Tooltip\r\n                        arrowWithBorder\r\n                        placement=\"bottom-end\"\r\n                        type=\"function\"\r\n                        trigger=\"click\"\r\n                        delay={[0, 0]}\r\n                        onCreate={(instance) => setExternalTooltipRefs(instance)}\r\n                        content={\r\n                          <div className={_styles.editDescTooltipContent}>\r\n                            <p className={_styles.editDescTooltipContent_header}>\r\n                              External Docs Description\r\n                            </p>\r\n                            <TextArea\r\n                              placeholder=\"Describe External Doc...\"\r\n                              value={externalDesc || values.externalDocs.description}\r\n                              disabled={readOnly}\r\n                              onChange={(value) => setExternalDesc(value)}\r\n                            />\r\n                            <p className={_styles.editDescTooltipContent_header}>\r\n                              External Docs Link\r\n                            </p>\r\n                            <TextArea\r\n                              placeholder=\"External Docs Link...\"\r\n                              value={externalUrl || values.externalDocs.url}\r\n                              disabled={readOnly}\r\n                              onChange={(value) => setExternalUrl(value)}\r\n                            />\r\n                            {!readOnly && (\r\n                              <Button\r\n                                className={_styles.editDescTooltipContent_btn}\r\n                                variant=\"outlined\"\r\n                                size=\"small\"\r\n                                onClick={() => {\r\n                                  setFieldValue(`externalDocs`, {\r\n                                    description: externalDesc,\r\n                                    url: externalUrl,\r\n                                  })\r\n                                  setExternalDesc('')\r\n                                  setExternalUrl('')\r\n                                  externalTooltipRefs?.hide()\r\n                                }}\r\n                              >\r\n                                Apply\r\n                              </Button>\r\n                            )}\r\n                          </div>\r\n                        }\r\n                      >\r\n                        {readOnly ? (\r\n                          <Button\r\n                            className={_styles.editDescBtn}\r\n                            variant=\"link\"\r\n                            color=\"action\"\r\n                            onClick={() => {\r\n                              const a = document.createElement('a')\r\n                              a.href = values.externalDocs?.url\r\n                              a.click()\r\n                            }}\r\n                          >\r\n                            {values?.externalDocs?.description\r\n                              ? values?.externalDocs?.description?.substring(0, 12)\r\n                              : '-'}\r\n                            {values?.externalDocs?.description &&\r\n                            values?.externalDocs?.description?.length > 12\r\n                              ? '...'\r\n                              : ''}\r\n                          </Button>\r\n                        ) : (\r\n                          <Button\r\n                            className={_styles.editDescBtn}\r\n                            variant=\"link\"\r\n                            color=\"action\"\r\n                            endIcon={<SVGLoader src={EditIcon} width=\"1.5rem\" height=\"1.5rem\" />}\r\n                          >\r\n                            {readOnly ? 'View ' : 'Add '} External Docs Link\r\n                          </Button>\r\n                        )}\r\n                      </Tooltip>\r\n                      <div className={_styles.paramDescContainer_separator}></div>\r\n                      {!readOnly && (\r\n                        <Button\r\n                          className={_styles.deleteParamBtn}\r\n                          variant=\"link\"\r\n                          color=\"error\"\r\n                          endIcon={\r\n                            <SVGLoader src={DeleteIcon} width=\"1.125rem\" height=\"1.125rem\" />\r\n                          }\r\n                          onClick={() => {\r\n                            resetForm()\r\n                            setText('')\r\n                            setIsFormOpen(false)\r\n                          }} // Correctly delete the new row\r\n                        />\r\n                      )}\r\n\r\n                      {!readOnly && (\r\n                        <Button\r\n                          className={_styles.deleteParamBtn}\r\n                          variant=\"link\"\r\n                          color=\"success\"\r\n                          disabled={!isValid}\r\n                          endIcon={<SVGLoader src={AddRow} width=\"0.125rem\" height=\"0.125rem\" />}\r\n                          onClick={() => {\r\n                            setText('')\r\n                            submitForm()\r\n                          }} // Save the new row when clicked\r\n                        />\r\n                      )}\r\n                    </div>\r\n                  </div>\r\n                </td>\r\n              </tr>\r\n            ) : (\r\n              <>\r\n                {!readOnly && (\r\n                  <tr key={'addNew'} data-i={'addNew'} className={`row`}>\r\n                    <td colSpan={5}>\r\n                      <Button\r\n                        variant=\"link\"\r\n                        color=\"primary\"\r\n                        onClick={() => {\r\n                          setIsFormOpen((prev) => !prev)\r\n                        }}\r\n                      >\r\n                        + Add Tag\r\n                      </Button>\r\n                    </td>\r\n                  </tr>\r\n                )}\r\n              </>\r\n            )}\r\n          </tbody>\r\n        </table>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default TagsTable\r\n"],"names":["TagsTable","id","headCells","data","isFormOpen","setIsFormOpen","saveNewRow","readOnly","text","setText","useState","externalDesc","setExternalDesc","externalUrl","setExternalUrl","tooltipRef","setTooltipRef","externalTooltipRefs","setExternalTooltipRefs","values","errors","setFieldValue","isValid","submitForm","resetForm","useFormik","initialValues","name","description","externalDocs","url","validationSchema","yup.object","shape","yup.string","required","optional","onSubmit","_jsx","className","_jsxs","jsxs","children","map","headCell","classes","style","width","minWidth","jsx","label","toUpperCase","replace","row","rowIndex","cellContent","Input","placeholder","size","type","onChange","value","disabled","styles","paramDescContainer","Tooltip","arrowWithBorder","placement","trigger","delay","onCreate","instance","content","_styles","editDescTooltipContent","editDescTooltipContent_header","TextArea","Button","editDescTooltipContent_btn","variant","onClick","hide","editDescBtn","paddingLeft","color","endIcon","SVGLoader","src","EditIcon","height","a","document","createElement","href","_a","click","_c","_b","substring","_d","_f","_e","length","paramDescContainer_separator","deleteParamBtn","DeleteIcon","AddRow","_Fragment","Fragment","colSpan","prev"],"mappings":"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"}

package/dist/src/constants/index.js

@@ -1,2 +1,2 @@
-const e={get:{label:"Get",color:"#3A6CD1",order:1},post:{label:"Post",color:"#3AAA35",order:2},put:{label:"Put",color:"#FAAD14",order:3},delete:{label:"Delete",color:"#DA3F3F",order:4},patch:{label:"Patch",color:"#58E2C2",order:5},options:{label:"Options",color:"#495D97",order:6},trace:{label:"Trace",color:"#FFA28F",order:7},head:{label:"Head",color:"#9461C9",order:8}},r=[{id:"paramName",label:"Parameter Name",sortable:!1,required:!0,classes:"requiredParam"},{id:"paramType",label:"In",sortable:!1,classes:"requiredParam"},{id:"schemaType",label:"Schema-Type",sortable:!1,classes:"requiredParam"},{id:"required",label:"Required",sortable:!1,classes:"requiredParam"},{id:"description",label:"Description",sortable:!1}],a=[100,101,102,103,200,201,202,203,204,205,206,207,208,226,300,301,302,303,304,305,306,307,308,400,401,402,403,404,405,406,407,408,409,410,411,412,413,414,415,416,417,418,421,422,423,424,425,426,428,429,431,451,500,501,502,503,504,505,506,507,508,510,511];export{a as httpStatusCodes,e as methodColorMapping,r as paramsTableHeaders};
+const e={get:{label:"Get",color:"#3A6CD1",order:1},post:{label:"Post",color:"#3AAA35",order:2},put:{label:"Put",color:"#FAAD14",order:3},delete:{label:"Delete",color:"#DA3F3F",order:4},patch:{label:"Patch",color:"#58E2C2",order:5},options:{label:"Options",color:"#495D97",order:6},trace:{label:"Trace",color:"#FFA28F",order:7},head:{label:"Head",color:"#9461C9",order:8}},r=[{id:"tagName",label:"Tag Name",sortable:!1,classes:"requiredParam"},{id:"description",label:"Description",sortable:!1,classes:"requiredParam"},{id:"externalDocs",label:"External Docs",sortable:!1,classes:"requiredParam"}],a=[{id:"paramName",label:"Parameter Name",sortable:!1,required:!0,classes:"requiredParam"},{id:"paramType",label:"In",sortable:!1,classes:"requiredParam"},{id:"schemaType",label:"Schema-Type",sortable:!1,classes:"requiredParam"},{id:"required",label:"Required",sortable:!1,classes:"requiredParam"},{id:"description",label:"Description",sortable:!1}],l=[100,101,102,103,200,201,202,203,204,205,206,207,208,226,300,301,302,303,304,305,306,307,308,400,401,402,403,404,405,406,407,408,409,410,411,412,413,414,415,416,417,418,421,422,423,424,425,426,428,429,431,451,500,501,502,503,504,505,506,507,508,510,511];export{l as httpStatusCodes,e as methodColorMapping,a as paramsTableHeaders,r as tagsTableHeaders};
 //# sourceMappingURL=index.js.map

package/dist/src/constants/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/constants/index.ts"],"sourcesContent":["export const methodColorMapping = {\r\n  get: {\r\n    label: 'Get',\r\n    color: '#3A6CD1',\r\n    order: 1,\r\n  },\r\n  post: {\r\n    label: 'Post',\r\n    color: '#3AAA35',\r\n    order: 2,\r\n  },\r\n  put: {\r\n    label: 'Put',\r\n    color: '#FAAD14',\r\n    order: 3,\r\n  },\r\n  delete: {\r\n    label: 'Delete',\r\n    color: '#DA3F3F',\r\n    order: 4,\r\n  },\r\n  patch: {\r\n    label: 'Patch',\r\n    color: '#58E2C2',\r\n    order: 5,\r\n  },\r\n  options: {\r\n    label: 'Options',\r\n    color: '#495D97',\r\n    order: 6,\r\n  },\r\n  trace: {\r\n    label: 'Trace',\r\n    color: '#FFA28F',\r\n    order: 7,\r\n  },\r\n  head: {\r\n    label: 'Head',\r\n    color: '#9461C9',\r\n    order: 8,\r\n  },\r\n}\r\n\r\nexport const paramsTableHeaders = [\r\n  {\r\n    id: 'paramName',\r\n    label: 'Parameter Name',\r\n    sortable: false,\r\n    required: true,\r\n    classes: 'requiredParam',\r\n  },\r\n  { id: 'paramType', label: 'In', sortable: false, classes: 'requiredParam' },\r\n  { id: 'schemaType', label: 'Schema-Type', sortable: false, classes: 'requiredParam' },\r\n  { id: 'required', label: 'Required', sortable: false, classes: 'requiredParam' },\r\n  { id: 'description', label: 'Description', sortable: false },\r\n]\r\n\r\nexport const httpStatusCodes = [\r\n  // 1xx: Informational responses\r\n  100, 101, 102, 103,\r\n\r\n  // 2xx: Success\r\n  200, 201, 202, 203, 204, 205, 206, 207, 208, 226,\r\n\r\n  // 3xx: Redirection\r\n  300, 301, 302, 303, 304, 305, 306, 307, 308,\r\n\r\n  // 4xx: Client errors\r\n  400, 401, 402, 403, 404, 405, 406, 407, 408, 409, 410, 411, 412, 413, 414, 415, 416, 417, 418,\r\n  421, 422, 423, 424, 425, 426, 428, 429, 431, 451,\r\n\r\n  // 5xx: Server errors\r\n  500, 501, 502, 503, 504, 505, 506, 507, 508, 510, 511,\r\n]\r\n"],"names":["methodColorMapping","get","label","color","order","post","put","delete","patch","options","trace","head","paramsTableHeaders","id","sortable","required","classes","httpStatusCodes"],"mappings":"AAAa,MAAAA,EAAqB,CAChCC,IAAK,CACHC,MAAO,MACPC,MAAO,UACPC,MAAO,GAETC,KAAM,CACJH,MAAO,OACPC,MAAO,UACPC,MAAO,GAETE,IAAK,CACHJ,MAAO,MACPC,MAAO,UACPC,MAAO,GAETG,OAAQ,CACNL,MAAO,SACPC,MAAO,UACPC,MAAO,GAETI,MAAO,CACLN,MAAO,QACPC,MAAO,UACPC,MAAO,GAETK,QAAS,CACPP,MAAO,UACPC,MAAO,UACPC,MAAO,GAETM,MAAO,CACLR,MAAO,QACPC,MAAO,UACPC,MAAO,GAETO,KAAM,CACJT,MAAO,OACPC,MAAO,UACPC,MAAO,IAIEQ,EAAqB,CAChC,CACEC,GAAI,YACJX,MAAO,iBACPY,UAAU,EACVC,UAAU,EACVC,QAAS,iBAEX,CAAEH,GAAI,YAAaX,MAAO,KAAMY,UAAU,EAAOE,QAAS,iBAC1D,CAAEH,GAAI,aAAcX,MAAO,cAAeY,UAAU,EAAOE,QAAS,iBACpE,CAAEH,GAAI,WAAYX,MAAO,WAAYY,UAAU,EAAOE,QAAS,iBAC/D,CAAEH,GAAI,cAAeX,MAAO,cAAeY,UAAU,IAG1CG,EAAkB,CAE7B,IAAK,IAAK,IAAK,IAGf,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAG7C,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAGxC,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAC1F,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAG7C,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK"}
+{"version":3,"file":"index.js","sources":["../../../src/constants/index.ts"],"sourcesContent":["export const methodColorMapping = {\r\n  get: {\r\n    label: 'Get',\r\n    color: '#3A6CD1',\r\n    order: 1,\r\n  },\r\n  post: {\r\n    label: 'Post',\r\n    color: '#3AAA35',\r\n    order: 2,\r\n  },\r\n  put: {\r\n    label: 'Put',\r\n    color: '#FAAD14',\r\n    order: 3,\r\n  },\r\n  delete: {\r\n    label: 'Delete',\r\n    color: '#DA3F3F',\r\n    order: 4,\r\n  },\r\n  patch: {\r\n    label: 'Patch',\r\n    color: '#58E2C2',\r\n    order: 5,\r\n  },\r\n  options: {\r\n    label: 'Options',\r\n    color: '#495D97',\r\n    order: 6,\r\n  },\r\n  trace: {\r\n    label: 'Trace',\r\n    color: '#FFA28F',\r\n    order: 7,\r\n  },\r\n  head: {\r\n    label: 'Head',\r\n    color: '#9461C9',\r\n    order: 8,\r\n  },\r\n}\r\n\r\nexport const tagsTableHeaders = [\r\n  {\r\n    id: 'tagName',\r\n    label: 'Tag Name',\r\n    sortable: false,\r\n    classes:'requiredParam'\r\n  },\r\n  {\r\n    id: 'description',\r\n    label: 'Description',\r\n    sortable: false,\r\n    classes:'requiredParam'\r\n  },\r\n  {\r\n    id: 'externalDocs',\r\n    label: 'External Docs',\r\n    sortable: false,\r\n    classes:'requiredParam'\r\n  }\r\n]\r\n\r\nexport const paramsTableHeaders = [\r\n  {\r\n    id: 'paramName',\r\n    label: 'Parameter Name',\r\n    sortable: false,\r\n    required: true,\r\n    classes: 'requiredParam',\r\n  },\r\n  { id: 'paramType', label: 'In', sortable: false, classes: 'requiredParam' },\r\n  { id: 'schemaType', label: 'Schema-Type', sortable: false, classes: 'requiredParam' },\r\n  { id: 'required', label: 'Required', sortable: false, classes: 'requiredParam' },\r\n  { id: 'description', label: 'Description', sortable: false },\r\n]\r\n\r\nexport const httpStatusCodes = [\r\n  // 1xx: Informational responses\r\n  100, 101, 102, 103,\r\n\r\n  // 2xx: Success\r\n  200, 201, 202, 203, 204, 205, 206, 207, 208, 226,\r\n\r\n  // 3xx: Redirection\r\n  300, 301, 302, 303, 304, 305, 306, 307, 308,\r\n\r\n  // 4xx: Client errors\r\n  400, 401, 402, 403, 404, 405, 406, 407, 408, 409, 410, 411, 412, 413, 414, 415, 416, 417, 418,\r\n  421, 422, 423, 424, 425, 426, 428, 429, 431, 451,\r\n\r\n  // 5xx: Server errors\r\n  500, 501, 502, 503, 504, 505, 506, 507, 508, 510, 511,\r\n]\r\n"],"names":["methodColorMapping","get","label","color","order","post","put","delete","patch","options","trace","head","tagsTableHeaders","id","sortable","classes","paramsTableHeaders","required","httpStatusCodes"],"mappings":"AAAa,MAAAA,EAAqB,CAChCC,IAAK,CACHC,MAAO,MACPC,MAAO,UACPC,MAAO,GAETC,KAAM,CACJH,MAAO,OACPC,MAAO,UACPC,MAAO,GAETE,IAAK,CACHJ,MAAO,MACPC,MAAO,UACPC,MAAO,GAETG,OAAQ,CACNL,MAAO,SACPC,MAAO,UACPC,MAAO,GAETI,MAAO,CACLN,MAAO,QACPC,MAAO,UACPC,MAAO,GAETK,QAAS,CACPP,MAAO,UACPC,MAAO,UACPC,MAAO,GAETM,MAAO,CACLR,MAAO,QACPC,MAAO,UACPC,MAAO,GAETO,KAAM,CACJT,MAAO,OACPC,MAAO,UACPC,MAAO,IAIEQ,EAAmB,CAC9B,CACEC,GAAI,UACJX,MAAO,WACPY,UAAU,EACVC,QAAQ,iBAEV,CACEF,GAAI,cACJX,MAAO,cACPY,UAAU,EACVC,QAAQ,iBAEV,CACEF,GAAI,eACJX,MAAO,gBACPY,UAAU,EACVC,QAAQ,kBAICC,EAAqB,CAChC,CACEH,GAAI,YACJX,MAAO,iBACPY,UAAU,EACVG,UAAU,EACVF,QAAS,iBAEX,CAAEF,GAAI,YAAaX,MAAO,KAAMY,UAAU,EAAOC,QAAS,iBAC1D,CAAEF,GAAI,aAAcX,MAAO,cAAeY,UAAU,EAAOC,QAAS,iBACpE,CAAEF,GAAI,WAAYX,MAAO,WAAYY,UAAU,EAAOC,QAAS,iBAC/D,CAAEF,GAAI,cAAeX,MAAO,cAAeY,UAAU,IAG1CI,EAAkB,CAE7B,IAAK,IAAK,IAAK,IAGf,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAG7C,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAGxC,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAC1F,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAG7C,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK,IAAK"}

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

@@ -1 +1 @@
-{"version":3,"file":"layout.js","sources":["../../../src/layout/layout.tsx"],"sourcesContent":["import { JSX } from 'react'\r\nimport { Alert, Button } from 'digitinary-ui'\r\nimport MethodsAccordion from '../components/MethodAccordion/MethodAccordion'\r\nimport styles from './layout.module.css'\r\nimport InfoForm from '../components/InfoForm/InfoForm'\r\nimport SectionHead from '../components/SectionHead/SectionHead'\r\nimport { transformOpenApiObject, transformOpenApiObjectToOrigin } from '../helpers/layout.helper'\r\nimport { OpenAPIFile } from '../types/openApi'\r\nimport LivePreview from '../components/LivePreview/LivePreview'\r\nimport { FormikProvider, useFormik } from 'formik'\r\nimport { schemaValidation } from '../validator/form.scheme'\r\nimport { TransformedOpenApi } from '@entities/transformedOpenApi'\r\nimport { methodColorMapping } from '../constants/index'\r\n\r\ninterface ILayoutProps {\r\n  openApiJson?: OpenAPIFile\r\n}\r\n\r\nconst Layout = ({ openApiJson, handleSave }: ILayoutProps): JSX.Element => {\r\n  const clonedOpenApiJson = structuredClone(openApiJson)\r\n  const transformedOpenApi = transformOpenApiObject(clonedOpenApiJson)\r\n  const formik = useFormik<TransformedOpenApi>({\r\n    initialValues: structuredClone(transformedOpenApi),\r\n    validationSchema: schemaValidation,\r\n    validateOnMount: true,\r\n    onSubmit: (values, { validateForm }) => {\r\n      // Handle save logic\r\n      const originalOpenApiForm = transformOpenApiObjectToOrigin(values)\r\n      handleSave(originalOpenApiForm)\r\n      validateForm(values)\r\n    },\r\n  })\r\n\r\n  return (\r\n    <div className={styles.docsLayout}>\r\n      <Alert className={styles.apiDocAlert} color=\"info\">\r\n        Changes are saved and published for API information and each endpoint individually as you\r\n        update.\r\n      </Alert>\r\n      <div className={styles.layoutContainer}>\r\n        <div className={`${styles.editorSide} ${styles.docSide}`}>\r\n          <SectionHead\r\n            className={styles.editorSectionHead}\r\n            text={\r\n              <div className={styles.editorSectionHead_content}>\r\n                API Information\r\n                <Button\r\n                  className={styles.methodForm_submitBtn}\r\n                  size=\"medium\"\r\n                  fullWidth={false}\r\n                  type=\"submit\"\r\n                  variant=\"contained\"\r\n                  color=\"primary\"\r\n                  onClick={formik.submitForm}\r\n                >\r\n                  Save\r\n                </Button>\r\n              </div>\r\n            }\r\n          />\r\n          <FormikProvider value={formik}>\r\n            <InfoForm />\r\n          </FormikProvider>\r\n          <SectionHead className={styles.editorSectionHead} text=\"API Methods\" />\r\n          <FormikProvider value={formik}>\r\n            {formik.values.paths.map((path, pathIndex) => (\r\n              <>\r\n                {path.methods\r\n                  .sort(\r\n                    (method) =>\r\n                      methodColorMapping[method.type].order + methodColorMapping[method.type].order\r\n                  )\r\n                  .map((method, methodIndex) => (\r\n                    <MethodsAccordion\r\n                      method={method}\r\n                      path={path.path}\r\n                      setFieldValue={(key, value) => {\r\n                        const h = `paths[${pathIndex}].methods[${methodIndex}].${key}`\r\n                        formik.setFieldValue(h, value)\r\n                      }}\r\n                    />\r\n                  ))}\r\n              </>\r\n            ))}\r\n          </FormikProvider>\r\n        </div>\r\n        <div className={`${styles.livePreviewSide} ${styles.docSide}`}>\r\n          {transformedOpenApi && (\r\n            <FormikProvider value={formik}>\r\n              <LivePreview transformedData={transformedOpenApi} />\r\n            </FormikProvider>\r\n          )}\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default Layout\r\n"],"names":["Layout","openApiJson","handleSave","clonedOpenApiJson","structuredClone","transformedOpenApi","transformOpenApiObject","formik","useFormik","initialValues","validationSchema","schemaValidation","validateOnMount","onSubmit","values","validateForm","originalOpenApiForm","transformOpenApiObjectToOrigin","_jsxs","jsxs","className","styles","docsLayout","children","_jsx","jsx","Alert","apiDocAlert","color","layoutContainer","editorSide","docSide","SectionHead","editorSectionHead","text","editorSectionHead_content","Button","methodForm_submitBtn","size","fullWidth","type","variant","onClick","submitForm","FormikProvider","value","InfoForm","paths","map","path","pathIndex","_Fragment","methods","sort","method","methodColorMapping","order","methodIndex","MethodsAccordion","setFieldValue","key","h","livePreviewSide","LivePreview","transformedData"],"mappings":"sqBAkBM,MAAAA,EAAS,EAAGC,cAAaC,iBAC7B,MAAMC,EAAoBC,gBAAgBH,GACpCI,EAAqBC,EAAuBH,GAC5CI,EAASC,EAA8B,CAC3CC,cAAeL,gBAAgBC,GAC/BK,iBAAkBC,EAClBC,iBAAiB,EACjBC,SAAU,CAACC,GAAUC,mBAEnB,MAAMC,EAAsBC,EAA+BH,GAC3DZ,EAAWc,GACXD,EAAaD,EAAO,IAIxB,OACEI,EAAAC,KAAA,MAAA,CAAKC,UAAWC,EAAOC,WACrBC,SAAA,CAAAC,EAAAC,IAACC,EAAKA,MAAC,CAAAN,UAAWC,EAAOM,YAAaC,MAAM,OAAML,SAAA,sGAIlDL,EAAAC,KAAA,MAAA,CAAKC,UAAWC,EAAOQ,0BACrBX,EAAKC,KAAA,MAAA,CAAAC,UAAW,GAAGC,EAAOS,cAAcT,EAAOU,UAASR,SAAA,CACtDC,EAAAA,IAACQ,EAAW,CACVZ,UAAWC,EAAOY,kBAClBC,KACEhB,EAAKC,KAAA,MAAA,CAAAC,UAAWC,EAAOc,0BAAyBZ,SAAA,CAAA,kBAE9CC,MAACY,EAAAA,QACChB,UAAWC,EAAOgB,qBAClBC,KAAK,SACLC,WAAW,EACXC,KAAK,SACLC,QAAQ,YACRb,MAAM,UACNc,QAASnC,EAAOoC,WAGTpB,SAAA,cAIfC,EAAAA,IAACoB,GAAeC,MAAOtC,EAAMgB,SAC3BC,MAACsB,EAAQ,MAEXtB,MAACQ,EAAW,CAACZ,UAAWC,EAAOY,kBAAmBC,KAAK,gBACvDV,MAACoB,EAAc,CAACC,MAAOtC,EACpBgB,SAAAhB,EAAOO,OAAOiC,MAAMC,KAAI,CAACC,EAAMC,IAC9B1B,EAAAA,IACG2B,EAAAA,SAAA,CAAA5B,SAAA0B,EAAKG,QACHC,MACEC,GACCC,EAAmBD,EAAOd,MAAMgB,MAAQD,EAAmBD,EAAOd,MAAMgB,QAE3ER,KAAI,CAACM,EAAQG,IACZjC,EAAAA,IAACkC,EAAgB,CACfJ,OAAQA,EACRL,KAAMA,EAAKA,KACXU,cAAe,CAACC,EAAKf,KACnB,MAAMgB,EAAI,SAASX,cAAsBO,MAAgBG,IACzDrD,EAAOoD,cAAcE,EAAGhB,EAAM,eAQ9CrB,EAAAC,IAAA,MAAA,CAAKL,UAAW,GAAGC,EAAOyC,mBAAmBzC,EAAOU,UAASR,SAC1DlB,GACCmB,MAACoB,EAAc,CAACC,MAAOtC,WACrBiB,EAAAA,IAACuC,GAAYC,gBAAiB3D,aAMzC"}
+{"version":3,"file":"layout.js","sources":["../../../src/layout/layout.tsx"],"sourcesContent":["import { JSX } from 'react'\r\nimport { Alert, Button } from 'digitinary-ui'\r\nimport MethodsAccordion from '../components/MethodAccordion/MethodAccordion'\r\nimport styles from './layout.module.css'\r\nimport InfoForm from '../components/InfoForm/InfoForm'\r\nimport SectionHead from '../components/SectionHead/SectionHead'\r\nimport { transformOpenApiObject, transformOpenApiObjectToOrigin } from '../helpers/layout.helper'\r\nimport { OpenAPIFile } from '../types/openApi'\r\nimport LivePreview from '../components/LivePreview/LivePreview'\r\nimport { FormikProvider, useFormik } from 'formik'\r\nimport { schemaValidation } from '../validator/form.scheme'\r\nimport { TransformedOpenApi } from '@entities/transformedOpenApi'\r\nimport { methodColorMapping } from '../constants/index'\r\n\r\ninterface ILayoutProps {\r\n  openApiJson?: OpenAPIFile\r\n  handleSave?: (values: unknown) => unknown\r\n}\r\n\r\nconst Layout = ({ openApiJson, handleSave }: ILayoutProps): JSX.Element => {\r\n  const clonedOpenApiJson = structuredClone(openApiJson)\r\n  const transformedOpenApi = transformOpenApiObject(clonedOpenApiJson)\r\n  const formik = useFormik<TransformedOpenApi>({\r\n    initialValues: structuredClone(transformedOpenApi),\r\n    validationSchema: schemaValidation,\r\n    validateOnMount: true,\r\n    onSubmit: (values, { validateForm }) => {\r\n      // Handle save logic\r\n      const originalOpenApiForm = transformOpenApiObjectToOrigin(values)\r\n      handleSave(originalOpenApiForm)\r\n      validateForm(values)\r\n    },\r\n  })\r\n\r\n  return (\r\n    <div className={styles.docsLayout}>\r\n      <Alert className={styles.apiDocAlert} color=\"info\">\r\n        Changes are saved and published for API information and each endpoint individually as you\r\n        update.\r\n      </Alert>\r\n      <div className={styles.layoutContainer}>\r\n        <div className={`${styles.editorSide} ${styles.docSide}`}>\r\n          <SectionHead\r\n            className={styles.editorSectionHead}\r\n            text={\r\n              <div className={styles.editorSectionHead_content}>\r\n                API Information\r\n                <Button\r\n                  className={styles.methodForm_submitBtn}\r\n                  size=\"medium\"\r\n                  fullWidth={false}\r\n                  type=\"submit\"\r\n                  variant=\"contained\"\r\n                  color=\"primary\"\r\n                  onClick={formik.submitForm}\r\n                >\r\n                  Save\r\n                </Button>\r\n              </div>\r\n            }\r\n          />\r\n          <FormikProvider value={formik}>\r\n            <InfoForm />\r\n          </FormikProvider>\r\n          <SectionHead className={styles.editorSectionHead} text=\"API Methods\" />\r\n          <FormikProvider value={formik}>\r\n            {formik.values.paths.map((path, pathIndex) => (\r\n              <>\r\n                {path.methods\r\n                  .sort(\r\n                    (method) =>\r\n                      methodColorMapping[method.type].order + methodColorMapping[method.type].order\r\n                  )\r\n                  .map((method, methodIndex) => (\r\n                    <MethodsAccordion\r\n                      method={method}\r\n                      path={path.path}\r\n                      setFieldValue={(key, value) => {\r\n                        const h = `paths[${pathIndex}].methods[${methodIndex}].${key}`\r\n                        formik.setFieldValue(h, value)\r\n                      }}\r\n                    />\r\n                  ))}\r\n              </>\r\n            ))}\r\n          </FormikProvider>\r\n        </div>\r\n        <div className={`${styles.livePreviewSide} ${styles.docSide}`}>\r\n          {transformedOpenApi && (\r\n            <FormikProvider value={formik}>\r\n              <LivePreview transformedData={transformedOpenApi} />\r\n            </FormikProvider>\r\n          )}\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default Layout\r\n"],"names":["Layout","openApiJson","handleSave","clonedOpenApiJson","structuredClone","transformedOpenApi","transformOpenApiObject","formik","useFormik","initialValues","validationSchema","schemaValidation","validateOnMount","onSubmit","values","validateForm","originalOpenApiForm","transformOpenApiObjectToOrigin","_jsxs","jsxs","className","styles","docsLayout","children","_jsx","jsx","Alert","apiDocAlert","color","layoutContainer","editorSide","docSide","SectionHead","editorSectionHead","text","editorSectionHead_content","Button","methodForm_submitBtn","size","fullWidth","type","variant","onClick","submitForm","FormikProvider","value","InfoForm","paths","map","path","pathIndex","_Fragment","methods","sort","method","methodColorMapping","order","methodIndex","MethodsAccordion","setFieldValue","key","h","livePreviewSide","LivePreview","transformedData"],"mappings":"sqBAmBM,MAAAA,EAAS,EAAGC,cAAaC,iBAC7B,MAAMC,EAAoBC,gBAAgBH,GACpCI,EAAqBC,EAAuBH,GAC5CI,EAASC,EAA8B,CAC3CC,cAAeL,gBAAgBC,GAC/BK,iBAAkBC,EAClBC,iBAAiB,EACjBC,SAAU,CAACC,GAAUC,mBAEnB,MAAMC,EAAsBC,EAA+BH,GAC3DZ,EAAWc,GACXD,EAAaD,EAAO,IAIxB,OACEI,EAAAC,KAAA,MAAA,CAAKC,UAAWC,EAAOC,WACrBC,SAAA,CAAAC,EAAAC,IAACC,EAAKA,MAAC,CAAAN,UAAWC,EAAOM,YAAaC,MAAM,OAAML,SAAA,sGAIlDL,EAAAC,KAAA,MAAA,CAAKC,UAAWC,EAAOQ,0BACrBX,EAAKC,KAAA,MAAA,CAAAC,UAAW,GAAGC,EAAOS,cAAcT,EAAOU,UAASR,SAAA,CACtDC,EAAAA,IAACQ,EAAW,CACVZ,UAAWC,EAAOY,kBAClBC,KACEhB,EAAKC,KAAA,MAAA,CAAAC,UAAWC,EAAOc,0BAAyBZ,SAAA,CAAA,kBAE9CC,MAACY,EAAAA,QACChB,UAAWC,EAAOgB,qBAClBC,KAAK,SACLC,WAAW,EACXC,KAAK,SACLC,QAAQ,YACRb,MAAM,UACNc,QAASnC,EAAOoC,WAGTpB,SAAA,cAIfC,EAAAA,IAACoB,GAAeC,MAAOtC,EAAMgB,SAC3BC,MAACsB,EAAQ,MAEXtB,MAACQ,EAAW,CAACZ,UAAWC,EAAOY,kBAAmBC,KAAK,gBACvDV,MAACoB,EAAc,CAACC,MAAOtC,EACpBgB,SAAAhB,EAAOO,OAAOiC,MAAMC,KAAI,CAACC,EAAMC,IAC9B1B,EAAAA,IACG2B,EAAAA,SAAA,CAAA5B,SAAA0B,EAAKG,QACHC,MACEC,GACCC,EAAmBD,EAAOd,MAAMgB,MAAQD,EAAmBD,EAAOd,MAAMgB,QAE3ER,KAAI,CAACM,EAAQG,IACZjC,EAAAA,IAACkC,EAAgB,CACfJ,OAAQA,EACRL,KAAMA,EAAKA,KACXU,cAAe,CAACC,EAAKf,KACnB,MAAMgB,EAAI,SAASX,cAAsBO,MAAgBG,IACzDrD,EAAOoD,cAAcE,EAAGhB,EAAM,eAQ9CrB,EAAAC,IAAA,MAAA,CAAKL,UAAW,GAAGC,EAAOyC,mBAAmBzC,EAAOU,UAASR,SAC1DlB,GACCmB,MAACoB,EAAc,CAACC,MAAOtC,WACrBiB,EAAAA,IAACuC,GAAYC,gBAAiB3D,aAMzC"}