strictdoc 0.0.40__tar.gz → 0.0.41a0__tar.gz

{strictdoc-0.0.40 → strictdoc-0.0.41a0}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.1
 Name: strictdoc
-Version: 0.0.40
+Version: 0.0.41a0
 Summary: StrictDoc is open-source software for technical documentation and requirements management.
 Project-URL: Changelog, https://github.com/strictdoc-project/strictdoc/blob/main/CHANGELOG.md
 Project-URL: Homepage, https://strictdoc.readthedocs.io/en/stable/

{strictdoc-0.0.40 → strictdoc-0.0.41a0}/pyproject.toml

@@ -5,6 +5,14 @@ build-backend = "hatchling.build"
 [tool.hatch.version]
 path = "strictdoc/__init__.py"
 
+[tool.hatch.build]
+exclude = [
+  "/.*",
+  "/developer",
+  "/docs",
+  "/tests",
+]
+
 #[tool.hatch.build.targets.sdist]
 #include = [
 #    "/uvicorn",

{strictdoc-0.0.40 → strictdoc-0.0.41a0}/strictdoc/__init__.py

@@ -1,6 +1,6 @@
 from strictdoc.core.environment import SDocRuntimeEnvironment
 
-__version__ = "0.0.40"
+__version__ = "0.0.41-alpha"
 
 
 environment = SDocRuntimeEnvironment(__file__)

{strictdoc-0.0.40 → strictdoc-0.0.41a0}/strictdoc/export/html/_static/base.css

@@ -49,9 +49,6 @@
   --base-padding: var(--base-font-size);
   --base-margin: calc(var(--base-font-size)*1.5);
 
-  --toc-width: 300px;
-  --toc-layout-transition: 0.1s;
-
   --base-elevation-0: 0 0 0 rgba(0,0,0,0);
   --base-elevation-node: 0 0 16px rgba(0,0,0,.1);
   --base-elevation-modal: 0 0 32px rgba(0,0,0,.32);
@@ -68,7 +65,7 @@
 
   --card-width: 300px;
 
-  --base-border: 1px solid rgba(0,0,0,0.1);
+  --base-border: 1px solid var(--color-border);
 
   --color-red: rgb(200, 0, 0);
   --color-blue: rgb(50, 100, 200);

{strictdoc-0.0.40 → strictdoc-0.0.41a0}/strictdoc/export/html/_static/content.css

@@ -1,3 +1,23 @@
+/* .main */
+
+.main {
+  padding: var(--base-gap);
+  position: relative;
+  overflow: auto;
+  scroll-behavior: smooth;
+  height: 100%;
+  background-color: var(--color-bg-main);
+}
+
+/* redefine main layout grid */
+
+[data-viewtype="source-file"] .main {
+  padding: 0;
+  background: white;
+}
+
+/* .content */
+
 .content {
   min-width: calc(var(--card-width) + calc(var(--base-padding)*4));
 }
@@ -5,6 +25,9 @@
 [data-viewtype="document"] .content {
   display: block;
   max-width: 900px;
+  margin-bottom: 300px;
+  margin-left: auto;
+  margin-right: auto;
 }
 
 [data-viewtype="traceability"] .content {

strictdoc-0.0.41a0/strictdoc/export/html/_static/controllers/collapsible_list_controller.js

@@ -0,0 +1,225 @@
+// To collapse and expand TOC branches
+
+import { Controller } from "/_static/stimulus.js";
+
+const ROOT_SELECTOR = 'js-collapsible_list';
+const LIST_SELECTOR = `[${ROOT_SELECTOR}="list"]`;
+const BRANCH_SELECTOR = `collapsible_list__branch`;
+const LIST_DEFAULT = 'open';
+const SYMBOL_MINUS = '－';
+const SYMBOL_PLUS = '＋';
+
+const STYLE = `
+[data-${BRANCH_SELECTOR}] {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  -webkit-box-pack: center;
+  background-clip: padding-box;
+  cursor: pointer;
+  user-select: none;
+  transition: .3s;
+  width: 16px;
+  height: 16px;
+  font-size: 14px;
+  font-weight: bold;
+  line-height: 0;
+  border-radius: 50%;
+  color: rgba(0,0,0,0.5);
+  box-shadow: rgb(0 0 0 / 10%) 0px 1px 2px 0px;
+  position: absolute;
+  top: 0;
+  left: -8px;
+}
+
+[data-${BRANCH_SELECTOR}]:hover {
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  box-shadow: rgb(0 0 0 / 15%) 0px 2px 8px 0px;
+  color: rgba(0,0,0,1);
+}
+
+[data-${BRANCH_SELECTOR}='closed']::before {
+  content: '${SYMBOL_PLUS}';
+}
+
+[data-${BRANCH_SELECTOR}='open']::before {
+  content: '${SYMBOL_MINUS}';
+}
+
+[data-${BRANCH_SELECTOR}='closed'] + ul {
+  height: 0;
+  overflow: hidden;
+}
+
+[data-${BRANCH_SELECTOR}='open'] + ul {
+  height: auto;
+}
+
+[${ROOT_SELECTOR}-bulk] {
+  display: flex;
+  gap: 8px;
+  z-index: 2;
+  position: fixed;
+  margin-top: -16px;
+  margin-left: -8px;
+  pointer-events: none;
+  padding: 8px;
+  background: #F2F5F9;
+  box-shadow: #F2F5F9 0px 8px 8px 0px;
+}
+[${ROOT_SELECTOR}-bulk] + ${LIST_SELECTOR} {
+  margin-top: 32px;
+}
+[${ROOT_SELECTOR}-bulk] > div {
+  cursor: pointer;
+  user-select: none;
+  transition: .3s;
+  width: 16px;
+  height: 16px;
+  position: relative;
+  pointer-events: auto;
+}
+
+[${ROOT_SELECTOR}-bulk] > div::before {
+  content: attr(data-action);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  -webkit-box-pack: center;
+  background-clip: padding-box;
+  width: 16px;
+  height: 16px;
+  font-size: 14px;
+  font-weight: bold;
+  line-height: 0;
+  border-radius: 50%;
+  background: #F2F5F9;
+  box-shadow: rgb(0 0 0 / 10%) 0 0px 0px 1px, rgb(0 0 0 / 10%) 2px 1px 1px 0px;
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 2;
+}
+[${ROOT_SELECTOR}-bulk] > div:hover::before {
+  background: #FFF;
+}
+[${ROOT_SELECTOR}-bulk] > div::after {
+  content: '';
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  position: absolute;
+  box-shadow: rgb(0 0 0 / 15%) 0px 0px 0px 1px;
+  top: -2px;
+  left: 2px;
+  z-index: 1;
+}
+`;
+
+Stimulus.register("collapsible_list", class extends Controller {
+  static targets = ["name"];
+
+  initialize() {
+    const listElement = document.querySelector(LIST_SELECTOR);
+    this.render(listElement)
+  }
+
+  render(listElement) {
+    // Processes the list and makes it collapse, if that makes sense
+    // (if the expanded list was long and would cause scrolling).
+    // Returns the processed list.
+    const branchList = prepareList(listElement);
+
+    // Do it if that makes sense (if there are branches
+    // in the list that could in principle be collapsible):
+    if (branchList.length > 0) {
+      processList(branchList);
+      addStyleElement(this.element, STYLE);
+
+      // Uncomment to add buttons for bulk operations:
+      // listElement.before(createBulkHandler(branchList));
+    }
+  }
+
+});
+
+function addStyleElement(target, styleTextContent) {
+  const style = document.createElement('style');
+  style.setAttribute("collapsible-list-style", '');
+  style.textContent = styleTextContent;
+  target.prepend(style);
+}
+
+function prepareList(target) {
+  const ulList = [...target.querySelectorAll('ul')];
+  const ulHandlerList = ulList.map(
+    ul => {
+      const parent = ul.parentNode;
+      const ulHandler = document.createElement('div');
+
+      parent.insertBefore(ulHandler, ul);
+      // Required:
+      parent.style = "position:relative";
+      return ulHandler;
+    }
+  )
+  return ulHandlerList;
+}
+
+function createBulkHandler(list) {
+  const bulk = document.createElement('div');
+  bulk.setAttribute(`${ROOT_SELECTOR}-bulk`, '');
+
+  const bulkPlus = document.createElement('div');
+  bulkPlus.dataset.action = SYMBOL_PLUS;
+  const bulkMinus = document.createElement('div');
+  bulkMinus.dataset.action = SYMBOL_MINUS;
+
+  // add event listeners
+  bulkPlus.addEventListener('click', () => {
+    bulkToggle(list, 'closed');
+  });
+  bulkMinus.addEventListener('click', () => {
+    bulkToggle(list, 'open');
+  });
+
+  bulk.append(bulkPlus, bulkMinus);
+  return bulk;
+}
+
+function processList(list) {
+  // This defines how a document is opened:
+  // with a collapsed or expanded TOC.
+  const storage = sessionStorage.getItem('collapsibleToc');
+
+  // If there is no information in the storage, we set the default list state.
+  const initState = storage || LIST_DEFAULT;
+
+  list.forEach(item => {
+    item.dataset[BRANCH_SELECTOR] = initState;
+
+    // add event listeners
+    item.addEventListener('click', () => {
+      toggle(item);
+    });
+    item.addEventListener('dblclick', () => {
+      bulkToggle(list, item.dataset[BRANCH_SELECTOR]);
+    });
+  })
+}
+
+function toggle(item) {
+  const oldState = item.dataset[BRANCH_SELECTOR];
+  const nextState = (oldState === 'closed') ? 'open' : 'closed';
+  item.dataset[BRANCH_SELECTOR] = nextState;
+}
+
+function bulkToggle(list, oldState) {
+  const nextState = (oldState === 'closed') ? 'open' : 'closed';
+  // Add last bulk to local storage:
+  sessionStorage.setItem('collapsibleToc', nextState);
+  // Update list:
+  list.forEach(el => el.dataset[BRANCH_SELECTOR] = nextState);
+}

{strictdoc-0.0.40 → strictdoc-0.0.41a0}/strictdoc/export/html/_static/controllers/dropdown_menu_controller.js

@@ -24,7 +24,6 @@ Stimulus.register("dropdown_menu", class extends Controller {
   }
 
   registerListEvents(params) {
-
     const toggle = this.element.querySelector(HANDLER_SELECTOR);
     const content = this.element.querySelector(LIST_SELECTOR);
 
@@ -43,11 +42,14 @@ Stimulus.register("dropdown_menu", class extends Controller {
       JSON.parse(toggle.getAttribute('aria-expanded')) ? hide() : show();
     })
 
+    const buttonList = [...content.querySelectorAll('a')];
+    buttonList.forEach(button => {
+      button.addEventListener('click', event => hide());
+    })
+
     const handleClosure = event => !content.contains(event.target) && hide();
 
     window.addEventListener('click', handleClosure);
     window.addEventListener('focusin', handleClosure);
-
-
   }
 });

{strictdoc-0.0.40 → strictdoc-0.0.41a0}/strictdoc/export/html/_static/controllers/editable_field_controller.js

@@ -33,7 +33,7 @@ Stimulus.register("editablefield", class extends Controller {
       hidden.value = text;
     });
 
-    if(isSingle) {
+    if (isSingle) {
       editable.addEventListener('keydown', (event) => {
         if (event.key === 'Enter') {
           event.preventDefault();

strictdoc-0.0.41a0/strictdoc/export/html/_static/controllers/scroll_into_view_controller.js

@@ -0,0 +1,9 @@
+import { Controller } from "/_static/stimulus.js";
+
+Stimulus.register("scroll_into_view", class extends Controller {
+  connect() {
+    // console.log(this.element)
+    // this.element.scrollIntoViewIfNeeded()
+    this.element.scrollIntoView()
+  }
+});

{strictdoc-0.0.40 → strictdoc-0.0.41a0}/strictdoc/export/html/_static/element.css

@@ -4,6 +4,11 @@
   text-decoration: none;
 }
 
+svg {
+  /* Disable shrinking of icons in flex strings */
+  flex-shrink: 0;
+}
+
 /* a */
 
 a {
@@ -45,7 +50,9 @@ a[aria-disabled="true"] {
 
 .actions_group {
   display: flex;
-  column-gap: var(--base-rhythm);
+  /* header context: */
+  column-gap: calc(var(--base-rhythm)/2);
+  margin-left: auto;
 }
 
 .action_button,
@@ -363,24 +370,13 @@ svg.svg_icon {
   height: calc(var(--base-rhythm)*6);
   display: flex;
   align-items: center;
-  column-gap: var(--base-rhythm);
+  justify-content: flex-start;
+  /* column-gap: var(--base-rhythm); */
+  column-gap: calc(var(--base-rhythm)/2);
+  padding-left: calc(var(--base-rhythm)*2);
   padding-right: var(--base-rhythm);
   border-bottom: var(--base-border);
-}
-
-.header__r {
-  margin-left: auto;
-}
-
-.header__document {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0 var(--base-rhythm);
-  padding-left: calc(var(--base-rhythm)*2);
-  column-gap: calc(var(--base-rhythm)/2);
   min-width: 0;
-  line-height: 1.5;
 }
 
 .header__document_title {
@@ -388,17 +384,9 @@ svg.svg_icon {
   white-space: nowrap;
   text-overflow: ellipsis;
   font-size: var(--font-size-sm);
-  font-weight: 700;
-}
+  font-weight: 900;
 
-.header__project {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0 var(--base-rhythm);
-  padding-left: calc(var(--base-rhythm)*2);
-  column-gap: calc(var(--base-rhythm)/2);
-  min-width: 0;
+  flex-shrink: 0.1;
 }
 
 .header__project_name {
@@ -406,7 +394,10 @@ svg.svg_icon {
   white-space: nowrap;
   text-overflow: ellipsis;
   font-size: var(--font-size-sm);
-  font-weight: 700;
+  font-weight: 500;
+  min-width: calc(var(--base-rhythm)*2.5);
+
+  flex-shrink: 100;
 }
 
 /* .footer */
@@ -646,139 +637,52 @@ sdoc-menu-handler[aria-expanded="true"] svg {
   margin-bottom: calc(var(--base-rhythm)*2);
 }
 
-/* toc */
-
-.toc_panel {
-  --toc_panel__controls-height: calc(var(--base-rhythm)*6);
-
-  position: relative;
-  height: 100%;
-}
-
-.toc_handler {
-  cursor: pointer;
-  user-select: none;
-  margin-right: auto;
+/* tree */
 
-  position: absolute;
-  z-index: 10;
-}
-
-.toc_panel__header {
-  font-size: var(--font-size-xsm);
-  white-space: nowrap;
-  margin-right: auto;
-  margin-left: calc(var(--base-rhythm)*6);
+.tree {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: flex-start;
+  gap: var(--base-rhythm);
+  padding-top: var(--base-rhythm);
 }
 
-.toc_panel__content {
-  height: 100%;
-  overflow-y: scroll;
-
-  min-width: 250px;
-
-  border-right: var(--base-border);
-  padding: calc(var(--base-rhythm)*8) calc(var(--base-rhythm)*2);
-
+a.tree_item,
+.tree_item {
+  display: flex;
+  align-items: flex-start;
+  justify-content: flex-start;
+  column-gap: var(--base-rhythm);
   font-size: var(--font-size-sm);
-
-  transition: margin-left .5s;
-  scrollbar-color: transparent var(--scrollbarBG);
-}
-
-.toc_panel__content:hover {
-  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
-}
-
-.toc_panel__content::-webkit-scrollbar-thumb {
-  background-color: transparent;
-}
-
-.toc_panel__content:hover::-webkit-scrollbar-thumb {
-  background-color: var(--thumbBG)
-}
-
-[data-toc_state="close"] .toc_panel__content {
-  width: 250px;
-  margin-left: -333px;
-}
-
-[data-toc_state="open"] .toc_panel__content {
-  width: auto;
-  margin-left: 0;
-}
-
-[data-toc_state="close"] .toc_panel__overlay {
-  display: none;
-}
-
-[data-toc_state="open"] .toc_panel__overlay {
-  display: block;
-}
-
-[data-toc_state="open"] .toc_handler {
-  color: rgba(0,0,0,0.3);
+  min-width: 0;
+  line-height: 1.5;
+  width: 99%; /* To calculate cite overflow  */
 }
 
-[data-toc_state="close"] .toc_handler line.arrw,
-[data-toc_state="open"] .toc_handler line.horz {
-  display: none;
+a.tree_item:hover {
+  /* color: var(--color-bg-main);
+  fill: var(--color-bg-main); */
 }
 
-.toc_handler:hover {
+.tree_item[active] {
   color: var(--color-fg-contrast);
 }
 
-.toc_panel__overlay {
-  position: absolute;
-  z-index: 2;
-  top: 0;
-
-  left: 0;
-  width: 100%;
-  height: 100%;
-  /* overflow: hidden; */
-  /* scrollbar-gutter: stable; */
-  overflow-y: scroll;
-  overflow-x: hidden;
-
-  pointer-events: none;
-}
-
-.toc_panel__overlay::after,
-.toc_panel__overlay::before {
-  content: '';
-  position: absolute;
-  left: 0;
-  right: 0;
-
-  pointer-events: none;
-}
-
-.toc_panel__overlay::before {
-  top: 0;
-  height: calc(var(--toc_panel__controls-height)*2);
-  background: linear-gradient(180deg, var(--color-bg-main) 0%, var(--color-bg-main) 50%, transparent 70%, transparent 100%);
-}
-
-.toc_panel__overlay::after {
-  bottom: 0;
-  height: var(--toc_panel__controls-height);
-  background: linear-gradient(0deg, var(--color-bg-main) 0%, transparent 100%);
+.document_title {
+  font-size: var(--font-size-sm);
+  font-weight: 700;
+  width: 99%; /* To calculate cite overflow  */
 }
 
-.toc_panel__control {
-  position: absolute;
-  pointer-events: all;
-
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-  column-gap: var(--base-rhythm);
-  padding-right: var(--base-rhythm);
-  width: 100%;
-  height: var(--toc_panel__controls-height);
-  background-color: var(--color-bg-main);
+.document_title[data-file_name]::after {
+  content: attr(data-file_name);
+  display: block;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  width: 99%; /* To calculate cite overflow  */
+  font-weight:400;
+  opacity:0.6;
 }
 
 /* toc */