@leed-ai/cli 0.0.0-stage → 6.19.0

package/dist/static/tailwind/components/api-methods.css

@@ -0,0 +1,39 @@
+:root {
+  /* HTTP Method Color Variables */
+  --method-text-inverted: var(--color-white);
+  --method-get-bg: var(--color-green-100);
+  --method-get-text: var(--color-green-700);
+  --method-post-bg: var(--color-blue-100);
+  --method-post-text: var(--color-blue-700);
+  --method-put-bg: var(--color-purple-100);
+  --method-put-text: var(--color-purple-700);
+  --method-patch-bg: var(--color-orange-100);
+  --method-patch-text: var(--color-orange-700);
+  --method-delete-bg: var(--color-red-100);
+  --method-delete-text: var(--color-red-700);
+  --method-options-bg: var(--color-gray-100);
+  --method-options-text: var(--color-gray-700);
+  --method-head-bg: var(--color-indigo-100);
+  --method-head-text: var(--color-indigo-700);
+  --method-trace-bg: var(--color-pink-100);
+  --method-trace-text: var(--color-pink-700);
+
+  @media (prefers-color-scheme: dark) {
+    --method-get-bg: var(--color-green-700);
+    --method-get-text: var(--color-green-400);
+    --method-post-bg: var(--color-blue-700);
+    --method-post-text: var(--color-blue-400);
+    --method-put-bg: var(--color-purple-700);
+    --method-put-text: var(--color-purple-400);
+    --method-patch-bg: var(--color-orange-700);
+    --method-patch-text: var(--color-orange-400);
+    --method-delete-bg: var(--color-red-700);
+    --method-delete-text: var(--color-red-400);
+    --method-options-bg: var(--color-gray-700);
+    --method-options-text: var(--color-gray-400);
+    --method-head-bg: var(--color-indigo-700);
+    --method-head-text: var(--color-indigo-400);
+    --method-trace-bg: var(--color-pink-700);
+    --method-trace-text: var(--color-pink-400);
+  }
+}

package/dist/static/tailwind/components/breadcrumbs.css

@@ -0,0 +1,31 @@
+.leed-breadcrumbs {
+  @apply mt-0 lg:mt-4;
+  /* Base container styling */
+  .leed-breadcrumbs__crumbs {
+    @apply flex items-center rounded-md p-0 m-0;
+  }
+
+  i {
+    &.home {
+      @apply fa-solid leed-icon-home text-(--component-text-color) hover:text-(--component-anchor-text-color);
+    }
+
+    &.leed-breadcrumbs__separator {
+      @apply fa-solid leed-icon-chevron-right text-(--component-text-color)/60 inline-block text-[10px] mx-2;
+    }
+  }
+
+  /* Individual breadcrumb item */
+  .leed-breadcrumbs__crumb {
+    @apply inline-flex items-center text-sm sm:text-sm;
+
+    a {
+      @apply text-(--component-text-color) hover:text-(--component-body-link-color) font-normal transition-colors duration-300;
+    }
+
+    /* Current page styling */
+    a[aria-current="location"] {
+      @apply text-(--component-text-color) font-medium pointer-events-none;
+    }
+  }
+}

package/dist/static/tailwind/components/code.css

@@ -0,0 +1,88 @@
+/**
+ * Base for all diagrammatic content and code
+ *
+ * Code customization - most is in the hljs file!
+ */
+pre {
+  @apply bg-(--component-code-bg-color) dark:bg-(--component-code-bg-color);
+
+  /**
+   * The top padding is clearance for the copy button, which sits over the
+   * block's top-right corner. It is a variable so a site that puts the button
+   * somewhere else — a caption row, a toolbar — can zero it instead of
+   * fighting `p-0!` against a hole it did not ask for:
+   *
+   *   .my-code-card pre { --code-copy-clearance: 0; }
+   */
+  &:has(code.hljs) {
+    @apply block overflow-x-auto min-w-0 max-w-full p-0.5 rounded-2xl border border-(--component-code-border-color)/10 selection:bg-(--component-code-bg-color-selection);
+    padding-top: var(--code-copy-clearance, --spacing(8));
+  }
+
+  &:has(code.math) {
+    @apply flex text-center justify-center text-(--component-code-math-text-color) p-4 overflow-x-auto whitespace-pre-wrap rounded;
+  }
+
+  > code {
+    @apply bg-(--component-code-inner-bg-color) p-4 rounded-2xl;
+  }
+
+  > code.math {
+    @apply block w-full;
+  }
+
+  &.mermaid {
+    @apply bg-transparent! flex justify-center;
+
+    > svg {
+      @apply block;
+    }
+  }
+}
+
+/**
+ * Used to provide copying of code blocks
+ */
+.code-block-wrapper {
+  /* The button is positioned against this wrapper, which the runtime injects
+     around `pre > code`. A site that wants the button in its own chrome — a
+     <figcaption> above the block, say — sets --code-copy-anchor: static here
+     and `position: relative` on whichever element should hold it instead. */
+  position: var(--code-copy-anchor, relative);
+
+  &:hover .copy-code-button,
+  &.just-copied .copy-code-button {
+    @apply opacity-100;
+  }
+
+  /* Copy button styling - hidden by default */
+  .copy-code-button {
+    @apply absolute top-1 right-2 px-1! py-0! rounded cursor-pointer text-(--component-text-color)/20 dark:text-(--component-text-color)/40 border-0! border-(--component-border-color) transition-all duration-200 hover:text-(--component-text-color)/50 dark:hover:text-(--component-text-color) hover:scale-105 ring-0! shadow-none!;
+
+    i.copy {
+      @apply fa-fw fa-regular leed-icon-copy;
+    }
+
+    /* Success state styling */
+    &.copied {
+      @apply text-(--component-body-link-color);
+
+      i.copy {
+        @apply fa-fw fa-solid leed-icon-check;
+      }
+    }
+  }
+
+  /**
+   * Success message notification.
+   *
+   * Centered on the button rather than aligned to its top. Identical for a
+   * button the height of its own icon, and correct for one a site has
+   * stretched — to fill a caption row, for instance — where top:0 pinned the
+   * badge to the top of that row instead of its middle.
+   */
+  .code-copied-notification {
+    @apply copied-notification absolute top-1/2 right-full mr-2;
+    transform: translateY(-50%);
+  }
+}

package/dist/static/tailwind/components/collapsible.css

@@ -0,0 +1,38 @@
+/**
+ * Details - Summary Collapsible style
+ */
+details {
+  @apply border-(--component-border-color)/20 dark:border-(--component-border-color)/10 border rounded-2xl overflow-hidden mt-4;
+  > p,
+  details {
+    @apply mx-6 mt-2 mb-6;
+  }
+  &[open] {
+    @apply pb-4;
+  }
+}
+
+summary {
+  @apply pl-10 pr-5 py-4 cursor-pointer relative;
+  &:hover {
+    @apply bg-(--component-code-bg-color) dark:bg-(--component-code-bg-color)/50;
+  }
+}
+
+summary::-webkit-details-marker {
+  display: none;
+}
+
+summary::marker {
+  content: "";
+}
+
+summary::after {
+  @apply fa leed-icon-caret-right absolute left-5 top-[22px] text-xs transition-transform;
+  content: var(--fa);
+}
+
+/* Rotate when open */
+details[open] > summary::after {
+  transform: rotate(90deg);
+}

package/dist/static/tailwind/components/document-search.css

@@ -0,0 +1,222 @@
+/* Search Trigger Styles */
+#document-search-container {
+  @apply relative z-99 flex-1 text-right lg:text-left;
+
+  .search-icon {
+    @apply fa-solid leed-icon-search;
+  }
+
+  .search-result-icon {
+    @apply fa-solid leed-icon-hashtag text-(--component-text-color) text-base;
+  }
+
+  .search-result-goto-icon {
+    @apply fa-solid leed-icon-chevron-right text-(--component-text-color) text-lg opacity-0 transition-opacity duration-200;
+  }
+
+  .search-history-icon {
+    @apply fa-regular leed-icon-clock text-(--component-text-color) text-lg;
+  }
+
+  #document-search {
+    .search-trigger-button {
+      @apply bg-transparent lg:bg-(--component-search-button-bg-color) h-10 border-0 lg:border border-(--component-header-border-color)/20 dark:border-(--component-header-border-color)/10 hover:border-(--component-header-border-color)/50 dark:hover:border-(--component-header-border-color)/20 text-(--component-text-color) text-left text-sm rounded-lg lg:w-full px-5 lg:px-10 py-2 cursor-pointer relative;
+
+      .search-icon {
+        @apply lg:absolute left-3 top-3 scale-[1.4] lg:scale-100;
+      }
+
+      .search-trigger-shortcut {
+        @apply absolute right-3 top-3 text-xs;
+      }
+    }
+  }
+}
+
+/* Compact trigger — `{{> leed/docs/document-search compact=true }}`.
+   Icon only, sized to its content rather than filling the row, for a custom
+   `docs-header.hbs` with no room for the full control. Selectors carry one more
+   class than the defaults above so they win inside the same layer, and each
+   `lg:` default is restated so the override holds at the breakpoint too. */
+#document-search-container.search-compact {
+  @apply flex-none text-center;
+
+  #document-search .search-trigger-button {
+    @apply inline-flex items-center justify-center w-10 lg:w-10 h-10 px-0 lg:px-0;
+
+    .search-icon {
+      @apply static lg:static scale-100 lg:scale-100;
+    }
+  }
+}
+
+/* Search Modal Styles */
+#document-search-modal {
+  @apply fixed z-9999999 flex inset-0 items-center justify-center transition-opacity duration-200 ease-in-out;
+
+  /* Icon Styles */
+
+  .search-modal-backdrop {
+    @apply fixed inset-0 bg-black/20 backdrop-blur-sm;
+  }
+
+  .search-modal-content {
+    @apply relative z-50 flex flex-col bg-(--component-search-modal-bg-color) border border-(--component-header-border-color)/5 rounded-2xl p-2 w-full max-w-2xl mx-auto min-h-75 max-h-[66vh] transition-all duration-200 ease-in-out scale-100 opacity-100;
+
+    .search-input-container {
+      @apply flex items-center justify-center relative;
+
+      .search-input-field {
+        @apply px-12 py-2 w-full rounded-2xl bg-transparent border border-(--component-header-border-color)/50 dark:border-(--component-header-border-color)/50 focus:ring-0 focus:border-(--component-header-border-color)/50 dark:focus:border-(--component-header-border-color)/50;
+      }
+
+      .search-icon {
+        @apply absolute left-4 top-3.5 fa-solid leed-icon-search;
+      }
+
+      .search-escape-hint {
+        @apply absolute right-3 top-2.25 bg-gray-300 dark:bg-(--component-text-color)/50 rounded-md text-xs font-semibold py-1 px-3;
+      }
+    }
+    .search-result-icon {
+      @apply fa-solid leed-icon-hashtag text-(--component-text-color)/50 text-base;
+    }
+
+    .search-result-goto-icon {
+      @apply fa-solid leed-icon-chevron-right text-(--component-text-color)/50 text-lg opacity-0 transition-opacity duration-200;
+    }
+
+    .search-history-icon {
+      @apply fa-regular leed-icon-clock text-(--component-text-color)/50 text-lg;
+    }
+  }
+
+  /* Live docs search (#329): page-type filter chips above the results. Empty and
+     therefore invisible on the Lunr path, which renders no chips. */
+  .search-filter-chips {
+    @apply flex flex-wrap gap-2 empty:hidden px-2 pt-3;
+
+    .search-filter-chip {
+      @apply bg-transparent border border-(--component-header-border-color)/30 text-(--component-text-color) text-xs rounded-full px-3 py-1 cursor-pointer transition-colors duration-200 hover:border-(--component-header-border-color)/60;
+
+      /* The chip for the doc set the reader is currently in — offered first and
+         marked, so scoping to it is one obvious click. */
+      &.is-current {
+        @apply border-(--component-body-link-color)/60 text-(--component-body-link-color);
+      }
+
+      &.is-active {
+        @apply bg-(--component-header-bg-color) border-(--component-header-border-color)/60 font-medium;
+      }
+    }
+  }
+
+  .search-results-container {
+    @apply flex-1 overflow-y-auto;
+
+    /* Whether a hit came from the keyword index, the semantic index, or both. */
+    .search-match-badge {
+      @apply ml-2 bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300 px-1.5 py-0.5 rounded text-[10px] uppercase tracking-wide;
+    }
+
+    /* Search Result Styles.
+
+       `bg-(--component-search-result-bg-color)` is the row's RESTING ground and
+       resolves to `transparent` unless a theme or site sets it, which is what
+       the list shipped with — so adding it changed nothing. It has to stay the
+       weakest of the three grounds: `:hover` below and `.search-result-selected`
+       further down both need to paint over it, and both already out-specify or
+       out-order this rule. */
+    .searched-item {
+      @apply text-sm flex items-center w-full gap-x-3 cursor-pointer p-3 rounded-lg transition-all duration-200 overflow-hidden bg-(--component-search-result-bg-color) hover:bg-(--color-gray-100) dark:hover:bg-(--component-header-bg-color);
+
+      &:hover .search-result-goto-icon,
+      &.search-result-selected .search-result-goto-icon {
+        @apply opacity-100;
+      }
+    }
+
+    /* Search History Styles */
+    .search-history-item {
+      @apply cursor-pointer;
+
+      &:hover {
+        @apply bg-(--color-gray-100) dark:bg-(--component-header-bg-color);
+      }
+    }
+
+    /* Selection Styles */
+    .search-result-selected {
+      @apply bg-(--color-gray-100) dark:bg-(--component-header-bg-color);
+
+      &:hover {
+        @apply bg-(--component-header-bg-color) dark:bg-(--component-header-bg-color);
+      }
+    }
+
+    /* Keyword Highlighting */
+    .search-highlight {
+      @apply text-(--component-body-link-color) font-medium;
+    }
+
+    /* `.search-unavailable` is the explicit "search is temporarily unavailable"
+       state — a distinct message, but the same box as an empty result set. */
+    .search-no-results,
+    .search-unavailable {
+      @apply p-4 text-center;
+    }
+
+    /* Explains a hybrid → free text downgrade above the results. */
+    .search-degraded-note {
+      @apply px-3 pb-2 text-xs text-gray-500 dark:text-gray-400;
+    }
+
+    .search-no-results-title {
+      @apply text-sm mb-2;
+    }
+
+    .search-no-results-subtitle {
+      @apply text-xs text-gray-500;
+    }
+
+    .search-results-header,
+    .search-recent-header {
+      @apply text-sm ml-2 py-3 text-left;
+    }
+
+    .search-result-content {
+      @apply flex flex-1 flex-col gap-1 m-0 overflow-hidden text-left;
+    }
+
+    .search-result-title {
+      @apply m-0 p-0 font-medium text-sm text-gray-900 dark:text-gray-100 leading-tight;
+    }
+
+    .search-result-summary {
+      @apply m-0 p-0 text-xs text-gray-600 dark:text-gray-400 leading-relaxed truncate max-w-full;
+    }
+
+    .search-result-breadcrumb {
+      @apply flex flex-row gap-1 text-xs text-gray-500 dark:text-gray-400 items-center;
+
+      /* Between crumbs only. The row also ends with `.search-match-badge`, so a
+         `:not(:last-child)` rule would put a stray separator before the badge. */
+      .search-crumb + .search-crumb::before {
+        @apply content-["/"] mx-1;
+      }
+    }
+
+    /* Label Styles */
+    .search-result-labels {
+      @apply flex flex-wrap gap-1 ml-2;
+
+      &::before {
+        @apply content-["•"] text-gray-400 mr-1;
+      }
+    }
+
+    .search-label {
+      @apply bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300 px-1.5 py-0.5 rounded text-xs;
+    }
+  }
+}

package/dist/static/tailwind/components/form.css

@@ -0,0 +1,185 @@
+/**
+ * General form defaults for all forms everywhere
+ */
+.leed-form-container {
+  label {
+    @apply block text-sm font-medium text-(--component-text-color) mb-2;
+  }
+
+  .leed-form-heading {
+    @apply font-semibold text-(--component-header-3-color);
+  }
+
+  .leed-form-details,
+  .leed-form-welcome-back {
+    @apply text-sm mt-2;
+  }
+
+  .leed-form-details {
+    @apply pl-1 w-full text-left;
+  }
+
+  .leed-form-welcome-back {
+    @apply text-sm font-medium text-center;
+  }
+
+  input[type="checkbox"] + label,
+  input[type="radio"] + label {
+    @apply m-0;
+  }
+
+  fieldset {
+    @apply border-1 border-(--component-form-border-color) p-4 dark:border-(--component-form-border-color)/30;
+  }
+
+  div.checkbox,
+  div.radio {
+    @apply flex items-start gap-2;
+
+    input[type="checkbox"],
+    input[type="radio"] {
+      @apply mt-1;
+    }
+  }
+
+  .leed-form {
+    @apply mt-4;
+
+    input[type="email"],
+    input[type="tel"],
+    input[type="text"],
+    button,
+    fieldset,
+    select,
+    textarea {
+      @apply rounded-lg;
+    }
+
+    input:not([type="radio"]):not([type="checkbox"]):not([type="range"]),
+    select {
+      @apply pr-8;
+
+      option {
+        @apply text-(--component-text-color) bg-(--component-bg-color);
+
+        &:hover {
+          @apply bg-(--component-primary-color)/10;
+        }
+      }
+    }
+
+    button,
+    select,
+    textarea,
+    input {
+      @apply border-1 transition-all duration-300 bg-transparent border-(--component-form-border-color) hover:border-(--component-form-border-color-hover) focus:border-(--component-primary-color);
+    }
+
+    select,
+    textarea {
+      @apply px-3 py-2 w-full focus:outline-none;
+    }
+
+    input[type="checkbox"],
+    input[type="radio"] {
+      @apply text-(--component-primary-color);
+    }
+
+    textarea {
+      @apply resize-none;
+    }
+
+    select,
+    textarea,
+    input[type="email"],
+    input[type="tel"],
+    input[type="text"] {
+      @apply bg-(--component-bg-color) text-(--component-text-color)/70 placeholder:text-(--component-text-color)/30 text-sm pl-4 py-2.5 px-0 w-full;
+    }
+    select {
+      @apply placeholder:text-(--component-text-color);
+    }
+
+    input[type="radio"],
+    input[type="checkbox"] {
+      @apply checked:bg-(--component-primary-color) active:bg-(--component-primary-color)/20;
+    }
+
+    input[type="radio"] {
+      @apply bg-none;
+    }
+
+    input[type="checkbox"] {
+      @apply w-5 h-5 rounded-xs shadow-none;
+    }
+
+    input[type="radio"] {
+      @apply w-5 h-5 rounded-full;
+    }
+
+    label {
+      @apply ml-1 align-middle;
+    }
+
+    button {
+      @apply bg-(--component-text-color)/10 hover:bg-(--component-text-color)/20 focus:bg-(--component-bg-color)/80 border-(--form-border-color) font-medium focus:outline-none inline-grid! text-sm w-full sm:w-auto px-5 py-2.5;
+    }
+
+    /**
+     * Unsubscribe form
+     */
+    #unsubscribeForm {
+      .leed-form-block {
+        @apply my-4 sm:my-6 px-6 sm:px-8;
+      }
+      .explanation {
+        @apply font-medium mt-10 sm:mt-14 text-2xl sm:text-3xl text-(--component-text-color) pb-8 mb-8 sm:mb-16 border-b-2 text-center;
+      }
+      .leed-form-block label {
+        @apply text-base sm:text-xl font-medium;
+      }
+      #unsubscribe-button {
+        @apply mt-8 sm:mt-12 w-full bg-red-600 ring-red-600 hover:bg-red-700 focus:bg-red-700 focus:ring-red-500 active:bg-red-800 active:ring-red-400 text-white! active:text-zinc-100 font-bold text-lg sm:text-xl py-3 sm:py-4;
+      }
+      #donotcontact-group {
+        @apply border-t-2 pt-4 sm:pt-6;
+      }
+    }
+  }
+}
+
+.leed-documentation {
+  [role="tabpanel"] {
+    .leed-form-container .leed-form-heading {
+      @apply mt-0 text-center;
+    }
+  }
+
+  .leed-form-container {
+    .leed-form-heading {
+      @apply mt-8 text-2xl text-left!;
+    }
+
+    .leed-form-welcome-back {
+      @apply text-left! mt-4;
+    }
+
+    .leed-form-details {
+      @apply text-left! mt-4;
+    }
+
+    form {
+      @apply w-full grid gap-4 mt-4 grid-cols-1 md:grid-cols-2 lg:grid-cols-1 xl:grid-cols-2;
+
+      label {
+        @apply mt-0!;
+      }
+
+      div.checkbox,
+      div.textarea,
+      div.countries {
+        @apply p-0! col-start-1 col-span-full col-span-1 md:col-span-2 lg:col-span-1 xl:col-span-2;
+      }
+    }
+  }
+}

package/dist/static/tailwind/components/kbd.css

@@ -0,0 +1,7 @@
+kbd {
+  @apply bg-gray-100 dark:bg-gray-800 border border-gray-300 dark:border-white/20 rounded px-2 py-1 font-mono text-sm shadow-sm;
+}
+
+li:has(kbd) {
+  @apply mb-2;
+}

package/dist/static/tailwind/components/pagination.css

@@ -0,0 +1,81 @@
+/**
+ * Site-level pagination — what `leed/components/pagination.hbs` emits.
+ *
+ * NOT the documentation pager. `docs/components/docs-pagination.css` styles
+ * that one, and its classes carry a docs- prefix so the two cannot be confused:
+ * unprefixed `pagination-*` is always this component.
+ *
+ * This file exists because the partial shipped markup that nothing styled:
+ * .pagination-list, .pagination-active, .pagination-inactive,
+ * .pagination-ellipsis, .pagination-page-range and the two arrow glyphs
+ * appeared in zero stylesheets, so any site with a paginated list page — the
+ * blog index in every starter — rendered unstyled anchors and two empty <i>
+ * elements where the arrows should be.
+ *
+ * Colors come from the --component-pagination-* chain already declared in
+ * components.css, which resolves --docs-* then --site-* then a default. A site
+ * restyles this by setting --site-pagination-* rather than by overriding rules.
+ */
+
+.pagination-page-range {
+  @apply text-(--component-text-color)/70;
+}
+
+.pagination-list {
+  @apply isolate inline-flex items-center gap-1;
+}
+
+/* One page number. Both states share the box so the row does not reflow when
+   the current page moves. */
+.pagination-list .pagination-active,
+.pagination-list .pagination-inactive,
+.pagination-list .pagination-ellipsis {
+  @apply inline-flex min-w-9 items-center justify-center rounded-md px-2 py-1.5 text-sm no-underline transition-colors duration-150;
+}
+
+.pagination-list .pagination-inactive {
+  @apply cursor-pointer text-(--component-text-color)/60 hover:bg-(--component-text-color)/5 hover:text-(--component-text-color);
+}
+
+.pagination-list .pagination-active {
+  @apply font-semibold text-(--component-text-color);
+  background-color: color-mix(in srgb, var(--component-primary-color) 12%, transparent);
+}
+
+.pagination-list .pagination-ellipsis {
+  @apply pointer-events-none text-(--component-text-color)/40;
+}
+
+/**
+ * The arrows.
+ *
+ * The partial emits empty <i class="back-arrow"> / <i class="next-arrow">, so
+ * the glyph has to come from here or nothing renders at all. Font Awesome is
+ * already a dependency of every site.
+ */
+.pagination-list .arrow {
+  @apply inline-flex items-center;
+}
+
+.pagination-list .back-arrow,
+.pagination-list .next-arrow,
+.pagination-list .ellipsis {
+  @apply text-(--component-pagination-icon-color);
+}
+
+.pagination-list .pagination-inactive:hover .back-arrow,
+.pagination-list .pagination-inactive:hover .next-arrow {
+  @apply text-(--component-pagination-icon-color-hover);
+}
+
+.pagination-list .back-arrow {
+  @apply fa-fw fa-solid leed-icon-arrow-left;
+}
+
+.pagination-list .next-arrow {
+  @apply fa-fw fa-solid leed-icon-arrow-right;
+}
+
+.pagination-list .ellipsis {
+  @apply fa-fw fa-solid leed-icon-ellipsis;
+}

package/dist/static/tailwind/components/scroll-status-indicator.css

@@ -0,0 +1,5 @@
+.leed-documentation {
+  #scroll-status-indicator-horizontal {
+    @apply fixed top-0 left-0 right-0 bg-transparent! z-999!;
+  }
+}