@kya-os/consent 0.1.0 → 0.1.1

package/dist/components/consent-permissions.js

@@ -0,0 +1,430 @@
+/**
+ * Consent Permissions Web Component
+ *
+ * Renders a list of permission scopes that the agent is requesting.
+ * Can be interactive (with checkboxes) or display-only.
+ *
+ * @module components/consent-permissions
+ */
+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;
+};
+import { LitElement, html, css } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+/**
+ * ConsentPermissions - Permission list component
+ *
+ * @example
+ * ```html
+ * <!-- Display-only mode -->
+ * <consent-permissions
+ *   scopes='["read:profile", "write:data"]'
+ * ></consent-permissions>
+ *
+ * <!-- Interactive mode -->
+ * <consent-permissions
+ *   scopes='[{"id": "read:profile", "label": "Read profile", "required": true}]'
+ *   interactive
+ * ></consent-permissions>
+ * ```
+ *
+ * @fires change - Fired when permissions selection changes (interactive mode)
+ * @csspart list - The permissions list container
+ * @csspart item - Individual permission item
+ * @cssprop --consent-primary - Primary brand color for icons/checkboxes
+ */
+let ConsentPermissions = class ConsentPermissions extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * Permission scopes - can be string array or PermissionItem array
+         * Accepts JSON string for attribute binding
+         */
+        this.scopes = [];
+        /**
+         * Enable interactive mode with checkboxes
+         */
+        this.interactive = false;
+        /**
+         * Pre-select all scopes in interactive mode (default: only required scopes are pre-selected)
+         */
+        this.selectAll = false;
+        /**
+         * Icon to show next to each permission
+         * Options: 'check', 'bullet', 'shield'
+         */
+        this.iconStyle = 'check';
+        /**
+         * Internal state for selected permissions in interactive mode
+         */
+        this.selectedScopes = new Set();
+        /**
+         * Track previous scope IDs to detect newly added scopes
+         * (used to distinguish new scopes from user-deselected scopes)
+         */
+        this.previousScopeIds = new Set();
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        // Initialize selected scopes with required permissions in interactive mode
+        if (this.interactive) {
+            this.initializeSelectedScopes();
+        }
+    }
+    updated(changedProperties) {
+        // Re-initialize selected scopes when scopes property changes dynamically
+        if (changedProperties.has('scopes') && this.interactive) {
+            this.reinitializeSelectedScopes();
+        }
+    }
+    /**
+     * Re-initialize selected scopes when scopes change dynamically.
+     * Preserves existing valid selections while adding new scopes based on selectAll/required settings.
+     */
+    reinitializeSelectedScopes() {
+        const currentScopeIds = new Set(this.normalizedScopes.map((s) => s.id));
+        // Remove selections that are no longer in the scopes list
+        const validSelections = new Set(Array.from(this.selectedScopes).filter((id) => currentScopeIds.has(id)));
+        // Identify truly NEW scopes (not previously shown to user)
+        const newScopeIds = Array.from(currentScopeIds).filter((id) => !this.previousScopeIds.has(id));
+        if (this.selectAll) {
+            // Auto-select only NEW scopes, preserving user's existing deselections
+            this.selectedScopes = new Set([...validSelections, ...newScopeIds]);
+        }
+        else {
+            // Add required scopes that aren't already selected
+            const requiredIds = this.normalizedScopes
+                .filter((s) => s.required)
+                .map((s) => s.id);
+            this.selectedScopes = new Set([...validSelections, ...requiredIds]);
+        }
+        // Update tracking of which scopes user has seen
+        this.previousScopeIds = currentScopeIds;
+        // Emit change event so parent stays in sync
+        this.dispatchEvent(new CustomEvent('change', {
+            detail: { selected: this.getSelectedScopes() },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    initializeSelectedScopes() {
+        // Track initial scopes for detecting new ones later
+        this.previousScopeIds = new Set(this.normalizedScopes.map((scope) => scope.id));
+        if (this.selectAll) {
+            // Pre-select all scopes
+            this.selectedScopes = new Set(this.normalizedScopes.map((scope) => scope.id));
+        }
+        else {
+            // Only pre-select required scopes
+            this.selectedScopes = new Set(this.normalizedScopes
+                .filter((scope) => scope.required)
+                .map((scope) => scope.id));
+        }
+    }
+    /**
+     * Normalize scopes to PermissionItem format
+     */
+    get normalizedScopes() {
+        return this.scopes.map((scope) => {
+            if (typeof scope === 'string') {
+                return {
+                    id: scope,
+                    label: this.formatScopeLabel(scope),
+                };
+            }
+            return scope;
+        });
+    }
+    /**
+     * Convert scope ID to human-readable label
+     */
+    formatScopeLabel(scopeId) {
+        // Convert 'read:profile' to 'Read profile'
+        return scopeId
+            .replace(/[_:-]/g, ' ')
+            .replace(/\b\w/g, (char) => char.toUpperCase());
+    }
+    /**
+     * Get currently selected scopes
+     */
+    getSelectedScopes() {
+        return Array.from(this.selectedScopes);
+    }
+    handleCheckboxChange(scopeId, checked) {
+        if (checked) {
+            this.selectedScopes.add(scopeId);
+        }
+        else {
+            this.selectedScopes.delete(scopeId);
+        }
+        this.requestUpdate();
+        this.dispatchEvent(new CustomEvent('change', {
+            detail: { selected: this.getSelectedScopes() },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    renderIcon() {
+        switch (this.iconStyle) {
+            case 'bullet':
+                return html `<div class="icon icon-bullet"></div>`;
+            case 'shield':
+                return html `
+          <div class="icon icon-shield">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+            >
+              <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
+            </svg>
+          </div>
+        `;
+            default:
+                return html `
+          <div class="icon icon-check">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+            >
+              <polyline points="20 6 9 17 4 12" />
+            </svg>
+          </div>
+        `;
+        }
+    }
+    renderPermissionItem(scope) {
+        const isSelected = this.selectedScopes.has(scope.id);
+        return html `
+      <li class="permission-item" part="item">
+        ${this.interactive
+            ? html `
+              <input
+                type="checkbox"
+                class="checkbox"
+                .checked=${isSelected}
+                ?disabled=${scope.required}
+                @change=${(e) => this.handleCheckboxChange(scope.id, e.target.checked)}
+                aria-label=${scope.label}
+              />
+            `
+            : this.renderIcon()}
+        <div class="content">
+          <span class="label">
+            ${scope.label}
+            ${scope.required
+            ? html `<span class="required-badge">Required</span>`
+            : null}
+          </span>
+          ${scope.description
+            ? html `<div class="description">${scope.description}</div>`
+            : null}
+        </div>
+      </li>
+    `;
+    }
+    render() {
+        const scopes = this.normalizedScopes;
+        if (scopes.length === 0) {
+            return html `<div class="empty">No permissions requested</div>`;
+        }
+        return html `
+      <ul class="permission-list" part="list" role="list">
+        ${scopes.map((scope) => this.renderPermissionItem(scope))}
+      </ul>
+    `;
+    }
+};
+ConsentPermissions.styles = css `
+    :host {
+      display: block;
+      --_primary: var(--consent-primary, #2563eb);
+    }
+
+    .permission-list {
+      list-style: none;
+      padding: 0;
+      margin: 0;
+    }
+
+    .permission-item {
+      display: flex;
+      align-items: flex-start;
+      gap: 0.75rem;
+      padding: 0.625rem 0;
+      font-size: 0.875rem;
+      color: #374151;
+      border-bottom: 1px solid #f3f4f6;
+    }
+
+    .permission-item:last-child {
+      border-bottom: none;
+    }
+
+    /* Icon styles */
+    .icon {
+      flex-shrink: 0;
+      width: 1.25rem;
+      height: 1.25rem;
+      margin-top: 0.0625rem;
+    }
+
+    .icon-check {
+      background: var(--_primary);
+      border-radius: 0.25rem;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .icon-check svg {
+      width: 0.75rem;
+      height: 0.75rem;
+      color: white;
+    }
+
+    .icon-bullet {
+      background: var(--_primary);
+      border-radius: 50%;
+      width: 0.5rem;
+      height: 0.5rem;
+      margin: 0.375rem;
+    }
+
+    .icon-shield {
+      color: var(--_primary);
+    }
+
+    .icon-shield svg {
+      width: 1.25rem;
+      height: 1.25rem;
+    }
+
+    /* Content */
+    .content {
+      flex: 1;
+    }
+
+    .label {
+      font-weight: 500;
+      color: #111827;
+    }
+
+    .description {
+      font-size: 0.75rem;
+      color: #6b7280;
+      margin-top: 0.125rem;
+    }
+
+    .required-badge {
+      font-size: 0.625rem;
+      text-transform: uppercase;
+      letter-spacing: 0.05em;
+      color: #6b7280;
+      background: #f3f4f6;
+      padding: 0.125rem 0.375rem;
+      border-radius: 0.25rem;
+      margin-left: 0.5rem;
+    }
+
+    /* Interactive mode checkbox */
+    .checkbox {
+      appearance: none;
+      -webkit-appearance: none;
+      width: 1rem;
+      height: 1rem;
+      border: 1px solid #d1d5db;
+      border-radius: 0.25rem;
+      background: white;
+      cursor: pointer;
+      position: relative;
+      flex-shrink: 0;
+      margin-top: 0.125rem;
+    }
+
+    .checkbox:checked {
+      background: var(--_primary);
+      border-color: var(--_primary);
+    }
+
+    .checkbox:checked::after {
+      content: '';
+      position: absolute;
+      left: 4px;
+      top: 1px;
+      width: 5px;
+      height: 9px;
+      border: solid white;
+      border-width: 0 2px 2px 0;
+      transform: rotate(45deg);
+    }
+
+    .checkbox:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+
+    .checkbox:focus-visible {
+      outline: 2px solid var(--_primary);
+      outline-offset: 2px;
+    }
+
+    /* Empty state */
+    .empty {
+      text-align: center;
+      color: #6b7280;
+      font-size: 0.875rem;
+      padding: 1rem 0;
+    }
+  `;
+__decorate([
+    property({
+        type: Array,
+        converter: {
+            fromAttribute: (value) => {
+                if (!value)
+                    return [];
+                try {
+                    const parsed = JSON.parse(value);
+                    // Validate that parsed result is actually an array
+                    if (!Array.isArray(parsed)) {
+                        console.warn('[consent-permissions] Expected array, got:', typeof parsed);
+                        return [];
+                    }
+                    return parsed;
+                }
+                catch {
+                    return [];
+                }
+            },
+            toAttribute: (value) => {
+                return JSON.stringify(value);
+            },
+        },
+    })
+], ConsentPermissions.prototype, "scopes", void 0);
+__decorate([
+    property({ type: Boolean })
+], ConsentPermissions.prototype, "interactive", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'select-all' })
+], ConsentPermissions.prototype, "selectAll", void 0);
+__decorate([
+    property({ type: String, attribute: 'icon-style' })
+], ConsentPermissions.prototype, "iconStyle", void 0);
+__decorate([
+    state()
+], ConsentPermissions.prototype, "selectedScopes", void 0);
+ConsentPermissions = __decorate([
+    customElement('consent-permissions')
+], ConsentPermissions);
+export { ConsentPermissions };
+//# sourceMappingURL=consent-permissions.js.map

package/dist/components/consent-permissions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"consent-permissions.js","sourceRoot":"","sources":["../../src/components/consent-permissions.ts"],"names":[],"mappings":"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"}

package/dist/components/consent-shell.d.ts

@@ -0,0 +1,72 @@
+/**
+ * Consent Shell Web Component
+ *
+ * The main container for consent pages. Provides:
+ * - Card-like container with shadow and rounded corners
+ * - Header section with logo and title
+ * - Content area for auth-specific content
+ * - Footer for action buttons
+ *
+ * @module components/consent-shell
+ */
+import { LitElement } from 'lit';
+/**
+ * ConsentShell - Container component for consent pages
+ *
+ * @example
+ * ```html
+ * <consent-shell
+ *   page-title="Permission Request"
+ *   logo-url="https://example.com/logo.png"
+ *   company-name="Acme Corp"
+ *   primary-color="#2563EB"
+ * >
+ *   <div slot="content">
+ *     <!-- Auth-specific content -->
+ *   </div>
+ *   <div slot="footer">
+ *     <consent-button variant="secondary">Cancel</consent-button>
+ *     <consent-button variant="primary">Allow</consent-button>
+ *   </div>
+ * </consent-shell>
+ * ```
+ *
+ * @slot content - Main content area
+ * @slot footer - Action buttons area
+ * @csspart container - The outer card container
+ * @csspart header - The header section
+ * @csspart content - The content section
+ * @csspart footer - The footer section
+ */
+export declare class ConsentShell extends LitElement {
+    /**
+     * Page title (renamed from 'title' to avoid conflict with HTMLElement.title)
+     */
+    pageTitle: string;
+    /**
+     * Company logo URL
+     */
+    logoUrl?: string;
+    /**
+     * Company name (shown below logo or as fallback)
+     */
+    companyName?: string;
+    /**
+     * Primary brand color
+     */
+    primaryColor: string;
+    /**
+     * Secondary brand color
+     */
+    secondaryColor: string;
+    static styles: import("lit").CSSResult;
+    private renderLogo;
+    protected updated(changedProperties: Map<string, unknown>): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'consent-shell': ConsentShell;
+    }
+}
+//# sourceMappingURL=consent-shell.d.ts.map

package/dist/components/consent-shell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"consent-shell.d.ts","sourceRoot":"","sources":["../../src/components/consent-shell.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAG5C;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,qBACa,YAAa,SAAQ,UAAU;IAC1C;;OAEG;IAEH,SAAS,SAAwB;IAEjC;;OAEG;IAEH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IAEH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IAEH,YAAY,SAAa;IAEzB;;OAEG;IAEH,cAAc,SAAa;IAE3B,OAAgB,MAAM,0BAqFpB;IAEF,OAAO,CAAC,UAAU;cAkCC,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAWzD,MAAM;CAqBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}