@social.io/catalog 1.3.0 → 2.1.0

package/dist_ts_web/elements/sio-conversation-list.js

@@ -1,495 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-import { DeesElement, property, html, customElement, cssManager } from '@design.estate/dees-element';
-import * as domtools from '@design.estate/dees-domtools';
-import * as sioInterfaces from '@social.io/interfaces';
-// Import design tokens
-import { colors, bdTheme } from './00colors.js';
-import { spacing, radius, shadows, transitions } from './00tokens.js';
-import { fontFamilies, typography } from './00fonts.js';
-let SioConversationList = class SioConversationList extends DeesElement {
-    constructor() {
-        super(...arguments);
-        this.selectedId = null;
-        this.searchQuery = '';
-        // Demo conversations
-        this.conversations = [
-            {
-                id: '1',
-                subject: 'Pricing page inquiry',
-                parties: [
-                    {
-                        id: '1',
-                        description: 'Lossless Support',
-                        name: 'Lossless Support',
-                    },
-                    {
-                        id: '2',
-                        description: 'you',
-                        name: 'you',
-                    },
-                ],
-                conversationBlocks: [
-                    {
-                        partyId: '1',
-                        text: 'Hello there :) How can we help you?',
-                    },
-                    {
-                        partyId: '2',
-                        text: 'Hi! Where is your pricing page?',
-                    },
-                ],
-            },
-            {
-                id: '2',
-                subject: 'Technical issue with login',
-                parties: [
-                    {
-                        id: '1',
-                        description: 'Tech Support',
-                        name: 'Tech Support',
-                    },
-                    {
-                        id: '2',
-                        description: 'you',
-                        name: 'you',
-                    },
-                ],
-                conversationBlocks: [
-                    {
-                        partyId: '1',
-                        text: 'I see you\'re having trouble logging in. Let me help you with that.',
-                    },
-                    {
-                        partyId: '2',
-                        text: 'Yes, I keep getting an error when I try to sign in.',
-                    },
-                ],
-            },
-            {
-                id: '3',
-                subject: 'Feature request - Dark mode',
-                parties: [
-                    {
-                        id: '1',
-                        description: 'Product Team',
-                        name: 'Product Team',
-                    },
-                    {
-                        id: '2',
-                        description: 'you',
-                        name: 'you',
-                    },
-                ],
-                conversationBlocks: [
-                    {
-                        partyId: '2',
-                        text: 'I\'d love to see dark mode support in your app!',
-                    },
-                    {
-                        partyId: '1',
-                        text: 'Thanks for the suggestion! We\'re actually working on that.',
-                    },
-                ],
-            },
-            {
-                id: '4',
-                subject: 'Billing question',
-                parties: [
-                    {
-                        id: '1',
-                        description: 'Billing Support',
-                        name: 'Billing Support',
-                    },
-                    {
-                        id: '2',
-                        description: 'you',
-                        name: 'you',
-                    },
-                ],
-                conversationBlocks: [
-                    {
-                        partyId: '2',
-                        text: 'I have a question about my last invoice.',
-                    },
-                    {
-                        partyId: '1',
-                        text: 'I\'d be happy to help you with that. Can you provide your account number?',
-                    },
-                ],
-            },
-        ];
-    }
-    static { this.demo = () => html `<sio-conversation-list></sio-conversation-list>`; }
-    render() {
-        const filteredConversations = this.conversations.filter(conv => conv.subject.toLowerCase().includes(this.searchQuery.toLowerCase()) ||
-            conv.conversationBlocks.some(block => block.text.toLowerCase().includes(this.searchQuery.toLowerCase())));
-        return html `
-      ${domtools.elementBasic.styles}
-      <style>
-        :host {
-          display: flex;
-          flex-direction: column;
-          height: 100%;
-          width: 100%;
-          background: ${bdTheme('card')};
-          color: ${bdTheme('foreground')};
-          font-family: ${fontFamilies.sans};
-          overflow: hidden;
-        }
-
-        /* Header */
-        .header {
-          flex-shrink: 0;
-          padding: ${spacing[5]};
-          background: ${bdTheme('background')};
-          border-bottom: 1px solid ${bdTheme('border')};
-        }
-
-        .header-content {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          margin-bottom: ${spacing[4]};
-        }
-
-        .logo-section {
-          display: flex;
-          align-items: center;
-          gap: ${spacing[3]};
-        }
-
-        .logo {
-          width: 40px;
-          height: 40px;
-          border-radius: ${radius.lg};
-          background: ${bdTheme('primary')};
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          color: ${bdTheme('primaryForeground')};
-          font-weight: 600;
-          ${typography.body}
-        }
-
-        .company-info h2 {
-          margin: 0;
-          ${typography.h4}
-          color: ${bdTheme('foreground')};
-        }
-
-        .company-info p {
-          margin: 0;
-          ${typography.caption}
-          color: ${bdTheme('mutedForeground')};
-        }
-
-        .new-chat-button {
-          width: 32px;
-          height: 32px;
-          border-radius: ${radius.md};
-          background: transparent;
-          border: 1px solid ${bdTheme('border')};
-          cursor: pointer;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          color: ${bdTheme('mutedForeground')};
-          transition: ${transitions.all};
-        }
-
-        .new-chat-button:hover {
-          background: ${bdTheme('accent')};
-          color: ${bdTheme('foreground')};
-          border-color: ${bdTheme('accent')};
-        }
-
-        /* Search */
-        .search-container {
-          position: relative;
-        }
-
-        .search-input {
-          width: 100%;
-          padding: ${spacing[2]} ${spacing[10]} ${spacing[2]} ${spacing[4]};
-          background: ${bdTheme('muted')};
-          border: 1px solid transparent;
-          border-radius: ${radius.lg};
-          color: ${bdTheme('foreground')};
-          font-family: ${fontFamilies.sans};
-          ${typography.bodySmall}
-          outline: none;
-          transition: ${transitions.all};
-        }
-
-        .search-input:focus {
-          background: ${bdTheme('background')};
-          border-color: ${bdTheme('border')};
-        }
-
-        .search-icon {
-          position: absolute;
-          right: ${spacing[3]};
-          top: 50%;
-          transform: translateY(-50%);
-          color: ${bdTheme('mutedForeground')};
-          pointer-events: none;
-        }
-
-        /* Conversations list */
-        .conversations-container {
-          flex: 1;
-          overflow-y: auto;
-          padding: ${spacing[2]};
-        }
-
-        .conversation-item {
-          display: block;
-          padding: ${spacing[4]};
-          margin-bottom: ${spacing[2]};
-          background: ${bdTheme('background')};
-          border: 1px solid ${bdTheme('border')};
-          border-radius: ${radius.lg};
-          cursor: pointer;
-          transition: ${transitions.all};
-          position: relative;
-          overflow: hidden;
-        }
-
-        .conversation-item:hover {
-          background: ${bdTheme('accent')};
-          border-color: ${cssManager.bdTheme('hsl(214.3 31.8% 80%)', 'hsl(217.2 32.6% 25%)')};
-          transform: translateY(-1px);
-          box-shadow: ${shadows.sm};
-        }
-
-        .conversation-item.selected {
-          background: ${bdTheme('accent')};
-          border-color: ${bdTheme('primary')};
-          box-shadow: 0 0 0 1px ${bdTheme('primary')};
-        }
-
-        .conversation-header {
-          display: flex;
-          align-items: center;
-          gap: ${spacing[3]};
-          margin-bottom: ${spacing[2]};
-        }
-
-        .avatar {
-          width: 40px;
-          height: 40px;
-          border-radius: ${radius.full};
-          background: ${bdTheme('primary')};
-          color: ${bdTheme('primaryForeground')};
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          font-weight: 600;
-          ${typography.bodySmall}
-          flex-shrink: 0;
-        }
-
-        .conversation-meta {
-          flex: 1;
-          min-width: 0;
-        }
-
-        .conversation-title {
-          ${typography.body}
-          font-weight: 600;
-          color: ${bdTheme('foreground')};
-          margin-bottom: ${spacing[0.5]};
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-        }
-
-        .conversation-time {
-          ${typography.caption}
-          color: ${bdTheme('mutedForeground')};
-        }
-
-        .conversation-preview {
-          ${typography.bodySmall}
-          color: ${bdTheme('mutedForeground')};
-          line-height: 1.5;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          display: -webkit-box;
-          -webkit-line-clamp: 2;
-          -webkit-box-orient: vertical;
-          margin-top: ${spacing[2]};
-        }
-
-        .unread-indicator {
-          position: absolute;
-          top: ${spacing[4]};
-          right: ${spacing[4]};
-          width: 8px;
-          height: 8px;
-          border-radius: ${radius.full};
-          background: ${bdTheme('primary')};
-        }
-
-        /* Empty state */
-        .empty-state {
-          flex: 1;
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          justify-content: center;
-          padding: ${spacing[8]};
-          text-align: center;
-        }
-
-        .empty-state-icon {
-          font-size: 48px;
-          color: ${bdTheme('mutedForeground')};
-          opacity: 0.5;
-          margin-bottom: ${spacing[4]};
-        }
-
-        .empty-state-text {
-          ${typography.body}
-          color: ${bdTheme('mutedForeground')};
-        }
-
-        /* Footer */
-        .footer {
-          flex-shrink: 0;
-          padding: ${spacing[3]};
-          background: ${bdTheme('muted')};
-          text-align: center;
-          ${typography.caption}
-          color: ${bdTheme('mutedForeground')};
-          border-top: 1px solid ${bdTheme('border')};
-        }
-      </style>
-      
-      <div class="header">
-        <div class="header-content">
-          <div class="logo-section">
-            <div class="logo">S</div>
-            <div class="company-info">
-              <h2>Messages</h2>
-              <p>${this.conversations.length} conversations</p>
-            </div>
-          </div>
-          <button class="new-chat-button" @click=${this.startNewChat}>
-            <dees-icon iconFA="plus"></dees-icon>
-          </button>
-        </div>
-        <div class="search-container">
-          <input 
-            type="text" 
-            class="search-input" 
-            placeholder="Search conversations..."
-            .value=${this.searchQuery}
-            @input=${(e) => this.searchQuery = e.target.value}
-          />
-          <div class="search-icon">
-            <dees-icon iconFA="search"></dees-icon>
-          </div>
-        </div>
-      </div>
-
-      <div class="conversations-container">
-        ${filteredConversations.length === 0 ? html `
-          <div class="empty-state">
-            <div class="empty-state-icon">
-              <dees-icon iconFA="comments"></dees-icon>
-            </div>
-            <div class="empty-state-text">
-              ${this.searchQuery ? 'No conversations match your search' : 'No conversations yet'}
-            </div>
-          </div>
-        ` : html `
-          ${filteredConversations.map((conversation) => {
-            const lastMessage = conversation.conversationBlocks[conversation.conversationBlocks.length - 1];
-            const otherParty = conversation.parties.find(p => p.id !== '2');
-            const isUnread = Math.random() > 0.7; // Simulated unread status
-            return html `
-              <div 
-                class="conversation-item ${this.selectedId === conversation.id ? 'selected' : ''}"
-                @click=${() => this.selectConversation(conversation)}
-              >
-                ${isUnread && this.selectedId !== conversation.id ? html `
-                  <div class="unread-indicator"></div>
-                ` : ''}
-                <div class="conversation-header">
-                  <div class="avatar">
-                    ${otherParty?.name?.charAt(0).toUpperCase() || 'S'}
-                  </div>
-                  <div class="conversation-meta">
-                    <div class="conversation-title">${conversation.subject}</div>
-                    <div class="conversation-time">
-                      ${this.formatTime(new Date())}
-                    </div>
-                  </div>
-                </div>
-                <div class="conversation-preview">
-                  ${lastMessage.text}
-                </div>
-              </div>
-            `;
-        })}
-        `}
-      </div>
-
-      <div class="footer">
-        Powered by social.io
-      </div>
-    `;
-    }
-    selectConversation(conversation) {
-        this.dispatchEvent(new CustomEvent('conversation-selected', {
-            detail: conversation,
-            bubbles: true,
-            composed: true
-        }));
-    }
-    startNewChat() {
-        this.dispatchEvent(new CustomEvent('new-chat', {
-            bubbles: true,
-            composed: true
-        }));
-    }
-    formatTime(date) {
-        const now = new Date();
-        const diff = now.getTime() - date.getTime();
-        const days = Math.floor(diff / (1000 * 60 * 60 * 24));
-        if (days === 0) {
-            return date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
-        }
-        else if (days === 1) {
-            return 'Yesterday';
-        }
-        else if (days < 7) {
-            return `${days} days ago`;
-        }
-        else {
-            return date.toLocaleDateString();
-        }
-    }
-};
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], SioConversationList.prototype, "selectedId", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], SioConversationList.prototype, "searchQuery", void 0);
-SioConversationList = __decorate([
-    customElement('sio-conversation-list')
-], SioConversationList);
-export { SioConversationList };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lvLWNvbnZlcnNhdGlvbi1saXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL3Npby1jb252ZXJzYXRpb24tbGlzdC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFBQSxPQUFPLEVBQUUsV0FBVyxFQUFFLFFBQVEsRUFBRSxJQUFJLEVBQUUsYUFBYSxFQUF1QixVQUFVLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUMxSCxPQUFPLEtBQUssUUFBUSxNQUFNLDhCQUE4QixDQUFDO0FBRXpELE9BQU8sS0FBSyxhQUFhLE1BQU0sdUJBQXVCLENBQUM7QUFFdkQsdUJBQXVCO0FBQ3ZCLE9BQU8sRUFBRSxNQUFNLEVBQUUsT0FBTyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2hELE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdEUsT0FBTyxFQUFFLFlBQVksRUFBRSxVQUFVLEVBQUUsTUFBTSxjQUFjLENBQUM7QUFjakQsSUFBTSxtQkFBbUIsR0FBekIsTUFBTSxtQkFBb0IsU0FBUSxXQUFXO0lBQTdDOztRQUVFLGVBQVUsR0FBa0IsSUFBSSxDQUFDO1FBR2pDLGdCQUFXLEdBQVcsRUFBRSxDQUFDO1FBRWhDLHFCQUFxQjtRQUNkLGtCQUFhLEdBQTZCO1lBQy9DO2dCQUNFLEVBQUUsRUFBRSxHQUFHO2dCQUNQLE9BQU8sRUFBRSxzQkFBc0I7Z0JBQy9CLE9BQU8sRUFBRTtvQkFDUDt3QkFDRSxFQUFFLEVBQUUsR0FBRzt3QkFDUCxXQUFXLEVBQUUsa0JBQWtCO3dCQUMvQixJQUFJLEVBQUUsa0JBQWtCO3FCQUN6QjtvQkFDRDt3QkFDRSxFQUFFLEVBQUUsR0FBRzt3QkFDUCxXQUFXLEVBQUUsS0FBSzt3QkFDbEIsSUFBSSxFQUFFLEtBQUs7cUJBQ1o7aUJBQ0Y7Z0JBQ0Qsa0JBQWtCLEVBQUU7b0JBQ2xCO3dCQUNFLE9B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

package/dist_ts_web/elements/sio-recorder.d.ts

@@ -1,60 +0,0 @@
-import { DeesElement } from '@design.estate/dees-element';
-/**
- * Use rrweb's eventWithTime if you like strict typing:
- *
- *   import { eventWithTime } from 'rrweb';
- *   export interface IRecordingEvent extends eventWithTime {}
- *
- * Here, for brevity, we define an empty interface
- * and cast all events to any.
- */
-export interface IRecordingEvent {
-}
-export declare class SioRecorder extends DeesElement {
-    static demo: () => import("@design.estate/dees-element").TemplateResult<1>;
-    /**
-     * Holds all recorded events from rrweb.
-     */
-    private events;
-    /**
-     * status
-     */
-    status: 'recording' | 'playing' | 'stopped';
-    /**
-     * A reference to rrweb's stop recording function.
-     * We'll store it when we begin a record session so we can call it later.
-     */
-    private stopFn;
-    /**
-     * Query for the div in our template that will be used for playback.
-     */
-    private accessor playbackDiv;
-    static styles: import("@design.estate/dees-element").CSSResult;
-    render(): import("@design.estate/dees-element").TemplateResult<1>;
-    /**
-     * Lifecycle: Called when the element is inserted into the DOM.
-     */
-    connectedCallback(): Promise<void>;
-    /**
-     * Lifecycle: Called when the element is removed from the DOM.
-     */
-    disconnectedCallback(): Promise<void>;
-    /**
-     * Starts an rrweb recording session that tracks the entire DOM,
-     * including canvases and cross-origin iframes (if permissible).
-     */
-    private startRecording;
-    /**
-     * Stops the rrweb recording session
-     */
-    private stopRecording;
-    /**
-     * Plays back the recorded events in the `playbackDiv`
-     */
-    private playRecording;
-    fixPosition(): Promise<void>;
-    /**
-     * Keydown handler. If Ctrl + H is pressed, stop the recording and replay the session
-     */
-    private handleKeydown;
-}