@verbb/formie-browser 1.0.0

package/dist/css/theme/forms/_form.css

@@ -0,0 +1,166 @@
+@layer formie-theme {
+    .formie-form {
+        display: grid;
+        gap: var(--formie-gap-form);
+    }
+
+    .formie-form-header {
+        display: grid;
+        gap: var(--formie-gap-form-header);
+    }
+
+    .formie-form-messages {
+        display: grid;
+        gap: var(--formie-gap-form-messages);
+    }
+
+    .formie-form-messages[data-formie-form-messages-bottom]:not(:empty) {
+        padding-top: var(--formie-space-4);
+    }
+
+    .formie-form-navigation {
+        display: grid;
+        gap: var(--formie-gap-form-navigation);
+    }
+
+    .formie-form-body {
+        display: grid;
+        gap: var(--formie-gap-form-body);
+    }
+
+    .formie-form-footer {
+        display: grid;
+        gap: var(--formie-gap-form-footer);
+    }
+
+    .formie-pages {
+        display: grid;
+        gap: var(--formie-gap-pages);
+    }
+
+    .formie-page {
+        display: grid;
+        gap: var(--formie-gap-page);
+    }
+
+    .formie-page-container {
+        display: grid;
+        gap: var(--formie-gap-page-container);
+    }
+
+    .formie-page-header {
+        display: grid;
+        gap: var(--formie-gap-page-header);
+    }
+
+    .formie-page-body {
+        display: grid;
+        gap: var(--formie-gap-page-body);
+    }
+
+    .formie-page-footer {
+        display: grid;
+        gap: var(--formie-gap-page-footer);
+    }
+
+    .formie-page-buttons {
+        display: grid;
+        gap: var(--formie-gap-page-buttons);
+    }
+
+    .formie-rows {
+        display: grid;
+        gap: var(--formie-gap-rows);
+    }
+
+    .formie-row {
+        display: grid;
+        gap: var(--formie-gap-row);
+        grid-template-columns: minmax(0, 1fr);
+        align-items: start;
+    }
+
+    /* Collapse row wrappers once every field inside them is hidden. */
+    .formie-row:not(:has(> [data-formie-field]:not([data-formie-conditionally-hidden], [data-formie-page-hidden], [data-formie-row-hidden], [hidden]))),
+    .formie-subfield-row:not(:has(> [data-formie-field]:not([data-formie-conditionally-hidden], [data-formie-page-hidden], [data-formie-row-hidden], [hidden]))),
+    .formie-nested-field-row:not(:has(> [data-formie-field]:not([data-formie-conditionally-hidden], [data-formie-page-hidden], [data-formie-row-hidden], [hidden]))) {
+        display: none;
+    }
+
+    @media (min-width: 40rem) {
+        .formie-row[data-formie-field-count="2"] {
+            grid-template-columns: repeat(2, minmax(0, 1fr));
+        }
+    }
+
+    @media (min-width: 56rem) {
+        .formie-row[data-formie-field-count="3"] {
+            grid-template-columns: repeat(3, minmax(0, 1fr));
+        }
+
+        .formie-row[data-formie-field-count="4"] {
+            grid-template-columns: repeat(4, minmax(0, 1fr));
+        }
+    }
+
+    .formie-errors {
+        display: grid;
+        gap: var(--formie-gap-errors);
+    }
+
+    .formie-successes {
+        display: grid;
+        gap: var(--formie-gap-errors);
+    }
+
+    .formie-field-errors {
+        display: grid;
+        gap: var(--formie-gap-field-errors);
+    }
+
+    .formie-page-tabs {
+        display: flex;
+        flex-wrap: wrap;
+        margin: 0 0 var(--formie-gap-tabs);
+        gap: 0;
+        border-bottom: var(--formie-border-width) solid var(--formie-color-border);
+        font-size: var(--formie-tab-font-size);
+    }
+
+    .formie-tab {
+        margin-bottom: calc(-1 * var(--formie-border-width));
+        color: var(--formie-color-text-muted);
+        border: var(--formie-border-width) solid transparent;
+    }
+
+    .formie-tab-link {
+        display: block;
+        padding: var(--formie-tab-padding-y) var(--formie-tab-padding-x);
+        color: inherit;
+        text-decoration: none;
+    }
+
+    .formie-tab-link:hover {
+        color: var(--formie-color-heading);
+        text-decoration: none;
+    }
+
+    .formie-tab-current {
+        color: var(--formie-color-heading);
+        background: var(--formie-color-surface);
+        border-color: var(--formie-color-border);
+        border-bottom-color: var(--formie-color-surface);
+        border-radius: var(--formie-radius-sm) var(--formie-radius-sm) 0 0;
+        font-weight: var(--formie-font-weight-medium);
+    }
+
+    .formie-tab-error {
+        color: var(--formie-color-danger);
+    }
+
+    .formie-tab-error .formie-tab-link:hover,
+    .formie-tab-error.formie-tab-current .formie-tab-link,
+    .formie-tab-error.formie-tab-current .formie-tab-link:hover {
+        color: var(--formie-color-danger);
+    }
+}

package/dist/css/theme/integrations/_payment-modal.css

@@ -0,0 +1,32 @@
+@layer formie-theme {
+
+    /* 3DS / payment challenge overlay (e.g. Opayo) */
+    .formie-modal {
+        position: fixed;
+        inset: 0;
+        z-index: 9999;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .formie-modal-backdrop {
+        position: absolute;
+        inset: 0;
+        background: rgba(0, 0, 0, 0.5);
+        cursor: pointer;
+    }
+
+    .formie-modal-content {
+        position: relative;
+        width: 100%;
+        max-width: 480px;
+        height: 400px;
+        margin: 1rem;
+        background: #fff;
+        border-radius: 0.5rem;
+        box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
+        overflow: hidden;
+        z-index: 1;
+    }
+}

package/dist/css/theme/integrations/_paypal.css

@@ -0,0 +1,10 @@
+@layer formie-theme {
+    .formie-paypal-button {
+        border: var(--formie-border-width) solid var(--formie-color-border);
+        border-radius: var(--formie-radius-sm);
+        background: var(--formie-color-surface);
+        box-sizing: border-box;
+        min-height: var(--formie-control-height);
+        padding: var(--formie-space-2);
+    }
+}

package/dist/css/theme/integrations/_payway.css

@@ -0,0 +1,10 @@
+@layer formie-theme {
+    .formie-payway-button {
+        border: var(--formie-border-width) solid var(--formie-color-border);
+        border-radius: var(--formie-radius-sm);
+        background: var(--formie-color-surface);
+        box-sizing: border-box;
+        min-height: var(--formie-control-height);
+        padding: var(--formie-space-2);
+    }
+}

package/dist/css/theme/integrations/_stripe.css

@@ -0,0 +1,24 @@
+@layer formie-theme {
+
+    /* Stripe placeholder while Payment Element SDK initializes. */
+    .formie-stripe-placeholder {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        gap: var(--formie-space-2);
+        min-height: 12rem;
+        width: 100%;
+        padding: var(--formie-space-4);
+        border: var(--formie-border-width) solid var(--formie-color-border);
+        border-radius: var(--formie-radius-sm);
+        background: var(--formie-color-surface);
+        color: var(--formie-color-text-muted);
+        text-align: center;
+        box-sizing: border-box;
+    }
+
+    .formie-stripe-placeholder[hidden] {
+        display: none;
+    }
+}

package/dist/css/theme/utilities/_accessibility.css

@@ -0,0 +1,13 @@
+@layer formie-theme {
+    .formie-sr-only {
+        position: absolute !important;
+        width: 1px;
+        height: 1px;
+        padding: 0;
+        margin: -1px;
+        overflow: hidden;
+        clip: rect(0, 0, 0, 0);
+        white-space: nowrap;
+        border: 0;
+    }
+}

package/dist/css/theme-base/_controls.css

@@ -0,0 +1,41 @@
+@layer formie-theme-base {
+    .formie-button {
+        appearance: none;
+        cursor: pointer;
+        user-select: none;
+    }
+
+    .formie-input,
+    .formie-textarea,
+    .formie-select {
+        box-sizing: border-box;
+        width: 100%;
+        padding: var(--formie-control-padding-y) var(--formie-control-padding-x);
+        font-size: var(--formie-control-font-size);
+        line-height: var(--formie-line-height-tight);
+        min-height: var(--formie-control-height);
+    }
+
+    .formie-textarea {
+        min-height: var(--formie-textarea-min-height);
+        resize: vertical;
+    }
+
+    /* Prevent Mobile Safari auto-zoom on focus for input/select controls. */
+    @supports (-webkit-touch-callout: none) {
+
+        .formie-input,
+        .formie-select {
+            font-size: 16px;
+        }
+    }
+
+    .formie-checkbox-input,
+    .formie-radio-input {
+        width: var(--formie-font-size-base);
+        height: var(--formie-font-size-base);
+        margin: calc(var(--formie-space-1) * 0.8) 0 0;
+        padding: 0;
+        flex: 0 0 auto;
+    }
+}

package/dist/css/theme-base/_primitives.css

@@ -0,0 +1,34 @@
+@layer formie-theme-base {
+    .formie-form button,
+    .formie-form input,
+    .formie-form select,
+    .formie-form optgroup,
+    .formie-form textarea,
+    .formie-form ::file-selector-button {
+        margin: 0;
+        font: inherit;
+        font-feature-settings: inherit;
+        font-variation-settings: inherit;
+        line-height: inherit;
+        letter-spacing: inherit;
+        color: inherit;
+        border-radius: 0;
+        background-color: transparent;
+        opacity: 1;
+    }
+
+    .formie-form a,
+    .formie-link,
+    .formie-address-location {
+        color: var(--formie-color-primary);
+        text-decoration: underline;
+        text-underline-offset: var(--formie-link-underline-offset);
+        transition: color 150ms ease;
+    }
+
+    .formie-form a:hover,
+    .formie-link:hover,
+    .formie-address-location:hover {
+        color: var(--formie-color-primary-hover);
+    }
+}

package/dist/index.d.ts

@@ -0,0 +1,30 @@
+export { createFormieClient } from '#core/create-formie-client';
+export { hydrateFormieModules } from '#core/hydrate-modules';
+export { formie } from '#core/formie';
+export { ModuleRegistry } from '#modules/registry';
+export { FormieValidator } from '#validation/validator';
+export { bindLegacyDomEventCompatibility } from '#compatibility/dom-adapter';
+export { bindLegacyValidatorCompatibility } from '#compatibility/validator-adapter';
+export { defineCaptchaModule, definePassiveCaptchaModule, } from '#modules/captchas/api';
+export { definePaymentModule } from '#modules/payments/api';
+export { defineAddressModule } from '#modules/address/api';
+export { getFormieTranslations, mergeFormieTranslations, setFormieTranslations, t, translate, } from '#utils/i18n';
+export { createDebug, debugLog, debugWarn, isFormieDebugEnabled, setFormieDebugEnabled, } from '#utils/debug';
+export { LEGACY_FORMIE_DOM_EVENT_BRIDGES, LEGACY_FORMIE_VALIDATOR_EVENT_BRIDGES, resolveLegacyCompatibilityOptions, } from '#compatibility/event-map';
+export { FORMIE_HTML_EVENT_NAMES, getFieldModuleEventName, getGlobalModuleLifecycleEventName, getScopedModuleLifecycleEventName, normalizeFormieEventName, toDomEventName, type ModuleLifecycleEventPhase, } from '#utils/event-names';
+export { buildFieldValueRegistry, fieldKeyToInputName, inputNameToFieldKey, normalizeFieldKey, parseFieldReference, resolveFieldReferenceFromFormData, resolveFieldReferenceLive, } from '#utils/field-references';
+export type { AddressModuleContext, AddressModuleOptions, AddressProviderModule, AddressServices, } from '#modules/address/api';
+export type { CaptchaModuleContext, CaptchaModuleOptions, CaptchaProviderModule, CaptchaServices, } from '#modules/captchas/api';
+export type { PaymentModuleContext, PaymentModuleOptions, PaymentProviderModule, PaymentServices, } from '#modules/payments/api';
+export type { FormieClient, FormEventUnsubscribe, FormieFormInstance, FormMountOptions, } from '#contracts/client';
+export type { FormieModuleHydrator, FormieModuleHydratorOptions } from '#core/hydrate-modules';
+export type { FormieApp, FormieElementTarget, FormieEvent, FormieOptions } from '#core/formie';
+export type { LegacyBridgeDisposition, LegacyCompatibilityOptions, LegacyDomEventBridge, LegacyValidatorEventBridge, ResolvedLegacyCompatibilityOptions, } from '#compatibility/event-map';
+export type { FormAction, FormMode, FormTransport, SubmitStage } from '#contracts/common';
+export type { FormieModuleDefinition, FormieModuleInstance, ModuleHookContext, ModuleMatchContext, ModuleRegistrationOptions, ModuleSetupContext, SubmitHookContext, } from '#contracts/modules';
+export type { FormRefreshTokensPayload, FormDefinitionField, FormDefinitionPage, FormDefinitionPayload, FormEndpointPayload, FormModuleManifest, FormModuleTarget, FormModuleTargetType, FormRedirect, FormSubmitResult, } from '#contracts/schema';
+export type { ThemeClassMap } from '#contracts/theme';
+export type { ValidationConfig, ValidationContext, ValidationError, ValidationInput, ValidationRuleDefinition, ValidationRules, ValidationRuleValue, } from '#validation/types';
+export type { TranslationReplacements } from '#utils/i18n';
+export type { FieldReferenceTransform, FieldValueRegistry, FieldValueRegistryEntry, ParsedFieldReference, ResolveFieldValueResult, } from '#utils/field-references';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

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