@stratametriq/id-card-designer 1.11.0 → 1.13.0

package/README.md

@@ -2,7 +2,7 @@
 
 A universal, dynamic, and highly customizable **ID Card Designer & Batch Print Dashboard** for React, Vue, Angular, and Vanilla JS.
 
-> **Current release:** 1.11.0
+> **Current release:** 1.13.0
 
 ---
 
@@ -10,8 +10,7 @@ A universal, dynamic, and highly customizable **ID Card Designer & Batch Print D
 
 - [Overview](#overview)
 - [Live Demo](#live-demo)
-- [What's New in v1.11.0](#whats-new-in-v1110)
-- [What's New in v1.10.0](#whats-new-in-v1100)
+- [What's New in v1.13.0](#whats-new-in-v1130)
 - [Features](#features)
 - [ID Card Verification & Card Lifecycle](#id-card-verification--card-lifecycle)
 - [How It Works](#how-it-works)
@@ -52,20 +51,23 @@ You can launch a complete ID card design studio and batch print dashboard with j
 
 ---
 
-## What's New in v1.11.0
-- **ID Card Digital Verification & Card Lifecycle Suite:** Upgrades `@stratametriq/id-card-designer` from a badge design canvas into a complete Enterprise Credential & Anti-Counterfeiting Platform.
-  - **Standalone `<IdCardVerificationModal />`:** Mobile-friendly digital verification certificate featuring real-time status banners (🟢 `Active`, 🟣 `Issued`, ⚪ `Draft`, 🟠 `Suspended`, 🔴 `Revoked`, 🚨 `Lost`), official database photo matching, and digital checksum verification.
-  - **Built-in HTML5 Camera Scanner:** Optical scanner using `getUserMedia` with targeting reticle overlay for instant badge scanning via laptop webcams or smartphone cameras.
-  - **Live Roster Lifecycle Controls:** Added interactive **Status Column** in `<IdCardManager />` with 1-click status switcher dropdowns, row-level **"Verify"** action buttons, and **Batch Action ▾** menu.
-  - **Smart Lifecycle Filter Tabs:** 1-Click filter toolbar (`All`, `Active`, `Issued`, `Draft`, `Suspended`, `Revoked`, `Selected`).
-  - **Automatic Print Issuance Promotion:** Batch PDF or ZIP export automatically promotes printed cards to **`Issued`** status with an ISO issuance timestamp (`issuedAt`).
-  - **Dynamic Verification QR Code Preset:** Dedicated "Verification QR" button and configuration in Property Editor with dynamic URL binding for live scanning.
+## What's New in v1.13.0
+- **Organization & Multi-Tenant Workspace Suite:** Added an enterprise organization profile and branch workspace system into `<IdCardManager />` for schools, universities, hospitals, corporate enterprises, and SaaS host applications.
+  - **Institutional Identity & Profile:** Configure Organization Name, Affiliation Code, Tagline, Official Website, Email, Phone, and Headquarters Address.
+  - **Top Master Header Organization Pill:** Displays live organization logo, organization name, and active branch workspace with one-click access to settings.
+  - **Brand Assets & Digital Signature Manager:** Local file uploaders (converts to base64 Data URL) and direct URL inputs for institutional logos and authorized signatory signatures with instant preview and fallback reset.
+  - **Multi-Tenant Workspaces & Campus Branches:** Built-in branch registry supporting multiple campuses or hospital units with 1-click branch switching (`Activate`) and new workspace provisioning.
+  - **Verification & Anti-Counterfeiting Security Domain:** Configure custom verification domain (`verificationBaseUrl`), automatically binding dynamic QR codes to `[verificationBaseUrl] + [Cardholder Identifier]` with live verification certificate integration.
+  - **Universal Asset Injection:** Dynamically injects `orgAssets: { logoUrl, signatureUrl, orgName, signatoryName, signatoryTitle }` across card previews, studio design canvas, batch PDF engine, and ZIP generator.
+  - **Full IndexedDB & .stmq Backup Sync:** Automatically persisted in IndexedDB and preserved in `.stmq` project backups.
 
 ---
 
 ## Features
 
 - **🎨 Visual ID Card Designer:** A complete workspace for designing ID cards with a visual canvas, configurable elements, templates, and preview capabilities.
+- **➕ Custom Column / Field Creator:** Dynamically create custom data fields (`+ Add Column`) on the fly, with automated template key generation, default value backfilling, live table sorting, and persistent IndexedDB sync.
+- **📊 Enterprise People Directory:** Export full or selected cards to formatted Excel (`.xlsx`) & CSV (`.csv`), filter by missing portraits or incomplete records, filter by class/department sub-groups, track card expiration dates, and detect duplicate ID collisions in real time.
 - **➕ Live Roster CRUD & Management:** Full inline editing ("Edit Record"), manual creation ("+ Add Record" with photo upload), individual deletion, and bulk selection deletion directly from the dashboard.
 - **🔀 Multi-Column Sorting & Smart Pagination:** 1-click column header sorting (Ascending / Descending) and customizable pagination (`10`, `25`, `50`, `100`, `All`) for smooth performance on large datasets.
 - **📥 CSV & Excel Import:** Import structured card data from `.csv`, `.xlsx`, and `.xls`. Imported columns can be used as dynamic fields inside templates.
@@ -305,6 +307,10 @@ Your application remains responsible for compliance with applicable privacy and
 | `sampleRecords` | `object` | Default data | Records used to populate the dashboard |
 | `categories` | `object` | Default config | Custom ID-card categories |
 | `onBatchExportComplete` | `function` | `undefined` | Callback after batch PDF generation |
+| `organization` | `object` | `DEFAULT_ORGANIZATION` | Institution profile (Name, Code, Logo, Signatory, Signature, Verification Base URL) |
+| `onSaveOrganization` | `function` | `undefined` | Callback when organization profile or brand assets are updated |
+| `workspaces` | `array` | `DEFAULT_WORKSPACES` | List of branch workspaces/campuses (`[{ id, name, code, location }]`) |
+| `onSwitchWorkspace` | `function` | `undefined` | Callback when active branch workspace changes |
 
 ### Templates
 Designs are represented as JSON-compatible template structures.

package/dist/index.css

@@ -1512,4 +1512,23 @@ body, button, input, select, textarea {
   user-select: none !important;
   overflow: hidden;
   box-sizing: border-box;
+}
+
+/* Modal Dialog Layer */
+.pg-modal-overlay {
+  position: fixed !important;
+  inset: 0 !important;
+  background-color: rgba(11, 15, 25, 0.85) !important;
+  backdrop-filter: blur(8px) !important;
+  -webkit-backdrop-filter: blur(8px) !important;
+  z-index: 99999 !important;
+  display: flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  padding: 1.25rem !important;
+}
+
+.pg-modal-content,
+.pg-modal-container {
+  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.7) !important;
 }