drf-to-mkdoc 0.2.2__py3-none-any.whl → 0.2.3__py3-none-any.whl

drf_to_mkdoc/static/drf-to-mkdoc/stylesheets/try-out/response.css

@@ -0,0 +1,158 @@
+/* Response Modal */
+.response-modal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: var(--try-out-z-response);
+    display: none;
+    align-items: center;
+    justify-content: center;
+    padding: var(--try-out-spacing-lg);
+    box-sizing: border-box;
+}
+
+.response-modal .modal-header {
+    padding: var(--try-out-spacing-lg) var(--try-out-spacing-xl);
+    background: linear-gradient(135deg, var(--try-out-primary), #1565c0);
+    color: white;
+    display: flex;
+    align-items: center;
+    gap: var(--try-out-spacing);
+    flex-shrink: 0;
+    position: relative;
+}
+
+.response-modal .modal-header h3 {
+    margin: 0;
+    font-size: var(--try-out-font-lg);
+    font-weight: 600;
+    flex-grow: 1;
+}
+
+.response-modal .modal-close {
+    background: none;
+    border: none;
+    color: white;
+    cursor: pointer;
+    padding: var(--try-out-spacing-sm);
+    font-size: var(--try-out-font-lg);
+    line-height: 1;
+    border-radius: 50%;
+    width: 28px;
+    height: 28px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: absolute;
+    right: var(--try-out-spacing);
+    top: 50%;
+    transform: translateY(-50%);
+}
+
+.response-modal .modal-close:hover {
+    background-color: rgba(255, 255, 255, 0.1);
+}
+
+.response-modal .modal-body {
+    padding: var(--try-out-spacing-xl);
+    overflow-y: auto;
+    flex: 1;
+}
+
+.response-modal.show {
+    display: flex;
+}
+
+.response-modal .modal-content {
+    position: relative;
+    width: 100%;
+    max-width: 700px;
+    max-height: 85vh;
+    background-color: var(--try-out-bg);
+    border-radius: var(--try-out-border-radius-lg);
+    box-shadow: 0 8px 32px var(--try-out-shadow-strong);
+    overflow: hidden;
+    z-index: 1;
+    display: flex;
+    flex-direction: column;
+}
+
+.response-modal .response-header {
+    margin-bottom: var(--try-out-spacing-lg);
+    padding: var(--try-out-spacing);
+    border-radius: var(--try-out-border-radius);
+    background-color: var(--try-out-surface);
+    display: flex;
+    align-items: center;
+    gap: var(--try-out-spacing);
+}
+
+.response-modal .status-badge {
+    padding: var(--try-out-spacing-sm) var(--try-out-spacing);
+    border-radius: var(--try-out-border-radius);
+    font-size: var(--try-out-font-sm);
+    font-weight: 600;
+    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+}
+
+.response-modal .status-200 { 
+    background-color: var(--try-out-success); 
+    color: white; 
+}
+
+.response-modal .status-300 { 
+    background-color: var(--try-out-info); 
+    color: white; 
+}
+
+.response-modal .status-400 { 
+    background-color: var(--try-out-warning); 
+    color: #212529; 
+}
+
+.response-modal .status-500 { 
+    background-color: var(--try-out-danger); 
+    color: white; 
+}
+
+.response-modal .response-body {
+    background-color: var(--try-out-surface);
+    padding: var(--try-out-spacing-lg);
+    border-radius: var(--try-out-border-radius);
+    overflow: auto;
+    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+    white-space: pre-wrap;
+    font-size: var(--try-out-font-sm);
+    line-height: var(--try-out-line-height);
+    max-height: 300px;
+    border: 1px solid var(--try-out-border);
+    flex: 1;
+}
+
+.response-modal .response-info {
+    display: flex;
+    align-items: center;
+    gap: var(--try-out-spacing);
+    font-size: var(--try-out-font-base);
+    color: var(--try-out-text);
+    font-weight: 500;
+}
+
+/* Mobile Response Modal */
+@media screen and (max-width: 768px) {
+    .response-modal {
+        padding: var(--try-out-spacing-sm);
+    }
+    
+    .response-modal .modal-content {
+        max-width: none;
+        max-height: 90vh;
+    }
+    
+    .response-modal .response-body {
+        font-size: 12px;
+        max-height: 250px;
+    }
+}

drf_to_mkdoc/static/drf-to-mkdoc/stylesheets/try-out/tabs.css

@@ -0,0 +1,62 @@
+/* Tabs */
+.tabs {
+    display: flex;
+    gap: 0;
+    margin-bottom: var(--try-out-spacing-lg);
+    border: 1px solid var(--try-out-border);
+    border-radius: var(--try-out-border-radius);
+    overflow: hidden;
+    background-color: var(--try-out-surface);
+}
+
+.tab {
+    flex: 1;
+    padding: var(--try-out-spacing) var(--try-out-spacing-lg);
+    border: none;
+    background: transparent;
+    color: var(--try-out-text-light);
+    cursor: pointer;
+    font-size: var(--try-out-font-base);
+    font-weight: 500;
+    position: relative;
+    transition: var(--try-out-transition);
+    border-right: 1px solid var(--try-out-border);
+}
+
+.tab:last-child {
+    border-right: none;
+}
+
+.tab:hover {
+    background-color: rgba(25, 118, 210, 0.05);
+    color: var(--try-out-text);
+}
+
+.tab.active {
+    background-color: var(--try-out-primary);
+    color: white;
+}
+
+.tab-content {
+    display: none;
+}
+
+.tab-content.active {
+    display: block;
+}
+
+/* Mobile Tabs */
+@media screen and (max-width: 768px) {
+    .tabs {
+        flex-direction: column;
+    }
+    
+    .tab {
+        border-right: none;
+        border-bottom: 1px solid var(--try-out-border);
+    }
+    
+    .tab:last-child {
+        border-bottom: none;
+    }
+}

drf_to_mkdoc/static/drf-to-mkdoc/stylesheets/try-out/variables.css

@@ -0,0 +1,38 @@
+:root {
+    --try-out-primary: #1976d2;
+    --try-out-primary-hover: #1565c0;
+    --try-out-success: #28a745;
+    --try-out-success-hover: #218838;
+    --try-out-danger: #dc3545;
+    --try-out-danger-hover: #c82333;
+    --try-out-warning: #ffc107;
+    --try-out-info: #17a2b8;
+    
+    --try-out-bg: #ffffff;
+    --try-out-surface: #f8f9fa;
+    --try-out-border: #e1e5e9;
+    --try-out-text: #333333;
+    --try-out-text-light: #666666;
+    --try-out-text-lighter: #999999;
+    --try-out-shadow: rgba(0, 0, 0, 0.1);
+    --try-out-shadow-strong: rgba(0, 0, 0, 0.2);
+    
+    --try-out-border-radius: 4px;
+    --try-out-border-radius-lg: 6px;
+    --try-out-spacing-xs: 0.2rem;
+    --try-out-spacing-sm: 0.4rem;
+    --try-out-spacing: 0.6rem;
+    --try-out-spacing-lg: 0.8rem;
+    --try-out-spacing-xl: 1.2rem;
+    --try-out-spacing-xxl: 1.6rem;
+    
+    --try-out-font-sm: 0.75rem;
+    --try-out-font-base: 0.8rem;
+    --try-out-font-lg: 0.9rem;
+    --try-out-line-height: 1.4;
+    
+    --try-out-transition: all 0.2s ease;
+    --try-out-z-modal: 1000;
+    --try-out-z-response: 1100;
+    --try-out-z-fab: 100;
+}

drf_to_mkdoc/templates/endpoints/detail/base.html

@@ -30,4 +30,6 @@
 {% include "endpoints/detail/path_parameters.html" %}
 {% include "endpoints/detail/query_parameters.html" %}
 {% include "endpoints/detail/request_body.html" %}
-{% include "endpoints/detail/responses.html" %}
+{% include "endpoints/detail/responses.html" %}
+
+{% include 'try-out/main.html' %}

drf_to_mkdoc/templates/endpoints/detail/query_parameters.html

@@ -2,7 +2,7 @@
 Check if any query parameter fields have content
 {% endcomment %}
 
-{% if query_parameters.filter_fields or query_parameters.search_fields or query_parameters.ordering_fields or query_parameters.filter_backends or query_parameters.pagination_fields %}
+{% if query_parameters.filter_fields or query_parameters.search_fields or query_parameters.ordering_fields or query_parameters.pagination_fields %}
 ## Query Parameters
 
 {% if query_parameters.filter_fields %}
@@ -26,13 +26,6 @@ Check if any query parameter fields have content
 {% endfor %}
 {% endif %}
 
-{% if query_parameters.filter_backends %}
-### Filter Backends
-{% for backend in query_parameters.filter_backends %}
-- `{{ backend }}`
-{% endfor %}
-{% endif %}
-
 {% if query_parameters.pagination_fields %}
 ### Pagination Fields
 {% for field in query_parameters.pagination_fields %}

drf_to_mkdoc/templates/endpoints/detail/responses.html

@@ -10,9 +10,9 @@
 {{ response.description }}
 {% endif %}
 
-{% if response.example %}
-{{ response.example|format_json }}
-{% endif %}
+{% for example in response.examples %}
+{{ example|format_json }}
+{% endfor %}
 
 {% endfor %}
-{% endif %}
+{% endif %}

drf_to_mkdoc/templates/try-out/fab.html

@@ -0,0 +1,4 @@
+<!-- Try Out Floating Action Button -->
+<button class="try-out-fab" role="button" tabindex="0" aria-label="Open Try It Out" onclick="TryOutSidebar.openTryOut()">
+    <span>🚀</span>
+</button>

drf_to_mkdoc/templates/try-out/form.html

@@ -0,0 +1,113 @@
+{% load custom_filters %}
+
+<div class="try-out-form" data-method="{{ method }}">
+    <!-- Base URL Section -->
+    <div class="base-url-section">
+        <label for="baseUrl">Request URL</label>
+        <div class="url-display">
+            <input type="text" id="baseUrl" class="base-url-input" value="http://localhost:8000" placeholder="https://api.example.com">
+            <span class="path-display">{{ path }}</span>
+        </div>
+    </div>
+
+    <!-- Tabs -->
+    <div class="tabs">
+        <button class="tab active" data-tab="parameters">Parameters</button>
+        <button class="tab" data-tab="headers">Headers</button>
+        {% if method|upper in "POST,PUT,PATCH" %}
+        <button class="tab" data-tab="body">Request Body</button>
+        {% endif %}
+    </div>
+
+    <!-- Parameters Tab -->
+    <div class="tab-content active" id="parametersTab">
+        {% if path_params %}
+        <div class="form-group">
+            <label class="form-label">Path Parameters</label>
+            <div class="kv-container" id="pathParams">
+                {% for param in path_params %}
+                <div class="kv-item">
+                    <label class="param-label{% if param.required %} required{% endif %}">{{ param.name }}</label>
+                    <input type="text" 
+                           placeholder="Enter {{ param.name }} value" 
+                           data-param="{{ param.name }}"
+                           {% if param.required %}required{% endif %}>
+                    <div class="error-message"></div>
+                </div>
+                {% endfor %}
+            </div>
+        </div>
+        {% endif %}
+
+        <div class="form-group">
+            <label class="form-label">Query Parameters</label>
+            <div class="kv-container" id="queryParams">
+                <div class="kv-item">
+                    <input type="text" placeholder="Parameter name">
+                    <input type="text" placeholder="Parameter value">
+                    <button class="remove-btn" onclick="TryOutSidebar.removeKvItem(this)">✕</button>
+                </div>
+            </div>
+            <button class="add-btn" onclick="TryOutSidebar.addQueryParam()">
+                <span>+</span> Add Parameter
+            </button>
+        </div>
+    </div>
+
+    <!-- Headers Tab -->
+    <div class="tab-content" id="headersTab">
+        <div class="form-group">
+            <label class="form-label">Request Headers</label>
+            <div class="kv-container" id="requestHeaders">
+                <div class="kv-item">
+                    <input type="text" value="Content-Type">
+                    <input type="text" value="application/json">
+                    <button class="remove-btn" onclick="TryOutSidebar.removeKvItem(this)">✕</button>
+                </div>
+                <div class="kv-item">
+                    <input type="text" value="Authorization">
+                    <input type="text" placeholder="Bearer your-token">
+                    <button class="remove-btn" onclick="TryOutSidebar.removeKvItem(this)">✕</button>
+                </div>
+            </div>
+            <button class="add-btn" onclick="TryOutSidebar.addHeader()">
+                <span>+</span> Add Header
+            </button>
+        </div>
+    </div>
+
+    <!-- Request Body Tab -->
+    {% if method|upper in "POST,PUT,PATCH" %}
+    <div class="tab-content" id="bodyTab">
+        <div class="form-group">
+            <label class="form-label">Request Body</label>
+            <textarea id="requestBody" 
+                      class="form-input form-textarea" 
+                      placeholder="Enter JSON request body..."
+                      rows="8">{% if request_example %}{{ request_example|extract_json_from_markdown }}{% endif %}</textarea>
+        </div>
+    </div>
+    {% endif %}
+
+    <!-- Execute Button -->
+    <button class="execute-btn" id="executeBtn" onclick="executeRequest()">
+        <span>▶</span> Execute Request
+    </button>
+</div>
+
+<script>
+// Pass query parameters data to JavaScript
+window.queryParametersData = {
+    {% if query_parameters %}
+    filter_fields: {{ query_parameters.filter_fields|default:"[]"|safe }},
+    search_fields: {{ query_parameters.search_fields|default:"[]"|safe }},
+    ordering_fields: {{ query_parameters.ordering_fields|default:"[]"|safe }},
+    pagination_fields: {{ query_parameters.pagination_fields|default:"[]"|safe }}
+    {% else %}
+    filter_fields: [],
+    search_fields: [],
+    ordering_fields: [],
+    pagination_fields: []
+    {% endif %}
+};
+</script>

drf_to_mkdoc/templates/try-out/main.html

@@ -0,0 +1,4 @@
+<!-- Try Out Main Component -->
+{% include 'try-out/fab.html' %}
+{% include 'try-out/modal.html' %}
+{% include 'try-out/response-modal.html' %}

drf_to_mkdoc/templates/try-out/modal.html

@@ -0,0 +1,14 @@
+<!-- Try Out Modal -->
+<div id="tryOutModal" class="try-out-modal" role="dialog" aria-modal="true" aria-label="Try It Out">
+    <div class="modal-overlay" onclick="TryOutSidebar.closeTryOut()"></div>
+    <div class="modal-content">
+        <div class="modal-header">
+            <span>🚀</span>
+            <h3>Try It Out</h3>
+            <button class="modal-close" aria-label="Close" onclick="TryOutSidebar.closeTryOut()">✕</button>
+        </div>
+        <div class="modal-body">
+            {% include 'try-out/form.html' %}
+        </div>
+    </div>
+</div>

drf_to_mkdoc/templates/try-out/response-modal.html

@@ -0,0 +1,20 @@
+<!-- Response Modal -->
+<div id="responseModal" class="response-modal" role="dialog" aria-modal="true" aria-label="API Response">
+    <div class="modal-overlay" onclick="TryOutSidebar.closeResponseModal()"></div>
+    <div class="modal-content">
+        <div class="modal-header">
+            <h3>API Response</h3>
+            <button class="modal-close" aria-label="Close" onclick="TryOutSidebar.closeResponseModal()">✕</button>
+        </div>
+        <div class="modal-body">
+            <div class="response-header">
+                <div class="response-info">
+                    <span>Status:</span>
+                    <span class="status-badge" id="modalStatusBadge"></span>
+                </div>
+                <div class="response-info" id="responseInfo"></div>
+            </div>
+            <div class="response-body" id="modalResponseBody"></div>
+        </div>
+    </div>
+</div>

drf_to_mkdoc/templatetags/custom_filters.py

@@ -1,5 +1,6 @@
 import html
 import json
+import re
 
 from django import template
 from django.templatetags.static import static as django_static
@@ -113,4 +114,35 @@ def format_json(value):
     elif isinstance(value, dict | list):
         value = json.dumps(value, indent=2)
 
-    return mark_safe(value)  # noqa: S308
+    return mark_safe(f"```json\n{value}\n```")  # noqa: S308
+
+
+@register.filter
+def extract_json_from_markdown(value):
+    """Extract JSON content from markdown code blocks"""
+    if not isinstance(value, str):
+        return ""
+
+    # Look for ```json code blocks
+
+    json_pattern = r"```json\s*\n(.*?)\n```"
+    matches = re.findall(json_pattern, value, re.DOTALL)
+
+    if matches:
+        return matches[0].strip()
+
+    # Fallback: look for any code block
+    code_pattern = r"```\s*\n(.*?)\n```"
+    matches = re.findall(code_pattern, value, re.DOTALL)
+
+    if matches:
+        content = matches[0].strip()
+        # Try to validate if it's JSON
+        try:
+            json.loads(content)
+        except (json.JSONDecodeError, TypeError):
+            pass
+        else:
+            return content
+
+    return ""

drf_to_mkdoc/utils/commons/schema_utils.py

@@ -1,8 +1,9 @@
 import json
+from copy import deepcopy
+from functools import lru_cache
 from pathlib import Path
 from typing import Any
 
-import yaml
 from drf_spectacular.generators import SchemaGenerator
 
 from drf_to_mkdoc.conf.settings import drf_to_mkdoc_settings
@@ -21,16 +22,6 @@ class QueryParamTypeError(Exception):
     pass
 
 
-def load_schema() -> dict[str, Any] | None:
-    """Load the OpenAPI schema from doc-schema.yaml"""
-    schema_file = Path(drf_to_mkdoc_settings.CONFIG_DIR) / "doc-schema.yaml"
-    if not schema_file.exists():
-        return None
-
-    with schema_file.open(encoding="utf-8") as f:
-        return yaml.safe_load(f)
-
-
 def get_custom_schema():
     custom_schema_data = load_json_data(
         drf_to_mkdoc_settings.CUSTOM_SCHEMA_FILE, raise_not_found=False
@@ -56,7 +47,6 @@ def get_custom_schema():
                         "search_fields",
                         "filter_fields",
                         "ordering_fields",
-                        "filter_backends",
                         "pagination_fields",
                     }
                 ):
@@ -153,16 +143,17 @@ def _apply_custom_overrides(
                 target_schema[key] = custom_value
 
 
+@lru_cache(maxsize=1)
 def get_schema():
     base_schema = SchemaGenerator().get_schema(request=None, public=True)
     custom_data = get_custom_schema()
     if not custom_data:
-        return base_schema
+        return deepcopy(base_schema)
 
     operation_map = _build_operation_map(base_schema)
     _apply_custom_overrides(base_schema, operation_map, custom_data)
 
-    return base_schema
+    return deepcopy(base_schema)
 
 
 class OperationExtractor: