@incodetech/web 2.0.0-alpha.8 → 2.0.0-rc.0

package/dist/ae-signature/ae-signature.es.js

@@ -0,0 +1,15 @@
+import { v as e } from "../vendor-preact-D6SntenC.js";
+import { n as t } from "../electronic-signature-COYXjGdd.js";
+import { t as n } from "../incodeModule-BqCjVgEI.js";
+//#region src/modules/ae-signature/ae-signature.tsx
+var r = ({ config: n, onFinish: r, onError: i }) => /* @__PURE__ */ e(t, {
+	config: n ? {
+		...n,
+		variant: "ae"
+	} : void 0,
+	onFinish: r,
+	onError: i
+});
+n(r, "incode-ae-signature");
+//#endregion
+export { r as AeSignature };

package/dist/ae-signature/styles.css

@@ -0,0 +1,348 @@
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties {
+  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
+    *, :before, :after, ::backdrop {
+      --tw-translate-x: 0;
+      --tw-translate-y: 0;
+      --tw-translate-z: 0;
+      --tw-border-style: solid;
+    }
+  }
+}
+
+.IncodeElectronicSignature .IncodePageContent {
+  min-height: var(--spacing-0, var(--spacing-none, 0px));
+  padding-top: var(--spacing-32, var(--spacing-32, 32px));
+  justify-content: space-between;
+}
+
+.IncodeElectronicSignature .IncodePageContent:has(.IncodeElectronicSignatureUploadBody), .IncodeElectronicSignature .IncodePageContent:has(.IncodeElectronicSignatureDocViewHeader) {
+  padding-top: var(--spacing-0, var(--spacing-none, 0px));
+}
+
+.IncodeElectronicSignature .IncodePageTitleContainer {
+  max-width: 600px;
+}
+
+.IncodeElectronicSignature .IncodePageFooter {
+  padding-top: var(--spacing-16, var(--spacing-16, 16px));
+}
+
+.IncodeElectronicSignatureUploadBody {
+  min-height: var(--spacing-0, var(--spacing-none, 0px));
+  flex-direction: column;
+  flex: 1;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+  container-type: size;
+}
+
+.IncodeElectronicSignatureIllustration {
+  aspect-ratio: 1;
+  border-radius: var(--radius-full, var(--border-radius-full));
+  background-color: var(--color-surface-brand-50, var(--surface-brand-50));
+  justify-content: center;
+  align-items: center;
+  width: min(100cqw, 100cqh - 32px, 297px);
+  display: flex;
+  overflow: visible;
+}
+
+.IncodeElectronicSignatureIllustration svg {
+  --tw-translate-y: calc(3% * -1);
+  width: 80%;
+  height: auto;
+  translate: var(--tw-translate-x) var(--tw-translate-y);
+}
+
+.IncodeElectronicSignatureFileInput {
+  opacity: 0;
+  width: 1px;
+  height: 1px;
+  position: absolute;
+  overflow: hidden;
+}
+
+.IncodeElectronicSignatureReviewBody {
+  min-height: var(--spacing-0, var(--spacing-none, 0px));
+  justify-content: center;
+  align-items: center;
+  gap: var(--spacing-16, var(--spacing-16, 16px));
+  width: 100%;
+  max-width: 420px;
+  padding-inline: var(--spacing-48, var(--spacing-48, 48px));
+  flex-direction: column;
+  flex: 1;
+  margin-inline: auto;
+  display: flex;
+}
+
+.IncodeElectronicSignatureReviewCard {
+  min-height: var(--spacing-0, var(--spacing-none, 0px));
+  align-items: center;
+  gap: var(--spacing-24, var(--spacing-24, 24px));
+  border-radius: var(--radius-large, var(--border-radius-large));
+  border-style: var(--tw-border-style);
+  border-width: 1px;
+  border-color: var(--color-border-neutral-100, var(--border-neutral-100));
+  background-color: var(--color-surface-neutral-50, var(--surface-neutral-50));
+  width: 100%;
+  padding-inline: var(--spacing-24, var(--spacing-24, 24px));
+  padding-block: var(--spacing-20, var(--spacing-20, 20px));
+  flex-direction: column;
+  display: flex;
+}
+
+.IncodeElectronicSignatureDocPreview {
+  pointer-events: none;
+  aspect-ratio: 113 / 150;
+  max-height: 150px;
+  min-height: var(--spacing-0, var(--spacing-none, 0px));
+  border-style: var(--tw-border-style);
+  border-width: 1px;
+  border-color: var(--color-border-neutral-100, var(--border-neutral-100));
+  background-color: var(--color-surface-neutral-0, var(--surface-neutral-0));
+  border-radius: 6px;
+  flex: 1;
+  position: relative;
+  overflow: hidden;
+}
+
+.IncodeElectronicSignatureDocPreviewObject {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+.IncodeElectronicSignatureDocName {
+  text-align: center;
+  font-family: var(--typography-headline-family);
+  font-size: var(--typography-headline-h5-size);
+  font-weight: var(--typography-headline-h5-weight);
+  line-height: var(--typography-headline-h5-line-height);
+  letter-spacing: var(--typography-headline-h5-letter-spacing);
+  color: var(--color-text-body-primary, var(--text-body-800-primary));
+  flex-shrink: 0;
+}
+
+.IncodeElectronicSignatureEncrypted {
+  justify-content: center;
+  align-items: center;
+  gap: var(--spacing-4, var(--spacing-4, 4px));
+  padding-block: var(--spacing-8, var(--spacing-8, 8px));
+  font-family: var(--typography-body-family);
+  font-size: var(--typography-body-m-regular-size);
+  font-weight: var(--typography-body-m-regular-weight);
+  line-height: var(--typography-body-m-regular-line-height);
+  letter-spacing: var(--typography-body-m-regular-letter-spacing);
+  color: var(--color-text-body-primary, var(--text-body-800-primary));
+  display: flex;
+}
+
+.IncodeElectronicSignatureEncryptedIcon {
+  width: var(--spacing-16, var(--spacing-16, 16px));
+  height: var(--spacing-16, var(--spacing-16, 16px));
+  color: var(--color-icon-neutral-500, var(--icon-neutral-500));
+}
+
+.IncodeElectronicSignatureSigningTop {
+  flex-direction: column;
+  flex-shrink: 0;
+  align-items: center;
+  display: flex;
+}
+
+.IncodeElectronicSignatureSigningBottom {
+  min-height: var(--spacing-0, var(--spacing-none, 0px));
+  justify-content: flex-end;
+  align-items: center;
+  gap: var(--spacing-12, var(--spacing-12, 12px));
+  padding-top: var(--spacing-16, var(--spacing-16, 16px));
+  flex-direction: column;
+  flex: 1;
+  display: flex;
+}
+
+.IncodeElectronicSignatureDocContainer {
+  border-radius: var(--radius-medium, var(--border-radius-medium));
+  border-style: var(--tw-border-style);
+  border-width: 1px;
+  border-color: var(--color-border-neutral-100, var(--border-neutral-100));
+  background-color: var(--color-surface-neutral-50, var(--surface-neutral-50));
+  width: 100%;
+  max-width: 420px;
+  padding-inline: var(--spacing-24, var(--spacing-24, 24px));
+  padding-block: var(--spacing-8, var(--spacing-8, 8px));
+  flex-direction: column;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+  overflow: clip;
+}
+
+.IncodeElectronicSignatureDocRow {
+  flex-shrink: 0;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+  height: 56px;
+  display: flex;
+}
+
+.IncodeElectronicSignatureDocRowName {
+  font-family: var(--typography-button-family);
+  font-size: var(--typography-button-m-size);
+  font-weight: var(--typography-button-m-weight);
+  line-height: var(--typography-button-m-line-height);
+  letter-spacing: var(--typography-button-m-letter-spacing);
+  color: var(--color-text-body-primary, var(--text-body-800-primary));
+}
+
+.IncodeElectronicSignatureDocRowAction {
+  cursor: pointer;
+  border-style: var(--tw-border-style);
+  border-width: var(--border-width-none, var(--primitive-border-width-0));
+  --tw-border-style: none;
+  padding: var(--spacing-0, var(--spacing-none, 0px));
+  font-family: var(--typography-button-family);
+  font-size: var(--typography-button-m-underlined-size);
+  font-weight: var(--typography-button-m-underlined-weight);
+  line-height: var(--typography-button-m-underlined-line-height);
+  letter-spacing: var(--typography-button-m-underlined-letter-spacing);
+  -webkit-text-decoration-skip-ink: none;
+  text-decoration-skip-ink: none;
+  color: var(--color-text-link-default, var(--text-link-default));
+  background-color: #0000;
+  border-style: none;
+  text-decoration-line: underline;
+  text-decoration-style: solid;
+  text-decoration-thickness: auto;
+}
+
+.IncodeElectronicSignatureConsents {
+  min-height: var(--spacing-0, var(--spacing-none, 0px));
+  gap: var(--spacing-4, var(--spacing-4, 4px));
+  flex-direction: column;
+  width: 100%;
+  max-width: 420px;
+  display: flex;
+  overflow: auto;
+}
+
+.IncodeElectronicSignatureConsents .IncodeCheckbox {
+  border-radius: var(--radius-medium, var(--border-radius-medium));
+  background-color: var(--color-surface-brand-50, var(--surface-brand-50));
+  width: 100%;
+  padding-inline: var(--spacing-16, var(--spacing-16, 16px));
+  padding-block: var(--spacing-20, var(--spacing-20, 20px));
+}
+
+.IncodeElectronicSignatureConsents .IncodeCheckboxText {
+  font-family: var(--typography-checkbox-radio-family);
+  font-size: var(--typography-checkbox-radio-s-size);
+  font-weight: var(--typography-checkbox-radio-s-weight);
+  line-height: var(--typography-checkbox-radio-s-line-height);
+  letter-spacing: var(--typography-checkbox-radio-s-letter-spacing);
+}
+
+.IncodeElectronicSignatureConsents a {
+  color: var(--color-text-link-default, var(--text-link-default));
+  text-decoration-line: underline;
+}
+
+.IncodeElectronicSignatureSuccess .IncodePageContent {
+  padding-top: var(--spacing-0, var(--spacing-none, 0px));
+  justify-content: center;
+}
+
+.IncodeElectronicSignatureSuccessCenter {
+  justify-content: center;
+  align-items: center;
+  gap: var(--spacing-16, var(--spacing-16, 16px));
+  flex-direction: column;
+  flex: 1;
+  display: flex;
+}
+
+.IncodeElectronicSignatureSuccessTitle {
+  text-align: center;
+  font-family: var(--typography-headline-family);
+  font-size: var(--typography-headline-h3-size);
+  font-weight: var(--typography-headline-h3-weight);
+  line-height: var(--typography-headline-h3-line-height);
+  letter-spacing: var(--typography-headline-h3-letter-spacing);
+  color: var(--color-text-body-primary, var(--text-body-800-primary));
+}
+
+.IncodeElectronicSignatureDownloadLink {
+  text-align: center;
+  font-family: var(--typography-button-family);
+  font-size: var(--typography-button-m-size);
+  font-weight: var(--typography-button-m-weight);
+  line-height: var(--typography-button-m-line-height);
+  letter-spacing: var(--typography-button-m-letter-spacing);
+  color: var(--color-text-link-default, var(--text-link-default));
+  text-decoration-line: underline;
+}
+
+.IncodeElectronicSignatureFooter {
+  justify-content: center;
+  align-items: center;
+  gap: var(--spacing-16, var(--spacing-16, 16px));
+  flex-direction: column;
+  flex-shrink: 0;
+  align-self: center;
+  width: 100%;
+  max-width: 420px;
+  display: flex;
+}
+
+.IncodeElectronicSignatureDocViewHeader {
+  z-index: 10;
+  height: var(--page-header-height);
+  margin-top: calc(-1 * var(--page-header-height));
+  align-self: flex-start;
+  align-items: center;
+  display: flex;
+  position: relative;
+}
+
+.IncodeElectronicSignatureBackButton {
+  color: var(--color-text-body-primary, var(--text-body-800-primary));
+}
+
+.IncodeElectronicSignatureDocViewer {
+  min-height: var(--spacing-0, var(--spacing-none, 0px));
+  border-style: var(--tw-border-style);
+  border-width: var(--border-width-none, var(--primitive-border-width-0));
+  --tw-border-style: none;
+  border-style: none;
+  flex: 1;
+  width: 100%;
+}
+
+@property --tw-translate-x {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+
+@property --tw-translate-y {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+
+@property --tw-translate-z {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+
+@property --tw-border-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}

package/dist/ae-signature/styles2.css

@@ -0,0 +1,107 @@
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties {
+  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
+    *, :before, :after, ::backdrop {
+      --tw-border-style: solid;
+      --tw-translate-x: 0;
+      --tw-translate-y: 0;
+      --tw-translate-z: 0;
+    }
+  }
+}
+
+.IncodeSignature .IncodeSignatureContent {
+  width: 100%;
+  height: 100%;
+  padding-top: var(--spacing-32, var(--spacing-32, 32px));
+  flex-direction: column;
+  flex: 1;
+  display: flex;
+}
+
+.IncodeSignature .IncodeSignatureButtonContainer {
+  margin-block: var(--spacing-16, var(--spacing-16, 16px));
+}
+
+.IncodeSignature.IncodeSignatureFadeIn {
+  animation: fadeIn var(--motion-fade-in-duration, .7s) ease-out;
+  animation-fill-mode: both;
+}
+
+.IncodeSignature .IncodeSignatureButtonContainer .IncodeButton.IncodeButtonPrimary {
+  transition: background-color .35s ease-out, color .35s ease-out, border-color .35s ease-out, opacity .35s ease-out, box-shadow .35s ease-out;
+}
+
+.IncodeSignature .SignatureCanvasContainer {
+  width: 100%;
+  padding-inline: var(--spacing-16, var(--spacing-16, 16px));
+  padding-block: var(--spacing-8, var(--spacing-8, 8px));
+  border-radius: var(--radius-small, var(--border-radius-small));
+  border-style: var(--tw-border-style);
+  border-width: 1px;
+  border-color: var(--color-input-border-default, var(--input-border-default));
+  background-color: var(--color-input-surface-default, var(--input-surface-default));
+  height: var(--signature-canvas-height);
+  max-width: var(--signature-canvas-max-width);
+  align-self: center;
+  position: relative;
+}
+
+.IncodeSignature .SignatureCanvas {
+  width: 100%;
+  height: 100%;
+  padding-block: var(--spacing-8, var(--spacing-8, 8px));
+}
+
+.IncodeSignature .SignatureCanvasPlaceholder {
+  font-family: var(--typography-input-dropdown-family);
+  font-size: var(--typography-input-dropdown-m-size);
+  font-weight: var(--typography-input-dropdown-m-weight);
+  line-height: var(--typography-input-dropdown-m-line-height);
+  letter-spacing: var(--typography-input-dropdown-m-letter-spacing);
+  color: var(--color-input-text-field-placeholder, var(--input-text-field-placeholder));
+  --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
+  --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
+  translate: var(--tw-translate-x) var(--tw-translate-y);
+  pointer-events: none;
+  text-align: center;
+  -webkit-user-select: none;
+  user-select: none;
+  width: 100%;
+  animation: fadeIn var(--motion-fade-in-duration, .7s) ease-out;
+  animation-fill-mode: both;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+}
+
+.IncodeSignature .IncodeSignatureSuccess {
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+@property --tw-border-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
+
+@property --tw-translate-x {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+
+@property --tw-translate-y {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
+
+@property --tw-translate-z {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}