TBNilles/workorders
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor Lucide icon rendering by replacing nodes with root across components and fix unintended character encoding issues in placeholders and text.

Browse Source
This commit is contained in:
Thomas Nilles
2026-05-17 17:30:04 -04:00
parent 17e05cb61d
commit 309f19520b
27 changed files with 694 additions and 1622 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/components/registry/equipment-form.mjs
+1 -1
View File
@@ -71,7 +71,7 @@ class EquipmentForm extends HTMLElement {
<button class="btn-primary" id="dlg-save">${isEdit ? 'Save Changes' : 'Add Equipment'}</button>
</div>`;
if (window.lucide) lucide.createIcons({ nodes: [d] });
if (window.lucide) lucide.createIcons({ root: d });
d.querySelector('#dlg-close').addEventListener('click', () => d.close());
d.querySelector('#dlg-cancel').addEventListener('click', () => d.close());
web/components/registry/equipment-list.mjs
+3 -3
View File
@@ -1,4 +1,4 @@
import { api } from '../../lib/api.mjs';
import { api } from '../../lib/api.mjs';
import './equipment-form.mjs';
class EquipmentList extends HTMLElement {
@@ -64,7 +64,7 @@ class EquipmentList extends HTMLElement {
<div class="page-header">
<h1>Equipment</h1>
<div class="toolbar">
<input class="search-input" id="search" placeholder="Search equipment…" value="${this.#esc(this.#search)}">
<input class="search-input" id="search" placeholder="Search equipment…" value="${this.#esc(this.#search)}">
<button class="btn-primary" id="new-btn">
<i data-lucide="plus" style="width:14px;height:14px"></i> Add Equipment
</button>
@@ -102,7 +102,7 @@ class EquipmentList extends HTMLElement {
<equipment-form id="equipment-form"></equipment-form>`;
if (window.lucide) lucide.createIcons({ nodes: [s] });
if (window.lucide) lucide.createIcons({ root: s });
const searchEl = s.querySelector('#search');
let debounce;
web/components/registry/material-form.mjs
+1 -1
View File
@@ -71,7 +71,7 @@ class MaterialForm extends HTMLElement {
<button class="btn-primary" id="dlg-save">${isEdit ? 'Save Changes' : 'Add Material'}</button>
</div>`;
if (window.lucide) lucide.createIcons({ nodes: [d] });
if (window.lucide) lucide.createIcons({ root: d });
d.querySelector('#dlg-close').addEventListener('click', () => d.close());
d.querySelector('#dlg-cancel').addEventListener('click', () => d.close());
web/components/registry/material-list.mjs
+3 -3
View File
@@ -1,4 +1,4 @@
import { api } from '../../lib/api.mjs';
import { api } from '../../lib/api.mjs';
import './material-form.mjs';
class MaterialList extends HTMLElement {
@@ -65,7 +65,7 @@ class MaterialList extends HTMLElement {
<div class="page-header">
<h1>Materials</h1>
<div class="toolbar">
<input class="search-input" id="search" placeholder="Search materials…" value="${this.#esc(this.#search)}">
<input class="search-input" id="search" placeholder="Search materials…" value="${this.#esc(this.#search)}">
<button class="btn-primary" id="new-btn">
<i data-lucide="plus" style="width:14px;height:14px"></i> Add Material
</button>
@@ -103,7 +103,7 @@ class MaterialList extends HTMLElement {
<material-form id="material-form"></material-form>`;
if (window.lucide) lucide.createIcons({ nodes: [s] });
if (window.lucide) lucide.createIcons({ root: s });
const searchEl = s.querySelector('#search');
let debounce;
web/components/registry/people-form.mjs
+1 -1
View File
@@ -70,7 +70,7 @@ class PeopleForm extends HTMLElement {
<button class="btn-primary" id="dlg-save">${isEdit ? 'Save Changes' : 'Add Person'}</button>
</div>`;
if (window.lucide) lucide.createIcons({ nodes: [d] });
if (window.lucide) lucide.createIcons({ root: d });
d.querySelector('#dlg-close').addEventListener('click', () => d.close());
d.querySelector('#dlg-cancel').addEventListener('click', () => d.close());
web/components/registry/people-list.mjs
+3 -3
View File
@@ -1,4 +1,4 @@
import { api } from '../../lib/api.mjs';
import { api } from '../../lib/api.mjs';
import './people-form.mjs';
class PeopleList extends HTMLElement {
@@ -76,7 +76,7 @@ class PeopleList extends HTMLElement {
<div class="page-header">
<h1>People</h1>
<div class="toolbar">
<input class="search-input" id="search" placeholder="Search people…" value="${this.#esc(this.#search)}">
<input class="search-input" id="search" placeholder="Search people…" value="${this.#esc(this.#search)}">
<button class="btn-primary" id="new-btn">
<i data-lucide="user-plus" style="width:14px;height:14px"></i> Add Person
</button>
@@ -115,7 +115,7 @@ class PeopleList extends HTMLElement {
<people-form id="people-form"></people-form>`;
if (window.lucide) lucide.createIcons({ nodes: [s] });
if (window.lucide) lucide.createIcons({ root: s });
const searchEl = s.querySelector('#search');
let debounce;
web/components/registry/profile-form.mjs
+1 -1
View File
@@ -110,7 +110,7 @@ class ProfileForm extends HTMLElement {
<button class="btn-primary" id="dlg-save">${isEdit ? 'Save Changes' : 'Create Profile'}</button>
</div>`;
if (window.lucide) lucide.createIcons({ nodes: [d] });
if (window.lucide) lucide.createIcons({ root: d });
// Local step state (not saved until the profile save)
const profileId = profile?.id || null;
web/components/registry/profile-list.mjs
+4 -4
View File
@@ -1,4 +1,4 @@
import { api } from '../../lib/api.mjs';
import { api } from '../../lib/api.mjs';
import './profile-form.mjs';
const PRIORITY_COLORS = { low: '#64748B', normal: '#0A7EA4', high: '#E07B39', urgent: '#C0392B' };
@@ -68,7 +68,7 @@ class ProfileList extends HTMLElement {
<div class="page-header">
<h1>Work Order Profiles</h1>
<div class="toolbar">
<input class="search-input" id="search" placeholder="Search profiles…" value="${this.#esc(this.#search)}">
<input class="search-input" id="search" placeholder="Search profiles…" value="${this.#esc(this.#search)}">
<button class="btn-primary" id="new-btn">
<i data-lucide="plus" style="width:14px;height:14px"></i> New Profile
</button>
@@ -92,7 +92,7 @@ class ProfileList extends HTMLElement {
<span class="pri-dot" style="background:${PRIORITY_COLORS[p.default_priority] || PRIORITY_COLORS.normal}"></span>
<span>${p.default_priority}</span>
<span class="step-count"><i data-lucide="list-checks" style="width:11px;height:11px;vertical-align:middle"></i> ${p.step_count} step${p.step_count !== 1 ? 's' : ''}</span>
${p.default_duration_hours ? `<span>⏱ ${p.default_duration_hours}h</span>` : ''}
${p.default_duration_hours ? `<span>⏱ ${p.default_duration_hours}h</span>` : ''}
</div>
</div>
<span class="status-badge ${p.active ? 'status-active' : 'status-inactive'}">${p.active ? 'Active' : 'Inactive'}</span>
@@ -109,7 +109,7 @@ class ProfileList extends HTMLElement {
<profile-form id="profile-form"></profile-form>`;
if (window.lucide) lucide.createIcons({ nodes: [s] });
if (window.lucide) lucide.createIcons({ root: s });
const searchEl = s.querySelector('#search');
let debounce;
web/components/registry/vehicle-form.mjs
+1 -1
View File
@@ -68,7 +68,7 @@ class VehicleForm extends HTMLElement {
<button class="btn-primary" id="dlg-save">${isEdit ? 'Save Changes' : 'Add Vehicle'}</button>
</div>`;
if (window.lucide) lucide.createIcons({ nodes: [d] });
if (window.lucide) lucide.createIcons({ root: d });
d.querySelector('#dlg-close').addEventListener('click', () => d.close());
d.querySelector('#dlg-cancel').addEventListener('click', () => d.close());
web/components/registry/vehicle-list.mjs
+3 -3
View File
@@ -1,4 +1,4 @@
import { api } from '../../lib/api.mjs';
import { api } from '../../lib/api.mjs';
import './vehicle-form.mjs';
class VehicleList extends HTMLElement {
@@ -63,7 +63,7 @@ class VehicleList extends HTMLElement {
<div class="page-header">
<h1>Vehicles</h1>
<div class="toolbar">
<input class="search-input" id="search" placeholder="Search vehicles…" value="${this.#esc(this.#search)}">
<input class="search-input" id="search" placeholder="Search vehicles…" value="${this.#esc(this.#search)}">
<button class="btn-primary" id="new-btn">
<i data-lucide="plus" style="width:14px;height:14px"></i> Add Vehicle
</button>
@@ -101,7 +101,7 @@ class VehicleList extends HTMLElement {
<vehicle-form id="vehicle-form"></vehicle-form>`;
if (window.lucide) lucide.createIcons({ nodes: [s] });
if (window.lucide) lucide.createIcons({ root: s });
const searchEl = s.querySelector('#search');
let debounce;