@webwriter/slides/custom-elements.json

Present content as a sequence of slides or tabs.

{
  "schemaVersion": "1.0.0",
  "readme": "",
  "modules": [
    {
      "kind": "javascript-module",
      "path": "src/widgets/webwriter-slides.ts",
      "declarations": [
        {
          "kind": "class",
          "description": "Container for displaying a slideshow of content sequentially.",
          "name": "WebwriterSlides",
          "slots": [
            {
              "description": "Slide elements to be displayed (should be `webwriter-slide` components only).",
              "name": "default"
            }
          ],
          "members": [
            {
              "kind": "field",
              "name": "localize",
              "privacy": "protected",
              "default": "LOCALIZE"
            },
            {
              "kind": "field",
              "name": "_boundKeyHandler",
              "type": {
                "text": "(e: KeyboardEvent) => void"
              },
              "privacy": "private"
            },
            {
              "kind": "method",
              "name": "_handleKeyDown",
              "parameters": [
                {
                  "name": "e",
                  "type": {
                    "text": "KeyboardEvent"
                  }
                }
              ],
              "description": "Handles keyboard navigation for the slideshow.\nArrowRight advances to the next slide, ArrowLeft goes back.\nOnly possible in preview mode."
            },
            {
              "kind": "field",
              "name": "scopedElements",
              "type": {
                "text": "object"
              },
              "privacy": "protected",
              "static": true,
              "default": "{ \"sl-button\": SlButton, \"sl-icon-button\": SlIconButton, \"sl-tooltip\": SlTooltip, 'sl-select': SlSelect, 'sl-option': SlOption }"
            },
            {
              "kind": "field",
              "name": "activeSlideIndex",
              "type": {
                "text": "number"
              },
              "default": "0",
              "description": "Index of the currently active slide."
            },
            {
              "kind": "field",
              "name": "activeSlide",
              "type": {
                "text": "WebwriterSlide"
              },
              "description": "The active slide element based on the activeSlideIndex.",
              "readonly": true
            },
            {
              "kind": "field",
              "name": "draggingIndex",
              "type": {
                "text": "number | null"
              },
              "privacy": "private",
              "default": "null"
            },
            {
              "kind": "field",
              "name": "lastDraggedOver",
              "type": {
                "text": "number"
              },
              "privacy": "private",
              "default": "-1",
              "description": "Index of the slide currently being dragged over (for drag-and-drop functionality)."
            },
            {
              "kind": "field",
              "name": "isFullscreen",
              "privacy": "protected",
              "description": "Whether the slideshow is currently displayed in fullscreen mode.",
              "readonly": true
            },
            {
              "kind": "field",
              "name": "iconSrc",
              "privacy": "protected",
              "description": "Icon source URL depending on fullscreen state (enter/exit).",
              "readonly": true
            },
            {
              "kind": "field",
              "name": "slides",
              "type": {
                "text": "WebwriterSlide[]"
              },
              "privacy": "protected",
              "description": "All `webwriter-slide` elements. \nRepresents the individual slides in the slideshow."
            },
            {
              "kind": "field",
              "name": "type",
              "type": {
                "text": "'tabs' | 'slides'"
              },
              "privacy": "public",
              "default": "'slides'",
              "description": "Defines the type of view for the slideshow.\n- \"slides\": Show content as sequential slides.\n- \"tabs\": Show content using tabs.",
              "attribute": "type",
              "reflects": true
            },
            {
              "kind": "method",
              "name": "addSlide",
              "parameters": [
                {
                  "name": "index",
                  "optional": true,
                  "type": {
                    "text": "number"
                  }
                }
              ],
              "description": "Add a new empty slide element. Optionally insert after given index."
            },
            {
              "kind": "method",
              "name": "duplicateSlide",
              "parameters": [
                {
                  "name": "index",
                  "type": {
                    "text": "number"
                  }
                }
              ],
              "description": "Duplicate an existing slide at given index."
            },
            {
              "kind": "method",
              "name": "removeActiveSlide",
              "description": "Remove the currently active slide element."
            },
            {
              "kind": "method",
              "name": "removeSlide",
              "parameters": [
                {
                  "name": "slideIndex",
                  "type": {
                    "text": "number"
                  }
                }
              ],
              "description": "Remove the currently active slide element."
            },
            {
              "kind": "method",
              "name": "nextSlide",
              "parameters": [
                {
                  "name": "backwards",
                  "default": "false"
                },
                {
                  "name": "step",
                  "default": "1"
                }
              ],
              "description": "Activate the next slide element."
            },
            {
              "kind": "field",
              "name": "hasNextSlide",
              "type": {
                "text": "boolean"
              },
              "description": "False if slideshow is on the last slide.",
              "readonly": true
            },
            {
              "kind": "field",
              "name": "hasPreviousSlide",
              "type": {
                "text": "boolean"
              },
              "description": "False if slideshow is on the first slide.",
              "readonly": true
            },
            {
              "kind": "method",
              "name": "handleNextSlideClick",
              "privacy": "protected",
              "parameters": [
                {
                  "name": "e",
                  "type": {
                    "text": "MouseEvent | KeyboardEvent"
                  },
                  "description": "The triggering mouse or keyboard event."
                },
                {
                  "name": "backwards",
                  "default": "false",
                  "description": "Whether to navigate backward (default is false)."
                }
              ],
              "description": "Handles navigation to the next or previous slide based on user input.\n- Shift key: jump by the total number of slides.\n- Ctrl key: jump by 10 slides.\n- Otherwise: move by one slide."
            },
            {
              "kind": "field",
              "name": "changeSlide",
              "privacy": "protected",
              "description": "Changes the active slide to the specified index.\nWaits for rendering to finish, scrolls the active slide into view,\nand generates a thumbnail preview using snapdom.",
              "parameters": [
                {
                  "description": "The index of the slide to activate.",
                  "name": "index"
                }
              ]
            },
            {
              "kind": "method",
              "name": "onDragStart",
              "privacy": "private",
              "parameters": [
                {
                  "name": "e",
                  "type": {
                    "text": "DragEvent"
                  },
                  "description": "The dragstart event."
                },
                {
                  "name": "index",
                  "type": {
                    "text": "number"
                  },
                  "description": "Index of the slide being dragged."
                }
              ],
              "description": "Starts dragging a slide element.\nAdds the 'dragging' CSS class and sets drag data."
            },
            {
              "kind": "method",
              "name": "onDragEnd",
              "privacy": "private",
              "parameters": [
                {
                  "name": "e",
                  "type": {
                    "text": "DragEvent"
                  },
                  "description": "The dragend event."
                }
              ],
              "description": "Ends dragging a slide.\nMoves the dragged slide to its new position if it was moved,\nupdates the active slide index, and cleans up drag state."
            },
            {
              "kind": "method",
              "name": "onDragOver",
              "privacy": "private",
              "parameters": [
                {
                  "name": "e",
                  "type": {
                    "text": "DragEvent"
                  },
                  "description": "The dragover event."
                },
                {
                  "name": "index",
                  "type": {
                    "text": "number"
                  },
                  "description": "Index of the slide being dragged over."
                }
              ],
              "description": "Handles dragging over a slide element.\nPrevents default to allow dropping and records the slide index being hovered."
            }
          ],
          "attributes": [
            {
              "name": "type",
              "type": {
                "text": "'tabs' | 'slides'"
              },
              "default": "'slides'",
              "description": "Defines the type of view for the slideshow.\n- \"slides\": Show content as sequential slides.\n- \"tabs\": Show content using tabs.",
              "fieldName": "type"
            }
          ],
          "superclass": {
            "name": "LitElementWw",
            "package": "@webwriter/lit"
          },
          "tagName": "webwriter-slides",
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "WebwriterSlides",
          "declaration": {
            "name": "WebwriterSlides",
            "module": "src/widgets/webwriter-slides.ts"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "webwriter-slides",
          "declaration": {
            "name": "WebwriterSlides",
            "module": "src/widgets/webwriter-slides.ts"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "src/widgets/webwriter-slide.ts",
      "declarations": [
        {
          "kind": "class",
          "description": "Represents a single slide in the `webwriter-slides` widget.",
          "name": "WebwriterSlide",
          "slots": [
            {
              "description": "The content displayed within the slide.",
              "name": "default"
            }
          ],
          "members": [
            {
              "kind": "field",
              "name": "active",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "description": "Indicates whether the slide is currently active/visible.",
              "attribute": "active",
              "reflects": true
            },
            {
              "kind": "field",
              "name": "thumbnail",
              "type": {
                "text": "string"
              },
              "default": "\"\"",
              "description": "Data URI string for the slide thumbnail (e.g., \"data:image/png;base64,...\"). \nUsed to display a preview image for the slide.",
              "attribute": "thumbnail",
              "reflects": true
            }
          ],
          "attributes": [
            {
              "name": "active",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "description": "Indicates whether the slide is currently active/visible.",
              "fieldName": "active"
            },
            {
              "name": "thumbnail",
              "type": {
                "text": "string"
              },
              "default": "\"\"",
              "description": "Data URI string for the slide thumbnail (e.g., \"data:image/png;base64,...\"). \nUsed to display a preview image for the slide.",
              "fieldName": "thumbnail"
            }
          ],
          "superclass": {
            "name": "LitElementWw",
            "package": "@webwriter/lit"
          },
          "tagName": "webwriter-slide",
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "WebwriterSlide",
          "declaration": {
            "name": "WebwriterSlide",
            "module": "src/widgets/webwriter-slide.ts"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "webwriter-slide",
          "declaration": {
            "name": "WebwriterSlide",
            "module": "src/widgets/webwriter-slide.ts"
          }
        }
      ]
    }
  ]
}