Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 79ca3a07f1 | |||
| a6324f867f |
@@ -1,5 +1,12 @@
|
|||||||
# Changelog
|
# Changelog
|
||||||
|
|
||||||
|
## 2026-05-02 - 1.6.0 - feat(workspace)
|
||||||
|
support configurable inbox documents and emit document-open events
|
||||||
|
|
||||||
|
- Adds a documents property to the workspace and inbox components so document lists, counts, filters, and attention metrics use injected data instead of demo data.
|
||||||
|
- Passes documents from the workspace container into the inbox view for consistent sidebar and inbox counts.
|
||||||
|
- Emits a bubbling document-open event when an inbox item is opened to enable parent integrations and external handling.
|
||||||
|
|
||||||
## 2026-05-02 - 1.5.1 - fix(sdig-workspace)
|
## 2026-05-02 - 1.5.1 - fix(sdig-workspace)
|
||||||
make workspace view externally controllable and preserve explicit initial state
|
make workspace view externally controllable and preserve explicit initial state
|
||||||
|
|
||||||
|
|||||||
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@signature.digital/catalog",
|
"name": "@signature.digital/catalog",
|
||||||
"version": "1.5.1",
|
"version": "1.6.0",
|
||||||
"private": false,
|
"private": false,
|
||||||
"description": "A comprehensive catalog of customizable web components designed for building and managing e-signature applications.",
|
"description": "A comprehensive catalog of customizable web components designed for building and managing e-signature applications.",
|
||||||
"exports": {
|
"exports": {
|
||||||
|
|||||||
@@ -3,6 +3,6 @@
|
|||||||
*/
|
*/
|
||||||
export const commitinfo = {
|
export const commitinfo = {
|
||||||
name: '@signature.digital/catalog',
|
name: '@signature.digital/catalog',
|
||||||
version: '1.5.1',
|
version: '1.6.0',
|
||||||
description: 'A comprehensive catalog of customizable web components designed for building and managing e-signature applications.'
|
description: 'A comprehensive catalog of customizable web components designed for building and managing e-signature applications.'
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -14,6 +14,7 @@ export class SdigWorkspaceInbox extends DeesElement {
|
|||||||
public static demoGroups = ['Signature Digital Workspace'];
|
public static demoGroups = ['Signature Digital Workspace'];
|
||||||
|
|
||||||
@property({ type: String }) public accessor density: TDensity = 'comfortable';
|
@property({ type: String }) public accessor density: TDensity = 'comfortable';
|
||||||
|
@property({ attribute: false }) public accessor documents: IDocumentRow[] = demoDocuments;
|
||||||
@state() private accessor filter: string = 'all';
|
@state() private accessor filter: string = 'all';
|
||||||
@state() private accessor search: string = '';
|
@state() private accessor search: string = '';
|
||||||
|
|
||||||
@@ -45,7 +46,7 @@ export class SdigWorkspaceInbox extends DeesElement {
|
|||||||
`];
|
`];
|
||||||
|
|
||||||
private get filteredDocuments(): IDocumentRow[] {
|
private get filteredDocuments(): IDocumentRow[] {
|
||||||
return demoDocuments
|
return this.documents
|
||||||
.filter((doc) => this.filter === 'all' || doc.status === this.filter)
|
.filter((doc) => this.filter === 'all' || doc.status === this.filter)
|
||||||
.filter((doc) => !this.search || doc.title.toLowerCase().includes(this.search.toLowerCase()));
|
.filter((doc) => !this.search || doc.title.toLowerCase().includes(this.search.toLowerCase()));
|
||||||
}
|
}
|
||||||
@@ -62,23 +63,30 @@ export class SdigWorkspaceInbox extends DeesElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private openDocument(doc: IDocumentRow) {
|
private openDocument(doc: IDocumentRow) {
|
||||||
|
this.dispatchEvent(new CustomEvent('document-open', {
|
||||||
|
detail: { document: doc },
|
||||||
|
bubbles: true,
|
||||||
|
composed: true,
|
||||||
|
}));
|
||||||
requestWorkspaceView(this, doc.status === 'signed' ? 'audit' : 'sign');
|
requestWorkspaceView(this, doc.status === 'signed' ? 'audit' : 'sign');
|
||||||
}
|
}
|
||||||
|
|
||||||
public render(): TemplateResult {
|
public render(): TemplateResult {
|
||||||
|
const documents = this.documents;
|
||||||
const filters = [
|
const filters = [
|
||||||
{ id: 'all', label: 'All', count: demoDocuments.length },
|
{ id: 'all', label: 'All', count: documents.length },
|
||||||
{ id: 'awaiting', label: 'Awaiting', count: demoDocuments.filter((doc) => doc.status === 'awaiting').length },
|
{ id: 'awaiting', label: 'Awaiting', count: documents.filter((doc) => doc.status === 'awaiting').length },
|
||||||
{ id: 'signed', label: 'Completed', count: demoDocuments.filter((doc) => doc.status === 'signed').length },
|
{ id: 'signed', label: 'Completed', count: documents.filter((doc) => doc.status === 'signed').length },
|
||||||
{ id: 'draft', label: 'Drafts', count: demoDocuments.filter((doc) => doc.status === 'draft').length },
|
{ id: 'draft', label: 'Drafts', count: documents.filter((doc) => doc.status === 'draft').length },
|
||||||
{ id: 'declined', label: 'Declined', count: demoDocuments.filter((doc) => doc.status === 'declined').length },
|
{ id: 'declined', label: 'Declined', count: documents.filter((doc) => doc.status === 'declined').length },
|
||||||
];
|
];
|
||||||
|
const attentionCount = documents.filter((doc) => doc.status === 'awaiting').length;
|
||||||
|
|
||||||
return html`
|
return html`
|
||||||
${topBar({
|
${topBar({
|
||||||
breadcrumb: ['signature.digital', 'Lossless GmbH', 'Inbox'],
|
breadcrumb: ['signature.digital', 'Lossless GmbH', 'Inbox'],
|
||||||
title: 'Inbox',
|
title: 'Inbox',
|
||||||
subtitle: pill(`${demoDocuments.filter((doc) => doc.status === 'awaiting').length} need attention`, 'info'),
|
subtitle: pill(`${attentionCount} need attention`, 'info'),
|
||||||
actions: html`${actionButton('Import', 'outline', 'upload')}${actionButton('New document', 'primary', 'plus', () => requestWorkspaceView(this, 'compose'))}`,
|
actions: html`${actionButton('Import', 'outline', 'upload')}${actionButton('New document', 'primary', 'plus', () => requestWorkspaceView(this, 'compose'))}`,
|
||||||
})}
|
})}
|
||||||
<div class="filterbar">
|
<div class="filterbar">
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { DeesElement, property, html, customElement, type TemplateResult, css } from '@design.estate/dees-element';
|
import { DeesElement, property, html, customElement, type TemplateResult, css } from '@design.estate/dees-element';
|
||||||
import { icon, type TDensity, type TWorkspaceTheme, type TWorkspaceView } from './sdig-workspace.shared.js';
|
import { demoDocuments, icon, type IDocumentRow, type TDensity, type TWorkspaceTheme, type TWorkspaceView } from './sdig-workspace.shared.js';
|
||||||
import './sdig-workspace-inbox.js';
|
import './sdig-workspace-inbox.js';
|
||||||
import './sdig-workspace-compose.js';
|
import './sdig-workspace-compose.js';
|
||||||
import './sdig-workspace-sign.js';
|
import './sdig-workspace-sign.js';
|
||||||
@@ -23,6 +23,7 @@ export class SdigWorkspace extends DeesElement {
|
|||||||
@property({ type: String, reflect: true }) public accessor theme: TWorkspaceTheme = 'dark';
|
@property({ type: String, reflect: true }) public accessor theme: TWorkspaceTheme = 'dark';
|
||||||
@property({ type: String }) public accessor initialView: TWorkspaceView = 'inbox';
|
@property({ type: String }) public accessor initialView: TWorkspaceView = 'inbox';
|
||||||
@property({ type: String, reflect: true }) public accessor view: TWorkspaceView = 'inbox';
|
@property({ type: String, reflect: true }) public accessor view: TWorkspaceView = 'inbox';
|
||||||
|
@property({ attribute: false }) public accessor documents: IDocumentRow[] = demoDocuments;
|
||||||
|
|
||||||
public connectedCallback = async () => {
|
public connectedCallback = async () => {
|
||||||
await super.connectedCallback();
|
await super.connectedCallback();
|
||||||
@@ -133,7 +134,7 @@ export class SdigWorkspace extends DeesElement {
|
|||||||
|
|
||||||
private renderSidebar(): TemplateResult {
|
private renderSidebar(): TemplateResult {
|
||||||
const navItems = [
|
const navItems = [
|
||||||
{ id: 'inbox', label: 'Inbox', icon: 'inbox', count: 4 },
|
{ id: 'inbox', label: 'Inbox', icon: 'inbox', count: this.documents.length },
|
||||||
{ id: 'compose', label: 'Compose', icon: 'plus' },
|
{ id: 'compose', label: 'Compose', icon: 'plus' },
|
||||||
{ id: 'templates', label: 'Templates', icon: 'folder', count: 12 },
|
{ id: 'templates', label: 'Templates', icon: 'folder', count: 12 },
|
||||||
{ id: 'audit', label: 'Audit Trail', icon: 'shield' },
|
{ id: 'audit', label: 'Audit Trail', icon: 'shield' },
|
||||||
@@ -159,7 +160,7 @@ export class SdigWorkspace extends DeesElement {
|
|||||||
|
|
||||||
private renderView(): TemplateResult {
|
private renderView(): TemplateResult {
|
||||||
switch (this.view) {
|
switch (this.view) {
|
||||||
case 'inbox': return html`<sdig-workspace-inbox class="view-host" .density=${this.density}></sdig-workspace-inbox>`;
|
case 'inbox': return html`<sdig-workspace-inbox class="view-host" .density=${this.density} .documents=${this.documents}></sdig-workspace-inbox>`;
|
||||||
case 'compose': return html`<sdig-workspace-compose class="view-host"></sdig-workspace-compose>`;
|
case 'compose': return html`<sdig-workspace-compose class="view-host"></sdig-workspace-compose>`;
|
||||||
case 'sign': return html`<sdig-workspace-sign class="view-host"></sdig-workspace-sign>`;
|
case 'sign': return html`<sdig-workspace-sign class="view-host"></sdig-workspace-sign>`;
|
||||||
case 'audit': return html`<sdig-workspace-audit class="view-host"></sdig-workspace-audit>`;
|
case 'audit': return html`<sdig-workspace-audit class="view-host"></sdig-workspace-audit>`;
|
||||||
@@ -167,7 +168,7 @@ export class SdigWorkspace extends DeesElement {
|
|||||||
case 'templates': return html`<sdig-workspace-placeholder class="view-host" label="Templates" subtitle="Reusable agreement templates"></sdig-workspace-placeholder>`;
|
case 'templates': return html`<sdig-workspace-placeholder class="view-host" label="Templates" subtitle="Reusable agreement templates"></sdig-workspace-placeholder>`;
|
||||||
case 'team': return html`<sdig-workspace-placeholder class="view-host" label="Team" subtitle="Workspace members & roles"></sdig-workspace-placeholder>`;
|
case 'team': return html`<sdig-workspace-placeholder class="view-host" label="Team" subtitle="Workspace members & roles"></sdig-workspace-placeholder>`;
|
||||||
case 'settings': return html`<sdig-workspace-placeholder class="view-host" label="Settings" subtitle="Workspace, billing, security"></sdig-workspace-placeholder>`;
|
case 'settings': return html`<sdig-workspace-placeholder class="view-host" label="Settings" subtitle="Workspace, billing, security"></sdig-workspace-placeholder>`;
|
||||||
default: return html`<sdig-workspace-inbox class="view-host" .density=${this.density}></sdig-workspace-inbox>`;
|
default: return html`<sdig-workspace-inbox class="view-host" .density=${this.density} .documents=${this.documents}></sdig-workspace-inbox>`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user