@verdocs/web-sdk-react 6.5.0-beta.29 → 6.5.0-beta.30

package/dist/components.d.ts

@@ -185,6 +185,7 @@ export declare const VerdocsDisclosureDialog: StencilReactComponent<VerdocsDiscl
 export type VerdocsDownloadDialogEvents = {
     onNext: EventName<CustomEvent<{
         action: 'document' | 'certificate' | 'zip';
+        documentId?: string;
     }>>;
     onExit: EventName<CustomEvent<any>>;
 };

package/dist/globals.css

@@ -28,6 +28,70 @@
   --signer-8-color-faded: #02f7bee6;
   --signer-9-color-faded: #ff8a65e6;
   --signer-10-color-faded: #52ff4fe6;
+
+  --verdocs-primary-purple: rgba(101, 77, 203, 1);
+}
+
+@keyframes verdocs-field-ripple-bloom {
+  0% {
+    box-shadow: 0 0 0 0 var(--verdocs-primary-purple);
+    opacity: 1;
+  }
+
+  100% {
+    box-shadow: 0 0 0 20px rgba(101, 77, 203, 0);
+    opacity: 0;
+  }
+}
+
+verdocs-field-attachment,
+verdocs-field-checkbox,
+verdocs-field-date,
+verdocs-field-dropdown,
+verdocs-field-initial,
+verdocs-field-payment,
+verdocs-field-radio,
+verdocs-field-signature,
+verdocs-field-textarea,
+verdocs-field-textbox,
+verdocs-field-timestamp {
+  position: relative;
+}
+
+verdocs-field-attachment::after,
+verdocs-field-checkbox::after,
+verdocs-field-date::after,
+verdocs-field-dropdown::after,
+verdocs-field-initial::after,
+verdocs-field-payment::after,
+verdocs-field-radio::after,
+verdocs-field-signature::after,
+verdocs-field-textarea::after,
+verdocs-field-textbox::after,
+verdocs-field-timestamp::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+  z-index: 1001;
+  border-radius: 4px;
+}
+
+verdocs-field-attachment.focused::after,
+verdocs-field-checkbox.focused::after,
+verdocs-field-date.focused::after,
+verdocs-field-dropdown.focused::after,
+verdocs-field-initial.focused::after,
+verdocs-field-payment.focused::after,
+verdocs-field-radio.focused::after,
+verdocs-field-signature.focused::after,
+verdocs-field-textarea.focused::after,
+verdocs-field-textbox.focused::after,
+verdocs-field-timestamp.focused::after {
+  animation: verdocs-field-ripple-bloom 1.2s cubic-bezier(0, 0, 0.2, 1) forwards;
 }
 
 /* Signer Color Utility Classes */

package/dist/overrides.css

@@ -71,15 +71,31 @@
   --signer-9-color-faded: #02a2bebf;
   --signer-10-color-faded: #e57200bf;
 
-  /* Input Field Overrides */
-  verdocs-text-input input,
-  verdocs-text-input .input-element,
-  verdocs-select-input select,
-  verdocs-date-input input,
-  input.date-input {
-    border: 1px solid #d1d1d1 !important;
-    border-bottom: 1px solid #616161 !important;
-    border-radius: 4px !important;
-    color: #242424 !important;
+  /* Custom Ripple Color Override Example */
+  /* Redefine the variable to change the color of the focus pulse globally */
+  /* --verdocs-primary-purple: rgba(0, 101, 255, 1); */
+}
+
+@keyframes verdocs-field-ripple-bloom {
+  0% {
+    box-shadow: 0 0 0 0 #0065ff;
+    opacity: 1;
+  }
+
+  100% {
+    box-shadow: 0 0 0 20px rgba(101, 77, 203, 0);
+    opacity: 0;
   }
-}
+}
+
+/* Input Field Overrides (Un-nested for pure CSS compatibility) */
+.verdocs-custom-theme verdocs-text-input input,
+.verdocs-custom-theme verdocs-text-input .input-element,
+.verdocs-custom-theme verdocs-select-input select,
+.verdocs-custom-theme verdocs-date-input input,
+.verdocs-custom-theme input.date-input {
+  border: 1px solid #d1d1d1 !important;
+  border-bottom: 1px solid #616161 !important;
+  border-radius: 4px !important;
+  color: #242424 !important;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@verdocs/web-sdk-react",
-  "version": "6.5.0-beta.29",
+  "version": "6.5.0-beta.30",
   "description": "Verdocs Web SDK for React",
   "license": "MIT",
   "main": "./dist/index.js",
@@ -19,7 +19,7 @@
     "rollup": "rollup -c"
   },
   "dependencies": {
-    "@verdocs/web-sdk": "^6.5.0-beta.29",
+    "@verdocs/web-sdk": "^6.5.0-beta.30",
     "@stencil/react-output-target": "^1.2.0"
   },
   "peerDependencies": {