galaxy-charts 0.0.21 → 0.0.23

package/docs/content/vue-utilities.md

@@ -1,70 +0,0 @@
-# Utilities
-
-Galaxy Charts is bundled with utilities to simplify interaction with Galaxy.
-
-## Function: `fetchColumns`
-
-### Description
-Fetches and caches tabular column data from a Galaxy server for use in visualizations. This utility function simplifies access to specific columns within a dataset by retrieving data based on column identifiers provided in the form of keys.
-
----
-
-### Syntax
-```javascript
-const store = useColumnsStore();
-const response = await store.fetchColumns(datasetId, tracks, keys);
-```
-
-### Parameters
-
-| Variable | Type | Description |
-|----------|------|-------------|
-| **datasetId** | `string` | The unique ID of the tabular dataset on the Galaxy server. |
-| **tracks** | `Array<Object>` | An array of track objects, each containing attribute-value pairs where values represent column indices. |
-| **keys** | `Array<string>` | An array of attribute names from the tracks array, each specifying a column number to fetch. |
-
-### Return Value
-
-Returns an `Array<Object>`, where each object represents a track with properties defined by the keys in `keys`. Each property contains an array of data from the specified column.
-
-### Example
-
-Here’s an example of using fetchColumns to prepare data for a plot library.
-
-```javascript
-// Define input parameters
-const datasetId = "Dataset ID of tabular dataset with 4 or more columns"
-const tracks [{ color: "blue", name: "Series 1", x: 0, y: 1 },
-              { color: "gray", name: "Series 2", x: 2, y: 3 }];
-const keys = ["x", "y"];
-
-// Make request to column data provider of Galaxy instance
-const store = useColumnsStore();
-const response = await store.fetchColumns(datasetId, tracks, keys);
-
-// Prepare results for plotting library
-const plotData = [];
-response.forEach((columns, index) => {
-    const track = props.tracks[index];
-    plotData.push({
-        marker: {
-            color: track.color,
-        },
-        name: track.name,
-        x: columns.x,
-        y: columns.y,
-    });
-});
-```
-
-In this example, `columnsList` provides the column data for each track, which is then mapped to `x` and `y` values for plotting. Each track object is styled based on properties like `color` and `name`, before rendering.
-
-### Remarks
-
-- **Galaxy API Dependency**: This function depends on Galaxy's API to retrieve column data, so ensure that you are connected to a Galaxy server.
-
-- **Data Formatting**: The function structures the returned data to align with the attributes specified in keys, simplifying its direct use in visualizations.
-
-- **Caching**: Data is cached for efficient access; repeated calls with the same datasetId, tracks, and keys avoid redundant requests to the server.
-
-This utility is particularly useful for quickly integrating Galaxy’s tabular data with visualization libraries, allowing for flexible and efficient data handling.

package/docs/content/xml-datasources.md

@@ -1,34 +0,0 @@
----
-outline: deep
----
-
-# Data Sources
-
-The Data Sources section is required in the Visualization XML to inform Galaxy of the compatible data types for your visualization.
-
-```xml
-<data_sources>
-    <data_source>
-        <model_class>HistoryDatasetAssociation</model_class>
-        <test test_attr="ext" result_type="datatype">{{ COMPATIBLE_EXTENSION }}</test>
-        <to_param param_attr="id">dataset_id</to_param>
-    </data_source>
-</data_sources>
-<params>
-    <param type="dataset" var_name_in_template="hda" required="true">dataset_id</param>
-</params>
-```
-
-Galaxy supports a variety of datatype extensions:
-<span v-for="(dt, index) of DATATYPES" class="font-italic">
-    <span>`{{ dt }}`</span>
-    <span v-if="index === DATATYPES.length - 1">.</span>
-    <span v-else>,</span>
-</span>
-
-For more information on datatypes please refer to the Galaxy Documentation at: https://docs.galaxyproject.org/en/master/dev/data_types.html.
-
-<script setup>
-const DATATYPES = ["4dn_pairs","4dn_pairsam","a3m","ab1","affybatch","agilentbrukeryep.d.tar","agilentmasshunter.d.tar","agp","ampvis2","analyze75","arff","asn1","asn1-binary","augustus","avi","axt","bam","bcf","bcf_uncompressed","bcsl.model","bcsl.ts","bed","bed12","bed6","bed_tabix.gz","bedgraph","bedstrict","bgzip","bigbed","bigwig","bil","biom1","biom2","blastxml","blib","bref3","brukerbaf.d.tar","brukertdf.d.tar","bus","castep","cel","cell","chain","chira.sqlite","chrint","cif","cisml","ckpt","cmap","cml","cnn","cnr","cns","colab.tar","colab.tar.gz","consensusxml","cool","cps","cpt","cram","csfasta","csv","ct","ctl.result","cuffdiff.sqlite","cxb","d3_hierarchy","daa","dada2_dada","dada2_errorrates","dada2_mergepairs","dada2_sequencetable","dada2_uniques","dbn","dbnsfp.tabular","dcd","deeptools_compute_matrix_archive","deeptools_coverage_matrix","den_fmt","dlib","drf","dta","dta2d","dzi","edr","edta","eland","elandmulti","elib","embl","encodepeak","eset","excel.xls","expression.json","extxyz","fai","fast5.tar","fast5.tar.bz2","fast5.tar.gz","fast5.tar.xz","fasta","fasta.gz","fastg","fastk_hist","fastk_ktab","fastk_prof","fastq","fastq.bz2","fastq.gz","fastqcssanger","fastqcssanger.bz2","fastqcssanger.gz","fastqillumina","fastqillumina.bz2","fastqillumina.gz","fastqsanger","fastqsanger.bz2","fastqsanger.gz","fastqsolexa","fastqsolexa.bz2","fastqsolexa.gz","fcs","featurexml","ffdata","ffindex","fits","flowclr","flowframe","flowmfi","flowscore","flowset","flowstat1","flowstat2","flowstat3","flowtext","flv","fped","fphe","fps","fqtoc","fsom","gafa.sqlite","gal","gatk_dbsnp","gatk_interval","gatk_recal","gatk_report","gatk_tranche","gemini.sqlite","genbank","genbank.gz","genenotebook","geojson","gfa1","gfa1.gz","gfa2","gfa2.gz","gff","gff3","gff3.bz2","gff3.gz","gff_tabix.gz","gii","gii.gz","gmsh.geo","gmsh.msh","gpr","grd","grd.tgz","grib","gro","gtf","h5","h5ad","h5mlm","hdf4","hdr","hdt","hep.root","hexrd.accepted_orientations","hexrd.eta_ome.npz","hexrd.images.npz","hexrd.materials.h5","hexrd.scored_orientations.npz","hexrd.yml","hhr","hlf","hmm2","hmm3","icm","idat","ideaspre","idpdb","idxml","imgt.json","imzml","inchi","inp","inpcrd","intermine_tabular","interval","ipynb","isa-json","isa-tab","itp","jellyfish","jp2","json","jsonld","juicer_medium_tabix.gz","kallisto.idx","kroenik","lav","ldindep","len","loom","lped","ludwig_model","maf","magres","malist","mascotxml","maskinfo-asn1","maskinfo-asn1-binary","mcool","mdp","memepsp","memexml","meryldb","metacyto_clr.txt","metacyto_stats.txt","metacyto_summary.txt","mgf","mkv","mol","mol2","mongodb","mothur.accnos","mothur.align","mothur.align.check","mothur.align.report","mothur.axes","mothur.cons.taxonomy","mothur.count_table","mothur.design","mothur.dist","mothur.filter","mothur.filtered.masked.quan","mothur.filtered.quan","mothur.freq","mothur.groups","mothur.list","mothur.lower.dist","mothur.map","mothur.masked.quan","mothur.names","mothur.oligos","mothur.otu","mothur.otu.corr","mothur.otulabels","mothur.pair.dist","mothur.quan","mothur.rabund","mothur.rdp.taxonomy","mothur.ref.taxonomy","mothur.relabund","mothur.sabund","mothur.seq.taxonomy","mothur.sff.flow","mothur.shared","mothur.square.dist","mothur.summary","mothur.tax.summary","mothur.tre","mov","mp3","mp4","mpg","mrc","mrm","ms2","msh","msp","mtx","mz.sqlite","mz5","mzdata","mzid","mzml","mzq","mzqc","mztab","mztab2","mzxml","n3","ncbi_genome_dataset.zip","ncbitaxonomy.sqlite","ndx","neostore.zip","neper.mscell","neper.points","neper.points.tsv","neper.tesr","neper.tess","netcdf","newick","nex","nhx","nii1","nii1.gz","nii2","nii2.gz","nmrml","npy","npz","nt","obfs","obo","odgi","ogg","ome.tiff","onnx","osw","owl","oxlicg","oxligl","oxling","oxliss","oxlist","oxlits","paf","paf.gz","par","param","paramxml","parquet","pbed","pdb","pdbqt","pdf","peff","peplist","peptideshaker_archive","pepxml","pepxml.tsv","phar","phylip","phyloseq","phyloxml","picard_interval_list","pileup","pithya.model","pithya.property","pithya.result","plyascii","plybinary","png","pod5","postgresql","pov","pphe","pqp","pqr","pretext","prj","prmtop","probam","probed","protobuf2","protobuf3","protxml","protxml.tsv","psl","psms","pssm-asn1","ptkscmp","qcml","qiime2.tabular","qname_sorted.bam","qual454","qualillumina","qualsolexa","qualsolid","qza","qzv","rdata","rdata.camera.negative","rdata.camera.positive","rdata.camera.quick","rdata.msnbase.raw","rdata.sce","rdata.se","rdata.xcms.fillpeaks","rdata.xcms.findchrompeaks","rdata.xcms.group","rdata.xcms.raw","rdata.xcms.retcor","rdf","rdock_as","rds","rma6","rna_eps","sam","sbml","sbol","scf","scidx","scool","sdf","searchgui_archive","sf3","sff","shp","sif","smat","smi","snaphmm","snpeffdb","snpmatrix","snpsiftdbnsfp","snptest","source.c","source.cpp","source.cs","source.go","source.h","source.py","source.rs","spalndba","spalndbnp","spec.xml","splib","splib_noindex","sqlite","sqmass","sra","sra_manifest.tabular","star","stl","stockholm","storm.check","storm.sample","tabular","tabular.gz","tandem","tar","taxonomy","tck","textgrid","tgz","thermo.raw","tiff","toml","top","tpr","trackhub","trafoxml","traml","trk","trr","tsv","ttl","twobit","txt","ucsc.net","uniprotxml","unsorted.bam","vcf","vcf_bgzip","vel","velvet","vg","visium.tar.gz","vtkascii","vtkbinary","watersmasslynx.raw.tar","wav","webm","wiff","wiff.tar","wiff2","wiff2.tar","wig","wma","wmv","xg","xgmml","xlsx","xmfa","xml","xquest.xml","xsd","xtc","xvg","xyz","yaml","zip","zset.geof"];
-
-</script>

package/docs/content/xml-framework.md

@@ -1,140 +0,0 @@
-# Understanding the Galaxy Visualization Framework
-
-The following sections are not mandatory for developing Galaxy Charts visualizations, but they offer valuable insights into Galaxy's underlying visualization framework. These details enhance understanding of the framework’s flexibility and the range of possibilities it offers.
-
-## XML Parsing During Galaxy Startup
-
-Let's break down the XML structure and examine how Galaxy processes it to understand the Galaxy visualization framework. This will highlight the full capabilities of the framework, which can support any JavaScript-based plugin, not just Vue-based ones.
-
-Galaxy expects the XML file to reside in the `config` subdirectory of the visualization plugin. This file should be accessible from the Galaxy root directory at `config/plugins/visualizations/MY_VISUALIZATION/config/MY_VISUALIZATION.xml`.
-
-On startup, Galaxy validates the XML file and adds the visualization to the list available in the activity bar. It also scans the XML for a `requirements` tag. When detected, Galaxy installs the specified npm packages and copies all files from each package’s `static` directory to `config/plugins/visualizations/MY_VISUALIZATION/static`.
-
-This completes the installation of the visualization in Galaxy.
-
-## Selection and Dataset Assignment
-
-When a user selects a visualization in the Galaxy interface, Galaxy requires a dataset to be assigned to it. It will either select a dataset from the user's history, or prompt the user to choose a compatible dataset. For information on specifying compatible data types, see the `data_sources` XML section in [Data Sources](xml-datasources).
-
-## Initialization Process
-
-Once the visualization and dataset are selected, Galaxy reads the `entry_point` section in the XML:
-
-```xml
-<entry_point entry_point_type="script" src="dist/index.js" css="dist/index.css" container="app" />
-```
-
-The entry_point section includes the following parameters:
-
-| Variable | Description |
-|----------|-------------|
-| **entry_point_type** | Specifies the type of entry point. Galaxy supports two types: mako and script. For JavaScript-based visualizations, this should always be set to script. |
-| **src** | The path to the JavaScript bundle within the visualization’s static directory. |
-| **css** | (Optional) The path to a CSS file within the visualization’s static directory. |
-| **container** | The DOM container ID that the visualization will use (default is "app"). |
-
-## Populating the Script Template
-
-Galaxy Charts leverages Galaxy’s minimal JavaScript-based visualization interface, which can be used independently of Galaxy Charts and is compatible with any JavaScript framework. To understand this framework, let’s examine the interface:
-
-```html
-<html>
-    <head>
-        <link rel="stylesheet" href="{{ entry_point.css }}" />
-        <script src="{{ entry_point.src }}"></script>
-    </head>
-    <body>
-        <div id="{{ entry_point.container }}" data-incoming="{{ DATA_FROM_GALAXY }}"></div>
-    </body>
-</html>
-```
-
-In this template, Galaxy populates the css, src, and container attributes with static values from the visualization XML. The data-incoming attribute is dynamically populated by Galaxy with details such as the dataset ID, settings, and visualization plugin metadata.
-
-## Minimal Visualization Plugin
-
-Armed with this foundational knowledge, let’s explore a simple, concrete example of a visualization plugin, implemented with just two files.
-
-The plugin XML file (`plugin.xml`) defines the plugin’s name, a brief description, and specifies `minimal.js` as the entry point for the functionality:
-
-```xml
-<visualization name="Minimal Plugin">
-    <description>A basic example of a visualization plugin.</description>
-    <entry_point entry_point_type="script" src="minimal.js" />
-</visualization>
-```
-
-The core of the plugin, contained in minimal.js, is minimalistic: it retrieves the data injected into the DOM container by Galaxy, then formats and displays it within a new div element. This approach demonstrates a straightforward method to access and render data within a plugin.
-
-```javascript
-// minimal.js
-var element = document.getElementById("app");
-var div = document.createElement('div');
-div.innerText = JSON.stringify(JSON.parse(element.getAttribute("data-incoming")));
-document.body.appendChild(div);
-```
-
-This basic setup captures the essentials of a visualization plugin: it identifies where to find the incoming data, processes it (in this case, by parsing and converting it to a readable format), and outputs it to the screen.
-
-This minimal plugin example provides a foundation on which more complex visualization functionalities can be built, with ease of modification and scalability in mind.
-
-::: tip Note
-For this plugin, as well as any other, all further interactions with Galaxy should be conducted through the Galaxy API.
-:::
-
-## Use any JavaScript Technology!
-
-In summary, the Galaxy framework is designed to be highly flexible, supporting any JavaScript-based framework or tool of choice. To integrate with Galaxy, the only requirement is to include the bundled JavaScript and CSS files within the static directory of the npm package. This approach allows developers to work with their preferred frameworks and tools, ensuring compatibility without additional configuration or dependencies. This streamlined setup makes it easy to extend Galaxy's functionality while maintaining consistency and simplicity across various plugin implementations.
-
-Here is a list of popular tools to consider for your visualization plugin:
-
-<div class="grid grid-cols-4 gap-12 text-center my-10">
-  <div class="flex flex-col items-center">
-    <img src="/javascript.svg" alt="JavaScript" class="w-16 h-16">
-    <span class="font-bold mt-2">JavaScript</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/typescript.svg" alt="TypeScript" class="w-16 h-16">
-    <span class="font-bold mt-2">TypeScript</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/react.svg" alt="React" class="w-16 h-16">
-    <span class="font-bold mt-2">React</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/next-js.svg" alt="Next.js" class="w-16 h-16">
-    <span class="font-bold mt-2">Next.js</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/vue.svg" alt="Vue" class="w-16 h-16">
-    <span class="font-bold mt-2">Vue</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/vite.svg" alt="Vite" class="w-16 h-16">
-    <span class="font-bold mt-2">Vite</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/vuetify.svg" alt="Vuetify" class="w-16 h-16">
-    <span class="font-bold mt-2">Vuetify</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/nuxt.svg" alt="Nuxt" class="w-16 h-16">
-    <span class="font-bold mt-2">Nuxt</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/naive-ui.svg" alt="Naive UI" class="w-16 h-16">
-    <span class="font-bold mt-2">Naive UI</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/tailwind.svg" alt="Tailwind CSS" class="w-16 h-16">
-    <span class="font-bold mt-2">Tailwind CSS</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/eslint.svg" alt="ES Lint" class="w-16 h-16">
-    <span class="font-bold mt-2">ES Lint</span>
-  </div>
-  <div class="flex flex-col items-center">
-    <img src="/prettier.svg" alt="Prettier" class="w-16 h-16">
-    <span class="font-bold mt-2">Prettier</span>
-  </div>
-</div>

package/docs/content/xml-inputs.md

@@ -1,248 +0,0 @@
-# Inputs
-
-You can specify input elements within the settings and tracks sections, allowing users to parameterize and customize their visualization. Galaxy Charts currently supports the following input types: `boolean`, `color`, `data`, `float`, `integer`, `select`, and `text`.
-
-Below is a template for a generic input element. It includes attributes such as `label`, `help`, `name`, and `type`, along with an optional `data` array used for `select` inputs:
-
-```xml
-<input>
-    <label>My Input Label</label>
-    <help>My Input Help</help>
-    <name>my_input_name</name>
-    <type>boolean | color | float | integer | select | text</type>
-    <data>
-        <data>
-            <label>My Option 1 Label</label>
-            <value>my_option_1</value>
-        </data>
-        ...
-    </data>
-</input>
-```
-
-## Boolean Input
-
-Boolean inputs are useful to display yes/no options to the user e.g.
-
-```xml
-<input>
-    <label>My Boolean Label</label>
-    <help>My Boolean Help</help>
-    <name>my_boolean_name</name>
-    <type>boolean</type>
-</input>
-```
-
-Translates to:
-
-<ClientOnly>
-<div class="rounded border p-4">
-    <div class="font-bold pb-1">My Boolean Label</div>
-    <div class="text-xs pb-1">My Boolean Help</div>
-    <n-switch v-model:value="booleanInput"/>
-</div>
-</ClientOnly>
-
-`my_boolean_name`
-<span class="font-thin"> = {{ booleanInput }}</span>
-
-## Color Input
-    
-Users may also select colors, this can be particular useful to distinguish data tracks e.g. in bar or line diagrams:
-
-```xml
-<input>
-    <label>My Color Label</label>
-    <help>My Color Help</help>
-    <name>my_color_name</name>
-    <type>color</type>
-</input>
-```
-
-Translates to:
-
-<ClientOnly>
-<div class="rounded border p-4">
-    <div class="font-bold pb-1">My Color Label</div>
-    <div class="text-xs pb-1">My Color Help</div>
-    <n-color-picker
-        v-model:value="colorInput"
-        :modes="['hex']"
-        :show-alpha="false"/>
-</div>
-</ClientOnly>
-
-`my_color_name`
-<span class="font-thin"> = {{ colorInput }}</span>
-
-## Data Input
-    
-Using a `data` input field you can allow users to select a dataset from Galaxy:
-
-```xml
-<input>
-    <label>My Data Label</label>
-    <help>My Data Help</help>
-    <name>my_data_name</name>
-    <type>data</type>
-</input>
-```
-
-Translates to:
-
-<ClientOnly>
-<div class="rounded border p-4">
-    <div class="font-bold pb-1">My Data Label</div>
-    <div class="text-xs pb-1">My Data Help</div>
-    <n-select v-model:value="dataInput" :options="dataOptions" filterable />
-</div>
-</ClientOnly>
-
-`my_data_name`
-<span class="font-thin"> = {{ dataInput }}</span>
-
-## Float Input
-
-```xml
-<input>
-    <label>My Float Label</label>
-    <help>My Float Help</help>
-    <name>my_float_name</name>
-    <type>float</type>
-    <min>0</min>
-    <max>100</max>
-</input>
-```
-
-Translates to:
-
-<ClientOnly>
-    <div class="rounded border p-4">
-        <div class="font-bold pb-1">My Float Label</div>
-        <div class="text-xs pb-1">My Float Help</div>
-        <n-slider
-            class="mb-2"
-            v-model:value="floatInput"
-            :min="0"
-            :max="10"
-            :step="0.01" />
-        <n-input-number
-            v-model:value="floatInput"
-            size="small"
-            :min="0"
-            :max="10"
-            :step="0.01" />
-    </div>
-</ClientOnly>
-
-`my_float_name`
-<span class="font-thin"> = {{ floatInput }}</span>
-
-## Integer Input
-
-```xml
-<input>
-    <label>My Integer Label</label>
-    <help>My Integer Help</help>
-    <name>my_integer_name</name>
-    <type>integer</type>
-    <min>0</min>
-    <max>100</max>
-</input>
-```
-
-## Select Input
-    
-```xml
-<input>
-    <label>My Select Label</label>
-    <help>My Select Help</help>
-    <name>my_select_name</name>
-    <type>select</type>
-    <value>my_option_a</value>
-    <data>
-        <data>
-            <label>My Option A Label</label>
-            <value>my_option_a</value>
-        </data>
-        <data>
-            <label>My Option B Label</label>
-            <value>my_option_b</value>
-        </data>
-        ...
-    </data>
-</input>
-```
-
-Translates to:
-
-<ClientOnly>
-<div class="rounded border p-4">
-    <div class="font-bold pb-1">My Select Label</div>
-    <div class="text-xs pb-1">My Select Help</div>
-    <n-select v-model:value="selectInput" :options="selectOptions" />
-</div>
-</ClientOnly>
-
-`my_select_name`
-<span class="font-thin"> = {{ selectInput }}</span>
-
-## Text Input
-
-Last but not least, `text` inputs can be declared.
-
-```xml
-<input>
-    <label>My Text Label</label>
-    <help>My Text Help</help>
-    <name>my_text_name</name>
-    <type>text</type>
-</input>
-```
-
-Translates to:
-
-<ClientOnly>
-    <div class="rounded border p-4">
-        <div class="font-bold pb-1">My Text Label</div>
-        <div class="text-xs pb-1">My Text Help</div>
-        <n-input v-model:value="textInput" />
-    </div>
-</ClientOnly>
-
-`my_text_name`
-<span class="font-thin"> = {{ textInput }}</span>
-
-<script setup>
-import * as naiveui from 'naive-ui';
-const { NSwitch, NColorPicker, NSelect, NSlider, NInputNumber, NInput } = naiveui;
-import { ref } from "vue";
-const booleanInput = ref(true);
-const colorInput = ref("#0284c7");
-const floatInput = ref(1);
-const dataInput = ref("dataset_id_a");
-const textInput = ref("My Text");
-const selectInput = ref("my_option_a");
-
-const dataOptions = [
-    {
-        label: 'Galaxy Dataset A',
-        value: 'dataset_id_a',
-    },
-    {
-        label: 'Galaxy Dataset B',
-        value: 'dataset_id_b'
-    },
-];
-
-const selectOptions = [
-    {
-        label: 'My Option A',
-        value: 'my_option_a',
-    },
-    {
-        label: 'My Option B',
-        value: 'my_option_b'
-    },
-];
-</script>

package/docs/content/xml-introduction.md

@@ -1,23 +0,0 @@
-# XML Wrapper
-
-Galaxy Visualizations are configured using XML files. The files contain Visualization specific attributes such as the `name`, `description` and the associated npm package details.
-
-```xml
-<visualization name="MY_VISUALIZATION">
-    <description>MY_DESCRIPTION</description>
-    <requirements>
-        <requirement type="npm" version="MY_NPM_PACKAGE_VERSION" package="MY_NPM_PACKAGE_NAME"/>
-    </requirements>
-    <entry_point entry_point_type="script" src="dist/index.js" css="dist/index.css" />
-    ...
-</visualization>
-```
-
-This XML template includes the following variables:
-
-| Variable | Description |
-|----------|-------------|
-| **MY_VISUALIZATION** | Specifies the name of the visualization. |
-| **MY_DESCRIPTION** | Provides a brief description of the visualization, including references if it’s a third-party plugin. |
-| **MY_NPM_PACKAGE_NAME** | Indicates the npm package name. Update this field with the correct package name before publishing. |
-| **MY_NPM_PACKAGE_VERSION** | Specifies the version number of the npm package upon publishing. |

package/docs/content/xml-sections.md

@@ -1,50 +0,0 @@
-# Sections
-
-Galaxy Charts provides three XML sections: `settings`, `specs`, and `tracks`. These sections allow you to define dynamic input parameters, which users can interact with, or static values to configure your visualization.
-
-- **`settings`**: Contains a single set of input elements displayed to the user for customization.
-- **`specs`**: Holds static key/value pairs that configure visualization settings without user interaction.
-- **`tracks`**: Includes input elements specific to each data track, allowing customization per track.
-
-Use these sections to tailor the visualization experience based on user input or preset configurations.
-
-## Settings Section
-
-The `settings` section includes an `array` of `input` elements that allow users to customize the visualization. These customization options are also available when embedding the visualization in Galaxy workflow reports. Below is an example of a `settings` section with a single `text` input element:
-
-```xml
-<settings>
-    <input>
-        <label>Setting: Text</label>
-        <name>setting_text</name>
-        <type>text</type>
-    </input>
-    ...
-</settings>
-```
-
-## Specs Section
-
-The `specs` section includes an `array` of static `key-value` pairs for general use, such as:
-
-```xml
-<specs>
-    <my_key>my_value</my_key>
-    ...
-</specs>
-```
-
-## Tracks Section
-
-The `tracks` section includes an `array` of `input` elements that allow users to configure individual data tracks, for example:
-
-```xml
-<tracks>
-    <input>
-        <label>Track: Color</label>
-        <name>track_color</name>
-        <type>color</type>
-    </input>
-    ...
-</tracks>
-```

package/docs/index.md

@@ -1,27 +0,0 @@
----
-# https://vitepress.dev/reference/default-theme-home-page
-layout: home
-
-hero:
-  name: Galaxy Charts
-  text: Visualization Plugin Framework for Galaxy 
-  tagline: Develop, Test and Deploy JavaScript Visualizations
-  actions:
-    - theme: brand
-      text: What is Galaxy Charts?
-      link: /content/introduction
-    - theme: alt
-      text: Quick Start
-      link: /content/installation
-
-features:
-  - title: Standalone
-    details: Build your visualization in an independent, standalone environment with modern tools like Vite and Vue 3.
-    icon: 🖥️
-  - title: Data Access
-    details: Connect to local or public Galaxy instances to test your visualization with real-world data.
-    icon: 🔗
-  - title: Deployment
-    details: When your visualization is ready, deploy it to Galaxy for use by researchers worldwide.
-    icon: 🚀
----