feat(icons): migrate icon usage to the new dees-icon API and integrate collaboration sidebar into the editor
This commit is contained in:
@@ -24,12 +24,12 @@ declare global {
|
||||
|
||||
// Paragraph type configuration
|
||||
const PARAGRAPH_TYPES = [
|
||||
{ value: 'section', label: 'Section', icon: 'lucide:heading' },
|
||||
{ value: 'clause', label: 'Clause', icon: 'lucide:file-text' },
|
||||
{ value: 'definition', label: 'Definition', icon: 'lucide:book-open' },
|
||||
{ value: 'obligation', label: 'Obligation', icon: 'lucide:check-square' },
|
||||
{ value: 'condition', label: 'Condition', icon: 'lucide:git-branch' },
|
||||
{ value: 'schedule', label: 'Schedule', icon: 'lucide:calendar' },
|
||||
{ value: 'section', label: 'Section', icon: 'lucide:Heading' },
|
||||
{ value: 'clause', label: 'Clause', icon: 'lucide:FileText' },
|
||||
{ value: 'definition', label: 'Definition', icon: 'lucide:BookOpen' },
|
||||
{ value: 'obligation', label: 'Obligation', icon: 'lucide:CheckSquare' },
|
||||
{ value: 'condition', label: 'Condition', icon: 'lucide:GitBranch' },
|
||||
{ value: 'schedule', label: 'Schedule', icon: 'lucide:Calendar' },
|
||||
];
|
||||
|
||||
@customElement('sdig-contract-content')
|
||||
@@ -718,7 +718,7 @@ export class SdigContractContent extends DeesElement {
|
||||
<div class="content-toolbar">
|
||||
<div class="toolbar-left">
|
||||
<div class="search-box">
|
||||
<dees-icon .iconFA=${'lucide:search'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:Search'}></dees-icon>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Search paragraphs..."
|
||||
@@ -734,20 +734,20 @@ export class SdigContractContent extends DeesElement {
|
||||
@click=${() => (this.viewMode = 'list')}
|
||||
title="List view"
|
||||
>
|
||||
<dees-icon .iconFA=${'lucide:list'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:List'}></dees-icon>
|
||||
</button>
|
||||
<button
|
||||
class="view-toggle-btn ${this.viewMode === 'outline' ? 'active' : ''}"
|
||||
@click=${() => (this.viewMode = 'outline')}
|
||||
title="Outline view"
|
||||
>
|
||||
<dees-icon .iconFA=${'lucide:layout-list'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:LayoutList'}></dees-icon>
|
||||
</button>
|
||||
</div>
|
||||
${!this.readonly
|
||||
? html`
|
||||
<button class="btn btn-primary" @click=${() => this.handleAddParagraph()}>
|
||||
<dees-icon .iconFA=${'lucide:plus'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:Plus'}></dees-icon>
|
||||
Add Paragraph
|
||||
</button>
|
||||
`
|
||||
@@ -759,7 +759,7 @@ export class SdigContractContent extends DeesElement {
|
||||
<div class="section-card">
|
||||
<div class="section-header">
|
||||
<div class="section-title">
|
||||
<dees-icon .iconFA=${'lucide:file-text'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:FileText'}></dees-icon>
|
||||
Contract Content
|
||||
</div>
|
||||
<span class="paragraph-count">${this.contract.paragraphs.length} paragraphs</span>
|
||||
@@ -777,7 +777,7 @@ export class SdigContractContent extends DeesElement {
|
||||
? html`
|
||||
<div class="add-paragraph-row">
|
||||
<button class="add-paragraph-btn" @click=${() => this.handleAddParagraph()}>
|
||||
<dees-icon .iconFA=${'lucide:plus'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:Plus'}></dees-icon>
|
||||
Add paragraph
|
||||
</button>
|
||||
</div>
|
||||
@@ -786,13 +786,13 @@ export class SdigContractContent extends DeesElement {
|
||||
`
|
||||
: html`
|
||||
<div class="empty-state">
|
||||
<dees-icon .iconFA=${'lucide:file-plus'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:FilePlus'}></dees-icon>
|
||||
<h4>No Paragraphs Yet</h4>
|
||||
<p>Start building your contract by adding paragraphs. Each paragraph can contain clauses, definitions, or obligations.</p>
|
||||
${!this.readonly
|
||||
? html`
|
||||
<button class="btn btn-primary" @click=${() => this.handleAddParagraph()}>
|
||||
<dees-icon .iconFA=${'lucide:plus'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:Plus'}></dees-icon>
|
||||
Add First Paragraph
|
||||
</button>
|
||||
`
|
||||
@@ -819,7 +819,7 @@ export class SdigContractContent extends DeesElement {
|
||||
${!this.readonly
|
||||
? html`
|
||||
<div class="paragraph-drag-handle">
|
||||
<dees-icon .iconFA=${'lucide:grip-vertical'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:GripVertical'}></dees-icon>
|
||||
</div>
|
||||
`
|
||||
: ''}
|
||||
@@ -880,28 +880,28 @@ export class SdigContractContent extends DeesElement {
|
||||
@click=${(e: Event) => { e.stopPropagation(); this.handleEditParagraph(paragraph); }}
|
||||
title="Edit"
|
||||
>
|
||||
<dees-icon .iconFA=${'lucide:pencil'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:Pencil'}></dees-icon>
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-ghost"
|
||||
@click=${(e: Event) => { e.stopPropagation(); this.handleMoveParagraph(paragraph.uniqueId, 'up'); }}
|
||||
title="Move up"
|
||||
>
|
||||
<dees-icon .iconFA=${'lucide:chevron-up'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:ChevronUp'}></dees-icon>
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-ghost"
|
||||
@click=${(e: Event) => { e.stopPropagation(); this.handleMoveParagraph(paragraph.uniqueId, 'down'); }}
|
||||
title="Move down"
|
||||
>
|
||||
<dees-icon .iconFA=${'lucide:chevron-down'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:ChevronDown'}></dees-icon>
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-ghost btn-danger"
|
||||
@click=${(e: Event) => { e.stopPropagation(); this.handleDeleteParagraph(paragraph.uniqueId); }}
|
||||
title="Delete"
|
||||
>
|
||||
<dees-icon .iconFA=${'lucide:trash-2'}></dees-icon>
|
||||
<dees-icon .icon=${'lucide:Trash2'}></dees-icon>
|
||||
</button>
|
||||
</div>
|
||||
`
|
||||
|
||||
Reference in New Issue
Block a user