@upendra19/swagger-ui-custom 1.0.0

package/src/style/_table.scss

@@ -0,0 +1,191 @@
+@use "type";
+@use "variables" as *;
+
+table {
+  width: 100%;
+  padding: 0 10px;
+
+  border-collapse: collapse;
+
+  &.model {
+    tbody {
+      tr {
+        td {
+          padding: 0 0 0 1em;
+
+          vertical-align: top;
+
+          &:first-of-type {
+            width: 174px;
+            padding: 0 0 0 2em;
+          }
+        }
+      }
+    }
+  }
+
+  &.headers {
+    td {
+      font-size: 12px;
+      font-weight: 300;
+
+      vertical-align: middle;
+
+      @include type.text_code();
+    }
+
+    .header-example {
+      color: #999;
+      font-style: italic;
+    }
+  }
+
+  tbody {
+    tr {
+      td {
+        padding: 10px 0 0 0;
+
+        vertical-align: top;
+
+        &:first-of-type {
+          min-width: 6em;
+          padding: 10px 0;
+        }
+
+        &:has(.model-box) {
+          max-width: 1px; // fits content in available space instead of growing the table beyond its container
+        }
+      }
+    }
+  }
+
+  thead {
+    tr {
+      th,
+      td {
+        font-size: 12px;
+        font-weight: bold;
+
+        padding: 12px 0;
+
+        text-align: left;
+
+        border-bottom: 1px solid rgba($table-thead-td-border-bottom-color, 0.2);
+
+        @include type.text_body();
+      }
+    }
+  }
+}
+
+.parameters-col_description {
+  width: 99%; // forces other columns to shrink to their content widths
+  margin-bottom: 2em;
+  input {
+    width: 100%;
+    max-width: 340px;
+  }
+
+  select {
+    border-width: 1px;
+  }
+
+  .markdown:first-child,
+  .renderedMarkdown:first-child {
+    p:first-child {
+      margin: 0;
+    }
+  }
+}
+
+.parameter__name {
+  font-size: 16px;
+  font-weight: normal;
+
+  // hack to give breathing room to the name column
+  // TODO: refactor all of this to flexbox
+  margin-right: 0.75em;
+
+  @include type.text_headline();
+
+  &.required {
+    font-weight: bold;
+
+    span {
+      color: red;
+    }
+
+    &:after {
+      font-size: 10px;
+
+      position: relative;
+      top: -6px;
+
+      padding: 5px;
+
+      content: "required";
+
+      color: rgba($table-parameter-name-required-font-color, 0.6);
+    }
+  }
+}
+
+.parameter__in,
+.parameter__extension {
+  font-size: 12px;
+  font-style: italic;
+
+  @include type.text_code($table-parameter-in-font-color);
+}
+
+.parameter__deprecated {
+  font-size: 12px;
+  font-style: italic;
+
+  @include type.text_code($table-parameter-deprecated-font-color);
+}
+
+.parameter__empty_value_toggle {
+  display: block;
+  font-size: 13px;
+  padding-top: 5px;
+  padding-bottom: 12px;
+
+  input {
+    margin-right: 7px;
+    width: auto;
+  }
+
+  &.disabled {
+    opacity: 0.7;
+  }
+}
+
+.table-container {
+  padding: 20px;
+}
+
+.response-col_description {
+  width: 99%; // forces other columns to shrink to their content widths
+
+  .markdown,
+  .renderedMarkdown {
+    p:first-child {
+      margin: 0;
+    }
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
+
+.response-col_links {
+  min-width: 6em;
+}
+
+.response__extension {
+  font-size: 12px;
+  font-style: italic;
+
+  @include type.text_code($table-parameter-in-font-color);
+}

package/src/style/_topbar.scss

@@ -0,0 +1,126 @@
+@use "variables" as *;
+@use "type";
+
+.topbar {
+  padding: 10px 0;
+
+  background-color: $topbar-background-color;
+  .topbar-wrapper {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 10px;
+  }
+  @media (max-width: 550px) {
+    .topbar-wrapper {
+      flex-direction: column;
+      align-items: start;
+    }
+  }
+
+  a {
+    font-size: 1.5em;
+    font-weight: bold;
+
+    display: flex;
+    align-items: center;
+    flex: 1;
+
+    max-width: 300px;
+
+    text-decoration: none;
+
+    @include type.text_headline($topbar-link-font-color);
+
+    span {
+      margin: 0;
+      padding: 0 10px;
+    }
+  }
+
+  .download-url-wrapper {
+    display: flex;
+    flex: 3;
+    justify-content: flex-end;
+    max-width: 600px;
+    margin-left: auto;
+
+    input[type="text"] {
+      width: 100%;
+      max-width: 100%;
+      margin: 0;
+
+      border: 2px solid $topbar-download-url-wrapper-element-border-color;
+      border-radius: 4px 0 0 4px;
+      outline: none;
+    }
+
+    .select-label {
+      display: flex;
+      align-items: center;
+
+      width: 100%;
+      max-width: 600px;
+      margin: 0;
+      color: #f0f0f0;
+      span {
+        font-size: 16px;
+
+        flex: 1;
+
+        padding: 0 10px 0 0;
+
+        text-align: right;
+      }
+
+      select {
+        flex: 2;
+
+        width: 100%;
+
+        border: 2px solid $topbar-download-url-wrapper-element-border-color;
+        outline: none;
+        box-shadow: none;
+      }
+    }
+
+    .download-url-button {
+      font-size: 16px;
+      font-weight: bold;
+
+      padding: 4px 30px;
+
+      border: none;
+      border-radius: 0 4px 4px 0;
+      background: $topbar-download-url-button-background-color;
+
+      @include type.text_headline($topbar-download-url-button-font-color);
+    }
+  }
+  @media (max-width: 550px) {
+    .download-url-wrapper {
+      width: 100%;
+    }
+  }
+
+  .dark-mode-toggle {
+    margin-left: 10px;
+    opacity: 0.8;
+    transition: all .2s;
+    cursor: pointer;
+
+    button {
+      background: none;
+      border: none;
+      padding: 0;
+
+      svg {
+        fill: #E4E6E6;
+      }
+    }
+
+    &:hover {
+      opacity: 1;
+    }
+  }
+}

package/src/style/_type.scss

@@ -0,0 +1,21 @@
+@use "variables" as *;
+
+@mixin text_body($color: $text-body-default-font-color) {
+  & {
+    font-family: sans-serif;
+    color: $color;
+  }
+}
+
+@mixin text_code($color: $text-code-default-font-color) {
+  font-family: monospace;
+  font-weight: 600;
+
+  color: $color;
+}
+
+@mixin text_headline($color: $text-headline-default-font-color) {
+  font-family: sans-serif;
+
+  color: $color;
+}

package/src/style/_variables.scss

@@ -0,0 +1,230 @@
+@use "sass:color";
+
+// Base Colours
+$black: #000 !default;
+$white: #fff !default;
+$gray-50: color.adjust($black, $lightness: 92%) !default; //ebebeb
+$gray-200: color.adjust($black, $lightness: 62.75%) !default; // #a0a0a0
+$gray-300: color.adjust($black, $lightness: 56.5%) !default; // #909090
+$gray-400: color.adjust($black, $lightness: 50%) !default; // #808080
+$gray-500: color.adjust($black, $lightness: 43.75%) !default; // #707070
+$gray-600: color.adjust($black, $lightness: 37.5%) !default; // #606060
+$gray-650: color.adjust($black, $lightness: 33.3%) !default; // #555555
+$gray-700: color.adjust($black, $lightness: 31.25%) !default; // #505050
+$gray-800: color.adjust($black, $lightness: 25%) !default; // #404040
+$gray-900: color.adjust($black, $lightness: 18.75%) !default; // #303030
+
+$cod-gray: #1b1b1b !default;
+$agate-gray: #333333 !default;
+$bright-gray: #3b4151 !default;
+$mako-gray: #41444e !default;
+$waterloo-gray: #7d8492 !default;
+$alto-gray: #d9d9d9 !default;
+$mercury-gray: #e4e4e4 !default;
+$concrete-gray: #e8e8e8 !default;
+$alabaster: #f7f7f7 !default;
+$apple-green: #62a03f !default;
+$green-haze: #009d77 !default;
+$japanese-laurel: #008000 !default;
+$persian-green: #00a0a7 !default;
+$geyser-blue: #d8dde7 !default;
+$dodger-blue: #1391ff !default;
+$endeavour-blue: #005dae !default;
+$scampi-purple: #55a !default;
+$electric-violet: #7300e5 !default;
+$persian-red: #cf3030 !default;
+$mango-tango: #e97500 !default;
+
+// Theme
+
+$color-primary: #89bf04 !default;
+$color-secondary: #9012fe !default;
+$color-info: #4990e2 !default;
+$color-warning: #ff6060 !default;
+$color-danger: #f00 !default;
+
+$color-primary-hover: color.adjust($color-primary, $lightness: 0.5%) !default;
+
+$color-post: #49cc90 !default;
+$color-get: #61affe !default;
+$color-put: #fca130 !default;
+$color-delete: #f93e3e !default;
+$color-head: #9012fe !default;
+$color-patch: #50e3c2 !default;
+$color-disabled: #ebebeb !default;
+$color-options: #0d5aa7 !default;
+
+// Authorize
+
+$auth-container-border-color: $gray-50 !default;
+$auth-select-all-none-link-font-color: $color-info !default;
+// Buttons
+
+$btn-background-color: transparent !default;
+$btn-border-color: $gray-400 !default;
+$btn-font-color: inherit !default;
+$btn-box-shadow-color: $black !default;
+
+$btn-authorize-background-color: transparent !default;
+$btn-authorize-border-color: $color-post !default;
+$btn-authorize-font-color: $color-post !default;
+$btn-authorize-svg-fill-color: $color-post !default;
+
+$btn-cancel-background-color: transparent !default;
+$btn-cancel-border-color: $color-warning !default;
+$btn-cancel-font-color: $color-warning !default;
+
+$btn-execute-background-color: transparent !default;
+$btn-execute-border-color: $color-info !default;
+$btn-execute-font-color: $white !default;
+$btn-execute-background-color-alt: $color-info !default;
+
+$expand-methods-svg-fill-color: $gray-500 !default;
+$expand-methods-svg-fill-color-hover: $gray-800 !default;
+
+// Errors
+
+$errors-wrapper-background-color: $color-delete !default;
+$errors-wrapper-border-color: $color-delete !default;
+
+$errors-wrapper-errors-small-font-color: $gray-600 !default;
+
+// Form
+
+$form-select-background-color: $alabaster !default;
+$form-select-border-color: $mako-gray !default;
+$form-select-box-shadow-color: $black !default;
+
+$form-input-border-color: $alto-gray !default;
+$form-input-background-color: $white !default;
+
+$form-textarea-background-color: $white !default;
+$form-textarea-focus-border-color: $color-get !default;
+
+$form-textarea-curl-background-color: $mako-gray !default;
+$form-textarea-curl-font-color: $white !default;
+
+$form-checkbox-label-font-color: $gray-900 !default;
+$form-checkbox-background-color: $concrete-gray !default;
+$form-checkbox-box-shadow-color: $concrete-gray !default;
+
+// Information
+
+$info-code-background-color: $black !default;
+$info-code-font-color: $color-head !default;
+
+$info-link-font-color: $color-info !default;
+$info-link-font-color-hover: $info-link-font-color !default;
+
+$info-title-small-background-color: $waterloo-gray !default;
+
+$info-title-small-pre-font-color: $white !default;
+
+// Layout
+
+$opblock-border-color: $black !default;
+$opblock-box-shadow-color: $black !default;
+
+$opblock-tag-border-bottom-color: $bright-gray !default;
+$opblock-tag-background-color-hover: $black !default;
+
+$opblock-tab-header-tab-item-active-h4-span-after-background-color: $gray-400 !default;
+
+$opblock-isopen-summary-border-bottom-color: $black !default;
+
+$opblock-isopen-section-header-background-color: $white !default;
+$opblock-isopen-section-header-box-shadow-color: $black !default;
+
+$opblock-summary-method-background-color: $black !default;
+$opblock-summary-method-font-color: $white !default;
+$opblock-summary-method-text-shadow-color: $black !default;
+
+$operational-filter-input-border-color: $geyser-blue !default;
+
+$tab-list-item-first-background-color: $black !default;
+
+$response-col-status-undocumented-font-color: $gray-300 !default;
+
+$response-col-links-font-color: $gray-300 !default;
+
+$opblock-body-background-color: $agate-gray !default;
+$opblock-body-font-color: $white !default;
+
+$scheme-container-background-color: $white !default;
+$scheme-container-box-shadow-color: $black !default;
+
+$server-container-background-color: $white !default;
+$server-container-box-shadow-color: $black !default;
+
+$server-container-computed-url-code-font-color: $gray-400 !default;
+
+$loading-container-before-border-color: $gray-650 !default;
+$loading-container-before-border-top-color: $black !default;
+
+$response-content-type-controls-accept-header-select-border-color: $japanese-laurel !default;
+$response-content-type-controls-accept-header-small-font-color: $japanese-laurel !default;
+
+// Modal
+
+$dialog-ux-backdrop-background-color: $black !default;
+
+$dialog-ux-modal-background-color: $white !default;
+$dialog-ux-modal-border-color: $gray-50 !default;
+$dialog-ux-modal-box-shadow-color: $black !default;
+
+$dialog-ux-modal-content-font-color: $mako-gray !default;
+
+$dialog-ux-modal-header-border-bottom-color: $gray-50 !default;
+
+// Models
+
+$model-deprecated-font-color: $gray-200 !default;
+
+$model-hint-font-color: $gray-50 !default;
+$model-hint-background-color: $black !default;
+
+$section-models-border-color: $bright-gray !default;
+
+$section-models-isopen-h4-border-bottom-color: $section-models-border-color !default;
+
+$section-models-h4-font-color: $gray-600 !default;
+$section-models-h4-background-color-hover: $black !default;
+
+$section-models-h5-font-color: $gray-500 !default;
+
+$section-models-model-container-background-color: $black !default;
+
+$section-models-model-box-background-color: $black !default;
+
+$section-models-model-title-font-color: $gray-700 !default;
+
+$prop-type-font-color: $scampi-purple !default;
+
+$prop-format-font-color: $gray-600 !default;
+
+// Tables
+
+$table-thead-td-border-bottom-color: $bright-gray !default;
+
+$table-parameter-name-required-font-color: $color-danger !default;
+
+$table-parameter-in-font-color: $gray-400 !default;
+
+$table-parameter-deprecated-font-color: $color-danger !default;
+
+// Topbar
+
+$topbar-background-color: $cod-gray !default;
+
+$topbar-link-font-color: $white !default;
+
+$topbar-download-url-wrapper-element-border-color: $apple-green !default;
+
+$topbar-download-url-button-background-color: $apple-green !default;
+$topbar-download-url-button-font-color: $white !default;
+
+// Type
+
+$text-body-default-font-color: $bright-gray !default;
+$text-code-default-font-color: $bright-gray !default;
+$text-headline-default-font-color: $bright-gray !default;

package/src/style/main.scss

@@ -0,0 +1,28 @@
+@use "sass:meta";
+@use "type";
+
+.swagger-ui {
+  @include type.text_body();
+  @include meta.load-css("~tachyons-sass/tachyons.scss");
+  @include meta.load-css("mixins");
+  @include meta.load-css("variables");
+  @include meta.load-css("type");
+  @include meta.load-css("layout");
+  @include meta.load-css("buttons");
+  @include meta.load-css("form");
+  @include meta.load-css("modal");
+  @include meta.load-css("models");
+  @include meta.load-css("servers");
+  @include meta.load-css("table");
+  @include meta.load-css("topbar");
+  @include meta.load-css("information");
+  @include meta.load-css("authorize");
+  @include meta.load-css("errors");
+  @include meta.load-css("split-pane-mode");
+  @include meta.load-css("markdown");
+  @include meta.load-css("../core/plugins/json-schema-2020-12/components/all");
+  @include meta.load-css("../core/plugins/oas31/components/all");
+}
+
+// Themes must live outside of the '.swagger-ui' class to target HTML parent.
+@include meta.load-css("dark-mode");

package/stylelint.config.js

@@ -0,0 +1,11 @@
+/**
+ * @prettier
+ */
+
+module.exports = {
+  plugins: ["stylelint-prettier"],
+  customSyntax: "postcss-scss",
+  rules: {
+    "prettier/prettier": [true, { requirePragma: false, insertPragma: false }],
+  },
+}

package/swagger-ui-dist-package/absolute-path.js

@@ -0,0 +1,14 @@
+/*
+ * getAbsoluteFSPath
+ * @return {string} When run in NodeJS env, returns the absolute path to the current directory
+ *                  When run outside of NodeJS, will return an error message
+ */
+const getAbsoluteFSPath = function () {
+  // detect whether we are running in a browser or nodejs
+  if (typeof module !== "undefined" && module.exports) {
+    return require("path").resolve(__dirname)
+  }
+  throw new Error('getAbsoluteFSPath can only be called within a Nodejs environment');
+}
+
+module.exports = getAbsoluteFSPath

package/swagger-ui-dist-package/index.js

@@ -0,0 +1,17 @@
+try {
+  module.exports.SwaggerUIBundle = require("./swagger-ui-bundle.js")
+  module.exports.SwaggerUIStandalonePreset = require("./swagger-ui-standalone-preset.js")
+} catch(e) {
+  // swallow the error if there's a problem loading the assets.
+  // allows this module to support providing the assets for browserish contexts,
+  // without exploding in a Node context.
+  //
+  // see https://github.com/swagger-api/swagger-ui/issues/3291#issuecomment-311195388
+  // for more information.
+}
+
+// `absolutePath` and `getAbsoluteFSPath` are both here because at one point,
+// we documented having one and actually implemented the other.
+// They were both retained so we don't break anyone's code.
+module.exports.absolutePath = require("./absolute-path.js")
+module.exports.getAbsoluteFSPath = require("./absolute-path.js")

package/swagger-ui-dist-package/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "swagger-ui-dist",
+  "version": "$$VERSION",
+  "main": "index.js",
+  "repository": "git@github.com:swagger-api/swagger-ui.git",
+  "contributors": [
+    "(in alphabetical order)",
+    "Anna Bodnia <anna.bodnia@gmail.com>",
+    "Buu Nguyen <buunguyen@gmail.com>",
+    "Josh Ponelat <jponelat@gmail.com>",
+    "Kyle Shockey <kyleshockey1@gmail.com>",
+    "Robert Barnwell <robert@robertismy.name>",
+    "Sahar Jafari <shr.jafari@gmail.com>"
+  ],
+  "license": "Apache-2.0",
+  "dependencies": {
+    "@scarf/scarf": "=1.4.0"
+  },
+  "devDependencies": {}
+}