@parent-tobias/chord-component 1.0.0

package/dist/chord-list.js

@@ -0,0 +1,119 @@
+import { css as p, LitElement as c, html as m } from "lit";
+import { customElement as l } from "./node_modules/@lit/reactive-element/decorators/custom-element.js";
+import { property as d } from "./node_modules/@lit/reactive-element/decorators/property.js";
+import { state as u } from "./node_modules/@lit/reactive-element/decorators/state.js";
+import "./chord-diagram.js";
+var f = Object.defineProperty, g = Object.getOwnPropertyDescriptor, o = (t, e, n, i) => {
+  for (var r = i > 1 ? void 0 : i ? g(e, n) : e, a = t.length - 1, h; a >= 0; a--)
+    (h = t[a]) && (r = (i ? h(e, n, r) : h(r)) || r);
+  return i && r && f(e, n, r), r;
+};
+let s = class extends c {
+  constructor() {
+    super(...arguments), this.instrument = "Standard Ukulele", this.chords = "[]", this.numChords = 0;
+  }
+  /**
+   * Parsed chord names from the chords property
+   */
+  get parsedChords() {
+    try {
+      return Array.isArray(this.chords) ? this.chords : typeof this.chords == "string" ? JSON.parse(this.chords) : [];
+    } catch {
+      return [];
+    }
+  }
+  updated(t) {
+    t.has("chords") && (this.numChords = this.parsedChords.length);
+  }
+  render() {
+    const t = this.parsedChords;
+    return t.length === 0 ? m`
+				<header>
+					<h3>${this.instrument}</h3>
+				</header>
+				<div class='empty-state'>
+					No chords to display
+				</div>
+			` : m`
+			<header>
+				<h3>${this.instrument} (${this.numChords} chord${this.numChords !== 1 ? "s" : ""})</h3>
+			</header>
+			<div class='list'>
+				${t.map(
+      (e) => m`<chord-diagram chord=${e} instrument='${this.instrument}'></chord-diagram>`
+    )}
+			</div>
+		`;
+  }
+};
+s.styles = p`
+	:host {
+		display: block;
+		width: 100%;
+		height: fit-content;
+		container-type: inline-size;
+	}
+
+	header {
+		margin-bottom: 0.5rem;
+	}
+
+	header h3 {
+		margin: 0;
+		font-size: 1rem;
+		color: #f8f8f8;
+		font-weight: 600;
+	}
+
+	.list {
+		display: grid;
+		grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
+		gap: 0.5rem;
+		align-items: start;
+	}
+
+	.empty-state {
+		color: #a0aec0;
+		font-size: 0.9rem;
+		text-align: center;
+		padding: 1rem;
+		font-style: italic;
+	}
+
+	/* Responsive adjustments for different container widths */
+	@container (max-width: 400px) {
+		.list {
+			grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
+			gap: 0.3rem;
+		}
+	}
+
+	@container (min-width: 600px) {
+		.list {
+			grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
+		}
+	}
+
+	@container (min-width: 800px) {
+		.list {
+			grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
+		}
+	}
+	`;
+o([
+  d({
+    type: String
+  })
+], s.prototype, "instrument", 2);
+o([
+  d()
+], s.prototype, "chords", 2);
+o([
+  u()
+], s.prototype, "numChords", 2);
+s = o([
+  l("chord-list")
+], s);
+export {
+  s as ChordList
+};

package/dist/default-chords.js

@@ -0,0 +1,322 @@
+const r = {
+  "Standard Ukulele": {
+    Cm: {
+      barres: [],
+      fingers: [
+        [3, 3],
+        [2, 3],
+        [1, 3]
+      ]
+    },
+    Cm7: {
+      barres: [{
+        fromString: 4,
+        toString: 1,
+        fret: 3,
+        text: "1"
+      }],
+      fingers: []
+    },
+    Cdim: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 3],
+        [2, 2],
+        [1, 3]
+      ]
+    },
+    C: {
+      barres: [],
+      fingers: [
+        [4, 0],
+        [3, 0],
+        [2, 0],
+        [1, 3]
+      ]
+    },
+    C7: {
+      barres: [],
+      fingers: [
+        [4, 0],
+        [3, 0],
+        [2, 0],
+        [1, 1]
+      ]
+    },
+    Cmaj7: {
+      barres: [],
+      fingers: [
+        [4, 0],
+        [3, 0],
+        [2, 0],
+        [1, 2]
+      ]
+    },
+    Dm: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 2],
+        [2, 1],
+        [1, 0]
+      ]
+    },
+    Dm7: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 2],
+        [2, 1],
+        [1, 3]
+      ]
+    },
+    D: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 2],
+        [2, 2],
+        [1, 0]
+      ]
+    },
+    D7: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 2],
+        [2, 2],
+        [1, 3]
+      ]
+    },
+    Em: {
+      barres: [],
+      fingers: [
+        [4, 0],
+        [3, 4],
+        [2, 3],
+        [1, 2]
+      ]
+    },
+    E: {
+      barres: [],
+      fingers: [
+        [4, 4],
+        [3, 4],
+        [2, 4],
+        [1, 2]
+      ]
+    },
+    E7: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 4],
+        [2, 4],
+        [1, 2]
+      ]
+    },
+    F: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 0],
+        [2, 1],
+        [1, 0]
+      ]
+    },
+    F7: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 3],
+        [2, 1],
+        [1, 3]
+      ]
+    },
+    Fm: {
+      barres: [],
+      fingers: [
+        [4, 1],
+        [3, 0],
+        [2, 1],
+        [1, 3]
+      ]
+    },
+    G: {
+      barres: [],
+      fingers: [
+        [4, 0],
+        [3, 2],
+        [2, 3],
+        [1, 2]
+      ]
+    },
+    G7: {
+      barres: [],
+      fingers: [
+        [4, 0],
+        [3, 2],
+        [2, 1],
+        [1, 2]
+      ]
+    },
+    Gm: {
+      barres: [],
+      fingers: [
+        [4, 0],
+        [3, 2],
+        [2, 3],
+        [1, 1]
+      ]
+    },
+    Am: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 0],
+        [2, 0],
+        [1, 0]
+      ]
+    },
+    A: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 1],
+        [2, 0],
+        [1, 0]
+      ]
+    },
+    A7: {
+      barres: [],
+      fingers: [
+        [4, 0],
+        [3, 1],
+        [2, 0],
+        [1, 0]
+      ]
+    },
+    Bm: {
+      barres: [],
+      fingers: [
+        [4, 4],
+        [3, 2],
+        [2, 2],
+        [1, 2]
+      ]
+    },
+    B: {
+      barres: [],
+      fingers: [
+        [4, 4],
+        [3, 3],
+        [2, 2],
+        [1, 2]
+      ]
+    },
+    B7: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 3],
+        [2, 2],
+        [1, 2]
+      ]
+    }
+  },
+  "Standard Guitar": {
+    C: {
+      barres: [],
+      fingers: [
+        [5, 3],
+        [4, 2],
+        [2, 1]
+      ]
+    },
+    Cm: {
+      barres: [{
+        fromString: 5,
+        toString: 1,
+        fret: 3,
+        text: "1"
+      }],
+      fingers: [
+        [4, 5],
+        [3, 5],
+        [2, 4]
+      ]
+    },
+    D: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 3],
+        [1, 2]
+      ]
+    },
+    Dm: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 3],
+        [1, 1]
+      ]
+    },
+    E: {
+      barres: [],
+      fingers: [
+        [5, 2],
+        [4, 2],
+        [3, 1]
+      ]
+    },
+    Em: {
+      barres: [],
+      fingers: [
+        [5, 2],
+        [4, 2]
+      ]
+    },
+    F: {
+      barres: [{
+        fromString: 6,
+        toString: 1,
+        fret: 1,
+        text: "1"
+      }],
+      fingers: [
+        [5, 3],
+        [4, 3],
+        [3, 2]
+      ]
+    },
+    G: {
+      barres: [],
+      fingers: [
+        [6, 3],
+        [1, 3],
+        [5, 2]
+      ]
+    },
+    A: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 2],
+        [2, 2]
+      ]
+    },
+    Am: {
+      barres: [],
+      fingers: [
+        [4, 2],
+        [3, 2],
+        [2, 1]
+      ]
+    }
+  }
+};
+export {
+  r as systemDefaultChords
+};

package/dist/index.js

@@ -0,0 +1,26 @@
+import { ChordDiagram as e } from "./chord-diagram.js";
+import { ChordList as t } from "./chord-list.js";
+import { ChordEditor as m } from "./chord-editor.js";
+import { chordOnInstrument as c, chordToNotes as h, chords as f, chordsPerScale as n, findBase as i, instruments as p, keys as x, notes as C, parseChords as l, scaleTones as D, scales as u } from "./music-utils.js";
+import { systemDefaultChords as v } from "./default-chords.js";
+import { chordDataService as B } from "./chord-data-service.js";
+import { indexedDBService as g } from "./indexed-db-service.js";
+export {
+  e as ChordDiagram,
+  m as ChordEditor,
+  t as ChordList,
+  B as chordDataService,
+  c as chordOnInstrument,
+  h as chordToNotes,
+  f as chords,
+  n as chordsPerScale,
+  i as findBase,
+  g as indexedDBService,
+  p as instruments,
+  x as keys,
+  C as notes,
+  l as parseChords,
+  D as scaleTones,
+  u as scales,
+  v as systemDefaultChords
+};

package/dist/indexed-db-service.js

@@ -0,0 +1,228 @@
+const b = "ChordComponentsDB";
+const d = "chordData", c = "userChords";
+class h {
+  constructor() {
+    this.dbPromise = null;
+  }
+  /**
+   * Initialize and open the database
+   */
+  async openDB() {
+    return this.dbPromise ? this.dbPromise : (this.dbPromise = new Promise((e, o) => {
+      const r = indexedDB.open(b, 2);
+      r.onerror = () => {
+        o(new Error(`Failed to open IndexedDB: ${r.error}`));
+      }, r.onsuccess = () => {
+        e(r.result);
+      }, r.onupgradeneeded = (n) => {
+        const s = n.target.result;
+        if (s.objectStoreNames.contains(d) || s.createObjectStore(d, { keyPath: "instrument" }).createIndex("timestamp", "timestamp", { unique: !1 }), !s.objectStoreNames.contains(c)) {
+          const t = s.createObjectStore(c, { keyPath: "key" });
+          t.createIndex("instrument", "instrument", { unique: !1 }), t.createIndex("timestamp", "timestamp", { unique: !1 });
+        }
+      };
+    }), this.dbPromise);
+  }
+  /**
+   * Get chord data for a specific instrument from IndexedDB
+   */
+  async getChordData(e) {
+    try {
+      const o = await this.openDB();
+      return new Promise((r, n) => {
+        const i = o.transaction([d], "readonly").objectStore(d).get(e);
+        i.onsuccess = () => {
+          r(i.result || null);
+        }, i.onerror = () => {
+          n(new Error(`Failed to get chord data: ${i.error}`));
+        };
+      });
+    } catch (o) {
+      return console.error("IndexedDB error:", o), null;
+    }
+  }
+  /**
+   * Store chord data for a specific instrument in IndexedDB
+   */
+  async setChordData(e, o) {
+    try {
+      const r = await this.openDB(), n = {
+        instrument: e,
+        chords: o,
+        timestamp: Date.now()
+      };
+      return new Promise((s, t) => {
+        const a = r.transaction([d], "readwrite").objectStore(d).put(n);
+        a.onsuccess = () => {
+          s();
+        }, a.onerror = () => {
+          t(new Error(`Failed to store chord data: ${a.error}`));
+        };
+      });
+    } catch (r) {
+      throw console.error("IndexedDB error:", r), r;
+    }
+  }
+  /**
+   * Get all stored instruments
+   */
+  async getAllInstruments() {
+    try {
+      const e = await this.openDB();
+      return new Promise((o, r) => {
+        const t = e.transaction([d], "readonly").objectStore(d).getAllKeys();
+        t.onsuccess = () => {
+          o(t.result);
+        }, t.onerror = () => {
+          r(new Error(`Failed to get instruments: ${t.error}`));
+        };
+      });
+    } catch (e) {
+      return console.error("IndexedDB error:", e), [];
+    }
+  }
+  /**
+   * Clear all chord data from IndexedDB
+   */
+  async clearAll() {
+    try {
+      const e = await this.openDB();
+      return new Promise((o, r) => {
+        const t = e.transaction([d], "readwrite").objectStore(d).clear();
+        t.onsuccess = () => {
+          o();
+        }, t.onerror = () => {
+          r(new Error(`Failed to clear data: ${t.error}`));
+        };
+      });
+    } catch (e) {
+      throw console.error("IndexedDB error:", e), e;
+    }
+  }
+  /**
+   * Check if IndexedDB is available
+   */
+  isAvailable() {
+    return typeof indexedDB < "u";
+  }
+  /**
+   * Save a user-defined chord
+   */
+  async saveUserChord(e, o, r) {
+    try {
+      const n = await this.openDB(), s = {
+        key: `${e}:${o}`,
+        instrument: e,
+        chordName: o,
+        fingers: r.fingers,
+        barres: r.barres,
+        position: r.position,
+        timestamp: Date.now()
+      };
+      return new Promise((t, i) => {
+        const l = n.transaction([c], "readwrite").objectStore(c).put(s);
+        l.onsuccess = () => {
+          t();
+        }, l.onerror = () => {
+          i(new Error(`Failed to save user chord: ${l.error}`));
+        };
+      });
+    } catch (n) {
+      throw console.error("IndexedDB error:", n), n;
+    }
+  }
+  /**
+   * Get a user-defined chord
+   */
+  async getUserChord(e, o) {
+    try {
+      const r = await this.openDB(), n = `${e}:${o}`;
+      return new Promise((s, t) => {
+        const a = r.transaction([c], "readonly").objectStore(c).get(n);
+        a.onsuccess = () => {
+          s(a.result || null);
+        }, a.onerror = () => {
+          t(new Error(`Failed to get user chord: ${a.error}`));
+        };
+      });
+    } catch (r) {
+      return console.error("IndexedDB error:", r), null;
+    }
+  }
+  /**
+   * Delete a user-defined chord
+   */
+  async deleteUserChord(e, o) {
+    try {
+      const r = await this.openDB(), n = `${e}:${o}`;
+      return new Promise((s, t) => {
+        const a = r.transaction([c], "readwrite").objectStore(c).delete(n);
+        a.onsuccess = () => {
+          s();
+        }, a.onerror = () => {
+          t(new Error(`Failed to delete user chord: ${a.error}`));
+        };
+      });
+    } catch (r) {
+      throw console.error("IndexedDB error:", r), r;
+    }
+  }
+  /**
+   * Get all user-defined chords for an instrument
+   */
+  async getUserChordsByInstrument(e) {
+    try {
+      const o = await this.openDB();
+      return new Promise((r, n) => {
+        const u = o.transaction([c], "readonly").objectStore(c).index("instrument").getAll(e);
+        u.onsuccess = () => {
+          r(u.result || []);
+        }, u.onerror = () => {
+          n(new Error(`Failed to get user chords: ${u.error}`));
+        };
+      });
+    } catch (o) {
+      return console.error("IndexedDB error:", o), [];
+    }
+  }
+  /**
+   * Get all user-defined chords
+   */
+  async getAllUserChords() {
+    try {
+      const e = await this.openDB();
+      return new Promise((o, r) => {
+        const t = e.transaction([c], "readonly").objectStore(c).getAll();
+        t.onsuccess = () => {
+          o(t.result || []);
+        }, t.onerror = () => {
+          r(new Error(`Failed to get all user chords: ${t.error}`));
+        };
+      });
+    } catch (e) {
+      return console.error("IndexedDB error:", e), [];
+    }
+  }
+  /**
+   * Clear all user-defined chords
+   */
+  async clearUserChords() {
+    try {
+      const e = await this.openDB();
+      return new Promise((o, r) => {
+        const t = e.transaction([c], "readwrite").objectStore(c).clear();
+        t.onsuccess = () => {
+          o();
+        }, t.onerror = () => {
+          r(new Error(`Failed to clear user chords: ${t.error}`));
+        };
+      });
+    } catch (e) {
+      throw console.error("IndexedDB error:", e), e;
+    }
+  }
+}
+const S = new h();
+export {
+  S as indexedDBService
+};